@aotearoan/neon 9.2.0 → 9.2.2

package/dist/components/navigation/action-menu/{NeonActionMenu.ts_vue_type_script_src_594f055f_lang.es.js.map → NeonActionMenu.ts_vue_type_script_src_2ccff933_lang.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NeonActionMenu.ts_vue_type_script_src_594f055f_lang.es.js","sources":["../../../../src/components/navigation/action-menu/NeonActionMenu.ts?vue&type=script&src=594f055f&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\nimport type { NeonActionMenuModel } from '@/common/models/NeonActionMenuModel';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\n\n/**\n * An action menu is designed for the NeonSideNav component and is designed to behave like tabs where selecting a different item switches the contents in the main page.\n */\nexport default defineComponent({\n  name: 'NeonActionMenu',\n  components: {\n    NeonLink,\n  },\n  props: {\n    /**\n     * The list of action items to display in the menu.\n     */\n    model: { type: Array as () => Array<NeonActionMenuModel>, required: true },\n    /**\n     * The key of the selected model action item.\n     */\n    modelValue: { type: String, required: true },\n    /**\n     * The toggle chip color.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Primary },\n  },\n  emits: [\n    /**\n     * emitted when the user clicks on a new action menu item.\n     * @type {string} the key of the newly selected action menu item.\n     */\n    'update:modelValue',\n  ],\n  setup(props, { emit }) {\n    const onClick = (key: string) => {\n      if (props.modelValue !== key) {\n        emit('update:modelValue', key);\n      }\n    };\n\n    return {\n      onClick,\n    };\n  },\n});\n"],"names":[],"mappings":";;;AAQA,IAAA,YAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IAIL,OAAO,EAAE,MAAM,OAA2C,UAAU,KAAK;AAAA,IAIzE,YAAY,EAAE,MAAM,QAAQ,UAAU,KAAK;AAAA,IAI3C,OAAO,EAAE,MAAM,QAAqC,SAAS,oBAAoB,QAAQ;AAAA,EAC3F;AAAA,EACA,OAAO;AAAA,IAKL;AAAA,EACF;AAAA,EACA,MAAM,OAAO,EAAE,QAAQ;AACf,UAAA,UAAU,CAAC,QAAgB;AAC3B,UAAA,MAAM,eAAe,KAAK;AAC5B,aAAK,qBAAqB,GAAG;AAAA,MAC/B;AAAA,IAAA;AAGK,WAAA;AAAA,MACL;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;;"}
+{"version":3,"file":"NeonActionMenu.ts_vue_type_script_src_2ccff933_lang.es.js","sources":["../../../../src/components/navigation/action-menu/NeonActionMenu.ts?vue&type=script&src=2ccff933&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\nimport type { NeonActionMenuModel } from '@/common/models/NeonActionMenuModel';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\n\n/**\n * An action menu is designed for the NeonSideNav component and is designed to behave like tabs where selecting a different item switches the contents in the main page.\n */\nexport default defineComponent({\n  name: 'NeonActionMenu',\n  components: {\n    NeonLink,\n  },\n  props: {\n    /**\n     * The list of action items to display in the menu.\n     */\n    model: { type: Array as () => Array<NeonActionMenuModel>, required: true },\n    /**\n     * The key of the selected model action item.\n     */\n    modelValue: { type: String, required: true },\n    /**\n     * The toggle chip color.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Primary },\n  },\n  emits: [\n    /**\n     * emitted when the user clicks on a new action menu item.\n     * @type {string} the key of the newly selected action menu item.\n     */\n    'update:modelValue',\n  ],\n  setup(props, { emit }) {\n    const onClick = (key: string) => {\n      if (props.modelValue !== key) {\n        emit('update:modelValue', key);\n      }\n    };\n\n    return {\n      onClick,\n    };\n  },\n});\n"],"names":[],"mappings":";;;AAQA,IAAA,YAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IAIL,OAAO,EAAE,MAAM,OAA2C,UAAU,KAAK;AAAA,IAIzE,YAAY,EAAE,MAAM,QAAQ,UAAU,KAAK;AAAA,IAI3C,OAAO,EAAE,MAAM,QAAqC,SAAS,oBAAoB,QAAQ;AAAA,EAC3F;AAAA,EACA,OAAO;AAAA,IAKL;AAAA,EACF;AAAA,EACA,MAAM,OAAO,EAAE,QAAQ;AACf,UAAA,UAAU,CAAC,QAAgB;AAC3B,UAAA,MAAM,eAAe,KAAK;AAC5B,aAAK,qBAAqB,GAAG;AAAA,MAC/B;AAAA,IAAA;AAGK,WAAA;AAAA,MACL;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;;"}

package/dist/components/navigation/anchor/NeonAnchor.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var n=require("./NeonAnchor.ts_vue_type_script_src_463f43ba_lang.cjs.js"),e=require("vue"),o=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const s=["id"];function c(r,_,a,i,p,u){return e.openBlock(),e.createElementBlock("a",{id:r.id,class:"neon-anchor"},null,8,s)}var t=o(n,[["render",c],["__file","/Users/andrew/dev/projects/neon/src/components/navigation/anchor/NeonAnchor.vue"]]);module.exports=t;
+"use strict";var n=require("./NeonAnchor.ts_vue_type_script_src_73b1777a_lang.cjs.js"),e=require("vue"),s=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const t=["id"];function _(r,o,u,a,p,i){return e.openBlock(),e.createElementBlock("a",{id:r.id,class:"neon-anchor"},null,8,t)}var c=s(n,[["render",_]]);module.exports=c;
 //# sourceMappingURL=NeonAnchor.cjs.js.map

package/dist/components/navigation/anchor/NeonAnchor.es.js

@@ -1,4 +1,4 @@
-import _sfc_main from "./NeonAnchor.ts_vue_type_script_src_463f43ba_lang.es.js";
+import _sfc_main from "./NeonAnchor.ts_vue_type_script_src_73b1777a_lang.es.js";
 import { openBlock, createElementBlock } from "vue";
 import _export_sfc from "../../../_virtual/plugin-vue_export-helper.es.js";
 const _hoisted_1 = ["id"];
@@ -8,6 +8,6 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     class: "neon-anchor"
   }, null, 8, _hoisted_1);
 }
-var NeonAnchor = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/andrew/dev/projects/neon/src/components/navigation/anchor/NeonAnchor.vue"]]);
+var NeonAnchor = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export { NeonAnchor as default };
 //# sourceMappingURL=NeonAnchor.es.js.map

package/dist/components/navigation/anchor/{NeonAnchor.ts_vue_type_script_src_463f43ba_lang.cjs.js → NeonAnchor.ts_vue_type_script_src_73b1777a_lang.cjs.js}

@@ -1,2 +1,2 @@
 "use strict";var e=require("vue"),r=e.defineComponent({name:"NeonAnchor",props:{id:{type:String,required:!0}}});module.exports=r;
-//# sourceMappingURL=NeonAnchor.ts_vue_type_script_src_463f43ba_lang.cjs.js.map
+//# sourceMappingURL=NeonAnchor.ts_vue_type_script_src_73b1777a_lang.cjs.js.map

package/dist/components/navigation/anchor/{NeonAnchor.ts_vue_type_script_src_463f43ba_lang.cjs.js.map → NeonAnchor.ts_vue_type_script_src_73b1777a_lang.cjs.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NeonAnchor.ts_vue_type_script_src_463f43ba_lang.cjs.js","sources":["../../../../src/components/navigation/anchor/NeonAnchor.ts?vue&type=script&src=463f43ba&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\n\n/**\n * An HTML anchor component. This component is offset by the top nav (at all responsive breakpoints) which means\n * fragments will scroll to the correct position offset by the top nav. Just place NeonAnchor directly inside a\n * positioned element you want to create a fragment for and give it the correct id.\n */\nexport default defineComponent({\n  name: 'NeonAnchor',\n  props: {\n    /**\n     * The id of the anchor, this should correspond to the URL fragment name.\n     */\n    id: { type: String, required: true },\n  },\n});\n"],"names":["_sfc_main","defineComponent"],"mappings":"kCAOAA,EAAeC,kBAAgB,CAC7B,KAAM,aACN,MAAO,CAIL,GAAI,CAAE,KAAM,OAAQ,SAAU,EAAK,CACrC,CACF,CAAC"}
+{"version":3,"file":"NeonAnchor.ts_vue_type_script_src_73b1777a_lang.cjs.js","sources":["../../../../src/components/navigation/anchor/NeonAnchor.ts?vue&type=script&src=73b1777a&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\n\n/**\n * An HTML anchor component. This component is offset by the top nav (at all responsive breakpoints) which means\n * fragments will scroll to the correct position offset by the top nav. Just place NeonAnchor directly inside a\n * positioned element you want to create a fragment for and give it the correct id.\n */\nexport default defineComponent({\n  name: 'NeonAnchor',\n  props: {\n    /**\n     * The id of the anchor, this should correspond to the URL fragment name.\n     */\n    id: { type: String, required: true },\n  },\n});\n"],"names":["_sfc_main","defineComponent"],"mappings":"kCAOAA,EAAeC,kBAAgB,CAC7B,KAAM,aACN,MAAO,CAIL,GAAI,CAAE,KAAM,OAAQ,SAAU,EAAK,CACrC,CACF,CAAC"}

package/dist/components/navigation/anchor/{NeonAnchor.ts_vue_type_script_src_463f43ba_lang.es.js → NeonAnchor.ts_vue_type_script_src_73b1777a_lang.es.js}

@@ -6,4 +6,4 @@ var _sfc_main = defineComponent({
   }
 });
 export { _sfc_main as default };
-//# sourceMappingURL=NeonAnchor.ts_vue_type_script_src_463f43ba_lang.es.js.map
+//# sourceMappingURL=NeonAnchor.ts_vue_type_script_src_73b1777a_lang.es.js.map

package/dist/components/navigation/anchor/{NeonAnchor.ts_vue_type_script_src_463f43ba_lang.es.js.map → NeonAnchor.ts_vue_type_script_src_73b1777a_lang.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NeonAnchor.ts_vue_type_script_src_463f43ba_lang.es.js","sources":["../../../../src/components/navigation/anchor/NeonAnchor.ts?vue&type=script&src=463f43ba&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\n\n/**\n * An HTML anchor component. This component is offset by the top nav (at all responsive breakpoints) which means\n * fragments will scroll to the correct position offset by the top nav. Just place NeonAnchor directly inside a\n * positioned element you want to create a fragment for and give it the correct id.\n */\nexport default defineComponent({\n  name: 'NeonAnchor',\n  props: {\n    /**\n     * The id of the anchor, this should correspond to the URL fragment name.\n     */\n    id: { type: String, required: true },\n  },\n});\n"],"names":[],"mappings":";AAOA,IAAA,YAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,OAAO;AAAA,IAIL,IAAI,EAAE,MAAM,QAAQ,UAAU,KAAK;AAAA,EACrC;AACF,CAAC;;"}
+{"version":3,"file":"NeonAnchor.ts_vue_type_script_src_73b1777a_lang.es.js","sources":["../../../../src/components/navigation/anchor/NeonAnchor.ts?vue&type=script&src=73b1777a&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\n\n/**\n * An HTML anchor component. This component is offset by the top nav (at all responsive breakpoints) which means\n * fragments will scroll to the correct position offset by the top nav. Just place NeonAnchor directly inside a\n * positioned element you want to create a fragment for and give it the correct id.\n */\nexport default defineComponent({\n  name: 'NeonAnchor',\n  props: {\n    /**\n     * The id of the anchor, this should correspond to the URL fragment name.\n     */\n    id: { type: String, required: true },\n  },\n});\n"],"names":[],"mappings":";AAOA,IAAA,YAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,OAAO;AAAA,IAIL,IAAI,EAAE,MAAM,QAAQ,UAAU,KAAK;AAAA,EACrC;AACF,CAAC;;"}

package/dist/components/navigation/dropdown-menu/NeonDropdownMenu.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var a=require("./NeonDropdownMenu.ts_vue_type_script_src_47b54115_lang.cjs.js"),e=require("vue"),p=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const i={class:"no-style neon-dropdown-menu__items",role:"menu"},u=["onMouseover"],c={key:0,class:"neon-dropdown-menu__item-container"},m={class:"neon-dropdown-menu__item-label"},_={class:"neon-dropdown-menu__item-label"},k=["onClick"],w={class:"neon-dropdown-menu__item-label"};function v(n,r,B,g,y,f){const l=e.resolveComponent("neon-icon"),d=e.resolveComponent("neon-link"),s=e.resolveComponent("neon-dropdown");return e.openBlock(),e.createBlock(s,e.mergeProps({ref:"dropdown",modelValue:n.open,"onUpdate:modelValue":r[0]||(r[0]=o=>n.open=o),class:[`neon-dropdown-menu--${n.color}`,"neon-dropdown-menu"],color:n.color,disabled:n.disabled,openOnHover:n.openOnHover,size:n.size},n.attrs,{onBlur:r[1]||(r[1]=o=>n.onBlur()),onButton:r[2]||(r[2]=o=>n.emit("button-ref",o)),onFocus:r[3]||(r[3]=o=>n.onFocus()),"onUpdate:modelValue":r[4]||(r[4]=o=>n.open=o),onDropdownPlacement:n.onPlacement}),{default:e.withCtx(()=>[e.createElementVNode("ul",i,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.model,o=>(e.openBlock(),e.createElementBlock("li",{key:o.key,ref_for:!0,ref:"items",class:e.normalizeClass([[{"neon-dropdown-menu__item--disabled":o.disabled,"neon-dropdown-menu__item--separator-before":o.separatorBefore,"neon-dropdown-menu__item--group-title":o.isGroup,"neon-dropdown-menu__item--grouped":o.grouped,"neon-dropdown-menu__item--highlighted":o.key===n.highlightedKey},`neon-dropdown-menu__item--${n.size}`],"neon-dropdown-menu__item"]),onMouseover:t=>n.changeHighlighted(o.key)},[o.isGroup?(e.openBlock(),e.createElementBlock("div",c,[o.icon?(e.openBlock(),e.createBlock(l,{key:0,disabled:o.disabled,name:o.icon,class:"neon-dropdown-menu__item-icon"},null,8,["disabled","name"])):e.createCommentVNode("",!0),e.createElementVNode("span",m,e.toDisplayString(o.label),1)])):o.href&&!o.disabled?(e.openBlock(),e.createBlock(d,{key:1,href:o.href,"no-style":!0,"outline-style":"none",role:"menuitem"},{default:e.withCtx(()=>[o.icon?(e.openBlock(),e.createBlock(l,{key:0,disabled:o.disabled,name:o.icon,class:"neon-dropdown-menu__item-icon"},null,8,["disabled","name"])):e.createCommentVNode("",!0),e.createElementVNode("span",_,e.toDisplayString(o.label),1)]),_:2},1032,["href"])):(e.openBlock(),e.createElementBlock("div",{key:2,class:"neon-dropdown-menu__item-container",role:"menuitem",onClick:t=>n.clickItem(o)},[o.icon?(e.openBlock(),e.createBlock(l,{key:0,disabled:o.disabled,name:o.icon,class:"neon-dropdown-menu__item-icon"},null,8,["disabled","name"])):e.createCommentVNode("",!0),e.createElementVNode("span",w,e.toDisplayString(o.label),1)],8,k))],42,u))),128))])]),_:1},16,["modelValue","class","color","disabled","openOnHover","size","onDropdownPlacement"])}var b=p(a,[["render",v],["__file","/Users/andrew/dev/projects/neon/src/components/navigation/dropdown-menu/NeonDropdownMenu.vue"]]);module.exports=b;
+"use strict";var a=require("./NeonDropdownMenu.ts_vue_type_script_src_6187a2a6_lang.cjs.js"),e=require("vue"),p=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const i={class:"no-style neon-dropdown-menu__items",role:"menu"},u=["onMouseover"],c={key:0,class:"neon-dropdown-menu__item-container"},m={class:"neon-dropdown-menu__item-label"},_={class:"neon-dropdown-menu__item-label"},k=["onClick"],w={class:"neon-dropdown-menu__item-label"};function v(n,r,B,g,y,f){const l=e.resolveComponent("neon-icon"),d=e.resolveComponent("neon-link"),s=e.resolveComponent("neon-dropdown");return e.openBlock(),e.createBlock(s,e.mergeProps({ref:"dropdown",modelValue:n.open,"onUpdate:modelValue":r[0]||(r[0]=o=>n.open=o),class:[`neon-dropdown-menu--${n.color}`,"neon-dropdown-menu"],color:n.color,disabled:n.disabled,openOnHover:n.openOnHover,size:n.size},n.attrs,{onBlur:r[1]||(r[1]=o=>n.onBlur()),onButton:r[2]||(r[2]=o=>n.emit("button-ref",o)),onFocus:r[3]||(r[3]=o=>n.onFocus()),"onUpdate:modelValue":r[4]||(r[4]=o=>n.open=o),onDropdownPlacement:n.onPlacement}),{default:e.withCtx(()=>[e.createElementVNode("ul",i,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.model,o=>(e.openBlock(),e.createElementBlock("li",{key:o.key,ref_for:!0,ref:"items",class:e.normalizeClass([[{"neon-dropdown-menu__item--disabled":o.disabled,"neon-dropdown-menu__item--separator-before":o.separatorBefore,"neon-dropdown-menu__item--group-title":o.isGroup,"neon-dropdown-menu__item--grouped":o.grouped,"neon-dropdown-menu__item--highlighted":o.key===n.highlightedKey},`neon-dropdown-menu__item--${n.size}`],"neon-dropdown-menu__item"]),onMouseover:t=>n.changeHighlighted(o.key)},[o.isGroup?(e.openBlock(),e.createElementBlock("div",c,[o.icon?(e.openBlock(),e.createBlock(l,{key:0,disabled:o.disabled,name:o.icon,class:"neon-dropdown-menu__item-icon"},null,8,["disabled","name"])):e.createCommentVNode("",!0),e.createElementVNode("span",m,e.toDisplayString(o.label),1)])):o.href&&!o.disabled?(e.openBlock(),e.createBlock(d,{key:1,href:o.href,"no-style":!0,"outline-style":"none",role:"menuitem"},{default:e.withCtx(()=>[o.icon?(e.openBlock(),e.createBlock(l,{key:0,disabled:o.disabled,name:o.icon,class:"neon-dropdown-menu__item-icon"},null,8,["disabled","name"])):e.createCommentVNode("",!0),e.createElementVNode("span",_,e.toDisplayString(o.label),1)]),_:2},1032,["href"])):(e.openBlock(),e.createElementBlock("div",{key:2,class:"neon-dropdown-menu__item-container",role:"menuitem",onClick:t=>n.clickItem(o)},[o.icon?(e.openBlock(),e.createBlock(l,{key:0,disabled:o.disabled,name:o.icon,class:"neon-dropdown-menu__item-icon"},null,8,["disabled","name"])):e.createCommentVNode("",!0),e.createElementVNode("span",w,e.toDisplayString(o.label),1)],8,k))],42,u))),128))])]),_:1},16,["modelValue","class","color","disabled","openOnHover","size","onDropdownPlacement"])}var b=p(a,[["render",v]]);module.exports=b;
 //# sourceMappingURL=NeonDropdownMenu.cjs.js.map

package/dist/components/navigation/dropdown-menu/NeonDropdownMenu.es.js

@@ -1,4 +1,4 @@
-import _sfc_main from "./NeonDropdownMenu.ts_vue_type_script_src_47b54115_lang.es.js";
+import _sfc_main from "./NeonDropdownMenu.ts_vue_type_script_src_6187a2a6_lang.es.js";
 import { resolveComponent, openBlock, createBlock, mergeProps, withCtx, createElementVNode, createElementBlock, Fragment, renderList, normalizeClass, createCommentVNode, toDisplayString } from "vue";
 import _export_sfc from "../../../_virtual/plugin-vue_export-helper.es.js";
 const _hoisted_1 = {
@@ -99,6 +99,6 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     _: 1
   }, 16, ["modelValue", "class", "color", "disabled", "openOnHover", "size", "onDropdownPlacement"]);
 }
-var NeonDropdownMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/andrew/dev/projects/neon/src/components/navigation/dropdown-menu/NeonDropdownMenu.vue"]]);
+var NeonDropdownMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export { NeonDropdownMenu as default };
 //# sourceMappingURL=NeonDropdownMenu.es.js.map

package/dist/components/navigation/dropdown-menu/{NeonDropdownMenu.ts_vue_type_script_src_47b54115_lang.cjs.js → NeonDropdownMenu.ts_vue_type_script_src_6187a2a6_lang.cjs.js}

@@ -1,2 +1,2 @@
 "use strict";var n=require("vue"),D=require("../../../common/enums/NeonSize.cjs.js"),b=require("../../../common/enums/NeonFunctionalColor.cjs.js"),q=require("../../presentation/dropdown/NeonDropdown.cjs.js"),s=require("../../../common/enums/NeonDropdownPlacement.cjs.js"),S=require("../../../common/utils/NeonScrollUtils.cjs.js"),P=require("../../presentation/icon/NeonIcon.cjs.js"),I=require("../link/NeonLink.cjs.js"),L=n.defineComponent({name:"NeonDropdownMenu",components:{NeonDropdown:q,NeonIcon:P,NeonLink:I},props:{model:{type:Array,required:!0},size:{type:String,default:D.NeonSize.Medium},color:{type:String,default:b.NeonFunctionalColor.LowContrast},disabled:{type:Boolean,default:!1},openOnHover:{type:Boolean,default:!1}},emits:["click","button-ref"],setup(l,{emit:d}){const N=n.useAttrs(),m=n.ref(null),f=n.ref(null),v=n.ref([]),a=n.ref(!1),c=n.ref(null),t=n.ref(-1),h=e=>{c.value=e,t.value=l.model.findIndex(o=>o.key===e)},p=e=>{f.value=e},y=()=>{switch(f.value){case s.NeonDropdownPlacement.TopLeft:case s.NeonDropdownPlacement.TopRight:case s.NeonDropdownPlacement.LeftBottom:case s.NeonDropdownPlacement.RightBottom:return!0}return!1},g=()=>{var o;const e=(o=m.value)==null?void 0:o.querySelector(".neon-dropdown-menu__item--highlighted");S.NeonScrollUtils.scrollIntoView(e)},i=(e,o)=>{const r=t.value+e;r>=0&&r<=l.model.length-1&&(t.value=r,c.value=l.model[t.value].key,o.preventDefault(),setTimeout(g))},u=e=>{if(!l.disabled&&a.value)switch(e.code){case"ArrowUp":case"ArrowDown":{const o=y()?-1:1;e.code==="ArrowUp"?i(-1*o,e):i(1*o,e)}break;case"Enter":case"Space":l.model[t.value]&&!l.model[t.value].disabled&&(w(l.model[t.value]),e.preventDefault());break;case"Tab":!e.ctrlKey&&!e.metaKey&&!e.altKey&&(a.value=!1);break;case"Escape":a.value=!1;break}},w=e=>{var o;if(!e.disabled){if(e.href){const r=(o=v.value[t.value])==null?void 0:o.firstElementChild;r&&r.click()}else d("click",e);a.value=!1}},k=()=>{l.openOnHover&&(a.value=!0)},j=()=>{l.openOnHover&&(a.value=!1)};return n.onMounted(()=>{document.addEventListener("keydown",u)}),n.onUnmounted(()=>{document.removeEventListener("keydown",u)}),n.watch(()=>a.value,e=>{e&&(c.value=l.model[0].key,t.value=0)}),{dropdown:m,items:v,open:a,highlightedKey:c,highlightedIndex:t,attrs:N,emit:d,changeHighlighted:h,keyboardHandler:u,onBlur:j,onFocus:k,clickItem:w,navigateBy:i,onPlacement:p}}});module.exports=L;
-//# sourceMappingURL=NeonDropdownMenu.ts_vue_type_script_src_47b54115_lang.cjs.js.map
+//# sourceMappingURL=NeonDropdownMenu.ts_vue_type_script_src_6187a2a6_lang.cjs.js.map

package/dist/components/navigation/dropdown-menu/{NeonDropdownMenu.ts_vue_type_script_src_47b54115_lang.cjs.js.map → NeonDropdownMenu.ts_vue_type_script_src_6187a2a6_lang.cjs.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NeonDropdownMenu.ts_vue_type_script_src_47b54115_lang.cjs.js","sources":["../../../../src/components/navigation/dropdown-menu/NeonDropdownMenu.ts?vue&type=script&src=47b54115&lang.ts"],"sourcesContent":["import { defineComponent, onMounted, onUnmounted, ref, useAttrs, watch } from 'vue';\nimport type { NeonDropdownMenuItem } from '@/common/models/NeonDropdownMenuItem';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonDropdown from '@/components/presentation/dropdown/NeonDropdown.vue';\nimport { NeonDropdownPlacement } from '@/common/enums/NeonDropdownPlacement';\nimport { NeonScrollUtils } from '@/common/utils/NeonScrollUtils';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\n\n/**\n * <p>A dropdown menu consisting of a button to open the menu and a list of menu items. Clicking on a menu item will\n * result in navigating to the provided URL or notifying the parent component via the @click event.</p>\n * <p><strong>Note:</strong> As well as the options described below, pass through attributes supported by\n * <a href=\"/presentation/dropdown\">NeonDropdown</a> to change the style of the dropdown button.</p>\n */\nexport default defineComponent({\n  name: 'NeonDropdownMenu',\n  components: {\n    NeonDropdown,\n    NeonIcon,\n    NeonLink,\n  },\n  props: {\n    /**\n     * A list of menu items to render in the dropdown menu.\n     */\n    model: { type: Array as () => Array<NeonDropdownMenuItem>, required: true },\n    /**\n     * The size of the dropdown - Small, Medium or Large.\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Medium },\n    /**\n     * The dropdown color.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.LowContrast },\n    /**\n     * Whether the dropdown button is disabled or not.\n     */\n    disabled: { type: Boolean, default: false },\n    /**\n     * Instead of opening on click (default), open on hover.\n     */\n    openOnHover: { type: Boolean, default: false },\n  },\n  emits: [\n    /**\n     * emitted when the user clicks on a menu item.\n     * @type {NeonDropdownMenuItem} the menu item the user clicked on.\n     */\n    'click',\n    /**\n     * emitted on initialisation\n     * @type {HTMLElement} the reference to the HTMLElement for the dropdown menu button.\n     */\n    'button-ref',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const dropdown = ref<HTMLElement | null>(null);\n    const dropdownPlacement = ref<NeonDropdownPlacement | null>(null);\n    const items = ref<Array<HTMLLIElement>>([]);\n    const open = ref(false);\n    const highlightedKey = ref<string | null>(null);\n    const highlightedIndex = ref(-1);\n\n    const changeHighlighted = (key: string) => {\n      highlightedKey.value = key;\n      highlightedIndex.value = props.model.findIndex((item) => item.key === key);\n    };\n\n    const onPlacement = (placement: NeonDropdownPlacement) => {\n      dropdownPlacement.value = placement;\n    };\n\n    const isReverse = () => {\n      switch (dropdownPlacement.value) {\n        case NeonDropdownPlacement.TopLeft:\n        case NeonDropdownPlacement.TopRight:\n        case NeonDropdownPlacement.LeftBottom:\n        case NeonDropdownPlacement.RightBottom:\n          return true;\n      }\n\n      return false;\n    };\n\n    const scrollOnNavigate = () => {\n      const element = dropdown.value?.querySelector('.neon-dropdown-menu__item--highlighted') as HTMLElement;\n      NeonScrollUtils.scrollIntoView(element);\n    };\n\n    const navigateBy = (offset: number, $event: KeyboardEvent) => {\n      const newIndex = highlightedIndex.value + offset;\n      if (newIndex >= 0 && newIndex <= props.model.length - 1) {\n        highlightedIndex.value = newIndex;\n        highlightedKey.value = props.model[highlightedIndex.value].key;\n        $event.preventDefault();\n        setTimeout(scrollOnNavigate);\n      }\n    };\n\n    const keyboardHandler = ($event: KeyboardEvent) => {\n      if (!props.disabled) {\n        if (open.value) {\n          switch ($event.code) {\n            case 'ArrowUp':\n            case 'ArrowDown':\n              {\n                const reverseOffset = isReverse() ? -1 : 1;\n                if ($event.code === 'ArrowUp') {\n                  navigateBy(-1 * reverseOffset, $event);\n                } else {\n                  navigateBy(1 * reverseOffset, $event);\n                }\n              }\n              break;\n            case 'Enter':\n            case 'Space':\n              if (props.model[highlightedIndex.value] && !props.model[highlightedIndex.value].disabled) {\n                clickItem(props.model[highlightedIndex.value]);\n                $event.preventDefault();\n              }\n              break;\n            case 'Tab':\n              if (!$event.ctrlKey && !$event.metaKey && !$event.altKey) {\n                open.value = false;\n              }\n              break;\n            case 'Escape':\n              open.value = false;\n              break;\n          }\n        }\n      }\n    };\n\n    const clickItem = (item: NeonDropdownMenuItem) => {\n      if (!item.disabled) {\n        if (item.href) {\n          const anchor = items.value[highlightedIndex.value]?.firstElementChild as HTMLAnchorElement;\n          anchor && anchor.click();\n        } else {\n          emit('click', item);\n        }\n        open.value = false;\n      }\n    };\n\n    const onFocus = () => {\n      if (props.openOnHover) {\n        open.value = true;\n      }\n    };\n\n    const onBlur = () => {\n      if (props.openOnHover) {\n        open.value = false;\n      }\n    };\n\n    onMounted(() => {\n      document.addEventListener('keydown', keyboardHandler);\n    });\n\n    onUnmounted(() => {\n      document.removeEventListener('keydown', keyboardHandler);\n    });\n\n    watch(\n      () => open.value,\n      (open: boolean) => {\n        if (open) {\n          highlightedKey.value = props.model[0].key;\n          highlightedIndex.value = 0;\n        }\n      },\n    );\n\n    return {\n      dropdown,\n      items,\n      open,\n      highlightedKey,\n      highlightedIndex,\n      attrs,\n      emit,\n      changeHighlighted,\n      keyboardHandler,\n      onBlur,\n      onFocus,\n      clickItem,\n      navigateBy,\n      onPlacement,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonDropdown","NeonIcon","NeonLink","NeonSize","NeonFunctionalColor","props","emit","attrs","useAttrs","dropdown","ref","dropdownPlacement","items","open","highlightedKey","highlightedIndex","changeHighlighted","key","item","onPlacement","placement","isReverse","NeonDropdownPlacement","scrollOnNavigate","element","_a","NeonScrollUtils","navigateBy","offset","$event","newIndex","keyboardHandler","reverseOffset","clickItem","anchor","onFocus","onBlur","onMounted","onUnmounted","watch"],"mappings":"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"}
+{"version":3,"file":"NeonDropdownMenu.ts_vue_type_script_src_6187a2a6_lang.cjs.js","sources":["../../../../src/components/navigation/dropdown-menu/NeonDropdownMenu.ts?vue&type=script&src=6187a2a6&lang.ts"],"sourcesContent":["import { defineComponent, onMounted, onUnmounted, ref, useAttrs, watch } from 'vue';\nimport type { NeonDropdownMenuItem } from '@/common/models/NeonDropdownMenuItem';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonDropdown from '@/components/presentation/dropdown/NeonDropdown.vue';\nimport { NeonDropdownPlacement } from '@/common/enums/NeonDropdownPlacement';\nimport { NeonScrollUtils } from '@/common/utils/NeonScrollUtils';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\n\n/**\n * <p>A dropdown menu consisting of a button to open the menu and a list of menu items. Clicking on a menu item will\n * result in navigating to the provided URL or notifying the parent component via the @click event.</p>\n * <p><strong>Note:</strong> As well as the options described below, pass through attributes supported by\n * <a href=\"/presentation/dropdown\">NeonDropdown</a> to change the style of the dropdown button.</p>\n */\nexport default defineComponent({\n  name: 'NeonDropdownMenu',\n  components: {\n    NeonDropdown,\n    NeonIcon,\n    NeonLink,\n  },\n  props: {\n    /**\n     * A list of menu items to render in the dropdown menu.\n     */\n    model: { type: Array as () => Array<NeonDropdownMenuItem>, required: true },\n    /**\n     * The size of the dropdown - Small, Medium or Large.\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Medium },\n    /**\n     * The dropdown color.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.LowContrast },\n    /**\n     * Whether the dropdown button is disabled or not.\n     */\n    disabled: { type: Boolean, default: false },\n    /**\n     * Instead of opening on click (default), open on hover.\n     */\n    openOnHover: { type: Boolean, default: false },\n  },\n  emits: [\n    /**\n     * emitted when the user clicks on a menu item.\n     * @type {NeonDropdownMenuItem} the menu item the user clicked on.\n     */\n    'click',\n    /**\n     * emitted on initialisation\n     * @type {HTMLElement} the reference to the HTMLElement for the dropdown menu button.\n     */\n    'button-ref',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const dropdown = ref<HTMLElement | null>(null);\n    const dropdownPlacement = ref<NeonDropdownPlacement | null>(null);\n    const items = ref<Array<HTMLLIElement>>([]);\n    const open = ref(false);\n    const highlightedKey = ref<string | null>(null);\n    const highlightedIndex = ref(-1);\n\n    const changeHighlighted = (key: string) => {\n      highlightedKey.value = key;\n      highlightedIndex.value = props.model.findIndex((item) => item.key === key);\n    };\n\n    const onPlacement = (placement: NeonDropdownPlacement) => {\n      dropdownPlacement.value = placement;\n    };\n\n    const isReverse = () => {\n      switch (dropdownPlacement.value) {\n        case NeonDropdownPlacement.TopLeft:\n        case NeonDropdownPlacement.TopRight:\n        case NeonDropdownPlacement.LeftBottom:\n        case NeonDropdownPlacement.RightBottom:\n          return true;\n      }\n\n      return false;\n    };\n\n    const scrollOnNavigate = () => {\n      const element = dropdown.value?.querySelector('.neon-dropdown-menu__item--highlighted') as HTMLElement;\n      NeonScrollUtils.scrollIntoView(element);\n    };\n\n    const navigateBy = (offset: number, $event: KeyboardEvent) => {\n      const newIndex = highlightedIndex.value + offset;\n      if (newIndex >= 0 && newIndex <= props.model.length - 1) {\n        highlightedIndex.value = newIndex;\n        highlightedKey.value = props.model[highlightedIndex.value].key;\n        $event.preventDefault();\n        setTimeout(scrollOnNavigate);\n      }\n    };\n\n    const keyboardHandler = ($event: KeyboardEvent) => {\n      if (!props.disabled) {\n        if (open.value) {\n          switch ($event.code) {\n            case 'ArrowUp':\n            case 'ArrowDown':\n              {\n                const reverseOffset = isReverse() ? -1 : 1;\n                if ($event.code === 'ArrowUp') {\n                  navigateBy(-1 * reverseOffset, $event);\n                } else {\n                  navigateBy(1 * reverseOffset, $event);\n                }\n              }\n              break;\n            case 'Enter':\n            case 'Space':\n              if (props.model[highlightedIndex.value] && !props.model[highlightedIndex.value].disabled) {\n                clickItem(props.model[highlightedIndex.value]);\n                $event.preventDefault();\n              }\n              break;\n            case 'Tab':\n              if (!$event.ctrlKey && !$event.metaKey && !$event.altKey) {\n                open.value = false;\n              }\n              break;\n            case 'Escape':\n              open.value = false;\n              break;\n          }\n        }\n      }\n    };\n\n    const clickItem = (item: NeonDropdownMenuItem) => {\n      if (!item.disabled) {\n        if (item.href) {\n          const anchor = items.value[highlightedIndex.value]?.firstElementChild as HTMLAnchorElement;\n          anchor && anchor.click();\n        } else {\n          emit('click', item);\n        }\n        open.value = false;\n      }\n    };\n\n    const onFocus = () => {\n      if (props.openOnHover) {\n        open.value = true;\n      }\n    };\n\n    const onBlur = () => {\n      if (props.openOnHover) {\n        open.value = false;\n      }\n    };\n\n    onMounted(() => {\n      document.addEventListener('keydown', keyboardHandler);\n    });\n\n    onUnmounted(() => {\n      document.removeEventListener('keydown', keyboardHandler);\n    });\n\n    watch(\n      () => open.value,\n      (open: boolean) => {\n        if (open) {\n          highlightedKey.value = props.model[0].key;\n          highlightedIndex.value = 0;\n        }\n      },\n    );\n\n    return {\n      dropdown,\n      items,\n      open,\n      highlightedKey,\n      highlightedIndex,\n      attrs,\n      emit,\n      changeHighlighted,\n      keyboardHandler,\n      onBlur,\n      onFocus,\n      clickItem,\n      navigateBy,\n      onPlacement,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonDropdown","NeonIcon","NeonLink","NeonSize","NeonFunctionalColor","props","emit","attrs","useAttrs","dropdown","ref","dropdownPlacement","items","open","highlightedKey","highlightedIndex","changeHighlighted","key","item","onPlacement","placement","isReverse","NeonDropdownPlacement","scrollOnNavigate","element","_a","NeonScrollUtils","navigateBy","offset","$event","newIndex","keyboardHandler","reverseOffset","clickItem","anchor","onFocus","onBlur","onMounted","onUnmounted","watch"],"mappings":"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"}

package/dist/components/navigation/dropdown-menu/{NeonDropdownMenu.ts_vue_type_script_src_47b54115_lang.es.js → NeonDropdownMenu.ts_vue_type_script_src_6187a2a6_lang.es.js}

@@ -153,4 +153,4 @@ var _sfc_main = defineComponent({
   }
 });
 export { _sfc_main as default };
-//# sourceMappingURL=NeonDropdownMenu.ts_vue_type_script_src_47b54115_lang.es.js.map
+//# sourceMappingURL=NeonDropdownMenu.ts_vue_type_script_src_6187a2a6_lang.es.js.map

package/dist/components/navigation/dropdown-menu/{NeonDropdownMenu.ts_vue_type_script_src_47b54115_lang.es.js.map → NeonDropdownMenu.ts_vue_type_script_src_6187a2a6_lang.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NeonDropdownMenu.ts_vue_type_script_src_47b54115_lang.es.js","sources":["../../../../src/components/navigation/dropdown-menu/NeonDropdownMenu.ts?vue&type=script&src=47b54115&lang.ts"],"sourcesContent":["import { defineComponent, onMounted, onUnmounted, ref, useAttrs, watch } from 'vue';\nimport type { NeonDropdownMenuItem } from '@/common/models/NeonDropdownMenuItem';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonDropdown from '@/components/presentation/dropdown/NeonDropdown.vue';\nimport { NeonDropdownPlacement } from '@/common/enums/NeonDropdownPlacement';\nimport { NeonScrollUtils } from '@/common/utils/NeonScrollUtils';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\n\n/**\n * <p>A dropdown menu consisting of a button to open the menu and a list of menu items. Clicking on a menu item will\n * result in navigating to the provided URL or notifying the parent component via the @click event.</p>\n * <p><strong>Note:</strong> As well as the options described below, pass through attributes supported by\n * <a href=\"/presentation/dropdown\">NeonDropdown</a> to change the style of the dropdown button.</p>\n */\nexport default defineComponent({\n  name: 'NeonDropdownMenu',\n  components: {\n    NeonDropdown,\n    NeonIcon,\n    NeonLink,\n  },\n  props: {\n    /**\n     * A list of menu items to render in the dropdown menu.\n     */\n    model: { type: Array as () => Array<NeonDropdownMenuItem>, required: true },\n    /**\n     * The size of the dropdown - Small, Medium or Large.\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Medium },\n    /**\n     * The dropdown color.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.LowContrast },\n    /**\n     * Whether the dropdown button is disabled or not.\n     */\n    disabled: { type: Boolean, default: false },\n    /**\n     * Instead of opening on click (default), open on hover.\n     */\n    openOnHover: { type: Boolean, default: false },\n  },\n  emits: [\n    /**\n     * emitted when the user clicks on a menu item.\n     * @type {NeonDropdownMenuItem} the menu item the user clicked on.\n     */\n    'click',\n    /**\n     * emitted on initialisation\n     * @type {HTMLElement} the reference to the HTMLElement for the dropdown menu button.\n     */\n    'button-ref',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const dropdown = ref<HTMLElement | null>(null);\n    const dropdownPlacement = ref<NeonDropdownPlacement | null>(null);\n    const items = ref<Array<HTMLLIElement>>([]);\n    const open = ref(false);\n    const highlightedKey = ref<string | null>(null);\n    const highlightedIndex = ref(-1);\n\n    const changeHighlighted = (key: string) => {\n      highlightedKey.value = key;\n      highlightedIndex.value = props.model.findIndex((item) => item.key === key);\n    };\n\n    const onPlacement = (placement: NeonDropdownPlacement) => {\n      dropdownPlacement.value = placement;\n    };\n\n    const isReverse = () => {\n      switch (dropdownPlacement.value) {\n        case NeonDropdownPlacement.TopLeft:\n        case NeonDropdownPlacement.TopRight:\n        case NeonDropdownPlacement.LeftBottom:\n        case NeonDropdownPlacement.RightBottom:\n          return true;\n      }\n\n      return false;\n    };\n\n    const scrollOnNavigate = () => {\n      const element = dropdown.value?.querySelector('.neon-dropdown-menu__item--highlighted') as HTMLElement;\n      NeonScrollUtils.scrollIntoView(element);\n    };\n\n    const navigateBy = (offset: number, $event: KeyboardEvent) => {\n      const newIndex = highlightedIndex.value + offset;\n      if (newIndex >= 0 && newIndex <= props.model.length - 1) {\n        highlightedIndex.value = newIndex;\n        highlightedKey.value = props.model[highlightedIndex.value].key;\n        $event.preventDefault();\n        setTimeout(scrollOnNavigate);\n      }\n    };\n\n    const keyboardHandler = ($event: KeyboardEvent) => {\n      if (!props.disabled) {\n        if (open.value) {\n          switch ($event.code) {\n            case 'ArrowUp':\n            case 'ArrowDown':\n              {\n                const reverseOffset = isReverse() ? -1 : 1;\n                if ($event.code === 'ArrowUp') {\n                  navigateBy(-1 * reverseOffset, $event);\n                } else {\n                  navigateBy(1 * reverseOffset, $event);\n                }\n              }\n              break;\n            case 'Enter':\n            case 'Space':\n              if (props.model[highlightedIndex.value] && !props.model[highlightedIndex.value].disabled) {\n                clickItem(props.model[highlightedIndex.value]);\n                $event.preventDefault();\n              }\n              break;\n            case 'Tab':\n              if (!$event.ctrlKey && !$event.metaKey && !$event.altKey) {\n                open.value = false;\n              }\n              break;\n            case 'Escape':\n              open.value = false;\n              break;\n          }\n        }\n      }\n    };\n\n    const clickItem = (item: NeonDropdownMenuItem) => {\n      if (!item.disabled) {\n        if (item.href) {\n          const anchor = items.value[highlightedIndex.value]?.firstElementChild as HTMLAnchorElement;\n          anchor && anchor.click();\n        } else {\n          emit('click', item);\n        }\n        open.value = false;\n      }\n    };\n\n    const onFocus = () => {\n      if (props.openOnHover) {\n        open.value = true;\n      }\n    };\n\n    const onBlur = () => {\n      if (props.openOnHover) {\n        open.value = false;\n      }\n    };\n\n    onMounted(() => {\n      document.addEventListener('keydown', keyboardHandler);\n    });\n\n    onUnmounted(() => {\n      document.removeEventListener('keydown', keyboardHandler);\n    });\n\n    watch(\n      () => open.value,\n      (open: boolean) => {\n        if (open) {\n          highlightedKey.value = props.model[0].key;\n          highlightedIndex.value = 0;\n        }\n      },\n    );\n\n    return {\n      dropdown,\n      items,\n      open,\n      highlightedKey,\n      highlightedIndex,\n      attrs,\n      emit,\n      changeHighlighted,\n      keyboardHandler,\n      onBlur,\n      onFocus,\n      clickItem,\n      navigateBy,\n      onPlacement,\n    };\n  },\n});\n"],"names":["open"],"mappings":"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"}
+{"version":3,"file":"NeonDropdownMenu.ts_vue_type_script_src_6187a2a6_lang.es.js","sources":["../../../../src/components/navigation/dropdown-menu/NeonDropdownMenu.ts?vue&type=script&src=6187a2a6&lang.ts"],"sourcesContent":["import { defineComponent, onMounted, onUnmounted, ref, useAttrs, watch } from 'vue';\nimport type { NeonDropdownMenuItem } from '@/common/models/NeonDropdownMenuItem';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonDropdown from '@/components/presentation/dropdown/NeonDropdown.vue';\nimport { NeonDropdownPlacement } from '@/common/enums/NeonDropdownPlacement';\nimport { NeonScrollUtils } from '@/common/utils/NeonScrollUtils';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\n\n/**\n * <p>A dropdown menu consisting of a button to open the menu and a list of menu items. Clicking on a menu item will\n * result in navigating to the provided URL or notifying the parent component via the @click event.</p>\n * <p><strong>Note:</strong> As well as the options described below, pass through attributes supported by\n * <a href=\"/presentation/dropdown\">NeonDropdown</a> to change the style of the dropdown button.</p>\n */\nexport default defineComponent({\n  name: 'NeonDropdownMenu',\n  components: {\n    NeonDropdown,\n    NeonIcon,\n    NeonLink,\n  },\n  props: {\n    /**\n     * A list of menu items to render in the dropdown menu.\n     */\n    model: { type: Array as () => Array<NeonDropdownMenuItem>, required: true },\n    /**\n     * The size of the dropdown - Small, Medium or Large.\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Medium },\n    /**\n     * The dropdown color.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.LowContrast },\n    /**\n     * Whether the dropdown button is disabled or not.\n     */\n    disabled: { type: Boolean, default: false },\n    /**\n     * Instead of opening on click (default), open on hover.\n     */\n    openOnHover: { type: Boolean, default: false },\n  },\n  emits: [\n    /**\n     * emitted when the user clicks on a menu item.\n     * @type {NeonDropdownMenuItem} the menu item the user clicked on.\n     */\n    'click',\n    /**\n     * emitted on initialisation\n     * @type {HTMLElement} the reference to the HTMLElement for the dropdown menu button.\n     */\n    'button-ref',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const dropdown = ref<HTMLElement | null>(null);\n    const dropdownPlacement = ref<NeonDropdownPlacement | null>(null);\n    const items = ref<Array<HTMLLIElement>>([]);\n    const open = ref(false);\n    const highlightedKey = ref<string | null>(null);\n    const highlightedIndex = ref(-1);\n\n    const changeHighlighted = (key: string) => {\n      highlightedKey.value = key;\n      highlightedIndex.value = props.model.findIndex((item) => item.key === key);\n    };\n\n    const onPlacement = (placement: NeonDropdownPlacement) => {\n      dropdownPlacement.value = placement;\n    };\n\n    const isReverse = () => {\n      switch (dropdownPlacement.value) {\n        case NeonDropdownPlacement.TopLeft:\n        case NeonDropdownPlacement.TopRight:\n        case NeonDropdownPlacement.LeftBottom:\n        case NeonDropdownPlacement.RightBottom:\n          return true;\n      }\n\n      return false;\n    };\n\n    const scrollOnNavigate = () => {\n      const element = dropdown.value?.querySelector('.neon-dropdown-menu__item--highlighted') as HTMLElement;\n      NeonScrollUtils.scrollIntoView(element);\n    };\n\n    const navigateBy = (offset: number, $event: KeyboardEvent) => {\n      const newIndex = highlightedIndex.value + offset;\n      if (newIndex >= 0 && newIndex <= props.model.length - 1) {\n        highlightedIndex.value = newIndex;\n        highlightedKey.value = props.model[highlightedIndex.value].key;\n        $event.preventDefault();\n        setTimeout(scrollOnNavigate);\n      }\n    };\n\n    const keyboardHandler = ($event: KeyboardEvent) => {\n      if (!props.disabled) {\n        if (open.value) {\n          switch ($event.code) {\n            case 'ArrowUp':\n            case 'ArrowDown':\n              {\n                const reverseOffset = isReverse() ? -1 : 1;\n                if ($event.code === 'ArrowUp') {\n                  navigateBy(-1 * reverseOffset, $event);\n                } else {\n                  navigateBy(1 * reverseOffset, $event);\n                }\n              }\n              break;\n            case 'Enter':\n            case 'Space':\n              if (props.model[highlightedIndex.value] && !props.model[highlightedIndex.value].disabled) {\n                clickItem(props.model[highlightedIndex.value]);\n                $event.preventDefault();\n              }\n              break;\n            case 'Tab':\n              if (!$event.ctrlKey && !$event.metaKey && !$event.altKey) {\n                open.value = false;\n              }\n              break;\n            case 'Escape':\n              open.value = false;\n              break;\n          }\n        }\n      }\n    };\n\n    const clickItem = (item: NeonDropdownMenuItem) => {\n      if (!item.disabled) {\n        if (item.href) {\n          const anchor = items.value[highlightedIndex.value]?.firstElementChild as HTMLAnchorElement;\n          anchor && anchor.click();\n        } else {\n          emit('click', item);\n        }\n        open.value = false;\n      }\n    };\n\n    const onFocus = () => {\n      if (props.openOnHover) {\n        open.value = true;\n      }\n    };\n\n    const onBlur = () => {\n      if (props.openOnHover) {\n        open.value = false;\n      }\n    };\n\n    onMounted(() => {\n      document.addEventListener('keydown', keyboardHandler);\n    });\n\n    onUnmounted(() => {\n      document.removeEventListener('keydown', keyboardHandler);\n    });\n\n    watch(\n      () => open.value,\n      (open: boolean) => {\n        if (open) {\n          highlightedKey.value = props.model[0].key;\n          highlightedIndex.value = 0;\n        }\n      },\n    );\n\n    return {\n      dropdown,\n      items,\n      open,\n      highlightedKey,\n      highlightedIndex,\n      attrs,\n      emit,\n      changeHighlighted,\n      keyboardHandler,\n      onBlur,\n      onFocus,\n      clickItem,\n      navigateBy,\n      onPlacement,\n    };\n  },\n});\n"],"names":["open"],"mappings":"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"}

package/dist/components/navigation/link/NeonLink.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var r=require("./NeonLink.ts_vue_type_script_src_8226f84c_lang.cjs.js"),n=require("vue"),s=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const a={class:"neon-link__label"},k=["href"],u={class:"neon-link__label"},d={class:"neon-link__label"};function c(e,o,y,v,C,m){const t=n.resolveComponent("router-link"),i=n.resolveComponent("neon-icon");return e.routerUrl?(n.openBlock(),n.createBlock(t,n.mergeProps({key:0,class:[[{"neon-link--no-style":e.noStyle,"neon-link--active":e.activeRoute,"neon-link--exact-active":e.exactRoute},`neon-link--outline-${e.outlineStyle}`],"neon-link neon-link--router-link"],to:e.routerUrl,tabindex:"0"},e.sanitizedAttributes,{onClick:e.onClick,onKeydown:n.withKeys(e.onClick,["enter"])}),{default:n.withCtx(()=>[n.createElementVNode("span",a,[n.renderSlot(e.$slots,"default")])]),_:3},16,["class","to","onClick","onKeydown"])):e.href?(n.openBlock(),n.createElementBlock("a",n.mergeProps({key:1,class:[[{"neon-link--no-style":e.noStyle,"neon-link--with-external-indicator":e.externalIndicator,"neon-link--active":e.activeRoute,"neon-link--exact-active":e.exactRoute},`neon-link--outline-${e.outlineStyle}`],"neon-link neon-link--external-link"],href:e.href,rel:"noopener",tabindex:"0"},e.sanitizedAttributes,{onClick:o[0]||(o[0]=(...l)=>e.onClick&&e.onClick(...l)),onKeydown:o[1]||(o[1]=n.withKeys((...l)=>e.onClick&&e.onClick(...l),["enter"]))}),[n.createElementVNode("span",u,[n.renderSlot(e.$slots,"default"),e.externalIndicator?(n.openBlock(),n.createBlock(i,{key:0,class:"neon-link__external-indicator",color:"low-contrast",name:"link-external"})):n.createCommentVNode("",!0)])],16,k)):(n.openBlock(),n.createElementBlock("a",n.mergeProps({key:2,class:[[{"neon-link--no-style":e.noStyle},`neon-link--outline-${e.outlineStyle}`],"neon-link"],tabindex:"0"},e.sanitizedAttributes,{onClick:o[2]||(o[2]=(...l)=>e.onClick&&e.onClick(...l)),onKeydown:o[3]||(o[3]=n.withKeys((...l)=>e.onClick&&e.onClick(...l),["enter"]))}),[n.createElementVNode("span",d,[n.renderSlot(e.$slots,"default")])],16))}var p=s(r,[["render",c],["__file","/Users/andrew/dev/projects/neon/src/components/navigation/link/NeonLink.vue"]]);module.exports=p;
+"use strict";var r=require("./NeonLink.ts_vue_type_script_src_037ccc85_lang.cjs.js"),n=require("vue"),s=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const a={class:"neon-link__label"},k=["href"],u={class:"neon-link__label"},c={class:"neon-link__label"};function d(e,o,y,v,C,m){const t=n.resolveComponent("router-link"),i=n.resolveComponent("neon-icon");return e.routerUrl?(n.openBlock(),n.createBlock(t,n.mergeProps({key:0,class:[[{"neon-link--no-style":e.noStyle,"neon-link--active":e.activeRoute,"neon-link--exact-active":e.exactRoute},`neon-link--outline-${e.outlineStyle}`],"neon-link neon-link--router-link"],to:e.routerUrl,tabindex:"0"},e.sanitizedAttributes,{onClick:e.onClick,onKeydown:n.withKeys(e.onClick,["enter"])}),{default:n.withCtx(()=>[n.createElementVNode("span",a,[n.renderSlot(e.$slots,"default")])]),_:3},16,["class","to","onClick","onKeydown"])):e.href?(n.openBlock(),n.createElementBlock("a",n.mergeProps({key:1,class:[[{"neon-link--no-style":e.noStyle,"neon-link--with-external-indicator":e.externalIndicator,"neon-link--active":e.activeRoute,"neon-link--exact-active":e.exactRoute},`neon-link--outline-${e.outlineStyle}`],"neon-link neon-link--external-link"],href:e.href,rel:"noopener",tabindex:"0"},e.sanitizedAttributes,{onClick:o[0]||(o[0]=(...l)=>e.onClick&&e.onClick(...l)),onKeydown:o[1]||(o[1]=n.withKeys((...l)=>e.onClick&&e.onClick(...l),["enter"]))}),[n.createElementVNode("span",u,[n.renderSlot(e.$slots,"default"),e.externalIndicator?(n.openBlock(),n.createBlock(i,{key:0,class:"neon-link__external-indicator",color:"low-contrast",name:"link-external"})):n.createCommentVNode("",!0)])],16,k)):(n.openBlock(),n.createElementBlock("a",n.mergeProps({key:2,class:[[{"neon-link--no-style":e.noStyle},`neon-link--outline-${e.outlineStyle}`],"neon-link"],tabindex:"0"},e.sanitizedAttributes,{onClick:o[2]||(o[2]=(...l)=>e.onClick&&e.onClick(...l)),onKeydown:o[3]||(o[3]=n.withKeys((...l)=>e.onClick&&e.onClick(...l),["enter"]))}),[n.createElementVNode("span",c,[n.renderSlot(e.$slots,"default")])],16))}var p=s(r,[["render",d]]);module.exports=p;
 //# sourceMappingURL=NeonLink.cjs.js.map

package/dist/components/navigation/link/NeonLink.es.js

@@ -1,4 +1,4 @@
-import _sfc_main from "./NeonLink.ts_vue_type_script_src_8226f84c_lang.es.js";
+import _sfc_main from "./NeonLink.ts_vue_type_script_src_037ccc85_lang.es.js";
 import { resolveComponent, openBlock, createBlock, mergeProps, withKeys, withCtx, createElementVNode, renderSlot, createElementBlock, createCommentVNode } from "vue";
 import _export_sfc from "../../../_virtual/plugin-vue_export-helper.es.js";
 const _hoisted_1 = { class: "neon-link__label" };
@@ -66,6 +66,6 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     ])
   ], 16));
 }
-var NeonLink = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/andrew/dev/projects/neon/src/components/navigation/link/NeonLink.vue"]]);
+var NeonLink = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export { NeonLink as default };
 //# sourceMappingURL=NeonLink.es.js.map

package/dist/components/navigation/link/{NeonLink.ts_vue_type_script_src_8226f84c_lang.cjs.js → NeonLink.ts_vue_type_script_src_037ccc85_lang.cjs.js}

@@ -1,2 +1,2 @@
 "use strict";var e=require("vue"),f=require("../../../common/enums/NeonOutlineStyle.cjs.js"),d=require("../../presentation/icon/NeonIcon.cjs.js"),m=require("vue-router"),v=e.defineComponent({name:"NeonLink",components:{NeonIcon:d},props:{href:{type:String,default:null},noStyle:{type:Boolean,default:!1},outlineStyle:{type:String,default:f.NeonOutlineStyle.Text},externalIndicator:{type:Boolean,default:!1}},emits:["click"],setup(t,{emit:r}){const i=e.useAttrs(),o=m.useRoute(),c=e.computed(()=>{var n;return((n=t.href)==null?void 0:n.indexOf("//"))===-1?t.href:void 0}),u=e.computed(()=>t.href&&t.href.indexOf(o.fullPath)===0),l=e.computed(()=>u.value&&t.href===o.fullPath),s=e.computed(()=>{const{onClick:n,...a}=i;return a});return{routerUrl:c,sanitizedAttributes:s,activeRoute:u,exactRoute:l,onClick:()=>{r("click")}}}});module.exports=v;
-//# sourceMappingURL=NeonLink.ts_vue_type_script_src_8226f84c_lang.cjs.js.map
+//# sourceMappingURL=NeonLink.ts_vue_type_script_src_037ccc85_lang.cjs.js.map

package/dist/components/navigation/link/{NeonLink.ts_vue_type_script_src_8226f84c_lang.cjs.js.map → NeonLink.ts_vue_type_script_src_037ccc85_lang.cjs.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NeonLink.ts_vue_type_script_src_8226f84c_lang.cjs.js","sources":["../../../../src/components/navigation/link/NeonLink.ts?vue&type=script&src=8226f84c&lang.ts"],"sourcesContent":["import { computed, defineComponent, useAttrs } from 'vue';\nimport { NeonOutlineStyle } from '@/common/enums/NeonOutlineStyle';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { useRoute } from 'vue-router';\n\n/**\n * An HTML anchor component which handles VueRouter links (internal), href links (external) and clickable links (no href).\n */\nexport default defineComponent({\n  name: 'NeonLink',\n  components: {\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The href of the link, this can be an internal (relative or absolute) or an external link.\n     */\n    href: { type: String, default: null },\n    /**\n     * set to true if you would like a completely unstyled link. This is useful for creating a complex component which may use NeonLink.\n     */\n    noStyle: { type: Boolean, default: false },\n    /**\n     * Style of the outline to use when the link has focus, use <em>text</em> for wrapping text content and\n     * <em>border</em> for tooltips wrapping \"block\" elements, e.g. buttons.\n     */\n    outlineStyle: { type: String as () => NeonOutlineStyle, default: NeonOutlineStyle.Text },\n    /**\n     * Display an external link icon to the right of the link indicating clicking it will take the user to another site.\n     */\n    externalIndicator: { type: Boolean, default: false },\n  },\n  emits: [\n    /**\n     * Emitted when the user triggers the link by clicking on it or hitting Enter when the link has focus.\n     * @type {void}\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const route = useRoute();\n    const routerUrl = computed(() => (props.href?.indexOf('//') === -1 ? props.href : undefined));\n\n    const activeRoute = computed(() => props.href && props.href.indexOf(route.fullPath) === 0);\n    const exactRoute = computed(() => activeRoute.value && props.href === route.fullPath);\n\n    const sanitizedAttributes = computed(() => {\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      const { onClick, ...sanitized } = attrs;\n      return sanitized;\n    });\n\n    const onClick = () => {\n      emit('click');\n    };\n\n    return {\n      routerUrl,\n      sanitizedAttributes,\n      activeRoute,\n      exactRoute,\n      onClick,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonOutlineStyle","props","emit","attrs","useAttrs","route","useRoute","routerUrl","computed","_a","activeRoute","exactRoute","sanitizedAttributes","onClick","sanitized"],"mappings":"0KAQAA,EAAeC,kBAAgB,CAC7B,KAAM,WACN,WAAY,CACV,SAAAC,CACF,EACA,MAAO,CAIL,KAAM,CAAE,KAAM,OAAQ,QAAS,IAAK,EAIpC,QAAS,CAAE,KAAM,QAAS,QAAS,EAAM,EAKzC,aAAc,CAAE,KAAM,OAAkC,QAASC,EAAAA,iBAAiB,IAAK,EAIvF,kBAAmB,CAAE,KAAM,QAAS,QAAS,EAAM,CACrD,EACA,MAAO,CAKL,OACF,EACA,MAAMC,EAAO,CAAE,KAAAC,GAAQ,CACrB,MAAMC,EAAQC,EAAAA,WACRC,EAAQC,EAAAA,WACRC,EAAYC,EAAS,SAAA,WAAO,QAAAC,EAAAR,EAAM,OAAN,YAAAQ,EAAY,QAAQ,SAAU,GAAKR,EAAM,KAAO,OAAU,EAEtFS,EAAcF,EAAAA,SAAS,IAAMP,EAAM,MAAQA,EAAM,KAAK,QAAQI,EAAM,QAAQ,IAAM,CAAC,EACnFM,EAAaH,WAAS,IAAME,EAAY,OAAST,EAAM,OAASI,EAAM,QAAQ,EAE9EO,EAAsBJ,EAAAA,SAAS,IAAM,CAEzC,KAAM,CAAE,QAAAK,KAAYC,CAAA,EAAcX,EAC3B,OAAAW,CAAA,CACR,EAMM,MAAA,CACL,UAAAP,EACA,oBAAAK,EACA,YAAAF,EACA,WAAAC,EACA,QATc,IAAM,CACpBT,EAAK,OAAO,CAAA,CAQZ,CAEJ,CACF,CAAC"}
+{"version":3,"file":"NeonLink.ts_vue_type_script_src_037ccc85_lang.cjs.js","sources":["../../../../src/components/navigation/link/NeonLink.ts?vue&type=script&src=037ccc85&lang.ts"],"sourcesContent":["import { computed, defineComponent, useAttrs } from 'vue';\nimport { NeonOutlineStyle } from '@/common/enums/NeonOutlineStyle';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { useRoute } from 'vue-router';\n\n/**\n * An HTML anchor component which handles VueRouter links (internal), href links (external) and clickable links (no href).\n */\nexport default defineComponent({\n  name: 'NeonLink',\n  components: {\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The href of the link, this can be an internal (relative or absolute) or an external link.\n     */\n    href: { type: String, default: null },\n    /**\n     * set to true if you would like a completely unstyled link. This is useful for creating a complex component which may use NeonLink.\n     */\n    noStyle: { type: Boolean, default: false },\n    /**\n     * Style of the outline to use when the link has focus, use <em>text</em> for wrapping text content and\n     * <em>border</em> for tooltips wrapping \"block\" elements, e.g. buttons.\n     */\n    outlineStyle: { type: String as () => NeonOutlineStyle, default: NeonOutlineStyle.Text },\n    /**\n     * Display an external link icon to the right of the link indicating clicking it will take the user to another site.\n     */\n    externalIndicator: { type: Boolean, default: false },\n  },\n  emits: [\n    /**\n     * Emitted when the user triggers the link by clicking on it or hitting Enter when the link has focus.\n     * @type {void}\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const route = useRoute();\n    const routerUrl = computed(() => (props.href?.indexOf('//') === -1 ? props.href : undefined));\n\n    const activeRoute = computed(() => props.href && props.href.indexOf(route.fullPath) === 0);\n    const exactRoute = computed(() => activeRoute.value && props.href === route.fullPath);\n\n    const sanitizedAttributes = computed(() => {\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      const { onClick, ...sanitized } = attrs;\n      return sanitized;\n    });\n\n    const onClick = () => {\n      emit('click');\n    };\n\n    return {\n      routerUrl,\n      sanitizedAttributes,\n      activeRoute,\n      exactRoute,\n      onClick,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonOutlineStyle","props","emit","attrs","useAttrs","route","useRoute","routerUrl","computed","_a","activeRoute","exactRoute","sanitizedAttributes","onClick","sanitized"],"mappings":"0KAQAA,EAAeC,kBAAgB,CAC7B,KAAM,WACN,WAAY,CACV,SAAAC,CACF,EACA,MAAO,CAIL,KAAM,CAAE,KAAM,OAAQ,QAAS,IAAK,EAIpC,QAAS,CAAE,KAAM,QAAS,QAAS,EAAM,EAKzC,aAAc,CAAE,KAAM,OAAkC,QAASC,EAAAA,iBAAiB,IAAK,EAIvF,kBAAmB,CAAE,KAAM,QAAS,QAAS,EAAM,CACrD,EACA,MAAO,CAKL,OACF,EACA,MAAMC,EAAO,CAAE,KAAAC,GAAQ,CACrB,MAAMC,EAAQC,EAAAA,WACRC,EAAQC,EAAAA,WACRC,EAAYC,EAAS,SAAA,WAAO,QAAAC,EAAAR,EAAM,OAAN,YAAAQ,EAAY,QAAQ,SAAU,GAAKR,EAAM,KAAO,OAAU,EAEtFS,EAAcF,EAAAA,SAAS,IAAMP,EAAM,MAAQA,EAAM,KAAK,QAAQI,EAAM,QAAQ,IAAM,CAAC,EACnFM,EAAaH,WAAS,IAAME,EAAY,OAAST,EAAM,OAASI,EAAM,QAAQ,EAE9EO,EAAsBJ,EAAAA,SAAS,IAAM,CAEzC,KAAM,CAAE,QAAAK,KAAYC,CAAA,EAAcX,EAC3B,OAAAW,CAAA,CACR,EAMM,MAAA,CACL,UAAAP,EACA,oBAAAK,EACA,YAAAF,EACA,WAAAC,EACA,QATc,IAAM,CACpBT,EAAK,OAAO,CAAA,CAQZ,CAEJ,CACF,CAAC"}

package/dist/components/navigation/link/{NeonLink.ts_vue_type_script_src_8226f84c_lang.es.js → NeonLink.ts_vue_type_script_src_037ccc85_lang.es.js}

@@ -42,4 +42,4 @@ var _sfc_main = defineComponent({
   }
 });
 export { _sfc_main as default };
-//# sourceMappingURL=NeonLink.ts_vue_type_script_src_8226f84c_lang.es.js.map
+//# sourceMappingURL=NeonLink.ts_vue_type_script_src_037ccc85_lang.es.js.map

package/dist/components/navigation/link/{NeonLink.ts_vue_type_script_src_8226f84c_lang.es.js.map → NeonLink.ts_vue_type_script_src_037ccc85_lang.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NeonLink.ts_vue_type_script_src_8226f84c_lang.es.js","sources":["../../../../src/components/navigation/link/NeonLink.ts?vue&type=script&src=8226f84c&lang.ts"],"sourcesContent":["import { computed, defineComponent, useAttrs } from 'vue';\nimport { NeonOutlineStyle } from '@/common/enums/NeonOutlineStyle';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { useRoute } from 'vue-router';\n\n/**\n * An HTML anchor component which handles VueRouter links (internal), href links (external) and clickable links (no href).\n */\nexport default defineComponent({\n  name: 'NeonLink',\n  components: {\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The href of the link, this can be an internal (relative or absolute) or an external link.\n     */\n    href: { type: String, default: null },\n    /**\n     * set to true if you would like a completely unstyled link. This is useful for creating a complex component which may use NeonLink.\n     */\n    noStyle: { type: Boolean, default: false },\n    /**\n     * Style of the outline to use when the link has focus, use <em>text</em> for wrapping text content and\n     * <em>border</em> for tooltips wrapping \"block\" elements, e.g. buttons.\n     */\n    outlineStyle: { type: String as () => NeonOutlineStyle, default: NeonOutlineStyle.Text },\n    /**\n     * Display an external link icon to the right of the link indicating clicking it will take the user to another site.\n     */\n    externalIndicator: { type: Boolean, default: false },\n  },\n  emits: [\n    /**\n     * Emitted when the user triggers the link by clicking on it or hitting Enter when the link has focus.\n     * @type {void}\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const route = useRoute();\n    const routerUrl = computed(() => (props.href?.indexOf('//') === -1 ? props.href : undefined));\n\n    const activeRoute = computed(() => props.href && props.href.indexOf(route.fullPath) === 0);\n    const exactRoute = computed(() => activeRoute.value && props.href === route.fullPath);\n\n    const sanitizedAttributes = computed(() => {\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      const { onClick, ...sanitized } = attrs;\n      return sanitized;\n    });\n\n    const onClick = () => {\n      emit('click');\n    };\n\n    return {\n      routerUrl,\n      sanitizedAttributes,\n      activeRoute,\n      exactRoute,\n      onClick,\n    };\n  },\n});\n"],"names":["onClick"],"mappings":";;;;AAQA,IAAA,YAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IAIL,MAAM,EAAE,MAAM,QAAQ,SAAS,KAAK;AAAA,IAIpC,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM;AAAA,IAKzC,cAAc,EAAE,MAAM,QAAkC,SAAS,iBAAiB,KAAK;AAAA,IAIvF,mBAAmB,EAAE,MAAM,SAAS,SAAS,MAAM;AAAA,EACrD;AAAA,EACA,OAAO;AAAA,IAKL;AAAA,EACF;AAAA,EACA,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,QAAQ;AACd,UAAM,QAAQ;AACR,UAAA,YAAY,SAAS;;AAAO,0BAAM,SAAN,mBAAY,QAAQ,WAAU,KAAK,MAAM,OAAO;AAAA,KAAU;AAEtF,UAAA,cAAc,SAAS,MAAM,MAAM,QAAQ,MAAM,KAAK,QAAQ,MAAM,QAAQ,MAAM,CAAC;AACnF,UAAA,aAAa,SAAS,MAAM,YAAY,SAAS,MAAM,SAAS,MAAM,QAAQ;AAE9E,UAAA,sBAAsB,SAAS,MAAM;AAEzC,YAAM,EAAE,SAAAA,aAAY,UAAA,IAAc;AAC3B,aAAA;AAAA,IAAA,CACR;AAED,UAAM,UAAU,MAAM;AACpB,WAAK,OAAO;AAAA,IAAA;AAGP,WAAA;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;;"}
+{"version":3,"file":"NeonLink.ts_vue_type_script_src_037ccc85_lang.es.js","sources":["../../../../src/components/navigation/link/NeonLink.ts?vue&type=script&src=037ccc85&lang.ts"],"sourcesContent":["import { computed, defineComponent, useAttrs } from 'vue';\nimport { NeonOutlineStyle } from '@/common/enums/NeonOutlineStyle';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { useRoute } from 'vue-router';\n\n/**\n * An HTML anchor component which handles VueRouter links (internal), href links (external) and clickable links (no href).\n */\nexport default defineComponent({\n  name: 'NeonLink',\n  components: {\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The href of the link, this can be an internal (relative or absolute) or an external link.\n     */\n    href: { type: String, default: null },\n    /**\n     * set to true if you would like a completely unstyled link. This is useful for creating a complex component which may use NeonLink.\n     */\n    noStyle: { type: Boolean, default: false },\n    /**\n     * Style of the outline to use when the link has focus, use <em>text</em> for wrapping text content and\n     * <em>border</em> for tooltips wrapping \"block\" elements, e.g. buttons.\n     */\n    outlineStyle: { type: String as () => NeonOutlineStyle, default: NeonOutlineStyle.Text },\n    /**\n     * Display an external link icon to the right of the link indicating clicking it will take the user to another site.\n     */\n    externalIndicator: { type: Boolean, default: false },\n  },\n  emits: [\n    /**\n     * Emitted when the user triggers the link by clicking on it or hitting Enter when the link has focus.\n     * @type {void}\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const route = useRoute();\n    const routerUrl = computed(() => (props.href?.indexOf('//') === -1 ? props.href : undefined));\n\n    const activeRoute = computed(() => props.href && props.href.indexOf(route.fullPath) === 0);\n    const exactRoute = computed(() => activeRoute.value && props.href === route.fullPath);\n\n    const sanitizedAttributes = computed(() => {\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      const { onClick, ...sanitized } = attrs;\n      return sanitized;\n    });\n\n    const onClick = () => {\n      emit('click');\n    };\n\n    return {\n      routerUrl,\n      sanitizedAttributes,\n      activeRoute,\n      exactRoute,\n      onClick,\n    };\n  },\n});\n"],"names":["onClick"],"mappings":";;;;AAQA,IAAA,YAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IAIL,MAAM,EAAE,MAAM,QAAQ,SAAS,KAAK;AAAA,IAIpC,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM;AAAA,IAKzC,cAAc,EAAE,MAAM,QAAkC,SAAS,iBAAiB,KAAK;AAAA,IAIvF,mBAAmB,EAAE,MAAM,SAAS,SAAS,MAAM;AAAA,EACrD;AAAA,EACA,OAAO;AAAA,IAKL;AAAA,EACF;AAAA,EACA,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,QAAQ;AACd,UAAM,QAAQ;AACR,UAAA,YAAY,SAAS;;AAAO,0BAAM,SAAN,mBAAY,QAAQ,WAAU,KAAK,MAAM,OAAO;AAAA,KAAU;AAEtF,UAAA,cAAc,SAAS,MAAM,MAAM,QAAQ,MAAM,KAAK,QAAQ,MAAM,QAAQ,MAAM,CAAC;AACnF,UAAA,aAAa,SAAS,MAAM,YAAY,SAAS,MAAM,SAAS,MAAM,QAAQ;AAE9E,UAAA,sBAAsB,SAAS,MAAM;AAEzC,YAAM,EAAE,SAAAA,aAAY,UAAA,IAAc;AAC3B,aAAA;AAAA,IAAA,CACR;AAED,UAAM,UAAU,MAAM;AACpB,WAAK,OAAO;AAAA,IAAA;AAGP,WAAA;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;;"}

package/dist/components/navigation/menu/NeonMenu.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var i=require("./NeonMenu.ts_vue_type_script_src_1e64150c_lang.cjs.js"),e=require("vue"),c=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const u={ref:"menuWrapper",class:"neon-menu__wrapper"},d={class:"neon-menu__item-label"};function p(o,l,m,_,v,y){const s=e.resolveComponent("neon-dropdown-menu"),a=e.resolveComponent("neon-icon"),t=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(t,{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(r=>!n.disabled&&o.onClick(n.key),["space"])],onKeypress:l[0]||(l[0]=e.withKeys(e.withModifiers(()=>{},["prevent"]),["space"]))},{default:e.withCtx(()=>[n.icon?(e.openBlock(),e.createBlock(a,{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[1]||(l[1]=n=>o.responsiveButton=n)},null,8,["class","color","model","size"])],512)}var k=c(i,[["render",p],["__file","/Users/andrew/dev/projects/neon/src/components/navigation/menu/NeonMenu.vue"]]);module.exports=k;
+"use strict";var i=require("./NeonMenu.ts_vue_type_script_src_0bc1e23f_lang.cjs.js"),e=require("vue"),c=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const u={ref:"menuWrapper",class:"neon-menu__wrapper"},d={class:"neon-menu__item-label"};function p(o,l,m,_,v,y){const r=e.resolveComponent("neon-dropdown-menu"),a=e.resolveComponent("neon-icon"),t=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(r,{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(t,{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:s=>!n.disabled&&o.onClick(n.key),onKeydown:[e.withKeys(s=>!n.disabled&&o.onClick(n.key),["enter"]),e.withKeys(s=>!n.disabled&&o.onClick(n.key),["space"])],onKeypress:l[0]||(l[0]=e.withKeys(e.withModifiers(()=>{},["prevent"]),["space"]))},{default:e.withCtx(()=>[n.icon?(e.openBlock(),e.createBlock(a,{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(r,{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[1]||(l[1]=n=>o.responsiveButton=n)},null,8,["class","color","model","size"])],512)}var k=c(i,[["render",p]]);module.exports=k;
 //# sourceMappingURL=NeonMenu.cjs.js.map

package/dist/components/navigation/menu/NeonMenu.es.js

@@ -1,4 +1,4 @@
-import _sfc_main from "./NeonMenu.ts_vue_type_script_src_1e64150c_lang.es.js";
+import _sfc_main from "./NeonMenu.ts_vue_type_script_src_0bc1e23f_lang.es.js";
 import { resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeClass, Fragment, renderList, createBlock, withKeys, withModifiers, withCtx, createCommentVNode, toDisplayString, createVNode } from "vue";
 import _export_sfc from "../../../_virtual/plugin-vue_export-helper.es.js";
 const _hoisted_1 = {
@@ -77,6 +77,6 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     }, null, 8, ["class", "color", "model", "size"])
   ], 512);
 }
-var NeonMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/andrew/dev/projects/neon/src/components/navigation/menu/NeonMenu.vue"]]);
+var NeonMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export { NeonMenu as default };
 //# sourceMappingURL=NeonMenu.es.js.map

package/dist/components/navigation/menu/{NeonMenu.ts_vue_type_script_src_1e64150c_lang.cjs.js → NeonMenu.ts_vue_type_script_src_0bc1e23f_lang.cjs.js}

@@ -1,2 +1,2 @@
 "use strict";var i=require("vue"),S=require("../link/NeonLink.cjs.js"),x=require("../dropdown-menu/NeonDropdownMenu.cjs.js"),z=require("../../../common/enums/NeonFunctionalColor.cjs.js"),C=require("../../../common/enums/NeonSize.cjs.js"),E=require("../../presentation/icon/NeonIcon.cjs.js"),L=require("vue-router"),W=i.defineComponent({name:"NeonMenu",components:{NeonDropdownMenu:x,NeonLink:S,NeonIcon:E},props:{menu:{type:Array,required:!0},color:{type:String,default:z.NeonFunctionalColor.Brand},size:{type:String,default:C.NeonSize.Large},priorityMenuEnabled:{type:Boolean,default:!0}},emits:["click"],setup(s,{emit:k}){const d=L.useRoute(),v=i.ref(null),f=i.ref(null),o=i.ref(null),u=i.ref([]),y=i.ref([]),a=i.ref([]),m=n=>{const t=window.getComputedStyle(n),e=parseFloat(t.marginLeft||"0")+parseFloat(t.marginRight||"0");return Math.ceil(n.offsetWidth+e)},M=(n,t)=>({key:n,element:t,width:m(t)}),g=()=>{const n=s.menu.map((t,e)=>f.value&&M(t.key,f.value[e])||null);u.value=n.filter(t=>t!==null)},N=n=>(d==null?void 0:d.path.indexOf(n))>=0,j=n=>{k("click",n)},b=(n,t,e)=>{if(e.map(r=>r.width).reduce((r,l)=>r?r+l:0)<=n-t)return e.map(r=>r.key);let h=n-t,c=[];for(let r=0;r<e.length;r=r+1){const l=e[r];if(h<l.width){r===1&&(c=c.filter(q=>q!==e[0].key));break}h=h-l.width,c.push(l.key)}return c},p=async()=>{await i.nextTick();const n=v.value&&m(v.value)||0,t=o.value&&m(o.value)||0;a.value=b(n,t,u.value),y.value=s.menu.filter(e=>a.value.indexOf(e.key)<0).flatMap(e=>[{...e,isGroup:e.children&&e.children.length>0},...(e.children||[]).map(w=>({...w,grouped:!0}))]),u.value.forEach(e=>{e.element.hidden=a.value.indexOf(e.key)<0}),o.value&&(o.value.hidden=u.value.length===a.value.length)};return i.onMounted(async()=>{s.priorityMenuEnabled&&(await i.nextTick(),g(),await p(),window.addEventListener("resize",p))}),i.onUnmounted(()=>{s.priorityMenuEnabled&&window.removeEventListener("resize",p)}),{menuWrapper:v,menuItem:f,menuItems:u,responsiveButton:o,responsiveMenuItems:y,visible:a,onClick:j,routeMatches:N}}});module.exports=W;
-//# sourceMappingURL=NeonMenu.ts_vue_type_script_src_1e64150c_lang.cjs.js.map
+//# sourceMappingURL=NeonMenu.ts_vue_type_script_src_0bc1e23f_lang.cjs.js.map

package/dist/components/navigation/menu/{NeonMenu.ts_vue_type_script_src_1e64150c_lang.cjs.js.map → NeonMenu.ts_vue_type_script_src_0bc1e23f_lang.cjs.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NeonMenu.ts_vue_type_script_src_1e64150c_lang.cjs.js","sources":["../../../../src/components/navigation/menu/NeonMenu.ts?vue&type=script&src=1e64150c&lang.ts"],"sourcesContent":["import { defineComponent, nextTick, onMounted, onUnmounted, ref } from 'vue';\nimport type { NeonMenuModel } from '@/common/models/NeonMenuModel';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\nimport NeonDropdownMenu from '@/components/navigation/dropdown-menu/NeonDropdownMenu.vue';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport type { NeonPriorityMenuItem } from './NeonPriorityMenuItem';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { useRoute } from 'vue-router';\n\n/**\n * <p>\n *   <strong>NeonMenu</strong> is a responsive aware menu that progressively collapses options into the mobile menu as\n *   the screen size gets smaller. This is a more flexible option than moving directly to a hamburger menu at tablet and\n *   below. It is a best effort approach to keep displaying the most important menu items for as long as possible,\n *   giving the user a better experience.\n * </p>\n */\nexport default defineComponent({\n  name: 'NeonMenu',\n  components: {\n    NeonDropdownMenu,\n    NeonLink,\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The menu configuration. This can have two levels, i.e. a top level horizontal menu and, if required, a dropdown\n     * menu containing the second level. The highlighted 'active' menu is determined by the current Vue route.\n     */\n    menu: { type: Array as () => Array<NeonMenuModel>, required: true },\n    /**\n     * The menu highlight color (excludes low-contrast and neutral).\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Brand },\n    /**\n     * The menu size.\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Large },\n    /**\n     * Whether to enable the priority menu which automatically calculates the available screen space and displays\n     * as many of the menu items as possible, moving the remaining items into the overflow menu.\n     */\n    priorityMenuEnabled: { type: Boolean, default: true },\n  },\n  emits: [\n    /**\n     * Emitted when a user clicks on a menu item.\n     * @type {string} the key of the menu item clicked.\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const route = useRoute();\n    const menuWrapper = ref<HTMLElement | null>(null);\n    const menuItem = ref<Array<HTMLElement> | null>(null);\n    const responsiveButton = ref<HTMLElement | null>(null);\n\n    const menuItems = ref<Array<NeonPriorityMenuItem>>([]);\n    const responsiveMenuItems = ref<Array<NeonMenuModel>>([]);\n    const visible = ref<Array<string>>([]);\n\n    const getWidth = (el: HTMLElement) => {\n      const styles = window.getComputedStyle(el);\n      const margin = parseFloat(styles.marginLeft || '0') + parseFloat(styles.marginRight || '0');\n      return Math.ceil(el.offsetWidth + margin);\n    };\n\n    const toPriorityMenuItem = (key: string, element: HTMLElement): NeonPriorityMenuItem => {\n      return {\n        key,\n        element,\n        width: getWidth(element),\n      };\n    };\n\n    const initMenuItems = () => {\n      const results = props.menu.map(\n        (item, index) => (menuItem.value && toPriorityMenuItem(item.key, menuItem.value[index])) || null,\n      );\n      menuItems.value = results.filter((item) => item !== null) as NeonPriorityMenuItem[];\n    };\n\n    const routeMatches = (path: string) => {\n      return route?.path.indexOf(path) >= 0;\n    };\n\n    const onClick = (key: string) => {\n      emit('click', key);\n    };\n\n    const determineVisibleMenuItems = (\n      menuWidth: number,\n      responsiveMenuWidth: number,\n      menuItems: NeonPriorityMenuItem[],\n    ) => {\n      const itemWidthSum = menuItems.map((item) => item.width).reduce((acc: number, width) => (acc ? acc + width : 0));\n\n      // no responsive menu\n      if (itemWidthSum <= menuWidth - responsiveMenuWidth) {\n        return menuItems.map((menuItem) => menuItem.key);\n      }\n\n      // with responsive menu\n      let availableWidth = menuWidth - responsiveMenuWidth;\n      let visible: string[] = [];\n\n      for (let i = 0; i < menuItems.length; i = i + 1) {\n        const menuItem = menuItems[i];\n        if (availableWidth < menuItem.width) {\n          // if the second menu item should be hidden, also hide the first one to improve how it looks\n          if (i === 1) {\n            visible = visible.filter((key) => key !== menuItems[0].key);\n          }\n          break;\n        }\n\n        availableWidth = availableWidth - menuItem.width;\n        visible.push(menuItem.key);\n      }\n\n      return visible;\n    };\n\n    const refreshVisibleMenu = async () => {\n      await nextTick();\n      const menuWidth = (menuWrapper.value && getWidth(menuWrapper.value)) || 0;\n      const responsiveMenuWidth = (responsiveButton.value && getWidth(responsiveButton.value)) || 0;\n      visible.value = determineVisibleMenuItems(menuWidth, responsiveMenuWidth, menuItems.value);\n\n      responsiveMenuItems.value = props.menu\n        .filter((item) => visible.value.indexOf(item.key) < 0)\n        .flatMap((item) => [\n          { ...item, isGroup: item.children && item.children.length > 0 },\n          ...(item.children || []).map((item) => ({ ...item, grouped: true })),\n        ]);\n\n      menuItems.value.forEach((item) => {\n        item.element.hidden = visible.value.indexOf(item.key) < 0;\n      });\n\n      if (responsiveButton.value) {\n        responsiveButton.value.hidden = menuItems.value.length === visible.value.length;\n      }\n    };\n\n    onMounted(async () => {\n      if (props.priorityMenuEnabled) {\n        await nextTick();\n        initMenuItems();\n        await refreshVisibleMenu();\n        window.addEventListener('resize', refreshVisibleMenu);\n      }\n    });\n\n    onUnmounted(() => {\n      if (props.priorityMenuEnabled) {\n        window.removeEventListener('resize', refreshVisibleMenu);\n      }\n    });\n\n    return {\n      menuWrapper,\n      menuItem,\n      menuItems,\n      responsiveButton,\n      responsiveMenuItems,\n      visible,\n      onClick,\n      routeMatches,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonDropdownMenu","NeonLink","NeonIcon","NeonFunctionalColor","NeonSize","props","emit","route","useRoute","menuWrapper","ref","menuItem","responsiveButton","menuItems","responsiveMenuItems","visible","getWidth","el","styles","margin","toPriorityMenuItem","key","element","initMenuItems","results","item","index","routeMatches","path","onClick","determineVisibleMenuItems","menuWidth","responsiveMenuWidth","acc","width","availableWidth","i","refreshVisibleMenu","nextTick","onMounted","onUnmounted"],"mappings":"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"}
+{"version":3,"file":"NeonMenu.ts_vue_type_script_src_0bc1e23f_lang.cjs.js","sources":["../../../../src/components/navigation/menu/NeonMenu.ts?vue&type=script&src=0bc1e23f&lang.ts"],"sourcesContent":["import { defineComponent, nextTick, onMounted, onUnmounted, ref } from 'vue';\nimport type { NeonMenuModel } from '@/common/models/NeonMenuModel';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\nimport NeonDropdownMenu from '@/components/navigation/dropdown-menu/NeonDropdownMenu.vue';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport type { NeonPriorityMenuItem } from './NeonPriorityMenuItem';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { useRoute } from 'vue-router';\n\n/**\n * <p>\n *   <strong>NeonMenu</strong> is a responsive aware menu that progressively collapses options into the mobile menu as\n *   the screen size gets smaller. This is a more flexible option than moving directly to a hamburger menu at tablet and\n *   below. It is a best effort approach to keep displaying the most important menu items for as long as possible,\n *   giving the user a better experience.\n * </p>\n */\nexport default defineComponent({\n  name: 'NeonMenu',\n  components: {\n    NeonDropdownMenu,\n    NeonLink,\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The menu configuration. This can have two levels, i.e. a top level horizontal menu and, if required, a dropdown\n     * menu containing the second level. The highlighted 'active' menu is determined by the current Vue route.\n     */\n    menu: { type: Array as () => Array<NeonMenuModel>, required: true },\n    /**\n     * The menu highlight color (excludes low-contrast and neutral).\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Brand },\n    /**\n     * The menu size.\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Large },\n    /**\n     * Whether to enable the priority menu which automatically calculates the available screen space and displays\n     * as many of the menu items as possible, moving the remaining items into the overflow menu.\n     */\n    priorityMenuEnabled: { type: Boolean, default: true },\n  },\n  emits: [\n    /**\n     * Emitted when a user clicks on a menu item.\n     * @type {string} the key of the menu item clicked.\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const route = useRoute();\n    const menuWrapper = ref<HTMLElement | null>(null);\n    const menuItem = ref<Array<HTMLElement> | null>(null);\n    const responsiveButton = ref<HTMLElement | null>(null);\n\n    const menuItems = ref<Array<NeonPriorityMenuItem>>([]);\n    const responsiveMenuItems = ref<Array<NeonMenuModel>>([]);\n    const visible = ref<Array<string>>([]);\n\n    const getWidth = (el: HTMLElement) => {\n      const styles = window.getComputedStyle(el);\n      const margin = parseFloat(styles.marginLeft || '0') + parseFloat(styles.marginRight || '0');\n      return Math.ceil(el.offsetWidth + margin);\n    };\n\n    const toPriorityMenuItem = (key: string, element: HTMLElement): NeonPriorityMenuItem => {\n      return {\n        key,\n        element,\n        width: getWidth(element),\n      };\n    };\n\n    const initMenuItems = () => {\n      const results = props.menu.map(\n        (item, index) => (menuItem.value && toPriorityMenuItem(item.key, menuItem.value[index])) || null,\n      );\n      menuItems.value = results.filter((item) => item !== null) as NeonPriorityMenuItem[];\n    };\n\n    const routeMatches = (path: string) => {\n      return route?.path.indexOf(path) >= 0;\n    };\n\n    const onClick = (key: string) => {\n      emit('click', key);\n    };\n\n    const determineVisibleMenuItems = (\n      menuWidth: number,\n      responsiveMenuWidth: number,\n      menuItems: NeonPriorityMenuItem[],\n    ) => {\n      const itemWidthSum = menuItems.map((item) => item.width).reduce((acc: number, width) => (acc ? acc + width : 0));\n\n      // no responsive menu\n      if (itemWidthSum <= menuWidth - responsiveMenuWidth) {\n        return menuItems.map((menuItem) => menuItem.key);\n      }\n\n      // with responsive menu\n      let availableWidth = menuWidth - responsiveMenuWidth;\n      let visible: string[] = [];\n\n      for (let i = 0; i < menuItems.length; i = i + 1) {\n        const menuItem = menuItems[i];\n        if (availableWidth < menuItem.width) {\n          // if the second menu item should be hidden, also hide the first one to improve how it looks\n          if (i === 1) {\n            visible = visible.filter((key) => key !== menuItems[0].key);\n          }\n          break;\n        }\n\n        availableWidth = availableWidth - menuItem.width;\n        visible.push(menuItem.key);\n      }\n\n      return visible;\n    };\n\n    const refreshVisibleMenu = async () => {\n      await nextTick();\n      const menuWidth = (menuWrapper.value && getWidth(menuWrapper.value)) || 0;\n      const responsiveMenuWidth = (responsiveButton.value && getWidth(responsiveButton.value)) || 0;\n      visible.value = determineVisibleMenuItems(menuWidth, responsiveMenuWidth, menuItems.value);\n\n      responsiveMenuItems.value = props.menu\n        .filter((item) => visible.value.indexOf(item.key) < 0)\n        .flatMap((item) => [\n          { ...item, isGroup: item.children && item.children.length > 0 },\n          ...(item.children || []).map((item) => ({ ...item, grouped: true })),\n        ]);\n\n      menuItems.value.forEach((item) => {\n        item.element.hidden = visible.value.indexOf(item.key) < 0;\n      });\n\n      if (responsiveButton.value) {\n        responsiveButton.value.hidden = menuItems.value.length === visible.value.length;\n      }\n    };\n\n    onMounted(async () => {\n      if (props.priorityMenuEnabled) {\n        await nextTick();\n        initMenuItems();\n        await refreshVisibleMenu();\n        window.addEventListener('resize', refreshVisibleMenu);\n      }\n    });\n\n    onUnmounted(() => {\n      if (props.priorityMenuEnabled) {\n        window.removeEventListener('resize', refreshVisibleMenu);\n      }\n    });\n\n    return {\n      menuWrapper,\n      menuItem,\n      menuItems,\n      responsiveButton,\n      responsiveMenuItems,\n      visible,\n      onClick,\n      routeMatches,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonDropdownMenu","NeonLink","NeonIcon","NeonFunctionalColor","NeonSize","props","emit","route","useRoute","menuWrapper","ref","menuItem","responsiveButton","menuItems","responsiveMenuItems","visible","getWidth","el","styles","margin","toPriorityMenuItem","key","element","initMenuItems","results","item","index","routeMatches","path","onClick","determineVisibleMenuItems","menuWidth","responsiveMenuWidth","acc","width","availableWidth","i","refreshVisibleMenu","nextTick","onMounted","onUnmounted"],"mappings":"2TAkBAA,EAAeC,kBAAgB,CAC7B,KAAM,WACN,WAAY,CACV,iBAAAC,EACA,SAAAC,EACA,SAAAC,CACF,EACA,MAAO,CAKL,KAAM,CAAE,KAAM,MAAqC,SAAU,EAAK,EAIlE,MAAO,CAAE,KAAM,OAAqC,QAASC,EAAAA,oBAAoB,KAAM,EAIvF,KAAM,CAAE,KAAM,OAA0B,QAASC,EAAAA,SAAS,KAAM,EAKhE,oBAAqB,CAAE,KAAM,QAAS,QAAS,EAAK,CACtD,EACA,MAAO,CAKL,OACF,EACA,MAAMC,EAAO,CAAE,KAAAC,GAAQ,CACrB,MAAMC,EAAQC,EAAAA,WACRC,EAAcC,MAAwB,IAAI,EAC1CC,EAAWD,MAA+B,IAAI,EAC9CE,EAAmBF,MAAwB,IAAI,EAE/CG,EAAYH,MAAiC,CAAA,CAAE,EAC/CI,EAAsBJ,MAA0B,CAAA,CAAE,EAClDK,EAAUL,MAAmB,CAAA,CAAE,EAE/BM,EAAYC,GAAoB,CAC9B,MAAAC,EAAS,OAAO,iBAAiBD,CAAE,EACnCE,EAAS,WAAWD,EAAO,YAAc,GAAG,EAAI,WAAWA,EAAO,aAAe,GAAG,EAC1F,OAAO,KAAK,KAAKD,EAAG,YAAcE,CAAM,CAAA,EAGpCC,EAAqB,CAACC,EAAaC,KAChC,CACL,IAAAD,EACA,QAAAC,EACA,MAAON,EAASM,CAAO,CAAA,GAIrBC,EAAgB,IAAM,CACpB,MAAAC,EAAUnB,EAAM,KAAK,IACzB,CAACoB,EAAMC,IAAWf,EAAS,OAASS,EAAmBK,EAAK,IAAKd,EAAS,MAAMe,EAAM,GAAM,IAAA,EAE9Fb,EAAU,MAAQW,EAAQ,OAAQC,GAASA,IAAS,IAAI,CAAA,EAGpDE,EAAgBC,IACbrB,GAAA,YAAAA,EAAO,KAAK,QAAQqB,KAAS,EAGhCC,EAAWR,GAAgB,CAC/Bf,EAAK,QAASe,CAAG,CAAA,EAGbS,EAA4B,CAChCC,EACAC,EACAnB,IACG,CAIC,GAHiBA,EAAU,IAAKY,GAASA,EAAK,KAAK,EAAE,OAAO,CAACQ,EAAaC,IAAWD,EAAMA,EAAMC,EAAQ,CAAE,GAG3FH,EAAYC,EAC9B,OAAOnB,EAAU,IAAKF,GAAaA,EAAS,GAAG,EAIjD,IAAIwB,EAAiBJ,EAAYC,EAC7BjB,EAAoB,CAAA,EAExB,QAASqB,EAAI,EAAGA,EAAIvB,EAAU,OAAQuB,EAAIA,EAAI,EAAG,CAC/C,MAAMzB,EAAWE,EAAUuB,GACvB,GAAAD,EAAiBxB,EAAS,MAAO,CAE/ByB,IAAM,IACRrB,EAAUA,EAAQ,OAAQM,GAAQA,IAAQR,EAAU,GAAG,GAAG,GAE5D,KACF,CAEAsB,EAAiBA,EAAiBxB,EAAS,MAC3CI,EAAQ,KAAKJ,EAAS,GAAG,CAC3B,CAEOI,OAAAA,CAAA,EAGHsB,EAAqB,SAAY,CACrC,MAAMC,EAAS,SAAA,EACf,MAAMP,EAAatB,EAAY,OAASO,EAASP,EAAY,KAAK,GAAM,EAClEuB,EAAuBpB,EAAiB,OAASI,EAASJ,EAAiB,KAAK,GAAM,EAC5FG,EAAQ,MAAQe,EAA0BC,EAAWC,EAAqBnB,EAAU,KAAK,EAEzFC,EAAoB,MAAQT,EAAM,KAC/B,OAAQoB,GAASV,EAAQ,MAAM,QAAQU,EAAK,GAAG,EAAI,CAAC,EACpD,QAASA,GAAS,CACjB,CAAE,GAAGA,EAAM,QAASA,EAAK,UAAYA,EAAK,SAAS,OAAS,CAAE,EAC9D,IAAIA,EAAK,UAAY,CAAA,GAAI,IAAKA,IAAU,CAAE,GAAGA,EAAM,QAAS,EAAO,EAAA,CAAA,CACpE,EAEOZ,EAAA,MAAM,QAASY,GAAS,CAChCA,EAAK,QAAQ,OAASV,EAAQ,MAAM,QAAQU,EAAK,GAAG,EAAI,CAAA,CACzD,EAEGb,EAAiB,QACnBA,EAAiB,MAAM,OAASC,EAAU,MAAM,SAAWE,EAAQ,MAAM,OAC3E,EAGFwB,OAAAA,EAAAA,UAAU,SAAY,CAChBlC,EAAM,sBACR,MAAMiC,EAAS,SAAA,EACDf,IACd,MAAMc,EAAmB,EAClB,OAAA,iBAAiB,SAAUA,CAAkB,EACtD,CACD,EAEDG,EAAAA,YAAY,IAAM,CACZnC,EAAM,qBACD,OAAA,oBAAoB,SAAUgC,CAAkB,CACzD,CACD,EAEM,CACL,YAAA5B,EACA,SAAAE,EACA,UAAAE,EACA,iBAAAD,EACA,oBAAAE,EACA,QAAAC,EACA,QAAAc,EACA,aAAAF,CAAA,CAEJ,CACF,CAAC"}

package/dist/components/navigation/menu/{NeonMenu.ts_vue_type_script_src_1e64150c_lang.es.js → NeonMenu.ts_vue_type_script_src_0bc1e23f_lang.es.js}

@@ -115,4 +115,4 @@ var _sfc_main = defineComponent({
   }
 });
 export { _sfc_main as default };
-//# sourceMappingURL=NeonMenu.ts_vue_type_script_src_1e64150c_lang.es.js.map
+//# sourceMappingURL=NeonMenu.ts_vue_type_script_src_0bc1e23f_lang.es.js.map

package/dist/components/navigation/menu/{NeonMenu.ts_vue_type_script_src_1e64150c_lang.es.js.map → NeonMenu.ts_vue_type_script_src_0bc1e23f_lang.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NeonMenu.ts_vue_type_script_src_1e64150c_lang.es.js","sources":["../../../../src/components/navigation/menu/NeonMenu.ts?vue&type=script&src=1e64150c&lang.ts"],"sourcesContent":["import { defineComponent, nextTick, onMounted, onUnmounted, ref } from 'vue';\nimport type { NeonMenuModel } from '@/common/models/NeonMenuModel';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\nimport NeonDropdownMenu from '@/components/navigation/dropdown-menu/NeonDropdownMenu.vue';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport type { NeonPriorityMenuItem } from './NeonPriorityMenuItem';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { useRoute } from 'vue-router';\n\n/**\n * <p>\n *   <strong>NeonMenu</strong> is a responsive aware menu that progressively collapses options into the mobile menu as\n *   the screen size gets smaller. This is a more flexible option than moving directly to a hamburger menu at tablet and\n *   below. It is a best effort approach to keep displaying the most important menu items for as long as possible,\n *   giving the user a better experience.\n * </p>\n */\nexport default defineComponent({\n  name: 'NeonMenu',\n  components: {\n    NeonDropdownMenu,\n    NeonLink,\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The menu configuration. This can have two levels, i.e. a top level horizontal menu and, if required, a dropdown\n     * menu containing the second level. The highlighted 'active' menu is determined by the current Vue route.\n     */\n    menu: { type: Array as () => Array<NeonMenuModel>, required: true },\n    /**\n     * The menu highlight color (excludes low-contrast and neutral).\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Brand },\n    /**\n     * The menu size.\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Large },\n    /**\n     * Whether to enable the priority menu which automatically calculates the available screen space and displays\n     * as many of the menu items as possible, moving the remaining items into the overflow menu.\n     */\n    priorityMenuEnabled: { type: Boolean, default: true },\n  },\n  emits: [\n    /**\n     * Emitted when a user clicks on a menu item.\n     * @type {string} the key of the menu item clicked.\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const route = useRoute();\n    const menuWrapper = ref<HTMLElement | null>(null);\n    const menuItem = ref<Array<HTMLElement> | null>(null);\n    const responsiveButton = ref<HTMLElement | null>(null);\n\n    const menuItems = ref<Array<NeonPriorityMenuItem>>([]);\n    const responsiveMenuItems = ref<Array<NeonMenuModel>>([]);\n    const visible = ref<Array<string>>([]);\n\n    const getWidth = (el: HTMLElement) => {\n      const styles = window.getComputedStyle(el);\n      const margin = parseFloat(styles.marginLeft || '0') + parseFloat(styles.marginRight || '0');\n      return Math.ceil(el.offsetWidth + margin);\n    };\n\n    const toPriorityMenuItem = (key: string, element: HTMLElement): NeonPriorityMenuItem => {\n      return {\n        key,\n        element,\n        width: getWidth(element),\n      };\n    };\n\n    const initMenuItems = () => {\n      const results = props.menu.map(\n        (item, index) => (menuItem.value && toPriorityMenuItem(item.key, menuItem.value[index])) || null,\n      );\n      menuItems.value = results.filter((item) => item !== null) as NeonPriorityMenuItem[];\n    };\n\n    const routeMatches = (path: string) => {\n      return route?.path.indexOf(path) >= 0;\n    };\n\n    const onClick = (key: string) => {\n      emit('click', key);\n    };\n\n    const determineVisibleMenuItems = (\n      menuWidth: number,\n      responsiveMenuWidth: number,\n      menuItems: NeonPriorityMenuItem[],\n    ) => {\n      const itemWidthSum = menuItems.map((item) => item.width).reduce((acc: number, width) => (acc ? acc + width : 0));\n\n      // no responsive menu\n      if (itemWidthSum <= menuWidth - responsiveMenuWidth) {\n        return menuItems.map((menuItem) => menuItem.key);\n      }\n\n      // with responsive menu\n      let availableWidth = menuWidth - responsiveMenuWidth;\n      let visible: string[] = [];\n\n      for (let i = 0; i < menuItems.length; i = i + 1) {\n        const menuItem = menuItems[i];\n        if (availableWidth < menuItem.width) {\n          // if the second menu item should be hidden, also hide the first one to improve how it looks\n          if (i === 1) {\n            visible = visible.filter((key) => key !== menuItems[0].key);\n          }\n          break;\n        }\n\n        availableWidth = availableWidth - menuItem.width;\n        visible.push(menuItem.key);\n      }\n\n      return visible;\n    };\n\n    const refreshVisibleMenu = async () => {\n      await nextTick();\n      const menuWidth = (menuWrapper.value && getWidth(menuWrapper.value)) || 0;\n      const responsiveMenuWidth = (responsiveButton.value && getWidth(responsiveButton.value)) || 0;\n      visible.value = determineVisibleMenuItems(menuWidth, responsiveMenuWidth, menuItems.value);\n\n      responsiveMenuItems.value = props.menu\n        .filter((item) => visible.value.indexOf(item.key) < 0)\n        .flatMap((item) => [\n          { ...item, isGroup: item.children && item.children.length > 0 },\n          ...(item.children || []).map((item) => ({ ...item, grouped: true })),\n        ]);\n\n      menuItems.value.forEach((item) => {\n        item.element.hidden = visible.value.indexOf(item.key) < 0;\n      });\n\n      if (responsiveButton.value) {\n        responsiveButton.value.hidden = menuItems.value.length === visible.value.length;\n      }\n    };\n\n    onMounted(async () => {\n      if (props.priorityMenuEnabled) {\n        await nextTick();\n        initMenuItems();\n        await refreshVisibleMenu();\n        window.addEventListener('resize', refreshVisibleMenu);\n      }\n    });\n\n    onUnmounted(() => {\n      if (props.priorityMenuEnabled) {\n        window.removeEventListener('resize', refreshVisibleMenu);\n      }\n    });\n\n    return {\n      menuWrapper,\n      menuItem,\n      menuItems,\n      responsiveButton,\n      responsiveMenuItems,\n      visible,\n      onClick,\n      routeMatches,\n    };\n  },\n});\n"],"names":["menuItems","menuItem","visible","item"],"mappings":"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"}
+{"version":3,"file":"NeonMenu.ts_vue_type_script_src_0bc1e23f_lang.es.js","sources":["../../../../src/components/navigation/menu/NeonMenu.ts?vue&type=script&src=0bc1e23f&lang.ts"],"sourcesContent":["import { defineComponent, nextTick, onMounted, onUnmounted, ref } from 'vue';\nimport type { NeonMenuModel } from '@/common/models/NeonMenuModel';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\nimport NeonDropdownMenu from '@/components/navigation/dropdown-menu/NeonDropdownMenu.vue';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport type { NeonPriorityMenuItem } from './NeonPriorityMenuItem';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { useRoute } from 'vue-router';\n\n/**\n * <p>\n *   <strong>NeonMenu</strong> is a responsive aware menu that progressively collapses options into the mobile menu as\n *   the screen size gets smaller. This is a more flexible option than moving directly to a hamburger menu at tablet and\n *   below. It is a best effort approach to keep displaying the most important menu items for as long as possible,\n *   giving the user a better experience.\n * </p>\n */\nexport default defineComponent({\n  name: 'NeonMenu',\n  components: {\n    NeonDropdownMenu,\n    NeonLink,\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The menu configuration. This can have two levels, i.e. a top level horizontal menu and, if required, a dropdown\n     * menu containing the second level. The highlighted 'active' menu is determined by the current Vue route.\n     */\n    menu: { type: Array as () => Array<NeonMenuModel>, required: true },\n    /**\n     * The menu highlight color (excludes low-contrast and neutral).\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Brand },\n    /**\n     * The menu size.\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Large },\n    /**\n     * Whether to enable the priority menu which automatically calculates the available screen space and displays\n     * as many of the menu items as possible, moving the remaining items into the overflow menu.\n     */\n    priorityMenuEnabled: { type: Boolean, default: true },\n  },\n  emits: [\n    /**\n     * Emitted when a user clicks on a menu item.\n     * @type {string} the key of the menu item clicked.\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const route = useRoute();\n    const menuWrapper = ref<HTMLElement | null>(null);\n    const menuItem = ref<Array<HTMLElement> | null>(null);\n    const responsiveButton = ref<HTMLElement | null>(null);\n\n    const menuItems = ref<Array<NeonPriorityMenuItem>>([]);\n    const responsiveMenuItems = ref<Array<NeonMenuModel>>([]);\n    const visible = ref<Array<string>>([]);\n\n    const getWidth = (el: HTMLElement) => {\n      const styles = window.getComputedStyle(el);\n      const margin = parseFloat(styles.marginLeft || '0') + parseFloat(styles.marginRight || '0');\n      return Math.ceil(el.offsetWidth + margin);\n    };\n\n    const toPriorityMenuItem = (key: string, element: HTMLElement): NeonPriorityMenuItem => {\n      return {\n        key,\n        element,\n        width: getWidth(element),\n      };\n    };\n\n    const initMenuItems = () => {\n      const results = props.menu.map(\n        (item, index) => (menuItem.value && toPriorityMenuItem(item.key, menuItem.value[index])) || null,\n      );\n      menuItems.value = results.filter((item) => item !== null) as NeonPriorityMenuItem[];\n    };\n\n    const routeMatches = (path: string) => {\n      return route?.path.indexOf(path) >= 0;\n    };\n\n    const onClick = (key: string) => {\n      emit('click', key);\n    };\n\n    const determineVisibleMenuItems = (\n      menuWidth: number,\n      responsiveMenuWidth: number,\n      menuItems: NeonPriorityMenuItem[],\n    ) => {\n      const itemWidthSum = menuItems.map((item) => item.width).reduce((acc: number, width) => (acc ? acc + width : 0));\n\n      // no responsive menu\n      if (itemWidthSum <= menuWidth - responsiveMenuWidth) {\n        return menuItems.map((menuItem) => menuItem.key);\n      }\n\n      // with responsive menu\n      let availableWidth = menuWidth - responsiveMenuWidth;\n      let visible: string[] = [];\n\n      for (let i = 0; i < menuItems.length; i = i + 1) {\n        const menuItem = menuItems[i];\n        if (availableWidth < menuItem.width) {\n          // if the second menu item should be hidden, also hide the first one to improve how it looks\n          if (i === 1) {\n            visible = visible.filter((key) => key !== menuItems[0].key);\n          }\n          break;\n        }\n\n        availableWidth = availableWidth - menuItem.width;\n        visible.push(menuItem.key);\n      }\n\n      return visible;\n    };\n\n    const refreshVisibleMenu = async () => {\n      await nextTick();\n      const menuWidth = (menuWrapper.value && getWidth(menuWrapper.value)) || 0;\n      const responsiveMenuWidth = (responsiveButton.value && getWidth(responsiveButton.value)) || 0;\n      visible.value = determineVisibleMenuItems(menuWidth, responsiveMenuWidth, menuItems.value);\n\n      responsiveMenuItems.value = props.menu\n        .filter((item) => visible.value.indexOf(item.key) < 0)\n        .flatMap((item) => [\n          { ...item, isGroup: item.children && item.children.length > 0 },\n          ...(item.children || []).map((item) => ({ ...item, grouped: true })),\n        ]);\n\n      menuItems.value.forEach((item) => {\n        item.element.hidden = visible.value.indexOf(item.key) < 0;\n      });\n\n      if (responsiveButton.value) {\n        responsiveButton.value.hidden = menuItems.value.length === visible.value.length;\n      }\n    };\n\n    onMounted(async () => {\n      if (props.priorityMenuEnabled) {\n        await nextTick();\n        initMenuItems();\n        await refreshVisibleMenu();\n        window.addEventListener('resize', refreshVisibleMenu);\n      }\n    });\n\n    onUnmounted(() => {\n      if (props.priorityMenuEnabled) {\n        window.removeEventListener('resize', refreshVisibleMenu);\n      }\n    });\n\n    return {\n      menuWrapper,\n      menuItem,\n      menuItems,\n      responsiveButton,\n      responsiveMenuItems,\n      visible,\n      onClick,\n      routeMatches,\n    };\n  },\n});\n"],"names":["menuItems","menuItem","visible","item"],"mappings":"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"}

package/dist/components/navigation/stepper/NeonStepper.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var r=require("./NeonStepper.ts_vue_type_script_src_e55bd35c_lang.cjs.js"),e=require("vue"),l=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const c=["onClick"],a={class:"neon-stepper__step-indicator"},_=["onClick"];function d(o,m,u,v,k,V){const t=e.resolveComponent("neon-icon");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([`neon-stepper--${o.color}`,"neon-stepper"])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.steps,(p,n)=>(e.openBlock(),e.createElementBlock("div",{key:p,class:e.normalizeClass([{"neon-stepper__step--has-value":n<=o.modelValue||n<=o.completedIndex,"neon-stepper__step--active":n===o.modelValue,"neon-stepper__step--display-stepper":n<=o.completedIndex},"neon-stepper__step"])},[e.createElementVNode("div",{class:"neon-stepper__step-indicator-wrapper",onClick:s=>n!==o.modelValue&&n<=o.completedIndex&&o.emit("update:modelValue",n)},[e.createElementVNode("div",a,[n<o.completedIndex?(e.openBlock(),e.createBlock(t,{key:0,class:"neon-stepper__step-completed-icon",name:"check"})):n===o.completedIndex?(e.openBlock(),e.createBlock(t,{key:1,class:"neon-stepper__step-completing-icon",name:"dot"})):e.createCommentVNode("",!0)])],8,c),e.createElementVNode("span",{class:"neon-stepper__step-title",onClick:s=>n!==o.modelValue&&n<=o.completedIndex&&o.emit("update:modelValue",n)},e.toDisplayString(p),9,_)],2))),128))],2)}var i=l(r,[["render",d],["__file","/Users/andrew/dev/projects/neon/src/components/navigation/stepper/NeonStepper.vue"]]);module.exports=i;
+"use strict";var r=require("./NeonStepper.ts_vue_type_script_src_c9706834_lang.cjs.js"),e=require("vue"),l=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const c=["onClick"],a={class:"neon-stepper__step-indicator"},_=["onClick"];function m(o,d,u,v,k,V){const n=e.resolveComponent("neon-icon");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([`neon-stepper--${o.color}`,"neon-stepper"])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.steps,(p,t)=>(e.openBlock(),e.createElementBlock("div",{key:p,class:e.normalizeClass([{"neon-stepper__step--has-value":t<=o.modelValue||t<=o.completedIndex,"neon-stepper__step--active":t===o.modelValue,"neon-stepper__step--display-stepper":t<=o.completedIndex},"neon-stepper__step"])},[e.createElementVNode("div",{class:"neon-stepper__step-indicator-wrapper",onClick:s=>t!==o.modelValue&&t<=o.completedIndex&&o.emit("update:modelValue",t)},[e.createElementVNode("div",a,[t<o.completedIndex?(e.openBlock(),e.createBlock(n,{key:0,class:"neon-stepper__step-completed-icon",name:"check"})):t===o.completedIndex?(e.openBlock(),e.createBlock(n,{key:1,class:"neon-stepper__step-completing-icon",name:"dot"})):e.createCommentVNode("",!0)])],8,c),e.createElementVNode("span",{class:"neon-stepper__step-title",onClick:s=>t!==o.modelValue&&t<=o.completedIndex&&o.emit("update:modelValue",t)},e.toDisplayString(p),9,_)],2))),128))],2)}var i=l(r,[["render",m]]);module.exports=i;
 //# sourceMappingURL=NeonStepper.cjs.js.map

package/dist/components/navigation/stepper/NeonStepper.es.js

@@ -1,4 +1,4 @@
-import _sfc_main from "./NeonStepper.ts_vue_type_script_src_e55bd35c_lang.es.js";
+import _sfc_main from "./NeonStepper.ts_vue_type_script_src_c9706834_lang.es.js";
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, Fragment, renderList, createElementVNode, createBlock, createCommentVNode, toDisplayString } from "vue";
 import _export_sfc from "../../../_virtual/plugin-vue_export-helper.es.js";
 const _hoisted_1 = ["onClick"];
@@ -42,6 +42,6 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     }), 128))
   ], 2);
 }
-var NeonStepper = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/andrew/dev/projects/neon/src/components/navigation/stepper/NeonStepper.vue"]]);
+var NeonStepper = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export { NeonStepper as default };
 //# sourceMappingURL=NeonStepper.es.js.map

package/dist/components/navigation/stepper/{NeonStepper.ts_vue_type_script_src_e55bd35c_lang.cjs.js → NeonStepper.ts_vue_type_script_src_c9706834_lang.cjs.js}

@@ -1,2 +1,2 @@
 "use strict";var o=require("vue"),r=require("../../presentation/icon/NeonIcon.cjs.js"),n=require("../../../common/enums/NeonFunctionalColor.cjs.js"),t=o.defineComponent({name:"NeonStepper",components:{NeonIcon:r},props:{steps:{type:Array,required:!0},completedIndex:{type:Number,default:-1},modelValue:{type:Number,default:0},color:{type:String,default:n.NeonFunctionalColor.Brand}},emits:["update:modelValue"],setup(u,{emit:e}){return{emit:e}}});module.exports=t;
-//# sourceMappingURL=NeonStepper.ts_vue_type_script_src_e55bd35c_lang.cjs.js.map
+//# sourceMappingURL=NeonStepper.ts_vue_type_script_src_c9706834_lang.cjs.js.map

package/dist/components/navigation/stepper/{NeonStepper.ts_vue_type_script_src_e55bd35c_lang.cjs.js.map → NeonStepper.ts_vue_type_script_src_c9706834_lang.cjs.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NeonStepper.ts_vue_type_script_src_e55bd35c_lang.cjs.js","sources":["../../../../src/components/navigation/stepper/NeonStepper.ts?vue&type=script&src=e55bd35c&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\n\n/**\n * A stepper component for assisting users in navigating through complex flows.\n */\nexport default defineComponent({\n  name: 'NeonStepper',\n  components: { NeonIcon },\n  props: {\n    /**\n     * An ordered list of the step names, these values are used for display purposes.\n     */\n    steps: { type: Array as () => Array<string>, required: true },\n    /**\n     * The index of the highest completed step (regardless of the current step the user has selected).\n     * This is used to display the completed steps to the user.\n     */\n    completedIndex: { type: Number, default: -1 },\n    /**\n     * The index of the step that is currently selected.\n     */\n    modelValue: { type: Number, default: 0 },\n    /**\n     * The color of the Stepper component.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Brand },\n  },\n  emits: [\n    /**\n     * Emitted when the selected step is changed.\n     * @type {number} The index of the selected step.\n     */\n    'update:modelValue',\n  ],\n  setup(_props, { emit }) {\n    return {\n      emit,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonFunctionalColor","_props","emit"],"mappings":"qJAOAA,EAAeC,kBAAgB,CAC7B,KAAM,cACN,WAAY,CAAE,SAAAC,CAAS,EACvB,MAAO,CAIL,MAAO,CAAE,KAAM,MAA8B,SAAU,EAAK,EAK5D,eAAgB,CAAE,KAAM,OAAQ,QAAS,EAAG,EAI5C,WAAY,CAAE,KAAM,OAAQ,QAAS,CAAE,EAIvC,MAAO,CAAE,KAAM,OAAqC,QAASC,EAAAA,oBAAoB,KAAM,CACzF,EACA,MAAO,CAKL,mBACF,EACA,MAAMC,EAAQ,CAAE,KAAAC,GAAQ,CACf,MAAA,CACL,KAAAA,CAAA,CAEJ,CACF,CAAC"}
+{"version":3,"file":"NeonStepper.ts_vue_type_script_src_c9706834_lang.cjs.js","sources":["../../../../src/components/navigation/stepper/NeonStepper.ts?vue&type=script&src=c9706834&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\n\n/**\n * A stepper component for assisting users in navigating through complex flows.\n */\nexport default defineComponent({\n  name: 'NeonStepper',\n  components: { NeonIcon },\n  props: {\n    /**\n     * An ordered list of the step names, these values are used for display purposes.\n     */\n    steps: { type: Array as () => Array<string>, required: true },\n    /**\n     * The index of the highest completed step (regardless of the current step the user has selected).\n     * This is used to display the completed steps to the user.\n     */\n    completedIndex: { type: Number, default: -1 },\n    /**\n     * The index of the step that is currently selected.\n     */\n    modelValue: { type: Number, default: 0 },\n    /**\n     * The color of the Stepper component.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Brand },\n  },\n  emits: [\n    /**\n     * Emitted when the selected step is changed.\n     * @type {number} The index of the selected step.\n     */\n    'update:modelValue',\n  ],\n  setup(_props, { emit }) {\n    return {\n      emit,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonFunctionalColor","_props","emit"],"mappings":"qJAOAA,EAAeC,kBAAgB,CAC7B,KAAM,cACN,WAAY,CAAE,SAAAC,CAAS,EACvB,MAAO,CAIL,MAAO,CAAE,KAAM,MAA8B,SAAU,EAAK,EAK5D,eAAgB,CAAE,KAAM,OAAQ,QAAS,EAAG,EAI5C,WAAY,CAAE,KAAM,OAAQ,QAAS,CAAE,EAIvC,MAAO,CAAE,KAAM,OAAqC,QAASC,EAAAA,oBAAoB,KAAM,CACzF,EACA,MAAO,CAKL,mBACF,EACA,MAAMC,EAAQ,CAAE,KAAAC,GAAQ,CACf,MAAA,CACL,KAAAA,CAAA,CAEJ,CACF,CAAC"}

package/dist/components/navigation/stepper/{NeonStepper.ts_vue_type_script_src_e55bd35c_lang.es.js → NeonStepper.ts_vue_type_script_src_c9706834_lang.es.js}

@@ -20,4 +20,4 @@ var _sfc_main = defineComponent({
   }
 });
 export { _sfc_main as default };
-//# sourceMappingURL=NeonStepper.ts_vue_type_script_src_e55bd35c_lang.es.js.map
+//# sourceMappingURL=NeonStepper.ts_vue_type_script_src_c9706834_lang.es.js.map

package/dist/components/navigation/stepper/{NeonStepper.ts_vue_type_script_src_e55bd35c_lang.es.js.map → NeonStepper.ts_vue_type_script_src_c9706834_lang.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NeonStepper.ts_vue_type_script_src_e55bd35c_lang.es.js","sources":["../../../../src/components/navigation/stepper/NeonStepper.ts?vue&type=script&src=e55bd35c&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\n\n/**\n * A stepper component for assisting users in navigating through complex flows.\n */\nexport default defineComponent({\n  name: 'NeonStepper',\n  components: { NeonIcon },\n  props: {\n    /**\n     * An ordered list of the step names, these values are used for display purposes.\n     */\n    steps: { type: Array as () => Array<string>, required: true },\n    /**\n     * The index of the highest completed step (regardless of the current step the user has selected).\n     * This is used to display the completed steps to the user.\n     */\n    completedIndex: { type: Number, default: -1 },\n    /**\n     * The index of the step that is currently selected.\n     */\n    modelValue: { type: Number, default: 0 },\n    /**\n     * The color of the Stepper component.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Brand },\n  },\n  emits: [\n    /**\n     * Emitted when the selected step is changed.\n     * @type {number} The index of the selected step.\n     */\n    'update:modelValue',\n  ],\n  setup(_props, { emit }) {\n    return {\n      emit,\n    };\n  },\n});\n"],"names":[],"mappings":";;;AAOA,IAAA,YAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY,EAAE,SAAS;AAAA,EACvB,OAAO;AAAA,IAIL,OAAO,EAAE,MAAM,OAA8B,UAAU,KAAK;AAAA,IAK5D,gBAAgB,EAAE,MAAM,QAAQ,SAAS,GAAG;AAAA,IAI5C,YAAY,EAAE,MAAM,QAAQ,SAAS,EAAE;AAAA,IAIvC,OAAO,EAAE,MAAM,QAAqC,SAAS,oBAAoB,MAAM;AAAA,EACzF;AAAA,EACA,OAAO;AAAA,IAKL;AAAA,EACF;AAAA,EACA,MAAM,QAAQ,EAAE,QAAQ;AACf,WAAA;AAAA,MACL;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;;"}
+{"version":3,"file":"NeonStepper.ts_vue_type_script_src_c9706834_lang.es.js","sources":["../../../../src/components/navigation/stepper/NeonStepper.ts?vue&type=script&src=c9706834&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\n\n/**\n * A stepper component for assisting users in navigating through complex flows.\n */\nexport default defineComponent({\n  name: 'NeonStepper',\n  components: { NeonIcon },\n  props: {\n    /**\n     * An ordered list of the step names, these values are used for display purposes.\n     */\n    steps: { type: Array as () => Array<string>, required: true },\n    /**\n     * The index of the highest completed step (regardless of the current step the user has selected).\n     * This is used to display the completed steps to the user.\n     */\n    completedIndex: { type: Number, default: -1 },\n    /**\n     * The index of the step that is currently selected.\n     */\n    modelValue: { type: Number, default: 0 },\n    /**\n     * The color of the Stepper component.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Brand },\n  },\n  emits: [\n    /**\n     * Emitted when the selected step is changed.\n     * @type {number} The index of the selected step.\n     */\n    'update:modelValue',\n  ],\n  setup(_props, { emit }) {\n    return {\n      emit,\n    };\n  },\n});\n"],"names":[],"mappings":";;;AAOA,IAAA,YAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY,EAAE,SAAS;AAAA,EACvB,OAAO;AAAA,IAIL,OAAO,EAAE,MAAM,OAA8B,UAAU,KAAK;AAAA,IAK5D,gBAAgB,EAAE,MAAM,QAAQ,SAAS,GAAG;AAAA,IAI5C,YAAY,EAAE,MAAM,QAAQ,SAAS,EAAE;AAAA,IAIvC,OAAO,EAAE,MAAM,QAAqC,SAAS,oBAAoB,MAAM;AAAA,EACzF;AAAA,EACA,OAAO;AAAA,IAKL;AAAA,EACF;AAAA,EACA,MAAM,QAAQ,EAAE,QAAQ;AACf,WAAA;AAAA,MACL;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;;"}

package/dist/components/navigation/tree-menu/NeonTreeMenu.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var i=require("./NeonTreeMenu.ts_vue_type_script_src_8d08d922_lang.cjs.js"),e=require("vue"),u=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const d={class:"no-style"},c=["onKeydown"],p={class:"no-style neon-tree-menu__links"};function m(n,t,k,y,h,v){const s=e.resolveComponent("neon-link");return n.model?(e.openBlock(),e.createElementBlock("nav",{key:0,class:e.normalizeClass([{"neon-tree-menu--expand-all":n.expandAll},"neon-tree-menu"])},[e.createElementVNode("ul",d,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.model,o=>(e.openBlock(),e.createElementBlock("li",{key:o.key,class:e.normalizeClass([{"neon-tree-menu__section--expanded":o.expanded||n.expandAll,"neon-tree-menu__section--disabled":o.disabled},"neon-tree-menu__section"])},[e.createVNode(s,{"no-style":!0,class:"neon-tree-menu__section-link","outline-style":"none",tabindex:"-1",onClick:l=>!o.disabled&&n.onClick(o.key)},{default:e.withCtx(()=>[e.createElementVNode("span",{class:"neon-tree-menu__section-link-label neon-tree-menu__section-link-label--outline-text",role:"link",tabindex:"0",onKeydown:e.withKeys(e.withModifiers(l=>!o.disabled&&n.onClick(o.key),["stop","prevent"]),["space"])},e.toDisplayString(o.label),41,c)]),_:2},1032,["onClick"]),e.createElementVNode("ul",p,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.children,l=>(e.openBlock(),e.createElementBlock("li",{key:l.key,class:"neon-tree-menu__link-item"},[e.createVNode(s,{href:l.href,"no-style":!0,class:"neon-tree-menu__link","outline-style":"none",tabindex:"-1"},{default:e.withCtx(()=>[e.createElementVNode("span",{class:"neon-tree-menu__link-label neon-tree-menu__link-label--outline-text",role:"link",tabindex:"0",onKeydown:[t[0]||(t[0]=e.withKeys(r=>n.click(r),["enter"])),t[1]||(t[1]=e.withKeys(r=>n.click(r),["space"]))],onKeypress:t[2]||(t[2]=e.withKeys(e.withModifiers(()=>{},["prevent"]),["space"]))},e.toDisplayString(l.label),33)]),_:2},1032,["href"]),l.anchors&&l.anchors.length>0?(e.openBlock(),e.createElementBlock("ul",{key:0,class:e.normalizeClass([{"neon-tree-menu__anchors--expanded":n.expandAll||n.url===l.href},"no-style neon-tree-menu__anchors"])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.anchors,r=>(e.openBlock(),e.createElementBlock("li",{key:r},[e.createVNode(s,{href:`${l.href}#${n.fragment(r)}`,class:"neon-link--no-style neon-tree-menu__anchor","outline-style":"none",tabindex:"-1"},{default:e.withCtx(()=>[e.createElementVNode("span",{class:"neon-tree-menu__anchor-label neon-tree-menu__anchor-label--outline-text",role:"link",tabindex:"0",onKeydown:[t[3]||(t[3]=e.withKeys(a=>n.click(a),["space"])),t[4]||(t[4]=e.withKeys(a=>n.click(a),["enter"]))],onKeypress:t[5]||(t[5]=e.withKeys(e.withModifiers(()=>{},["prevent"]),["space"]))},e.toDisplayString(r),33)]),_:2},1032,["href"])]))),128))],2)):e.createCommentVNode("",!0)]))),128))])],2))),128))])],2)):e.createCommentVNode("",!0)}var _=u(i,[["render",m],["__file","/Users/andrew/dev/projects/neon/src/components/navigation/tree-menu/NeonTreeMenu.vue"]]);module.exports=_;
+"use strict";var i=require("./NeonTreeMenu.ts_vue_type_script_src_ad293a40_lang.cjs.js"),e=require("vue"),u=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const d={class:"no-style"},p=["onKeydown"],c={class:"no-style neon-tree-menu__links"};function m(n,t,_,y,h,b){const s=e.resolveComponent("neon-link");return n.model?(e.openBlock(),e.createElementBlock("nav",{key:0,class:e.normalizeClass([{"neon-tree-menu--expand-all":n.expandAll},"neon-tree-menu"])},[e.createElementVNode("ul",d,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.model,o=>(e.openBlock(),e.createElementBlock("li",{key:o.key,class:e.normalizeClass([{"neon-tree-menu__section--expanded":o.expanded||n.expandAll,"neon-tree-menu__section--disabled":o.disabled},"neon-tree-menu__section"])},[e.createVNode(s,{"no-style":!0,class:"neon-tree-menu__section-link","outline-style":"none",tabindex:"-1",onClick:l=>!o.disabled&&n.onClick(o.key)},{default:e.withCtx(()=>[e.createElementVNode("span",{class:"neon-tree-menu__section-link-label neon-tree-menu__section-link-label--outline-text",role:"link",tabindex:"0",onKeydown:e.withKeys(e.withModifiers(l=>!o.disabled&&n.onClick(o.key),["stop","prevent"]),["space"])},e.toDisplayString(o.label),41,p)]),_:2},1032,["onClick"]),e.createElementVNode("ul",c,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.children,l=>(e.openBlock(),e.createElementBlock("li",{key:l.key,class:"neon-tree-menu__link-item"},[e.createVNode(s,{href:l.href,"no-style":!0,class:"neon-tree-menu__link","outline-style":"none",tabindex:"-1"},{default:e.withCtx(()=>[e.createElementVNode("span",{class:"neon-tree-menu__link-label neon-tree-menu__link-label--outline-text",role:"link",tabindex:"0",onKeydown:[t[0]||(t[0]=e.withKeys(r=>n.click(r),["enter"])),t[1]||(t[1]=e.withKeys(r=>n.click(r),["space"]))],onKeypress:t[2]||(t[2]=e.withKeys(e.withModifiers(()=>{},["prevent"]),["space"]))},e.toDisplayString(l.label),33)]),_:2},1032,["href"]),l.anchors&&l.anchors.length>0?(e.openBlock(),e.createElementBlock("ul",{key:0,class:e.normalizeClass([{"neon-tree-menu__anchors--expanded":n.expandAll||n.url===l.href},"no-style neon-tree-menu__anchors"])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.anchors,r=>(e.openBlock(),e.createElementBlock("li",{key:r},[e.createVNode(s,{href:`${l.href}#${n.fragment(r)}`,class:"neon-link--no-style neon-tree-menu__anchor","outline-style":"none",tabindex:"-1"},{default:e.withCtx(()=>[e.createElementVNode("span",{class:"neon-tree-menu__anchor-label neon-tree-menu__anchor-label--outline-text",role:"link",tabindex:"0",onKeydown:[t[3]||(t[3]=e.withKeys(a=>n.click(a),["space"])),t[4]||(t[4]=e.withKeys(a=>n.click(a),["enter"]))],onKeypress:t[5]||(t[5]=e.withKeys(e.withModifiers(()=>{},["prevent"]),["space"]))},e.toDisplayString(r),33)]),_:2},1032,["href"])]))),128))],2)):e.createCommentVNode("",!0)]))),128))])],2))),128))])],2)):e.createCommentVNode("",!0)}var k=u(i,[["render",m]]);module.exports=k;
 //# sourceMappingURL=NeonTreeMenu.cjs.js.map

package/dist/components/navigation/tree-menu/NeonTreeMenu.es.js

@@ -1,4 +1,4 @@
-import _sfc_main from "./NeonTreeMenu.ts_vue_type_script_src_8d08d922_lang.es.js";
+import _sfc_main from "./NeonTreeMenu.ts_vue_type_script_src_ad293a40_lang.es.js";
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, Fragment, renderList, createVNode, withCtx, withKeys, withModifiers, toDisplayString, createCommentVNode } from "vue";
 import _export_sfc from "../../../_virtual/plugin-vue_export-helper.es.js";
 const _hoisted_1 = { class: "no-style" };
@@ -102,6 +102,6 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     ])
   ], 2)) : createCommentVNode("", true);
 }
-var NeonTreeMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/andrew/dev/projects/neon/src/components/navigation/tree-menu/NeonTreeMenu.vue"]]);
+var NeonTreeMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export { NeonTreeMenu as default };
 //# sourceMappingURL=NeonTreeMenu.es.js.map