@aotearoan/neon 23.0.0 → 23.0.1

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

@@ -1,2 +1,2 @@
-"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;
+"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"]),role:"menuitem"},[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",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          @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"}
+{"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        role=\"menuitem\"\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          @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,EACvB,KAAK,aAGGA,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,YAoBYE,EAAA,CAlBT,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,OACb,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

@@ -16,7 +16,8 @@ function C(n, M, g, I, N, B) {
         key: e.key,
         ref_for: !0,
         ref: "menuItem",
-        class: l([{ "neon-menu__item--disabled": e.disabled }, "neon-menu__item"])
+        class: l([{ "neon-menu__item--disabled": e.disabled }, "neon-menu__item"]),
+        role: "menuitem"
       }, [
         e.children ? (o(), i(c, {
           key: `${e.key}DropdownMenu`,
@@ -36,7 +37,6 @@ function C(n, M, g, I, N, B) {
           "no-style": !0,
           tabindex: e.disabled ? -1 : 0,
           "outline-style": "none",
-          role: "menuitem",
           onKeydown: k((u) => !e.disabled && n.onClick(e.key), ["enter"])
         }, {
           default: b(() => [

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          @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;;;;"}
+{"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        role=\"menuitem\"\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          @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,QACvB,MAAK;AAAA;QAGGA,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,EAoBYE,GAAA;AAAA,UAlBT,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,UACb,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/navigation/mobile-menu/NeonMobileMenu.vue.cjs.js

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

package/dist/components/navigation/mobile-menu/NeonMobileMenu.vue.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonMobileMenu.vue.cjs.js","sources":["../../../../src/components/navigation/mobile-menu/NeonMobileMenu.vue"],"sourcesContent":["<template>\n  <nav ref=\"menuWrapper\" class=\"neon-mobile-menu__wrapper\">\n    <ul :class=\"[`neon-mobile-menu--${color}`]\" class=\"neon-mobile-menu no-style\" role=\"menubar\">\n      <li\n        v-for=\"item in menu\"\n        :key=\"item.key\"\n        ref=\"menuItem\"\n        :class=\"{ 'neon-mobile-menu__item--disabled': item.disabled }\"\n        class=\"neon-mobile-menu__item\"\n        tabindex=\"-1\"\n      >\n        <neon-link\n          :key=\"`${item.key}Link`\"\n          :class=\"{ 'router-link-active': item.href && routeMatches(item.href) }\"\n          :href=\"!item.disabled ? item.href : null\"\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-mobile-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              :disabled=\"item.disabled\"\n              :name=\"item.icon\"\n              class=\"neon-mobile-menu__item-icon\"\n            />\n            <span class=\"neon-mobile-menu__item-label\">{{ item.label }}</span>\n          </div>\n        </neon-link>\n      </li>\n    </ul>\n  </nav>\n</template>\n\n<script lang=\"ts\" src=\"./NeonMobileMenu.ts\" />\n"],"names":["_hoisted_3","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeClass","_ctx","_Fragment","_renderList","item","_createBlock","_component_neon_link","_withKeys","$event","_component_neon_icon","_toDisplayString"],"mappings":"4IACO,IAAI,cAAc,MAAM,2CA4BbA,EAAA,CAAA,MAAM,8BAA8B,oGA5BpD,OAAAC,YAAA,EAAAC,qBAiCM,MAjCNC,EAiCM,CAhCJC,EAAAA,mBA+BK,KAAA,CA/BA,MAAKC,EAAAA,eAAA,CAAA,CAAA,qBAAwBC,EAAA,KAAK,EAAA,EAAW,2BAA2B,CAAA,EAAC,KAAK,6BACjFJ,EAAAA,mBA6BKK,EAAAA,SAAA,KAAAC,EAAAA,WA5BYF,EAAA,KAARG,kBADTP,EAAAA,mBA6BK,KAAA,CA3BF,IAAKO,EAAK,eACX,IAAI,WACH,MAAKJ,EAAAA,eAAA,CAAA,CAAA,mCAAwCI,EAAK,QAAQ,EACrD,wBAAwB,CAAA,EAC9B,SAAS,sBAETC,EAAAA,YAoBYC,EAAA,CAnBT,IAAG,GAAKF,EAAK,GAAG,OAChB,MAAKJ,EAAAA,eAAA,CAAA,qBAA0BI,EAAK,MAAQH,EAAA,aAAaG,EAAK,IAAI,EAAA,EAClE,KAAOA,EAAK,SAAoB,KAATA,EAAK,KAC5B,WAAU,GACV,SAAUA,EAAK,SAAQ,GAAA,EACxB,gBAAc,OACd,KAAK,WACJ,UAAOG,EAAAA,SAAAC,GAAA,CAASJ,EAAK,UAAYH,EAAA,QAAQG,EAAK,GAAG,EAAA,CAAA,OAAA,CAAA,sBAElD,IASM,CATNL,EAAAA,mBASM,MAAA,CATD,MAAM,mCAAmC,SAAS,KAAM,QAAKS,GAAA,CAAGJ,EAAK,UAAYH,EAAA,QAAQG,EAAK,GAAG,IAE5FA,EAAK,oBADbC,EAAAA,YAMEI,EAAA,CAJC,IAAG,GAAKL,EAAK,GAAG,WAChB,SAAUA,EAAK,SACf,KAAMA,EAAK,KACZ,MAAM,wFAERL,EAAAA,mBAAkE,OAAlEJ,EAAkEe,EAAAA,gBAApBN,EAAK,KAAK,EAAA,CAAA"}
+{"version":3,"file":"NeonMobileMenu.vue.cjs.js","sources":["../../../../src/components/navigation/mobile-menu/NeonMobileMenu.vue"],"sourcesContent":["<template>\n  <nav ref=\"menuWrapper\" class=\"neon-mobile-menu__wrapper\">\n    <ul :class=\"[`neon-mobile-menu--${color}`]\" class=\"neon-mobile-menu no-style\" role=\"menubar\">\n      <li\n        v-for=\"item in menu\"\n        :key=\"item.key\"\n        ref=\"menuItem\"\n        :class=\"{ 'neon-mobile-menu__item--disabled': item.disabled }\"\n        class=\"neon-mobile-menu__item\"\n        role=\"menuitem\"\n        tabindex=\"-1\"\n      >\n        <neon-link\n          :key=\"`${item.key}Link`\"\n          :class=\"{ 'router-link-active': item.href && routeMatches(item.href) }\"\n          :href=\"!item.disabled ? item.href : null\"\n          :no-style=\"true\"\n          :tabindex=\"item.disabled ? -1 : 0\"\n          outline-style=\"none\"\n          @keydown.enter=\"!item.disabled && onClick(item.key)\"\n        >\n          <div class=\"neon-mobile-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              :disabled=\"item.disabled\"\n              :name=\"item.icon\"\n              class=\"neon-mobile-menu__item-icon\"\n            />\n            <span class=\"neon-mobile-menu__item-label\">{{ item.label }}</span>\n          </div>\n        </neon-link>\n      </li>\n    </ul>\n  </nav>\n</template>\n\n<script lang=\"ts\" src=\"./NeonMobileMenu.ts\" />\n"],"names":["_hoisted_3","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeClass","_ctx","_Fragment","_renderList","item","_createBlock","_component_neon_link","_withKeys","$event","_component_neon_icon","_toDisplayString"],"mappings":"4IACO,IAAI,cAAc,MAAM,2CA4BbA,EAAA,CAAA,MAAM,8BAA8B,oGA5BpD,OAAAC,YAAA,EAAAC,qBAiCM,MAjCNC,EAiCM,CAhCJC,EAAAA,mBA+BK,KAAA,CA/BA,MAAKC,EAAAA,eAAA,CAAA,CAAA,qBAAwBC,EAAA,KAAK,EAAA,EAAW,2BAA2B,CAAA,EAAC,KAAK,6BACjFJ,EAAAA,mBA6BKK,EAAAA,SAAA,KAAAC,EAAAA,WA5BYF,EAAA,KAARG,kBADTP,EAAAA,mBA6BK,KAAA,CA3BF,IAAKO,EAAK,eACX,IAAI,WACH,MAAKJ,EAAAA,eAAA,CAAA,CAAA,mCAAwCI,EAAK,QAAQ,EACrD,wBAAwB,CAAA,EAC9B,KAAK,WACL,SAAS,sBAETC,EAAAA,YAmBYC,EAAA,CAlBT,IAAG,GAAKF,EAAK,GAAG,OAChB,MAAKJ,EAAAA,eAAA,CAAA,qBAA0BI,EAAK,MAAQH,EAAA,aAAaG,EAAK,IAAI,EAAA,EAClE,KAAOA,EAAK,SAAoB,KAATA,EAAK,KAC5B,WAAU,GACV,SAAUA,EAAK,SAAQ,GAAA,EACxB,gBAAc,OACb,UAAOG,EAAAA,SAAAC,GAAA,CAASJ,EAAK,UAAYH,EAAA,QAAQG,EAAK,GAAG,EAAA,CAAA,OAAA,CAAA,sBAElD,IASM,CATNL,EAAAA,mBASM,MAAA,CATD,MAAM,mCAAmC,SAAS,KAAM,QAAKS,GAAA,CAAGJ,EAAK,UAAYH,EAAA,QAAQG,EAAK,GAAG,IAE5FA,EAAK,oBADbC,EAAAA,YAMEI,EAAA,CAJC,IAAG,GAAKL,EAAK,GAAG,WAChB,SAAUA,EAAK,SACf,KAAMA,EAAK,KACZ,MAAM,wFAERL,EAAAA,mBAAkE,OAAlEJ,EAAkEe,EAAAA,gBAApBN,EAAK,KAAK,EAAA,CAAA"}

package/dist/components/navigation/mobile-menu/NeonMobileMenu.vue.es.js

@@ -17,6 +17,7 @@ function v(n, w, x, B, K, L) {
         ref_for: !0,
         ref: "menuItem",
         class: s([{ "neon-mobile-menu__item--disabled": e.disabled }, "neon-mobile-menu__item"]),
+        role: "menuitem",
         tabindex: "-1"
       }, [
         (o(), i(c, {
@@ -26,7 +27,6 @@ function v(n, w, x, B, K, L) {
           "no-style": !0,
           tabindex: e.disabled ? -1 : 0,
           "outline-style": "none",
-          role: "menuitem",
           onKeydown: b((d) => !e.disabled && n.onClick(e.key), ["enter"])
         }, {
           default: k(() => [

package/dist/components/navigation/mobile-menu/NeonMobileMenu.vue.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonMobileMenu.vue.es.js","sources":["../../../../src/components/navigation/mobile-menu/NeonMobileMenu.vue"],"sourcesContent":["<template>\n  <nav ref=\"menuWrapper\" class=\"neon-mobile-menu__wrapper\">\n    <ul :class=\"[`neon-mobile-menu--${color}`]\" class=\"neon-mobile-menu no-style\" role=\"menubar\">\n      <li\n        v-for=\"item in menu\"\n        :key=\"item.key\"\n        ref=\"menuItem\"\n        :class=\"{ 'neon-mobile-menu__item--disabled': item.disabled }\"\n        class=\"neon-mobile-menu__item\"\n        tabindex=\"-1\"\n      >\n        <neon-link\n          :key=\"`${item.key}Link`\"\n          :class=\"{ 'router-link-active': item.href && routeMatches(item.href) }\"\n          :href=\"!item.disabled ? item.href : null\"\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-mobile-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              :disabled=\"item.disabled\"\n              :name=\"item.icon\"\n              class=\"neon-mobile-menu__item-icon\"\n            />\n            <span class=\"neon-mobile-menu__item-label\">{{ item.label }}</span>\n          </div>\n        </neon-link>\n      </li>\n    </ul>\n  </nav>\n</template>\n\n<script lang=\"ts\" src=\"./NeonMobileMenu.ts\" />\n"],"names":["_hoisted_3","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeClass","_ctx","_Fragment","_renderList","item","_createBlock","_component_neon_link","_withKeys","$event","_component_neon_icon","_toDisplayString"],"mappings":";;;;EACO,KAAI;AAAA,EAAc,OAAM;oBA4BbA,IAAA,EAAA,OAAM,+BAA8B;;;AA5BpD,SAAAC,EAAA,GAAAC,EAiCM,OAjCNC,GAiCM;AAAA,IAhCJC,EA+BK,MAAA;AAAA,MA/BA,OAAKC,EAAA,CAAA,CAAA,qBAAwBC,EAAA,KAAK,EAAA,GAAW,2BAA2B,CAAA;AAAA,MAAC,MAAK;AAAA;cACjFJ,EA6BKK,GAAA,MAAAC,EA5BYF,EAAA,MAAI,CAAZG,YADTP,EA6BK,MAAA;AAAA,QA3BF,KAAKO,EAAK;AAAA;QACX,KAAI;AAAA,QACH,OAAKJ,EAAA,CAAA,EAAA,oCAAwCI,EAAK,SAAQ,GACrD,wBAAwB,CAAA;AAAA,QAC9B,UAAS;AAAA;cAETC,EAoBYC,GAAA;AAAA,UAnBT,KAAG,GAAKF,EAAK,GAAG;AAAA,UAChB,OAAKJ,EAAA,EAAA,sBAA0BI,EAAK,QAAQH,EAAA,aAAaG,EAAK,IAAI,GAAA;AAAA,UAClE,MAAOA,EAAK,WAAoB,OAATA,EAAK;AAAA,UAC5B,YAAU;AAAA,UACV,UAAUA,EAAK,WAAQ,KAAA;AAAA,UACxB,iBAAc;AAAA,UACd,MAAK;AAAA,UACJ,WAAOG,EAAA,CAAAC,MAAA,CAASJ,EAAK,YAAYH,EAAA,QAAQG,EAAK,GAAG,GAAA,CAAA,OAAA,CAAA;AAAA;qBAElD,MASM;AAAA,YATNL,EASM,OAAA;AAAA,cATD,OAAM;AAAA,cAAmC,UAAS;AAAA,cAAM,SAAK,CAAAS,MAAA,CAAGJ,EAAK,YAAYH,EAAA,QAAQG,EAAK,GAAG;AAAA;cAE5FA,EAAK,aADbC,EAMEI,GAAA;AAAA,gBAJC,KAAG,GAAKL,EAAK,GAAG;AAAA,gBAChB,UAAUA,EAAK;AAAA,gBACf,MAAMA,EAAK;AAAA,gBACZ,OAAM;AAAA;cAERL,EAAkE,QAAlEJ,GAAkEe,EAApBN,EAAK,KAAK,GAAA,CAAA;AAAA;;;;;;;;;"}
+{"version":3,"file":"NeonMobileMenu.vue.es.js","sources":["../../../../src/components/navigation/mobile-menu/NeonMobileMenu.vue"],"sourcesContent":["<template>\n  <nav ref=\"menuWrapper\" class=\"neon-mobile-menu__wrapper\">\n    <ul :class=\"[`neon-mobile-menu--${color}`]\" class=\"neon-mobile-menu no-style\" role=\"menubar\">\n      <li\n        v-for=\"item in menu\"\n        :key=\"item.key\"\n        ref=\"menuItem\"\n        :class=\"{ 'neon-mobile-menu__item--disabled': item.disabled }\"\n        class=\"neon-mobile-menu__item\"\n        role=\"menuitem\"\n        tabindex=\"-1\"\n      >\n        <neon-link\n          :key=\"`${item.key}Link`\"\n          :class=\"{ 'router-link-active': item.href && routeMatches(item.href) }\"\n          :href=\"!item.disabled ? item.href : null\"\n          :no-style=\"true\"\n          :tabindex=\"item.disabled ? -1 : 0\"\n          outline-style=\"none\"\n          @keydown.enter=\"!item.disabled && onClick(item.key)\"\n        >\n          <div class=\"neon-mobile-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              :disabled=\"item.disabled\"\n              :name=\"item.icon\"\n              class=\"neon-mobile-menu__item-icon\"\n            />\n            <span class=\"neon-mobile-menu__item-label\">{{ item.label }}</span>\n          </div>\n        </neon-link>\n      </li>\n    </ul>\n  </nav>\n</template>\n\n<script lang=\"ts\" src=\"./NeonMobileMenu.ts\" />\n"],"names":["_hoisted_3","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeClass","_ctx","_Fragment","_renderList","item","_createBlock","_component_neon_link","_withKeys","$event","_component_neon_icon","_toDisplayString"],"mappings":";;;;EACO,KAAI;AAAA,EAAc,OAAM;oBA4BbA,IAAA,EAAA,OAAM,+BAA8B;;;AA5BpD,SAAAC,EAAA,GAAAC,EAiCM,OAjCNC,GAiCM;AAAA,IAhCJC,EA+BK,MAAA;AAAA,MA/BA,OAAKC,EAAA,CAAA,CAAA,qBAAwBC,EAAA,KAAK,EAAA,GAAW,2BAA2B,CAAA;AAAA,MAAC,MAAK;AAAA;cACjFJ,EA6BKK,GAAA,MAAAC,EA5BYF,EAAA,MAAI,CAAZG,YADTP,EA6BK,MAAA;AAAA,QA3BF,KAAKO,EAAK;AAAA;QACX,KAAI;AAAA,QACH,OAAKJ,EAAA,CAAA,EAAA,oCAAwCI,EAAK,SAAQ,GACrD,wBAAwB,CAAA;AAAA,QAC9B,MAAK;AAAA,QACL,UAAS;AAAA;cAETC,EAmBYC,GAAA;AAAA,UAlBT,KAAG,GAAKF,EAAK,GAAG;AAAA,UAChB,OAAKJ,EAAA,EAAA,sBAA0BI,EAAK,QAAQH,EAAA,aAAaG,EAAK,IAAI,GAAA;AAAA,UAClE,MAAOA,EAAK,WAAoB,OAATA,EAAK;AAAA,UAC5B,YAAU;AAAA,UACV,UAAUA,EAAK,WAAQ,KAAA;AAAA,UACxB,iBAAc;AAAA,UACb,WAAOG,EAAA,CAAAC,MAAA,CAASJ,EAAK,YAAYH,EAAA,QAAQG,EAAK,GAAG,GAAA,CAAA,OAAA,CAAA;AAAA;qBAElD,MASM;AAAA,YATNL,EASM,OAAA;AAAA,cATD,OAAM;AAAA,cAAmC,UAAS;AAAA,cAAM,SAAK,CAAAS,MAAA,CAAGJ,EAAK,YAAYH,EAAA,QAAQG,EAAK,GAAG;AAAA;cAE5FA,EAAK,aADbC,EAMEI,GAAA;AAAA,gBAJC,KAAG,GAAKL,EAAK,GAAG;AAAA,gBAChB,UAAUA,EAAK;AAAA,gBACf,MAAMA,EAAK;AAAA,gBACZ,OAAM;AAAA;cAERL,EAAkE,QAAlEJ,GAAkEe,EAApBN,EAAK,KAAK,GAAA,CAAA;AAAA;;;;;;;;;"}

package/dist/components/user-input/input/NeonInput.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const n=require("vue"),c=require("../../../common/enums/NeonInputType.cjs.js"),o=require("../../../common/enums/NeonState.cjs.js"),T=require("../../../common/enums/NeonSize.cjs.js"),r=require("../../../common/enums/NeonFunctionalColor.cjs.js"),q=require("../../presentation/icon/NeonIcon.vue.cjs.js"),F=require("../../../common/utils/NeonDebounceUtils.cjs.js"),L=require("../../../common/enums/NeonInputMode.cjs.js"),z=n.defineComponent({name:"NeonInput",components:{NeonIcon:q},props:{id:{type:String,default:null},modelValue:{type:String,default:null},type:{type:String,default:c.NeonInputType.Text},placeholder:{type:String,default:null},size:{type:String,default:T.NeonSize.Medium},color:{type:String,default:r.NeonFunctionalColor.Primary},inputmode:{type:String,default:L.NeonInputMode.Text},autocomplete:{type:String,default:"on"},state:{type:String,default:o.NeonState.Ready},rows:{type:Number,default:null},icon:{type:String,default:null},iconReadonly:{type:Boolean,default:!1},hideIcon:{type:Boolean,default:!1},tabindex:{type:Number,default:0},disabled:{type:Boolean,default:!1},stateHighlight:{type:Boolean,default:!0},stateIcon:{type:Boolean,default:!0},maxlength:{type:Number,default:null},maxlengthLabel:{type:String,default:"No characters left | 1 character left | {count} characters left"},debounce:{type:Number,default:void 0}},emits:["focus","blur","icon-click","update:modelValue"],setup(e,{emit:u,expose:g}){const h=n.useAttrs(),a=n.ref(null),i=n.ref(!1),y=n.computed(()=>{const{onBlur:t,onFocus:l,onIconClick:d,...B}=h;return B}),s=F.NeonDebounceUtils.debounce(t=>{u("update:modelValue",t)},e.debounce),f=n.computed(()=>{switch(e.state){case o.NeonState.Loading:return"loading";case o.NeonState.Success:return e.stateIcon?"check":void 0;case o.NeonState.Error:return e.stateIcon?"times":void 0;default:return e.icon?e.icon:e.modelValue&&e.modelValue.length>0?"times":void 0}}),N=n.computed(()=>f.value&&!e.hideIcon&&(e.state!=="ready"||e.icon||e.modelValue&&!e.disabled&&e.modelValue.length>0)),S=n.computed(()=>{switch(e.state){case o.NeonState.Success:return r.NeonFunctionalColor.Success;case o.NeonState.Error:return r.NeonFunctionalColor.Error;case o.NeonState.Loading:return e.color;default:return r.NeonFunctionalColor.LowContrast}}),b=n.computed(()=>{if(e.maxlength&&e.maxlength>0){const t=e.maxlengthLabel.split(" | "),l=e.maxlength-e.modelValue.length;switch(l){case 0:return t[0];case 1:return t[1];default:return t[2].replace("{count}",`${l}`)}}return null}),m=()=>{var t;(t=a.value)==null||t.focus()},I=()=>{var t;(t=a.value)==null||t.click()},x=()=>{i.value=!0,u("focus")},V=()=>{i.value=!1,u("blur")},v=t=>{e.disabled||(e.icon?u("icon-click"):(s(""),setTimeout(m)),t.preventDefault(),t.stopPropagation())},C=t=>{const l=t.target.value,d=e.maxlength&&l.length>e.maxlength?l.substring(0,e.maxlength):l;e.modelValue!==d&&s(d)},k=t=>{t.key!=="Backspace"&&e.maxlength&&e.modelValue&&e.modelValue.length>=e.maxlength&&t.preventDefault()},w=n.computed(()=>{if(e.placeholder)return e.placeholder;switch(e.type){case c.NeonInputType.Email:return"gbelson@hooli.com";case c.NeonInputType.Tel:return"+41785551234";case c.NeonInputType.Url:return"http://www.getskeleton.com";default:return""}});return g({neonInput:a}),{neonInput:a,focused:i,sanitizedAttributes:y,iconVisible:N,iconName:f,iconColor:S,computedPlaceholder:w,counterLabel:b,focus:m,click:I,onFocus:x,onBlur:V,iconClicked:v,changeValue:C,onKeyDown:k}}});module.exports=z;
+"use strict";const o=require("vue"),q=require("../../../common/enums/NeonInputType.cjs.js"),l=require("../../../common/enums/NeonState.cjs.js"),F=require("../../../common/enums/NeonSize.cjs.js"),i=require("../../../common/enums/NeonFunctionalColor.cjs.js"),w=require("../../presentation/icon/NeonIcon.vue.cjs.js"),L=require("../../../common/utils/NeonDebounceUtils.cjs.js"),z=require("../../../common/enums/NeonInputMode.cjs.js"),D=o.defineComponent({name:"NeonInput",components:{NeonIcon:w},props:{id:{type:String,default:null},modelValue:{type:String,default:null},type:{type:String,default:q.NeonInputType.Text},placeholder:{type:String,default:null},size:{type:String,default:F.NeonSize.Medium},color:{type:String,default:i.NeonFunctionalColor.Primary},inputmode:{type:String,default:z.NeonInputMode.Text},autocomplete:{type:String,default:"on"},state:{type:String,default:l.NeonState.Ready},rows:{type:Number,default:null},icon:{type:String,default:null},iconReadonly:{type:Boolean,default:!1},hideIcon:{type:Boolean,default:!1},tabindex:{type:Number,default:0},disabled:{type:Boolean,default:!1},stateHighlight:{type:Boolean,default:!0},stateIcon:{type:Boolean,default:!0},maxlength:{type:Number,default:null},maxlengthLabel:{type:String,default:"No characters left | 1 character left | {count} characters left"},debounce:{type:Number,default:void 0}},emits:["focus","blur","icon-click","update:modelValue"],setup(e,{emit:u,expose:m}){const g=o.useAttrs(),c=o.ref(null),r=o.ref(!1),h=o.computed(()=>{const{onBlur:t,onFocus:n,onIconClick:a,...B}=g;return B}),d=L.NeonDebounceUtils.debounce(t=>{u("update:modelValue",t)},e.debounce),s=o.computed(()=>{var t;switch(e.state){case l.NeonState.Loading:return"loading";case l.NeonState.Success:return e.stateIcon?"check":void 0;case l.NeonState.Error:return e.stateIcon?"times":void 0;default:return e.icon?e.icon:e.modelValue&&(((t=e.modelValue)==null?void 0:t.length)||0)>0?"times":void 0}}),y=o.computed(()=>{var t;return s.value&&!e.hideIcon&&(e.state!=="ready"||e.icon||e.modelValue&&!e.disabled&&(((t=e.modelValue)==null?void 0:t.length)||0)>0)}),N=o.computed(()=>{switch(e.state){case l.NeonState.Success:return i.NeonFunctionalColor.Success;case l.NeonState.Error:return i.NeonFunctionalColor.Error;case l.NeonState.Loading:return e.color;default:return i.NeonFunctionalColor.LowContrast}}),S=o.computed(()=>{var t;if(e.maxlength&&e.maxlength>0){const n=e.maxlengthLabel.split(" | "),a=e.maxlength-(((t=e.modelValue)==null?void 0:t.length)||0);switch(a){case 0:return n[0];case 1:return n[1];default:return n[2].replace("{count}",`${a}`)}}return null}),f=()=>{var t;(t=c.value)==null||t.focus()},b=()=>{var t;(t=c.value)==null||t.click()},x=()=>{r.value=!0,u("focus")},V=()=>{r.value=!1,u("blur")},v=t=>{e.disabled||(e.icon?u("icon-click"):(d(""),setTimeout(f)),t.preventDefault(),t.stopPropagation())},I=t=>{const n=t.target.value,a=e.maxlength&&n.length>e.maxlength?n.substring(0,e.maxlength):n;e.modelValue!==a&&d(a)},C=t=>{var n;t.key!=="Backspace"&&e.maxlength&&e.modelValue&&(((n=e.modelValue)==null?void 0:n.length)||0)>=e.maxlength&&t.preventDefault()},k=o.computed(()=>e.placeholder||"");return m({neonInput:c}),{neonInput:c,focused:r,sanitizedAttributes:h,iconVisible:y,iconName:s,iconColor:N,computedPlaceholder:k,counterLabel:S,focus:f,click:b,onFocus:x,onBlur:V,iconClicked:v,changeValue:I,onKeyDown:C}}});module.exports=D;
 //# sourceMappingURL=NeonInput.cjs.js.map

package/dist/components/user-input/input/NeonInput.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonInput.cjs.js","sources":["../../../../src/components/user-input/input/NeonInput.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent, ref, useAttrs } from 'vue';\nimport { NeonInputType } from '@/common/enums/NeonInputType';\nimport { NeonState } from '@/common/enums/NeonState';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { NeonDebounceUtils } from '@/common/utils/NeonDebounceUtils';\nimport { NeonInputMode } from '@/common/enums/NeonInputMode';\n\n/**\n * Equivalent of, and wrapper around, an HTML input. Also supports <strong>textarea</strong>.\n */\nexport default defineComponent({\n  name: 'NeonInput',\n  components: {\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The id the input\n     */\n    id: { type: String, default: null },\n    /**\n     * The value of the input\n     */\n    modelValue: { type: String, default: null },\n    /**\n     * The type of input this is. NOTE: Neon provides custom components as alternatives in the following cases:\n     * * file (use <a href=\"/user-input/file\">NeonFile</a>)\n     * * password (use <a href=\"/user-input/password\">NeonPassword</a>)\n     */\n    type: { type: String as () => NeonInputType, default: NeonInputType.Text },\n    /**\n     * Placeholder text to display in the input\n     */\n    placeholder: { type: String, default: null },\n    /**\n     * Size of the input\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Medium },\n    /**\n     * Color of the input\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Primary },\n    /**\n     * The HTML input mode as specified <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode\">here</a>.\n     */\n    inputmode: { type: String as () => NeonInputMode, default: NeonInputMode.Text },\n    /**\n     * The HTML autocomplete mode as specified <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values\">here</a>.\n     * NOTE: No enum is provided in Neon as some values can be used in combination, please refer to the full list of values in the preceding link.\n     */\n    autocomplete: { type: String as () => NeonInputMode, default: 'on' },\n    /**\n     * The state of the input\n     */\n    state: { type: String as () => NeonState, default: NeonState.Ready },\n    /**\n     * The number of rows to display in the case of a textarea\n     */\n    rows: { type: Number, default: null },\n    /**\n     * The name of a clickable icon to display inside the input. This is used for clearing contents or e.g. in the case of\n     * NeonPassword toggle showing/hiding the password. Defaults to <em>times</em> (for clearing the input's contents).\n     */\n    icon: { type: String, default: null },\n    /**\n     * Make the input field icon read-only, i.e. it will not emit events or be treated as a focusable button.\n     */\n    iconReadonly: { type: Boolean, default: false },\n    /**\n     * Hide the icon button, e.g. the X button to clear the input's contents.\n     */\n    hideIcon: { type: Boolean, default: false },\n    /**\n     * Tabindex to assign to the input.\n     */\n    tabindex: { type: Number, default: 0 },\n    /**\n     * The disabled state of the input\n     */\n    disabled: { type: Boolean, default: false },\n    /**\n     * When the state is success or error, display the field with the state color indicator, e.g. border or background\n     * color.\n     */\n    stateHighlight: { type: Boolean, default: true },\n    /**\n     * When the state is success or error, display the state icon.\n     */\n    stateIcon: { type: Boolean, default: true },\n    /**\n     * The character limit for a textarea.\n     */\n    maxlength: { type: Number, default: null },\n    /**\n     * The label template for the character limit. This is a string in the vue-i18n Pluralization format with a\n     * <em>{count}</em> placeholder.\n     */\n    maxlengthLabel: { type: String, default: 'No characters left | 1 character left | {count} characters left' },\n    /**\n     * Debounce time in ms. If no value is provided, the default value set in NeonDebounceUtils is used (=0ms).\n     */\n    debounce: { type: Number, default: undefined },\n  },\n  emits: [\n    /**\n     * Emitted when the input has gained focus\n     * @type {void}\n     */\n    'focus',\n    /**\n     * Emitted when the input has lost focus\n     * @type {void}\n     */\n    'blur',\n    /**\n     * Emitted when the icon is clicked\n     * @type {void}\n     */\n    'icon-click',\n    /**\n     * Emitted when the input value is changed, NOTE: is not triggered if input is over the textarea length limit\n     * @type {string} the contents of the input\n     */\n    'update:modelValue',\n  ],\n  setup(props, { emit, expose }) {\n    const attrs = useAttrs();\n    const neonInput = ref<HTMLElement | null>(null);\n    const focused = ref(false);\n\n    const sanitizedAttributes = computed(() => {\n      const {\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        onBlur,\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        onFocus,\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        onIconClick,\n        ...sanitized\n      } = attrs;\n\n      return sanitized;\n    });\n\n    const emitModelValue = NeonDebounceUtils.debounce((value: string) => {\n      emit('update:modelValue', value);\n    }, props.debounce);\n\n    const iconName = computed(() => {\n      switch (props.state) {\n        case NeonState.Loading:\n          return 'loading';\n        case NeonState.Success:\n          return props.stateIcon ? 'check' : undefined;\n        case NeonState.Error:\n          return props.stateIcon ? 'times' : undefined;\n        default:\n          if (props.icon) {\n            return props.icon;\n          } else if (props.modelValue && props.modelValue.length > 0) {\n            return 'times';\n          }\n\n          return undefined;\n      }\n    });\n\n    const iconVisible = computed(() => {\n      return (\n        iconName.value &&\n        !props.hideIcon &&\n        (props.state !== 'ready' || props.icon || (props.modelValue && !props.disabled && props.modelValue.length > 0))\n      );\n    });\n\n    const iconColor = computed(() => {\n      switch (props.state) {\n        case NeonState.Success:\n          return NeonFunctionalColor.Success;\n        case NeonState.Error:\n          return NeonFunctionalColor.Error;\n        case NeonState.Loading:\n          return props.color;\n        default:\n          return NeonFunctionalColor.LowContrast;\n      }\n    });\n\n    const counterLabel = computed<string | null>(() => {\n      if (props.maxlength && props.maxlength > 0) {\n        const templates = props.maxlengthLabel.split(' | ');\n        const remainingChars = props.maxlength - props.modelValue.length;\n        switch (remainingChars) {\n          case 0:\n            return templates[0];\n          case 1:\n            return templates[1];\n          default:\n            return templates[2].replace('{count}', `${remainingChars}`);\n        }\n      }\n      return null;\n    });\n\n    const focus = () => {\n      neonInput.value?.focus();\n    };\n\n    const click = () => {\n      neonInput.value?.click();\n    };\n\n    const onFocus = () => {\n      focused.value = true;\n      emit('focus');\n    };\n\n    const onBlur = () => {\n      focused.value = false;\n      emit('blur');\n    };\n\n    const iconClicked = ($event: Event) => {\n      if (!props.disabled) {\n        if (props.icon) {\n          emit('icon-click');\n        } else {\n          emitModelValue('');\n          setTimeout(focus);\n        }\n        $event.preventDefault();\n        $event.stopPropagation();\n      }\n    };\n\n    const changeValue = (event: InputEvent) => {\n      const val = (event.target as HTMLInputElement).value;\n      const v = props.maxlength && val.length > props.maxlength ? val.substring(0, props.maxlength) : val;\n      if (props.modelValue !== v) {\n        emitModelValue(v);\n      }\n    };\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (\n        event.key !== 'Backspace' &&\n        props.maxlength &&\n        props.modelValue &&\n        props.modelValue.length >= props.maxlength\n      ) {\n        event.preventDefault();\n      }\n    };\n\n    const computedPlaceholder = computed(() => {\n      if (props.placeholder) {\n        return props.placeholder;\n      } else {\n        switch (props.type) {\n          case NeonInputType.Email:\n            return 'gbelson@hooli.com';\n          case NeonInputType.Tel:\n            return '+41785551234';\n          case NeonInputType.Url:\n            return 'http://www.getskeleton.com';\n          default:\n            return '';\n        }\n      }\n    });\n\n    expose({ neonInput });\n\n    return {\n      neonInput,\n      focused,\n      sanitizedAttributes,\n      iconVisible,\n      iconName,\n      iconColor,\n      computedPlaceholder,\n      counterLabel,\n      focus,\n      click,\n      onFocus,\n      onBlur,\n      iconClicked,\n      changeValue,\n      onKeyDown,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonInputType","NeonSize","NeonFunctionalColor","NeonInputMode","NeonState","props","emit","expose","attrs","useAttrs","neonInput","ref","focused","sanitizedAttributes","computed","onBlur","onFocus","onIconClick","sanitized","emitModelValue","NeonDebounceUtils","value","iconName","iconVisible","iconColor","counterLabel","templates","remainingChars","focus","_a","click","iconClicked","$event","changeValue","event","val","v","onKeyDown","computedPlaceholder"],"mappings":"8aAYAA,EAAeC,kBAAgB,CAC7B,KAAM,YACN,WAAY,CACV,SAAAC,CAAA,EAEF,MAAO,CAIL,GAAI,CAAE,KAAM,OAAQ,QAAS,IAAA,EAI7B,WAAY,CAAE,KAAM,OAAQ,QAAS,IAAA,EAMrC,KAAM,CAAE,KAAM,OAA+B,QAASC,EAAAA,cAAc,IAAA,EAIpE,YAAa,CAAE,KAAM,OAAQ,QAAS,IAAA,EAItC,KAAM,CAAE,KAAM,OAA0B,QAASC,EAAAA,SAAS,MAAA,EAI1D,MAAO,CAAE,KAAM,OAAqC,QAASC,EAAAA,oBAAoB,OAAA,EAIjF,UAAW,CAAE,KAAM,OAA+B,QAASC,EAAAA,cAAc,IAAA,EAKzE,aAAc,CAAE,KAAM,OAA+B,QAAS,IAAA,EAI9D,MAAO,CAAE,KAAM,OAA2B,QAASC,EAAAA,UAAU,KAAA,EAI7D,KAAM,CAAE,KAAM,OAAQ,QAAS,IAAA,EAK/B,KAAM,CAAE,KAAM,OAAQ,QAAS,IAAA,EAI/B,aAAc,CAAE,KAAM,QAAS,QAAS,EAAA,EAIxC,SAAU,CAAE,KAAM,QAAS,QAAS,EAAA,EAIpC,SAAU,CAAE,KAAM,OAAQ,QAAS,CAAA,EAInC,SAAU,CAAE,KAAM,QAAS,QAAS,EAAA,EAKpC,eAAgB,CAAE,KAAM,QAAS,QAAS,EAAA,EAI1C,UAAW,CAAE,KAAM,QAAS,QAAS,EAAA,EAIrC,UAAW,CAAE,KAAM,OAAQ,QAAS,IAAA,EAKpC,eAAgB,CAAE,KAAM,OAAQ,QAAS,iEAAA,EAIzC,SAAU,CAAE,KAAM,OAAQ,QAAS,MAAA,CAAU,EAE/C,MAAO,CAKL,QAKA,OAKA,aAKA,mBAAA,EAEF,MAAMC,EAAO,CAAE,KAAAC,EAAM,OAAAC,GAAU,CAC7B,MAAMC,EAAQC,EAAAA,SAAA,EACRC,EAAYC,EAAAA,IAAwB,IAAI,EACxCC,EAAUD,EAAAA,IAAI,EAAK,EAEnBE,EAAsBC,EAAAA,SAAS,IAAM,CACzC,KAAM,CAEJ,OAAAC,EAEA,QAAAC,EAEA,YAAAC,EACA,GAAGC,CAAA,EACDV,EAEJ,OAAOU,CACT,CAAC,EAEKC,EAAiBC,EAAAA,kBAAkB,SAAUC,GAAkB,CACnEf,EAAK,oBAAqBe,CAAK,CACjC,EAAGhB,EAAM,QAAQ,EAEXiB,EAAWR,EAAAA,SAAS,IAAM,CAC9B,OAAQT,EAAM,MAAA,CACZ,KAAKD,EAAAA,UAAU,QACb,MAAO,UACT,KAAKA,EAAAA,UAAU,QACb,OAAOC,EAAM,UAAY,QAAU,OACrC,KAAKD,EAAAA,UAAU,MACb,OAAOC,EAAM,UAAY,QAAU,OACrC,QACE,OAAIA,EAAM,KACDA,EAAM,KACJA,EAAM,YAAcA,EAAM,WAAW,OAAS,EAChD,QAGT,MAAO,CAEb,CAAC,EAEKkB,EAAcT,EAAAA,SAAS,IAEzBQ,EAAS,OACT,CAACjB,EAAM,WACNA,EAAM,QAAU,SAAWA,EAAM,MAASA,EAAM,YAAc,CAACA,EAAM,UAAYA,EAAM,WAAW,OAAS,EAE/G,EAEKmB,EAAYV,EAAAA,SAAS,IAAM,CAC/B,OAAQT,EAAM,MAAA,CACZ,KAAKD,EAAAA,UAAU,QACb,OAAOF,EAAAA,oBAAoB,QAC7B,KAAKE,EAAAA,UAAU,MACb,OAAOF,EAAAA,oBAAoB,MAC7B,KAAKE,EAAAA,UAAU,QACb,OAAOC,EAAM,MACf,QACE,OAAOH,EAAAA,oBAAoB,WAAA,CAEjC,CAAC,EAEKuB,EAAeX,EAAAA,SAAwB,IAAM,CACjD,GAAIT,EAAM,WAAaA,EAAM,UAAY,EAAG,CAC1C,MAAMqB,EAAYrB,EAAM,eAAe,MAAM,KAAK,EAC5CsB,EAAiBtB,EAAM,UAAYA,EAAM,WAAW,OAC1D,OAAQsB,EAAA,CACN,IAAK,GACH,OAAOD,EAAU,CAAC,EACpB,IAAK,GACH,OAAOA,EAAU,CAAC,EACpB,QACE,OAAOA,EAAU,CAAC,EAAE,QAAQ,UAAW,GAAGC,CAAc,EAAE,CAAA,CAEhE,CACA,OAAO,IACT,CAAC,EAEKC,EAAQ,IAAM,QAClBC,EAAAnB,EAAU,QAAV,MAAAmB,EAAiB,OACnB,EAEMC,EAAQ,IAAM,QAClBD,EAAAnB,EAAU,QAAV,MAAAmB,EAAiB,OACnB,EAEMb,EAAU,IAAM,CACpBJ,EAAQ,MAAQ,GAChBN,EAAK,OAAO,CACd,EAEMS,EAAS,IAAM,CACnBH,EAAQ,MAAQ,GAChBN,EAAK,MAAM,CACb,EAEMyB,EAAeC,GAAkB,CAChC3B,EAAM,WACLA,EAAM,KACRC,EAAK,YAAY,GAEjBa,EAAe,EAAE,EACjB,WAAWS,CAAK,GAElBI,EAAO,eAAA,EACPA,EAAO,gBAAA,EAEX,EAEMC,EAAeC,GAAsB,CACzC,MAAMC,EAAOD,EAAM,OAA4B,MACzCE,EAAI/B,EAAM,WAAa8B,EAAI,OAAS9B,EAAM,UAAY8B,EAAI,UAAU,EAAG9B,EAAM,SAAS,EAAI8B,EAC5F9B,EAAM,aAAe+B,GACvBjB,EAAeiB,CAAC,CAEpB,EAEMC,EAAaH,GAAyB,CAExCA,EAAM,MAAQ,aACd7B,EAAM,WACNA,EAAM,YACNA,EAAM,WAAW,QAAUA,EAAM,WAEjC6B,EAAM,eAAA,CAEV,EAEMI,EAAsBxB,EAAAA,SAAS,IAAM,CACzC,GAAIT,EAAM,YACR,OAAOA,EAAM,YAEb,OAAQA,EAAM,KAAA,CACZ,KAAKL,EAAAA,cAAc,MACjB,MAAO,oBACT,KAAKA,EAAAA,cAAc,IACjB,MAAO,eACT,KAAKA,EAAAA,cAAc,IACjB,MAAO,6BACT,QACE,MAAO,EAAA,CAGf,CAAC,EAED,OAAAO,EAAO,CAAE,UAAAG,EAAW,EAEb,CACL,UAAAA,EACA,QAAAE,EACA,oBAAAC,EACA,YAAAU,EACA,SAAAD,EACA,UAAAE,EACA,oBAAAc,EACA,aAAAb,EACA,MAAAG,EACA,MAAAE,EACA,QAAAd,EACA,OAAAD,EACA,YAAAgB,EACA,YAAAE,EACA,UAAAI,CAAA,CAEJ,CACF,CAAC"}
+{"version":3,"file":"NeonInput.cjs.js","sources":["../../../../src/components/user-input/input/NeonInput.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent, ref, useAttrs } from 'vue';\nimport { NeonInputType } from '@/common/enums/NeonInputType';\nimport { NeonState } from '@/common/enums/NeonState';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { NeonDebounceUtils } from '@/common/utils/NeonDebounceUtils';\nimport { NeonInputMode } from '@/common/enums/NeonInputMode';\n\n/**\n * Equivalent of, and wrapper around, an HTML input. Also supports <strong>textarea</strong>.\n */\nexport default defineComponent({\n  name: 'NeonInput',\n  components: {\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The id the input\n     */\n    id: { type: String, default: null },\n    /**\n     * The value of the input\n     */\n    modelValue: { type: String, default: null },\n    /**\n     * The type of input this is. NOTE: Neon provides custom components as alternatives in the following cases:\n     * * file (use <a href=\"/user-input/file\">NeonFile</a>)\n     * * password (use <a href=\"/user-input/password\">NeonPassword</a>)\n     */\n    type: { type: String as () => NeonInputType, default: NeonInputType.Text },\n    /**\n     * Placeholder text to display in the input\n     */\n    placeholder: { type: String, default: null },\n    /**\n     * Size of the input\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Medium },\n    /**\n     * Color of the input\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Primary },\n    /**\n     * The HTML input mode as specified <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode\">here</a>.\n     */\n    inputmode: { type: String as () => NeonInputMode, default: NeonInputMode.Text },\n    /**\n     * The HTML autocomplete mode as specified <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values\">here</a>.\n     * NOTE: No enum is provided in Neon as some values can be used in combination, please refer to the full list of values in the preceding link.\n     */\n    autocomplete: { type: String, default: 'on' },\n    /**\n     * The state of the input\n     */\n    state: { type: String as () => NeonState, default: NeonState.Ready },\n    /**\n     * The number of rows to display in the case of a textarea\n     */\n    rows: { type: Number, default: null },\n    /**\n     * The name of a clickable icon to display inside the input. This is used for clearing contents or e.g. in the case of\n     * NeonPassword toggle showing/hiding the password. Defaults to <em>times</em> (for clearing the input's contents).\n     */\n    icon: { type: String, default: null },\n    /**\n     * Make the input field icon read-only, i.e. it will not emit events or be treated as a focusable button.\n     */\n    iconReadonly: { type: Boolean, default: false },\n    /**\n     * Hide the icon button, e.g. the X button to clear the input's contents.\n     */\n    hideIcon: { type: Boolean, default: false },\n    /**\n     * Tabindex to assign to the input.\n     */\n    tabindex: { type: Number, default: 0 },\n    /**\n     * The disabled state of the input\n     */\n    disabled: { type: Boolean, default: false },\n    /**\n     * When the state is success or error, display the field with the state color indicator, e.g. border or background\n     * color.\n     */\n    stateHighlight: { type: Boolean, default: true },\n    /**\n     * When the state is success or error, display the state icon.\n     */\n    stateIcon: { type: Boolean, default: true },\n    /**\n     * The character limit for a textarea.\n     */\n    maxlength: { type: Number, default: null },\n    /**\n     * The label template for the character limit. This is a string in the vue-i18n Pluralization format with a\n     * <em>{count}</em> placeholder.\n     */\n    maxlengthLabel: { type: String, default: 'No characters left | 1 character left | {count} characters left' },\n    /**\n     * Debounce time in ms. If no value is provided, the default value set in NeonDebounceUtils is used (=0ms).\n     */\n    debounce: { type: Number, default: undefined },\n  },\n  emits: [\n    /**\n     * Emitted when the input has gained focus\n     * @type {void}\n     */\n    'focus',\n    /**\n     * Emitted when the input has lost focus\n     * @type {void}\n     */\n    'blur',\n    /**\n     * Emitted when the icon is clicked\n     * @type {void}\n     */\n    'icon-click',\n    /**\n     * Emitted when the input value is changed, NOTE: is not triggered if input is over the textarea length limit\n     * @type {string} the contents of the input\n     */\n    'update:modelValue',\n  ],\n  setup(props, { emit, expose }) {\n    const attrs = useAttrs();\n    const neonInput = ref<HTMLElement | null>(null);\n    const focused = ref(false);\n\n    const sanitizedAttributes = computed(() => {\n      const {\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        onBlur,\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        onFocus,\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        onIconClick,\n        ...sanitized\n      } = attrs;\n\n      return sanitized;\n    });\n\n    const emitModelValue = NeonDebounceUtils.debounce((value: string) => {\n      emit('update:modelValue', value);\n    }, props.debounce);\n\n    const iconName = computed(() => {\n      switch (props.state) {\n        case NeonState.Loading:\n          return 'loading';\n        case NeonState.Success:\n          return props.stateIcon ? 'check' : undefined;\n        case NeonState.Error:\n          return props.stateIcon ? 'times' : undefined;\n        default:\n          if (props.icon) {\n            return props.icon;\n          } else if (props.modelValue && (props.modelValue?.length || 0) > 0) {\n            return 'times';\n          }\n\n          return undefined;\n      }\n    });\n\n    const iconVisible = computed(() => {\n      return (\n        iconName.value &&\n        !props.hideIcon &&\n        (props.state !== 'ready' ||\n          props.icon ||\n          (props.modelValue && !props.disabled && (props.modelValue?.length || 0) > 0))\n      );\n    });\n\n    const iconColor = computed(() => {\n      switch (props.state) {\n        case NeonState.Success:\n          return NeonFunctionalColor.Success;\n        case NeonState.Error:\n          return NeonFunctionalColor.Error;\n        case NeonState.Loading:\n          return props.color;\n        default:\n          return NeonFunctionalColor.LowContrast;\n      }\n    });\n\n    const counterLabel = computed<string | null>(() => {\n      if (props.maxlength && props.maxlength > 0) {\n        const templates = props.maxlengthLabel.split(' | ');\n        const remainingChars = props.maxlength - (props.modelValue?.length || 0);\n        switch (remainingChars) {\n          case 0:\n            return templates[0];\n          case 1:\n            return templates[1];\n          default:\n            return templates[2].replace('{count}', `${remainingChars}`);\n        }\n      }\n      return null;\n    });\n\n    const focus = () => {\n      neonInput.value?.focus();\n    };\n\n    const click = () => {\n      neonInput.value?.click();\n    };\n\n    const onFocus = () => {\n      focused.value = true;\n      emit('focus');\n    };\n\n    const onBlur = () => {\n      focused.value = false;\n      emit('blur');\n    };\n\n    const iconClicked = ($event: Event) => {\n      if (!props.disabled) {\n        if (props.icon) {\n          emit('icon-click');\n        } else {\n          emitModelValue('');\n          setTimeout(focus);\n        }\n        $event.preventDefault();\n        $event.stopPropagation();\n      }\n    };\n\n    const changeValue = (event: InputEvent) => {\n      const val = (event.target as HTMLInputElement).value;\n      const v = props.maxlength && val.length > props.maxlength ? val.substring(0, props.maxlength) : val;\n      if (props.modelValue !== v) {\n        emitModelValue(v);\n      }\n    };\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (\n        event.key !== 'Backspace' &&\n        props.maxlength &&\n        props.modelValue &&\n        (props.modelValue?.length || 0) >= props.maxlength\n      ) {\n        event.preventDefault();\n      }\n    };\n\n    const computedPlaceholder = computed(() => props.placeholder || '');\n\n    expose({ neonInput });\n\n    return {\n      neonInput,\n      focused,\n      sanitizedAttributes,\n      iconVisible,\n      iconName,\n      iconColor,\n      computedPlaceholder,\n      counterLabel,\n      focus,\n      click,\n      onFocus,\n      onBlur,\n      iconClicked,\n      changeValue,\n      onKeyDown,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonInputType","NeonSize","NeonFunctionalColor","NeonInputMode","NeonState","props","emit","expose","attrs","useAttrs","neonInput","ref","focused","sanitizedAttributes","computed","onBlur","onFocus","onIconClick","sanitized","emitModelValue","NeonDebounceUtils","value","iconName","_a","iconVisible","iconColor","counterLabel","templates","remainingChars","focus","click","iconClicked","$event","changeValue","event","val","v","onKeyDown","computedPlaceholder"],"mappings":"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"}

package/dist/components/user-input/input/NeonInput.es.js

@@ -1,15 +1,15 @@
-import { defineComponent as T, useAttrs as z, ref as g, computed as a } from "vue";
-import { NeonInputType as c } from "../../../common/enums/NeonInputType.es.js";
+import { defineComponent as L, useAttrs as z, ref as m, computed as o } from "vue";
+import { NeonInputType as D } from "../../../common/enums/NeonInputType.es.js";
 import { NeonState as l } from "../../../common/enums/NeonState.es.js";
-import { NeonSize as D } from "../../../common/enums/NeonSize.es.js";
-import { NeonFunctionalColor as r } from "../../../common/enums/NeonFunctionalColor.es.js";
-import E from "../../presentation/icon/NeonIcon.vue.es.js";
-import { NeonDebounceUtils as F } from "../../../common/utils/NeonDebounceUtils.es.js";
+import { NeonSize as F } from "../../../common/enums/NeonSize.es.js";
+import { NeonFunctionalColor as i } from "../../../common/enums/NeonFunctionalColor.es.js";
+import T from "../../presentation/icon/NeonIcon.vue.es.js";
+import { NeonDebounceUtils as E } from "../../../common/utils/NeonDebounceUtils.es.js";
 import { NeonInputMode as M } from "../../../common/enums/NeonInputMode.es.js";
-const q = T({
+const q = L({
   name: "NeonInput",
   components: {
-    NeonIcon: E
+    NeonIcon: T
   },
   props: {
     /**
@@ -25,7 +25,7 @@ const q = T({
      * * file (use <a href="/user-input/file">NeonFile</a>)
      * * password (use <a href="/user-input/password">NeonPassword</a>)
      */
-    type: { type: String, default: c.Text },
+    type: { type: String, default: D.Text },
     /**
      * Placeholder text to display in the input
      */
@@ -33,11 +33,11 @@ const q = T({
     /**
      * Size of the input
      */
-    size: { type: String, default: D.Medium },
+    size: { type: String, default: F.Medium },
     /**
      * Color of the input
      */
-    color: { type: String, default: r.Primary },
+    color: { type: String, default: i.Primary },
     /**
      * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
      */
@@ -121,21 +121,22 @@ const q = T({
      */
     "update:modelValue"
   ],
-  setup(e, { emit: o, expose: h }) {
-    const y = z(), u = g(null), i = g(!1), b = a(() => {
+  setup(e, { emit: u, expose: g }) {
+    const h = z(), c = m(null), r = m(!1), y = o(() => {
       const {
         // eslint-disable-next-line @typescript-eslint/no-unused-vars
         onBlur: t,
         // eslint-disable-next-line @typescript-eslint/no-unused-vars
         onFocus: n,
         // eslint-disable-next-line @typescript-eslint/no-unused-vars
-        onIconClick: d,
-        ...L
-      } = y;
-      return L;
-    }), s = F.debounce((t) => {
-      o("update:modelValue", t);
-    }, e.debounce), m = a(() => {
+        onIconClick: a,
+        ...w
+      } = h;
+      return w;
+    }), d = E.debounce((t) => {
+      u("update:modelValue", t);
+    }, e.debounce), s = o(() => {
+      var t;
       switch (e.state) {
         case l.Loading:
           return "loading";
@@ -144,78 +145,70 @@ const q = T({
         case l.Error:
           return e.stateIcon ? "times" : void 0;
         default:
-          return e.icon ? e.icon : e.modelValue && e.modelValue.length > 0 ? "times" : void 0;
+          return e.icon ? e.icon : e.modelValue && (((t = e.modelValue) == null ? void 0 : t.length) || 0) > 0 ? "times" : void 0;
       }
-    }), S = a(() => m.value && !e.hideIcon && (e.state !== "ready" || e.icon || e.modelValue && !e.disabled && e.modelValue.length > 0)), x = a(() => {
+    }), b = o(() => {
+      var t;
+      return s.value && !e.hideIcon && (e.state !== "ready" || e.icon || e.modelValue && !e.disabled && (((t = e.modelValue) == null ? void 0 : t.length) || 0) > 0);
+    }), S = o(() => {
       switch (e.state) {
         case l.Success:
-          return r.Success;
+          return i.Success;
         case l.Error:
-          return r.Error;
+          return i.Error;
         case l.Loading:
           return e.color;
         default:
-          return r.LowContrast;
+          return i.LowContrast;
       }
-    }), N = a(() => {
+    }), x = o(() => {
+      var t;
       if (e.maxlength && e.maxlength > 0) {
-        const t = e.maxlengthLabel.split(" | "), n = e.maxlength - e.modelValue.length;
-        switch (n) {
+        const n = e.maxlengthLabel.split(" | "), a = e.maxlength - (((t = e.modelValue) == null ? void 0 : t.length) || 0);
+        switch (a) {
           case 0:
-            return t[0];
+            return n[0];
           case 1:
-            return t[1];
+            return n[1];
           default:
-            return t[2].replace("{count}", `${n}`);
+            return n[2].replace("{count}", `${a}`);
         }
       }
       return null;
     }), f = () => {
       var t;
-      (t = u.value) == null || t.focus();
-    }, V = () => {
+      (t = c.value) == null || t.focus();
+    }, N = () => {
       var t;
-      (t = u.value) == null || t.click();
+      (t = c.value) == null || t.click();
+    }, V = () => {
+      r.value = !0, u("focus");
     }, v = () => {
-      i.value = !0, o("focus");
-    }, I = () => {
-      i.value = !1, o("blur");
+      r.value = !1, u("blur");
+    }, I = (t) => {
+      e.disabled || (e.icon ? u("icon-click") : (d(""), setTimeout(f)), t.preventDefault(), t.stopPropagation());
     }, k = (t) => {
-      e.disabled || (e.icon ? o("icon-click") : (s(""), setTimeout(f)), t.preventDefault(), t.stopPropagation());
-    }, w = (t) => {
-      const n = t.target.value, d = e.maxlength && n.length > e.maxlength ? n.substring(0, e.maxlength) : n;
-      e.modelValue !== d && s(d);
+      const n = t.target.value, a = e.maxlength && n.length > e.maxlength ? n.substring(0, e.maxlength) : n;
+      e.modelValue !== a && d(a);
     }, B = (t) => {
-      t.key !== "Backspace" && e.maxlength && e.modelValue && e.modelValue.length >= e.maxlength && t.preventDefault();
-    }, C = a(() => {
-      if (e.placeholder)
-        return e.placeholder;
-      switch (e.type) {
-        case c.Email:
-          return "gbelson@hooli.com";
-        case c.Tel:
-          return "+41785551234";
-        case c.Url:
-          return "http://www.getskeleton.com";
-        default:
-          return "";
-      }
-    });
-    return h({ neonInput: u }), {
-      neonInput: u,
-      focused: i,
-      sanitizedAttributes: b,
-      iconVisible: S,
-      iconName: m,
-      iconColor: x,
+      var n;
+      t.key !== "Backspace" && e.maxlength && e.modelValue && (((n = e.modelValue) == null ? void 0 : n.length) || 0) >= e.maxlength && t.preventDefault();
+    }, C = o(() => e.placeholder || "");
+    return g({ neonInput: c }), {
+      neonInput: c,
+      focused: r,
+      sanitizedAttributes: y,
+      iconVisible: b,
+      iconName: s,
+      iconColor: S,
       computedPlaceholder: C,
-      counterLabel: N,
+      counterLabel: x,
       focus: f,
-      click: V,
-      onFocus: v,
-      onBlur: I,
-      iconClicked: k,
-      changeValue: w,
+      click: N,
+      onFocus: V,
+      onBlur: v,
+      iconClicked: I,
+      changeValue: k,
       onKeyDown: B
     };
   }

package/dist/components/user-input/input/NeonInput.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonInput.es.js","sources":["../../../../src/components/user-input/input/NeonInput.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent, ref, useAttrs } from 'vue';\nimport { NeonInputType } from '@/common/enums/NeonInputType';\nimport { NeonState } from '@/common/enums/NeonState';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { NeonDebounceUtils } from '@/common/utils/NeonDebounceUtils';\nimport { NeonInputMode } from '@/common/enums/NeonInputMode';\n\n/**\n * Equivalent of, and wrapper around, an HTML input. Also supports <strong>textarea</strong>.\n */\nexport default defineComponent({\n  name: 'NeonInput',\n  components: {\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The id the input\n     */\n    id: { type: String, default: null },\n    /**\n     * The value of the input\n     */\n    modelValue: { type: String, default: null },\n    /**\n     * The type of input this is. NOTE: Neon provides custom components as alternatives in the following cases:\n     * * file (use <a href=\"/user-input/file\">NeonFile</a>)\n     * * password (use <a href=\"/user-input/password\">NeonPassword</a>)\n     */\n    type: { type: String as () => NeonInputType, default: NeonInputType.Text },\n    /**\n     * Placeholder text to display in the input\n     */\n    placeholder: { type: String, default: null },\n    /**\n     * Size of the input\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Medium },\n    /**\n     * Color of the input\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Primary },\n    /**\n     * The HTML input mode as specified <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode\">here</a>.\n     */\n    inputmode: { type: String as () => NeonInputMode, default: NeonInputMode.Text },\n    /**\n     * The HTML autocomplete mode as specified <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values\">here</a>.\n     * NOTE: No enum is provided in Neon as some values can be used in combination, please refer to the full list of values in the preceding link.\n     */\n    autocomplete: { type: String as () => NeonInputMode, default: 'on' },\n    /**\n     * The state of the input\n     */\n    state: { type: String as () => NeonState, default: NeonState.Ready },\n    /**\n     * The number of rows to display in the case of a textarea\n     */\n    rows: { type: Number, default: null },\n    /**\n     * The name of a clickable icon to display inside the input. This is used for clearing contents or e.g. in the case of\n     * NeonPassword toggle showing/hiding the password. Defaults to <em>times</em> (for clearing the input's contents).\n     */\n    icon: { type: String, default: null },\n    /**\n     * Make the input field icon read-only, i.e. it will not emit events or be treated as a focusable button.\n     */\n    iconReadonly: { type: Boolean, default: false },\n    /**\n     * Hide the icon button, e.g. the X button to clear the input's contents.\n     */\n    hideIcon: { type: Boolean, default: false },\n    /**\n     * Tabindex to assign to the input.\n     */\n    tabindex: { type: Number, default: 0 },\n    /**\n     * The disabled state of the input\n     */\n    disabled: { type: Boolean, default: false },\n    /**\n     * When the state is success or error, display the field with the state color indicator, e.g. border or background\n     * color.\n     */\n    stateHighlight: { type: Boolean, default: true },\n    /**\n     * When the state is success or error, display the state icon.\n     */\n    stateIcon: { type: Boolean, default: true },\n    /**\n     * The character limit for a textarea.\n     */\n    maxlength: { type: Number, default: null },\n    /**\n     * The label template for the character limit. This is a string in the vue-i18n Pluralization format with a\n     * <em>{count}</em> placeholder.\n     */\n    maxlengthLabel: { type: String, default: 'No characters left | 1 character left | {count} characters left' },\n    /**\n     * Debounce time in ms. If no value is provided, the default value set in NeonDebounceUtils is used (=0ms).\n     */\n    debounce: { type: Number, default: undefined },\n  },\n  emits: [\n    /**\n     * Emitted when the input has gained focus\n     * @type {void}\n     */\n    'focus',\n    /**\n     * Emitted when the input has lost focus\n     * @type {void}\n     */\n    'blur',\n    /**\n     * Emitted when the icon is clicked\n     * @type {void}\n     */\n    'icon-click',\n    /**\n     * Emitted when the input value is changed, NOTE: is not triggered if input is over the textarea length limit\n     * @type {string} the contents of the input\n     */\n    'update:modelValue',\n  ],\n  setup(props, { emit, expose }) {\n    const attrs = useAttrs();\n    const neonInput = ref<HTMLElement | null>(null);\n    const focused = ref(false);\n\n    const sanitizedAttributes = computed(() => {\n      const {\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        onBlur,\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        onFocus,\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        onIconClick,\n        ...sanitized\n      } = attrs;\n\n      return sanitized;\n    });\n\n    const emitModelValue = NeonDebounceUtils.debounce((value: string) => {\n      emit('update:modelValue', value);\n    }, props.debounce);\n\n    const iconName = computed(() => {\n      switch (props.state) {\n        case NeonState.Loading:\n          return 'loading';\n        case NeonState.Success:\n          return props.stateIcon ? 'check' : undefined;\n        case NeonState.Error:\n          return props.stateIcon ? 'times' : undefined;\n        default:\n          if (props.icon) {\n            return props.icon;\n          } else if (props.modelValue && props.modelValue.length > 0) {\n            return 'times';\n          }\n\n          return undefined;\n      }\n    });\n\n    const iconVisible = computed(() => {\n      return (\n        iconName.value &&\n        !props.hideIcon &&\n        (props.state !== 'ready' || props.icon || (props.modelValue && !props.disabled && props.modelValue.length > 0))\n      );\n    });\n\n    const iconColor = computed(() => {\n      switch (props.state) {\n        case NeonState.Success:\n          return NeonFunctionalColor.Success;\n        case NeonState.Error:\n          return NeonFunctionalColor.Error;\n        case NeonState.Loading:\n          return props.color;\n        default:\n          return NeonFunctionalColor.LowContrast;\n      }\n    });\n\n    const counterLabel = computed<string | null>(() => {\n      if (props.maxlength && props.maxlength > 0) {\n        const templates = props.maxlengthLabel.split(' | ');\n        const remainingChars = props.maxlength - props.modelValue.length;\n        switch (remainingChars) {\n          case 0:\n            return templates[0];\n          case 1:\n            return templates[1];\n          default:\n            return templates[2].replace('{count}', `${remainingChars}`);\n        }\n      }\n      return null;\n    });\n\n    const focus = () => {\n      neonInput.value?.focus();\n    };\n\n    const click = () => {\n      neonInput.value?.click();\n    };\n\n    const onFocus = () => {\n      focused.value = true;\n      emit('focus');\n    };\n\n    const onBlur = () => {\n      focused.value = false;\n      emit('blur');\n    };\n\n    const iconClicked = ($event: Event) => {\n      if (!props.disabled) {\n        if (props.icon) {\n          emit('icon-click');\n        } else {\n          emitModelValue('');\n          setTimeout(focus);\n        }\n        $event.preventDefault();\n        $event.stopPropagation();\n      }\n    };\n\n    const changeValue = (event: InputEvent) => {\n      const val = (event.target as HTMLInputElement).value;\n      const v = props.maxlength && val.length > props.maxlength ? val.substring(0, props.maxlength) : val;\n      if (props.modelValue !== v) {\n        emitModelValue(v);\n      }\n    };\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (\n        event.key !== 'Backspace' &&\n        props.maxlength &&\n        props.modelValue &&\n        props.modelValue.length >= props.maxlength\n      ) {\n        event.preventDefault();\n      }\n    };\n\n    const computedPlaceholder = computed(() => {\n      if (props.placeholder) {\n        return props.placeholder;\n      } else {\n        switch (props.type) {\n          case NeonInputType.Email:\n            return 'gbelson@hooli.com';\n          case NeonInputType.Tel:\n            return '+41785551234';\n          case NeonInputType.Url:\n            return 'http://www.getskeleton.com';\n          default:\n            return '';\n        }\n      }\n    });\n\n    expose({ neonInput });\n\n    return {\n      neonInput,\n      focused,\n      sanitizedAttributes,\n      iconVisible,\n      iconName,\n      iconColor,\n      computedPlaceholder,\n      counterLabel,\n      focus,\n      click,\n      onFocus,\n      onBlur,\n      iconClicked,\n      changeValue,\n      onKeyDown,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonInputType","NeonSize","NeonFunctionalColor","NeonInputMode","NeonState","props","emit","expose","attrs","useAttrs","neonInput","ref","focused","sanitizedAttributes","computed","onBlur","onFocus","onIconClick","sanitized","emitModelValue","NeonDebounceUtils","value","iconName","iconVisible","iconColor","counterLabel","templates","remainingChars","focus","_a","click","iconClicked","$event","changeValue","event","val","v","onKeyDown","computedPlaceholder"],"mappings":"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"}
+{"version":3,"file":"NeonInput.es.js","sources":["../../../../src/components/user-input/input/NeonInput.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent, ref, useAttrs } from 'vue';\nimport { NeonInputType } from '@/common/enums/NeonInputType';\nimport { NeonState } from '@/common/enums/NeonState';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { NeonDebounceUtils } from '@/common/utils/NeonDebounceUtils';\nimport { NeonInputMode } from '@/common/enums/NeonInputMode';\n\n/**\n * Equivalent of, and wrapper around, an HTML input. Also supports <strong>textarea</strong>.\n */\nexport default defineComponent({\n  name: 'NeonInput',\n  components: {\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The id the input\n     */\n    id: { type: String, default: null },\n    /**\n     * The value of the input\n     */\n    modelValue: { type: String, default: null },\n    /**\n     * The type of input this is. NOTE: Neon provides custom components as alternatives in the following cases:\n     * * file (use <a href=\"/user-input/file\">NeonFile</a>)\n     * * password (use <a href=\"/user-input/password\">NeonPassword</a>)\n     */\n    type: { type: String as () => NeonInputType, default: NeonInputType.Text },\n    /**\n     * Placeholder text to display in the input\n     */\n    placeholder: { type: String, default: null },\n    /**\n     * Size of the input\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Medium },\n    /**\n     * Color of the input\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Primary },\n    /**\n     * The HTML input mode as specified <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode\">here</a>.\n     */\n    inputmode: { type: String as () => NeonInputMode, default: NeonInputMode.Text },\n    /**\n     * The HTML autocomplete mode as specified <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values\">here</a>.\n     * NOTE: No enum is provided in Neon as some values can be used in combination, please refer to the full list of values in the preceding link.\n     */\n    autocomplete: { type: String, default: 'on' },\n    /**\n     * The state of the input\n     */\n    state: { type: String as () => NeonState, default: NeonState.Ready },\n    /**\n     * The number of rows to display in the case of a textarea\n     */\n    rows: { type: Number, default: null },\n    /**\n     * The name of a clickable icon to display inside the input. This is used for clearing contents or e.g. in the case of\n     * NeonPassword toggle showing/hiding the password. Defaults to <em>times</em> (for clearing the input's contents).\n     */\n    icon: { type: String, default: null },\n    /**\n     * Make the input field icon read-only, i.e. it will not emit events or be treated as a focusable button.\n     */\n    iconReadonly: { type: Boolean, default: false },\n    /**\n     * Hide the icon button, e.g. the X button to clear the input's contents.\n     */\n    hideIcon: { type: Boolean, default: false },\n    /**\n     * Tabindex to assign to the input.\n     */\n    tabindex: { type: Number, default: 0 },\n    /**\n     * The disabled state of the input\n     */\n    disabled: { type: Boolean, default: false },\n    /**\n     * When the state is success or error, display the field with the state color indicator, e.g. border or background\n     * color.\n     */\n    stateHighlight: { type: Boolean, default: true },\n    /**\n     * When the state is success or error, display the state icon.\n     */\n    stateIcon: { type: Boolean, default: true },\n    /**\n     * The character limit for a textarea.\n     */\n    maxlength: { type: Number, default: null },\n    /**\n     * The label template for the character limit. This is a string in the vue-i18n Pluralization format with a\n     * <em>{count}</em> placeholder.\n     */\n    maxlengthLabel: { type: String, default: 'No characters left | 1 character left | {count} characters left' },\n    /**\n     * Debounce time in ms. If no value is provided, the default value set in NeonDebounceUtils is used (=0ms).\n     */\n    debounce: { type: Number, default: undefined },\n  },\n  emits: [\n    /**\n     * Emitted when the input has gained focus\n     * @type {void}\n     */\n    'focus',\n    /**\n     * Emitted when the input has lost focus\n     * @type {void}\n     */\n    'blur',\n    /**\n     * Emitted when the icon is clicked\n     * @type {void}\n     */\n    'icon-click',\n    /**\n     * Emitted when the input value is changed, NOTE: is not triggered if input is over the textarea length limit\n     * @type {string} the contents of the input\n     */\n    'update:modelValue',\n  ],\n  setup(props, { emit, expose }) {\n    const attrs = useAttrs();\n    const neonInput = ref<HTMLElement | null>(null);\n    const focused = ref(false);\n\n    const sanitizedAttributes = computed(() => {\n      const {\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        onBlur,\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        onFocus,\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        onIconClick,\n        ...sanitized\n      } = attrs;\n\n      return sanitized;\n    });\n\n    const emitModelValue = NeonDebounceUtils.debounce((value: string) => {\n      emit('update:modelValue', value);\n    }, props.debounce);\n\n    const iconName = computed(() => {\n      switch (props.state) {\n        case NeonState.Loading:\n          return 'loading';\n        case NeonState.Success:\n          return props.stateIcon ? 'check' : undefined;\n        case NeonState.Error:\n          return props.stateIcon ? 'times' : undefined;\n        default:\n          if (props.icon) {\n            return props.icon;\n          } else if (props.modelValue && (props.modelValue?.length || 0) > 0) {\n            return 'times';\n          }\n\n          return undefined;\n      }\n    });\n\n    const iconVisible = computed(() => {\n      return (\n        iconName.value &&\n        !props.hideIcon &&\n        (props.state !== 'ready' ||\n          props.icon ||\n          (props.modelValue && !props.disabled && (props.modelValue?.length || 0) > 0))\n      );\n    });\n\n    const iconColor = computed(() => {\n      switch (props.state) {\n        case NeonState.Success:\n          return NeonFunctionalColor.Success;\n        case NeonState.Error:\n          return NeonFunctionalColor.Error;\n        case NeonState.Loading:\n          return props.color;\n        default:\n          return NeonFunctionalColor.LowContrast;\n      }\n    });\n\n    const counterLabel = computed<string | null>(() => {\n      if (props.maxlength && props.maxlength > 0) {\n        const templates = props.maxlengthLabel.split(' | ');\n        const remainingChars = props.maxlength - (props.modelValue?.length || 0);\n        switch (remainingChars) {\n          case 0:\n            return templates[0];\n          case 1:\n            return templates[1];\n          default:\n            return templates[2].replace('{count}', `${remainingChars}`);\n        }\n      }\n      return null;\n    });\n\n    const focus = () => {\n      neonInput.value?.focus();\n    };\n\n    const click = () => {\n      neonInput.value?.click();\n    };\n\n    const onFocus = () => {\n      focused.value = true;\n      emit('focus');\n    };\n\n    const onBlur = () => {\n      focused.value = false;\n      emit('blur');\n    };\n\n    const iconClicked = ($event: Event) => {\n      if (!props.disabled) {\n        if (props.icon) {\n          emit('icon-click');\n        } else {\n          emitModelValue('');\n          setTimeout(focus);\n        }\n        $event.preventDefault();\n        $event.stopPropagation();\n      }\n    };\n\n    const changeValue = (event: InputEvent) => {\n      const val = (event.target as HTMLInputElement).value;\n      const v = props.maxlength && val.length > props.maxlength ? val.substring(0, props.maxlength) : val;\n      if (props.modelValue !== v) {\n        emitModelValue(v);\n      }\n    };\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (\n        event.key !== 'Backspace' &&\n        props.maxlength &&\n        props.modelValue &&\n        (props.modelValue?.length || 0) >= props.maxlength\n      ) {\n        event.preventDefault();\n      }\n    };\n\n    const computedPlaceholder = computed(() => props.placeholder || '');\n\n    expose({ neonInput });\n\n    return {\n      neonInput,\n      focused,\n      sanitizedAttributes,\n      iconVisible,\n      iconName,\n      iconColor,\n      computedPlaceholder,\n      counterLabel,\n      focus,\n      click,\n      onFocus,\n      onBlur,\n      iconClicked,\n      changeValue,\n      onKeyDown,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonInputType","NeonSize","NeonFunctionalColor","NeonInputMode","NeonState","props","emit","expose","attrs","useAttrs","neonInput","ref","focused","sanitizedAttributes","computed","onBlur","onFocus","onIconClick","sanitized","emitModelValue","NeonDebounceUtils","value","iconName","_a","iconVisible","iconColor","counterLabel","templates","remainingChars","focus","click","iconClicked","$event","changeValue","event","val","v","onKeyDown","computedPlaceholder"],"mappings":"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"}