@feedmepos/mf-inventory-portal 0.0.21-dev.4 → 0.0.21-dev.5

package/dist/{RecipeView-DYKhSgtw.js → RecipeView-DAH8YIzY.js}

@@ -1,17 +1,17 @@
-import { defineComponent as Y, ref as E, onMounted as se, resolveComponent as k, openBlock as x, createElementBlock as A, Fragment as le, createElementVNode as _, toDisplayString as re, createVNode as y, createCommentVNode as H, computed as V, watch as ie, createBlock as T, withCtx as $, unref as v, isRef as X, normalizeStyle as ce, Teleport as ue, normalizeProps as de, guardReactiveProps as me } from "vue";
-import { u as I, c as G, S as pe, a as q, R as fe, U as ve, _ as ye, A as ge, e as Z, f as _e, j as be } from "./app-SBnQEeEV.js";
-import { useDialog as we, useSnackbar as oe, useProxiedModel as ee, useBreakpoints as Re } from "@feedmepos/ui-library";
-import { i as he, _ as xe } from "./is-linked-ingredient-error-fJ2TJb3z.js";
-import { F as h, D as te, R as N } from "./row-action.enum-PMKMRrZR.js";
-import { _ as ae, t as Ce, d as Ee } from "./xlsx.util-Dsf-EgrG.js";
-import { defineStore as Fe, storeToRefs as ke } from "pinia";
-import { c as Ve, _ as Se, F as ne } from "./TableActionableRow.vue_vue_type_script_setup_true_lang-DlNJ6kRg.js";
-import { useI18n as j } from "@feedmepos/mf-common";
-import { u as De, _ as Ae, a as $e } from "./FmInventoryTableToolbar.vue_vue_type_script_setup_true_lang-DYBTXD_J.js";
-const Ie = {
+import { defineComponent as N, ref as x, onMounted as le, resolveComponent as F, openBlock as h, createElementBlock as $, Fragment as re, createElementVNode as b, toDisplayString as ie, createVNode as y, createCommentVNode as H, computed as V, watch as ce, createBlock as M, withCtx as I, unref as v, isRef as Z, normalizeClass as ue, normalizeStyle as de, Teleport as me, normalizeProps as pe, guardReactiveProps as fe } from "vue";
+import { u as P, c as G, S as ve, a as q, R as ye, U as ge, _ as be, A as _e, e as ee, f as we, j as Re } from "./app-S6iG6Hux.js";
+import { useDialog as he, useSnackbar as ae, useProxiedModel as te, useBreakpoints as Ce } from "@feedmepos/ui-library";
+import { i as xe, _ as Ee } from "./is-linked-ingredient-error-fJ2TJb3z.js";
+import { F as R, D as ne, R as z } from "./row-action.enum-PMKMRrZR.js";
+import { _ as se, t as Fe, d as ke } from "./xlsx.util-CODYzgF8.js";
+import { defineStore as Ve, storeToRefs as Se } from "pinia";
+import { c as De, _ as Ae, F as oe } from "./TableActionableRow.vue_vue_type_script_setup_true_lang-DlNJ6kRg.js";
+import { useI18n as Y } from "@feedmepos/mf-common";
+import { u as $e, _ as Ie, a as Pe } from "./FmInventoryTableToolbar.vue_vue_type_script_setup_true_lang-CpN5Kn8b.js";
+const Te = {
   key: 0,
   class: "flex flex-col items-center w-full h-full gap-24"
-}, Pe = { key: 1 }, Te = { key: 0 }, Me = /* @__PURE__ */ Y({
+}, Me = { key: 1 }, Ue = { key: 0 }, Be = /* @__PURE__ */ N({
   __name: "DeleteDialog",
   props: {
     type: {},
@@ -19,31 +19,31 @@ const Ie = {
     message: {},
     bindedItems: {}
   },
-  setup(b) {
-    const d = b, p = E(d.bindedItems || []), l = E(!1);
-    se(() => {
+  setup(_) {
+    const d = _, p = x(d.bindedItems || []), l = x(!1);
+    le(() => {
       a();
     });
     async function a() {
-      var r, o;
-      !l.value && ((r = d.data) != null && r._id) && (l.value = !0, p.value = await I().getAffectedMenu((o = d.data) == null ? void 0 : o._id), l.value = !1);
+      var i, o;
+      !l.value && ((i = d.data) != null && i._id) && (l.value = !0, p.value = await P().getAffectedMenu((o = d.data) == null ? void 0 : o._id), l.value = !1);
     }
-    return (r, o) => {
-      const c = k("FmSpacer"), f = k("FmCircularProgress");
-      return x(), A(le, null, [
-        _("p", null, re(r.message), 1),
-        l.value ? (x(), A("div", Ie, [
+    return (i, o) => {
+      const c = F("FmSpacer"), f = F("FmCircularProgress");
+      return h(), $(re, null, [
+        b("p", null, ie(i.message), 1),
+        l.value ? (h(), $("div", Te, [
           y(c),
-          _("div", null, [
+          b("div", null, [
             y(f, { size: "xl" })
           ]),
-          o[0] || (o[0] = _("div", { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary pl-8" }, "Loading...", -1)),
+          o[0] || (o[0] = b("div", { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary pl-8" }, "Loading...", -1)),
           y(c)
-        ])) : (x(), A("div", Pe, [
-          o[2] || (o[2] = _("br", null, null, -1)),
-          p.value.length > 0 ? (x(), A("div", Te, [
-            o[1] || (o[1] = _("p", { class: "fm-typo-en-body-lg-600" }, "Affected menu items:", -1)),
-            y(ae, {
+        ])) : (h(), $("div", Me, [
+          o[2] || (o[2] = b("br", null, null, -1)),
+          p.value.length > 0 ? (h(), $("div", Ue, [
+            o[1] || (o[1] = b("p", { class: "fm-typo-en-body-lg-600" }, "Affected menu items:", -1)),
+            y(se, {
               name: "Menu",
               bindings: p.value
             }, null, 8, ["bindings"])
@@ -52,29 +52,29 @@ const Ie = {
       ], 64);
     };
   }
-}), K = Fe("recipeForm", function() {
-  const d = we(), p = oe(), l = I(), a = E(!1), r = E();
+}), K = Ve("recipeForm", function() {
+  const d = he(), p = ae(), l = P(), a = x(!1), i = x();
   function o() {
     const t = {
       recipe: {},
-      mode: h.CREATE,
+      mode: R.CREATE,
       show: !0,
       "onUpdate:show"(u) {
-        r.value.show = u;
+        i.value.show = u;
       }
     };
-    r.value = t;
+    i.value = t;
   }
   async function c(t) {
     const u = {
       recipe: G(t),
-      mode: h.UPDATE,
+      mode: R.UPDATE,
       show: !0,
       "onUpdate:show"(s) {
-        r.value.show = s;
+        i.value.show = s;
       }
     };
-    r.value = u;
+    i.value = u;
   }
   async function f(t) {
     a.value = !0;
@@ -85,9 +85,9 @@ const Ie = {
         type: "success"
       });
     } catch (u) {
-      u instanceof pe && he(u) ? d.open({
+      u instanceof ve && xe(u) ? d.open({
         title: "Cannot delete recipe",
-        contentComponent: xe,
+        contentComponent: Ee,
         contentComponentProps: {
           subject: (t == null ? void 0 : t.name) ?? "",
           items: u.errorResponse.message
@@ -118,7 +118,7 @@ const Ie = {
         text: "Cancel",
         close: !0
       },
-      contentComponent: Me,
+      contentComponent: Be,
       contentComponentProps: {
         type: "menu",
         data: t,
@@ -130,19 +130,19 @@ const Ie = {
     createRecipe: o,
     updateRecipe: c,
     deleteRecipe: m,
-    recipeDialogProps: r,
+    recipeDialogProps: i,
     recipeViewLoading: a
   };
 });
-function Ue() {
-  const { updateRecipe: b, deleteRecipe: d } = K(), { t: p } = j();
+function Le() {
+  const { updateRecipe: _, deleteRecipe: d } = K(), { t: p } = Y();
   async function l(o, c) {
     const f = G(c);
-    if (o === N.Edit) {
-      await b(f);
+    if (o === z.Edit) {
+      await _(f);
       return;
     }
-    if (o === N.Delete) {
+    if (o === z.Delete) {
       await d(f);
       return;
     }
@@ -162,8 +162,8 @@ function Ue() {
       id: "action",
       header: "",
       cell(o) {
-        return Ve(
-          [te[N.Edit], te[N.Delete]],
+        return De(
+          [ne[z.Edit], ne[z.Delete]],
           (c) => {
             l(c, o.row.original.original);
           }
@@ -177,8 +177,8 @@ function Ue() {
       }
     }
   ];
-  function r(o) {
-    const c = I();
+  function i(o) {
+    const c = P();
     return o.map((f) => ({
       recipe: f.name,
       ingredients: f.contains.map((m) => {
@@ -189,15 +189,15 @@ function Ue() {
       original: f
     }));
   }
-  return { columnDefs: a, formatRowData: r };
+  return { columnDefs: a, formatRowData: i };
 }
-const Be = { class: "flex flex-col gap-40" }, Le = {
+const ze = { class: "flex flex-col gap-40" }, Ne = {
   key: 0,
   class: "col-span-2 mt-16 border-1 border-fm-color-neutral-gray-200 fm-corner-radius-lg flex flex-col p-16 gap-16"
-}, ze = {
+}, Ye = {
   key: 0,
   class: "flex flex-col items-center w-full h-full gap-24"
-}, Ne = { key: 1 }, Ye = /* @__PURE__ */ Y({
+}, je = { key: 1 }, He = /* @__PURE__ */ N({
   __name: "RecipeForm",
   props: {
     mode: {},
@@ -205,9 +205,9 @@ const Be = { class: "flex flex-col gap-40" }, Le = {
     disabled: { type: Boolean }
   },
   emits: ["update:modelValue", "click:submit"],
-  setup(b, { expose: d, emit: p }) {
-    var F;
-    const l = b, a = p, { t: r } = j(), o = V({
+  setup(_, { expose: d, emit: p }) {
+    var k;
+    const l = _, a = p, { t: i } = Y(), o = V({
       get() {
         var e;
         return ((e = l.modelValue) == null ? void 0 : e.name) ?? "";
@@ -229,7 +229,7 @@ const Be = { class: "flex flex-col gap-40" }, Le = {
     function f() {
       a("click:submit");
     }
-    const m = E();
+    const m = x();
     d({
       validateInputs: () => {
         var e, n;
@@ -244,75 +244,75 @@ const Be = { class: "flex flex-col gap-40" }, Le = {
         (n = (e = m.value) == null ? void 0 : e.resetInputs) == null || n.call(e);
       }
     });
-    const t = I(), u = E([]), s = E(!1), w = E(!1);
-    ie(s, async (e) => {
+    const t = P(), u = x([]), s = x(!1), w = x(!1);
+    ce(s, async (e) => {
       C(e);
     });
     async function C(e) {
-      var n, P;
-      e && !w.value && ((n = l.modelValue) != null && n._id) && (w.value = !0, u.value = await t.getAffectedMenu((P = l.modelValue) == null ? void 0 : P._id), w.value = !1);
+      var n, S;
+      e && !w.value && ((n = l.modelValue) != null && n._id) && (w.value = !0, u.value = await t.getAffectedMenu((S = l.modelValue) == null ? void 0 : S._id), w.value = !1);
     }
-    const i = V(
+    const r = V(
       () => t.recipes.map((e) => ({ label: e.name, value: e.name }))
-    ), g = E((F = l.modelValue) == null ? void 0 : F.name);
+    ), g = x((k = l.modelValue) == null ? void 0 : k.name);
     return (e, n) => {
-      const P = k("FmTextField"), D = k("FmCard"), S = k("FmSwitch"), M = k("FmSpacer"), U = k("FmCircularProgress"), B = k("FmForm");
-      return x(), T(B, {
+      const S = F("FmTextField"), j = F("FmCard"), A = F("FmSwitch"), D = F("FmSpacer"), U = F("FmCircularProgress"), B = F("FmForm");
+      return h(), M(B, {
         ref_key: "formRef",
         ref: m,
         onValidationSuccess: f
       }, {
-        default: $(() => [
-          _("div", Be, [
-            y(P, {
+        default: I(() => [
+          b("div", ze, [
+            y(S, {
               disabled: e.disabled,
-              label: v(r)("inventory.recipe.name"),
+              label: v(i)("inventory.recipe.name"),
               "model-value": o.value,
-              "onUpdate:modelValue": n[0] || (n[0] = (R) => o.value = R),
+              "onUpdate:modelValue": n[0] || (n[0] = (E) => o.value = E),
               rules: [
-                v(fe)(),
-                v(ve)(i.value, g.value, (R) => `[${R.value}] already exists`)
+                v(ye)(),
+                v(ge)(r.value, g.value, (E) => `[${E.value}] already exists`)
               ],
               "label-mark": "required"
             }, null, 8, ["disabled", "label", "model-value", "rules"]),
-            y(D, {
+            y(j, {
               variant: "outlined",
               class: "p-16"
             }, {
-              default: $(() => {
-                var R;
+              default: I(() => {
+                var E;
                 return [
-                  y(ye, {
-                    id: (R = e.modelValue) == null ? void 0 : R._id,
+                  y(be, {
+                    id: (E = e.modelValue) == null ? void 0 : E._id,
                     disabled: e.disabled,
                     "model-value": c.value,
-                    "onUpdate:modelValue": n[1] || (n[1] = (L) => c.value = L),
-                    rules: [v(ge)(1)]
+                    "onUpdate:modelValue": n[1] || (n[1] = (T) => c.value = T),
+                    rules: [v(_e)(1)]
                   }, null, 8, ["id", "disabled", "model-value", "rules"])
                 ];
               }),
               _: 1
             })
           ]),
-          e.mode !== v(h).CREATE ? (x(), A("div", Le, [
-            _("div", null, [
-              y(S, {
+          e.mode !== v(R).CREATE ? (h(), $("div", Ne, [
+            b("div", null, [
+              y(A, {
                 label: "Show binded items",
                 modelValue: s.value,
-                "onUpdate:modelValue": n[2] || (n[2] = (R) => s.value = R),
+                "onUpdate:modelValue": n[2] || (n[2] = (E) => s.value = E),
                 "label-placement": "right",
                 disabled: w.value
               }, null, 8, ["modelValue", "disabled"])
             ]),
-            w.value ? (x(), A("div", ze, [
-              y(M),
-              _("div", null, [
+            w.value ? (h(), $("div", Ye, [
+              y(D),
+              b("div", null, [
                 y(U, { size: "xl" })
               ]),
-              n[3] || (n[3] = _("div", { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary pl-8" }, "Loading...", -1)),
-              y(M)
-            ])) : (x(), A("div", Ne, [
-              s.value && u.value.length ? (x(), T(ae, {
+              n[3] || (n[3] = b("div", { class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary pl-8" }, "Loading...", -1)),
+              y(D)
+            ])) : (h(), $("div", je, [
+              s.value && u.value.length ? (h(), M(se, {
                 key: 0,
                 name: "Menu",
                 bindings: u.value
@@ -324,47 +324,47 @@ const Be = { class: "flex flex-col gap-40" }, Le = {
       }, 512);
     };
   }
-}), je = { class: "flex gap-4" }, He = /* @__PURE__ */ Y({
+}), qe = { class: "flex gap-4" }, Ke = /* @__PURE__ */ N({
   __name: "RecipeDialog",
   props: {
     show: { type: Boolean },
     recipe: {},
-    mode: { default: h.READ }
+    mode: { default: R.READ }
   },
   emits: ["update:show"],
-  setup(b) {
-    const d = b, p = I(), l = oe(), { t: a } = j(), r = ee(d, "show"), o = ee(d, "recipe"), c = V(() => {
+  setup(_) {
+    const d = _, p = P(), l = ae(), { t: a } = Y(), i = te(d, "show"), o = te(d, "recipe"), c = V(() => {
       switch (d.mode) {
-        case h.READ:
+        case R.READ:
           return "";
-        case h.UPDATE:
+        case R.UPDATE:
           return a("inventory.recipe.update.title");
-        case h.CREATE:
+        case R.CREATE:
           return a("inventory.recipe.create.title");
       }
       return "";
     }), f = V(() => {
       switch (d.mode) {
-        case h.READ:
+        case R.READ:
           return "";
-        case h.UPDATE:
+        case R.UPDATE:
           return a("common.save");
-        case h.CREATE:
+        case R.CREATE:
           return a("common.add");
       }
       return "";
-    }), m = E(), t = E(!1);
+    }), m = x(), t = x(!1);
     async function u() {
       t.value = !0;
       try {
-        const i = G(o.value);
-        i.precision ?? (i.precision = 0), i.measurements ?? (i.measurements = []), await p.createRecipe(i), r.value = !1, l.open({
+        const r = G(o.value);
+        r.precision ?? (r.precision = 0), r.measurements ?? (r.measurements = []), await p.createRecipe(r), i.value = !1, l.open({
           title: a("common.success"),
           message: a("inventory.recipe.create.success", { name: o.value.name }),
           type: "success"
         });
-      } catch (i) {
-        i instanceof Z || l.open({
+      } catch (r) {
+        r instanceof ee || l.open({
           title: a("inventory.recipe.create.error.title"),
           message: a("inventory.recipe.create.error.message"),
           type: "error"
@@ -376,13 +376,13 @@ const Be = { class: "flex flex-col gap-40" }, Le = {
     async function s() {
       t.value = !0;
       try {
-        await p.updateRecipe(o.value), r.value = !1, l.open({
+        await p.updateRecipe(o.value), i.value = !1, l.open({
           title: a("common.success"),
           message: a("inventory.recipe.update.success", { name: o.value.name }),
           type: "success"
         });
-      } catch (i) {
-        i instanceof Z || l.open({
+      } catch (r) {
+        r instanceof ee || l.open({
           title: a("inventory.recipe.update.error.title"),
           message: a("inventory.recipe.update.error.message"),
           type: "error"
@@ -392,52 +392,52 @@ const Be = { class: "flex flex-col gap-40" }, Le = {
       }
     }
     function w() {
-      var i, g;
-      (g = (i = m.value) == null ? void 0 : i.validateInputs) == null || g.call(i);
+      var r, g;
+      (g = (r = m.value) == null ? void 0 : r.validateInputs) == null || g.call(r);
     }
     function C() {
       switch (d.mode) {
-        case h.READ:
+        case R.READ:
           return;
-        case h.UPDATE:
+        case R.UPDATE:
           return s();
-        case h.CREATE:
+        case R.CREATE:
           return u();
       }
     }
-    return (i, g) => {
-      const F = k("FmButton"), e = k("FmSideSheet");
-      return x(), T(e, {
-        "model-value": v(r),
-        "onUpdate:modelValue": g[3] || (g[3] = (n) => X(r) ? r.value = n : null),
+    return (r, g) => {
+      const k = F("FmButton"), e = F("FmSideSheet");
+      return h(), M(e, {
+        "model-value": v(i),
+        "onUpdate:modelValue": g[3] || (g[3] = (n) => Z(i) ? i.value = n : null),
         header: c.value,
         "close-button": "",
         "dismiss-away": "",
         "max-width": 500
       }, {
-        "side-sheet-footer": $(() => [
-          _("div", je, [
-            y(F, {
+        "side-sheet-footer": I(() => [
+          b("div", qe, [
+            y(k, {
               loading: t.value,
               label: f.value,
               onClick: w
             }, null, 8, ["loading", "label"]),
-            y(F, {
+            y(k, {
               disabled: t.value,
               label: v(a)("common.close"),
               variant: "tertiary",
-              onClick: g[2] || (g[2] = (n) => r.value = !1)
+              onClick: g[2] || (g[2] = (n) => i.value = !1)
             }, null, 8, ["disabled", "label"])
           ])
         ]),
-        default: $(() => [
-          y(Ye, {
+        default: I(() => [
+          y(He, {
             class: "w-full",
             ref_key: "hasValidationExpose",
             ref: m,
             modelValue: v(o),
-            "onUpdate:modelValue": g[0] || (g[0] = (n) => X(o) ? o.value = n : null),
-            mode: i.mode,
+            "onUpdate:modelValue": g[0] || (g[0] = (n) => Z(o) ? o.value = n : null),
+            mode: r.mode,
             disabled: t.value,
             "onClick:submit": g[1] || (g[1] = (n) => C())
           }, null, 8, ["modelValue", "mode", "disabled"])
@@ -447,8 +447,8 @@ const Be = { class: "flex flex-col gap-40" }, Le = {
     };
   }
 });
-function qe() {
-  const b = I(), d = b.recipes, p = b.recipeById, l = b.skuById, a = d.flatMap((c, f) => {
+function Ge() {
+  const _ = P(), d = _.recipes, p = _.recipeById, l = _.skuById, a = d.flatMap((c, f) => {
     var m;
     if ((m = c.contains) != null && m.length) {
       const t = c.contains.filter((s) => s.type === "RECIPE"), u = c.contains.filter((s) => s.type === "SKU");
@@ -469,14 +469,14 @@ function qe() {
         ),
         ...u.map(
           (s, w) => {
-            var C, i, g, F;
+            var C, r, g, k;
             return [
               !t.length && w === 0 ? c.name : "",
               "INGREDIENT",
               (C = l[s.id]) == null ? void 0 : C.code,
-              (i = l[s.id]) == null ? void 0 : i.name,
+              (r = l[s.id]) == null ? void 0 : r.name,
               q(s.amount),
-              s.measurement ? s.measurement.abbrev : (F = (g = l[s.id]) == null ? void 0 : g.unit) == null ? void 0 : F.abbrev
+              s.measurement ? s.measurement.abbrev : (k = (g = l[s.id]) == null ? void 0 : g.unit) == null ? void 0 : k.abbrev
             ];
           }
         )
@@ -486,24 +486,24 @@ function qe() {
       ...f === 0 ? [] : [["", "", "", "", "", ""]],
       [c.name, "No bindings", "", "", "", ""]
     ];
-  }), o = Ce(a, ["Name", "Type", "Code", "Item", "Amount", "Unit"]);
-  Ee(o, `RECIPE_${_e(/* @__PURE__ */ new Date(), "-", "-")}.xlsx`);
+  }), o = Fe(a, ["Name", "Type", "Code", "Item", "Amount", "Unit"]);
+  ke(o, `RECIPE_${we(/* @__PURE__ */ new Date(), "-", "-")}.xlsx`);
 }
-const Ke = { class: "px-24 xs:p-0 sm:p-0 flex flex-col gap-8 max-h-full" }, Ge = { class: "flex flex-col py-8" }, Je = { class: "fm-typo-en-body-lg-600 text-fm-color-typo-primary" }, Oe = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, lt = /* @__PURE__ */ Y({
+const Je = { class: "flex flex-col py-8" }, Oe = { class: "fm-typo-en-body-lg-600 text-fm-color-typo-primary" }, Qe = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, rt = /* @__PURE__ */ N({
   __name: "RecipeView",
-  setup(b) {
-    const d = I(), p = V(() => d.recipes), l = be(), { createRecipe: a, updateRecipe: r } = K(), { recipeDialogProps: o, recipeViewLoading: c } = ke(K()), { columnDefs: f, formatRowData: m } = Ue(), t = V(() => m(p.value));
-    function u(e) {
-      e === "add" && a();
+  setup(_) {
+    const d = P(), p = V(() => d.recipes), l = Re(), { createRecipe: a, updateRecipe: i } = K(), { recipeDialogProps: o, recipeViewLoading: c } = Se(K()), { columnDefs: f, formatRowData: m } = Le(), t = V(() => m(p.value));
+    function u(n) {
+      n === "add" && a();
     }
-    const s = E(""), w = V(() => c.value), { breakpoints: C } = Re(), i = V(() => C.value.xs || C.value.sm ? 10 : 20), g = De(), { t: F } = j();
-    return (e, n) => {
-      const P = k("FmTable");
-      return x(), T(Ae, {
-        title: v(F)("inventory.recipe.title"),
+    const s = x(""), w = V(() => c.value), { breakpoints: C } = Ce(), r = V(() => C.value.xs || C.value.sm), g = V(() => r.value ? 10 : 20), k = $e(), { t: e } = Y();
+    return (n, S) => {
+      const j = F("FmTable");
+      return h(), M(Ie, {
+        title: v(e)("inventory.recipe.title"),
         actions: [
           {
-            label: v(F)("inventory.recipe.create.title"),
+            label: v(e)("inventory.recipe.create.title"),
             value: "add",
             isPrimary: !0,
             prependIcon: "add"
@@ -511,43 +511,51 @@ const Ke = { class: "px-24 xs:p-0 sm:p-0 flex flex-col gap-8 max-h-full" }, Ge =
         ],
         "onClick:action": u
       }, {
-        default: $(() => [
-          _("div", Ke, [
-            y($e, {
+        default: I(() => [
+          b("div", {
+            class: ue([
+              "flex flex-col gap-8 max-h-full",
+              {
+                "p-0": r.value,
+                "px-24 ": !r.value
+              }
+            ])
+          }, [
+            y(Pe, {
               searchable: "",
               search: s.value,
-              "onUpdate:search": n[0] || (n[0] = (D) => s.value = D),
-              actions: [{ icon: "ios_share", onClick: v(qe) }]
+              "onUpdate:search": S[0] || (S[0] = (A) => s.value = A),
+              actions: [{ icon: "ios_share", onClick: v(Ge) }]
             }, null, 8, ["search", "actions"]),
-            (x(), T(P, {
-              style: ce(v(g).tableHeight),
+            (h(), M(j, {
+              style: de(v(k).tableHeight),
               "column-defs": v(f),
               "row-data": t.value,
               "search-value": s.value,
               loading: !v(l)._currentLocation || w.value,
-              onRowClick: n[1] || (n[1] = (D) => v(r)(D.original.original)),
+              onRowClick: S[1] || (S[1] = (A) => v(i)(A.original.original)),
               key: p.value.length,
-              "page-size": i.value
+              "page-size": g.value
             }, {
-              "list-row": $((D) => [
-                y(Se, {
-                  row: D,
-                  onRowClick: (S) => v(r)(S.original)
+              "list-row": I((A) => [
+                y(Ae, {
+                  row: A,
+                  onRowClick: (D) => v(i)(D.original)
                 }, {
-                  default: $((S) => {
-                    var M, U, B, R, L, J, O, Q, z, W;
+                  default: I((D) => {
+                    var U, B, E, T, J, O, Q, W, L, X;
                     return [
-                      _("div", Ge, [
-                        _("div", Je, [
-                          y(v(ne), {
-                            render: (B = (U = (M = S.recipe) == null ? void 0 : M.column) == null ? void 0 : U.columnDef) == null ? void 0 : B.cell,
-                            props: (L = (R = S.recipe) == null ? void 0 : R.getContext) == null ? void 0 : L.call(R)
+                      b("div", Je, [
+                        b("div", Oe, [
+                          y(v(oe), {
+                            render: (E = (B = (U = D.recipe) == null ? void 0 : U.column) == null ? void 0 : B.columnDef) == null ? void 0 : E.cell,
+                            props: (J = (T = D.recipe) == null ? void 0 : T.getContext) == null ? void 0 : J.call(T)
                           }, null, 8, ["render", "props"])
                         ]),
-                        _("div", Oe, [
-                          y(v(ne), {
-                            render: (Q = (O = (J = S.ingredients) == null ? void 0 : J.column) == null ? void 0 : O.columnDef) == null ? void 0 : Q.cell,
-                            props: (W = (z = S.ingredients) == null ? void 0 : z.getContext) == null ? void 0 : W.call(z)
+                        b("div", Qe, [
+                          y(v(oe), {
+                            render: (W = (Q = (O = D.ingredients) == null ? void 0 : O.column) == null ? void 0 : Q.columnDef) == null ? void 0 : W.cell,
+                            props: (X = (L = D.ingredients) == null ? void 0 : L.getContext) == null ? void 0 : X.call(L)
                           }, null, 8, ["render", "props"])
                         ])
                       ])
@@ -558,9 +566,9 @@ const Ke = { class: "px-24 xs:p-0 sm:p-0 flex flex-col gap-8 max-h-full" }, Ge =
               ]),
               _: 1
             }, 8, ["style", "column-defs", "row-data", "search-value", "loading", "page-size"]))
-          ]),
-          (x(), T(ue, { to: "body" }, [
-            y(He, de(me(v(o))), null, 16)
+          ], 2),
+          (h(), M(me, { to: "body" }, [
+            y(Ke, pe(fe(v(o))), null, 16)
           ]))
         ]),
         _: 1
@@ -569,5 +577,5 @@ const Ke = { class: "px-24 xs:p-0 sm:p-0 flex flex-col gap-8 max-h-full" }, Ge =
   }
 });
 export {
-  lt as default
+  rt as default
 };