@aotearoan/neon 21.0.3 → 22.0.1

package/dist/components/layout/page/NeonPage.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const n=require("vue"),s=n.defineComponent({name:"NeonPage",setup(){const e=()=>{const t=window.innerHeight*.01;document.documentElement.style.setProperty("--vh",`${t}rem`);const o=window.innerWidth*.01;document.documentElement.style.setProperty("--vw",`${o}rem`)};n.onMounted(()=>{window.addEventListener("resize",e,{passive:!0}),e()}),n.onUnmounted(()=>{window.removeEventListener("resize",e)})}});module.exports=s;
+"use strict";const n=require("vue"),r=n.defineComponent({name:"NeonPage",setup(i,{slots:t}){const e=()=>{const o=window.innerHeight*.01;document.documentElement.style.setProperty("--vh",`${o}rem`);const s=window.innerWidth*.01;document.documentElement.style.setProperty("--vw",`${s}rem`)};return n.onMounted(()=>{window.addEventListener("resize",e,{passive:!0}),e()}),n.onUnmounted(()=>{window.removeEventListener("resize",e)}),{slots:t}}});module.exports=r;
 //# sourceMappingURL=NeonPage.cjs.js.map

package/dist/components/layout/page/NeonPage.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonPage.cjs.js","sources":["../../../../src/components/layout/page/NeonPage.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { defineComponent, onMounted, onUnmounted } from 'vue';\n\n/**\n * A \"page\" component, this is defined as a wrapper around the contents (NeonGrid, etc) and footer which provides the\n * correct responsive layout accounting for NeonTopNav and NeonSideNav components being used.\n */\nexport default defineComponent({\n  name: 'NeonPage',\n  setup() {\n    const handleResize = () => {\n      const vh = window.innerHeight * 0.01;\n      document.documentElement.style.setProperty('--vh', `${vh}rem`);\n      const vw = window.innerWidth * 0.01;\n      document.documentElement.style.setProperty('--vw', `${vw}rem`);\n    };\n\n    onMounted(() => {\n      window.addEventListener('resize', handleResize, { passive: true });\n      handleResize();\n    });\n\n    onUnmounted(() => {\n      window.removeEventListener('resize', handleResize);\n    });\n  },\n});\n"],"names":["_sfc_main","defineComponent","handleResize","vh","vw","onMounted","onUnmounted"],"mappings":"oCAMAA,EAAeC,kBAAgB,CAC7B,KAAM,WACN,OAAQ,CACN,MAAMC,EAAe,IAAM,CACzB,MAAMC,EAAK,OAAO,YAAc,IAChC,SAAS,gBAAgB,MAAM,YAAY,OAAQ,GAAGA,CAAE,KAAK,EAC7D,MAAMC,EAAK,OAAO,WAAa,IAC/B,SAAS,gBAAgB,MAAM,YAAY,OAAQ,GAAGA,CAAE,KAAK,CAC/D,EAEAC,EAAAA,UAAU,IAAM,CACd,OAAO,iBAAiB,SAAUH,EAAc,CAAE,QAAS,GAAM,EACjEA,EAAA,CACF,CAAC,EAEDI,EAAAA,YAAY,IAAM,CAChB,OAAO,oBAAoB,SAAUJ,CAAY,CACnD,CAAC,CACH,CACF,CAAC"}
+{"version":3,"file":"NeonPage.cjs.js","sources":["../../../../src/components/layout/page/NeonPage.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { defineComponent, onMounted, onUnmounted } from 'vue';\n\n/**\n * A \"page\" component, this is defined as a wrapper around the contents (NeonGrid, etc) and footer which provides the\n * correct responsive layout accounting for NeonTopNav and NeonSideNav components being used.\n */\nexport default defineComponent({\n  name: 'NeonPage',\n  setup(_props, { slots }) {\n    const handleResize = () => {\n      const vh = window.innerHeight * 0.01;\n      document.documentElement.style.setProperty('--vh', `${vh}rem`);\n      const vw = window.innerWidth * 0.01;\n      document.documentElement.style.setProperty('--vw', `${vw}rem`);\n    };\n\n    onMounted(() => {\n      window.addEventListener('resize', handleResize, { passive: true });\n      handleResize();\n    });\n\n    onUnmounted(() => {\n      window.removeEventListener('resize', handleResize);\n    });\n\n    return { slots };\n  },\n});\n"],"names":["_sfc_main","defineComponent","_props","slots","handleResize","vh","vw","onMounted","onUnmounted"],"mappings":"oCAMAA,EAAeC,kBAAgB,CAC7B,KAAM,WACN,MAAMC,EAAQ,CAAE,MAAAC,GAAS,CACvB,MAAMC,EAAe,IAAM,CACzB,MAAMC,EAAK,OAAO,YAAc,IAChC,SAAS,gBAAgB,MAAM,YAAY,OAAQ,GAAGA,CAAE,KAAK,EAC7D,MAAMC,EAAK,OAAO,WAAa,IAC/B,SAAS,gBAAgB,MAAM,YAAY,OAAQ,GAAGA,CAAE,KAAK,CAC/D,EAEAC,OAAAA,EAAAA,UAAU,IAAM,CACd,OAAO,iBAAiB,SAAUH,EAAc,CAAE,QAAS,GAAM,EACjEA,EAAA,CACF,CAAC,EAEDI,EAAAA,YAAY,IAAM,CAChB,OAAO,oBAAoB,SAAUJ,CAAY,CACnD,CAAC,EAEM,CAAE,MAAAD,CAAA,CACX,CACF,CAAC"}

package/dist/components/layout/page/NeonPage.es.js

@@ -1,21 +1,21 @@
-import { defineComponent as o, onMounted as s, onUnmounted as i } from "vue";
-const d = o({
+import { defineComponent as r, onMounted as s, onUnmounted as i } from "vue";
+const u = r({
   name: "NeonPage",
-  setup() {
+  setup(d, { slots: n }) {
     const e = () => {
-      const n = window.innerHeight * 0.01;
-      document.documentElement.style.setProperty("--vh", `${n}rem`);
-      const t = window.innerWidth * 0.01;
-      document.documentElement.style.setProperty("--vw", `${t}rem`);
+      const t = window.innerHeight * 0.01;
+      document.documentElement.style.setProperty("--vh", `${t}rem`);
+      const o = window.innerWidth * 0.01;
+      document.documentElement.style.setProperty("--vw", `${o}rem`);
     };
-    s(() => {
+    return s(() => {
       window.addEventListener("resize", e, { passive: !0 }), e();
     }), i(() => {
       window.removeEventListener("resize", e);
-    });
+    }), { slots: n };
   }
 });
 export {
-  d as default
+  u as default
 };
 //# sourceMappingURL=NeonPage.es.js.map

package/dist/components/layout/page/NeonPage.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonPage.es.js","sources":["../../../../src/components/layout/page/NeonPage.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { defineComponent, onMounted, onUnmounted } from 'vue';\n\n/**\n * A \"page\" component, this is defined as a wrapper around the contents (NeonGrid, etc) and footer which provides the\n * correct responsive layout accounting for NeonTopNav and NeonSideNav components being used.\n */\nexport default defineComponent({\n  name: 'NeonPage',\n  setup() {\n    const handleResize = () => {\n      const vh = window.innerHeight * 0.01;\n      document.documentElement.style.setProperty('--vh', `${vh}rem`);\n      const vw = window.innerWidth * 0.01;\n      document.documentElement.style.setProperty('--vw', `${vw}rem`);\n    };\n\n    onMounted(() => {\n      window.addEventListener('resize', handleResize, { passive: true });\n      handleResize();\n    });\n\n    onUnmounted(() => {\n      window.removeEventListener('resize', handleResize);\n    });\n  },\n});\n"],"names":["_sfc_main","defineComponent","handleResize","vh","vw","onMounted","onUnmounted"],"mappings":";AAMA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,QAAQ;AACN,UAAMC,IAAe,MAAM;AACzB,YAAMC,IAAK,OAAO,cAAc;AAChC,eAAS,gBAAgB,MAAM,YAAY,QAAQ,GAAGA,CAAE,KAAK;AAC7D,YAAMC,IAAK,OAAO,aAAa;AAC/B,eAAS,gBAAgB,MAAM,YAAY,QAAQ,GAAGA,CAAE,KAAK;AAAA,IAC/D;AAEA,IAAAC,EAAU,MAAM;AACd,aAAO,iBAAiB,UAAUH,GAAc,EAAE,SAAS,IAAM,GACjEA,EAAA;AAAA,IACF,CAAC,GAEDI,EAAY,MAAM;AAChB,aAAO,oBAAoB,UAAUJ,CAAY;AAAA,IACnD,CAAC;AAAA,EACH;AACF,CAAC;"}
+{"version":3,"file":"NeonPage.es.js","sources":["../../../../src/components/layout/page/NeonPage.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { defineComponent, onMounted, onUnmounted } from 'vue';\n\n/**\n * A \"page\" component, this is defined as a wrapper around the contents (NeonGrid, etc) and footer which provides the\n * correct responsive layout accounting for NeonTopNav and NeonSideNav components being used.\n */\nexport default defineComponent({\n  name: 'NeonPage',\n  setup(_props, { slots }) {\n    const handleResize = () => {\n      const vh = window.innerHeight * 0.01;\n      document.documentElement.style.setProperty('--vh', `${vh}rem`);\n      const vw = window.innerWidth * 0.01;\n      document.documentElement.style.setProperty('--vw', `${vw}rem`);\n    };\n\n    onMounted(() => {\n      window.addEventListener('resize', handleResize, { passive: true });\n      handleResize();\n    });\n\n    onUnmounted(() => {\n      window.removeEventListener('resize', handleResize);\n    });\n\n    return { slots };\n  },\n});\n"],"names":["_sfc_main","defineComponent","_props","slots","handleResize","vh","vw","onMounted","onUnmounted"],"mappings":";AAMA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,MAAMC,GAAQ,EAAE,OAAAC,KAAS;AACvB,UAAMC,IAAe,MAAM;AACzB,YAAMC,IAAK,OAAO,cAAc;AAChC,eAAS,gBAAgB,MAAM,YAAY,QAAQ,GAAGA,CAAE,KAAK;AAC7D,YAAMC,IAAK,OAAO,aAAa;AAC/B,eAAS,gBAAgB,MAAM,YAAY,QAAQ,GAAGA,CAAE,KAAK;AAAA,IAC/D;AAEA,WAAAC,EAAU,MAAM;AACd,aAAO,iBAAiB,UAAUH,GAAc,EAAE,SAAS,IAAM,GACjEA,EAAA;AAAA,IACF,CAAC,GAEDI,EAAY,MAAM;AAChB,aAAO,oBAAoB,UAAUJ,CAAY;AAAA,IACnD,CAAC,GAEM,EAAE,OAAAD,EAAA;AAAA,EACX;AACF,CAAC;"}

package/dist/components/layout/page/NeonPage.vue.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const o=require("./NeonPage.cjs.js"),e=require("vue"),s=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),t={class:"neon-page__container"};function r(n,l,i,p,c,d){return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["neon-page",{"neon-page--with-top-nav":n.$slots["top-nav"],"neon-page--with-side-nav":n.$slots["side-nav"]}])},[e.renderSlot(n.$slots,"top-nav"),e.renderSlot(n.$slots,"side-nav"),e.createElementVNode("div",t,[e.renderSlot(n.$slots,"content")])],2)}const a=s(o,[["render",r]]);module.exports=a;
+"use strict";const o=require("./NeonPage.cjs.js"),e=require("vue"),s=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),t={class:"neon-page__container"};function r(n,l,i,p,c,d){return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([{"neon-page--with-top-nav":n.slots["top-nav"],"neon-page--with-side-nav":n.slots["side-nav"]},"neon-page"])},[e.renderSlot(n.$slots,"top-nav"),e.renderSlot(n.$slots,"side-nav"),e.createElementVNode("div",t,[e.renderSlot(n.$slots,"content")])],2)}const a=s(o,[["render",r]]);module.exports=a;
 //# sourceMappingURL=NeonPage.vue.cjs.js.map

package/dist/components/layout/page/NeonPage.vue.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonPage.vue.cjs.js","sources":["../../../../src/components/layout/page/NeonPage.vue"],"sourcesContent":["<template>\n  <div\n    class=\"neon-page\"\n    :class=\"{ 'neon-page--with-top-nav': $slots['top-nav'], 'neon-page--with-side-nav': $slots['side-nav'] }\"\n  >\n    <!-- @slot The <strong>NeonTopNav</strong> slot. This slot is required to ensure the correct responsive page layout. -->\n    <slot name=\"top-nav\"></slot>\n    <!-- @slot The <strong>NeonSideNav</strong> slot. This slot is required to ensure the correct responsive page layout. -->\n    <slot name=\"side-nav\"></slot>\n    <div class=\"neon-page__container\">\n      <!-- @slot The main page content -->\n      <slot name=\"content\"></slot>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonPage.ts\"></script>\n"],"names":["_hoisted_1","_createElementBlock","_normalizeClass","_ctx","_renderSlot","_createElementVNode"],"mappings":"mIASSA,EAAA,CAAA,MAAM,sBAAsB,+CARnCC,EAAAA,mBAYM,MAAA,CAXJ,MAAKC,EAAAA,eAAA,CAAC,YAAW,CAAA,0BACoBC,EAAA,6CAA+CA,EAAA,OAAM,UAAA,CAAA,CAAA,CAAA,IAG1FC,aAA4BD,EAAA,OAAA,SAAA,EAE5BC,aAA6BD,EAAA,OAAA,UAAA,EAC7BE,EAAAA,mBAGM,MAHNL,EAGM,CADJI,aAA4BD,EAAA,OAAA,SAAA"}
+{"version":3,"file":"NeonPage.vue.cjs.js","sources":["../../../../src/components/layout/page/NeonPage.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"{ 'neon-page--with-top-nav': slots['top-nav'], 'neon-page--with-side-nav': slots['side-nav'] }\"\n    class=\"neon-page\"\n  >\n    <!-- @slot The <strong>NeonTopNav</strong> slot. This slot is required to ensure the correct responsive page layout. -->\n    <slot name=\"top-nav\"></slot>\n    <!-- @slot The <strong>NeonSideNav</strong> slot. This slot is required to ensure the correct responsive page layout. -->\n    <slot name=\"side-nav\"></slot>\n    <div class=\"neon-page__container\">\n      <!-- @slot The main page content -->\n      <slot name=\"content\"></slot>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonPage.ts\"></script>\n"],"names":["_hoisted_1","_createElementBlock","_normalizeClass","_ctx","_renderSlot","_createElementVNode"],"mappings":"mIASSA,EAAA,CAAA,MAAM,sBAAsB,+CARnCC,EAAAA,mBAYM,MAAA,CAXH,MAAKC,EAAAA,eAAA,CAAA,CAAA,0BAA+BC,EAAA,MAAK,SAAA,EAAA,2BAAyCA,EAAA,mBAC7E,WAAW,CAAA,IAGjBC,aAA4BD,EAAA,OAAA,SAAA,EAE5BC,aAA6BD,EAAA,OAAA,UAAA,EAC7BE,EAAAA,mBAGM,MAHNL,EAGM,CADJI,aAA4BD,EAAA,OAAA,SAAA"}

package/dist/components/layout/page/NeonPage.vue.es.js

@@ -2,9 +2,9 @@ import n from "./NeonPage.es.js";
 import { openBlock as s, createElementBlock as t, normalizeClass as a, renderSlot as o, createElementVNode as r } from "vue";
 import p from "../../../_virtual/_plugin-vue_export-helper.es.js";
 const i = { class: "neon-page__container" };
-function l(e, c, d, m, $, f) {
+function l(e, c, d, m, f, v) {
   return s(), t("div", {
-    class: a(["neon-page", { "neon-page--with-top-nav": e.$slots["top-nav"], "neon-page--with-side-nav": e.$slots["side-nav"] }])
+    class: a([{ "neon-page--with-top-nav": e.slots["top-nav"], "neon-page--with-side-nav": e.slots["side-nav"] }, "neon-page"])
   }, [
     o(e.$slots, "top-nav"),
     o(e.$slots, "side-nav"),

package/dist/components/layout/page/NeonPage.vue.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonPage.vue.es.js","sources":["../../../../src/components/layout/page/NeonPage.vue"],"sourcesContent":["<template>\n  <div\n    class=\"neon-page\"\n    :class=\"{ 'neon-page--with-top-nav': $slots['top-nav'], 'neon-page--with-side-nav': $slots['side-nav'] }\"\n  >\n    <!-- @slot The <strong>NeonTopNav</strong> slot. This slot is required to ensure the correct responsive page layout. -->\n    <slot name=\"top-nav\"></slot>\n    <!-- @slot The <strong>NeonSideNav</strong> slot. This slot is required to ensure the correct responsive page layout. -->\n    <slot name=\"side-nav\"></slot>\n    <div class=\"neon-page__container\">\n      <!-- @slot The main page content -->\n      <slot name=\"content\"></slot>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonPage.ts\"></script>\n"],"names":["_hoisted_1","_createElementBlock","_normalizeClass","_ctx","_renderSlot","_createElementVNode"],"mappings":";;;AASS,MAAAA,IAAA,EAAA,OAAM,uBAAsB;;cARnCC,EAYM,OAAA;AAAA,IAXJ,OAAKC,EAAA,CAAC,aAAW,EAAA,2BACoBC,EAAA,+CAA+CA,EAAA,OAAM,UAAA,EAAA,CAAA,CAAA;AAAA;IAG1FC,EAA4BD,EAAA,QAAA,SAAA;AAAA,IAE5BC,EAA6BD,EAAA,QAAA,UAAA;AAAA,IAC7BE,EAGM,OAHNL,GAGM;AAAA,MADJI,EAA4BD,EAAA,QAAA,SAAA;AAAA;;;;"}
+{"version":3,"file":"NeonPage.vue.es.js","sources":["../../../../src/components/layout/page/NeonPage.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"{ 'neon-page--with-top-nav': slots['top-nav'], 'neon-page--with-side-nav': slots['side-nav'] }\"\n    class=\"neon-page\"\n  >\n    <!-- @slot The <strong>NeonTopNav</strong> slot. This slot is required to ensure the correct responsive page layout. -->\n    <slot name=\"top-nav\"></slot>\n    <!-- @slot The <strong>NeonSideNav</strong> slot. This slot is required to ensure the correct responsive page layout. -->\n    <slot name=\"side-nav\"></slot>\n    <div class=\"neon-page__container\">\n      <!-- @slot The main page content -->\n      <slot name=\"content\"></slot>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonPage.ts\"></script>\n"],"names":["_hoisted_1","_createElementBlock","_normalizeClass","_ctx","_renderSlot","_createElementVNode"],"mappings":";;;AASS,MAAAA,IAAA,EAAA,OAAM,uBAAsB;;cARnCC,EAYM,OAAA;AAAA,IAXH,OAAKC,EAAA,CAAA,EAAA,2BAA+BC,EAAA,MAAK,SAAA,GAAA,4BAAyCA,EAAA,qBAC7E,WAAW,CAAA;AAAA;IAGjBC,EAA4BD,EAAA,QAAA,SAAA;AAAA,IAE5BC,EAA6BD,EAAA,QAAA,UAAA;AAAA,IAC7BE,EAGM,OAHNL,GAGM;AAAA,MADJI,EAA4BD,EAAA,QAAA,SAAA;AAAA;;;;"}

package/dist/components/layout/side-nav/NeonSideNav.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const e=require("vue"),n=e.defineComponent({name:"NeonSideNav",props:{fullWidth:{type:Boolean,default:!1}}});module.exports=n;
+"use strict";const t=require("vue"),n=t.defineComponent({name:"NeonSideNav",props:{fullWidth:{type:Boolean,default:!1}},setup(o,{slots:e}){return{slots:e}}});module.exports=n;
 //# sourceMappingURL=NeonSideNav.cjs.js.map

package/dist/components/layout/side-nav/NeonSideNav.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonSideNav.cjs.js","sources":["../../../../src/components/layout/side-nav/NeonSideNav.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\n\n/**\n * A side navigation component. This is displayed at the <em>larger-than-tablet</em> breakpoint and hidden at\n * <em>tablet</em> and below. Use this to display menus, navigation or other items related to the main page content. A\n * side nave had two slots, one for <em>sticky</em> content which remains visible at all times. The other is for\n * <em>scrolling content</em> which is allowed to overflow below the bottom of the page.\n */\nexport default defineComponent({\n  name: 'NeonSideNav',\n  props: {\n    /**\n     * If true, removes the side nav component's padding.\n     */\n    fullWidth: { type: Boolean, default: false },\n  },\n});\n"],"names":["_sfc_main","defineComponent"],"mappings":"oCAQAA,EAAeC,kBAAgB,CAC7B,KAAM,cACN,MAAO,CAIL,UAAW,CAAE,KAAM,QAAS,QAAS,EAAA,CAAM,CAE/C,CAAC"}
+{"version":3,"file":"NeonSideNav.cjs.js","sources":["../../../../src/components/layout/side-nav/NeonSideNav.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\n\n/**\n * A side navigation component. This is displayed at the <em>larger-than-tablet</em> breakpoint and hidden at\n * <em>tablet</em> and below. Use this to display menus, navigation or other items related to the main page content. A\n * side nave had two slots, one for <em>sticky</em> content which remains visible at all times. The other is for\n * <em>scrolling content</em> which is allowed to overflow below the bottom of the page.\n */\nexport default defineComponent({\n  name: 'NeonSideNav',\n  props: {\n    /**\n     * If true, removes the side nav component's padding.\n     */\n    fullWidth: { type: Boolean, default: false },\n  },\n  setup(_props, { slots }) {\n    return { slots };\n  },\n});\n"],"names":["_sfc_main","defineComponent","_props","slots"],"mappings":"oCAQAA,EAAeC,kBAAgB,CAC7B,KAAM,cACN,MAAO,CAIL,UAAW,CAAE,KAAM,QAAS,QAAS,EAAA,CAAM,EAE7C,MAAMC,EAAQ,CAAE,MAAAC,GAAS,CACvB,MAAO,CAAE,MAAAA,CAAA,CACX,CACF,CAAC"}

package/dist/components/layout/side-nav/NeonSideNav.es.js

@@ -1,14 +1,17 @@
-import { defineComponent as e } from "vue";
-const a = e({
+import { defineComponent as o } from "vue";
+const p = o({
   name: "NeonSideNav",
   props: {
     /**
      * If true, removes the side nav component's padding.
      */
     fullWidth: { type: Boolean, default: !1 }
+  },
+  setup(t, { slots: e }) {
+    return { slots: e };
   }
 });
 export {
-  a as default
+  p as default
 };
 //# sourceMappingURL=NeonSideNav.es.js.map

package/dist/components/layout/side-nav/NeonSideNav.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonSideNav.es.js","sources":["../../../../src/components/layout/side-nav/NeonSideNav.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\n\n/**\n * A side navigation component. This is displayed at the <em>larger-than-tablet</em> breakpoint and hidden at\n * <em>tablet</em> and below. Use this to display menus, navigation or other items related to the main page content. A\n * side nave had two slots, one for <em>sticky</em> content which remains visible at all times. The other is for\n * <em>scrolling content</em> which is allowed to overflow below the bottom of the page.\n */\nexport default defineComponent({\n  name: 'NeonSideNav',\n  props: {\n    /**\n     * If true, removes the side nav component's padding.\n     */\n    fullWidth: { type: Boolean, default: false },\n  },\n});\n"],"names":["_sfc_main","defineComponent"],"mappings":";AAQA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,WAAW,EAAE,MAAM,SAAS,SAAS,GAAA;AAAA,EAAM;AAE/C,CAAC;"}
+{"version":3,"file":"NeonSideNav.es.js","sources":["../../../../src/components/layout/side-nav/NeonSideNav.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { defineComponent } from 'vue';\n\n/**\n * A side navigation component. This is displayed at the <em>larger-than-tablet</em> breakpoint and hidden at\n * <em>tablet</em> and below. Use this to display menus, navigation or other items related to the main page content. A\n * side nave had two slots, one for <em>sticky</em> content which remains visible at all times. The other is for\n * <em>scrolling content</em> which is allowed to overflow below the bottom of the page.\n */\nexport default defineComponent({\n  name: 'NeonSideNav',\n  props: {\n    /**\n     * If true, removes the side nav component's padding.\n     */\n    fullWidth: { type: Boolean, default: false },\n  },\n  setup(_props, { slots }) {\n    return { slots };\n  },\n});\n"],"names":["_sfc_main","defineComponent","_props","slots"],"mappings":";AAQA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,WAAW,EAAE,MAAM,SAAS,SAAS,GAAA;AAAA,EAAM;AAAA,EAE7C,MAAMC,GAAQ,EAAE,OAAAC,KAAS;AACvB,WAAO,EAAE,OAAAA,EAAA;AAAA,EACX;AACF,CAAC;"}

package/dist/components/layout/side-nav/NeonSideNav.vue.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const s=require("./NeonSideNav.cjs.js"),e=require("vue"),n=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),t={key:0,class:"neon-side-nav__sticky"},l={key:1},r={key:2,class:"neon-side-nav__scrolling"},c={class:"neon-side-nav__scrolling-container"};function i(o,d,_,u,k,p){return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["neon-side-nav",{"neon-side-nav--full-width":o.fullWidth}])},[o.$slots.sticky?(e.openBlock(),e.createElementBlock("div",t,[e.renderSlot(o.$slots,"sticky")])):e.createCommentVNode("",!0),o.$slots.sticky&&o.$slots.scrolling?(e.openBlock(),e.createElementBlock("hr",l)):e.createCommentVNode("",!0),o.$slots.scrolling?(e.openBlock(),e.createElementBlock("div",r,[e.createElementVNode("div",c,[e.renderSlot(o.$slots,"scrolling")])])):e.createCommentVNode("",!0)],2)}const a=n(s,[["render",i]]);module.exports=a;
+"use strict";const s=require("./NeonSideNav.cjs.js"),e=require("vue"),n=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),t={key:0,class:"neon-side-nav__sticky"},l={key:1},r={key:2,class:"neon-side-nav__scrolling"},c={class:"neon-side-nav__scrolling-container"};function i(o,d,_,u,k,p){return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([{"neon-side-nav--full-width":o.fullWidth},"neon-side-nav"])},[o.slots.sticky?(e.openBlock(),e.createElementBlock("div",t,[e.renderSlot(o.$slots,"sticky")])):e.createCommentVNode("",!0),o.slots.sticky&&o.slots.scrolling?(e.openBlock(),e.createElementBlock("hr",l)):e.createCommentVNode("",!0),o.slots.scrolling?(e.openBlock(),e.createElementBlock("div",r,[e.createElementVNode("div",c,[e.renderSlot(o.$slots,"scrolling")])])):e.createCommentVNode("",!0)],2)}const a=n(s,[["render",i]]);module.exports=a;
 //# sourceMappingURL=NeonSideNav.vue.cjs.js.map

package/dist/components/layout/side-nav/NeonSideNav.vue.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonSideNav.vue.cjs.js","sources":["../../../../src/components/layout/side-nav/NeonSideNav.vue"],"sourcesContent":["<template>\n  <div class=\"neon-side-nav\" :class=\"{ 'neon-side-nav--full-width': fullWidth }\">\n    <div v-if=\"$slots.sticky\" class=\"neon-side-nav__sticky\">\n      <!-- @slot sticky (fixed, non-scrolling) content -->\n      <slot name=\"sticky\"></slot>\n    </div>\n    <hr v-if=\"$slots.sticky && $slots.scrolling\" />\n    <div v-if=\"$slots.scrolling\" class=\"neon-side-nav__scrolling\">\n      <!-- @slot scrolling content -->\n      <div class=\"neon-side-nav__scrolling-container\">\n        <slot name=\"scrolling\"></slot>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonSideNav.ts\"></script>\n"],"names":["_hoisted_4","_createElementBlock","_normalizeClass","_ctx","_openBlock","_hoisted_1","_renderSlot","_hoisted_2","_hoisted_3","_createElementVNode"],"mappings":"+IAE8B,MAAM,4CAKH,MAAM,4BAE5BA,EAAA,CAAA,MAAM,oCAAoC,+CARnDC,EAAAA,mBAYM,MAAA,CAZD,MAAKC,EAAAA,eAAA,CAAC,gBAAe,CAAA,4BAAwCC,EAAA,UAAS,CAAA,IAC9DA,EAAA,OAAO,QAAlBC,EAAAA,YAAAH,EAAAA,mBAGM,MAHNI,EAGM,CADJC,aAA2BH,EAAA,OAAA,QAAA,iCAEnBA,EAAA,OAAO,QAAUA,EAAA,OAAO,yBAAlCF,EAAAA,mBAA+C,KAAAM,CAAA,+BACpCJ,EAAA,OAAO,WAAlBC,EAAAA,YAAAH,EAAAA,mBAKM,MALNO,EAKM,CAHJC,EAAAA,mBAEM,MAFNT,EAEM,CADJM,aAA8BH,EAAA,OAAA,WAAA"}
+{"version":3,"file":"NeonSideNav.vue.cjs.js","sources":["../../../../src/components/layout/side-nav/NeonSideNav.vue"],"sourcesContent":["<template>\n  <div :class=\"{ 'neon-side-nav--full-width': fullWidth }\" class=\"neon-side-nav\">\n    <div v-if=\"slots.sticky\" class=\"neon-side-nav__sticky\">\n      <!-- @slot sticky (fixed, non-scrolling) content -->\n      <slot name=\"sticky\"></slot>\n    </div>\n    <hr v-if=\"slots.sticky && slots.scrolling\" />\n    <div v-if=\"slots.scrolling\" class=\"neon-side-nav__scrolling\">\n      <!-- @slot scrolling content -->\n      <div class=\"neon-side-nav__scrolling-container\">\n        <slot name=\"scrolling\"></slot>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonSideNav.ts\"></script>\n"],"names":["_hoisted_4","_createElementBlock","_normalizeClass","_ctx","_openBlock","_hoisted_1","_renderSlot","_hoisted_2","_hoisted_3","_createElementVNode"],"mappings":"+IAE6B,MAAM,4CAKH,MAAM,4BAE3BA,EAAA,CAAA,MAAM,oCAAoC,+CARnDC,EAAAA,mBAYM,MAAA,CAZA,MAAKC,EAAAA,eAAA,CAAA,CAAA,4BAAiCC,EAAA,SAAS,EAAU,eAAe,CAAA,IACjEA,EAAA,MAAM,QAAjBC,EAAAA,YAAAH,EAAAA,mBAGM,MAHNI,EAGM,CADJC,aAA2BH,EAAA,OAAA,QAAA,iCAEnBA,EAAA,MAAM,QAAUA,EAAA,MAAM,yBAAhCF,EAAAA,mBAA6C,KAAAM,CAAA,+BAClCJ,EAAA,MAAM,WAAjBC,EAAAA,YAAAH,EAAAA,mBAKM,MALNO,EAKM,CAHJC,EAAAA,mBAEM,MAFNT,EAEM,CADJM,aAA8BH,EAAA,OAAA,WAAA"}

package/dist/components/layout/side-nav/NeonSideNav.vue.es.js

@@ -8,15 +8,15 @@ const d = {
   key: 2,
   class: "neon-side-nav__scrolling"
 }, m = { class: "neon-side-nav__scrolling-container" };
-function f(s, p, v, $, k, u) {
+function f(s, p, v, k, u, h) {
   return e(), o("div", {
-    class: l(["neon-side-nav", { "neon-side-nav--full-width": s.fullWidth }])
+    class: l([{ "neon-side-nav--full-width": s.fullWidth }, "neon-side-nav"])
   }, [
-    s.$slots.sticky ? (e(), o("div", d, [
+    s.slots.sticky ? (e(), o("div", d, [
       t(s.$slots, "sticky")
     ])) : n("", !0),
-    s.$slots.sticky && s.$slots.scrolling ? (e(), o("hr", a)) : n("", !0),
-    s.$slots.scrolling ? (e(), o("div", _, [
+    s.slots.sticky && s.slots.scrolling ? (e(), o("hr", a)) : n("", !0),
+    s.slots.scrolling ? (e(), o("div", _, [
       r("div", m, [
         t(s.$slots, "scrolling")
       ])

package/dist/components/layout/side-nav/NeonSideNav.vue.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonSideNav.vue.es.js","sources":["../../../../src/components/layout/side-nav/NeonSideNav.vue"],"sourcesContent":["<template>\n  <div class=\"neon-side-nav\" :class=\"{ 'neon-side-nav--full-width': fullWidth }\">\n    <div v-if=\"$slots.sticky\" class=\"neon-side-nav__sticky\">\n      <!-- @slot sticky (fixed, non-scrolling) content -->\n      <slot name=\"sticky\"></slot>\n    </div>\n    <hr v-if=\"$slots.sticky && $slots.scrolling\" />\n    <div v-if=\"$slots.scrolling\" class=\"neon-side-nav__scrolling\">\n      <!-- @slot scrolling content -->\n      <div class=\"neon-side-nav__scrolling-container\">\n        <slot name=\"scrolling\"></slot>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonSideNav.ts\"></script>\n"],"names":["_hoisted_4","_createElementBlock","_normalizeClass","_ctx","_openBlock","_hoisted_1","_renderSlot","_hoisted_2","_hoisted_3","_createElementVNode"],"mappings":";;;;;EAE8B,OAAM;;;EAKH,OAAM;GAE5BA,IAAA,EAAA,OAAM,qCAAoC;;cARnDC,EAYM,OAAA;AAAA,IAZD,OAAKC,EAAA,CAAC,iBAAe,EAAA,6BAAwCC,EAAA,WAAS,CAAA;AAAA;IAC9DA,EAAA,OAAO,UAAlBC,KAAAH,EAGM,OAHNI,GAGM;AAAA,MADJC,EAA2BH,EAAA,QAAA,QAAA;AAAA;IAEnBA,EAAA,OAAO,UAAUA,EAAA,OAAO,kBAAlCF,EAA+C,MAAAM,CAAA;IACpCJ,EAAA,OAAO,aAAlBC,KAAAH,EAKM,OALNO,GAKM;AAAA,MAHJC,EAEM,OAFNT,GAEM;AAAA,QADJM,EAA8BH,EAAA,QAAA,WAAA;AAAA;;;;;"}
+{"version":3,"file":"NeonSideNav.vue.es.js","sources":["../../../../src/components/layout/side-nav/NeonSideNav.vue"],"sourcesContent":["<template>\n  <div :class=\"{ 'neon-side-nav--full-width': fullWidth }\" class=\"neon-side-nav\">\n    <div v-if=\"slots.sticky\" class=\"neon-side-nav__sticky\">\n      <!-- @slot sticky (fixed, non-scrolling) content -->\n      <slot name=\"sticky\"></slot>\n    </div>\n    <hr v-if=\"slots.sticky && slots.scrolling\" />\n    <div v-if=\"slots.scrolling\" class=\"neon-side-nav__scrolling\">\n      <!-- @slot scrolling content -->\n      <div class=\"neon-side-nav__scrolling-container\">\n        <slot name=\"scrolling\"></slot>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonSideNav.ts\"></script>\n"],"names":["_hoisted_4","_createElementBlock","_normalizeClass","_ctx","_openBlock","_hoisted_1","_renderSlot","_hoisted_2","_hoisted_3","_createElementVNode"],"mappings":";;;;;EAE6B,OAAM;;;EAKH,OAAM;GAE3BA,IAAA,EAAA,OAAM,qCAAoC;;cARnDC,EAYM,OAAA;AAAA,IAZA,OAAKC,EAAA,CAAA,EAAA,6BAAiCC,EAAA,UAAS,GAAU,eAAe,CAAA;AAAA;IACjEA,EAAA,MAAM,UAAjBC,KAAAH,EAGM,OAHNI,GAGM;AAAA,MADJC,EAA2BH,EAAA,QAAA,QAAA;AAAA;IAEnBA,EAAA,MAAM,UAAUA,EAAA,MAAM,kBAAhCF,EAA6C,MAAAM,CAAA;IAClCJ,EAAA,MAAM,aAAjBC,KAAAH,EAKM,OALNO,GAKM;AAAA,MAHJC,EAEM,OAFNT,GAEM;AAAA,QADJM,EAA8BH,EAAA,QAAA,WAAA;AAAA;;;;;"}

package/dist/components/user-input/search/NeonSearch.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const o=require("vue"),A=require("../../../common/enums/NeonSize.cjs.js"),C=require("../../../common/enums/NeonFunctionalColor.cjs.js"),V=require("../../presentation/dropdown/NeonDropdown.vue.cjs.js"),B=require("../../presentation/icon/NeonIcon.vue.cjs.js"),L=require("../input/NeonInput.vue.cjs.js"),z=require("../chip/NeonChip.vue.cjs.js"),i=require("../../../common/enums/NeonDropdownPlacement.cjs.js"),E=require("../../../common/utils/NeonScrollUtils.cjs.js"),T=require("../../../common/enums/NeonInputMode.cjs.js"),U=o.defineComponent({name:"NeonSearch",components:{NeonChip:z,NeonDropdown:V,NeonIcon:B,NeonInput:L},props:{modelValue:{type:[String,Array],required:!0},placeholder:{type:String,required:!0},options:{type:Array,required:!0},multiple:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},size:{type:String,default:A.NeonSize.Medium},color:{type:String,default:C.NeonFunctionalColor.Primary},autocomplete:{type:String,default:"on"},inputmode:{type:String,default:T.NeonInputMode.Text},placement:{type:String,default:i.NeonDropdownPlacement.BottomLeft}},emits:["update:modelValue","filter-changed"],setup(n,{emit:f}){const N=o.useAttrs(),p=o.ref(null),h=o.ref(null),s=o.ref(n.placement),r=o.ref(!1),c=o.ref(null),a=o.ref(-1),d=o.ref("");o.watch(()=>r.value,e=>{e&&n.options.length>0&&(c.value=n.options[0].key,a.value=0)});const S=()=>{switch(s.value){case i.NeonDropdownPlacement.TopLeft:case i.NeonDropdownPlacement.TopRight:case i.NeonDropdownPlacement.LeftBottom:case i.NeonDropdownPlacement.RightBottom:return!0}return!1},k=()=>{var t,l;const e=(l=(t=p.value)==null?void 0:t.dropdownContent)==null?void 0:l.querySelector(".neon-search__option--highlighted");e&&(e.focus(),E.NeonScrollUtils.scrollIntoView(e))},y=(e,t)=>{const l=a.value+e;l>=0&&l<=n.options.length-1&&(a.value=l,c.value=n.options[a.value].key,t.preventDefault(),setTimeout(k))},u=e=>{f("update:modelValue",e)},g=e=>{!n.multiple&&n.modelValue!==""&&u(""),d.value=e,f("filter-changed",e)},v=e=>{if(n.multiple){const t=n.modelValue.map(m=>m),l=t.findIndex(m=>m.key===e.key);l>=0?t.splice(l,1):t.push(e),u(t)}else u(e.key);g(n.multiple?"":e.label.toString())},w=e=>{var t;if(r.value)switch(e.code){case"ArrowUp":case"ArrowDown":{const l=S()?-1:1;e.code==="ArrowUp"?y(-1*l,e):y(1*l,e)}break;case"Enter":case"Space":e.target.classList.contains("neon-search__input")||(v(n.options[a.value]),e.preventDefault());break;case"Tab":document.activeElement!==((t=h.value)==null?void 0:t.neonInput)&&!e.ctrlKey&&!e.metaKey&&!e.altKey&&(r.value=!1);break}},q=e=>{s.value=e};o.onMounted(()=>{document.addEventListener("keydown",w)}),o.onUnmounted(()=>{document.removeEventListener("keydown",w)});const I=o.computed(()=>{const{onFilterChanged:e,...t}=N;return t}),D=e=>{c.value=e,a.value=n.options.findIndex(t=>t.key===e)},b=()=>r.value=!0,P=e=>u(n.modelValue.filter(t=>t.key!==e.key)),x=o.computed(()=>n.multiple?n.options:n.options.filter(e=>e.label!==d.value));return{dropdown:p,searchInput:h,open:r,highlightedKey:c,filter:d,sanitizedAttributes:I,computedOptions:x,dropdownPlacement:s,onPlacement:q,onFilterChange:g,clickOption:v,changeHighlighted:D,showOptions:b,removeSelected:P}}});module.exports=U;
+"use strict";const o=require("vue"),C=require("../../../common/enums/NeonSize.cjs.js"),B=require("../../../common/enums/NeonFunctionalColor.cjs.js"),L=require("../../presentation/dropdown/NeonDropdown.vue.cjs.js"),z=require("../../presentation/icon/NeonIcon.vue.cjs.js"),E=require("../input/NeonInput.vue.cjs.js"),O=require("../chip/NeonChip.vue.cjs.js"),c=require("../../../common/enums/NeonDropdownPlacement.cjs.js"),T=require("../../../common/utils/NeonScrollUtils.cjs.js"),U=require("../../../common/enums/NeonInputMode.cjs.js"),_=o.defineComponent({name:"NeonSearch",components:{NeonChip:O,NeonDropdown:L,NeonIcon:z,NeonInput:E},props:{modelValue:{type:[Object,Array]},placeholder:{type:String,required:!0},options:{type:Array,required:!0},multiple:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},size:{type:String,default:C.NeonSize.Medium},color:{type:String,default:B.NeonFunctionalColor.Primary},autocomplete:{type:String,default:"on"},inputmode:{type:String,default:U.NeonInputMode.Text},placement:{type:String,default:c.NeonDropdownPlacement.BottomLeft}},emits:["update:modelValue","filter-changed"],setup(t,{emit:f}){var N;const k=o.useAttrs(),h=o.ref(null),y=o.ref(null),d=o.ref(t.placement),i=o.ref(!1),u=o.ref(null),a=o.ref(-1),r=o.ref(!t.multiple&&((N=t.modelValue)==null?void 0:N.label)||"");o.watch(()=>i.value,e=>{e&&t.options.length>0&&(u.value=t.options[0].key,a.value=0)}),o.watch(()=>t.modelValue,e=>{t.multiple||(r.value=(e==null?void 0:e.label)||"")});const S=()=>{switch(d.value){case c.NeonDropdownPlacement.TopLeft:case c.NeonDropdownPlacement.TopRight:case c.NeonDropdownPlacement.LeftBottom:case c.NeonDropdownPlacement.RightBottom:return!0}return!1},q=()=>{var n,l;const e=(l=(n=h.value)==null?void 0:n.dropdownContent)==null?void 0:l.querySelector(".neon-search__option--highlighted");e&&(e.focus(),T.NeonScrollUtils.scrollIntoView(e))},g=(e,n)=>{const l=a.value+e;l>=0&&l<=t.options.length-1&&(a.value=l,u.value=t.options[a.value].key,n.preventDefault(),setTimeout(q))},s=e=>{f("update:modelValue",e)},v=e=>{!t.multiple&&t.modelValue&&s(null),r.value=e,f("filter-changed",e)},p=e=>{if(t.multiple){const n=t.modelValue.map(m=>m),l=n.findIndex(m=>m.key===e.key);l>=0?n.splice(l,1):n.push(e),s(n)}else s(e);v(t.multiple?"":e.label.toString())},w=e=>{var n;if(i.value)switch(e.code){case"ArrowUp":case"ArrowDown":{const l=S()?-1:1;e.code==="ArrowUp"?g(-1*l,e):g(1*l,e)}break;case"Enter":case"Space":e.target.classList.contains("neon-search__input")||(p(t.options[a.value]),e.preventDefault());break;case"Tab":document.activeElement!==((n=y.value)==null?void 0:n.neonInput)&&!e.ctrlKey&&!e.metaKey&&!e.altKey&&(i.value=!1);break}},b=e=>{d.value=e};o.onMounted(()=>{document.addEventListener("keydown",w)}),o.onUnmounted(()=>{document.removeEventListener("keydown",w)});const I=o.computed(()=>{const{onFilterChanged:e,...n}=k;return n}),D=e=>{u.value=e,a.value=t.options.findIndex(n=>n.key===e)},A=()=>i.value=!0,P=e=>s(t.modelValue.filter(n=>n.key!==e.key)),V=o.computed(()=>t.multiple?t.options:t.options.filter(e=>e.label!==r.value)),x=o.computed(()=>{var e;return t.multiple&&Array.isArray(t.modelValue)?t.modelValue[0]&&t.modelValue[0].key:((e=t.modelValue)==null?void 0:e.key)||null});return{dropdown:h,searchInput:y,open:i,highlightedKey:u,filter:r,sanitizedAttributes:I,computedOptions:V,dropdownPlacement:d,onPlacement:b,onFilterChange:v,clickOption:p,changeHighlighted:D,showOptions:A,removeSelected:P,activeDescendant:x}}});module.exports=_;
 //# sourceMappingURL=NeonSearch.cjs.js.map

package/dist/components/user-input/search/NeonSearch.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonSearch.cjs.js","sources":["../../../../src/components/user-input/search/NeonSearch.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent, onMounted, onUnmounted, ref, useAttrs, watch } from 'vue';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonDropdown from '@/components/presentation/dropdown/NeonDropdown.vue';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport type { NeonSearchOption } from '@/common/models/NeonSearchOption';\nimport NeonInput from '@/components/user-input/input/NeonInput.vue';\nimport NeonChip from '@/components/user-input/chip/NeonChip.vue';\nimport { NeonDropdownPlacement } from '@/common/enums/NeonDropdownPlacement';\nimport { NeonScrollUtils } from '@/common/utils/NeonScrollUtils';\nimport { NeonInputMode } from '@/common/enums/NeonInputMode';\n\n/**\n * <p>\n *   The <strong>NeonSearch</strong> component is equivalent to an HTML &lt;input type=\"search\"&gt; element. It is\n *   useful as an alternative to <em>NeonSelect</em> to provide filtered results when the universe of results is very\n *   large and/or the results need to be requested from a server side API.\n * </p>\n * <p><strong>NeonSearch</strong> provides input chips in the case the search allows multiple selection.</p>\n */\nexport default defineComponent({\n  name: 'NeonSearch',\n  components: {\n    NeonChip,\n    NeonDropdown,\n    NeonIcon,\n    NeonInput,\n  },\n  props: {\n    /**\n     * Either a string indicating the key of the selected option ('' if there is no selection) or an array of selected\n     * NeonSearchOption in the case when multiple = true (necessary to display them as chips).\n     */\n    modelValue: { type: [String, Array as () => Array<NeonSearchOption>], required: true },\n    /**\n     * Placeholder to display in search input when there is no search string entered.\n     */\n    placeholder: { type: String, required: true },\n    /**\n     * The list of search results.\n     */\n    options: { type: Array as () => Array<NeonSearchOption>, required: true },\n    /**\n     * Allow multi-select.\n     */\n    multiple: { type: Boolean, default: false },\n    /**\n     * Disable the search\n     */\n    disabled: { type: Boolean, default: false },\n    /**\n     * The size of the dropdown - Small, Medium or Large.\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Medium },\n    /**\n     * The color of the search.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Primary },\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 HTML input mode as specified <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode\">here</a>.\n     * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.\n     */\n    inputmode: { type: String as () => NeonInputMode, default: NeonInputMode.Text },\n    /**\n     * Placement of the dropdown contents.\n     */\n    placement: { type: String as () => NeonDropdownPlacement, default: NeonDropdownPlacement.BottomLeft },\n  },\n  emits: [\n    /**\n     * emitted when the user changes the selection.\n     * @type {string | NeonSearchOption[]} either the selected option's key (single select) or an array of the\n     * selected options (multi-select).\n     */\n    'update:modelValue',\n    /**\n     * emitted when the user types in filter box.\n     * @type {string} the current filter criteria. This can be used by the application to filter the displayed options.\n     */\n    'filter-changed',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n\n    const dropdown = ref<InstanceType<typeof NeonDropdown> | null>(null);\n    const searchInput = ref<InstanceType<typeof NeonInput> | null>(null);\n    const dropdownPlacement = ref<NeonDropdownPlacement | undefined>(props.placement);\n\n    const open = ref(false);\n    const highlightedKey = ref<string | null>(null);\n    const highlightedIndex = ref(-1);\n    const filter = ref('');\n\n    watch(\n      () => open.value,\n      (open: boolean) => {\n        if (open && props.options.length > 0) {\n          highlightedKey.value = props.options[0].key;\n          highlightedIndex.value = 0;\n        }\n      },\n    );\n\n    const isReverse = () => {\n      switch (dropdownPlacement.value) {\n        case NeonDropdownPlacement.TopLeft:\n        case NeonDropdownPlacement.TopRight:\n        case NeonDropdownPlacement.LeftBottom:\n        case NeonDropdownPlacement.RightBottom:\n          return true;\n      }\n\n      return false;\n    };\n\n    const onNavigate = () => {\n      const element: HTMLElement | null = dropdown.value?.dropdownContent?.querySelector(\n        '.neon-search__option--highlighted',\n      ) as HTMLElement;\n\n      if (element) {\n        element.focus();\n        NeonScrollUtils.scrollIntoView(element);\n      }\n    };\n\n    const navigateBy = (offset: number, $event: KeyboardEvent) => {\n      const newIndex = highlightedIndex.value + offset;\n      if (newIndex >= 0 && newIndex <= props.options.length - 1) {\n        highlightedIndex.value = newIndex;\n        highlightedKey.value = props.options[highlightedIndex.value].key;\n        $event.preventDefault();\n        setTimeout(onNavigate);\n      }\n    };\n\n    const emitInputEvent = (value: string | NeonSearchOption[]) => {\n      emit('update:modelValue', value);\n    };\n\n    const onFilterChange = (_filter: string) => {\n      if (!props.multiple && props.modelValue !== '') {\n        emitInputEvent('');\n      }\n\n      filter.value = _filter;\n      emit('filter-changed', _filter);\n    };\n\n    const clickOption = (option: NeonSearchOption) => {\n      if (props.multiple) {\n        const values = (props.modelValue as NeonSearchOption[]).map((v) => v);\n        const index = values.findIndex((v) => v.key === option.key);\n        if (index >= 0) {\n          values.splice(index, 1);\n        } else {\n          values.push(option);\n        }\n        emitInputEvent(values);\n      } else {\n        emitInputEvent(option.key);\n      }\n\n      onFilterChange(props.multiple ? '' : option.label.toString());\n    };\n\n    const keyboardHandler = ($event: KeyboardEvent) => {\n      if (open.value) {\n        switch ($event.code) {\n          case 'ArrowUp':\n          case 'ArrowDown':\n            {\n              const reverseOffset = isReverse() ? -1 : 1;\n              if ($event.code === 'ArrowUp') {\n                navigateBy(-1 * reverseOffset, $event);\n              } else {\n                navigateBy(1 * reverseOffset, $event);\n              }\n            }\n            break;\n          case 'Enter':\n          case 'Space':\n            if (!($event.target as HTMLElement).classList.contains('neon-search__input')) {\n              clickOption(props.options[highlightedIndex.value]);\n              $event.preventDefault();\n            }\n            break;\n          case 'Tab':\n            if (\n              document.activeElement !== searchInput.value?.neonInput &&\n              !$event.ctrlKey &&\n              !$event.metaKey &&\n              !$event.altKey\n            ) {\n              open.value = false;\n            }\n            break;\n        }\n      }\n    };\n\n    const onPlacement = (placement: NeonDropdownPlacement) => {\n      dropdownPlacement.value = placement;\n    };\n\n    onMounted(() => {\n      document.addEventListener('keydown', keyboardHandler);\n    });\n\n    onUnmounted(() => {\n      document.removeEventListener('keydown', keyboardHandler);\n    });\n\n    const sanitizedAttributes = computed(() => {\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      const { onFilterChanged, ...sanitized } = attrs;\n      return sanitized;\n    });\n\n    const changeHighlighted = (key: string) => {\n      highlightedKey.value = key;\n      highlightedIndex.value = props.options.findIndex((opt) => opt.key === key);\n    };\n\n    const showOptions = () => (open.value = true);\n\n    const removeSelected = (removed: NeonSearchOption) =>\n      emitInputEvent((props.modelValue as NeonSearchOption[]).filter((v) => v.key !== removed.key));\n\n    const computedOptions = computed(() => {\n      return props.multiple ? props.options : props.options.filter((opt) => opt.label !== filter.value);\n    });\n\n    return {\n      dropdown,\n      searchInput,\n      open,\n      highlightedKey,\n      filter,\n      sanitizedAttributes,\n      computedOptions,\n      dropdownPlacement,\n      onPlacement,\n      onFilterChange,\n      clickOption,\n      changeHighlighted,\n      showOptions,\n      removeSelected,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonChip","NeonDropdown","NeonIcon","NeonInput","NeonSize","NeonFunctionalColor","NeonInputMode","NeonDropdownPlacement","props","emit","attrs","useAttrs","dropdown","ref","searchInput","dropdownPlacement","open","highlightedKey","highlightedIndex","filter","watch","isReverse","onNavigate","element","_b","_a","NeonScrollUtils","navigateBy","offset","$event","newIndex","emitInputEvent","value","onFilterChange","_filter","clickOption","option","values","v","index","keyboardHandler","reverseOffset","onPlacement","placement","onMounted","onUnmounted","sanitizedAttributes","computed","onFilterChanged","sanitized","changeHighlighted","key","opt","showOptions","removeSelected","removed","computedOptions"],"mappings":"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"}
+{"version":3,"file":"NeonSearch.cjs.js","sources":["../../../../src/components/user-input/search/NeonSearch.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent, onMounted, onUnmounted, ref, useAttrs, watch } from 'vue';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonDropdown from '@/components/presentation/dropdown/NeonDropdown.vue';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport type { NeonSearchOption } from '@/common/models/NeonSearchOption';\nimport NeonInput from '@/components/user-input/input/NeonInput.vue';\nimport NeonChip from '@/components/user-input/chip/NeonChip.vue';\nimport { NeonDropdownPlacement } from '@/common/enums/NeonDropdownPlacement';\nimport { NeonScrollUtils } from '@/common/utils/NeonScrollUtils';\nimport { NeonInputMode } from '@/common/enums/NeonInputMode';\n\n/**\n * <p>\n *   The <strong>NeonSearch</strong> component is equivalent to an HTML &lt;input type=\"search\"&gt; element. It is\n *   useful as an alternative to <em>NeonSelect</em> to provide filtered results when the universe of results is very\n *   large and/or the results need to be requested from a server side API.\n * </p>\n * <p><strong>NeonSearch</strong> provides input chips in the case the search allows multiple selection.</p>\n */\nexport default defineComponent({\n  name: 'NeonSearch',\n  components: {\n    NeonChip,\n    NeonDropdown,\n    NeonIcon,\n    NeonInput,\n  },\n  props: {\n    /**\n     * The selected model value(s). In the case of single select this should be set to a single NeonSearchOption or null.\n     * In the case of multiple selection (multiple=true) pass an Array of selected NeonSearchOptions or an empty array\n     * if nothing is selected.\n     */\n    modelValue: { type: [Object as () => NeonSearchOption, Array as () => Array<NeonSearchOption>] },\n    /**\n     * Placeholder to display in search input when there is no search string entered.\n     */\n    placeholder: { type: String, required: true },\n    /**\n     * The list of search results.\n     */\n    options: { type: Array as () => Array<NeonSearchOption>, required: true },\n    /**\n     * Allow multi-select.\n     */\n    multiple: { type: Boolean, default: false },\n    /**\n     * Disable the search\n     */\n    disabled: { type: Boolean, default: false },\n    /**\n     * The size of the dropdown - Small, Medium or Large.\n     */\n    size: { type: String as () => NeonSize, default: NeonSize.Medium },\n    /**\n     * The color of the search.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Primary },\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 HTML input mode as specified <a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode\">here</a>.\n     * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.\n     */\n    inputmode: { type: String as () => NeonInputMode, default: NeonInputMode.Text },\n    /**\n     * Placement of the dropdown contents.\n     */\n    placement: { type: String as () => NeonDropdownPlacement, default: NeonDropdownPlacement.BottomLeft },\n  },\n  emits: [\n    /**\n     * @type {NeonSearchOption | NeonSearchOption[] | null} either the selected option (single select) or an array of\n     * the selected options (multi-select). In the case nothing is selected in single select mode <null> is returned &\n     * for multiple selection an empty array is returned.\n     */\n    'update:modelValue',\n    /**\n     * emitted when the user types in filter box.\n     * @type {string} the current filter criteria. This can be used by the application to filter the displayed options.\n     */\n    'filter-changed',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n\n    const dropdown = ref<InstanceType<typeof NeonDropdown> | null>(null);\n    const searchInput = ref<InstanceType<typeof NeonInput> | null>(null);\n    const dropdownPlacement = ref<NeonDropdownPlacement | undefined>(props.placement);\n\n    const open = ref(false);\n    const highlightedKey = ref<string | null>(null);\n    const highlightedIndex = ref(-1);\n\n    const filter = ref<string>((!props.multiple && (props.modelValue as NeonSearchOption | null)?.label) || '');\n\n    watch(\n      () => open.value,\n      (open: boolean) => {\n        if (open && props.options.length > 0) {\n          highlightedKey.value = props.options[0].key;\n          highlightedIndex.value = 0;\n        }\n      },\n    );\n\n    watch(\n      () => props.modelValue,\n      (modelValue) => {\n        if (!props.multiple) {\n          filter.value = (modelValue as NeonSearchOption | null)?.label || '';\n        }\n      },\n    );\n\n    const isReverse = () => {\n      switch (dropdownPlacement.value) {\n        case NeonDropdownPlacement.TopLeft:\n        case NeonDropdownPlacement.TopRight:\n        case NeonDropdownPlacement.LeftBottom:\n        case NeonDropdownPlacement.RightBottom:\n          return true;\n      }\n\n      return false;\n    };\n\n    const onNavigate = () => {\n      const element: HTMLElement | null = dropdown.value?.dropdownContent?.querySelector(\n        '.neon-search__option--highlighted',\n      ) as HTMLElement;\n\n      if (element) {\n        element.focus();\n        NeonScrollUtils.scrollIntoView(element);\n      }\n    };\n\n    const navigateBy = (offset: number, $event: KeyboardEvent) => {\n      const newIndex = highlightedIndex.value + offset;\n      if (newIndex >= 0 && newIndex <= props.options.length - 1) {\n        highlightedIndex.value = newIndex;\n        highlightedKey.value = props.options[highlightedIndex.value].key;\n        $event.preventDefault();\n        setTimeout(onNavigate);\n      }\n    };\n\n    const emitInputEvent = (value: NeonSearchOption | NeonSearchOption[] | null) => {\n      emit('update:modelValue', value);\n    };\n\n    const onFilterChange = (_filter: string) => {\n      if (!props.multiple && props.modelValue) {\n        emitInputEvent(null);\n      }\n\n      filter.value = _filter;\n      emit('filter-changed', _filter);\n    };\n\n    const clickOption = (option: NeonSearchOption) => {\n      if (props.multiple) {\n        const values = (props.modelValue as NeonSearchOption[]).map((v) => v);\n        const index = values.findIndex((v) => v.key === option.key);\n        if (index >= 0) {\n          values.splice(index, 1);\n        } else {\n          values.push(option);\n        }\n        emitInputEvent(values);\n      } else {\n        emitInputEvent(option);\n      }\n\n      onFilterChange(props.multiple ? '' : option.label.toString());\n    };\n\n    const keyboardHandler = ($event: KeyboardEvent) => {\n      if (open.value) {\n        switch ($event.code) {\n          case 'ArrowUp':\n          case 'ArrowDown':\n            {\n              const reverseOffset = isReverse() ? -1 : 1;\n              if ($event.code === 'ArrowUp') {\n                navigateBy(-1 * reverseOffset, $event);\n              } else {\n                navigateBy(1 * reverseOffset, $event);\n              }\n            }\n            break;\n          case 'Enter':\n          case 'Space':\n            if (!($event.target as HTMLElement).classList.contains('neon-search__input')) {\n              clickOption(props.options[highlightedIndex.value]);\n              $event.preventDefault();\n            }\n            break;\n          case 'Tab':\n            if (\n              document.activeElement !== searchInput.value?.neonInput &&\n              !$event.ctrlKey &&\n              !$event.metaKey &&\n              !$event.altKey\n            ) {\n              open.value = false;\n            }\n            break;\n        }\n      }\n    };\n\n    const onPlacement = (placement: NeonDropdownPlacement) => {\n      dropdownPlacement.value = placement;\n    };\n\n    onMounted(() => {\n      document.addEventListener('keydown', keyboardHandler);\n    });\n\n    onUnmounted(() => {\n      document.removeEventListener('keydown', keyboardHandler);\n    });\n\n    const sanitizedAttributes = computed(() => {\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      const { onFilterChanged, ...sanitized } = attrs;\n      return sanitized;\n    });\n\n    const changeHighlighted = (key: string) => {\n      highlightedKey.value = key;\n      highlightedIndex.value = props.options.findIndex((opt) => opt.key === key);\n    };\n\n    const showOptions = () => (open.value = true);\n\n    const removeSelected = (removed: NeonSearchOption) =>\n      emitInputEvent((props.modelValue as NeonSearchOption[]).filter((v) => v.key !== removed.key));\n\n    const computedOptions = computed(() => {\n      return props.multiple ? props.options : props.options.filter((opt) => opt.label !== filter.value);\n    });\n\n    const activeDescendant = computed(() =>\n      props.multiple && Array.isArray(props.modelValue)\n        ? props.modelValue[0] && props.modelValue[0].key\n        : (props.modelValue as NeonSearchOption)?.key || null,\n    );\n\n    return {\n      dropdown,\n      searchInput,\n      open,\n      highlightedKey,\n      filter,\n      sanitizedAttributes,\n      computedOptions,\n      dropdownPlacement,\n      onPlacement,\n      onFilterChange,\n      clickOption,\n      changeHighlighted,\n      showOptions,\n      removeSelected,\n      activeDescendant,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonChip","NeonDropdown","NeonIcon","NeonInput","NeonSize","NeonFunctionalColor","NeonInputMode","NeonDropdownPlacement","props","emit","attrs","useAttrs","dropdown","ref","searchInput","dropdownPlacement","open","highlightedKey","highlightedIndex","filter","_a","watch","modelValue","isReverse","onNavigate","element","_b","NeonScrollUtils","navigateBy","offset","$event","newIndex","emitInputEvent","value","onFilterChange","_filter","clickOption","option","values","v","index","keyboardHandler","reverseOffset","onPlacement","placement","onMounted","onUnmounted","sanitizedAttributes","computed","onFilterChanged","sanitized","changeHighlighted","key","opt","showOptions","removeSelected","removed","computedOptions","activeDescendant"],"mappings":"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"}

package/dist/components/user-input/search/NeonSearch.es.js

@@ -1,27 +1,28 @@
-import { defineComponent as L, useAttrs as D, ref as l, watch as E, onMounted as T, onUnmounted as _, computed as k } from "vue";
-import { NeonSize as q } from "../../../common/enums/NeonSize.es.js";
-import { NeonFunctionalColor as z } from "../../../common/enums/NeonFunctionalColor.es.js";
-import K from "../../presentation/dropdown/NeonDropdown.vue.es.js";
-import O from "../../presentation/icon/NeonIcon.vue.es.js";
-import P from "../input/NeonInput.vue.es.js";
-import U from "../chip/NeonChip.vue.es.js";
-import { NeonDropdownPlacement as r } from "../../../common/enums/NeonDropdownPlacement.es.js";
-import { NeonScrollUtils as F } from "../../../common/utils/NeonScrollUtils.es.js";
-import { NeonInputMode as M } from "../../../common/enums/NeonInputMode.es.js";
-const $ = L({
+import { defineComponent as O, useAttrs as T, ref as l, watch as b, onMounted as _, onUnmounted as z, computed as f } from "vue";
+import { NeonSize as K } from "../../../common/enums/NeonSize.es.js";
+import { NeonFunctionalColor as P } from "../../../common/enums/NeonFunctionalColor.es.js";
+import U from "../../presentation/dropdown/NeonDropdown.vue.es.js";
+import q from "../../presentation/icon/NeonIcon.vue.es.js";
+import F from "../input/NeonInput.vue.es.js";
+import M from "../chip/NeonChip.vue.es.js";
+import { NeonDropdownPlacement as u } from "../../../common/enums/NeonDropdownPlacement.es.js";
+import { NeonScrollUtils as R } from "../../../common/utils/NeonScrollUtils.es.js";
+import { NeonInputMode as H } from "../../../common/enums/NeonInputMode.es.js";
+const te = O({
   name: "NeonSearch",
   components: {
-    NeonChip: U,
-    NeonDropdown: K,
-    NeonIcon: O,
-    NeonInput: P
+    NeonChip: M,
+    NeonDropdown: U,
+    NeonIcon: q,
+    NeonInput: F
   },
   props: {
     /**
-     * Either a string indicating the key of the selected option ('' if there is no selection) or an array of selected
-     * NeonSearchOption in the case when multiple = true (necessary to display them as chips).
+     * The selected model value(s). In the case of single select this should be set to a single NeonSearchOption or null.
+     * In the case of multiple selection (multiple=true) pass an Array of selected NeonSearchOptions or an empty array
+     * if nothing is selected.
      */
-    modelValue: { type: [String, Array], required: !0 },
+    modelValue: { type: [Object, Array] },
     /**
      * Placeholder to display in search input when there is no search string entered.
      */
@@ -41,11 +42,11 @@ const $ = L({
     /**
      * The size of the dropdown - Small, Medium or Large.
      */
-    size: { type: String, default: q.Medium },
+    size: { type: String, default: K.Medium },
     /**
      * The color of the search.
      */
-    color: { type: String, default: z.Primary },
+    color: { type: String, default: P.Primary },
     /**
      * The HTML autocomplete mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values">here</a>.
      * 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.
@@ -55,17 +56,17 @@ const $ = L({
      * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
      * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
      */
-    inputmode: { type: String, default: M.Text },
+    inputmode: { type: String, default: H.Text },
     /**
      * Placement of the dropdown contents.
      */
-    placement: { type: String, default: r.BottomLeft }
+    placement: { type: String, default: u.BottomLeft }
   },
   emits: [
     /**
-     * emitted when the user changes the selection.
-     * @type {string | NeonSearchOption[]} either the selected option's key (single select) or an array of the
-     * selected options (multi-select).
+     * @type {NeonSearchOption | NeonSearchOption[] | null} either the selected option (single select) or an array of
+     * the selected options (multi-select). In the case nothing is selected in single select mode <null> is returned &
+     * for multiple selection an empty array is returned.
      */
     "update:modelValue",
     /**
@@ -74,95 +75,107 @@ const $ = L({
      */
     "filter-changed"
   ],
-  setup(o, { emit: f }) {
-    const S = D(), p = l(null), h = l(null), s = l(o.placement), i = l(!1), u = l(null), a = l(-1), d = l("");
-    E(
+  setup(t, { emit: y }) {
+    var S;
+    const I = T(), h = l(null), p = l(null), d = l(t.placement), i = l(!1), c = l(null), a = l(-1), r = l(!t.multiple && ((S = t.modelValue) == null ? void 0 : S.label) || "");
+    b(
       () => i.value,
       (e) => {
-        e && o.options.length > 0 && (u.value = o.options[0].key, a.value = 0);
+        e && t.options.length > 0 && (c.value = t.options[0].key, a.value = 0);
+      }
+    ), b(
+      () => t.modelValue,
+      (e) => {
+        t.multiple || (r.value = (e == null ? void 0 : e.label) || "");
       }
     );
-    const I = () => {
-      switch (s.value) {
-        case r.TopLeft:
-        case r.TopRight:
-        case r.LeftBottom:
-        case r.RightBottom:
+    const N = () => {
+      switch (d.value) {
+        case u.TopLeft:
+        case u.TopRight:
+        case u.LeftBottom:
+        case u.RightBottom:
           return !0;
       }
       return !1;
-    }, N = () => {
-      var t, n;
-      const e = (n = (t = p.value) == null ? void 0 : t.dropdownContent) == null ? void 0 : n.querySelector(
+    }, A = () => {
+      var n, o;
+      const e = (o = (n = h.value) == null ? void 0 : n.dropdownContent) == null ? void 0 : o.querySelector(
         ".neon-search__option--highlighted"
       );
-      e && (e.focus(), F.scrollIntoView(e));
-    }, y = (e, t) => {
-      const n = a.value + e;
-      n >= 0 && n <= o.options.length - 1 && (a.value = n, u.value = o.options[a.value].key, t.preventDefault(), setTimeout(N));
-    }, c = (e) => {
-      f("update:modelValue", e);
-    }, g = (e) => {
-      !o.multiple && o.modelValue !== "" && c(""), d.value = e, f("filter-changed", e);
+      e && (e.focus(), R.scrollIntoView(e));
+    }, g = (e, n) => {
+      const o = a.value + e;
+      o >= 0 && o <= t.options.length - 1 && (a.value = o, c.value = t.options[a.value].key, n.preventDefault(), setTimeout(A));
+    }, s = (e) => {
+      y("update:modelValue", e);
     }, v = (e) => {
-      if (o.multiple) {
-        const t = o.modelValue.map((m) => m), n = t.findIndex((m) => m.key === e.key);
-        n >= 0 ? t.splice(n, 1) : t.push(e), c(t);
-      } else
-        c(e.key);
-      g(o.multiple ? "" : e.label.toString());
+      !t.multiple && t.modelValue && s(null), r.value = e, y("filter-changed", e);
     }, w = (e) => {
-      var t;
+      if (t.multiple) {
+        const n = t.modelValue.map((m) => m), o = n.findIndex((m) => m.key === e.key);
+        o >= 0 ? n.splice(o, 1) : n.push(e), s(n);
+      } else
+        s(e);
+      v(t.multiple ? "" : e.label.toString());
+    }, k = (e) => {
+      var n;
       if (i.value)
         switch (e.code) {
           case "ArrowUp":
           case "ArrowDown":
             {
-              const n = I() ? -1 : 1;
-              e.code === "ArrowUp" ? y(-1 * n, e) : y(1 * n, e);
+              const o = N() ? -1 : 1;
+              e.code === "ArrowUp" ? g(-1 * o, e) : g(1 * o, e);
             }
             break;
           case "Enter":
           case "Space":
-            e.target.classList.contains("neon-search__input") || (v(o.options[a.value]), e.preventDefault());
+            e.target.classList.contains("neon-search__input") || (w(t.options[a.value]), e.preventDefault());
             break;
           case "Tab":
-            document.activeElement !== ((t = h.value) == null ? void 0 : t.neonInput) && !e.ctrlKey && !e.metaKey && !e.altKey && (i.value = !1);
+            document.activeElement !== ((n = p.value) == null ? void 0 : n.neonInput) && !e.ctrlKey && !e.metaKey && !e.altKey && (i.value = !1);
             break;
         }
-    }, b = (e) => {
-      s.value = e;
+    }, V = (e) => {
+      d.value = e;
     };
-    T(() => {
-      document.addEventListener("keydown", w);
-    }), _(() => {
-      document.removeEventListener("keydown", w);
+    _(() => {
+      document.addEventListener("keydown", k);
+    }), z(() => {
+      document.removeEventListener("keydown", k);
     });
-    const x = k(() => {
-      const { onFilterChanged: e, ...t } = S;
-      return t;
-    }), A = (e) => {
-      u.value = e, a.value = o.options.findIndex((t) => t.key === e);
-    }, V = () => i.value = !0, B = (e) => c(o.modelValue.filter((t) => t.key !== e.key)), C = k(() => o.multiple ? o.options : o.options.filter((e) => e.label !== d.value));
+    const x = f(() => {
+      const { onFilterChanged: e, ...n } = I;
+      return n;
+    }), B = (e) => {
+      c.value = e, a.value = t.options.findIndex((n) => n.key === e);
+    }, C = () => i.value = !0, D = (e) => s(t.modelValue.filter((n) => n.key !== e.key)), L = f(() => t.multiple ? t.options : t.options.filter((e) => e.label !== r.value)), E = f(
+      () => {
+        var e;
+        return t.multiple && Array.isArray(t.modelValue) ? t.modelValue[0] && t.modelValue[0].key : ((e = t.modelValue) == null ? void 0 : e.key) || null;
+      }
+    );
     return {
-      dropdown: p,
-      searchInput: h,
+      dropdown: h,
+      searchInput: p,
       open: i,
-      highlightedKey: u,
-      filter: d,
+      highlightedKey: c,
+      filter: r,
       sanitizedAttributes: x,
-      computedOptions: C,
-      dropdownPlacement: s,
-      onPlacement: b,
-      onFilterChange: g,
-      clickOption: v,
-      changeHighlighted: A,
-      showOptions: V,
-      removeSelected: B
+      computedOptions: L,
+      dropdownPlacement: d,
+      onPlacement: V,
+      onFilterChange: v,
+      clickOption: w,
+      changeHighlighted: B,
+      showOptions: C,
+      removeSelected: D,
+      activeDescendant: E
     };
   }
 });
 export {
-  $ as default
+  te as default
 };
 //# sourceMappingURL=NeonSearch.es.js.map