@feedmepos/mf-media 1.0.1 → 1.0.2-dev.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2,8 +2,8 @@ import { defineComponent as V, computed as S, resolveComponent as E, openBlock a
2
2
  import { defineStore as de, storeToRefs as ce } from "pinia";
3
3
  import { useI18n as L, useCoreStore as ue } from "@feedmepos/mf-common";
4
4
  import { useDialog as me, useSnackbar as fe } from "@feedmepos/ui-library";
5
- import { i as W, u as pe, p as ve, j as xe } from "./media-picker-fdce9066.js";
6
- const ge = { class: "rounded-xl border border-fm-color-neutral-gray-200 bg-white overflow-hidden" }, ye = ["src", "alt"], be = {
5
+ import { i as W, j as pe, k as ve, y as xe } from "./media-picker-1cd70533.js";
6
+ const ye = { class: "rounded-xl border border-fm-color-neutral-gray-200 bg-white overflow-hidden" }, ge = ["src", "alt"], be = {
7
7
  key: 1,
8
8
  class: "absolute inset-0 flex flex-col items-center justify-center gap-4 p-12 text-center"
9
9
  }, he = { class: "text-xs font-semibold" }, _e = { class: "text-xs text-fm-color-typo-secondary line-clamp-3" }, $e = {
@@ -27,12 +27,12 @@ const ge = { class: "rounded-xl border border-fm-color-neutral-gray-200 bg-white
27
27
  },
28
28
  emits: ["preview", "variant", "discard", "save"],
29
29
  setup(e, { emit: x }) {
30
- const t = e, l = x, { t: r } = L(), v = S(() => t.item.status === "success" && !!t.item.url), g = S(() => t.item.status === "failed"), w = S(() => t.ratio.replace("x", " / ")), n = S(
30
+ const t = e, l = x, { t: r } = L(), v = S(() => t.item.status === "success" && !!t.item.url), y = S(() => t.item.status === "failed"), w = S(() => t.ratio.replace("x", " / ")), n = S(
31
31
  () => t.item.width && t.item.height ? `${t.item.width}×${t.item.height}` : ""
32
32
  );
33
33
  return ($, b) => {
34
34
  const C = E("FmIcon"), T = E("FmCircularProgress"), F = E("FmButton");
35
- return m(), h("div", ge, [
35
+ return m(), h("div", ye, [
36
36
  s("div", {
37
37
  class: "relative bg-fm-color-neutral-gray-100",
38
38
  style: ee({ aspectRatio: w.value })
@@ -42,7 +42,7 @@ const ge = { class: "rounded-xl border border-fm-color-neutral-gray-200 bg-white
42
42
  src: e.item.url,
43
43
  class: "w-full h-full object-cover",
44
44
  alt: n.value
45
- }, null, 8, ye)) : g.value ? (m(), h("div", be, [
45
+ }, null, 8, ge)) : y.value ? (m(), h("div", be, [
46
46
  k(C, {
47
47
  name: "error_outline",
48
48
  size: "md"
@@ -99,7 +99,7 @@ const ge = { class: "rounded-xl border border-fm-color-neutral-gray-200 bg-white
99
99
  disabled: e.item.saved,
100
100
  onClick: b[3] || (b[3] = (f) => l("save"))
101
101
  }, null, 8, ["label", "disabled"])
102
- ])) : g.value ? (m(), h("div", Ee, [
102
+ ])) : y.value ? (m(), h("div", Ee, [
103
103
  k(F, {
104
104
  label: a(r)("media.studio.retry"),
105
105
  variant: "tertiary",
@@ -122,7 +122,7 @@ const ge = { class: "rounded-xl border border-fm-color-neutral-gray-200 bg-white
122
122
  setup(e, { emit: x }) {
123
123
  const t = e, l = x, { t: r } = L(), v = S(
124
124
  () => t.batch.items.some((n) => n.status === "pending" || n.status === "processing")
125
- ), g = S(
125
+ ), y = S(
126
126
  () => !!(t.batch.params.refAssetId || t.batch.params.refTmpToken)
127
127
  ), w = S(() => {
128
128
  const n = {
@@ -130,7 +130,7 @@ const ge = { class: "rounded-xl border border-fm-color-neutral-gray-200 bg-white
130
130
  ratio: t.batch.params.ratio,
131
131
  count: t.batch.items.length
132
132
  };
133
- return g.value ? r("media.studio.batchMetaRef", { ...n, strength: t.batch.params.refStrength ?? 55 }) : r("media.studio.batchMeta", n);
133
+ return y.value ? r("media.studio.batchMetaRef", { ...n, strength: t.batch.params.refStrength ?? 55 }) : r("media.studio.batchMeta", n);
134
134
  });
135
135
  return (n, $) => {
136
136
  const b = E("FmCircularProgress"), C = E("FmButton");
@@ -157,7 +157,7 @@ const ge = { class: "rounded-xl border border-fm-color-neutral-gray-200 bg-white
157
157
  key: T.taskId,
158
158
  item: T,
159
159
  ratio: e.batch.params.ratio,
160
- "from-ref": g.value,
160
+ "from-ref": y.value,
161
161
  onPreview: (F) => l("preview", T),
162
162
  onVariant: $[1] || ($[1] = (F) => l("variant")),
163
163
  onDiscard: (F) => l("discard", T),
@@ -207,7 +207,7 @@ async function Ye(e, x) {
207
207
  const Ke = { 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" }, We = { class: "flex flex-col gap-8" }, Je = { class: "flex items-baseline gap-8" }, Qe = { class: "text-sm font-semibold" }, Xe = { 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 = {
208
208
  key: 0,
209
209
  class: "flex items-center gap-8 px-8 py-8 rounded-lg bg-[#FFF7F0]"
210
- }, 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__ */ V({
210
+ }, 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" }, yt = { class: "flex gap-8" }, gt = ["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__ */ V({
211
211
  __name: "StudioControls",
212
212
  props: /* @__PURE__ */ H({
213
213
  busy: { type: Boolean },
@@ -224,7 +224,7 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
224
224
  }),
225
225
  emits: /* @__PURE__ */ H(["generate"], ["update:prompt", "update:style", "update:ratio", "update:count"]),
226
226
  setup(e, { emit: x }) {
227
- 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 = {
227
+ const t = e, l = q(e, "prompt"), r = q(e, "style"), v = q(e, "ratio"), y = q(e, "count"), w = x, { t: n } = L(), $ = ["hero", "banner", "social", "menu"], b = {
228
228
  hero: "restaurant",
229
229
  banner: "campaign",
230
230
  social: "photo_camera",
@@ -240,13 +240,13 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
240
240
  ), T = S(
241
241
  () => {
242
242
  var o;
243
- return (o = C.value.find((y) => y.prompt === l.value)) == null ? void 0 : o.key;
243
+ return (o = C.value.find((g) => g.prompt === l.value)) == null ? void 0 : o.key;
244
244
  }
245
245
  ), F = S(() => /\[[^\]]+\]/.test(l.value)), f = S(() => l.value.trim().length > 0 && !t.busy);
246
246
  function i(o) {
247
247
  return o ? _t : $t;
248
248
  }
249
- return (o, y) => {
249
+ return (o, g) => {
250
250
  const _ = E("FmIcon"), z = E("FmTextarea"), O = E("FmChip"), Y = E("FmButton");
251
251
  return m(), h("div", Ke, [
252
252
  s("div", We, [
@@ -275,7 +275,7 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
275
275
  s("div", at, [
276
276
  k(z, {
277
277
  modelValue: l.value,
278
- "onUpdate:modelValue": y[0] || (y[0] = (d) => l.value = d),
278
+ "onUpdate:modelValue": g[0] || (g[0] = (d) => l.value = d),
279
279
  label: a(n)("media.studio.prompt"),
280
280
  placeholder: e.hasRef ? a(n)("media.studio.promptPlaceholderRef") : a(n)("media.studio.promptPlaceholder"),
281
281
  "max-length": 500,
@@ -319,13 +319,13 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
319
319
  ]),
320
320
  s("div", vt, [
321
321
  s("span", xt, u(a(n)("media.studio.count")), 1),
322
- s("div", gt, [
322
+ s("div", yt, [
323
323
  (m(!0), h(D, null, N(a(Le), (d) => (m(), h("button", {
324
324
  key: d,
325
325
  type: "button",
326
- class: j(["flex-1 h-40 rounded-lg border text-sm font-semibold", i(g.value === d)]),
327
- onClick: (M) => g.value = d
328
- }, " × " + u(d), 11, yt))), 128))
326
+ class: j(["flex-1 h-40 rounded-lg border text-sm font-semibold", i(y.value === d)]),
327
+ onClick: (M) => y.value = d
328
+ }, " × " + u(d), 11, gt))), 128))
329
329
  ])
330
330
  ]),
331
331
  s("div", bt, [
@@ -335,7 +335,7 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
335
335
  variant: "primary",
336
336
  size: "md",
337
337
  disabled: !f.value,
338
- onClick: y[1] || (y[1] = (d) => w("generate"))
338
+ onClick: g[1] || (g[1] = (d) => w("generate"))
339
339
  }, null, 8, ["label", "disabled"]),
340
340
  s("span", ht, u(a(n)("media.studio.disclaimer")), 1)
341
341
  ])
@@ -354,7 +354,7 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
354
354
  emits: ["close", "save", "variant"],
355
355
  setup(e, { emit: x }) {
356
356
  const t = e, l = x, { t: r } = L();
357
- return (v, g) => {
357
+ return (v, y) => {
358
358
  const w = E("FmIcon"), n = E("FmButton"), $ = E("FmDialog");
359
359
  return m(), G($, {
360
360
  "model-value": !!t.item,
@@ -362,7 +362,7 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
362
362
  "max-height": "560px",
363
363
  "content-class": "!p-0 studio-preview-dialog-content",
364
364
  "close-button": !1,
365
- "onUpdate:modelValue": g[3] || (g[3] = (b) => !b && l("close"))
365
+ "onUpdate:modelValue": y[3] || (y[3] = (b) => !b && l("close"))
366
366
  }, {
367
367
  default: te(() => [
368
368
  t.item ? (m(), h("div", It, [
@@ -380,7 +380,7 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
380
380
  type: "button",
381
381
  class: "w-32 h-32 rounded-lg bg-fm-color-neutral-gray-100 flex items-center justify-center flex-shrink-0",
382
382
  title: a(r)("media.library.cancelButton"),
383
- onClick: g[0] || (g[0] = (b) => l("close"))
383
+ onClick: y[0] || (y[0] = (b) => l("close"))
384
384
  }, [
385
385
  k(w, {
386
386
  name: "close",
@@ -390,19 +390,19 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
390
390
  ]),
391
391
  s("span", Et, u(t.prompt), 1),
392
392
  s("span", Bt, u(t.item.width) + "×" + u(t.item.height), 1),
393
- g[4] || (g[4] = s("div", { class: "flex-1" }, null, -1)),
393
+ y[4] || (y[4] = s("div", { class: "flex-1" }, null, -1)),
394
394
  k(n, {
395
395
  label: a(r)("media.studio.variant"),
396
396
  variant: "tertiary",
397
397
  size: "md",
398
- onClick: g[1] || (g[1] = (b) => l("variant"))
398
+ onClick: y[1] || (y[1] = (b) => l("variant"))
399
399
  }, null, 8, ["label"]),
400
400
  k(n, {
401
401
  label: t.item.saved ? a(r)("media.studio.saved") : a(r)("media.studio.save"),
402
402
  variant: "primary",
403
403
  size: "md",
404
404
  disabled: t.item.saved,
405
- onClick: g[2] || (g[2] = (b) => l("save"))
405
+ onClick: y[2] || (y[2] = (b) => l("save"))
406
406
  }, null, 8, ["label", "disabled"])
407
407
  ])
408
408
  ])) : U("", !0)
@@ -431,9 +431,9 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
431
431
  }),
432
432
  emits: /* @__PURE__ */ H(["change"], ["update:strength"]),
433
433
  setup(e, { emit: x }) {
434
- 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 = S(() => l.value <= 35 ? v("media.studio.refWeak") : l.value >= 70 ? v("media.studio.refStrong") : v("media.studio.refMid"));
434
+ const t = e, l = q(e, "strength"), r = x, { t: v } = L(), y = B(!1), w = B(!1), n = B(""), $ = B(null), b = B(null), C = S(() => l.value <= 35 ? v("media.studio.refWeak") : l.value >= 70 ? v("media.studio.refStrong") : v("media.studio.refMid"));
435
435
  function T(i) {
436
- g.value = !1, n.value = "", $.value = { url: i.url, label: i.asset.fileName }, r("change", {
436
+ y.value = !1, n.value = "", $.value = { url: i.url, label: i.asset.fileName }, r("change", {
437
437
  refAssetId: i.asset.id,
438
438
  // null means the original was picked, and the request omits refRatio for that.
439
439
  refRatio: i.ratio ?? void 0,
@@ -441,8 +441,8 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
441
441
  });
442
442
  }
443
443
  async function F(i) {
444
- var y;
445
- const o = (y = i.target.files) == null ? void 0 : y[0];
444
+ var g;
445
+ const o = (g = i.target.files) == null ? void 0 : g[0];
446
446
  if (o) {
447
447
  w.value = !0, n.value = "";
448
448
  try {
@@ -462,7 +462,7 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
462
462
  $.value = null, n.value = "", r("change", null);
463
463
  }
464
464
  return (i, o) => {
465
- const y = E("FmButton");
465
+ const g = E("FmButton");
466
466
  return m(), h("div", Pt, [
467
467
  s("div", Ut, [
468
468
  s("span", Ot, u(a(v)("media.studio.ref")), 1),
@@ -476,7 +476,7 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
476
476
  alt: ""
477
477
  }, null, 8, Mt)) : U("", !0),
478
478
  s("span", Nt, u($.value.label), 1),
479
- k(y, {
479
+ k(g, {
480
480
  label: a(v)("media.studio.refClear"),
481
481
  variant: "tertiary",
482
482
  size: "md",
@@ -484,14 +484,14 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
484
484
  }, null, 8, ["label"])
485
485
  ])) : (m(), h(D, { key: 1 }, [
486
486
  s("div", jt, [
487
- k(y, {
487
+ k(g, {
488
488
  label: a(v)("media.studio.refPick"),
489
489
  variant: "tertiary",
490
490
  size: "md",
491
491
  class: "flex-1",
492
- onClick: o[0] || (o[0] = (_) => g.value = !0)
492
+ onClick: o[0] || (o[0] = (_) => y.value = !0)
493
493
  }, null, 8, ["label"]),
494
- k(y, {
494
+ k(g, {
495
495
  label: a(v)("media.studio.refUpload"),
496
496
  variant: "tertiary",
497
497
  size: "md",
@@ -538,8 +538,8 @@ const Ke = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p
538
538
  s("span", Kt, u(C.value), 1)
539
539
  ])) : U("", !0),
540
540
  k(a(pe), {
541
- open: g.value,
542
- "onUpdate:open": o[3] || (o[3] = (_) => g.value = _),
541
+ open: y.value,
542
+ "onUpdate:open": o[3] || (o[3] = (_) => y.value = _),
543
543
  "business-id": e.businessId,
544
544
  "restaurant-id": e.restaurantId,
545
545
  "allow-upload": !1,
@@ -580,7 +580,7 @@ const ts = 3e3, ss = de("mediaGeneration", () => {
580
580
  const e = B([]), x = S(() => e.value.some((f) => Z(f.items)));
581
581
  let t, l = "";
582
582
  function r(f, i) {
583
- const o = e.value.find((y) => y.batchId === f);
583
+ const o = e.value.find((g) => g.batchId === f);
584
584
  o && (o.items = Zt(o.items, i));
585
585
  }
586
586
  function v() {
@@ -596,37 +596,37 @@ const ts = 3e3, ss = de("mediaGeneration", () => {
596
596
  x.value && v();
597
597
  }, ts));
598
598
  }
599
- async function g(f, i) {
599
+ async function y(f, i) {
600
600
  l = f;
601
601
  const o = await qe(f, es(i));
602
602
  e.value.unshift({
603
603
  batchId: o.batchId,
604
604
  params: i,
605
- items: o.items.map((y) => ({
606
- taskId: y.taskId,
607
- assetId: y.assetId,
608
- imageId: y.imageId,
609
- status: y.status,
605
+ items: o.items.map((g) => ({
606
+ taskId: g.taskId,
607
+ assetId: g.assetId,
608
+ imageId: g.imageId,
609
+ status: g.status,
610
610
  attempts: 0,
611
- error: y.error,
611
+ error: g.error,
612
612
  saved: !1
613
613
  }))
614
614
  }), v();
615
615
  }
616
616
  async function w(f, i) {
617
- await g(f, i);
617
+ await y(f, i);
618
618
  }
619
619
  async function n(f, i) {
620
- await g(f, { ...i.params });
620
+ await y(f, { ...i.params });
621
621
  }
622
622
  async function $(f, i) {
623
- await g(f, { ...i.params, count: 1 });
623
+ await y(f, { ...i.params, count: 1 });
624
624
  }
625
625
  async function b(f, i, o) {
626
626
  var _;
627
627
  await ve(f, o.assetId, [Qt]);
628
- const y = (_ = e.value.find((z) => z.batchId === i.batchId)) == null ? void 0 : _.items.find((z) => z.taskId === o.taskId);
629
- y && (y.saved = !0);
628
+ const g = (_ = e.value.find((z) => z.batchId === i.batchId)) == null ? void 0 : _.items.find((z) => z.taskId === o.taskId);
629
+ g && (g.saved = !0);
630
630
  }
631
631
  async function C(f, i, o) {
632
632
  await xe(f, [
@@ -637,8 +637,8 @@ const ts = 3e3, ss = de("mediaGeneration", () => {
637
637
  aspectRatios: null
638
638
  }
639
639
  ]);
640
- const y = e.value.find((_) => _.batchId === i.batchId);
641
- y && (y.items = y.items.filter((_) => _.taskId !== o.taskId), y.items.length === 0 && (e.value = e.value.filter((_) => _.batchId !== i.batchId)));
640
+ const g = e.value.find((_) => _.batchId === i.batchId);
641
+ g && (g.items = g.items.filter((_) => _.taskId !== o.taskId), g.items.length === 0 && (e.value = e.value.filter((_) => _.batchId !== i.batchId)));
642
642
  }
643
643
  function T(f) {
644
644
  l = f, x.value && v();
@@ -656,13 +656,13 @@ const ts = 3e3, ss = de("mediaGeneration", () => {
656
656
  const x = ue(), { t } = L(), l = me(), r = fe(), v = S(() => {
657
657
  var p;
658
658
  return ((p = x.currentBusiness.value) == null ? void 0 : p.id) ?? "";
659
- }), g = S(() => {
659
+ }), y = S(() => {
660
660
  var p;
661
661
  return (p = x.currentRestaurant.value) == null ? void 0 : p._id;
662
662
  }), w = ss(), { batches: n, busy: $ } = ce(w);
663
663
  re(() => w.resume(v.value));
664
664
  const b = B(""), C = B("photo"), T = B("1x1"), F = B(2), f = B(55), i = B(null), o = S(() => !!i.value);
665
- function y() {
665
+ function g() {
666
666
  var p, c, R, P;
667
667
  return {
668
668
  prompt: b.value,
@@ -674,7 +674,7 @@ const ts = 3e3, ss = de("mediaGeneration", () => {
674
674
  refTmpToken: (R = i.value) == null ? void 0 : R.refTmpToken,
675
675
  refStrength: i.value ? f.value : void 0,
676
676
  refLabel: (P = i.value) == null ? void 0 : P.label,
677
- restaurantId: g.value
677
+ restaurantId: y.value
678
678
  };
679
679
  }
680
680
  function _(p) {
@@ -691,7 +691,7 @@ const ts = 3e3, ss = de("mediaGeneration", () => {
691
691
  }
692
692
  async function Y() {
693
693
  try {
694
- await w.compose(v.value, y());
694
+ await w.compose(v.value, g());
695
695
  } catch (p) {
696
696
  O(p);
697
697
  }
@@ -757,7 +757,7 @@ const ts = 3e3, ss = de("mediaGeneration", () => {
757
757
  strength: f.value,
758
758
  "onUpdate:strength": c[0] || (c[0] = (I) => f.value = I),
759
759
  "business-id": v.value,
760
- "restaurant-id": g.value,
760
+ "restaurant-id": y.value,
761
761
  onChange: c[1] || (c[1] = (I) => i.value = I)
762
762
  }, null, 8, ["strength", "business-id", "restaurant-id"])
763
763
  ]),
@@ -0,0 +1,301 @@
1
+ import { defineComponent as be, computed as g, ref as s, onMounted as ge, watch as M, resolveComponent as B, openBlock as y, createElementBlock as I, createElementVNode as c, toDisplayString as C, unref as t, createVNode as i, createBlock as $, createCommentVNode as D, withCtx as j } from "vue";
2
+ import { useCoreStore as we, useI18n as he } from "@feedmepos/mf-common";
3
+ import { useDialog as xe } from "@feedmepos/ui-library";
4
+ import { a as _e, F as Be, b as Ce, h as Ve, m as G, g as Te, t as ke, d as Se, U as Ie, c as De, f as Re, r as Fe, E as ze, e as ee, p as Pe } from "./media-picker-1cd70533.js";
5
+ const Ae = { class: "p-24 relative min-h-full" }, Ue = { class: "flex items-center justify-between mb-8" }, Oe = { class: "fm-typo-en-title-md-600 fm-step-title line-clamp-2" }, Ne = { class: "flex gap-8" }, Ee = { class: "flex flex-col gap-12 mb-16" }, Me = { class: "flex gap-12" }, $e = { class: "flex items-center gap-12" }, je = { class: "flex-1 text-xs text-fm-color-typo-secondary" }, Ge = {
6
+ key: 0,
7
+ class: "text-fm-color-typo-primary font-semibold"
8
+ }, Le = { key: 1 }, qe = {
9
+ key: 0,
10
+ class: "fixed bottom-24 left-1/2 -translate-x-1/2 flex items-center gap-12 bg-white border rounded-lg shadow-lg px-16 py-8 z-30"
11
+ }, He = { class: "text-sm font-semibold" }, Je = { class: "flex justify-end gap-8 w-full" }, Ze = /* @__PURE__ */ be({
12
+ __name: "AssetLibrary",
13
+ setup(Ke) {
14
+ const R = we(), { t: l } = he(), d = g(() => {
15
+ var e;
16
+ return ((e = R.currentBusiness.value) == null ? void 0 : e.id) ?? "";
17
+ }), ae = g(() => {
18
+ var e;
19
+ return (e = R.currentRestaurant.value) == null ? void 0 : e._id;
20
+ }), V = xe(), T = s(""), w = s([]), h = s(void 0), L = g(
21
+ () => (R.restaurants.value ?? []).map((e) => ({ label: e.profile.name, value: e._id }))
22
+ ), k = s(void 0), q = s([]), H = g(() => q.value.map((e) => ({ label: e, value: e }))), b = s([]), x = s([]), F = s(!1), m = s(1), z = s(0), P = s(0), A = s(!1), J = s("recent"), le = {
23
+ recent: { sortBy: "createdAt", descending: !0 },
24
+ name: { sortBy: "fileName", descending: !1 },
25
+ size: { sortBy: "fileSizeBytes", descending: !0 }
26
+ }, K = [{ icon: "grid_view" }, { icon: "view_list" }], U = s(K[0]), te = g(() => U.value.icon === "grid_view" ? "grid" : "list"), O = _e(() => d.value);
27
+ async function p() {
28
+ if (d.value) {
29
+ b.value.length === 0 && (F.value = !0), A.value = !0;
30
+ try {
31
+ const [e, a, u] = await Promise.all([
32
+ Se({
33
+ businessId: d.value,
34
+ restaurantId: h.value,
35
+ refType: k.value,
36
+ search: T.value || void 0,
37
+ tags: w.value.length ? w.value : void 0,
38
+ // AI-composed images are assets from the moment their bytes land — they have to be, or
39
+ // their URL could not render — so the library hides them until "save to the asset
40
+ // centre" removes this tag.
41
+ excludeTags: [Ie],
42
+ skip: De(m.value, G),
43
+ limit: G,
44
+ ...le[J.value]
45
+ }),
46
+ Re(d.value),
47
+ // Caught rather than left to reject the whole Promise.all: this endpoint is new, and
48
+ // a backend that hasn't deployed it yet must not be able to take the asset list down
49
+ // with it — the refType dropdown just stays empty (see the v-if on refTypeOptions)
50
+ // until the backend catches up.
51
+ Fe(d.value, h.value).catch(() => [])
52
+ ]);
53
+ b.value = e.resources, z.value = e.meta.totalResources, P.value = e.meta.totalPages, x.value = a, q.value = u, await O.load(
54
+ e.resources.filter((r) => !ze(r)).filter((r) => !!r.refId && !!r.refType).map((r) => ({ refType: r.refType, refId: r.refId }))
55
+ );
56
+ } finally {
57
+ F.value = !1, A.value = !1;
58
+ }
59
+ }
60
+ }
61
+ async function N() {
62
+ m.value = 1, S(), await p();
63
+ }
64
+ async function E() {
65
+ await p();
66
+ const e = Pe(m.value, P.value);
67
+ e !== m.value && (m.value = e, await p());
68
+ }
69
+ async function se(e) {
70
+ e !== m.value && (m.value = e, S(), await p());
71
+ }
72
+ ge(p), M(d, N), M([w, J, h, k], N);
73
+ let Q;
74
+ M(T, () => {
75
+ clearTimeout(Q), Q = setTimeout(N, 250);
76
+ });
77
+ const o = s(/* @__PURE__ */ new Set());
78
+ function ne(e) {
79
+ const a = new Set(o.value);
80
+ a.has(e.id) ? a.delete(e.id) : a.add(e.id), o.value = a;
81
+ }
82
+ function S() {
83
+ o.value = /* @__PURE__ */ new Set();
84
+ }
85
+ function oe() {
86
+ o.value = new Set(b.value.map((e) => e.id));
87
+ }
88
+ function ie() {
89
+ const e = o.value.size;
90
+ V.open({
91
+ title: l("media.library.deleteBulkTitle"),
92
+ message: l("media.library.deleteBulkMessage", { count: e, disclaimer: l("media.library.deleteDisclaimer") }),
93
+ primaryActions: { text: l("media.library.deleteConfirmButton"), close: !1, variant: "destructive" },
94
+ secondaryActions: { text: l("media.library.cancelButton"), close: !0 }
95
+ }).onPrimary(async () => {
96
+ await Promise.all(
97
+ [...o.value].map((a) => {
98
+ const u = b.value.find((r) => r.id === a);
99
+ return u ? ee(d.value, u) : Promise.resolve();
100
+ })
101
+ ), S(), await E(), V.close();
102
+ });
103
+ }
104
+ function ue(e) {
105
+ V.open({
106
+ title: l("media.library.deleteOneTitle"),
107
+ message: l("media.library.deleteOneMessage", { fileName: e.fileName, disclaimer: l("media.library.deleteDisclaimer") }),
108
+ primaryActions: { text: l("media.library.deleteConfirmButton"), close: !1, variant: "destructive" },
109
+ secondaryActions: { text: l("media.library.cancelButton"), close: !0 }
110
+ }).onPrimary(async () => {
111
+ await ee(d.value, e);
112
+ const a = new Set(o.value);
113
+ a.delete(e.id), o.value = a, await E(), V.close();
114
+ });
115
+ }
116
+ const v = s(null), re = g(
117
+ () => {
118
+ var e;
119
+ return (e = v.value) != null && e.refId ? O.byRefId.value.get(v.value.refId) ?? null : null;
120
+ }
121
+ );
122
+ function de(e) {
123
+ v.value = e;
124
+ }
125
+ async function W() {
126
+ await p(), v.value && (v.value = b.value.find((e) => {
127
+ var a;
128
+ return e.id === ((a = v.value) == null ? void 0 : a.id);
129
+ }) ?? null);
130
+ }
131
+ async function ce() {
132
+ v.value = null, await E();
133
+ }
134
+ const _ = s(!1), f = s(null);
135
+ function ve() {
136
+ var e;
137
+ (e = f.value) == null || e.reset(), _.value = !0;
138
+ }
139
+ async function me() {
140
+ var e;
141
+ (e = f.value) != null && e.stagedCount || (_.value = !1), await p();
142
+ }
143
+ return (e, a) => {
144
+ const u = B("FmButton"), r = B("FmSearch"), X = B("FmSelect"), pe = B("FmButtonGroup"), fe = B("FmDialog");
145
+ return y(), I("div", Ae, [
146
+ c("div", Ue, [
147
+ c("h1", Oe, C(t(l)("media.title")), 1),
148
+ c("div", Ne, [
149
+ i(u, {
150
+ label: t(l)("media.library.uploadButton"),
151
+ "prepend-icon": "add",
152
+ variant: "primary",
153
+ onClick: ve
154
+ }, null, 8, ["label"])
155
+ ])
156
+ ]),
157
+ c("div", Ee, [
158
+ c("div", Me, [
159
+ i(r, {
160
+ modelValue: T.value,
161
+ "onUpdate:modelValue": a[0] || (a[0] = (n) => T.value = n),
162
+ placeholder: t(l)("media.library.searchPlaceholder"),
163
+ class: "max-w-[280px]"
164
+ }, null, 8, ["modelValue", "placeholder"]),
165
+ L.value.length ? (y(), $(X, {
166
+ key: 0,
167
+ modelValue: h.value,
168
+ "onUpdate:modelValue": a[1] || (a[1] = (n) => h.value = n),
169
+ items: L.value,
170
+ placeholder: t(l)("media.library.allRestaurantsOption"),
171
+ searchable: "",
172
+ clearable: "",
173
+ class: "max-w-[240px]"
174
+ }, null, 8, ["modelValue", "items", "placeholder"])) : D("", !0),
175
+ H.value.length ? (y(), $(X, {
176
+ key: 1,
177
+ modelValue: k.value,
178
+ "onUpdate:modelValue": a[2] || (a[2] = (n) => k.value = n),
179
+ items: H.value,
180
+ placeholder: t(l)("media.library.allRefTypesOption"),
181
+ searchable: "",
182
+ clearable: "",
183
+ class: "max-w-[240px]"
184
+ }, null, 8, ["modelValue", "items", "placeholder"])) : D("", !0)
185
+ ]),
186
+ x.value.length ? (y(), $(t(Be), {
187
+ key: 0,
188
+ modelValue: w.value,
189
+ "onUpdate:modelValue": a[3] || (a[3] = (n) => w.value = n),
190
+ tags: x.value
191
+ }, null, 8, ["modelValue", "tags"])) : D("", !0),
192
+ c("div", $e, [
193
+ c("div", je, [
194
+ o.value.size > 0 ? (y(), I("span", Ge, C(t(l)("media.library.selectedCount", { count: o.value.size })), 1)) : (y(), I("span", Le, C(t(l)("media.library.totalSummary", { count: z.value })), 1))
195
+ ]),
196
+ i(u, {
197
+ label: t(l)("media.library.selectAllButton"),
198
+ variant: "tertiary",
199
+ size: "md",
200
+ onClick: oe
201
+ }, null, 8, ["label"]),
202
+ i(pe, {
203
+ modelValue: U.value,
204
+ "onUpdate:modelValue": a[4] || (a[4] = (n) => U.value = n),
205
+ items: K
206
+ }, null, 8, ["modelValue"])
207
+ ])
208
+ ]),
209
+ i(t(Ce), {
210
+ assets: b.value,
211
+ loading: F.value,
212
+ view: te.value,
213
+ selectable: "",
214
+ "selected-ids": o.value,
215
+ "variants-by-ref-id": t(O).byRefId.value,
216
+ onOpen: de,
217
+ onToggle: ne,
218
+ onDelete: ue
219
+ }, null, 8, ["assets", "loading", "view", "selected-ids", "variants-by-ref-id"]),
220
+ i(t(Ve), {
221
+ page: m.value,
222
+ "page-size": t(G),
223
+ "total-resources": z.value,
224
+ "total-pages": P.value,
225
+ disabled: A.value,
226
+ "onUpdate:page": se
227
+ }, null, 8, ["page", "page-size", "total-resources", "total-pages", "disabled"]),
228
+ o.value.size > 0 ? (y(), I("div", qe, [
229
+ c("span", He, C(t(l)("media.library.selectedCount", { count: o.value.size })), 1),
230
+ i(u, {
231
+ label: t(l)("media.library.cancelButton"),
232
+ variant: "tertiary",
233
+ size: "md",
234
+ onClick: S
235
+ }, null, 8, ["label"]),
236
+ i(u, {
237
+ label: t(l)("media.library.deleteSelectedButton"),
238
+ variant: "destructive",
239
+ size: "md",
240
+ "prepend-icon": "delete",
241
+ onClick: ie
242
+ }, null, 8, ["label"])
243
+ ])) : D("", !0),
244
+ i(t(Te), {
245
+ asset: v.value,
246
+ image: re.value,
247
+ "business-id": d.value,
248
+ onClose: a[5] || (a[5] = (n) => v.value = null),
249
+ onRenamed: W,
250
+ onDeleted: ce,
251
+ onChanged: W
252
+ }, null, 8, ["asset", "image", "business-id"]),
253
+ i(fe, {
254
+ modelValue: _.value,
255
+ "onUpdate:modelValue": a[9] || (a[9] = (n) => _.value = n),
256
+ "max-width": 480
257
+ }, {
258
+ "dialog-header": j(() => [
259
+ c("div", null, C(t(l)("media.library.uploadDialogTitle")), 1)
260
+ ]),
261
+ "dialog-footer": j(() => {
262
+ var n, Y;
263
+ return [
264
+ c("div", Je, [
265
+ i(u, {
266
+ label: t(l)("media.library.cancelButton"),
267
+ variant: "tertiary",
268
+ onClick: a[7] || (a[7] = (ye) => _.value = !1)
269
+ }, null, 8, ["label"]),
270
+ i(u, {
271
+ label: t(l)("media.library.uploadSubmitButton", { count: ((n = f.value) == null ? void 0 : n.stagedCount) ?? 0 }),
272
+ variant: "primary",
273
+ disabled: !((Y = f.value) != null && Y.stagedCount) || f.value.uploading,
274
+ onClick: a[8] || (a[8] = (ye) => {
275
+ var Z;
276
+ return (Z = f.value) == null ? void 0 : Z.upload();
277
+ })
278
+ }, null, 8, ["label", "disabled"])
279
+ ])
280
+ ];
281
+ }),
282
+ default: j(() => [
283
+ i(t(ke), {
284
+ ref_key: "uploadPanelRef",
285
+ ref: f,
286
+ "business-id": d.value,
287
+ "restaurant-id": ae.value,
288
+ "available-tags": x.value,
289
+ onTagCreated: a[6] || (a[6] = (n) => x.value.push(n)),
290
+ onUploaded: me
291
+ }, null, 8, ["business-id", "restaurant-id", "available-tags"])
292
+ ]),
293
+ _: 1
294
+ }, 8, ["modelValue"])
295
+ ]);
296
+ };
297
+ }
298
+ });
299
+ export {
300
+ Ze as default
301
+ };