@aotearoan/neon 22.1.0 → 22.1.2

package/dist/common/enums/NeonButtonType.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var e=(t=>(t.Button="button",t.Submit="submit",t.Reset="reset",t))(e||{});exports.NeonButtonType=e;
+//# sourceMappingURL=NeonButtonType.cjs.js.map

package/dist/common/enums/NeonButtonType.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NeonButtonType.cjs.js","sources":["../../../src/common/enums/NeonButtonType.ts"],"sourcesContent":["export enum NeonButtonType {\n  Button = 'button',\n  Submit = 'submit',\n  Reset = 'reset',\n}\n"],"names":["NeonButtonType"],"mappings":"gFAAO,IAAKA,GAAAA,IACVA,EAAA,OAAS,SACTA,EAAA,OAAS,SACTA,EAAA,MAAQ,QAHEA,IAAAA,GAAA,CAAA,CAAA"}

package/dist/common/enums/NeonButtonType.es.js

@@ -0,0 +1,5 @@
+var r = /* @__PURE__ */ ((t) => (t.Button = "button", t.Submit = "submit", t.Reset = "reset", t))(r || {});
+export {
+  r as NeonButtonType
+};
+//# sourceMappingURL=NeonButtonType.es.js.map

package/dist/common/enums/NeonButtonType.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NeonButtonType.es.js","sources":["../../../src/common/enums/NeonButtonType.ts"],"sourcesContent":["export enum NeonButtonType {\n  Button = 'button',\n  Submit = 'submit',\n  Reset = 'reset',\n}\n"],"names":["NeonButtonType"],"mappings":"AAAO,IAAKA,sBAAAA,OACVA,EAAA,SAAS,UACTA,EAAA,SAAS,UACTA,EAAA,QAAQ,SAHEA,IAAAA,KAAA,CAAA,CAAA;"}

package/dist/common/enums/NeonResponsive.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonResponsive.cjs.js","sources":["../../../src/common/enums/NeonResponsive.ts"],"sourcesContent":["/**\n * Responsive breakpoints defined in Neon. These cover both smaller than & larger than cases for ultimate flexibility in\n * defining responsive styles. See the <a href=\"/design/responsiveness\">responsiveness</a> documentation for more\n * details.\n */\nexport enum NeonResponsive {\n  /**\n   * Defines <em>NO</em> breakpoint. This is only used for defining the global <a href=\"/layout/grid\">NeonGrid</a>\n   * breakpoint layout.\n   */\n  All = 'all',\n  /** Defines a desktop breakpoint of <strong>max-width: 1439px</strong>. */\n  Desktop = 'desktop',\n  /** Defines a larger than desktop breakpoint of <strong>min-width: 1440px</strong>. */\n  DesktopLarge = 'desktop-large',\n  /** Defines a larger than tablet breakpoint of <strong>min-width: 1025px</strong>. */\n  LargerThanTablet = 'larger-than-tablet',\n  /** Defines a tablet breakpoint of <strong>max-width: 1024px</strong>. */\n  Tablet = 'tablet',\n  /** Defines a larger than mobile large breakpoint of <strong>min-width: 600px</strong>. */\n  LargerThanMobileLarge = 'larger-than-mobile-l',\n  /** Defines a large mobile breakpoint of <strong>max-width: 599px</strong>. */\n  MobileLarge = 'mobile-large',\n  /** Defines a larger than mobile breakpoint of <strong>min-width: 415px</strong>. */\n  LargerThanMobile = 'larger-than-mobile',\n  /** Defines a mobile breakpoint of <strong>max-width: 414px</strong>. */\n  Mobile = 'mobile',\n}\n"],"names":["NeonResponsive"],"mappings":"gFAKO,IAAKA,GAAAA,IAKVA,EAAA,IAAM,MAENA,EAAA,QAAU,UAEVA,EAAA,aAAe,gBAEfA,EAAA,iBAAmB,qBAEnBA,EAAA,OAAS,SAETA,EAAA,sBAAwB,uBAExBA,EAAA,YAAc,eAEdA,EAAA,iBAAmB,qBAEnBA,EAAA,OAAS,SArBCA,IAAAA,GAAA,CAAA,CAAA"}
+{"version":3,"file":"NeonResponsive.cjs.js","sources":["../../../src/common/enums/NeonResponsive.ts"],"sourcesContent":["/**\n * Responsive breakpoints defined in Neon. These cover both smaller than & larger than cases for ultimate flexibility in\n * defining responsive styles. See the <a href=\"/design/responsiveness\">responsiveness</a> documentation for more\n * details.\n */\nexport enum NeonResponsive {\n  /**\n   * Defines <em>NO</em> breakpoint. This is only used for defining the global <a href=\"/layout/grid\">NeonGrid</a>\n   * breakpoint layout.\n   */\n  All = 'all',\n  /** Defines a desktop breakpoint of <strong>max-width: 1439px</strong>. */\n  Desktop = 'desktop',\n  /** Defines a larger than desktop breakpoint of <strong>min-width: 1440px</strong>. */\n  DesktopLarge = 'desktop-large',\n  /** Defines a larger than tablet breakpoint of <strong>min-width: 1024px</strong>. */\n  LargerThanTablet = 'larger-than-tablet',\n  /** Defines a tablet breakpoint of <strong>max-width: 1023px</strong>. */\n  Tablet = 'tablet',\n  /** Defines a larger than mobile large breakpoint of <strong>min-width: 768px</strong>. */\n  LargerThanMobileLarge = 'larger-than-mobile-l',\n  /** Defines a large mobile breakpoint of <strong>max-width: 767px</strong>. */\n  MobileLarge = 'mobile-large',\n  /** Defines a larger than mobile breakpoint of <strong>min-width: 415px</strong>. */\n  LargerThanMobile = 'larger-than-mobile',\n  /** Defines a mobile breakpoint of <strong>max-width: 414px</strong>. */\n  Mobile = 'mobile',\n}\n"],"names":["NeonResponsive"],"mappings":"gFAKO,IAAKA,GAAAA,IAKVA,EAAA,IAAM,MAENA,EAAA,QAAU,UAEVA,EAAA,aAAe,gBAEfA,EAAA,iBAAmB,qBAEnBA,EAAA,OAAS,SAETA,EAAA,sBAAwB,uBAExBA,EAAA,YAAc,eAEdA,EAAA,iBAAmB,qBAEnBA,EAAA,OAAS,SArBCA,IAAAA,GAAA,CAAA,CAAA"}

package/dist/common/enums/NeonResponsive.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonResponsive.es.js","sources":["../../../src/common/enums/NeonResponsive.ts"],"sourcesContent":["/**\n * Responsive breakpoints defined in Neon. These cover both smaller than & larger than cases for ultimate flexibility in\n * defining responsive styles. See the <a href=\"/design/responsiveness\">responsiveness</a> documentation for more\n * details.\n */\nexport enum NeonResponsive {\n  /**\n   * Defines <em>NO</em> breakpoint. This is only used for defining the global <a href=\"/layout/grid\">NeonGrid</a>\n   * breakpoint layout.\n   */\n  All = 'all',\n  /** Defines a desktop breakpoint of <strong>max-width: 1439px</strong>. */\n  Desktop = 'desktop',\n  /** Defines a larger than desktop breakpoint of <strong>min-width: 1440px</strong>. */\n  DesktopLarge = 'desktop-large',\n  /** Defines a larger than tablet breakpoint of <strong>min-width: 1025px</strong>. */\n  LargerThanTablet = 'larger-than-tablet',\n  /** Defines a tablet breakpoint of <strong>max-width: 1024px</strong>. */\n  Tablet = 'tablet',\n  /** Defines a larger than mobile large breakpoint of <strong>min-width: 600px</strong>. */\n  LargerThanMobileLarge = 'larger-than-mobile-l',\n  /** Defines a large mobile breakpoint of <strong>max-width: 599px</strong>. */\n  MobileLarge = 'mobile-large',\n  /** Defines a larger than mobile breakpoint of <strong>min-width: 415px</strong>. */\n  LargerThanMobile = 'larger-than-mobile',\n  /** Defines a mobile breakpoint of <strong>max-width: 414px</strong>. */\n  Mobile = 'mobile',\n}\n"],"names":["NeonResponsive"],"mappings":"AAKO,IAAKA,sBAAAA,OAKVA,EAAA,MAAM,OAENA,EAAA,UAAU,WAEVA,EAAA,eAAe,iBAEfA,EAAA,mBAAmB,sBAEnBA,EAAA,SAAS,UAETA,EAAA,wBAAwB,wBAExBA,EAAA,cAAc,gBAEdA,EAAA,mBAAmB,sBAEnBA,EAAA,SAAS,UArBCA,IAAAA,KAAA,CAAA,CAAA;"}
+{"version":3,"file":"NeonResponsive.es.js","sources":["../../../src/common/enums/NeonResponsive.ts"],"sourcesContent":["/**\n * Responsive breakpoints defined in Neon. These cover both smaller than & larger than cases for ultimate flexibility in\n * defining responsive styles. See the <a href=\"/design/responsiveness\">responsiveness</a> documentation for more\n * details.\n */\nexport enum NeonResponsive {\n  /**\n   * Defines <em>NO</em> breakpoint. This is only used for defining the global <a href=\"/layout/grid\">NeonGrid</a>\n   * breakpoint layout.\n   */\n  All = 'all',\n  /** Defines a desktop breakpoint of <strong>max-width: 1439px</strong>. */\n  Desktop = 'desktop',\n  /** Defines a larger than desktop breakpoint of <strong>min-width: 1440px</strong>. */\n  DesktopLarge = 'desktop-large',\n  /** Defines a larger than tablet breakpoint of <strong>min-width: 1024px</strong>. */\n  LargerThanTablet = 'larger-than-tablet',\n  /** Defines a tablet breakpoint of <strong>max-width: 1023px</strong>. */\n  Tablet = 'tablet',\n  /** Defines a larger than mobile large breakpoint of <strong>min-width: 768px</strong>. */\n  LargerThanMobileLarge = 'larger-than-mobile-l',\n  /** Defines a large mobile breakpoint of <strong>max-width: 767px</strong>. */\n  MobileLarge = 'mobile-large',\n  /** Defines a larger than mobile breakpoint of <strong>min-width: 415px</strong>. */\n  LargerThanMobile = 'larger-than-mobile',\n  /** Defines a mobile breakpoint of <strong>max-width: 414px</strong>. */\n  Mobile = 'mobile',\n}\n"],"names":["NeonResponsive"],"mappings":"AAKO,IAAKA,sBAAAA,OAKVA,EAAA,MAAM,OAENA,EAAA,UAAU,WAEVA,EAAA,eAAe,iBAEfA,EAAA,mBAAmB,sBAEnBA,EAAA,SAAS,UAETA,EAAA,wBAAwB,wBAExBA,EAAA,cAAc,gBAEdA,EAAA,mBAAmB,sBAEnBA,EAAA,SAAS,UArBCA,IAAAA,KAAA,CAAA,CAAA;"}

package/dist/common/utils/NeonResponsiveUtils.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var p=Object.defineProperty;var a=(o,i,n)=>i in o?p(o,i,{enumerable:!0,configurable:!0,writable:!0,value:n}):o[i]=n;var s=(o,i,n)=>a(o,typeof i!="symbol"?i+"":i,n);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../enums/NeonResponsive.cjs.js");class t{}s(t,"breakpoints",Object.freeze({[e.NeonResponsive.All]:"",[e.NeonResponsive.DesktopLarge]:"(min-width: 1440px)",[e.NeonResponsive.Desktop]:"(max-width: 1339px)",[e.NeonResponsive.LargerThanTablet]:"(min-width: 1025px)",[e.NeonResponsive.Tablet]:"(max-width: 1024px)",[e.NeonResponsive.LargerThanMobileLarge]:"(min-width: 600px)",[e.NeonResponsive.MobileLarge]:"(max-width: 599px)",[e.NeonResponsive.LargerThanMobile]:"(min-width: 415px)",[e.NeonResponsive.Mobile]:"(max-width: 414px)"}));exports.NeonResponsiveUtils=t;
+"use strict";var p=Object.defineProperty;var a=(o,i,n)=>i in o?p(o,i,{enumerable:!0,configurable:!0,writable:!0,value:n}):o[i]=n;var s=(o,i,n)=>a(o,typeof i!="symbol"?i+"":i,n);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../enums/NeonResponsive.cjs.js");class t{}s(t,"breakpoints",Object.freeze({[e.NeonResponsive.All]:"",[e.NeonResponsive.DesktopLarge]:"(min-width: 1440px)",[e.NeonResponsive.Desktop]:"(max-width: 1339px)",[e.NeonResponsive.LargerThanTablet]:"(min-width: 1024px)",[e.NeonResponsive.Tablet]:"(max-width: 1023px)",[e.NeonResponsive.LargerThanMobileLarge]:"(min-width: 768px)",[e.NeonResponsive.MobileLarge]:"(max-width: 767px)",[e.NeonResponsive.LargerThanMobile]:"(min-width: 415px)",[e.NeonResponsive.Mobile]:"(max-width: 414px)"}));exports.NeonResponsiveUtils=t;
 //# sourceMappingURL=NeonResponsiveUtils.cjs.js.map

package/dist/common/utils/NeonResponsiveUtils.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonResponsiveUtils.cjs.js","sources":["../../../src/common/utils/NeonResponsiveUtils.ts"],"sourcesContent":["import { NeonResponsive } from '../enums/NeonResponsive';\n\n/**\n * Responsive media query utilities.\n */\nexport class NeonResponsiveUtils {\n  /**\n   * The defined list of Neon responsive breakpoints. This can be used with matchMedia queries in javascript to respond\n   * to layout changes.\n   */\n  public static readonly breakpoints: Record<NeonResponsive, string> = Object.freeze({\n    [NeonResponsive.All]: '', // only use all on its own, never in combination with other breakpoints\n    [NeonResponsive.DesktopLarge]: '(min-width: 1440px)',\n    [NeonResponsive.Desktop]: '(max-width: 1339px)',\n    [NeonResponsive.LargerThanTablet]: '(min-width: 1025px)',\n    [NeonResponsive.Tablet]: '(max-width: 1024px)',\n    [NeonResponsive.LargerThanMobileLarge]: '(min-width: 600px)',\n    [NeonResponsive.MobileLarge]: '(max-width: 599px)',\n    [NeonResponsive.LargerThanMobile]: '(min-width: 415px)',\n    [NeonResponsive.Mobile]: '(max-width: 414px)',\n  });\n}\n"],"names":["NeonResponsiveUtils","__publicField","NeonResponsive"],"mappings":"sSAKO,MAAMA,CAAoB,CAgBjC,CAXEC,EALWD,EAKY,cAA8C,OAAO,OAAO,CACjF,CAACE,EAAAA,eAAe,GAAG,EAAG,GACtB,CAACA,EAAAA,eAAe,YAAY,EAAG,sBAC/B,CAACA,EAAAA,eAAe,OAAO,EAAG,sBAC1B,CAACA,EAAAA,eAAe,gBAAgB,EAAG,sBACnC,CAACA,EAAAA,eAAe,MAAM,EAAG,sBACzB,CAACA,EAAAA,eAAe,qBAAqB,EAAG,qBACxC,CAACA,EAAAA,eAAe,WAAW,EAAG,qBAC9B,CAACA,EAAAA,eAAe,gBAAgB,EAAG,qBACnC,CAACA,EAAAA,eAAe,MAAM,EAAG,oBAAA,CAC1B"}
+{"version":3,"file":"NeonResponsiveUtils.cjs.js","sources":["../../../src/common/utils/NeonResponsiveUtils.ts"],"sourcesContent":["import { NeonResponsive } from '../enums/NeonResponsive';\n\n/**\n * Responsive media query utilities.\n */\nexport class NeonResponsiveUtils {\n  /**\n   * The defined list of Neon responsive breakpoints. This can be used with matchMedia queries in javascript to respond\n   * to layout changes.\n   */\n  public static readonly breakpoints: Record<NeonResponsive, string> = Object.freeze({\n    [NeonResponsive.All]: '', // only use all on its own, never in combination with other breakpoints\n    [NeonResponsive.DesktopLarge]: '(min-width: 1440px)',\n    [NeonResponsive.Desktop]: '(max-width: 1339px)',\n    [NeonResponsive.LargerThanTablet]: '(min-width: 1024px)',\n    [NeonResponsive.Tablet]: '(max-width: 1023px)',\n    [NeonResponsive.LargerThanMobileLarge]: '(min-width: 768px)',\n    [NeonResponsive.MobileLarge]: '(max-width: 767px)',\n    [NeonResponsive.LargerThanMobile]: '(min-width: 415px)',\n    [NeonResponsive.Mobile]: '(max-width: 414px)',\n  });\n}\n"],"names":["NeonResponsiveUtils","__publicField","NeonResponsive"],"mappings":"sSAKO,MAAMA,CAAoB,CAgBjC,CAXEC,EALWD,EAKY,cAA8C,OAAO,OAAO,CACjF,CAACE,EAAAA,eAAe,GAAG,EAAG,GACtB,CAACA,EAAAA,eAAe,YAAY,EAAG,sBAC/B,CAACA,EAAAA,eAAe,OAAO,EAAG,sBAC1B,CAACA,EAAAA,eAAe,gBAAgB,EAAG,sBACnC,CAACA,EAAAA,eAAe,MAAM,EAAG,sBACzB,CAACA,EAAAA,eAAe,qBAAqB,EAAG,qBACxC,CAACA,EAAAA,eAAe,WAAW,EAAG,qBAC9B,CAACA,EAAAA,eAAe,gBAAgB,EAAG,qBACnC,CAACA,EAAAA,eAAe,MAAM,EAAG,oBAAA,CAC1B"}

package/dist/common/utils/NeonResponsiveUtils.es.js

@@ -13,10 +13,10 @@ p(o, "breakpoints", Object.freeze({
   // only use all on its own, never in combination with other breakpoints
   [e.DesktopLarge]: "(min-width: 1440px)",
   [e.Desktop]: "(max-width: 1339px)",
-  [e.LargerThanTablet]: "(min-width: 1025px)",
-  [e.Tablet]: "(max-width: 1024px)",
-  [e.LargerThanMobileLarge]: "(min-width: 600px)",
-  [e.MobileLarge]: "(max-width: 599px)",
+  [e.LargerThanTablet]: "(min-width: 1024px)",
+  [e.Tablet]: "(max-width: 1023px)",
+  [e.LargerThanMobileLarge]: "(min-width: 768px)",
+  [e.MobileLarge]: "(max-width: 767px)",
   [e.LargerThanMobile]: "(min-width: 415px)",
   [e.Mobile]: "(max-width: 414px)"
 }));

package/dist/common/utils/NeonResponsiveUtils.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonResponsiveUtils.es.js","sources":["../../../src/common/utils/NeonResponsiveUtils.ts"],"sourcesContent":["import { NeonResponsive } from '../enums/NeonResponsive';\n\n/**\n * Responsive media query utilities.\n */\nexport class NeonResponsiveUtils {\n  /**\n   * The defined list of Neon responsive breakpoints. This can be used with matchMedia queries in javascript to respond\n   * to layout changes.\n   */\n  public static readonly breakpoints: Record<NeonResponsive, string> = Object.freeze({\n    [NeonResponsive.All]: '', // only use all on its own, never in combination with other breakpoints\n    [NeonResponsive.DesktopLarge]: '(min-width: 1440px)',\n    [NeonResponsive.Desktop]: '(max-width: 1339px)',\n    [NeonResponsive.LargerThanTablet]: '(min-width: 1025px)',\n    [NeonResponsive.Tablet]: '(max-width: 1024px)',\n    [NeonResponsive.LargerThanMobileLarge]: '(min-width: 600px)',\n    [NeonResponsive.MobileLarge]: '(max-width: 599px)',\n    [NeonResponsive.LargerThanMobile]: '(min-width: 415px)',\n    [NeonResponsive.Mobile]: '(max-width: 414px)',\n  });\n}\n"],"names":["NeonResponsiveUtils","__publicField","NeonResponsive"],"mappings":";;;;AAKO,MAAMA,EAAoB;AAgBjC;AAAA;AAAA;AAAA;AAAA;AAXEC,EALWD,GAKY,eAA8C,OAAO,OAAO;AAAA,EACjF,CAACE,EAAe,GAAG,GAAG;AAAA;AAAA,EACtB,CAACA,EAAe,YAAY,GAAG;AAAA,EAC/B,CAACA,EAAe,OAAO,GAAG;AAAA,EAC1B,CAACA,EAAe,gBAAgB,GAAG;AAAA,EACnC,CAACA,EAAe,MAAM,GAAG;AAAA,EACzB,CAACA,EAAe,qBAAqB,GAAG;AAAA,EACxC,CAACA,EAAe,WAAW,GAAG;AAAA,EAC9B,CAACA,EAAe,gBAAgB,GAAG;AAAA,EACnC,CAACA,EAAe,MAAM,GAAG;AAAA,CAC1B;"}
+{"version":3,"file":"NeonResponsiveUtils.es.js","sources":["../../../src/common/utils/NeonResponsiveUtils.ts"],"sourcesContent":["import { NeonResponsive } from '../enums/NeonResponsive';\n\n/**\n * Responsive media query utilities.\n */\nexport class NeonResponsiveUtils {\n  /**\n   * The defined list of Neon responsive breakpoints. This can be used with matchMedia queries in javascript to respond\n   * to layout changes.\n   */\n  public static readonly breakpoints: Record<NeonResponsive, string> = Object.freeze({\n    [NeonResponsive.All]: '', // only use all on its own, never in combination with other breakpoints\n    [NeonResponsive.DesktopLarge]: '(min-width: 1440px)',\n    [NeonResponsive.Desktop]: '(max-width: 1339px)',\n    [NeonResponsive.LargerThanTablet]: '(min-width: 1024px)',\n    [NeonResponsive.Tablet]: '(max-width: 1023px)',\n    [NeonResponsive.LargerThanMobileLarge]: '(min-width: 768px)',\n    [NeonResponsive.MobileLarge]: '(max-width: 767px)',\n    [NeonResponsive.LargerThanMobile]: '(min-width: 415px)',\n    [NeonResponsive.Mobile]: '(max-width: 414px)',\n  });\n}\n"],"names":["NeonResponsiveUtils","__publicField","NeonResponsive"],"mappings":";;;;AAKO,MAAMA,EAAoB;AAgBjC;AAAA;AAAA;AAAA;AAAA;AAXEC,EALWD,GAKY,eAA8C,OAAO,OAAO;AAAA,EACjF,CAACE,EAAe,GAAG,GAAG;AAAA;AAAA,EACtB,CAACA,EAAe,YAAY,GAAG;AAAA,EAC/B,CAACA,EAAe,OAAO,GAAG;AAAA,EAC1B,CAACA,EAAe,gBAAgB,GAAG;AAAA,EACnC,CAACA,EAAe,MAAM,GAAG;AAAA,EACzB,CAACA,EAAe,qBAAqB,GAAG;AAAA,EACxC,CAACA,EAAe,WAAW,GAAG;AAAA,EAC9B,CAACA,EAAe,gBAAgB,GAAG;AAAA,EACnC,CAACA,EAAe,MAAM,GAAG;AAAA,CAC1B;"}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"NeonLink.cjs.js","sources":["../../../../src/components/navigation/link/NeonLink.ts?vue&type=script&src=true&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, useRouter } 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 or Space when the link has focus.\n     * @type {void}\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const router = useRouter();\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    const onSpace = async () => {\n      onClick();\n\n      if (routerUrl.value) {\n        await router.push(props.href);\n      } else if (props.href) {\n        window.location.replace(props.href);\n      }\n    };\n\n    return {\n      routerUrl,\n      sanitizedAttributes,\n      activeRoute,\n      exactRoute,\n      onClick,\n      onSpace,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonOutlineStyle","props","emit","attrs","useAttrs","router","useRouter","route","useRoute","routerUrl","computed","_a","activeRoute","exactRoute","sanitizedAttributes","onClick","sanitized"],"mappings":"gLAQAA,EAAeC,kBAAgB,CAC7B,KAAM,WACN,WAAY,CACV,SAAAC,CAAA,EAEF,MAAO,CAIL,KAAM,CAAE,KAAM,OAAQ,QAAS,IAAA,EAI/B,QAAS,CAAE,KAAM,QAAS,QAAS,EAAA,EAKnC,aAAc,CAAE,KAAM,OAAkC,QAASC,EAAAA,iBAAiB,IAAA,EAIlF,kBAAmB,CAAE,KAAM,QAAS,QAAS,EAAA,CAAM,EAErD,MAAO,CAKL,OAAA,EAEF,MAAMC,EAAO,CAAE,KAAAC,GAAQ,CACrB,MAAMC,EAAQC,EAAAA,SAAA,EACRC,EAASC,EAAAA,UAAA,EACTC,EAAQC,EAAAA,SAAA,EACRC,EAAYC,EAAAA,SAAS,IAAA,OAAO,QAAAC,EAAAV,EAAM,OAAN,YAAAU,EAAY,QAAQ,SAAU,GAAKV,EAAM,KAAO,OAAU,EAEtFW,EAAcF,EAAAA,SAAS,IAAMT,EAAM,MAAQA,EAAM,KAAK,QAAQM,EAAM,QAAQ,IAAM,CAAC,EACnFM,EAAaH,EAAAA,SAAS,IAAME,EAAY,OAASX,EAAM,OAASM,EAAM,QAAQ,EAE9EO,EAAsBJ,EAAAA,SAAS,IAAM,CAEzC,KAAM,CAAE,QAAAK,EAAS,GAAGC,GAAcb,EAClC,OAAOa,CACT,CAAC,EAEKD,EAAU,IAAM,CACpBb,EAAK,OAAO,CACd,EAYA,MAAO,CACL,UAAAO,EACA,oBAAAK,EACA,YAAAF,EACA,WAAAC,EACA,QAAAE,EACA,QAhBc,SAAY,CAC1BA,EAAA,EAEIN,EAAU,MACZ,MAAMJ,EAAO,KAAKJ,EAAM,IAAI,EACnBA,EAAM,MACf,OAAO,SAAS,QAAQA,EAAM,IAAI,CAEtC,CAQE,CAEJ,CACF,CAAC"}
+{"version":3,"file":"NeonLink.cjs.js","sources":["../../../../src/components/navigation/link/NeonLink.ts?vue&type=script&src=true&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, useRouter } 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 or Space when the link has focus.\n     * @type {void}\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const router = useRouter();\n    const route = useRoute();\n    const routerUrl = computed(() => (props.href?.indexOf('/') === 0 ? 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    const onSpace = async () => {\n      onClick();\n\n      if (routerUrl.value) {\n        await router.push(props.href);\n      } else if (props.href) {\n        window.location.replace(props.href);\n      }\n    };\n\n    return {\n      routerUrl,\n      sanitizedAttributes,\n      activeRoute,\n      exactRoute,\n      onClick,\n      onSpace,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonOutlineStyle","props","emit","attrs","useAttrs","router","useRouter","route","useRoute","routerUrl","computed","_a","activeRoute","exactRoute","sanitizedAttributes","onClick","sanitized"],"mappings":"gLAQAA,EAAeC,kBAAgB,CAC7B,KAAM,WACN,WAAY,CACV,SAAAC,CAAA,EAEF,MAAO,CAIL,KAAM,CAAE,KAAM,OAAQ,QAAS,IAAA,EAI/B,QAAS,CAAE,KAAM,QAAS,QAAS,EAAA,EAKnC,aAAc,CAAE,KAAM,OAAkC,QAASC,EAAAA,iBAAiB,IAAA,EAIlF,kBAAmB,CAAE,KAAM,QAAS,QAAS,EAAA,CAAM,EAErD,MAAO,CAKL,OAAA,EAEF,MAAMC,EAAO,CAAE,KAAAC,GAAQ,CACrB,MAAMC,EAAQC,EAAAA,SAAA,EACRC,EAASC,EAAAA,UAAA,EACTC,EAAQC,EAAAA,SAAA,EACRC,EAAYC,EAAAA,SAAS,IAAA,OAAO,QAAAC,EAAAV,EAAM,OAAN,YAAAU,EAAY,QAAQ,QAAS,EAAIV,EAAM,KAAO,OAAU,EAEpFW,EAAcF,EAAAA,SAAS,IAAMT,EAAM,MAAQA,EAAM,KAAK,QAAQM,EAAM,QAAQ,IAAM,CAAC,EACnFM,EAAaH,EAAAA,SAAS,IAAME,EAAY,OAASX,EAAM,OAASM,EAAM,QAAQ,EAE9EO,EAAsBJ,EAAAA,SAAS,IAAM,CAEzC,KAAM,CAAE,QAAAK,EAAS,GAAGC,GAAcb,EAClC,OAAOa,CACT,CAAC,EAEKD,EAAU,IAAM,CACpBb,EAAK,OAAO,CACd,EAYA,MAAO,CACL,UAAAO,EACA,oBAAAK,EACA,YAAAF,EACA,WAAAC,EACA,QAAAE,EACA,QAhBc,SAAY,CAC1BA,EAAA,EAEIN,EAAU,MACZ,MAAMJ,EAAO,KAAKJ,EAAM,IAAI,EACnBA,EAAM,MACf,OAAO,SAAS,QAAQA,EAAM,IAAI,CAEtC,CAQE,CAEJ,CACF,CAAC"}

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

@@ -36,7 +36,7 @@ const N = m({
   setup(e, { emit: a }) {
     const c = h(), f = k(), o = x(), i = t(() => {
       var n;
-      return ((n = e.href) == null ? void 0 : n.indexOf("//")) === -1 ? e.href : void 0;
+      return ((n = e.href) == null ? void 0 : n.indexOf("/")) === 0 ? e.href : void 0;
     }), l = t(() => e.href && e.href.indexOf(o.fullPath) === 0), u = t(() => l.value && e.href === o.fullPath), s = t(() => {
       const { onClick: n, ...d } = c;
       return d;

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

@@ -1 +1 @@
-{"version":3,"file":"NeonLink.es.js","sources":["../../../../src/components/navigation/link/NeonLink.ts?vue&type=script&src=true&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, useRouter } 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 or Space when the link has focus.\n     * @type {void}\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const router = useRouter();\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    const onSpace = async () => {\n      onClick();\n\n      if (routerUrl.value) {\n        await router.push(props.href);\n      } else if (props.href) {\n        window.location.replace(props.href);\n      }\n    };\n\n    return {\n      routerUrl,\n      sanitizedAttributes,\n      activeRoute,\n      exactRoute,\n      onClick,\n      onSpace,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonOutlineStyle","props","emit","attrs","useAttrs","router","useRouter","route","useRoute","routerUrl","computed","_a","activeRoute","exactRoute","sanitizedAttributes","onClick","sanitized"],"mappings":";;;;AAQA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV,UAAAC;AAAA,EAAA;AAAA,EAEF,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,MAAM,EAAE,MAAM,QAAQ,SAAS,KAAA;AAAA;AAAA;AAAA;AAAA,IAI/B,SAAS,EAAE,MAAM,SAAS,SAAS,GAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKnC,cAAc,EAAE,MAAM,QAAkC,SAASC,EAAiB,KAAA;AAAA;AAAA;AAAA;AAAA,IAIlF,mBAAmB,EAAE,MAAM,SAAS,SAAS,GAAA;AAAA,EAAM;AAAA,EAErD,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL;AAAA,EAAA;AAAA,EAEF,MAAMC,GAAO,EAAE,MAAAC,KAAQ;AACrB,UAAMC,IAAQC,EAAA,GACRC,IAASC,EAAA,GACTC,IAAQC,EAAA,GACRC,IAAYC,EAAS,MAAA;;AAAO,eAAAC,IAAAV,EAAM,SAAN,gBAAAU,EAAY,QAAQ,WAAU,KAAKV,EAAM,OAAO;AAAA,KAAU,GAEtFW,IAAcF,EAAS,MAAMT,EAAM,QAAQA,EAAM,KAAK,QAAQM,EAAM,QAAQ,MAAM,CAAC,GACnFM,IAAaH,EAAS,MAAME,EAAY,SAASX,EAAM,SAASM,EAAM,QAAQ,GAE9EO,IAAsBJ,EAAS,MAAM;AAEzC,YAAM,EAAE,SAAAK,GAAS,GAAGC,MAAcb;AAClC,aAAOa;AAAA,IACT,CAAC,GAEKD,IAAU,MAAM;AACpB,MAAAb,EAAK,OAAO;AAAA,IACd;AAYA,WAAO;AAAA,MACL,WAAAO;AAAA,MACA,qBAAAK;AAAA,MACA,aAAAF;AAAA,MACA,YAAAC;AAAA,MACA,SAAAE;AAAA,MACA,SAhBc,YAAY;AAC1B,QAAAA,EAAA,GAEIN,EAAU,QACZ,MAAMJ,EAAO,KAAKJ,EAAM,IAAI,IACnBA,EAAM,QACf,OAAO,SAAS,QAAQA,EAAM,IAAI;AAAA,MAEtC;AAAA,IAQE;AAAA,EAEJ;AACF,CAAC;"}
+{"version":3,"file":"NeonLink.es.js","sources":["../../../../src/components/navigation/link/NeonLink.ts?vue&type=script&src=true&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, useRouter } 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 or Space when the link has focus.\n     * @type {void}\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const router = useRouter();\n    const route = useRoute();\n    const routerUrl = computed(() => (props.href?.indexOf('/') === 0 ? 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    const onSpace = async () => {\n      onClick();\n\n      if (routerUrl.value) {\n        await router.push(props.href);\n      } else if (props.href) {\n        window.location.replace(props.href);\n      }\n    };\n\n    return {\n      routerUrl,\n      sanitizedAttributes,\n      activeRoute,\n      exactRoute,\n      onClick,\n      onSpace,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonOutlineStyle","props","emit","attrs","useAttrs","router","useRouter","route","useRoute","routerUrl","computed","_a","activeRoute","exactRoute","sanitizedAttributes","onClick","sanitized"],"mappings":";;;;AAQA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV,UAAAC;AAAA,EAAA;AAAA,EAEF,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,MAAM,EAAE,MAAM,QAAQ,SAAS,KAAA;AAAA;AAAA;AAAA;AAAA,IAI/B,SAAS,EAAE,MAAM,SAAS,SAAS,GAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKnC,cAAc,EAAE,MAAM,QAAkC,SAASC,EAAiB,KAAA;AAAA;AAAA;AAAA;AAAA,IAIlF,mBAAmB,EAAE,MAAM,SAAS,SAAS,GAAA;AAAA,EAAM;AAAA,EAErD,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL;AAAA,EAAA;AAAA,EAEF,MAAMC,GAAO,EAAE,MAAAC,KAAQ;AACrB,UAAMC,IAAQC,EAAA,GACRC,IAASC,EAAA,GACTC,IAAQC,EAAA,GACRC,IAAYC,EAAS,MAAA;;AAAO,eAAAC,IAAAV,EAAM,SAAN,gBAAAU,EAAY,QAAQ,UAAS,IAAIV,EAAM,OAAO;AAAA,KAAU,GAEpFW,IAAcF,EAAS,MAAMT,EAAM,QAAQA,EAAM,KAAK,QAAQM,EAAM,QAAQ,MAAM,CAAC,GACnFM,IAAaH,EAAS,MAAME,EAAY,SAASX,EAAM,SAASM,EAAM,QAAQ,GAE9EO,IAAsBJ,EAAS,MAAM;AAEzC,YAAM,EAAE,SAAAK,GAAS,GAAGC,MAAcb;AAClC,aAAOa;AAAA,IACT,CAAC,GAEKD,IAAU,MAAM;AACpB,MAAAb,EAAK,OAAO;AAAA,IACd;AAYA,WAAO;AAAA,MACL,WAAAO;AAAA,MACA,qBAAAK;AAAA,MACA,aAAAF;AAAA,MACA,YAAAC;AAAA,MACA,SAAAE;AAAA,MACA,SAhBc,YAAY;AAC1B,QAAAA,EAAA,GAEIN,EAAU,QACZ,MAAMJ,EAAO,KAAKJ,EAAM,IAAI,IACnBA,EAAM,QACf,OAAO,SAAS,QAAQA,EAAM,IAAI;AAAA,MAEtC;AAAA,IAQE;AAAA,EAEJ;AACF,CAAC;"}

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

@@ -1 +1 @@
-{"version":3,"file":"NeonMenu.cjs.js","sources":["../../../../src/components/navigation/menu/NeonMenu.ts?vue&type=script&src=true&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\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 path && 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 responsiveDropdown = menuWrapper.value?.getElementsByClassName(\n        'neon-menu__responsive-menu',\n      )[0] as HTMLElement;\n      const responsiveMenuWidth = (responsiveDropdown && getWidth(responsiveDropdown)) || 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 (responsiveDropdown) {\n        responsiveDropdown.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      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","menuItems","responsiveMenuItems","visible","getWidth","el","styles","margin","toPriorityMenuItem","key","element","initMenuItems","results","item","index","routeMatches","path","onClick","determineVisibleMenuItems","menuWidth","responsiveMenuWidth","acc","width","availableWidth","refreshVisibleMenu","nextTick","responsiveDropdown","_a","onMounted","onUnmounted"],"mappings":"yUAkBAA,EAAeC,kBAAgB,CAC7B,KAAM,WACN,WAAY,CACV,iBAAAC,EACA,SAAAC,EACA,SAAAC,CAAA,EAEF,MAAO,CAKL,KAAM,CAAE,KAAM,MAAqC,SAAU,EAAA,EAI7D,MAAO,CAAE,KAAM,OAAqC,QAASC,EAAAA,oBAAoB,KAAA,EAIjF,KAAM,CAAE,KAAM,OAA0B,QAASC,EAAAA,SAAS,KAAA,EAK1D,oBAAqB,CAAE,KAAM,QAAS,QAAS,EAAA,CAAK,EAEtD,MAAO,CAKL,OAAA,EAEF,MAAMC,EAAO,CAAE,KAAAC,GAAQ,CACrB,MAAMC,EAAQC,EAAAA,SAAA,EACRC,EAAcC,EAAAA,IAAwB,IAAI,EAC1CC,EAAWD,EAAAA,IAA+B,IAAI,EAE9CE,EAAYF,EAAAA,IAAiC,EAAE,EAC/CG,EAAsBH,EAAAA,IAA0B,EAAE,EAClDI,EAAUJ,EAAAA,IAAmB,EAAE,EAE/BK,EAAYC,GAAoB,CACpC,MAAMC,EAAS,OAAO,iBAAiBD,CAAE,EACnCE,EAAS,WAAWD,EAAO,YAAc,GAAG,EAAI,WAAWA,EAAO,aAAe,GAAG,EAC1F,OAAO,KAAK,KAAKD,EAAG,YAAcE,CAAM,CAC1C,EAEMC,EAAqB,CAACC,EAAaC,KAChC,CACL,IAAAD,EACA,QAAAC,EACA,MAAON,EAASM,CAAO,CAAA,GAIrBC,EAAgB,IAAM,CAC1B,MAAMC,EAAUlB,EAAM,KAAK,IACzB,CAACmB,EAAMC,IAAWd,EAAS,OAASQ,EAAmBK,EAAK,IAAKb,EAAS,MAAMc,CAAK,CAAC,GAAM,IAAA,EAE9Fb,EAAU,MAAQW,EAAQ,OAAQC,GAASA,IAAS,IAAI,CAC1D,EAEME,EAAgBC,GACbA,IAAQpB,GAAA,YAAAA,EAAO,KAAK,QAAQoB,KAAS,EAGxCC,EAAWR,GAAgB,CAC/Bd,EAAK,QAASc,CAAG,CACnB,EAEMS,EAA4B,CAChCC,EACAC,EACAnB,IACG,CAIH,GAHqBA,EAAU,IAAKY,GAASA,EAAK,KAAK,EAAE,OAAO,CAACQ,EAAaC,IAAWD,EAAMA,EAAMC,EAAQ,CAAE,GAG3FH,EAAYC,EAC9B,OAAOnB,EAAU,IAAKD,GAAaA,EAAS,GAAG,EAIjD,IAAIuB,EAAiBJ,EAAYC,EAC7BjB,EAAoB,CAAA,EAExB,QAAS,EAAI,EAAG,EAAIF,EAAU,OAAQ,EAAI,EAAI,EAAG,CAC/C,MAAMD,EAAWC,EAAU,CAAC,EAC5B,GAAIsB,EAAiBvB,EAAS,MAAO,CAE/B,IAAM,IACRG,EAAUA,EAAQ,OAAQM,GAAQA,IAAQR,EAAU,CAAC,EAAE,GAAG,GAE5D,KACF,CAEAsB,EAAiBA,EAAiBvB,EAAS,MAC3CG,EAAQ,KAAKH,EAAS,GAAG,CAC3B,CAEA,OAAOG,CACT,EAEMqB,EAAqB,SAAY,OACrC,MAAMC,WAAA,EACN,MAAMN,EAAarB,EAAY,OAASM,EAASN,EAAY,KAAK,GAAM,EAClE4B,GAAqBC,EAAA7B,EAAY,QAAZ,YAAA6B,EAAmB,uBAC5C,8BACA,GACIP,EAAuBM,GAAsBtB,EAASsB,CAAkB,GAAM,EACpFvB,EAAQ,MAAQe,EAA0BC,EAAWC,EAAqBnB,EAAU,KAAK,EAEzFC,EAAoB,MAAQR,EAAM,KAC/B,OAAQmB,GAASV,EAAQ,MAAM,QAAQU,EAAK,GAAG,EAAI,CAAC,EACpD,QAASA,GAAS,CACjB,CAAE,GAAGA,EAAM,QAASA,EAAK,UAAYA,EAAK,SAAS,OAAS,CAAA,EAC5D,IAAIA,EAAK,UAAY,CAAA,GAAI,IAAKA,IAAU,CAAE,GAAGA,EAAM,QAAS,IAAO,CAAA,CACpE,EAEHZ,EAAU,MAAM,QAASY,GAAS,CAChCA,EAAK,QAAQ,OAASV,EAAQ,MAAM,QAAQU,EAAK,GAAG,EAAI,CAC1D,CAAC,EAEGa,IACFA,EAAmB,OAASzB,EAAU,MAAM,SAAWE,EAAQ,MAAM,OAEzE,EAEAyB,OAAAA,EAAAA,UAAU,SAAY,CAChBlC,EAAM,sBACR,MAAM+B,WAAA,EACNd,EAAA,EACA,MAAMa,EAAA,EACN,OAAO,iBAAiB,SAAUA,CAAkB,EAExD,CAAC,EAEDK,EAAAA,YAAY,IAAM,CACZnC,EAAM,qBACR,OAAO,oBAAoB,SAAU8B,CAAkB,CAE3D,CAAC,EAEM,CACL,YAAA1B,EACA,SAAAE,EACA,UAAAC,EACA,oBAAAC,EACA,QAAAC,EACA,QAAAc,EACA,aAAAF,CAAA,CAEJ,CACF,CAAC"}
+{"version":3,"file":"NeonMenu.cjs.js","sources":["../../../../src/components/navigation/menu/NeonMenu.ts?vue&type=script&src=true&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. Use NeonMenu inside NeonTopNav for primary navigation.\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\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 path && 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 responsiveDropdown = menuWrapper.value?.getElementsByClassName(\n        'neon-menu__responsive-menu',\n      )[0] as HTMLElement;\n      const responsiveMenuWidth = (responsiveDropdown && getWidth(responsiveDropdown)) || 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 (responsiveDropdown) {\n        responsiveDropdown.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      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","menuItems","responsiveMenuItems","visible","getWidth","el","styles","margin","toPriorityMenuItem","key","element","initMenuItems","results","item","index","routeMatches","path","onClick","determineVisibleMenuItems","menuWidth","responsiveMenuWidth","acc","width","availableWidth","refreshVisibleMenu","nextTick","responsiveDropdown","_a","onMounted","onUnmounted"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"NeonMenu.es.js","sources":["../../../../src/components/navigation/menu/NeonMenu.ts?vue&type=script&src=true&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\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 path && 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 responsiveDropdown = menuWrapper.value?.getElementsByClassName(\n        'neon-menu__responsive-menu',\n      )[0] as HTMLElement;\n      const responsiveMenuWidth = (responsiveDropdown && getWidth(responsiveDropdown)) || 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 (responsiveDropdown) {\n        responsiveDropdown.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      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","menuItems","responsiveMenuItems","visible","getWidth","el","styles","margin","toPriorityMenuItem","key","element","initMenuItems","results","item","index","routeMatches","path","onClick","determineVisibleMenuItems","menuWidth","responsiveMenuWidth","acc","width","availableWidth","refreshVisibleMenu","nextTick","responsiveDropdown","_a","onMounted","onUnmounted"],"mappings":";;;;;;;AAkBA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV,kBAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,EAAA;AAAA,EAEF,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL,MAAM,EAAE,MAAM,OAAqC,UAAU,GAAA;AAAA;AAAA;AAAA;AAAA,IAI7D,OAAO,EAAE,MAAM,QAAqC,SAASC,EAAoB,MAAA;AAAA;AAAA;AAAA;AAAA,IAIjF,MAAM,EAAE,MAAM,QAA0B,SAASC,EAAS,MAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAK1D,qBAAqB,EAAE,MAAM,SAAS,SAAS,GAAA;AAAA,EAAK;AAAA,EAEtD,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL;AAAA,EAAA;AAAA,EAEF,MAAMC,GAAO,EAAE,MAAAC,KAAQ;AACrB,UAAMC,IAAQC,EAAA,GACRC,IAAcC,EAAwB,IAAI,GAC1CC,IAAWD,EAA+B,IAAI,GAE9CE,IAAYF,EAAiC,EAAE,GAC/CG,IAAsBH,EAA0B,EAAE,GAClDI,IAAUJ,EAAmB,EAAE,GAE/BK,IAAW,CAACC,MAAoB;AACpC,YAAMC,IAAS,OAAO,iBAAiBD,CAAE,GACnCE,IAAS,WAAWD,EAAO,cAAc,GAAG,IAAI,WAAWA,EAAO,eAAe,GAAG;AAC1F,aAAO,KAAK,KAAKD,EAAG,cAAcE,CAAM;AAAA,IAC1C,GAEMC,IAAqB,CAACC,GAAaC,OAChC;AAAA,MACL,KAAAD;AAAA,MACA,SAAAC;AAAA,MACA,OAAON,EAASM,CAAO;AAAA,IAAA,IAIrBC,IAAgB,MAAM;AAC1B,YAAMC,IAAUlB,EAAM,KAAK;AAAA,QACzB,CAACmB,GAAMC,MAAWd,EAAS,SAASQ,EAAmBK,EAAK,KAAKb,EAAS,MAAMc,CAAK,CAAC,KAAM;AAAA,MAAA;AAE9F,MAAAb,EAAU,QAAQW,EAAQ,OAAO,CAACC,MAASA,MAAS,IAAI;AAAA,IAC1D,GAEME,IAAe,CAACC,MACbA,MAAQpB,KAAA,gBAAAA,EAAO,KAAK,QAAQoB,OAAS,GAGxCC,IAAU,CAACR,MAAgB;AAC/B,MAAAd,EAAK,SAASc,CAAG;AAAA,IACnB,GAEMS,IAA4B,CAChCC,GACAC,GACAnB,MACG;AAIH,UAHqBA,EAAU,IAAI,CAACY,MAASA,EAAK,KAAK,EAAE,OAAO,CAACQ,GAAaC,MAAWD,IAAMA,IAAMC,IAAQ,CAAE,KAG3FH,IAAYC;AAC9B,eAAOnB,EAAU,IAAI,CAACD,MAAaA,EAAS,GAAG;AAIjD,UAAIuB,IAAiBJ,IAAYC,GAC7BjB,IAAoB,CAAA;AAExB,eAAS,IAAI,GAAG,IAAIF,EAAU,QAAQ,IAAI,IAAI,GAAG;AAC/C,cAAMD,IAAWC,EAAU,CAAC;AAC5B,YAAIsB,IAAiBvB,EAAS,OAAO;AAEnC,UAAI,MAAM,MACRG,IAAUA,EAAQ,OAAO,CAACM,MAAQA,MAAQR,EAAU,CAAC,EAAE,GAAG;AAE5D;AAAA,QACF;AAEA,QAAAsB,IAAiBA,IAAiBvB,EAAS,OAC3CG,EAAQ,KAAKH,EAAS,GAAG;AAAA,MAC3B;AAEA,aAAOG;AAAAA,IACT,GAEMqB,IAAqB,YAAY;;AACrC,YAAMC,EAAA;AACN,YAAMN,IAAarB,EAAY,SAASM,EAASN,EAAY,KAAK,KAAM,GAClE4B,KAAqBC,IAAA7B,EAAY,UAAZ,gBAAA6B,EAAmB;AAAA,QAC5C;AAAA,QACA,IACIP,IAAuBM,KAAsBtB,EAASsB,CAAkB,KAAM;AACpF,MAAAvB,EAAQ,QAAQe,EAA0BC,GAAWC,GAAqBnB,EAAU,KAAK,GAEzFC,EAAoB,QAAQR,EAAM,KAC/B,OAAO,CAACmB,MAASV,EAAQ,MAAM,QAAQU,EAAK,GAAG,IAAI,CAAC,EACpD,QAAQ,CAACA,MAAS;AAAA,QACjB,EAAE,GAAGA,GAAM,SAASA,EAAK,YAAYA,EAAK,SAAS,SAAS,EAAA;AAAA,QAC5D,IAAIA,EAAK,YAAY,CAAA,GAAI,IAAI,CAACA,OAAU,EAAE,GAAGA,GAAM,SAAS,KAAO;AAAA,MAAA,CACpE,GAEHZ,EAAU,MAAM,QAAQ,CAACY,MAAS;AAChC,QAAAA,EAAK,QAAQ,SAASV,EAAQ,MAAM,QAAQU,EAAK,GAAG,IAAI;AAAA,MAC1D,CAAC,GAEGa,MACFA,EAAmB,SAASzB,EAAU,MAAM,WAAWE,EAAQ,MAAM;AAAA,IAEzE;AAEA,WAAAyB,EAAU,YAAY;AACpB,MAAIlC,EAAM,wBACR,MAAM+B,EAAA,GACNd,EAAA,GACA,MAAMa,EAAA,GACN,OAAO,iBAAiB,UAAUA,CAAkB;AAAA,IAExD,CAAC,GAEDK,EAAY,MAAM;AAChB,MAAInC,EAAM,uBACR,OAAO,oBAAoB,UAAU8B,CAAkB;AAAA,IAE3D,CAAC,GAEM;AAAA,MACL,aAAA1B;AAAA,MACA,UAAAE;AAAA,MACA,WAAAC;AAAA,MACA,qBAAAC;AAAA,MACA,SAAAC;AAAA,MACA,SAAAc;AAAA,MACA,cAAAF;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;"}
+{"version":3,"file":"NeonMenu.es.js","sources":["../../../../src/components/navigation/menu/NeonMenu.ts?vue&type=script&src=true&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. Use NeonMenu inside NeonTopNav for primary navigation.\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\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 path && 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 responsiveDropdown = menuWrapper.value?.getElementsByClassName(\n        'neon-menu__responsive-menu',\n      )[0] as HTMLElement;\n      const responsiveMenuWidth = (responsiveDropdown && getWidth(responsiveDropdown)) || 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 (responsiveDropdown) {\n        responsiveDropdown.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      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","menuItems","responsiveMenuItems","visible","getWidth","el","styles","margin","toPriorityMenuItem","key","element","initMenuItems","results","item","index","routeMatches","path","onClick","determineVisibleMenuItems","menuWidth","responsiveMenuWidth","acc","width","availableWidth","refreshVisibleMenu","nextTick","responsiveDropdown","_a","onMounted","onUnmounted"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";const c=require("./NeonMenu.cjs.js"),e=require("vue"),t=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),i={ref:"menuWrapper",class:"neon-menu__wrapper"},d={class:"neon-menu__item-label"};function u(o,k,m,_,y,b){const l=e.resolveComponent("neon-dropdown-menu"),r=e.resolveComponent("neon-icon"),a=e.resolveComponent("neon-link");return e.openBlock(),e.createElementBlock("nav",i,[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(l,{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"},null,8,["class","color","disabled","icon","label","model","openOnHover","size"])):(e.openBlock(),e.createBlock(a,{key:`${n.key}Link`,class:e.normalizeClass({"router-link-active":o.routeMatches(n.href)}),href:n.href,"no-style":!0,tabindex:n.disabled?-1:0,"outline-style":"none",role:"menuitem",onClick:s=>!n.disabled&&o.onClick(n.key),onKeydown:[e.withKeys(s=>!n.disabled&&o.onClick(n.key),["enter"]),e.withKeys(e.withModifiers(s=>!n.disabled&&o.onClick(n.key),["prevent"]),["space"])]},{default:e.withCtx(()=>[n.icon?(e.openBlock(),e.createBlock(r,{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(l,{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",icon:"ellipsis",placement:"bottom-right"},null,8,["class","color","model","size"])],512)}const p=t(c,[["render",u]]);module.exports=p;
+"use strict";const a=require("./NeonMenu.cjs.js"),e=require("vue"),t=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),i={ref:"menuWrapper",class:"neon-menu__wrapper"},d=["onClick"],u={class:"neon-menu__item-label"};function p(o,_,k,y,b,h){const l=e.resolveComponent("neon-dropdown-menu"),s=e.resolveComponent("neon-icon"),r=e.resolveComponent("neon-link");return e.openBlock(),e.createElementBlock("nav",i,[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(l,{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"},null,8,["class","color","disabled","icon","label","model","openOnHover","size"])):(e.openBlock(),e.createBlock(r,{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",onKeydown:e.withKeys(c=>!n.disabled&&o.onClick(n.key),["enter"])},{default:e.withCtx(()=>[e.createElementVNode("div",{class:"neon-menu__link-container",tabindex:"-1",onClick:c=>!n.disabled&&o.onClick(n.key)},[n.icon?(e.openBlock(),e.createBlock(s,{key:`${n.key}LinkIcon`,name:n.icon,class:"neon-menu__item-icon",color:"neutral"},null,8,["name"])):e.createCommentVNode("",!0),e.createElementVNode("span",u,e.toDisplayString(n.label),1)],8,d)]),_:2},1032,["class","href","tabindex","onKeydown"]))],2))),128))],2),e.createVNode(l,{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",icon:"ellipsis",placement:"bottom-right"},null,8,["class","color","model","size"])],512)}const m=t(a,[["render",p]]);module.exports=m;
 //# sourceMappingURL=NeonMenu.vue.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"NeonMenu.vue.cjs.js","sources":["../../../../src/components/navigation/menu/NeonMenu.vue"],"sourcesContent":["<template>\n  <nav ref=\"menuWrapper\" class=\"neon-menu__wrapper\">\n    <ul :class=\"[`neon-menu--${color}`, `neon-menu--${size}`]\" class=\"neon-menu no-style\" role=\"menubar\">\n      <li\n        v-for=\"item in menu\"\n        :key=\"item.key\"\n        ref=\"menuItem\"\n        :class=\"{ 'neon-menu__item--disabled': item.disabled }\"\n        class=\"neon-menu__item\"\n      >\n        <neon-dropdown-menu\n          v-if=\"item.children\"\n          :key=\"`${item.key}DropdownMenu`\"\n          :class=\"{ 'router-link-active': routeMatches(item.href) }\"\n          :color=\"color\"\n          :disabled=\"item.disabled\"\n          :icon=\"item.icon\"\n          :label=\"item.label\"\n          :model=\"item.children\"\n          :openOnHover=\"!item.disabled\"\n          :size=\"size\"\n          dropdown-style=\"text\"\n        />\n        <neon-link\n          v-else\n          :key=\"`${item.key}Link`\"\n          :class=\"{ 'router-link-active': routeMatches(item.href) }\"\n          :href=\"item.href\"\n          :no-style=\"true\"\n          :tabindex=\"item.disabled ? -1 : 0\"\n          outline-style=\"none\"\n          role=\"menuitem\"\n          @click=\"!item.disabled && onClick(item.key)\"\n          @keydown.enter=\"!item.disabled && onClick(item.key)\"\n          @keydown.space.prevent=\"!item.disabled && onClick(item.key)\"\n        >\n          <neon-icon\n            v-if=\"item.icon\"\n            :key=\"`${item.key}LinkIcon`\"\n            :name=\"item.icon\"\n            class=\"neon-menu__item-icon\"\n            color=\"neutral\"\n          />\n          <span class=\"neon-menu__item-label\">{{ item.label }}</span>\n        </neon-link>\n      </li>\n    </ul>\n    <neon-dropdown-menu\n      :class=\"{ 'neon-menu__responsive-menu--hidden': responsiveMenuItems.length === 0 }\"\n      :color=\"color\"\n      :indicator=\"false\"\n      :model=\"responsiveMenuItems\"\n      :openOnHover=\"true\"\n      :size=\"size\"\n      class=\"neon-menu__responsive-menu\"\n      dropdown-style=\"text\"\n      icon=\"ellipsis\"\n      placement=\"bottom-right\"\n    />\n  </nav>\n</template>\n\n<script lang=\"ts\" src=\"./NeonMenu.ts\" />\n"],"names":["_hoisted_2","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeClass","_ctx","_Fragment","_renderList","item","_createBlock","_component_neon_dropdown_menu","_component_neon_link","$event","_withKeys","_withModifiers","_component_neon_icon","_toDisplayString","_createVNode"],"mappings":"sIACO,IAAI,cAAc,MAAM,sBA0CfA,EAAA,CAAA,MAAM,uBAAuB,+IA1C3C,OAAAC,YAAA,EAAAC,qBA0DM,MA1DNC,EA0DM,CAzDJC,EAAAA,mBA4CK,KAAA,CA5CA,MAAKC,EAAAA,eAAA,CAAA,CAAA,cAAiBC,EAAA,KAAK,GAAA,cAAkBA,EAAA,IAAI,IAAW,oBAAoB,CAAA,EAAC,KAAK,6BACzFJ,EAAAA,mBA0CKK,EAAAA,SAAA,KAAAC,EAAAA,WAzCYF,EAAA,KAARG,kBADTP,EAAAA,mBA0CK,KAAA,CAxCF,IAAKO,EAAK,eACX,IAAI,WACH,MAAKJ,EAAAA,eAAA,CAAA,CAAA,4BAAiCI,EAAK,QAAQ,EAC9C,iBAAiB,CAAA,IAGfA,EAAK,wBADbC,EAAAA,YAYEC,EAAA,CAVC,IAAG,GAAKF,EAAK,GAAG,eAChB,MAAKJ,EAAAA,eAAA,CAAA,qBAA0BC,EAAA,aAAaG,EAAK,IAAI,EAAA,EACrD,MAAOH,EAAA,MACP,SAAUG,EAAK,SACf,KAAMA,EAAK,KACX,MAAOA,EAAK,MACZ,MAAOA,EAAK,SACZ,YAAW,CAAGA,EAAK,SACnB,KAAMH,EAAA,KACP,iBAAe,yGAEjBI,EAAAA,YAqBYE,EAAA,CAnBT,IAAG,GAAKH,EAAK,GAAG,OAChB,MAAKJ,EAAAA,eAAA,CAAA,qBAA0BC,EAAA,aAAaG,EAAK,IAAI,EAAA,EACrD,KAAMA,EAAK,KACX,WAAU,GACV,SAAUA,EAAK,SAAQ,GAAA,EACxB,gBAAc,OACd,KAAK,WACJ,QAAKI,GAAA,CAAGJ,EAAK,UAAYH,EAAA,QAAQG,EAAK,GAAG,EACzC,UAAO,CAASK,EAAAA,SAAAD,GAAA,CAAAJ,EAAK,UAAYH,UAAQG,EAAK,GAAG,EAAA,CAAA,OAAA,CAAA,EACzBK,EAAAA,SAAAC,EAAAA,cAAAF,GAAA,CAAAJ,EAAK,UAAYH,UAAQG,EAAK,GAAG,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,OAAA,CAAA,uBAE1D,IAME,CALMA,EAAK,oBADbC,EAAAA,YAMEM,EAAA,CAJC,IAAG,GAAKP,EAAK,GAAG,WAChB,KAAMA,EAAK,KACZ,MAAM,uBACN,MAAM,yDAERL,EAAAA,mBAA2D,OAA3DJ,EAA2DiB,EAAAA,gBAApBR,EAAK,KAAK,EAAA,CAAA,kFAIvDS,EAAAA,YAWEP,EAAA,CAVC,MAAKN,EAAAA,eAAA,CAAA,CAAA,qCAA0CC,EAAA,oBAAoB,YAM9D,4BAA4B,CAAA,EALjC,MAAOA,EAAA,MACP,UAAW,GACX,MAAOA,EAAA,oBACP,YAAa,GACb,KAAMA,EAAA,KAEP,iBAAe,OACf,KAAK,WACL,UAAU"}
+{"version":3,"file":"NeonMenu.vue.cjs.js","sources":["../../../../src/components/navigation/menu/NeonMenu.vue"],"sourcesContent":["<template>\n  <nav ref=\"menuWrapper\" class=\"neon-menu__wrapper\">\n    <ul :class=\"[`neon-menu--${color}`, `neon-menu--${size}`]\" class=\"neon-menu no-style\" role=\"menubar\">\n      <li\n        v-for=\"item in menu\"\n        :key=\"item.key\"\n        ref=\"menuItem\"\n        :class=\"{ 'neon-menu__item--disabled': item.disabled }\"\n        class=\"neon-menu__item\"\n      >\n        <neon-dropdown-menu\n          v-if=\"item.children\"\n          :key=\"`${item.key}DropdownMenu`\"\n          :class=\"{ 'router-link-active': routeMatches(item.href) }\"\n          :color=\"color\"\n          :disabled=\"item.disabled\"\n          :icon=\"item.icon\"\n          :label=\"item.label\"\n          :model=\"item.children\"\n          :openOnHover=\"!item.disabled\"\n          :size=\"size\"\n          dropdown-style=\"text\"\n        />\n        <neon-link\n          v-else\n          :key=\"`${item.key}Link`\"\n          :class=\"{ 'router-link-active': routeMatches(item.href) }\"\n          :href=\"item.href\"\n          :no-style=\"true\"\n          :tabindex=\"item.disabled ? -1 : 0\"\n          outline-style=\"none\"\n          role=\"menuitem\"\n          @keydown.enter=\"!item.disabled && onClick(item.key)\"\n        >\n          <div class=\"neon-menu__link-container\" tabindex=\"-1\" @click=\"!item.disabled && onClick(item.key)\">\n            <neon-icon\n              v-if=\"item.icon\"\n              :key=\"`${item.key}LinkIcon`\"\n              :name=\"item.icon\"\n              class=\"neon-menu__item-icon\"\n              color=\"neutral\"\n            />\n            <span class=\"neon-menu__item-label\">{{ item.label }}</span>\n          </div>\n        </neon-link>\n      </li>\n    </ul>\n    <neon-dropdown-menu\n      :class=\"{ 'neon-menu__responsive-menu--hidden': responsiveMenuItems.length === 0 }\"\n      :color=\"color\"\n      :indicator=\"false\"\n      :model=\"responsiveMenuItems\"\n      :openOnHover=\"true\"\n      :size=\"size\"\n      class=\"neon-menu__responsive-menu\"\n      dropdown-style=\"text\"\n      icon=\"ellipsis\"\n      placement=\"bottom-right\"\n    />\n  </nav>\n</template>\n\n<script lang=\"ts\" src=\"./NeonMenu.ts\" />\n"],"names":["_hoisted_3","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeClass","_ctx","_Fragment","_renderList","item","_createBlock","_component_neon_dropdown_menu","_component_neon_link","_withKeys","$event","_component_neon_icon","_toDisplayString","_createVNode"],"mappings":"sIACO,IAAI,cAAc,MAAM,oCAyCbA,EAAA,CAAA,MAAM,uBAAuB,+IAzC7C,OAAAC,YAAA,EAAAC,qBA0DM,MA1DNC,EA0DM,CAzDJC,EAAAA,mBA4CK,KAAA,CA5CA,MAAKC,EAAAA,eAAA,CAAA,CAAA,cAAiBC,EAAA,KAAK,GAAA,cAAkBA,EAAA,IAAI,IAAW,oBAAoB,CAAA,EAAC,KAAK,6BACzFJ,EAAAA,mBA0CKK,EAAAA,SAAA,KAAAC,EAAAA,WAzCYF,EAAA,KAARG,kBADTP,EAAAA,mBA0CK,KAAA,CAxCF,IAAKO,EAAK,eACX,IAAI,WACH,MAAKJ,EAAAA,eAAA,CAAA,CAAA,4BAAiCI,EAAK,QAAQ,EAC9C,iBAAiB,CAAA,IAGfA,EAAK,wBADbC,EAAAA,YAYEC,EAAA,CAVC,IAAG,GAAKF,EAAK,GAAG,eAChB,MAAKJ,EAAAA,eAAA,CAAA,qBAA0BC,EAAA,aAAaG,EAAK,IAAI,EAAA,EACrD,MAAOH,EAAA,MACP,SAAUG,EAAK,SACf,KAAMA,EAAK,KACX,MAAOA,EAAK,MACZ,MAAOA,EAAK,SACZ,YAAW,CAAGA,EAAK,SACnB,KAAMH,EAAA,KACP,iBAAe,yGAEjBI,EAAAA,YAqBYE,EAAA,CAnBT,IAAG,GAAKH,EAAK,GAAG,OAChB,MAAKJ,EAAAA,eAAA,CAAA,qBAA0BC,EAAA,aAAaG,EAAK,IAAI,EAAA,EACrD,KAAMA,EAAK,KACX,WAAU,GACV,SAAUA,EAAK,SAAQ,GAAA,EACxB,gBAAc,OACd,KAAK,WACJ,UAAOI,EAAAA,SAAAC,GAAA,CAASL,EAAK,UAAYH,EAAA,QAAQG,EAAK,GAAG,EAAA,CAAA,OAAA,CAAA,sBAElD,IASM,CATNL,EAAAA,mBASM,MAAA,CATD,MAAM,4BAA4B,SAAS,KAAM,QAAKU,GAAA,CAAGL,EAAK,UAAYH,EAAA,QAAQG,EAAK,GAAG,IAErFA,EAAK,oBADbC,EAAAA,YAMEK,EAAA,CAJC,IAAG,GAAKN,EAAK,GAAG,WAChB,KAAMA,EAAK,KACZ,MAAM,uBACN,MAAM,yDAERL,EAAAA,mBAA2D,OAA3DJ,EAA2DgB,EAAAA,gBAApBP,EAAK,KAAK,EAAA,CAAA,8EAKzDQ,EAAAA,YAWEN,EAAA,CAVC,MAAKN,EAAAA,eAAA,CAAA,CAAA,qCAA0CC,EAAA,oBAAoB,YAM9D,4BAA4B,CAAA,EALjC,MAAOA,EAAA,MACP,UAAW,GACX,MAAOA,EAAA,oBACP,YAAa,GACb,KAAMA,EAAA,KAEP,iBAAe,OACf,KAAK,WACL,UAAU"}

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

@@ -1,24 +1,24 @@
-import m from "./NeonMenu.es.js";
-import { resolveComponent as r, openBlock as o, createElementBlock as s, createElementVNode as c, normalizeClass as l, Fragment as k, renderList as _, createBlock as a, withKeys as t, withModifiers as f, withCtx as y, createCommentVNode as b, toDisplayString as h, createVNode as v } from "vue";
-import $ from "../../../_virtual/_plugin-vue_export-helper.es.js";
-const w = {
+import p from "./NeonMenu.es.js";
+import { resolveComponent as s, openBlock as o, createElementBlock as r, createElementVNode as a, normalizeClass as l, Fragment as m, renderList as _, createBlock as i, withKeys as k, withCtx as b, createCommentVNode as f, toDisplayString as y, createVNode as h } from "vue";
+import v from "../../../_virtual/_plugin-vue_export-helper.es.js";
+const $ = {
   ref: "menuWrapper",
   class: "neon-menu__wrapper"
-}, C = { class: "neon-menu__item-label" };
-function z(n, M, g, I, N, B) {
-  const d = r("neon-dropdown-menu"), u = r("neon-icon"), p = r("neon-link");
-  return o(), s("nav", w, [
-    c("ul", {
+}, w = ["onClick"], z = { class: "neon-menu__item-label" };
+function C(n, M, g, I, N, B) {
+  const c = s("neon-dropdown-menu"), d = s("neon-icon"), t = s("neon-link");
+  return o(), r("nav", $, [
+    a("ul", {
       class: l([[`neon-menu--${n.color}`, `neon-menu--${n.size}`], "neon-menu no-style"]),
       role: "menubar"
     }, [
-      (o(!0), s(k, null, _(n.menu, (e) => (o(), s("li", {
+      (o(!0), r(m, null, _(n.menu, (e) => (o(), r("li", {
         key: e.key,
         ref_for: !0,
         ref: "menuItem",
         class: l([{ "neon-menu__item--disabled": e.disabled }, "neon-menu__item"])
       }, [
-        e.children ? (o(), a(d, {
+        e.children ? (o(), i(c, {
           key: `${e.key}DropdownMenu`,
           class: l({ "router-link-active": n.routeMatches(e.href) }),
           color: n.color,
@@ -29,7 +29,7 @@ function z(n, M, g, I, N, B) {
           openOnHover: !e.disabled,
           size: n.size,
           "dropdown-style": "text"
-        }, null, 8, ["class", "color", "disabled", "icon", "label", "model", "openOnHover", "size"])) : (o(), a(p, {
+        }, null, 8, ["class", "color", "disabled", "icon", "label", "model", "openOnHover", "size"])) : (o(), i(t, {
           key: `${e.key}Link`,
           class: l({ "router-link-active": n.routeMatches(e.href) }),
           href: e.href,
@@ -37,26 +37,28 @@ function z(n, M, g, I, N, B) {
           tabindex: e.disabled ? -1 : 0,
           "outline-style": "none",
           role: "menuitem",
-          onClick: (i) => !e.disabled && n.onClick(e.key),
-          onKeydown: [
-            t((i) => !e.disabled && n.onClick(e.key), ["enter"]),
-            t(f((i) => !e.disabled && n.onClick(e.key), ["prevent"]), ["space"])
-          ]
+          onKeydown: k((u) => !e.disabled && n.onClick(e.key), ["enter"])
         }, {
-          default: y(() => [
-            e.icon ? (o(), a(u, {
-              key: `${e.key}LinkIcon`,
-              name: e.icon,
-              class: "neon-menu__item-icon",
-              color: "neutral"
-            }, null, 8, ["name"])) : b("", !0),
-            c("span", C, h(e.label), 1)
+          default: b(() => [
+            a("div", {
+              class: "neon-menu__link-container",
+              tabindex: "-1",
+              onClick: (u) => !e.disabled && n.onClick(e.key)
+            }, [
+              e.icon ? (o(), i(d, {
+                key: `${e.key}LinkIcon`,
+                name: e.icon,
+                class: "neon-menu__item-icon",
+                color: "neutral"
+              }, null, 8, ["name"])) : f("", !0),
+              a("span", z, y(e.label), 1)
+            ], 8, w)
           ]),
           _: 2
-        }, 1032, ["class", "href", "tabindex", "onClick", "onKeydown"]))
+        }, 1032, ["class", "href", "tabindex", "onKeydown"]))
       ], 2))), 128))
     ], 2),
-    v(d, {
+    h(c, {
       class: l([{ "neon-menu__responsive-menu--hidden": n.responsiveMenuItems.length === 0 }, "neon-menu__responsive-menu"]),
       color: n.color,
       indicator: !1,
@@ -69,7 +71,7 @@ function z(n, M, g, I, N, B) {
     }, null, 8, ["class", "color", "model", "size"])
   ], 512);
 }
-const O = /* @__PURE__ */ $(m, [["render", z]]);
+const O = /* @__PURE__ */ v(p, [["render", C]]);
 export {
   O as default
 };

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

@@ -1 +1 @@
-{"version":3,"file":"NeonMenu.vue.es.js","sources":["../../../../src/components/navigation/menu/NeonMenu.vue"],"sourcesContent":["<template>\n  <nav ref=\"menuWrapper\" class=\"neon-menu__wrapper\">\n    <ul :class=\"[`neon-menu--${color}`, `neon-menu--${size}`]\" class=\"neon-menu no-style\" role=\"menubar\">\n      <li\n        v-for=\"item in menu\"\n        :key=\"item.key\"\n        ref=\"menuItem\"\n        :class=\"{ 'neon-menu__item--disabled': item.disabled }\"\n        class=\"neon-menu__item\"\n      >\n        <neon-dropdown-menu\n          v-if=\"item.children\"\n          :key=\"`${item.key}DropdownMenu`\"\n          :class=\"{ 'router-link-active': routeMatches(item.href) }\"\n          :color=\"color\"\n          :disabled=\"item.disabled\"\n          :icon=\"item.icon\"\n          :label=\"item.label\"\n          :model=\"item.children\"\n          :openOnHover=\"!item.disabled\"\n          :size=\"size\"\n          dropdown-style=\"text\"\n        />\n        <neon-link\n          v-else\n          :key=\"`${item.key}Link`\"\n          :class=\"{ 'router-link-active': routeMatches(item.href) }\"\n          :href=\"item.href\"\n          :no-style=\"true\"\n          :tabindex=\"item.disabled ? -1 : 0\"\n          outline-style=\"none\"\n          role=\"menuitem\"\n          @click=\"!item.disabled && onClick(item.key)\"\n          @keydown.enter=\"!item.disabled && onClick(item.key)\"\n          @keydown.space.prevent=\"!item.disabled && onClick(item.key)\"\n        >\n          <neon-icon\n            v-if=\"item.icon\"\n            :key=\"`${item.key}LinkIcon`\"\n            :name=\"item.icon\"\n            class=\"neon-menu__item-icon\"\n            color=\"neutral\"\n          />\n          <span class=\"neon-menu__item-label\">{{ item.label }}</span>\n        </neon-link>\n      </li>\n    </ul>\n    <neon-dropdown-menu\n      :class=\"{ 'neon-menu__responsive-menu--hidden': responsiveMenuItems.length === 0 }\"\n      :color=\"color\"\n      :indicator=\"false\"\n      :model=\"responsiveMenuItems\"\n      :openOnHover=\"true\"\n      :size=\"size\"\n      class=\"neon-menu__responsive-menu\"\n      dropdown-style=\"text\"\n      icon=\"ellipsis\"\n      placement=\"bottom-right\"\n    />\n  </nav>\n</template>\n\n<script lang=\"ts\" src=\"./NeonMenu.ts\" />\n"],"names":["_hoisted_2","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeClass","_ctx","_Fragment","_renderList","item","_createBlock","_component_neon_dropdown_menu","_component_neon_link","$event","_withKeys","_withModifiers","_component_neon_icon","_toDisplayString","_createVNode"],"mappings":";;;;EACO,KAAI;AAAA,EAAc,OAAM;GA0CfA,IAAA,EAAA,OAAM,wBAAuB;;;AA1C3C,SAAAC,EAAA,GAAAC,EA0DM,OA1DNC,GA0DM;AAAA,IAzDJC,EA4CK,MAAA;AAAA,MA5CA,OAAKC,EAAA,CAAA,CAAA,cAAiBC,EAAA,KAAK,IAAA,cAAkBA,EAAA,IAAI,KAAW,oBAAoB,CAAA;AAAA,MAAC,MAAK;AAAA;cACzFJ,EA0CKK,GAAA,MAAAC,EAzCYF,EAAA,MAAI,CAAZG,YADTP,EA0CK,MAAA;AAAA,QAxCF,KAAKO,EAAK;AAAA;QACX,KAAI;AAAA,QACH,OAAKJ,EAAA,CAAA,EAAA,6BAAiCI,EAAK,SAAQ,GAC9C,iBAAiB,CAAA;AAAA;QAGfA,EAAK,iBADbC,EAYEC,GAAA;AAAA,UAVC,KAAG,GAAKF,EAAK,GAAG;AAAA,UAChB,OAAKJ,EAAA,EAAA,sBAA0BC,EAAA,aAAaG,EAAK,IAAI,GAAA;AAAA,UACrD,OAAOH,EAAA;AAAA,UACP,UAAUG,EAAK;AAAA,UACf,MAAMA,EAAK;AAAA,UACX,OAAOA,EAAK;AAAA,UACZ,OAAOA,EAAK;AAAA,UACZ,aAAW,CAAGA,EAAK;AAAA,UACnB,MAAMH,EAAA;AAAA,UACP,kBAAe;AAAA,8GAEjBI,EAqBYE,GAAA;AAAA,UAnBT,KAAG,GAAKH,EAAK,GAAG;AAAA,UAChB,OAAKJ,EAAA,EAAA,sBAA0BC,EAAA,aAAaG,EAAK,IAAI,GAAA;AAAA,UACrD,MAAMA,EAAK;AAAA,UACX,YAAU;AAAA,UACV,UAAUA,EAAK,WAAQ,KAAA;AAAA,UACxB,iBAAc;AAAA,UACd,MAAK;AAAA,UACJ,SAAK,CAAAI,MAAA,CAAGJ,EAAK,YAAYH,EAAA,QAAQG,EAAK,GAAG;AAAA,UACzC,WAAO;AAAA,YAASK,EAAA,CAAAD,MAAA,CAAAJ,EAAK,YAAYH,UAAQG,EAAK,GAAG,GAAA,CAAA,OAAA,CAAA;AAAA,YACzBK,EAAAC,EAAA,CAAAF,MAAA,CAAAJ,EAAK,YAAYH,UAAQG,EAAK,GAAG,GAAA,CAAA,SAAA,CAAA,GAAA,CAAA,OAAA,CAAA;AAAA;;qBAE1D,MAME;AAAA,YALMA,EAAK,aADbC,EAMEM,GAAA;AAAA,cAJC,KAAG,GAAKP,EAAK,GAAG;AAAA,cAChB,MAAMA,EAAK;AAAA,cACZ,OAAM;AAAA,cACN,OAAM;AAAA;YAERL,EAA2D,QAA3DJ,GAA2DiB,EAApBR,EAAK,KAAK,GAAA,CAAA;AAAA;;;;;IAIvDS,EAWEP,GAAA;AAAA,MAVC,OAAKN,EAAA,CAAA,EAAA,sCAA0CC,EAAA,oBAAoB,gBAM9D,4BAA4B,CAAA;AAAA,MALjC,OAAOA,EAAA;AAAA,MACP,WAAW;AAAA,MACX,OAAOA,EAAA;AAAA,MACP,aAAa;AAAA,MACb,MAAMA,EAAA;AAAA,MAEP,kBAAe;AAAA,MACf,MAAK;AAAA,MACL,WAAU;AAAA;;;;"}
+{"version":3,"file":"NeonMenu.vue.es.js","sources":["../../../../src/components/navigation/menu/NeonMenu.vue"],"sourcesContent":["<template>\n  <nav ref=\"menuWrapper\" class=\"neon-menu__wrapper\">\n    <ul :class=\"[`neon-menu--${color}`, `neon-menu--${size}`]\" class=\"neon-menu no-style\" role=\"menubar\">\n      <li\n        v-for=\"item in menu\"\n        :key=\"item.key\"\n        ref=\"menuItem\"\n        :class=\"{ 'neon-menu__item--disabled': item.disabled }\"\n        class=\"neon-menu__item\"\n      >\n        <neon-dropdown-menu\n          v-if=\"item.children\"\n          :key=\"`${item.key}DropdownMenu`\"\n          :class=\"{ 'router-link-active': routeMatches(item.href) }\"\n          :color=\"color\"\n          :disabled=\"item.disabled\"\n          :icon=\"item.icon\"\n          :label=\"item.label\"\n          :model=\"item.children\"\n          :openOnHover=\"!item.disabled\"\n          :size=\"size\"\n          dropdown-style=\"text\"\n        />\n        <neon-link\n          v-else\n          :key=\"`${item.key}Link`\"\n          :class=\"{ 'router-link-active': routeMatches(item.href) }\"\n          :href=\"item.href\"\n          :no-style=\"true\"\n          :tabindex=\"item.disabled ? -1 : 0\"\n          outline-style=\"none\"\n          role=\"menuitem\"\n          @keydown.enter=\"!item.disabled && onClick(item.key)\"\n        >\n          <div class=\"neon-menu__link-container\" tabindex=\"-1\" @click=\"!item.disabled && onClick(item.key)\">\n            <neon-icon\n              v-if=\"item.icon\"\n              :key=\"`${item.key}LinkIcon`\"\n              :name=\"item.icon\"\n              class=\"neon-menu__item-icon\"\n              color=\"neutral\"\n            />\n            <span class=\"neon-menu__item-label\">{{ item.label }}</span>\n          </div>\n        </neon-link>\n      </li>\n    </ul>\n    <neon-dropdown-menu\n      :class=\"{ 'neon-menu__responsive-menu--hidden': responsiveMenuItems.length === 0 }\"\n      :color=\"color\"\n      :indicator=\"false\"\n      :model=\"responsiveMenuItems\"\n      :openOnHover=\"true\"\n      :size=\"size\"\n      class=\"neon-menu__responsive-menu\"\n      dropdown-style=\"text\"\n      icon=\"ellipsis\"\n      placement=\"bottom-right\"\n    />\n  </nav>\n</template>\n\n<script lang=\"ts\" src=\"./NeonMenu.ts\" />\n"],"names":["_hoisted_3","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeClass","_ctx","_Fragment","_renderList","item","_createBlock","_component_neon_dropdown_menu","_component_neon_link","_withKeys","$event","_component_neon_icon","_toDisplayString","_createVNode"],"mappings":";;;;EACO,KAAI;AAAA,EAAc,OAAM;oBAyCbA,IAAA,EAAA,OAAM,wBAAuB;;;AAzC7C,SAAAC,EAAA,GAAAC,EA0DM,OA1DNC,GA0DM;AAAA,IAzDJC,EA4CK,MAAA;AAAA,MA5CA,OAAKC,EAAA,CAAA,CAAA,cAAiBC,EAAA,KAAK,IAAA,cAAkBA,EAAA,IAAI,KAAW,oBAAoB,CAAA;AAAA,MAAC,MAAK;AAAA;cACzFJ,EA0CKK,GAAA,MAAAC,EAzCYF,EAAA,MAAI,CAAZG,YADTP,EA0CK,MAAA;AAAA,QAxCF,KAAKO,EAAK;AAAA;QACX,KAAI;AAAA,QACH,OAAKJ,EAAA,CAAA,EAAA,6BAAiCI,EAAK,SAAQ,GAC9C,iBAAiB,CAAA;AAAA;QAGfA,EAAK,iBADbC,EAYEC,GAAA;AAAA,UAVC,KAAG,GAAKF,EAAK,GAAG;AAAA,UAChB,OAAKJ,EAAA,EAAA,sBAA0BC,EAAA,aAAaG,EAAK,IAAI,GAAA;AAAA,UACrD,OAAOH,EAAA;AAAA,UACP,UAAUG,EAAK;AAAA,UACf,MAAMA,EAAK;AAAA,UACX,OAAOA,EAAK;AAAA,UACZ,OAAOA,EAAK;AAAA,UACZ,aAAW,CAAGA,EAAK;AAAA,UACnB,MAAMH,EAAA;AAAA,UACP,kBAAe;AAAA,8GAEjBI,EAqBYE,GAAA;AAAA,UAnBT,KAAG,GAAKH,EAAK,GAAG;AAAA,UAChB,OAAKJ,EAAA,EAAA,sBAA0BC,EAAA,aAAaG,EAAK,IAAI,GAAA;AAAA,UACrD,MAAMA,EAAK;AAAA,UACX,YAAU;AAAA,UACV,UAAUA,EAAK,WAAQ,KAAA;AAAA,UACxB,iBAAc;AAAA,UACd,MAAK;AAAA,UACJ,WAAOI,EAAA,CAAAC,MAAA,CAASL,EAAK,YAAYH,EAAA,QAAQG,EAAK,GAAG,GAAA,CAAA,OAAA,CAAA;AAAA;qBAElD,MASM;AAAA,YATNL,EASM,OAAA;AAAA,cATD,OAAM;AAAA,cAA4B,UAAS;AAAA,cAAM,SAAK,CAAAU,MAAA,CAAGL,EAAK,YAAYH,EAAA,QAAQG,EAAK,GAAG;AAAA;cAErFA,EAAK,aADbC,EAMEK,GAAA;AAAA,gBAJC,KAAG,GAAKN,EAAK,GAAG;AAAA,gBAChB,MAAMA,EAAK;AAAA,gBACZ,OAAM;AAAA,gBACN,OAAM;AAAA;cAERL,EAA2D,QAA3DJ,GAA2DgB,EAApBP,EAAK,KAAK,GAAA,CAAA;AAAA;;;;;;IAKzDQ,EAWEN,GAAA;AAAA,MAVC,OAAKN,EAAA,CAAA,EAAA,sCAA0CC,EAAA,oBAAoB,gBAM9D,4BAA4B,CAAA;AAAA,MALjC,OAAOA,EAAA;AAAA,MACP,WAAW;AAAA,MACX,OAAOA,EAAA;AAAA,MACP,aAAa;AAAA,MACb,MAAMA,EAAA;AAAA,MAEP,kBAAe;AAAA,MACf,MAAK;AAAA,MACL,WAAU;AAAA;;;;"}

package/dist/components/user-input/button/NeonButton.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const e=require("vue"),f=require("../../../common/enums/NeonButtonSize.cjs.js"),y=require("../../../common/enums/NeonFunctionalColor.cjs.js"),o=require("../../../common/enums/NeonButtonStyle.cjs.js"),S=require("../../../common/enums/NeonHorizontalPosition.cjs.js"),N=require("../../presentation/icon/NeonIcon.vue.cjs.js"),B=require("../../navigation/link/NeonLink.vue.cjs.js"),g=require("../../presentation/expansion-indicator/NeonExpansionIndicator.vue.cjs.js"),l=require("../../../common/enums/NeonState.cjs.js"),m=e.defineComponent({name:"NeonButton",components:{NeonExpansionIndicator:g,NeonIcon:N,NeonLink:B},props:{href:{type:String,default:null},label:{type:String,default:null},size:{type:String,default:f.NeonButtonSize.Medium},color:{type:String,default:y.NeonFunctionalColor.Primary},inverse:{type:Boolean,default:!1},alternateColor:{type:String,default:null},icon:{type:String,default:null},iconAriaLabel:{type:String},iconPosition:{type:String,default:S.NeonHorizontalPosition.Left},buttonStyle:{type:String,default:o.NeonButtonStyle.Solid},state:{type:String,default:l.NeonState.Ready},disabled:{type:Boolean,default:!1},transparent:{type:Boolean,default:!1},outline:{type:Boolean,default:!0},circular:{type:Boolean,default:null},fullWidth:{type:Boolean,default:null},indicator:{type:Boolean,default:!1},indicatorExpanded:{type:Boolean,default:null}},emits:["click"],setup(t,{emit:a}){const u=e.useAttrs(),i=e.ref(null),c=e.computed(()=>{switch(t.state){case l.NeonState.Loading:return"loading";case l.NeonState.Success:return"check";case l.NeonState.Error:return"times";default:return t.icon}}),r=e.computed(()=>[`neon-button--${t.size}`,!t.inverse&&`neon-button--${t.color}`,`neon-button--${t.buttonStyle}`,`neon-button--state-${t.state}`,{"neon-button--text-transparent":t.transparent&&t.buttonStyle===o.NeonButtonStyle.Text,"neon-button--disabled":t.disabled,"neon-button--inverse":t.inverse,"neon-button--circular":t.circular,"neon-button--no-outline":!t.outline,"neon-button--full-width":t.fullWidth,"neon-button--with-icon neon-button--icon-only":t.buttonStyle!==o.NeonButtonStyle.Input&&!t.label&&t.icon&&!t.indicator,"neon-button--with-icon neon-button--icon-left":t.label&&t.icon&&t.iconPosition==="left","neon-button--with-icon neon-button--icon-right":(t.label||t.buttonStyle===o.NeonButtonStyle.Input)&&t.icon&&t.iconPosition==="right",[`neon-button--alternate-color-${t.alternateColor}`]:t.alternateColor}]),d=()=>{var n;return(n=i.value)==null?void 0:n.click()},s=e.computed(()=>{const{onClick:n,...b}=u;return b});return{iconName:c,classes:r,button:i,attrs:u,sanitizedAttributes:s,clickLink:d,clickButton:()=>{var n;t.disabled||a("click"),(n=i.value)==null||n.blur()}}}});module.exports=m;
+"use strict";const e=require("vue"),y=require("../../../common/enums/NeonButtonSize.cjs.js"),f=require("../../../common/enums/NeonFunctionalColor.cjs.js"),o=require("../../../common/enums/NeonButtonStyle.cjs.js"),S=require("../../../common/enums/NeonHorizontalPosition.cjs.js"),N=require("../../presentation/icon/NeonIcon.vue.cjs.js"),B=require("../../navigation/link/NeonLink.vue.cjs.js"),g=require("../../presentation/expansion-indicator/NeonExpansionIndicator.vue.cjs.js"),l=require("../../../common/enums/NeonState.cjs.js"),m=require("../../../common/enums/NeonButtonType.cjs.js"),h=e.defineComponent({name:"NeonButton",components:{NeonExpansionIndicator:g,NeonIcon:N,NeonLink:B},props:{href:{type:String,default:null},label:{type:String,default:null},size:{type:String,default:y.NeonButtonSize.Medium},color:{type:String,default:f.NeonFunctionalColor.Primary},inverse:{type:Boolean,default:!1},alternateColor:{type:String,default:null},icon:{type:String,default:null},iconAriaLabel:{type:String},iconPosition:{type:String,default:S.NeonHorizontalPosition.Left},buttonStyle:{type:String,default:o.NeonButtonStyle.Solid},buttonType:{type:String,default:m.NeonButtonType.Button},state:{type:String,default:l.NeonState.Ready},disabled:{type:Boolean,default:!1},transparent:{type:Boolean,default:!1},outline:{type:Boolean,default:!0},circular:{type:Boolean,default:null},fullWidth:{type:Boolean,default:null},indicator:{type:Boolean,default:!1},indicatorExpanded:{type:Boolean,default:null}},emits:["click"],setup(t,{emit:a}){const u=e.useAttrs(),i=e.ref(null),c=e.computed(()=>{switch(t.state){case l.NeonState.Loading:return"loading";case l.NeonState.Success:return"check";case l.NeonState.Error:return"times";default:return t.icon}}),r=e.computed(()=>[`neon-button--${t.size}`,!t.inverse&&`neon-button--${t.color}`,`neon-button--${t.buttonStyle}`,`neon-button--state-${t.state}`,{"neon-button--text-transparent":t.transparent&&t.buttonStyle===o.NeonButtonStyle.Text,"neon-button--disabled":t.disabled,"neon-button--inverse":t.inverse,"neon-button--circular":t.circular,"neon-button--no-outline":!t.outline,"neon-button--full-width":t.fullWidth,"neon-button--with-icon neon-button--icon-only":t.buttonStyle!==o.NeonButtonStyle.Input&&!t.label&&t.icon&&!t.indicator,"neon-button--with-icon neon-button--icon-left":t.label&&t.icon&&t.iconPosition==="left","neon-button--with-icon neon-button--icon-right":(t.label||t.buttonStyle===o.NeonButtonStyle.Input)&&t.icon&&t.iconPosition==="right",[`neon-button--alternate-color-${t.alternateColor}`]:t.alternateColor}]),d=()=>{var n;return(n=i.value)==null?void 0:n.click()},s=e.computed(()=>{const{onClick:n,...b}=u;return b});return{iconName:c,classes:r,button:i,attrs:u,sanitizedAttributes:s,clickLink:d,clickButton:()=>{var n;t.disabled||a("click"),(n=i.value)==null||n.blur()}}}});module.exports=h;
 //# sourceMappingURL=NeonButton.cjs.js.map

package/dist/components/user-input/button/NeonButton.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonButton.cjs.js","sources":["../../../../src/components/user-input/button/NeonButton.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent, ref, useAttrs } from 'vue';\nimport { NeonButtonSize } from '@/common/enums/NeonButtonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport { NeonButtonStyle } from '@/common/enums/NeonButtonStyle';\nimport { NeonHorizontalPosition } from '@/common/enums/NeonHorizontalPosition';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\nimport NeonExpansionIndicator from '@/components/presentation/expansion-indicator/NeonExpansionIndicator.vue';\nimport { NeonState } from '@/common/enums/NeonState';\n\n/**\n * A button component. Renders an HTML button or, if an href is provided, renders using NeonLink in the style of a button. NeonButton supports all events and attributes of HTML buttons, e.g, @click.\n */\nexport default defineComponent({\n  name: 'NeonButton',\n  components: {\n    NeonExpansionIndicator,\n    NeonIcon,\n    NeonLink,\n  },\n  props: {\n    /**\n     * Optional href for rendering a button as a link\n     */\n    href: { type: String, default: null },\n    /**\n     * The text to display on a button\n     */\n    label: { type: String, default: null },\n    /**\n     * The button size\n     */\n    size: { type: String as () => NeonButtonSize, default: NeonButtonSize.Medium },\n    /**\n     * The button color\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Primary },\n    /**\n     * Display the button as high-contrast with inverted colors. This is useful for placing a button on a colored background.\n     * NOTE: Supports Solid & Outline button styles only (gradient & text buttons are not supported)\n     */\n    inverse: { type: Boolean, default: false },\n    /**\n     * Solid buttons ONLY. Alternate color for creating a gradient buttons. NOTE: can also be the same color as 'color'.\n     */\n    alternateColor: { type: String as () => NeonFunctionalColor, default: null },\n    /**\n     * Optional icon to display\n     */\n    icon: { type: String, default: null },\n    /**\n     * The aria label of the icon button\n     */\n    iconAriaLabel: { type: String },\n    /**\n     * Position of the icon if combined with text\n     */\n    iconPosition: { type: String as () => NeonHorizontalPosition, default: NeonHorizontalPosition.Left },\n    /**\n     * The style of button\n     */\n    buttonStyle: { type: String as () => NeonButtonStyle, default: NeonButtonStyle.Solid },\n    /**\n     * Provide button states of <em>ready, loading, success or error</em> which change the display of the button (with icons) to reflect the state.\n     */\n    state: { type: String as () => NeonState, default: NeonState.Ready },\n    /**\n     * Whether the button is disabled\n     */\n    disabled: { type: Boolean, default: false },\n    /**\n     * For text buttons, do not display the background. This is useful for icon buttons in headers.\n     */\n    transparent: { type: Boolean, default: false },\n    /**\n     * Whether to display a button outline when the button has focus\n     */\n    outline: { type: Boolean, default: true },\n    /**\n     * Make the button circular. NOTE: This is only for icon only buttons.\n     */\n    circular: { type: Boolean, default: null },\n    /**\n     * Make a button extend to the full width of the parent container.\n     */\n    fullWidth: { type: Boolean, default: null },\n    /**\n     * INTERNAL USE ONLY: display a NeonExpansionIndicator on the button (used for dropdown buttons)\n     * @ignore\n     */\n    indicator: { type: Boolean, default: false },\n    /**\n     * INTERNAL USE ONLY: display the NeonExpansionIndicator on the button as <em>open</em> or <em>closed</em>.\n     * @ignore\n     */\n    indicatorExpanded: { type: Boolean, default: null },\n  },\n  emits: [\n    /**\n     * Emitted when the user clicks on the button or link.\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n\n    const button = ref<HTMLElement | null>(null);\n\n    const iconName = computed(() => {\n      switch (props.state) {\n        case NeonState.Loading:\n          return 'loading';\n        case NeonState.Success:\n          return 'check';\n        case NeonState.Error:\n          return 'times';\n        default:\n          return props.icon;\n      }\n    });\n\n    const classes = computed(() => {\n      return [\n        `neon-button--${props.size}`,\n        !props.inverse && `neon-button--${props.color}`,\n        `neon-button--${props.buttonStyle}`,\n        `neon-button--state-${props.state}`,\n        {\n          'neon-button--text-transparent': props.transparent && props.buttonStyle === NeonButtonStyle.Text,\n          'neon-button--disabled': props.disabled,\n          'neon-button--inverse': props.inverse,\n          'neon-button--circular': props.circular,\n          'neon-button--no-outline': !props.outline,\n          'neon-button--full-width': props.fullWidth,\n          'neon-button--with-icon neon-button--icon-only':\n            props.buttonStyle !== NeonButtonStyle.Input && !props.label && props.icon && !props.indicator,\n          'neon-button--with-icon neon-button--icon-left': props.label && props.icon && props.iconPosition === 'left',\n          'neon-button--with-icon neon-button--icon-right':\n            (props.label || props.buttonStyle === NeonButtonStyle.Input) &&\n            props.icon &&\n            props.iconPosition === 'right',\n          [`neon-button--alternate-color-${props.alternateColor}`]: props.alternateColor,\n        },\n      ];\n    });\n\n    const clickLink = () => button.value?.click();\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 clickButton = () => {\n      if (!props.disabled) {\n        emit('click');\n      }\n      button.value?.blur();\n    };\n\n    return {\n      iconName,\n      classes,\n      button,\n      attrs,\n      sanitizedAttributes,\n      clickLink,\n      clickButton,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonExpansionIndicator","NeonIcon","NeonLink","NeonButtonSize","NeonFunctionalColor","NeonHorizontalPosition","NeonButtonStyle","NeonState","props","emit","attrs","useAttrs","button","ref","iconName","computed","classes","clickLink","_a","sanitizedAttributes","onClick","sanitized"],"mappings":"ghBAaAA,EAAeC,kBAAgB,CAC7B,KAAM,aACN,WAAY,CACV,uBAAAC,EACA,SAAAC,EACA,SAAAC,CAAA,EAEF,MAAO,CAIL,KAAM,CAAE,KAAM,OAAQ,QAAS,IAAA,EAI/B,MAAO,CAAE,KAAM,OAAQ,QAAS,IAAA,EAIhC,KAAM,CAAE,KAAM,OAAgC,QAASC,EAAAA,eAAe,MAAA,EAItE,MAAO,CAAE,KAAM,OAAqC,QAASC,EAAAA,oBAAoB,OAAA,EAKjF,QAAS,CAAE,KAAM,QAAS,QAAS,EAAA,EAInC,eAAgB,CAAE,KAAM,OAAqC,QAAS,IAAA,EAItE,KAAM,CAAE,KAAM,OAAQ,QAAS,IAAA,EAI/B,cAAe,CAAE,KAAM,MAAA,EAIvB,aAAc,CAAE,KAAM,OAAwC,QAASC,EAAAA,uBAAuB,IAAA,EAI9F,YAAa,CAAE,KAAM,OAAiC,QAASC,EAAAA,gBAAgB,KAAA,EAI/E,MAAO,CAAE,KAAM,OAA2B,QAASC,EAAAA,UAAU,KAAA,EAI7D,SAAU,CAAE,KAAM,QAAS,QAAS,EAAA,EAIpC,YAAa,CAAE,KAAM,QAAS,QAAS,EAAA,EAIvC,QAAS,CAAE,KAAM,QAAS,QAAS,EAAA,EAInC,SAAU,CAAE,KAAM,QAAS,QAAS,IAAA,EAIpC,UAAW,CAAE,KAAM,QAAS,QAAS,IAAA,EAKrC,UAAW,CAAE,KAAM,QAAS,QAAS,EAAA,EAKrC,kBAAmB,CAAE,KAAM,QAAS,QAAS,IAAA,CAAK,EAEpD,MAAO,CAIL,OAAA,EAEF,MAAMC,EAAO,CAAE,KAAAC,GAAQ,CACrB,MAAMC,EAAQC,EAAAA,SAAA,EAERC,EAASC,EAAAA,IAAwB,IAAI,EAErCC,EAAWC,EAAAA,SAAS,IAAM,CAC9B,OAAQP,EAAM,MAAA,CACZ,KAAKD,EAAAA,UAAU,QACb,MAAO,UACT,KAAKA,EAAAA,UAAU,QACb,MAAO,QACT,KAAKA,EAAAA,UAAU,MACb,MAAO,QACT,QACE,OAAOC,EAAM,IAAA,CAEnB,CAAC,EAEKQ,EAAUD,EAAAA,SAAS,IAChB,CACL,gBAAgBP,EAAM,IAAI,GAC1B,CAACA,EAAM,SAAW,gBAAgBA,EAAM,KAAK,GAC7C,gBAAgBA,EAAM,WAAW,GACjC,sBAAsBA,EAAM,KAAK,GACjC,CACE,gCAAiCA,EAAM,aAAeA,EAAM,cAAgBF,EAAAA,gBAAgB,KAC5F,wBAAyBE,EAAM,SAC/B,uBAAwBA,EAAM,QAC9B,wBAAyBA,EAAM,SAC/B,0BAA2B,CAACA,EAAM,QAClC,0BAA2BA,EAAM,UACjC,gDACEA,EAAM,cAAgBF,EAAAA,gBAAgB,OAAS,CAACE,EAAM,OAASA,EAAM,MAAQ,CAACA,EAAM,UACtF,gDAAiDA,EAAM,OAASA,EAAM,MAAQA,EAAM,eAAiB,OACrG,kDACGA,EAAM,OAASA,EAAM,cAAgBF,kBAAgB,QACtDE,EAAM,MACNA,EAAM,eAAiB,QACzB,CAAC,gCAAgCA,EAAM,cAAc,EAAE,EAAGA,EAAM,cAAA,CAClE,CAEH,EAEKS,EAAY,IAAA,OAAM,OAAAC,EAAAN,EAAO,QAAP,YAAAM,EAAc,SAEhCC,EAAsBJ,EAAAA,SAAS,IAAM,CAEzC,KAAM,CAAE,QAAAK,EAAS,GAAGC,CAAA,EAAcX,EAClC,OAAOW,CACT,CAAC,EASD,MAAO,CACL,SAAAP,EACA,QAAAE,EACA,OAAAJ,EACA,MAAAF,EACA,oBAAAS,EACA,UAAAF,EACA,YAdkB,IAAM,OACnBT,EAAM,UACTC,EAAK,OAAO,GAEdS,EAAAN,EAAO,QAAP,MAAAM,EAAc,MAChB,CASE,CAEJ,CACF,CAAC"}
+{"version":3,"file":"NeonButton.cjs.js","sources":["../../../../src/components/user-input/button/NeonButton.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent, ref, useAttrs } from 'vue';\nimport { NeonButtonSize } from '@/common/enums/NeonButtonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport { NeonButtonStyle } from '@/common/enums/NeonButtonStyle';\nimport { NeonHorizontalPosition } from '@/common/enums/NeonHorizontalPosition';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport NeonLink from '@/components/navigation/link/NeonLink.vue';\nimport NeonExpansionIndicator from '@/components/presentation/expansion-indicator/NeonExpansionIndicator.vue';\nimport { NeonState } from '@/common/enums/NeonState';\nimport { NeonButtonType } from '@/common/enums/NeonButtonType';\n\n/**\n * A button component. Renders an HTML button or, if an href is provided, renders using NeonLink in the style of a\n * button. NeonButton supports all events and attributes of HTML buttons, e.g, @click.\n */\nexport default defineComponent({\n  name: 'NeonButton',\n  components: {\n    NeonExpansionIndicator,\n    NeonIcon,\n    NeonLink,\n  },\n  props: {\n    /**\n     * Optional href for rendering a button as a link\n     */\n    href: { type: String, default: null },\n    /**\n     * The text to display on a button\n     */\n    label: { type: String, default: null },\n    /**\n     * The button size\n     */\n    size: { type: String as () => NeonButtonSize, default: NeonButtonSize.Medium },\n    /**\n     * The button color\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Primary },\n    /**\n     * Display the button as high-contrast with inverted colors. This is useful for placing a button on a colored background.\n     * NOTE: Supports Solid & Outline button styles only (gradient & text buttons are not supported)\n     */\n    inverse: { type: Boolean, default: false },\n    /**\n     * Solid buttons ONLY. Alternate color for creating a gradient buttons. NOTE: can also be the same color as 'color'.\n     */\n    alternateColor: { type: String as () => NeonFunctionalColor, default: null },\n    /**\n     * Optional icon to display\n     */\n    icon: { type: String, default: null },\n    /**\n     * The aria label of the icon button\n     */\n    iconAriaLabel: { type: String },\n    /**\n     * Position of the icon if combined with text\n     */\n    iconPosition: { type: String as () => NeonHorizontalPosition, default: NeonHorizontalPosition.Left },\n    /**\n     * The style of button\n     */\n    buttonStyle: { type: String as () => NeonButtonStyle, default: NeonButtonStyle.Solid },\n    /**\n     * The type of button, see <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button\">button</a>.\n     */\n    buttonType: { type: String as () => NeonButtonType, default: NeonButtonType.Button },\n    /**\n     * Provide button states of <em>ready, loading, success or error</em> which change the display of the button (with\n     * icons) to reflect the state.\n     */\n    state: { type: String as () => NeonState, default: NeonState.Ready },\n    /**\n     * Whether the button is disabled\n     */\n    disabled: { type: Boolean, default: false },\n    /**\n     * For text buttons, do not display the background. This is useful for icon buttons in headers.\n     */\n    transparent: { type: Boolean, default: false },\n    /**\n     * Whether to display a button outline when the button has focus\n     */\n    outline: { type: Boolean, default: true },\n    /**\n     * Make the button circular. NOTE: This is only for icon only buttons.\n     */\n    circular: { type: Boolean, default: null },\n    /**\n     * Make a button extend to the full width of the parent container.\n     */\n    fullWidth: { type: Boolean, default: null },\n    /**\n     * INTERNAL USE ONLY: display a NeonExpansionIndicator on the button (used for dropdown buttons)\n     * @ignore\n     */\n    indicator: { type: Boolean, default: false },\n    /**\n     * INTERNAL USE ONLY: display the NeonExpansionIndicator on the button as <em>open</em> or <em>closed</em>.\n     * @ignore\n     */\n    indicatorExpanded: { type: Boolean, default: null },\n  },\n  emits: [\n    /**\n     * Emitted when the user clicks on the button or link.\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n\n    const button = ref<HTMLElement | null>(null);\n\n    const iconName = computed(() => {\n      switch (props.state) {\n        case NeonState.Loading:\n          return 'loading';\n        case NeonState.Success:\n          return 'check';\n        case NeonState.Error:\n          return 'times';\n        default:\n          return props.icon;\n      }\n    });\n\n    const classes = computed(() => {\n      return [\n        `neon-button--${props.size}`,\n        !props.inverse && `neon-button--${props.color}`,\n        `neon-button--${props.buttonStyle}`,\n        `neon-button--state-${props.state}`,\n        {\n          'neon-button--text-transparent': props.transparent && props.buttonStyle === NeonButtonStyle.Text,\n          'neon-button--disabled': props.disabled,\n          'neon-button--inverse': props.inverse,\n          'neon-button--circular': props.circular,\n          'neon-button--no-outline': !props.outline,\n          'neon-button--full-width': props.fullWidth,\n          'neon-button--with-icon neon-button--icon-only':\n            props.buttonStyle !== NeonButtonStyle.Input && !props.label && props.icon && !props.indicator,\n          'neon-button--with-icon neon-button--icon-left': props.label && props.icon && props.iconPosition === 'left',\n          'neon-button--with-icon neon-button--icon-right':\n            (props.label || props.buttonStyle === NeonButtonStyle.Input) &&\n            props.icon &&\n            props.iconPosition === 'right',\n          [`neon-button--alternate-color-${props.alternateColor}`]: props.alternateColor,\n        },\n      ];\n    });\n\n    const clickLink = () => button.value?.click();\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 clickButton = () => {\n      if (!props.disabled) {\n        emit('click');\n      }\n      button.value?.blur();\n    };\n\n    return {\n      iconName,\n      classes,\n      button,\n      attrs,\n      sanitizedAttributes,\n      clickLink,\n      clickButton,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonExpansionIndicator","NeonIcon","NeonLink","NeonButtonSize","NeonFunctionalColor","NeonHorizontalPosition","NeonButtonStyle","NeonButtonType","NeonState","props","emit","attrs","useAttrs","button","ref","iconName","computed","classes","clickLink","_a","sanitizedAttributes","onClick","sanitized"],"mappings":"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"}

package/dist/components/user-input/button/NeonButton.es.js

@@ -1,18 +1,19 @@
-import { defineComponent as s, useAttrs as m, ref as y, computed as i } from "vue";
+import { defineComponent as m, useAttrs as s, ref as y, computed as i } from "vue";
 import { NeonButtonSize as S } from "../../../common/enums/NeonButtonSize.es.js";
 import { NeonFunctionalColor as g } from "../../../common/enums/NeonFunctionalColor.es.js";
 import { NeonButtonStyle as e } from "../../../common/enums/NeonButtonStyle.es.js";
 import { NeonHorizontalPosition as B } from "../../../common/enums/NeonHorizontalPosition.es.js";
 import h from "../../presentation/icon/NeonIcon.vue.es.js";
-import k from "../../navigation/link/NeonLink.vue.es.js";
-import N from "../../presentation/expansion-indicator/NeonExpansionIndicator.vue.es.js";
+import N from "../../navigation/link/NeonLink.vue.es.js";
+import k from "../../presentation/expansion-indicator/NeonExpansionIndicator.vue.es.js";
 import { NeonState as o } from "../../../common/enums/NeonState.es.js";
-const E = s({
+import { NeonButtonType as v } from "../../../common/enums/NeonButtonType.es.js";
+const W = m({
   name: "NeonButton",
   components: {
-    NeonExpansionIndicator: N,
+    NeonExpansionIndicator: k,
     NeonIcon: h,
-    NeonLink: k
+    NeonLink: N
   },
   props: {
     /**
@@ -57,7 +58,12 @@ const E = s({
      */
     buttonStyle: { type: String, default: e.Solid },
     /**
-     * Provide button states of <em>ready, loading, success or error</em> which change the display of the button (with icons) to reflect the state.
+     * The type of button, see <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button">button</a>.
+     */
+    buttonType: { type: String, default: v.Button },
+    /**
+     * Provide button states of <em>ready, loading, success or error</em> which change the display of the button (with
+     * icons) to reflect the state.
      */
     state: { type: String, default: o.Ready },
     /**
@@ -98,7 +104,7 @@ const E = s({
     "click"
   ],
   setup(t, { emit: u }) {
-    const a = m(), l = y(null), c = i(() => {
+    const a = s(), l = y(null), r = i(() => {
       switch (t.state) {
         case o.Loading:
           return "loading";
@@ -109,7 +115,7 @@ const E = s({
         default:
           return t.icon;
       }
-    }), r = i(() => [
+    }), c = i(() => [
       `neon-button--${t.size}`,
       !t.inverse && `neon-button--${t.color}`,
       `neon-button--${t.buttonStyle}`,
@@ -134,8 +140,8 @@ const E = s({
       return b;
     });
     return {
-      iconName: c,
-      classes: r,
+      iconName: r,
+      classes: c,
       button: l,
       attrs: a,
       sanitizedAttributes: f,
@@ -148,6 +154,6 @@ const E = s({
   }
 });
 export {
-  E as default
+  W as default
 };
 //# sourceMappingURL=NeonButton.es.js.map