import { getCurrentInstance as U, defineComponent as $, computed as g, onMounted as O, h as z, resolveComponent as k, createBlock as F, openBlock as u, unref as t, withCtx as p, createElementBlock as f, Fragment as V, createElementVNode as r, createVNode as i, isRef as I, normalizeClass as L, renderList as R, toDisplayString as C, withModifiers as w, createCommentVNode as G } from "vue";
import { useI18n as N } from "@feedmepos/mf-common";
import { useDialog as Y, useSnackbar as D, FmButtonVariant as M, components as Q, useBreakpoints as q } from "@feedmepos/ui-library";
import { _ as H } from "./ResponsiveFabButton.vue_vue_type_script_setup_true_lang-Cn-3MRBO.js";
import { _ as J } from "./app-D-J2cjak.js";
import { G as K, u as P, Q as j, M as W, A as X, a5 as Z } from "./index.vue_vue_type_script_setup_true_lang-BMVa5UfU.js";
import { V as S } from "./index-BYTA6gab.js";
import { _ as ee } from "./PageLayout.vue_vue_type_script_setup_true_lang-2f0QfweQ.js";
import { u as te } from "./search-BAPEUu1R.js";
import { defineStore as ne } from "pinia";
import { c as oe } from "./createComponentProgrammatically-Bt2rn1IQ.js";
const ae = ne("variant-manager", () => {
  const B = Y(), o = D(), _ = K(o), h = j(_);
  P();
  const d = U(), { t: c } = N(), x = (l) => {
    var y, a;
    const { vNode: b } = oe(
      S,
      d,
      l
    );
    (a = (y = b.component) == null ? void 0 : y.exposed) == null || a.trigger();
  };
  async function m(l) {
    x({
      initialValue: l
    });
  }
  async function v(l) {
    B.open({
      title: c("menu.common.dialog.remove.variant.title"),
      message: c("menu.common.dialog.remove.variant.message", { name: l.name }),
      primaryActions: {
        text: c("menu.common.actions.remove"),
        close: !0,
        variant: M.Destructive
      },
      secondaryActions: {
        text: c("menu.common.actions.cancel"),
        close: !0
      }
    }).onPrimary(async () => {
      await h.updateMenu(
        {
          module: X.F_MENU_MODULE_V4_KEY.enum.variant,
          operation: W.F_OPERATION_TYPE.delete,
          data: l._id
        },
        l.name,
        !0
      );
    });
  }
  return {
    deleteVariant: v,
    updateVariant: m
  };
}), le = {
  key: 0,
  class: "flex-1 flex flex-col overflow-hidden max-h-[calc(100vh-56px)] gap-8"
}, se = {
  class: "flex justify-end"
}, re = {
  class: "w-[320px]"
}, ie = {
  class: "px-16 py-8"
}, ce = {
  class: /* @__PURE__ */ L(["flex-1", "overflow-scroll", "divide-y divide-fm-color-neutral-gray-100", "pb-64"])
}, me = ["onClick"], ue = {
  class: "flex-1 space-y-4"
}, de = {
  class: "fm-typo-en-body-lg-600"
}, pe = {
  class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary"
}, fe = {
  class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary"
}, _e = {
  key: 1,
  class: "xs:pt-16"
}, Se = /* @__PURE__ */ $({
  __name: "Variant",
  setup(B) {
    const {
      t: o
    } = N(), _ = P(), h = j(K(D())), d = ae(), c = g(() => _.variants.map((a) => ({
      ...a,
      usedBy: _.items.filter((e) => {
        var s;
        return (s = e.variant) == null ? void 0 : s.variantGroupIds.includes(a._id);
      }).map(({
        _id: e
      }) => ({
        _id: e
      }))
    }))), {
      filter: x,
      searchKey: m
    } = te(), v = g(() => c.value.filter((a) => {
      var e;
      return x([a.name, ...((e = a.options) == null ? void 0 : e.map((s) => s.name)) ?? []]);
    }));
    O(() => _.selectCatalog(null));
    const l = g(() => [{
      accessorKey: "name",
      header: () => o("menu.variant.columns.name"),
      size: 360,
      enableSorting: !1
    }, {
      accessorKey: "options",
      header: () => o("menu.variant.columns.options"),
      size: 560,
      enableSorting: !1,
      cell: (a) => {
        var e;
        return (e = a.getValue()) == null ? void 0 : e.map((s) => s.name).join(", ");
      }
    }, {
      accessorKey: "usedBy",
      header: () => o("menu.variant.columns.applied_products"),
      enableSorting: !1,
      size: 180,
      cell: (a) => o("menu.common.labels.items_linked", {
        count: a.getValue().length
      })
    }, {
      id: "action",
      size: 52,
      meta: {
        cellClass: "pl-16",
        headerContentClass: "-mx-16"
      },
      cell: (a) => z("div", {
        class: "w-full flex justify-end items-center"
      }, [z(Q.FmButton, {
        prependIcon: "delete",
        variant: M.Tertiary,
        textColor: "neutral-gray-400",
        onClick: (e) => {
          e.stopPropagation(), d.deleteVariant(a.row.original);
        }
      })])
    }]), b = q(), y = g(() => b.breakpoints.value.xs);
    return (a, e) => {
      const s = k("fm-search"), A = k("fm-table"), E = k("fm-button");
      return u(), F(ee, {
        heading: t(o)("menu.variant.title")
      }, {
        "append-heading": p(() => [c.value.length ? (u(), F(t(S), {
          key: 0
        }, {
          default: p(({
            trigger: n
          }) => [i(H, {
            class: "ml-auto",
            label: t(o)("menu.variant.add"),
            "prepend-icon": "add",
            onClick: w(n, ["stop"])
          }, null, 8, ["label", "onClick"])]),
          _: 1
        })) : G("", !0)]),
        default: p(() => [c.value.length ? (u(), f(V, {
          key: 0
        }, [y.value ? (u(), f(V, {
          key: 1
        }, [r("div", ie, [i(s, {
          autofocus: "",
          modelValue: t(m),
          "onUpdate:modelValue": e[2] || (e[2] = (n) => I(m) ? m.value = n : null),
          placeholder: t(o)("menu.common.labels.search_placeholder", {
            type: "variants"
          })
        }, null, 8, ["modelValue", "placeholder"])]), r("div", ce, [(u(!0), f(V, null, R(v.value, (n) => (u(), f("div", {
          key: n._id,
          class: L(["py-12 px-16", "flex  space-x-8", "items-center", "cursor-pointer"]),
          onClick: () => t(d).updateVariant(n)
        }, [r("div", ue, [r("p", de, C(n.name), 1), r("div", null, [r("p", pe, C(t(o)("menu.common.labels.items_linked", {
          count: n.usedBy.length
        })), 1), r("p", fe, C(t(o)("menu.variant.mobile.value", {
          values: n.options.map((T) => T.name).join(", ")
        })), 1)])]), i(E, {
          variant: t(M).Tertiary,
          "prepend-icon": "delete",
          "text-color": "neutral-gray-400",
          onClick: w(() => t(d).deleteVariant(n), ["stop"])
        }, null, 8, ["variant", "onClick"])], 8, me))), 128))])], 64)) : (u(), f("div", le, [r("div", se, [r("div", re, [i(s, {
          autofocus: "",
          modelValue: t(m),
          "onUpdate:modelValue": e[0] || (e[0] = (n) => I(m) ? m.value = n : null),
          placeholder: t(o)("menu.common.labels.search_placeholder", {
            type: "variants"
          })
        }, null, 8, ["modelValue", "placeholder"])])]), i(J, null, {
          default: p(() => [i(A, {
            "column-defs": l.value,
            loading: t(h).checkMenuIsLoading(),
            "page-size": v.value.length,
            "row-data": v.value,
            "shrink-at": !1,
            class: "flex-1 overflow-hidden",
            "hide-footer": "",
            "pin-header-row": "",
            onRowClick: e[1] || (e[1] = (n) => {
              t(d).updateVariant(n.original);
            })
          }, null, 8, ["column-defs", "loading", "page-size", "row-data"])]),
          _: 1
        })]))], 64)) : (u(), f("div", _e, [i(Z, {
          subtitle: t(o)("menu.variant.empty.subtitle"),
          title: t(o)("menu.variant.empty.title")
        }, {
          action: p(() => [i(t(S), null, {
            default: p(({
              trigger: n
            }) => [i(E, {
              "prepend-icon": "add",
              label: t(o)("menu.variant.add"),
              onClick: w(n, ["stop"])
            }, null, 8, ["label", "onClick"])]),
            _: 1
          })]),
          _: 1
        }, 8, ["subtitle", "title"])]))]),
        _: 1
      }, 8, ["heading"]);
    };
  }
});
export {
  Se as default
};
