UNPKG

@aotearoan/neon

Version:

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

3 lines (2 loc) 2.38 kB
"use strict";const c=require("./NeonMenu.cjs.js"),e=require("vue"),i=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),u={ref:"menuWrapper",class:"neon-menu__wrapper"},d={class:"neon-menu__item-label"};function p(o,l,m,_,y,b){const s=e.resolveComponent("neon-dropdown-menu"),t=e.resolveComponent("neon-icon"),a=e.resolveComponent("neon-link");return e.openBlock(),e.createElementBlock("nav",u,[e.createElementVNode("ul",{class:e.normalizeClass([[`neon-menu--${o.color}`,`neon-menu--${o.size}`],"neon-menu no-style"]),role:"menubar"},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.menu,n=>(e.openBlock(),e.createElementBlock("li",{key:n.key,ref_for:!0,ref:"menuItem",class:e.normalizeClass([{"neon-menu__item--disabled":n.disabled},"neon-menu__item"])},[n.children?(e.openBlock(),e.createBlock(s,{key:`${n.key}DropdownMenu`,class:e.normalizeClass({"router-link-active":o.routeMatches(n.href)}),color:o.color,disabled:n.disabled,icon:n.icon,label:n.label,model:n.children,openOnHover:!n.disabled,size:o.size,"dropdown-style":"text-button"},null,8,["class","color","disabled","icon","label","model","openOnHover","size"])):(e.openBlock(),e.createBlock(a,{key:`${n.key}Link`,class:e.normalizeClass({"router-link-active":o.routeMatches(n.href)}),href:n.href,"no-style":!0,tabindex:n.disabled?-1:0,"outline-style":"none",role:"menuitem",onClick:r=>!n.disabled&&o.onClick(n.key),onKeydown:[e.withKeys(r=>!n.disabled&&o.onClick(n.key),["enter"]),e.withKeys(e.withModifiers(r=>!n.disabled&&o.onClick(n.key),["prevent"]),["space"])]},{default:e.withCtx(()=>[n.icon?(e.openBlock(),e.createBlock(t,{key:`${n.key}LinkIcon`,name:n.icon,class:"neon-menu__item-icon",color:"neutral"},null,8,["name"])):e.createCommentVNode("",!0),e.createElementVNode("span",d,e.toDisplayString(n.label),1)]),_:2},1032,["class","href","tabindex","onClick","onKeydown"]))],2))),128))],2),e.createVNode(s,{class:e.normalizeClass([{"neon-menu__responsive-menu--hidden":o.responsiveMenuItems.length===0},"neon-menu__responsive-menu"]),color:o.color,indicator:!1,model:o.responsiveMenuItems,openOnHover:!0,size:o.size,"dropdown-style":"text-button",icon:"ellipsis",placement:"bottom-right",onButtonRef:l[0]||(l[0]=n=>o.responsiveButton=n)},null,8,["class","color","model","size"])],512)}const k=i(c,[["render",p]]);module.exports=k; //# sourceMappingURL=NeonMenu.vue.cjs.js.map