@feedmepos/mf-connect 0.1.47-prod → 0.1.49-prod

package/dist/FilterChip.vue_vue_type_script_setup_true_lang-DaU-9GzO.js

@@ -0,0 +1,129 @@
+import { defineComponent as j, ref as i, computed as g, onMounted as B, resolveComponent as r, openBlock as m, createBlock as c, unref as o, withCtx as p, createVNode as v, normalizeClass as f, createCommentVNode as k, createElementVNode as L, toDisplayString as F, isRef as M, createElementBlock as O, Fragment as A, renderList as N } from "vue";
+const z = { class: "fm-typo-en-body-md-600 select-none text-ellipsis overflow-hidden whitespace-nowrap" }, E = /* @__PURE__ */ j({
+  __name: "FilterChip",
+  props: {
+    modelValue: {
+      type: Array,
+      required: !1
+    },
+    label: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    showItemLabel: {
+      type: Boolean,
+      default: !1
+    },
+    placement: {
+      type: String,
+      required: !1,
+      default: "bottom-end"
+    },
+    class: {
+      type: String,
+      required: !1
+    },
+    disabled: {
+      type: Boolean,
+      required: !1
+    },
+    items: {
+      type: Array,
+      required: !0
+    },
+    icon: {
+      type: String,
+      required: !1
+    },
+    searchable: {
+      type: Boolean,
+      required: !1,
+      default: !0
+    }
+  },
+  emits: ["update:model-value"],
+  setup(u, { emit: C }) {
+    const t = u, b = C, d = i(!1), l = i({}), s = i(""), V = g(() => {
+      const e = Object.keys(l.value).length;
+      return !l.value || Object.keys(l.value).length == t.items.length || e === 0 ? "All" : `${e > 0 ? e : "None"} selected`;
+    });
+    function w(e) {
+      l.value[e] ? delete l.value[e] : l.value[e] = !0, b("update:model-value", Object.keys(l.value));
+    }
+    function _() {
+      Object.keys(l.value).length > 0 ? l.value = {} : l.value = t.items.reduce((e, n) => (e[n.value] = !0, e), {}), b("update:model-value", Object.keys(l.value));
+    }
+    const x = g(() => s.value && s.value.length > 0 ? t.items.filter(
+      (e) => e.label.toLowerCase().includes(s.value.trim().toLowerCase())
+    ) : t.items);
+    return B(() => {
+      l.value = t.modelValue.reduce(
+        (e, n) => (e[n] = !0, e),
+        {}
+      ), t.modelValue.length == 0;
+    }), (e, n) => {
+      const y = r("FmIcon"), q = r("FmChip"), I = r("FmTextField"), h = r("FmMenuItem"), S = r("FmMenu");
+      return m(), c(S, {
+        placement: u.placement || "bottom-end",
+        disabled: u.disabled == !0,
+        "model-value": o(d),
+        onMenuChanged: n[1] || (n[1] = (a) => d.value = a),
+        "close-on-click": !1
+      }, {
+        "menu-button": p(() => [
+          v(q, {
+            label: u.label,
+            class: f(t.class || "text-fm-color-neutral-gray-400 cursor-pointer")
+          }, {
+            default: p(() => [
+              t.icon ? (m(), c(y, {
+                key: 0,
+                name: t.icon,
+                class: f(t.class),
+                outline: "",
+                size: "sm"
+              }, null, 8, ["name", "class"])) : k("", !0),
+              L("div", z, F(t.label) + " " + F(u.showItemLabel ? o(V) : ""), 1),
+              v(y, {
+                name: o(d) ? "keyboard_arrow_up" : "keyboard_arrow_down",
+                class: f(t.class),
+                outline: "",
+                size: "sm"
+              }, null, 8, ["name", "class"])
+            ]),
+            _: 1
+          }, 8, ["label", "class"])
+        ]),
+        default: p(() => [
+          u.searchable ? (m(), c(I, {
+            key: 0,
+            modelValue: o(s),
+            "onUpdate:modelValue": n[0] || (n[0] = (a) => M(s) ? s.value = a : null),
+            placeholder: "Search locations",
+            class: "my-8"
+          }, null, 8, ["modelValue"])) : k("", !0),
+          v(h, {
+            "model-value": Object.keys(o(l)).length === t.items.length,
+            label: "All",
+            "has-checkbox": !0,
+            indeterminate: !0,
+            onClick: _
+          }, null, 8, ["model-value"]),
+          (m(!0), O(A, null, N(o(x) ?? [], (a) => (m(), c(h, {
+            key: a.value,
+            value: a.value,
+            label: a.label,
+            "has-checkbox": !0,
+            "model-value": o(l)[a.value],
+            "onUpdate:modelValue": (T) => w(a.value)
+          }, null, 8, ["value", "label", "model-value", "onUpdate:modelValue"]))), 128))
+        ]),
+        _: 1
+      }, 8, ["placement", "disabled", "model-value"]);
+    };
+  }
+});
+export {
+  E as _
+};

package/dist/{Game-DUCx2Dl9.js → Game-D3gANFAo.js}

@@ -1,38 +1,41 @@
-import { defineComponent as N, ref as v, computed as q, onMounted as z, resolveComponent as r, openBlock as p, createElementBlock as C, Fragment as b, createVNode as s, unref as o, withCtx as h, createElementVNode as n, toDisplayString as c, renderList as J, createBlock as k, resolveDynamicComponent as O, h as l } from "vue";
-import { _ as Q } from "./campaign-CpzFl8Vr.js";
-import { useDialog as W, components as w } from "@feedmepos/ui-library";
-import { a as X, p as Y } from "./plugins-Dn7JDHi7.js";
-import { u as Z } from "./loading-c4b7n9Xp.js";
-import { u as ee } from "./business-DVlHPzaL.js";
-import { u as te } from "./campaign-D9KeUWA7.js";
-import { a as $, b as A, g as oe } from "./campaign-l-u9A514.js";
-import { _ as ae } from "./ChipMenu.vue_vue_type_script_setup_true_lang-BPpZZNkr.js";
-import { _ as ne } from "./EditCampaignSheet.vue_vue_type_script_setup_true_lang-hxuYl-OQ.js";
-import { u as se } from "./template-BSQLFHf4.js";
-import { u as ie } from "./vue-i18n--_Wu1nMj.js";
-import { _ as re } from "./SendCollectionSheet.vue_vue_type_script_setup_true_lang-DoL_gTKy.js";
-import { c as x } from "./index-1BGPM6Uy.js";
-const le = { class: "flex items-center" }, ce = { class: "fm-typo-en-title-md-600 fm-step-title line-clamp-2 mr-8" }, me = { class: "px-24 flex flex-col gap-y-16" }, de = { class: "flex items-center justify-between w-full" }, pe = { class: "flex gap-8 overflow-x-auto" }, ue = { class: "space-y-8" }, fe = { class: "flex w-full gap-4 items-center" }, ge = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, _e = { class: "space-y-4" }, ye = { class: "fm-typo-en-body-lg-600" }, he = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, we = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, xe = /* @__PURE__ */ n("img", {
-  src: Q,
-  class: "aspect-square w-[150px]"
-}, null, -1), ve = { class: "flex flex-col gap-16 text-center" }, Ce = { class: "fm-typo-en-title-sm-800" }, be = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Te = /* @__PURE__ */ N({
+import { defineComponent as q, ref as v, computed as z, onMounted as O, resolveComponent as r, openBlock as f, createElementBlock as C, Fragment as b, createVNode as s, unref as o, withCtx as h, createElementVNode as n, toDisplayString as u, renderList as J, createBlock as k, resolveDynamicComponent as Q, h as l } from "vue";
+import { _ as W } from "./campaign-CpzFl8Vr.js";
+import { useDialog as X, components as w } from "@feedmepos/ui-library";
+import { a as Y, p as Z } from "./plugins-Z2YcDTj8.js";
+import { u as ee } from "./loading-CZH88Duq.js";
+import { u as te } from "./business-BSP_3iNl.js";
+import { u as oe } from "./campaign-C1hWNRWr.js";
+import { a as $, b as R, g as ae } from "./campaign-DMZnXtyb.js";
+import { _ as ne } from "./FilterChip.vue_vue_type_script_setup_true_lang-DaU-9GzO.js";
+import { _ as se } from "./EditCampaignSheet.vue_vue_type_script_setup_true_lang-BJEAsRON.js";
+import { u as ie } from "./template-BnyUm8is.js";
+import { u as re } from "./vue-i18n-2D47GxQX.js";
+import { _ as le } from "./SendCollectionSheet.vue_vue_type_script_setup_true_lang-bSi6_uqi.js";
+import { c as x } from "./index-Ba5-z1MU.js";
+const ce = { class: "flex items-center" }, me = { class: "fm-typo-en-title-md-600 fm-step-title line-clamp-2 mr-8" }, de = { class: "px-24 flex flex-col gap-y-16" }, ue = { class: "flex items-center justify-between w-full" }, pe = { class: "flex gap-8 overflow-x-auto" }, fe = { class: "space-y-8" }, ge = { class: "flex w-full gap-4 items-center" }, ye = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, _e = { class: "space-y-4" }, he = { class: "fm-typo-en-body-lg-600" }, we = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, xe = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, ve = { class: "flex flex-col gap-16 text-center" }, Ce = { class: "fm-typo-en-title-sm-800" }, be = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Te = /* @__PURE__ */ q({
   __name: "Game",
   setup(ke) {
-    const { t: m } = ie(), E = {
-      label: m("connect.program.common.actions.create", {
-        type: m("connect.program.game.title").toLowerCase()
+    const { t: c } = re(), E = {
+      label: c("connect.program.common.actions.create", {
+        type: c("connect.program.game.title").toLowerCase()
       }),
       value: "create",
       isPrimary: !0,
       prependIcon: "add"
-    }, K = se("GAME", W()), f = ee(), d = te(), { global: M, minor: F } = Z, i = v({
+    }, K = ie("GAME", X()), g = te(), p = oe(), { global: M, minor: F } = ee, i = v({
       searchKey: "",
-      location: null
-    }), g = q(
-      () => d.campaigns.token.filter(
-        (e) => !i.value.location || !e.targetLocation || e.targetLocation.includes(i.value.location)
-      )
-    ), G = [
+      location: []
+    });
+    function G(e) {
+      const t = i.value.location;
+      return !t || t.length === 0 || !e.targetLocation ? !0 : Array.isArray(t) ? t.some((m) => {
+        var d;
+        return (d = e == null ? void 0 : e.targetLocation) == null ? void 0 : d.includes(m);
+      }) : e.targetLocation.includes(t);
+    }
+    const y = z(
+      () => p.campaigns.token.filter((e) => G(e))
+    ), I = [
       {
         header: "Program title",
         accessorKey: "name",
@@ -45,7 +48,7 @@ const le = { class: "flex items-center" }, ce = { class: "fm-typo-en-title-md-60
                 {
                   content: e.row.original._id,
                   onClick: (t) => {
-                    t.stopPropagation(), X(e.row.original._id);
+                    t.stopPropagation(), Y(e.row.original._id);
                   }
                 },
                 [
@@ -63,14 +66,14 @@ const le = { class: "flex items-center" }, ce = { class: "fm-typo-en-title-md-60
       },
       {
         header: "Status",
-        accessorFn: (e) => oe(e),
+        accessorFn: (e) => ae(e),
         cell(e) {
           return $(e.row.original);
         }
       },
       {
         header: "Summary",
-        accessorFn: (e) => A(e)
+        accessorFn: (e) => R(e)
         //v.effect,
       },
       {
@@ -89,7 +92,7 @@ const le = { class: "flex items-center" }, ce = { class: "fm-typo-en-title-md-60
               icon: "send",
               iconColor: "neutral-gray-400",
               onClick: (t) => {
-                t.stopPropagation(), T(e.row.original);
+                t.stopPropagation(), U(e.row.original);
               }
             }),
             l(w.FmButton, {
@@ -97,17 +100,17 @@ const le = { class: "flex items-center" }, ce = { class: "fm-typo-en-title-md-60
               icon: "delete",
               iconColor: "neutral-gray-400",
               onClick: (t) => {
-                t.stopPropagation(), L(e.row.original);
+                t.stopPropagation(), P(e.row.original);
               }
             })
           ]);
         }
       }
-    ], S = v(), P = v();
-    async function L(e) {
-      await Y.remove(`Are you sure you want to remove ${e.name}?`) && await F(
+    ], S = v(), L = v();
+    async function P(e) {
+      await Z.remove(`Are you sure you want to remove ${e.name}?`) && await F(
         async () => {
-          await x.delete(e._id), await d.read("GAME");
+          await x.delete(e._id), await p.read("GAME");
         },
         {
           message: `Removing ${e.name}`,
@@ -116,23 +119,23 @@ const le = { class: "flex items-center" }, ce = { class: "fm-typo-en-title-md-60
       );
     }
     async function _(e) {
-      e ? await t() : K.open(async (u) => {
-        await t(u);
+      e ? await t() : K.open(async (m) => {
+        await t(m);
       });
-      async function t(u) {
-        var y;
-        (y = S.value) == null || y.showSheet(
+      async function t(m) {
+        var d;
+        (d = S.value) == null || d.showSheet(
           !0,
           "GAME",
           e ? await x.readById(e._id) : void 0,
-          u
+          m
         );
       }
     }
-    async function I(e) {
+    async function T(e) {
       await F(
         async () => {
-          e.campaign._id ? await x.update(e.campaign._id, e) : await x.create(e), await d.read("GAME");
+          e.campaign._id ? await x.update(e.campaign._id, e) : await x.create(e), await p.read("GAME");
         },
         {
           message: `${e.campaign._id ? "Updating" : "Creating"} game program`,
@@ -140,32 +143,32 @@ const le = { class: "flex items-center" }, ce = { class: "fm-typo-en-title-md-60
         }
       );
     }
-    function T(e) {
+    function U(e) {
       var t;
-      (t = P.value) == null || t.showSheet({
+      (t = L.value) == null || t.showSheet({
         campaign: e
       });
     }
-    return z(async () => {
+    return O(async () => {
       await M(async () => {
-        await d.read("GAME"), await f.readPremium();
+        await p.read("GAME"), await g.readPremium();
       });
     }), (e, t) => {
-      const u = r("FmPill"), y = r("FmPageHead"), V = r("FmSearch"), U = r("FmTable"), B = r("FmButton"), j = r("FmListItem"), D = r("FmList"), H = r("FmCard");
-      return p(), C(b, null, [
-        s(y, {
-          actions: o(g).length > 0 && o(f).isPremium ? [E] : [],
+      const m = r("FmPill"), d = r("FmPageHead"), V = r("FmSearch"), j = r("FmTable"), A = r("FmButton"), D = r("FmListItem"), H = r("FmList"), N = r("FmCard");
+      return f(), C(b, null, [
+        s(d, {
+          actions: o(y).length > 0 && o(g).isPremium ? [E] : [],
           "onClick:action": t[0] || (t[0] = () => _())
         }, {
           title: h(() => [
-            n("div", le, [
-              n("span", ce, c(o(m)("connect.program.game.title")), 1),
-              s(u, { variant: "premium" })
+            n("div", ce, [
+              n("span", me, u(o(c)("connect.program.game.title")), 1),
+              s(m, { variant: "premium" })
             ])
           ]),
           _: 1
         }, 8, ["actions"]),
-        n("div", me, [
+        n("div", de, [
           s(V, {
             modelValue: o(i).searchKey,
             "onUpdate:modelValue": t[1] || (t[1] = (a) => o(i).searchKey = a),
@@ -173,18 +176,18 @@ const le = { class: "flex items-center" }, ce = { class: "fm-typo-en-title-md-60
             placeholder: "search",
             collapsible: ""
           }, null, 8, ["modelValue"]),
-          o(d).campaigns.token && o(d).campaigns.token.length > 0 ? (p(), C(b, { key: 0 }, [
-            n("div", de, [
+          o(p).campaigns.token && o(p).campaigns.token.length > 0 ? (f(), C(b, { key: 0 }, [
+            n("div", ue, [
               n("div", pe, [
-                s(ae, {
+                s(ne, {
+                  label: `${o(c)("connect.common.location")}: `,
+                  "right-icon": "keyboard_arrow_down",
                   modelValue: o(i).location,
                   "onUpdate:modelValue": t[2] || (t[2] = (a) => o(i).location = a),
-                  label: "Location: ",
-                  "show-item-label": !0,
                   icon: "storefront",
-                  placement: "bottom-start",
-                  items: o(f).locationItems
-                }, null, 8, ["modelValue", "items"])
+                  "show-item-label": !0,
+                  items: o(g).locationOptions
+                }, null, 8, ["label", "modelValue", "items"])
               ]),
               s(V, {
                 modelValue: o(i).searchKey,
@@ -194,43 +197,43 @@ const le = { class: "flex items-center" }, ce = { class: "fm-typo-en-title-md-60
                 collapsible: ""
               }, null, 8, ["modelValue"])
             ]),
-            s(U, {
+            s(j, {
               class: "xs:hidden",
-              "row-data": o(g),
-              "column-defs": G,
+              "row-data": o(y),
+              "column-defs": I,
               "search-value": o(i).searchKey,
               "column-filter": [],
               onRowClick: t[4] || (t[4] = (a) => _(a.original)),
-              "hide-footer": o(g).length < 10
+              "hide-footer": o(y).length < 10
             }, null, 8, ["row-data", "search-value", "hide-footer"]),
-            s(D, { class: "hidden xs:flex flex-col mx-[-24px]" }, {
+            s(H, { class: "hidden xs:flex flex-col mx-[-24px]" }, {
               default: h(() => [
-                (p(!0), C(b, null, J(o(g).filter(
+                (f(!0), C(b, null, J(o(y).filter(
                   (a) => a.name.toLowerCase().includes(o(i).searchKey.toLowerCase())
-                ), (a) => (p(), k(j, {
+                ), (a) => (f(), k(D, {
                   key: a._id.toString(),
-                  onClick: (R) => _(a),
+                  onClick: (B) => _(a),
                   class: "py-12 px-16 flex items-center justify-between border-b border-fm-color-neutral-gray-100"
                 }, {
                   default: h(() => [
-                    n("div", ue, [
-                      n("div", fe, [
-                        (p(), k(O(o($)(a)))),
-                        n("div", ge, c(a.currentReceive ?? 0) + " used ", 1)
+                    n("div", fe, [
+                      n("div", ge, [
+                        (f(), k(Q(o($)(a)))),
+                        n("div", ye, u(a.currentReceive ?? 0) + " used ", 1)
                       ]),
                       n("div", _e, [
-                        n("div", ye, c(a.name), 1),
-                        n("div", he, c(o(A)(a)), 1)
+                        n("div", he, u(a.name), 1),
+                        n("div", we, u(o(R)(a)), 1)
                       ]),
-                      n("div", we, c(o(m)("connect.program.game.token_received", {
+                      n("div", xe, u(o(c)("connect.program.game.token_received", {
                         count: a.currentReceive ?? 0
                       })), 1)
                     ]),
-                    s(B, {
+                    s(A, {
                       icon: "delete",
                       "icon-color": "neutral-gray-400",
                       variant: "tertiary",
-                      onClick: (R) => (R.stopPropagation(), L(a))
+                      onClick: (B) => (B.stopPropagation(), P(a))
                     }, null, 8, ["onClick"])
                   ]),
                   _: 2
@@ -238,35 +241,38 @@ const le = { class: "flex items-center" }, ce = { class: "fm-typo-en-title-md-60
               ]),
               _: 1
             })
-          ], 64)) : (p(), k(H, {
+          ], 64)) : (f(), k(N, {
             key: 1,
             variant: "outlined",
             class: "w-full flex flex-col items-center justify-center gap-y-24 p-24"
           }, {
             default: h(() => [
-              xe,
+              t[6] || (t[6] = n("img", {
+                src: W,
+                class: "aspect-square w-[150px]"
+              }, null, -1)),
               n("div", ve, [
-                n("div", Ce, c(o(m)("connect.program.game.empty_state.title")), 1),
-                n("div", be, c(o(m)("connect.program.game.empty_state.description")), 1)
+                n("div", Ce, u(o(c)("connect.program.game.empty_state.title")), 1),
+                n("div", be, u(o(c)("connect.program.game.empty_state.description")), 1)
               ]),
-              s(B, {
+              s(A, {
                 variant: "primary",
                 label: "Create game program",
                 icon: "add",
-                disabled: !o(f).isPremium,
+                disabled: !o(g).isPremium,
                 onClick: t[5] || (t[5] = (a) => _())
               }, null, 8, ["disabled"])
             ]),
             _: 1
           })),
-          s(ne, {
+          s(se, {
             ref_key: "sheetRef",
             ref: S,
-            "onSubmit:modelValue": I
+            "onSubmit:modelValue": T
           }, null, 512),
-          s(re, {
+          s(le, {
             ref_key: "sendCollectionSheetRef",
-            ref: P
+            ref: L
           }, null, 512)
         ])
       ], 64);

package/dist/ImageInput.vue_vue_type_script_setup_true_lang-D1KQpDGg.js

@@ -0,0 +1,144 @@
+import { openBlock as l, createElementBlock as o, createElementVNode as i, defineComponent as C, ref as v, onMounted as $, resolveComponent as f, renderSlot as b, toDisplayString as r, createCommentVNode as x, normalizeStyle as R, unref as s, Fragment as h, createVNode as w, withCtx as g, createTextVNode as p, normalizeClass as V, createBlock as F } from "vue";
+import { _ as z } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const H = {}, N = { class: "animate-pulse flex space-x-4 bg-gray-300 dark:bg-gray-700 items-center justify-center rounded w-full h-full" };
+function A(e, d) {
+  return l(), o("div", N, [...d[0] || (d[0] = [
+    i("svg", {
+      class: "dark:text-gray-600 h-10 text-gray-200 w-10",
+      "aria-hidden": "true",
+      xmlns: "http://www.w3.org/2000/svg",
+      fill: "currentColor",
+      viewBox: "0 0 20 18"
+    }, [
+      i("path", { d: "M18 0H2a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2Zm-5.5 4a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm4.376 10.481A1 1 0 0 1 16 15H4a1 1 0 0 1-.895-1.447l3.5-7A1 1 0 0 1 7.468 6a.965.965 0 0 1 .9.5l2.775 4.757 1.546-1.887a1 1 0 0 1 1.618.1l2.541 4a1 1 0 0 1 .028 1.011Z" })
+    ], -1)
+  ])]);
+}
+const D = /* @__PURE__ */ z(H, [["render", A]]), I = { class: "max-w-full max-h-[400px] space-y-4" }, L = { key: 0 }, T = { class: "text-fm-color-typo-secondary fm-typo-en-body-sm-400" }, U = {
+  key: 1,
+  class: "h-full w-full relative bg-fm-color-neutral-white p-12 border-2 border-dashed border-fm-color-neutral-gray-300 rounded-md flex flex-col items-center justify-center gap-8 hover:border-fm-color-neutral-gray-400"
+}, Z = ["src"], _ = ["src"], E = { class: "absolute right-0 top-0" }, O = /* @__PURE__ */ C({
+  __name: "ImageInput",
+  props: {
+    required: {
+      type: Boolean,
+      default: () => !1
+    },
+    disabled: {
+      type: Boolean,
+      default: () => !1
+    },
+    thumbnail: {
+      type: String,
+      default: () => {
+      }
+    },
+    file: {
+      type: File,
+      default: () => {
+      }
+    },
+    label: {
+      type: String,
+      default: () => {
+      }
+    },
+    aspectRatio: {
+      type: String,
+      default: "2/3"
+    },
+    imageFit: {
+      type: String,
+      default: "contain"
+    },
+    accept: {
+      type: String,
+      default: ".png, .jpg, .jpeg, .webm"
+    },
+    recommendedSize: {
+      type: String,
+      default: "Recommended: 950px x 600px"
+    },
+    deleteButton: {
+      type: Boolean,
+      default: !0
+    }
+  },
+  emits: ["update:file"],
+  setup(e, { emit: d }) {
+    const c = e, a = v({
+      loading: !1,
+      imgsrc: c.thumbnail
+    }), m = v(!1), y = d;
+    async function u(t) {
+      return t == null ? (a.value.imgsrc = void 0, y("update:file", null)) : (m.value = !!t.type.startsWith("video/"), a.value.loading = !0, a.value.imgsrc = URL.createObjectURL(t), a.value.loading = !1, y("update:file", t));
+    }
+    return $(() => {
+      var t;
+      c.file && u(c.file), (t = c.thumbnail) != null && t.includes("mp4") && (m.value = !0);
+    }), (t, n) => {
+      const k = f("FmDropField"), S = f("FmHelperText"), B = f("FmButton");
+      return l(), o("div", I, [
+        b(t.$slots, "label", {}, () => [
+          e.label ? (l(), o("div", L, r(e.label), 1)) : x("", !0)
+        ]),
+        i("div", {
+          style: R({ "aspect-ratio": e.aspectRatio }),
+          class: "flex flex-col max-h-full max-w-full"
+        }, [
+          s(a).loading ? (l(), F(D, { key: 1 })) : (l(), o(h, { key: 0 }, [
+            s(a).imgsrc ? (l(), o("div", U, [
+              s(m) ? (l(), o("video", {
+                key: 1,
+                src: s(a).imgsrc || e.thumbnail,
+                class: "w-full h-full",
+                controls: ""
+              }, null, 8, _)) : (l(), o("img", {
+                key: 0,
+                class: V([`object-${e.imageFit}`, "w-full h-full"]),
+                src: s(a).imgsrc || e.thumbnail
+              }, null, 10, Z)),
+              i("div", E, [
+                b(t.$slots, "delete-button"),
+                e.deleteButton ? (l(), F(B, {
+                  key: 0,
+                  class: "!text-neutral-50 !bg-neutral-700",
+                  icon: "delete",
+                  variant: "tertiary",
+                  disabled: e.disabled,
+                  onClick: n[1] || (n[1] = (j) => u(null))
+                }, null, 8, ["disabled"])) : x("", !0)
+              ])
+            ])) : (l(), o(h, { key: 0 }, [
+              w(k, {
+                class: "flex-1 hihiha",
+                accept: e.accept,
+                disabled: e.disabled,
+                onFileUpload: u,
+                onFileRejected: n[0] || (n[0] = (j) => u(null))
+              }, {
+                label: g(() => [...n[2] || (n[2] = [
+                  p(r(void 0), -1)
+                ])]),
+                "helper-text": g(() => [...n[3] || (n[3] = [
+                  p(r(void 0), -1)
+                ])]),
+                "accept-text": g(() => [
+                  i("div", T, [
+                    i("div", null, "(" + r(e.recommendedSize) + ")", 1),
+                    p(" Accepts " + r(e.accept), 1)
+                  ])
+                ]),
+                _: 1
+              }, 8, ["accept", "disabled"]),
+              w(S, { text: "" })
+            ], 64))
+          ], 64))
+        ], 4)
+      ]);
+    };
+  }
+});
+export {
+  O as _
+};