import { reactive as D, onUnmounted as R, defineComponent as j, ref as X, computed as g, resolveComponent as C, openBlock as t, createElementBlock as c, Fragment as p, createElementVNode as v, normalizeClass as B, unref as F, createTextVNode as Y, toDisplayString as N, renderSlot as M, createCommentVNode as b, createBlock as r, renderList as U, withCtx as y, createVNode as f, Teleport as H } from "vue";
import { useBreakpoints as G } from "@feedmepos/ui-library";
import { F as O } from "./FmAdminBadge-DjnBAgyv.js";
import { useI18n as J, useCoreStore as K } from "@feedmepos/mf-common";
const S = D({});
function Q() {
  const h = `${Math.random()}`, k = new ResizeObserver((d) => {
    const u = d.map((s) => s.target.scrollHeight).reduce((s, l) => s + l);
    S[h] = u;
  }), x = (d) => {
    const u = d.el;
    u && k.observe(u);
  }, i = (d) => {
    const u = d.el;
    u && k.unobserve(u);
  };
  return R(() => {
    k.disconnect(), delete S[h];
  }), {
    get tableHeight() {
      return {
        height: `calc(100dvh - ${Object.values(S).reduce((s, l) => s + l, 0) + 80}px)`
      };
    },
    onMounted: x,
    onUnmounted: i
  };
}
const W = {
  key: 0,
  class: /* @__PURE__ */ B(["text-fm-color-typo-secondary fm-typo-en-body-sm-400"])
}, Z = { class: "bg-white flex-1" }, ee = { class: "fixed bottom-96 right-16" }, _ = 3, re = /* @__PURE__ */ j({
  __name: "SingleColumnLayout",
  props: {
    actions: { default: () => [] },
    title: { default: "Title" },
    description: {},
    showBackButton: { type: Boolean },
    defaultPadding: { type: Boolean },
    breadcrumbs: { default: () => [] },
    helperText: {}
  },
  emits: ["click:action"],
  setup(h, { emit: k }) {
    const x = h, i = k, { t: d } = J(), u = K(), s = X(!1), l = g(() => x.actions.find((n) => n.isPrimary)), A = g(() => x.actions.filter((n) => !n.isPrimary)), $ = g(() => A.value.filter((n) => !n.mobileOnly)), E = g(
      () => A.value.filter((n) => {
        var a;
        return n.isAdminOnly ?? !1 ? (a = u.sessionUser.value) == null ? void 0 : a.role.isAdmin : !0;
      }).map(
        (n) => ({
          label: `${n.label} ${n.isAdminOnly == !0 ? "(Admin only)" : ""}`,
          value: n.value
        })
      )
    ), { breakpoints: w } = G(), m = g(() => w.value.xs || w.value.sm), V = Q();
    return (n, o) => {
      var T;
      const a = C("FmButton"), L = C("FmMenuItem"), z = C("FmMenu"), P = C("FmCollapsibleTabs"), q = C("FmBottomSheet");
      return t(), c(p, null, [
        v("div", {
          class: B([
            "flex flex-col w-full bg-white h-full",
            {
              "gap-12": m.value
            }
          ])
        }, [
          v("div", {
            onVnodeMounted: o[3] || (o[3] = //@ts-ignore
            (...e) => F(V).onMounted && F(V).onMounted(...e)),
            class: B([
              "flex gap-8 items-center",
              {
                "p-12 border-b-[1px] border-b-fm-color-neutral-gray-100": m.value,
                "px-24 py-16": !m.value
              }
            ])
          }, [
            v("div", {
              class: B([
                "flex-1 flex flex-col gap-4 fm-typo-en-title-md-600 bg-white",
                {
                  "py-12": m.value
                }
              ])
            }, [
              v("div", null, [
                Y(N(n.title) + " ", 1),
                M(n.$slots, "headerInfo")
              ]),
              n.helperText ? (t(), c("div", W, N(n.helperText), 1)) : b("", !0)
            ], 2),
            m.value ? (t(), c(p, { key: 0 }, [
              A.value.length ? (t(), r(a, {
                key: 0,
                variant: "tertiary",
                "prepend-icon": "more_vert",
                onClick: o[0] || (o[0] = (e) => s.value = !0)
              })) : b("", !0)
            ], 64)) : (t(), c(p, { key: 1 }, [
              (t(!0), c(p, null, U($.value.slice(0, _), (e) => (t(), c(p, {
                key: e.value
              }, [
                e.isAdminOnly ? (t(), r(O, { key: 0 }, {
                  default: y(() => [
                    f(a, {
                      label: e.label,
                      "prepend-icon": e.prependIcon,
                      variant: e.variant,
                      "bg-color": e.variant ? void 0 : "neutral-gray-100",
                      "text-color": e.variant ? void 0 : "neutral-gray-400",
                      onClick: (I) => i("click:action", e.value)
                    }, null, 8, ["label", "prepend-icon", "variant", "bg-color", "text-color", "onClick"])
                  ]),
                  _: 2
                }, 1024)) : (t(), r(a, {
                  key: 1,
                  label: e.label,
                  "prepend-icon": e.prependIcon,
                  variant: e.variant,
                  "bg-color": e.variant ? void 0 : "neutral-gray-100",
                  "text-color": e.variant ? void 0 : "neutral-gray-400",
                  onClick: (I) => i("click:action", e.value)
                }, null, 8, ["label", "prepend-icon", "variant", "bg-color", "text-color", "onClick"]))
              ], 64))), 128)),
              $.value.length > _ ? (t(), r(z, { key: 0 }, {
                "menu-button": y(() => [
                  f(a, {
                    label: F(d)("inventory.common.more"),
                    "append-icon": "expand_more",
                    "bg-color": "neutral-gray-100",
                    "text-color": "neutral-gray-400"
                  }, null, 8, ["label"])
                ]),
                default: y(() => [
                  (t(!0), c(p, null, U($.value.slice(_), (e, I) => (t(), r(L, {
                    key: I,
                    label: e.label,
                    onClick: (le) => i("click:action", e.value)
                  }, null, 8, ["label", "onClick"]))), 128))
                ]),
                _: 1
              })) : b("", !0),
              M(n.$slots, "header-end"),
              (T = l.value) != null && T.isAdminOnly ? (t(), r(O, { key: 1 }, {
                default: y(() => [
                  f(a, {
                    label: l.value.label,
                    "prepend-icon": l.value.prependIcon,
                    onClick: o[1] || (o[1] = (e) => i("click:action", l.value.value))
                  }, null, 8, ["label", "prepend-icon"])
                ]),
                _: 1
              })) : l.value ? (t(), r(a, {
                key: 2,
                label: l.value.label,
                "prepend-icon": l.value.prependIcon,
                onClick: o[2] || (o[2] = (e) => i("click:action", l.value.value))
              }, null, 8, ["label", "prepend-icon"])) : b("", !0)
            ], 64))
          ], 2),
          v("div", Z, [
            M(n.$slots, "default")
          ])
        ], 2),
        l.value && m.value ? (t(), r(H, {
          key: 0,
          to: "body"
        }, [
          v("div", ee, [
            l.value.isAdminOnly ? (t(), r(O, { key: 0 }, {
              default: y(() => [
                f(a, {
                  label: l.value.label,
                  "prepend-icon": l.value.prependIcon,
                  onClick: o[4] || (o[4] = (e) => i("click:action", l.value.value)),
                  variant: "fab"
                }, null, 8, ["label", "prepend-icon"])
              ]),
              _: 1
            })) : (t(), r(a, {
              key: 1,
              label: l.value.label,
              "prepend-icon": l.value.prependIcon,
              onClick: o[5] || (o[5] = (e) => i("click:action", l.value.value)),
              variant: "fab"
            }, null, 8, ["label", "prepend-icon"]))
          ])
        ])) : b("", !0),
        A.value.length ? (t(), r(H, {
          key: 1,
          to: "body"
        }, [
          f(q, {
            "dismiss-away": "",
            "no-header": "",
            modelValue: s.value,
            "onUpdate:modelValue": o[7] || (o[7] = (e) => s.value = e)
          }, {
            default: y(() => [
              f(P, {
                class: "pb-8",
                items: E.value,
                "onUpdate:modelValue": o[6] || (o[6] = (e) => (i("click:action", e), s.value = !1))
              }, null, 8, ["items"])
            ]),
            _: 1
          }, 8, ["modelValue"])
        ])) : b("", !0)
      ], 64);
    };
  }
});
export {
  re as _,
  Q as u
};
