@aotearoan/neon/dist/components/navigation/dropdown-menu/NeonDropdownMenu.vue.es.js

Neon is a lightweight design library of Vue 3 components with minimal dependencies.

import w from "./NeonDropdownMenu.es.js";
import { resolveComponent as a, openBlock as o, createBlock as l, mergeProps as b, withCtx as u, createElementVNode as r, createElementBlock as s, Fragment as f, renderList as k, normalizeClass as h, createCommentVNode as t, toDisplayString as p } from "vue";
import g from "../../../_virtual/_plugin-vue_export-helper.es.js";
const y = {
  class: "no-style neon-dropdown-menu__items",
  role: "menu"
}, v = ["onMouseover"], $ = {
  key: 0,
  class: "neon-dropdown-menu__item-container"
}, z = { class: "neon-dropdown-menu__item-label" }, B = { class: "neon-dropdown-menu__item-label" }, C = ["onClick"], P = { class: "neon-dropdown-menu__item-label" };
function V(e, d, H, D, N, F) {
  const i = a("neon-icon"), m = a("neon-link"), _ = a("neon-dropdown");
  return o(), l(_, b({
    ref: "dropdown",
    modelValue: e.open,
    "onUpdate:modelValue": d[0] || (d[0] = (n) => e.open = n),
    class: [`neon-dropdown-menu--${e.color}`, "neon-dropdown-menu"],
    color: e.color,
    disabled: e.disabled,
    openOnHover: e.openOnHover,
    placement: e.placement,
    size: e.size
  }, e.attrs, {
    onBlur: d[1] || (d[1] = (n) => e.onBlur()),
    onFocus: d[2] || (d[2] = (n) => e.onFocus()),
    "onUpdate:modelValue": d[3] || (d[3] = (n) => e.open = n),
    onDropdownPlacement: e.onPlacement
  }), {
    default: u(() => [
      r("ul", y, [
        (o(!0), s(f, null, k(e.model, (n) => (o(), s("li", {
          key: n.key,
          ref_for: !0,
          ref: "items",
          class: h([[
            {
              "neon-dropdown-menu__item--disabled": n.disabled,
              "neon-dropdown-menu__item--separator-before": n.separatorBefore,
              "neon-dropdown-menu__item--group-title": n.isGroup,
              "neon-dropdown-menu__item--grouped": n.grouped,
              "neon-dropdown-menu__item--highlighted": n.key === e.highlightedKey,
              "neon-dropdown-menu__item--icon-right": n.icon && n.iconPosition === e.NeonHorizontalPosition.Right
            },
            `neon-dropdown-menu__item--${e.size}`
          ], "neon-dropdown-menu__item"]),
          tabindex: "0",
          onMouseover: (c) => e.changeHighlighted(n.key)
        }, [
          n.isGroup ? (o(), s("div", $, [
            n.icon ? (o(), l(i, {
              key: 0,
              disabled: n.disabled,
              name: n.icon,
              class: "neon-dropdown-menu__item-icon"
            }, null, 8, ["disabled", "name"])) : t("", !0),
            r("span", z, p(n.label), 1)
          ])) : n.href && !n.disabled ? (o(), l(m, {
            key: 1,
            href: n.href,
            "no-style": !0,
            "outline-style": "none",
            role: "menuitem"
          }, {
            default: u(() => [
              n.icon ? (o(), l(i, {
                key: 0,
                disabled: n.disabled,
                name: n.icon,
                class: "neon-dropdown-menu__item-icon"
              }, null, 8, ["disabled", "name"])) : t("", !0),
              r("span", B, p(n.label), 1)
            ]),
            _: 2
          }, 1032, ["href"])) : (o(), s("div", {
            key: 2,
            class: "neon-dropdown-menu__item-container",
            role: "menuitem",
            onClick: (c) => e.clickItem(n)
          }, [
            n.icon ? (o(), l(i, {
              key: 0,
              disabled: n.disabled,
              name: n.icon,
              class: "neon-dropdown-menu__item-icon"
            }, null, 8, ["disabled", "name"])) : t("", !0),
            r("span", P, p(n.label), 1)
          ], 8, C))
        ], 42, v))), 128))
      ])
    ]),
    _: 1
  }, 16, ["modelValue", "class", "color", "disabled", "openOnHover", "placement", "size", "onDropdownPlacement"]);
}
const G = /* @__PURE__ */ g(w, [["render", V]]);
export {
  G as default
};
//# sourceMappingURL=NeonDropdownMenu.vue.es.js.map