@feedmepos/mf-inventory-portal 0.0.16-dev.4 → 0.0.16

package/dist/IngredientsView-BugOG1Jr.js

@@ -0,0 +1,832 @@
+import { ref as L, defineComponent as te, computed as m, resolveComponent as _, openBlock as w, createBlock as P, withCtx as y, createVNode as r, createElementBlock as J, Fragment as ne, createElementVNode as x, createCommentVNode as G, onMounted as Ie, watch as Ae, unref as d, normalizeClass as pe, createTextVNode as Ue, toDisplayString as ae, renderList as Ee, isRef as ve, normalizeStyle as Re, Teleport as De, normalizeProps as $e, guardReactiveProps as Pe } from "vue";
+import { u as le, c as Ce, S as Te, g as fe, F as N, d as ge, a as Be, C as ue, b as be, e as Le } from "./app-6F9Nq1nz.js";
+import { useDialog as Oe, useSnackbar as he, useProxiedModel as Ve, useBreakpoints as Ne } from "@feedmepos/ui-library";
+import { i as ze, _ as Ge } from "./is-linked-ingredient-error-C6AghEwR.js";
+import { F as M, D as ye, R as ee } from "./row-action.enum-BwQbURNh.js";
+import { c as Ye, _ as qe, F as _e, u as We } from "./layout-17a6ifdn.js";
+import { _ as He } from "./SingleColumnLayout.vue_vue_type_script_setup_true_lang-CFjO4TPG.js";
+import { R as se, U as je, A as Ke, M as Je } from "./rules-lFRUMKT0.js";
+import { g as Qe } from "./util-CEVKTbZD.js";
+import { _ as Xe } from "./InventoryBindingForm.vue_vue_type_script_setup_true_lang-mXNWcOA1.js";
+import { _ as re } from "./IngredientBindedItem.vue_vue_type_script_setup_true_lang-pxmVRIYW.js";
+import { a as Ze, t as en } from "./date2-BfJmVTjj.js";
+import { useCoreStore as nn } from "@feedmepos/mf-common";
+import { _ as Fe } from "./PreviewBadge.vue_vue_type_script_setup_true_lang-BvadeWUz.js";
+function tn() {
+  const A = Oe(), C = he(), g = le(), t = L(!1), l = L();
+  function a() {
+    const u = {
+      unit: {},
+      mode: M.CREATE,
+      show: !0,
+      "onUpdate:show"(b) {
+        l.value.show = b;
+      }
+    };
+    l.value = u;
+  }
+  async function c(u) {
+    const b = {
+      unit: Ce(u),
+      mode: M.UPDATE,
+      show: !0,
+      "onUpdate:show"(s) {
+        l.value.show = s;
+      }
+    };
+    l.value = b;
+  }
+  async function k(u) {
+    t.value = !0;
+    try {
+      await g.deleteSku(u), C.open({
+        title: "Success",
+        message: `Deleted ${u.name}`,
+        type: "success"
+      });
+    } catch (b) {
+      b instanceof Te && ze(b) ? A.open({
+        title: "Cannot delete ingredient",
+        contentComponent: Ge,
+        contentComponentProps: {
+          subject: (u == null ? void 0 : u.name) ?? "",
+          items: b.errorResponse.message
+        },
+        secondaryActions: {
+          text: "Close",
+          close: !0
+        }
+      }) : console.log("unable to delete ingredient", b), C.open({
+        title: `Cannot delete ${u.name}`,
+        message: "Please try again.",
+        type: "error"
+      }), console.error("failed to delete ingredient", b);
+    } finally {
+      t.value = !1;
+    }
+  }
+  function U(u) {
+    A.open({
+      title: `Delete ${(u == null ? void 0 : u.name) ?? "ingredient"}?`,
+      closeButton: !1,
+      message: "You may not be able to delete this ingredient if it is linked in any of the inventory modules.",
+      primaryActions: {
+        text: "Delete",
+        close: !0,
+        variant: "destructive"
+      },
+      secondaryActions: {
+        text: "Cancel",
+        close: !0
+      }
+    }).onPrimary(() => k(u));
+  }
+  return {
+    createIngredient: a,
+    updateIngredient: c,
+    deleteIngredient: U,
+    ingredientDialogProps: l,
+    ingredientViewLoading: t
+  };
+}
+function ln({
+  updateIngredient: A,
+  deleteIngredient: C
+}) {
+  async function g(l, a) {
+    const c = Ce(a);
+    if (l === ee.Edit) {
+      await A(c);
+      return;
+    }
+    if (l === ee.Delete) {
+      await C(c);
+      return;
+    }
+  }
+  return { columnDefs: [
+    {
+      accessorKey: "code",
+      header: "Code",
+      enableSorting: !0,
+      size: 300
+    },
+    {
+      accessorKey: "name",
+      header: "Name",
+      enableSorting: !0,
+      size: 300
+    },
+    {
+      accessorFn: (l) => {
+        var a;
+        if (l.trackingMeasurement) {
+          const c = (a = l.unit.measurements) == null ? void 0 : a.find(
+            (k) => k.id === l.trackingMeasurement
+          );
+          if (c)
+            return `${c.name} (${c.abbrev})`;
+        }
+        return `${l.unit.name} (${l.unit.abbrev})`;
+      },
+      header: "Unit",
+      enableSorting: !1,
+      size: "auto"
+    },
+    {
+      id: "action",
+      header: "",
+      cell(l) {
+        return Ye(
+          [ye[ee.Edit], ye[ee.Delete]],
+          (a) => {
+            g(a, l.row.original);
+          }
+        );
+      },
+      enableSorting: !1,
+      size: 40,
+      meta: {
+        cellClass: "",
+        headerClass: ""
+      }
+    }
+  ] };
+}
+const on = /* @__PURE__ */ te({
+  __name: "ConvertForm",
+  props: {
+    modelValue: {},
+    rootValue: {},
+    disabled: { type: Boolean }
+  },
+  emits: ["update:modelValue"],
+  setup(A, { emit: C }) {
+    const g = A, t = m(() => {
+      var s;
+      return (s = g.rootValue) == null ? void 0 : s.unit;
+    }), l = m(() => {
+      var s;
+      return (s = g.rootValue) == null ? void 0 : s._id;
+    }), a = C, c = m({
+      get() {
+        return !!g.modelValue;
+      },
+      set(s) {
+        s ? a("update:modelValue", {
+          measurement: null,
+          inventoryBindings: []
+        }) : a("update:modelValue", null);
+      }
+    }), k = m(() => Qe(t.value));
+    function U(s) {
+      const v = g.modelValue ?? {};
+      v.measurement = s ? `${s}` : null, a("update:modelValue", v);
+    }
+    function u(s) {
+      const v = g.modelValue ?? {};
+      v.inventoryBindings = s, a("update:modelValue", v);
+    }
+    const b = m(() => {
+      if (!g.modelValue) return null;
+      const s = g.modelValue;
+      return s.measurement ? k.value.find((v) => v.value === s.measurement) ?? null : k.value.find((v) => v.value === null) ?? null;
+    });
+    return (s, v) => {
+      const T = _("FmSwitch"), h = _("FmSelect"), V = _("FmCard");
+      return w(), P(V, {
+        variant: "outlined",
+        class: "p-16 flex flex-col gap-16"
+      }, {
+        default: y(() => {
+          var R, I;
+          return [
+            r(T, {
+              value: "",
+              "model-value": c.value,
+              "onUpdate:modelValue": v[0] || (v[0] = (E) => c.value = E),
+              label: "Convertible",
+              sublabel: "Convertible from other recipe or ingredients",
+              labelPlacement: "right"
+            }, null, 8, ["model-value"]),
+            c.value ? (w(), J(ne, { key: 0 }, [
+              x("div", null, [
+                r(h, {
+                  label: "Recipes and ingredients convert to",
+                  modelValue: (R = b.value) == null ? void 0 : R.value,
+                  "onUpdate:modelValue": U,
+                  items: k.value
+                }, null, 8, ["modelValue", "items"])
+              ]),
+              r(Xe, {
+                id: l.value,
+                "model-value": ((I = s.modelValue) == null ? void 0 : I.inventoryBindings) ?? [],
+                "onUpdate:modelValue": u,
+                "exclude-binding-id": l.value
+              }, null, 8, ["id", "model-value", "exclude-binding-id"])
+            ], 64)) : G("", !0)
+          ];
+        }),
+        _: 1
+      });
+    };
+  }
+}), an = { class: "text-fm-color-typo-secondary" }, un = { class: "text-fm-color-typo-secondary whitespace-nowrap" }, sn = { class: "col-span-2 mt-16" }, rn = {
+  key: 1,
+  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"
+}, dn = /* @__PURE__ */ te({
+  __name: "IngredientForm",
+  props: {
+    mode: {},
+    modelValue: {},
+    disabled: { type: Boolean }
+  },
+  emits: ["update:modelValue", "click:submit"],
+  setup(A, { expose: C, emit: g }) {
+    var j;
+    const t = A, l = g, a = le(), c = nn(), k = Be();
+    function U(e) {
+      if (e.length === 0) return;
+      const n = e[0], o = t.modelValue ?? {
+        unit: a.units.find((i) => i)
+      };
+      o.unit || (o.unit = n, l("update:modelValue", o));
+    }
+    Ie(() => {
+      U(a.units);
+    }), Ae([() => a.units], ([e]) => {
+      U(e);
+    });
+    function u() {
+      l("click:submit");
+    }
+    const b = m({
+      get() {
+        var e;
+        return ((e = t.modelValue) == null ? void 0 : e.code) ?? "";
+      },
+      set(e) {
+        const n = t.modelValue ? {
+          ...t.modelValue
+        } : {};
+        n.code = e, l("update:modelValue", n);
+      }
+    }), s = m({
+      get() {
+        var e;
+        return ((e = t.modelValue) == null ? void 0 : e.name) ?? "";
+      },
+      set(e) {
+        const n = t.modelValue ? {
+          ...t.modelValue
+        } : {};
+        n.name = e, l("update:modelValue", n);
+      }
+    }), v = m({
+      get() {
+        var n, o;
+        const e = (o = (n = t.modelValue) == null ? void 0 : n.defaultCost) == null ? void 0 : o.costPerUnit;
+        return e ? +Ze(e) : 0;
+      },
+      set(e) {
+        var o, i, F, p;
+        const n = t.modelValue ? {
+          ...t.modelValue
+        } : {};
+        n.defaultCost ?? (n.defaultCost = {
+          costPerUnit: {
+            amount: 0,
+            precision: 2,
+            currency: ((o = fe(c.currentCountry.value)) == null ? void 0 : o.currency) ?? "MYR"
+          },
+          measurement: (p = (F = (i = t.modelValue) == null ? void 0 : i.unit) == null ? void 0 : F.measurements) == null ? void 0 : p.find(
+            (B) => {
+              var O;
+              return B.id === ((O = t.modelValue) == null ? void 0 : O.trackingMeasurement);
+            }
+          )
+        }), n.defaultCost.costPerUnit = {
+          ...n.defaultCost.costPerUnit,
+          ...en(+e, 4)
+        }, l("update:modelValue", n);
+      }
+    }), T = m(() => {
+      var n, o, i;
+      const e = ((n = t.modelValue) == null ? void 0 : n.unit) ?? a.units.find((F) => F);
+      return e ? {
+        _id: e._id,
+        measurement: (o = t.modelValue) == null ? void 0 : o.trackingMeasurement,
+        name: ((i = e.measurements.find((F) => {
+          var p;
+          return F.id === ((p = t.modelValue) == null ? void 0 : p.trackingMeasurement);
+        })) == null ? void 0 : i.name) ?? e.name
+      } : null;
+    }), h = m(
+      () => a.units.flatMap(({ name: e, _id: n, abbrev: o, measurements: i }) => [
+        {
+          label: `${e}`,
+          value: null,
+          displayAsSection: !0
+        },
+        {
+          label: `${e} (${o})`,
+          value: { _id: n },
+          displayAsSection: !1
+        },
+        ...i.map(({ id: F, name: p, abbrev: B }) => ({
+          label: `${p} (${B})`,
+          value: { _id: n, measurement: F },
+          displayAsSection: !1
+        }))
+      ])
+    );
+    function V(e) {
+      var n, o, i, F, p;
+      return ((o = (n = t.modelValue) == null ? void 0 : n.unit) == null ? void 0 : o._id) === ((i = e.value) == null ? void 0 : i._id) && ((F = t.modelValue) == null ? void 0 : F.trackingMeasurement) === ((p = e.value) == null ? void 0 : p.measurement);
+    }
+    function R(e) {
+      var B, O;
+      if (!e) return;
+      const { _id: n, measurement: o } = e, i = o || void 0, F = a.units.find((K) => K._id === n);
+      if (!F)
+        return;
+      const p = t.modelValue ?? {};
+      p.unit = F, p.trackingMeasurement = i, p.convert && (p.convert.measurement = i || null), k.enableTotalCost && (p.defaultCost = {
+        measurement: F.measurements.find((K) => K.id === i),
+        costPerUnit: {
+          ...((B = p.defaultCost) == null ? void 0 : B.costPerUnit) ?? {
+            amount: 0,
+            precision: 2,
+            currency: ((O = fe(c.currentCountry.value)) == null ? void 0 : O.currency) ?? "MYR"
+          }
+        }
+      }), l("update:modelValue", p);
+    }
+    const I = m({
+      get() {
+        var e;
+        return ((e = t.modelValue) == null ? void 0 : e.convert) ?? null;
+      },
+      set(e) {
+        const n = t.modelValue ? {
+          ...t.modelValue
+        } : {};
+        e ? n.convert = e : n.convert = null, l("update:modelValue", n);
+      }
+    }), E = m(() => N.options.filter(
+      (e) => e === N.enum.FIFO || e === N.enum.WAVG
+    ).map((e) => {
+      function n(o) {
+        switch (o) {
+          case N.enum.WAVG:
+            return "Weighted Average (WAVG)";
+          case N.enum.FIFO:
+            return "First In First Out (FIFO)";
+          case N.enum.LIFO:
+            return "Last In First Out (LIFO)";
+          case N.enum.FEFO:
+            return "First Expired First Out (FEFO)";
+        }
+        return "";
+      }
+      return {
+        label: n(e),
+        value: e
+      };
+    })), Q = m({
+      get() {
+        var e;
+        return ((e = t.modelValue) == null ? void 0 : e.valuation) ?? "WAVG";
+      },
+      set(e) {
+        const n = t.modelValue ? {
+          ...t.modelValue
+        } : {};
+        n.valuation = e, l("update:modelValue", n);
+      }
+    }), D = L();
+    C({
+      validateInputs: () => {
+        var e, n;
+        (n = (e = D.value) == null ? void 0 : e.validateInputs) == null || n.call(e);
+      },
+      resetInputsValidation: () => {
+        var e, n;
+        (n = (e = D.value) == null ? void 0 : e.resetInputsValidation) == null || n.call(e);
+      },
+      resetInputs: () => {
+        var e, n;
+        (n = (e = D.value) == null ? void 0 : e.resetInputs) == null || n.call(e);
+      }
+    });
+    const $ = L(!1), Y = m(
+      () => {
+        var e, n, o;
+        return (e = t.modelValue) != null && e._id ? ((o = a.menu.bindedBySkuId[(n = t.modelValue) == null ? void 0 : n._id]) == null ? void 0 : o.filter(
+          (i) => i.from === "INGREDIENT"
+        )) ?? [] : [];
+      }
+    ), q = m(
+      () => {
+        var e, n, o;
+        return (e = t.modelValue) != null && e._id ? ((o = a.menu.bindedBySkuId[(n = t.modelValue) == null ? void 0 : n._id]) == null ? void 0 : o.filter(
+          (i) => i.from === "RECIPE"
+        )) ?? [] : [];
+      }
+    ), W = m(
+      () => {
+        var e, n, o;
+        return (e = t.modelValue) != null && e._id ? ((o = a.menu.bindedBySkuId[(n = t.modelValue) == null ? void 0 : n._id]) == null ? void 0 : o.filter((i) => i.from === "MENU")) ?? [] : [];
+      }
+    ), z = m(
+      () => a.skus.map((e) => ({ label: e.name, value: e.code }))
+    ), X = L((j = t.modelValue) == null ? void 0 : j.code);
+    function Z(e) {
+      var o;
+      const n = e.el;
+      n && ((o = n.querySelector("[x-should-scroll-into=true]")) == null || o.scrollIntoView());
+    }
+    function H(e) {
+      switch (e) {
+        case ue.MY:
+          return "MYR";
+        case ue.SG:
+          return "SGD";
+        case ue.ID:
+          return "IDR";
+        default:
+          return "MYR";
+      }
+    }
+    return (e, n) => {
+      const o = _("FmTextField"), i = _("FmLabel"), F = _("FmSelect"), p = _("FmField"), B = _("FmMenuHeader"), O = _("FmMenuDivider"), K = _("FmMenuItem"), Se = _("FmMenu"), ke = _("FmFormGroup"), we = _("FmSwitch"), Me = _("FmForm");
+      return w(), P(Me, {
+        disabled: e.disabled,
+        ref_key: "formRef",
+        ref: D,
+        class: "grid grid-cols-2 gap-24",
+        onValidationSuccess: u
+      }, {
+        default: y(() => [
+          r(o, {
+            label: "Code",
+            "model-value": b.value,
+            "onUpdate:modelValue": n[0] || (n[0] = (f) => b.value = f),
+            rules: [d(se)(), d(je)(z.value, X.value)],
+            "label-mark": "required"
+          }, null, 8, ["model-value", "rules"]),
+          r(o, {
+            label: "Name",
+            "model-value": s.value,
+            "onUpdate:modelValue": n[1] || (n[1] = (f) => s.value = f),
+            rules: [d(se)()],
+            "label-mark": "required"
+          }, null, 8, ["model-value", "rules"]),
+          r(F, {
+            class: "col-span-2",
+            "model-value": Q.value,
+            "onUpdate:modelValue": n[2] || (n[2] = (f) => Q.value = f),
+            items: E.value
+          }, {
+            label: y(() => [
+              r(Fe, { "z-index": 50 }, {
+                default: y(() => [
+                  r(i, { label: "Valuation Method" })
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }, 8, ["model-value", "items"]),
+          r(ke, {
+            class: pe([d(k).enableTotalCost ? "col-span-1" : "col-span-2"]),
+            "model-value": T.value,
+            rules: [d(se)()],
+            "label-mark": "required"
+          }, {
+            label: y(() => [
+              r(i, { label: "Unit" })
+            ]),
+            default: y(({ invalid: f }) => [
+              r(Se, null, {
+                "menu-button": y(() => [
+                  r(p, {
+                    class: pe([
+                      "fm-typo-en-body-lg-400",
+                      {
+                        "text-fm-color-typo-primary": !e.disabled,
+                        "text-fm-color-typo-disabled": e.disabled
+                      }
+                    ]),
+                    invalid: f,
+                    "append-icon": "expand_more"
+                  }, {
+                    default: y(() => {
+                      var S;
+                      return [
+                        Ue(ae((S = T.value) == null ? void 0 : S.name), 1)
+                      ];
+                    }),
+                    _: 2
+                  }, 1032, ["class", "invalid"])
+                ]),
+                default: y(() => [
+                  x("div", {
+                    class: "overflow-x-hidden overflow-y-auto max-h-[300px]",
+                    onVnodeMounted: Z
+                  }, [
+                    (w(!0), J(ne, null, Ee(h.value, (S) => (w(), J(ne, {
+                      key: S.label
+                    }, [
+                      S.displayAsSection ? (w(), J(ne, { key: 0 }, [
+                        r(B, {
+                          label: S.label
+                        }, null, 8, ["label"]),
+                        r(O)
+                      ], 64)) : (w(), P(K, {
+                        key: 1,
+                        label: S.label,
+                        "model-value": V(S),
+                        onClick: (oe) => R(S.value),
+                        "x-should-scroll-into": `${V(S)}`
+                      }, null, 8, ["label", "model-value", "onClick", "x-should-scroll-into"]))
+                    ], 64))), 128))
+                  ], 512)
+                ]),
+                _: 2
+              }, 1024)
+            ]),
+            _: 1
+          }, 8, ["class", "model-value", "rules"]),
+          d(k).enableTotalCost ? (w(), P(o, {
+            key: 0,
+            "model-value": v.value,
+            "onUpdate:modelValue": n[3] || (n[3] = (f) => v.value = f),
+            rules: [d(Ke)(0), d(Je)(2)]
+          }, {
+            label: y(() => [
+              r(Fe, { "z-index": 50 }, {
+                default: y(() => [
+                  r(i, { label: "Price per unit" })
+                ]),
+                _: 1
+              })
+            ]),
+            prepend: y(() => {
+              var f, S;
+              return [
+                x("div", an, ae(H(((f = d(c).currentCountry) == null ? void 0 : f.value) ?? d(ge)) === "MYR" ? "RM" : H(((S = d(c).currentCountry) == null ? void 0 : S.value) ?? d(ge))), 1)
+              ];
+            }),
+            append: y(() => {
+              var f, S, oe, ie, de, me;
+              return [
+                x("div", un, " / " + ae(((ie = (oe = (S = (f = e.modelValue) == null ? void 0 : f.unit) == null ? void 0 : S.measurements) == null ? void 0 : oe.find((xe) => {
+                  var ce;
+                  return xe.id === ((ce = e.modelValue) == null ? void 0 : ce.trackingMeasurement);
+                })) == null ? void 0 : ie.abbrev) ?? ((me = (de = e.modelValue) == null ? void 0 : de.unit) == null ? void 0 : me.abbrev)), 1)
+              ];
+            }),
+            _: 1
+          }, 8, ["model-value", "rules"])) : G("", !0),
+          x("div", sn, [
+            r(on, {
+              "model-value": I.value,
+              "onUpdate:modelValue": n[4] || (n[4] = (f) => I.value = f),
+              "root-value": e.modelValue
+            }, null, 8, ["model-value", "root-value"])
+          ]),
+          e.mode !== d(M).CREATE ? (w(), J("div", rn, [
+            x("div", null, [
+              r(we, {
+                label: "Show binded items",
+                modelValue: $.value,
+                "onUpdate:modelValue": n[5] || (n[5] = (f) => $.value = f),
+                "label-placement": "right"
+              }, null, 8, ["modelValue"])
+            ]),
+            $.value && Y.value.length ? (w(), P(re, {
+              key: 0,
+              name: "Ingredient",
+              bindings: Y.value
+            }, null, 8, ["bindings"])) : G("", !0),
+            $.value && q.value.length ? (w(), P(re, {
+              key: 1,
+              name: "Recipe",
+              bindings: q.value
+            }, null, 8, ["bindings"])) : G("", !0),
+            $.value && W.value.length ? (w(), P(re, {
+              key: 2,
+              name: "Menu",
+              bindings: W.value
+            }, null, 8, ["bindings"])) : G("", !0)
+          ])) : G("", !0)
+        ]),
+        _: 1
+      }, 8, ["disabled"]);
+    };
+  }
+}), mn = { class: "flex gap-4" }, cn = /* @__PURE__ */ te({
+  __name: "IngredientDialog",
+  props: {
+    show: { type: Boolean },
+    unit: {},
+    mode: { default: M.READ }
+  },
+  emits: ["update:show"],
+  setup(A) {
+    const C = A, g = le(), t = he(), l = Ve(C, "show"), a = Ve(C, "unit"), c = m(() => {
+      switch (C.mode) {
+        case M.READ:
+          return "View ingredient";
+        case M.UPDATE:
+          return "Edit ingredient";
+        case M.CREATE:
+          return "Add ingredient";
+      }
+      return "";
+    }), k = m(() => {
+      switch (C.mode) {
+        case M.READ:
+          return "";
+        case M.UPDATE:
+          return "Save";
+        case M.CREATE:
+          return "Add";
+      }
+      return "";
+    }), U = L(), u = L(!1);
+    async function b() {
+      u.value = !0;
+      try {
+        await g.createSku(a.value), l.value = !1, t.open({
+          title: "Success",
+          message: "Created " + a.value.name,
+          type: "success"
+        });
+      } catch (h) {
+        h instanceof be || t.open({
+          title: "Failed to create ingredient",
+          message: "Please try again",
+          type: "error"
+        });
+      } finally {
+        u.value = !1;
+      }
+    }
+    async function s() {
+      u.value = !0;
+      try {
+        await g.updateSku(a.value), u.value = !1, l.value = !1, t.open({
+          title: "Success",
+          message: "Updated " + a.value.name,
+          type: "success"
+        });
+      } catch (h) {
+        h instanceof be || t.open({
+          title: "Failed to update ingredient",
+          message: "Please try again",
+          type: "error"
+        });
+      } finally {
+        u.value = !1;
+      }
+    }
+    function v() {
+      var h, V;
+      (V = (h = U.value) == null ? void 0 : h.validateInputs) == null || V.call(h);
+    }
+    function T() {
+      switch (C.mode) {
+        case M.READ:
+          return;
+        case M.UPDATE:
+          return s();
+        case M.CREATE:
+          return b();
+      }
+    }
+    return (h, V) => {
+      const R = _("FmButton"), I = _("FmSideSheet");
+      return w(), P(I, {
+        "model-value": d(l),
+        "onUpdate:modelValue": V[3] || (V[3] = (E) => ve(l) ? l.value = E : null),
+        header: c.value,
+        "close-button": "",
+        "dismiss-away": "",
+        "max-width": 500
+      }, {
+        "side-sheet-footer": y(() => [
+          x("div", mn, [
+            r(R, {
+              loading: u.value,
+              label: k.value,
+              onClick: v
+            }, null, 8, ["loading", "label"]),
+            r(R, {
+              disabled: u.value,
+              label: "Close",
+              variant: "tertiary",
+              onClick: V[2] || (V[2] = (E) => l.value = !1)
+            }, null, 8, ["disabled"])
+          ])
+        ]),
+        default: y(() => [
+          r(dn, {
+            class: "w-full",
+            ref_key: "hasValidationExpose",
+            ref: U,
+            modelValue: d(a),
+            "onUpdate:modelValue": V[0] || (V[0] = (E) => ve(a) ? a.value = E : null),
+            mode: h.mode,
+            disabled: u.value,
+            "onClick:submit": V[1] || (V[1] = (E) => T())
+          }, null, 8, ["modelValue", "mode", "disabled"])
+        ]),
+        _: 1
+      }, 8, ["model-value", "header"]);
+    };
+  }
+}), pn = { class: "px-24 xs:p-0 sm:p-0 flex flex-col gap-8 max-h-full" }, vn = { class: "px-8 flex items-center xs:gap-0 xs:flex-col-reverse sm:gap-0 sm:flex-col-reverse" }, fn = { class: "flex-1 w-full" }, gn = { class: "flex flex-col py-8" }, bn = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Vn = { class: "fm-typo-en-body-lg-600 text-fm-color-typo-primary" }, Rn = /* @__PURE__ */ te({
+  __name: "IngredientsView",
+  setup(A) {
+    const C = le(), g = m(() => C.skus), t = Le(), {
+      createIngredient: l,
+      updateIngredient: a,
+      deleteIngredient: c,
+      ingredientDialogProps: k,
+      ingredientViewLoading: U
+    } = tn(), { columnDefs: u } = ln({ updateIngredient: a, deleteIngredient: c });
+    function b(R) {
+      R === "add" && l();
+    }
+    const s = L(""), v = m(() => U.value), { breakpoints: T } = Ne(), h = m(() => T.value.xs || T.value.sm ? 10 : 20), V = We();
+    return (R, I) => {
+      const E = _("FmTableToolbar"), Q = _("FmTable");
+      return w(), P(He, {
+        title: "Ingredient",
+        actions: [{ label: "Add ingredient", value: "add", isPrimary: !0, prependIcon: "add" }],
+        "onClick:action": b
+      }, {
+        default: y(() => [
+          x("div", pn, [
+            x("div", vn, [
+              x("div", fn, [
+                r(E, {
+                  searchable: "",
+                  "search-model": s.value,
+                  "onUpdate:searchModel": I[0] || (I[0] = (D) => s.value = D)
+                }, null, 8, ["search-model"])
+              ])
+            ]),
+            r(Q, {
+              style: Re(d(V).tableHeight),
+              "column-defs": d(u),
+              "row-data": g.value,
+              "search-value": s.value,
+              loading: !d(t)._currentLocation || v.value,
+              onRowClick: I[1] || (I[1] = (D) => d(a)(D.original)),
+              "page-size": h.value
+            }, {
+              "list-row": y((D) => [
+                r(qe, {
+                  row: D,
+                  onRowClick: d(a)
+                }, {
+                  default: y(($) => {
+                    var Y, q, W, z, X, Z, H, j, e, n;
+                    return [
+                      x("div", gn, [
+                        x("div", bn, [
+                          r(d(_e), {
+                            render: (W = (q = (Y = $.code) == null ? void 0 : Y.column) == null ? void 0 : q.columnDef) == null ? void 0 : W.cell,
+                            props: (X = (z = $.code) == null ? void 0 : z.getContext) == null ? void 0 : X.call(z)
+                          }, null, 8, ["render", "props"])
+                        ]),
+                        x("div", Vn, [
+                          r(d(_e), {
+                            render: (j = (H = (Z = $.name) == null ? void 0 : Z.column) == null ? void 0 : H.columnDef) == null ? void 0 : j.cell,
+                            props: (n = (e = $.name) == null ? void 0 : e.getContext) == null ? void 0 : n.call(e)
+                          }, null, 8, ["render", "props"])
+                        ])
+                      ])
+                    ];
+                  }),
+                  _: 2
+                }, 1032, ["row", "onRowClick"])
+              ]),
+              _: 1
+            }, 8, ["style", "column-defs", "row-data", "search-value", "loading", "page-size"])
+          ]),
+          (w(), P(De, { to: "body" }, [
+            r(cn, $e(Pe(d(k))), null, 16)
+          ]))
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+export {
+  Rn as default
+};