@aotearoan/neon/dist/components/presentation/tabs/NeonTabs.vue.es.js

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

import f from "./NeonTabs.es.js";
import { resolveComponent as s, openBlock as o, createElementBlock as l, normalizeClass as r, createVNode as y, withCtx as i, Fragment as p, renderList as b, createBlock as m, createElementVNode as h, withKeys as u, createCommentVNode as d, toDisplayString as $, renderSlot as C } from "vue";
import w from "../../../_virtual/_plugin-vue_export-helper.es.js";
const V = ["id", "tabindex", "onKeydown"], v = {
  key: 1,
  class: "neon-tabs__menu-label"
};
function g(e, B, N, K, z, E) {
  const c = s("neon-icon"), k = s("neon-link"), _ = s("neon-swiper");
  return o(), l("div", {
    class: r([[`neon-tabs--${e.size}`, `neon-tabs--${e.color}`], "neon-tabs"]),
    role: "tablist"
  }, [
    y(_, {
      class: r([{
        "neon-tabs__menu-items--underlined": e.underline,
        "neon-tabs__menu-items--full-width-mobile": e.fullWidthMobile
      }, "neon-tabs__menu-items"])
    }, {
      default: i(() => [
        (o(!0), l(p, null, b(e.tabs, (n, t) => (o(), m(k, {
          id: `${n.key}Button`,
          key: n.key,
          ref_for: !0,
          ref: "menuItem",
          "aria-controls": n.key,
          "aria-selected": n.key === e.modelValue,
          class: r([{ "neon-tabs__menu-item--selected": n.key === e.modelValue }, "neon-tabs__menu-item"]),
          href: n.href,
          "no-style": "",
          role: "tab",
          tabindex: "-1",
          onClick: (a) => n.key !== e.modelValue && e.onClick(n.key)
        }, {
          default: i(() => [
            h("div", {
              id: `${n.key}ButtonContainer`,
              tabindex: n.key === e.modelValue ? 0 : -1,
              class: "neon-tabs__menu-item-container",
              onKeydown: [
                u((a) => e.onClick(e.tabs[t + 1 === e.tabs.length ? 0 : t + 1].key, !0), ["right"]),
                u((a) => e.onClick(e.tabs[t === 0 ? e.tabs.length - 1 : t - 1].key, !0), ["left"])
              ]
            }, [
              n.icon ? (o(), m(c, {
                key: 0,
                name: n.icon,
                class: "neon-tabs__menu-icon"
              }, null, 8, ["name"])) : d("", !0),
              n.label ? (o(), l("span", v, $(n.label), 1)) : d("", !0)
            ], 40, V)
          ]),
          _: 2
        }, 1032, ["id", "aria-controls", "aria-selected", "class", "href", "onClick"]))), 128))
      ]),
      _: 1
    }, 8, ["class"]),
    C(e.$slots, "default")
  ], 2);
}
const I = /* @__PURE__ */ w(f, [["render", g]]);
export {
  I as default
};
//# sourceMappingURL=NeonTabs.vue.es.js.map