import { defineComponent as z, computed as h, ref as w, reactive as Q, watch as W, resolveComponent as V, createElementBlock as F, openBlock as g, Fragment as C, renderSlot as X, createVNode as d, unref as e, withCtx as x, createElementVNode as r, toDisplayString as S, getCurrentInstance as Z, h as D, withModifiers as L, createBlock as I, createCommentVNode as ee, normalizeClass as K, renderList as te } from "vue";
import { useI18n as U } from "@feedmepos/mf-common";
import { useSnackbar as A, components as j, useDialog as ne, FmButtonVariant as G, useBreakpoints as oe } from "@feedmepos/ui-library";
import { _ as ae } from "./ResponsiveFabButton.vue_vue_type_script_setup_true_lang-Cn-3MRBO.js";
import { _ as le } from "./app-D-J2cjak.js";
import { Q as q, G as $, I as ie, D as P, J as se, H as Y, M as O, A as T, u as H, a5 as re } from "./index.vue_vue_type_script_setup_true_lang-BMVa5UfU.js";
import { _ as ce } from "./PageLayout.vue_vue_type_script_setup_true_lang-2f0QfweQ.js";
import { defineStore as ue } from "pinia";
import { _ as B, g as me } from "./InventoryBinding.vue_vue_type_script_setup_true_lang-Z6-d-lro.js";
import { u as de } from "./discardConfirm-BHni0LNu.js";
import { c as pe } from "./check-C9mY6LiX.js";
import "./unit-qhvUQfBE.js";
import { c as fe } from "./createComponentProgrammatically-Bt2rn1IQ.js";
const _e = { class: "fm-typo-en-title-md-600" }, ve = { class: "pt-8 space-y-40" }, ye = { class: "flex flex-row gap-16" }, ge = { class: "flex gap-8 items-center justify-start" }, be = /* @__PURE__ */ z({
  __name: "Form",
  props: {
    initialValue: { default: void 0 },
    invalidSkuAndRecipe: {}
  },
  setup(R, { expose: c }) {
    const { t: u } = U(), p = R, f = q($(A())), b = h(() => p.initialValue ? u("menu.recipe.update") : u("menu.recipe.add")), _ = h(
      () => p.initialValue ? u("menu.common.actions.update") : u("menu.common.actions.add")
    ), v = w(!1), a = w(!1), k = (t) => {
      pe.isBoolean(t) ? a.value = t : a.value = !a.value;
    }, n = Q(
      p.initialValue ? ie(p.initialValue) : P.generator.initRecipe()
    ), E = h(() => p.invalidSkuAndRecipe.skus), o = h(() => p.invalidSkuAndRecipe.recipes), y = de(
      () => !se.isEqual(n, p.initialValue || P.generator.initRecipe()),
      () => {
        a.value = !1;
      }
    ), l = async () => {
      try {
        const t = {
          ...n,
          name: n.name.trim()
        };
        p.initialValue ? await f.updateMenu(
          {
            module: T.F_MENU_MODULE_V4_KEY.enum.recipe,
            operation: O.F_OPERATION_TYPE.update,
            data: t
          },
          t.name
        ) : await f.updateMenu(
          {
            module: T.F_MENU_MODULE_V4_KEY.enum.recipe,
            operation: O.F_OPERATION_TYPE.create,
            data: t
          },
          t.name
        ), k(!1);
      } finally {
        v.value = !1;
      }
    };
    return W(
      () => a.value,
      (t) => {
      }
    ), c({
      show: a,
      trigger: k
    }), (t, i) => {
      const N = V("FmTextField"), M = V("FmFormGroup"), s = V("fm-button"), J = V("fm-side-sheet");
      return g(), F(C, null, [
        X(t.$slots, "default", { trigger: k }),
        d(J, {
          id: "unit-form",
          modelValue: a.value,
          "onUpdate:modelValue": i[5] || (i[5] = (m) => a.value = m),
          "is-container": e(j).FmForm,
          "is-container-props": {
            onValidationSuccess: l,
            blameFormChildOnValidationFailed: !0
          },
          "max-width": 560,
          "onOn:clickedAway": e(y)
        }, {
          "side-sheet-header": x(() => [
            r("p", _e, S(b.value), 1)
          ]),
          "side-sheet-footer": x(() => [
            r("div", ge, [
              d(s, {
                label: _.value,
                loading: v.value,
                size: "lg",
                type: "submit",
                variant: "primary"
              }, null, 8, ["label", "loading"]),
              d(s, {
                label: e(u)("menu.common.actions.cancel"),
                size: "lg",
                variant: "tertiary",
                onClick: i[4] || (i[4] = () => a.value = !1)
              }, null, 8, ["label"])
            ])
          ]),
          default: x(() => [
            r("div", ve, [
              r("div", ye, [
                d(N, {
                  class: "flex-2",
                  label: e(u)("menu.recipe.columns.name"),
                  modelValue: n.name,
                  "onUpdate:modelValue": i[0] || (i[0] = (m) => n.name = m),
                  autofocus: "",
                  rules: [
                    (m) => !!m || e(u)("menu.common.validation.required", {
                      field: e(u)("menu.recipe.columns.name").toLowerCase()
                    })
                  ]
                }, null, 8, ["label", "modelValue", "rules"])
              ]),
              d(M, {
                modelValue: n.contains,
                "onUpdate:modelValue": i[3] || (i[3] = (m) => n.contains = m),
                rules: [(m) => m.length > 0 || e(u)("menu.recipe.validation.bind_required")]
              }, {
                default: x(() => [
                  d(B, {
                    modelValue: n.contains,
                    "onUpdate:modelValue": i[1] || (i[1] = (m) => n.contains = m),
                    type: e(Y.F_INVENTORY_BINDING_TYPE).enum.RECIPE,
                    "filter-option-ids": o.value
                  }, null, 8, ["modelValue", "type", "filter-option-ids"]),
                  d(B, {
                    modelValue: n.contains,
                    "onUpdate:modelValue": i[2] || (i[2] = (m) => n.contains = m),
                    type: e(Y.F_INVENTORY_BINDING_TYPE).enum.SKU,
                    "filter-option-ids": E.value
                  }, null, 8, ["modelValue", "type", "filter-option-ids"])
                ]),
                _: 1
              }, 8, ["modelValue", "rules"])
            ])
          ]),
          _: 1
        }, 8, ["modelValue", "is-container", "is-container-props", "onOn:clickedAway"])
      ], 64);
    };
  }
}), he = be, Ve = ue("recipe-manager", () => {
  const R = ne(), c = A(), u = $(c), p = q(u), f = H(), b = Z(), { t: _ } = U(), v = (o) => {
    var l, t;
    const { vNode: y } = fe(
      he,
      b,
      o
    );
    (t = (l = y.component) == null ? void 0 : l.exposed) == null || t.trigger();
  };
  async function a(o) {
    v({
      initialValue: o,
      invalidSkuAndRecipe: o ? me({
        id: o._id,
        skus: f.skus,
        recipes: f.state.menu.modules.recipe
      }) : { skus: [], recipes: [] }
    });
  }
  async function k() {
    a();
  }
  async function n(o) {
    a(o);
  }
  async function E(o) {
    R.open({
      title: _("menu.common.dialog.remove.recipe.title"),
      message: _("menu.common.dialog.remove.recipe.message", { name: o.name }),
      primaryActions: {
        text: _("menu.common.actions.remove"),
        close: !0,
        variant: G.Destructive
      },
      secondaryActions: {
        text: _("menu.common.actions.cancel"),
        close: !0
      }
    }).onPrimary(async () => {
      await p.updateMenu(
        {
          module: T.F_MENU_MODULE_V4_KEY.enum.recipe,
          operation: O.F_OPERATION_TYPE.delete,
          data: o._id
        },
        o.name,
        !0
      );
    });
  }
  return {
    createRecipe: k,
    updateRecipe: n,
    deleteRecipe: E
  };
}), ke = {
  key: 0,
  class: "h-[600px]"
}, xe = {
  class: "flex justify-end items-center"
}, Fe = {
  class: "flex justify-end items-center my-8 px-16"
}, Ee = {
  class: /* @__PURE__ */ K(["flex-1", "overflow-scroll", "divide-y divide-fm-color-neutral-gray-100", "pb-64"])
}, Re = ["onClick"], Ce = {
  class: "flex-1"
}, Se = {
  class: "fm-typo-en-body-lg-600 mb-4"
}, we = {
  class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary"
}, Ne = {
  class: "flex-1 flex justify-between gap-8 pl-8"
}, Me = {
  class: "flex items-center"
}, Ie = {
  class: "bg-fm-color-neutral-gray-100 rounded-md px-8 py-4"
}, Oe = {
  class: "fm-typo-en-body-md-600 font-semibold"
}, qe = /* @__PURE__ */ z({
  __name: "Recipe",
  setup(R) {
    const {
      t: c
    } = U(), u = A();
    $(u);
    const p = H(), f = Ve(), b = h(() => p.recipes), _ = h(() => b.value.filter((y) => `${y.name}`.toLowerCase().includes(v.value.toLowerCase()))), v = w(""), a = w([{
      accessorKey: "name",
      header: () => c("menu.recipe.table.columns.name"),
      enableSorting: !1
    }, {
      accessorKey: "ingredients",
      header: () => c("menu.recipe.table.columns.ingredients"),
      enableSorting: !1
    }, {
      id: "actions",
      size: 52,
      meta: {
        cellClass: "pl-16",
        headerContentClass: "-mx-16"
      },
      header: "",
      cell: (y) => {
        const l = y.row.original;
        return D("div", {
          class: "flex justify-end"
        }, [D(j.FmButton, {
          icon: "delete",
          textColor: "neutral-gray-400",
          variant: "tertiary",
          onClick: L(async () => {
            f.deleteRecipe(l);
          }, ["stop", "prevent"])
        })]);
      }
    }]);
    function k(y) {
      f.updateRecipe(y);
    }
    const n = h(() => b.value.length), E = oe(), o = h(() => E.breakpoints.value.xs);
    return (y, l) => {
      const t = V("FmSearch"), i = V("FmTable"), N = V("fm-button"), M = V("FmSpacer");
      return g(), I(ce, {
        heading: e(c)("menu.recipe.title")
      }, {
        default: x(() => [b.value.length === 0 ? (g(), I(e(re), {
          key: 0,
          action: {
            text: e(c)("menu.recipe.empty.action"),
            callback() {
              e(f).createRecipe();
            }
          },
          subtitle: e(c)("menu.recipe.empty.subtitle"),
          title: e(c)("menu.recipe.empty.title")
        }, null, 8, ["action", "subtitle", "title"])) : (g(), F(C, {
          key: 1
        }, [o.value ? (g(), F(C, {
          key: 1
        }, [r("div", Fe, [d(t, {
          modelValue: v.value,
          "onUpdate:modelValue": l[2] || (l[2] = (s) => v.value = s),
          autofocus: "",
          class: "w-full",
          placeholder: e(c)("menu.recipe.table.search.placeholder")
        }, null, 8, ["modelValue", "placeholder"])]), r("div", Ee, [(g(!0), F(C, null, te(_.value, (s) => (g(), F("div", {
          key: s._id,
          class: K(["py-12 px-16", "flex  space-x-8", "items-center", "cursor-pointer"]),
          onClick: () => e(f).updateRecipe(s)
        }, [r("div", Ce, [r("p", Se, S(s.name), 1), r("p", we, S(s.ingredients), 1)]), d(N, {
          variant: e(G).Tertiary,
          "prepend-icon": "delete",
          "text-color": "neutral-gray-400",
          onClick: L(() => e(f).deleteRecipe(s), ["stop"])
        }, null, 8, ["variant", "onClick"])], 8, Re))), 128))])], 64)) : (g(), F("div", ke, [r("div", xe, [d(t, {
          modelValue: v.value,
          "onUpdate:modelValue": l[0] || (l[0] = (s) => v.value = s),
          autofocus: "",
          class: "mb-8 w-[320px]",
          placeholder: e(c)("menu.recipe.table.search.placeholder")
        }, null, 8, ["modelValue", "placeholder"])]), d(le, null, {
          default: x(() => [d(i, {
            "column-defs": a.value,
            "page-size": _.value.length,
            "row-data": _.value,
            "shrink-at": !1,
            "hide-footer": "",
            "pin-header-row": "",
            onRowClick: l[1] || (l[1] = (s) => k(s.original))
          }, null, 8, ["column-defs", "page-size", "row-data"])]),
          _: 1
        })]))], 64))]),
        "append-heading": x(() => [r("div", Ne, [r("div", Me, [r("div", Ie, [r("p", Oe, S(n.value), 1)])]), d(M), b.value.length > 0 ? (g(), I(ae, {
          key: 0,
          label: e(c)("menu.recipe.actions.add"),
          "prepend-icon": "add",
          onClick: e(f).createRecipe
        }, null, 8, ["label", "onClick"])) : ee("", !0)])]),
        _: 1
      }, 8, ["heading"]);
    };
  }
});
export {
  qe as default
};
