import { defineComponent as B, resolveComponent as t, openBlock as d, createElementBlock as s, normalizeStyle as E, unref as p, normalizeClass as a, Fragment as i, renderList as w, createBlock as m, withCtx as b, createVNode as r, createCommentVNode as M } from "vue";
import { useCommon as c } from "../../composables/useCommon.js";
import { useColors as N } from "../../composables/useColors.js";
import { useTheme as g } from "../../composables/useTheme.js";
import u from "./MenuItem.vue.js";
import A from "../accordion/AccordionItem.vue.js";
import S from "../divider/Divider.vue.js";
const V = {
  ...c.props(),
  ...N.props("secondary"),
  items: Array,
  collapsible: {
    type: Boolean,
    default: !0
  },
  collapseIcon: String,
  expanded: Boolean,
  disabled: Boolean,
  rounded: {
    type: Boolean,
    default: !0
  },
  filled: {
    type: Boolean,
    default: !0
  },
  minimal: Boolean
}, X = {
  name: "XMenu",
  validators: {
    ...c.validators()
  }
}, G = /* @__PURE__ */ B({
  ...X,
  props: V,
  emits: ["expand", "item-click"],
  setup(y) {
    const z = y, { styles: k, classes: v, className: $ } = g("Menu", {}, z);
    return (e, o) => {
      const f = t("x-menu");
      return e.items ? (d(), s("div", {
        key: 0,
        style: E(p(k)),
        class: a([
          "space-y-1",
          p($),
          p(v).wrapper
        ])
      }, [
        (d(!0), s(i, null, w(e.items, (l, I) => (d(), s(i, { key: I }, [
          l.items ? (d(), s(i, { key: 0 }, [
            l.collapsible !== !1 ? (d(), m(A, {
              key: 0,
              icon: l.collapseIcon || e.collapseIcon,
              expanded: l.expanded || e.expanded,
              disabled: e.disabled || l.disabled,
              "show-icon": !!(l.collapseIcon || e.collapseIcon),
              class: "x-menu-inner space-y-1",
              onExpand: o[1] || (o[1] = (n) => e.$emit("expand"))
            }, {
              default: b(({}) => [
                r(u, {
                  item: l,
                  rounded: e.rounded,
                  color: l.color || e.color,
                  filled: l.filled || e.filled,
                  size: l.size || e.size,
                  disabled: e.disabled || l.disabled,
                  minimal: e.minimal,
                  class: "font-medium"
                }, null, 8, ["item", "rounded", "color", "filled", "size", "disabled", "minimal"])
              ]),
              content: b(({ expand: n }) => [
                r(f, {
                  class: a(["border-l ml-4 border-secondary-100 dark:border-secondary-700", { "pl-1": e.filled }]),
                  items: l.items,
                  color: l.color || e.color,
                  size: l.size || e.size,
                  collapsible: e.collapsible,
                  "collapse-icon": l.collapseIcon || e.collapseIcon,
                  expanded: l.expanded || e.expanded,
                  disabled: e.disabled || l.disabled,
                  rounded: e.rounded,
                  filled: e.filled,
                  minimal: e.minimal,
                  onExpand: (C) => n(!1),
                  onItemClick: o[0] || (o[0] = (C) => e.$emit("item-click"))
                }, null, 8, ["class", "items", "color", "size", "collapsible", "collapse-icon", "expanded", "disabled", "rounded", "filled", "minimal", "onExpand"])
              ]),
              _: 2
            }, 1032, ["icon", "expanded", "disabled", "show-icon"])) : (d(), s(i, { key: 1 }, [
              r(u, {
                item: l,
                rounded: e.rounded,
                color: l.color || e.color,
                filled: l.filled || e.filled,
                size: l.size || e.size,
                disabled: e.disabled || l.disabled,
                minimal: e.minimal,
                class: "font-medium",
                inactive: "",
                onClick: o[2] || (o[2] = (n) => e.$emit("item-click"))
              }, null, 8, ["item", "rounded", "color", "filled", "size", "disabled", "minimal"]),
              r(f, {
                class: a(["x-menu-inner space-y-1 ml-4 border-l border-secondary-100 dark:border-secondary-700", { "pl-1": e.filled }]),
                items: l.items,
                color: l.color || e.color,
                size: l.size || e.size,
                collapsible: e.collapsible,
                "collapse-icon": l.collapseIcon || e.collapseIcon,
                expanded: l.expanded || e.expanded,
                disabled: e.disabled || l.disabled,
                minimal: e.minimal,
                rounded: e.rounded,
                filled: e.filled,
                onExpand: o[3] || (o[3] = (n) => e.$emit("expand"))
              }, null, 8, ["class", "items", "color", "size", "collapsible", "collapse-icon", "expanded", "disabled", "minimal", "rounded", "filled"])
            ], 64))
          ], 64)) : (d(), s(i, { key: 1 }, [
            l.divider ? (d(), m(S, { key: 0 })) : (d(), m(u, {
              key: 1,
              item: l,
              rounded: e.rounded,
              color: l.color || e.color,
              filled: l.filled || e.filled,
              size: l.size || e.size,
              disabled: e.disabled || l.disabled,
              minimal: e.minimal,
              class: a({ "my-2": l.divider }),
              onClick: o[4] || (o[4] = (n) => e.$emit("item-click")),
              onActive: o[5] || (o[5] = (n) => e.$emit("expand"))
            }, null, 8, ["item", "rounded", "color", "filled", "size", "disabled", "minimal", "class"]))
          ], 64))
        ], 64))), 128))
      ], 6)) : M("", !0);
    };
  }
});
export {
  G as default
};
