@aotearoan/neon 19.0.2 → 21.0.0

package/dist/components/user-input/select/NeonSelect.es.js

@@ -1,17 +1,18 @@
-import { defineComponent as B, useAttrs as P, ref as r, computed as c, onMounted as L, onUnmounted as D, watch as K } from "vue";
-import { NeonSize as z } from "../../../common/enums/NeonSize.es.js";
-import { NeonFunctionalColor as C } from "../../../common/enums/NeonFunctionalColor.es.js";
-import E from "../../presentation/dropdown/NeonDropdown.vue.es.js";
-import T from "../../presentation/icon/NeonIcon.vue.es.js";
-import U from "../switch/NeonSwitch.vue.es.js";
-import { NeonDropdownPlacement as d } from "../../../common/enums/NeonDropdownPlacement.es.js";
-import { NeonScrollUtils as _ } from "../../../common/utils/NeonScrollUtils.es.js";
-const W = B({
+import { defineComponent as B, useAttrs as D, ref as d, computed as u, onMounted as L, onUnmounted as K, watch as z } from "vue";
+import { NeonSize as C } from "../../../common/enums/NeonSize.es.js";
+import { NeonFunctionalColor as E } from "../../../common/enums/NeonFunctionalColor.es.js";
+import T from "../../presentation/dropdown/NeonDropdown.vue.es.js";
+import U from "../../presentation/icon/NeonIcon.vue.es.js";
+import _ from "../switch/NeonSwitch.vue.es.js";
+import { NeonDropdownPlacement as c } from "../../../common/enums/NeonDropdownPlacement.es.js";
+import { NeonScrollUtils as M } from "../../../common/utils/NeonScrollUtils.es.js";
+import { NeonDropdownStyle as R } from "../../../common/enums/NeonDropdownStyle.es.js";
+const Z = B({
   name: "NeonSelect",
   components: {
-    NeonDropdown: E,
-    NeonIcon: T,
-    NeonSwitch: U
+    NeonDropdown: T,
+    NeonIcon: U,
+    NeonSwitch: _
   },
   props: {
     /**
@@ -58,15 +59,19 @@ const W = B({
     /**
      * The size of the dropdown - Small, Medium or Large.
      */
-    size: { type: String, default: z.Medium },
+    size: { type: String, default: C.Medium },
     /**
      * The color of the select.
      */
-    color: { type: String, default: C.Primary },
+    color: { type: String, default: E.Primary },
+    /**
+     * The button style of the select.
+     */
+    buttonStyle: { type: String, default: R.Input },
     /**
      * Placement of the dropdown contents.
      */
-    placement: { type: String, default: d.BottomLeft }
+    placement: { type: String, default: c.BottomLeft }
   },
   emits: [
     /**
@@ -76,44 +81,44 @@ const W = B({
      */
     "update:modelValue"
   ],
-  setup(l, { emit: k }) {
-    const w = P(), p = r(null), u = r(!1), g = r(l.placement), s = r(null), a = r(-1), n = c(() => {
+  setup(t, { emit: k }) {
+    const w = D(), p = d(null), r = d(!1), g = d(t.placement), s = d(null), a = d(-1), n = u(() => {
       var e;
-      return l.options ? l.options : l.groupedOptions ? (e = l.groupedOptions) == null ? void 0 : e.flatMap((t) => t.options) : [];
+      return t.options ? t.options : t.groupedOptions ? (e = t.groupedOptions) == null ? void 0 : e.flatMap((l) => l.options) : [];
     }), S = () => {
-      if (!l.groupedOptions)
+      if (!t.groupedOptions)
         switch (g.value) {
-          case d.TopLeft:
-          case d.TopRight:
-          case d.LeftBottom:
-          case d.RightBottom:
+          case c.TopLeft:
+          case c.TopRight:
+          case c.LeftBottom:
+          case c.RightBottom:
             return !0;
         }
       return !1;
     }, V = () => {
-      var t, o;
-      const e = (o = (t = p.value) == null ? void 0 : t.dropdownContent) == null ? void 0 : o.querySelector(
+      var l, o;
+      const e = (o = (l = p.value) == null ? void 0 : l.dropdownContent) == null ? void 0 : o.querySelector(
         ".neon-select__option--highlighted"
       );
-      e && (e.focus(), _.scrollIntoView(e));
-    }, f = (e, t) => {
+      e && (e.focus(), M.scrollIntoView(e));
+    }, m = (e, l) => {
       const o = a.value + e;
-      o >= 0 && o <= n.value.length - 1 && (a.value = o, s.value = n.value[a.value].key, t == null || t.preventDefault(), setTimeout(V));
-    }, m = (e) => {
+      o >= 0 && o <= n.value.length - 1 && (a.value = o, s.value = n.value[a.value].key, l == null || l.preventDefault(), setTimeout(V));
+    }, f = (e) => {
       k("update:modelValue", e);
     }, h = (e) => {
-      if (l.multiple) {
-        const t = [...l.modelValue], o = t.findIndex((y) => y === e.key);
-        o >= 0 ? t.splice(o, 1) : t.push(e.key), m(t);
-      } else l.modelValue !== e.key && (u.value = !1, m(e.key));
+      if (t.multiple) {
+        const l = [...t.modelValue], o = l.findIndex((y) => y === e.key);
+        o >= 0 ? l.splice(o, 1) : l.push(e.key), f(l);
+      } else t.modelValue !== e.key && (r.value = !1, f(e.key));
     }, v = (e) => {
-      if (u.value)
+      if (r.value)
         switch (e.code) {
           case "ArrowUp":
           case "ArrowDown":
             {
-              const t = S() ? -1 : 1;
-              e.code === "ArrowUp" ? f(-1 * t, e) : f(1 * t, e);
+              const l = S() ? -1 : 1;
+              e.code === "ArrowUp" ? m(-1 * l, e) : m(1 * l, e);
             }
             break;
           case "Enter":
@@ -121,75 +126,76 @@ const W = B({
             n.value[a.value].disabled || (h(n.value[a.value]), e.preventDefault());
             break;
           case "Tab":
-            !e.ctrlKey && !e.metaKey && !e.altKey && (u.value = !1);
+            !e.ctrlKey && !e.metaKey && !e.altKey && (r.value = !1);
             break;
         }
-    }, O = c(() => l.groupedOptions || [
+    }, b = u(() => t.groupedOptions || [
       {
         group: "",
-        options: l.options || []
+        options: t.options || []
       }
-    ]), b = c(() => {
+    ]), I = u(() => {
       const { ...e } = w;
       return e;
-    }), A = c(() => {
-      if (l.multiple && l.modelValue.length > 0) {
-        if (l.multiselectPlaceholder)
-          return l.multiselectPlaceholder;
-        if (l.modelValue.length > 1)
-          return `${l.modelValue.length} items selected`;
+    }), O = u(() => {
+      if (t.multiple && t.modelValue.length > 0) {
+        if (t.multiselectPlaceholder)
+          return t.multiselectPlaceholder;
+        if (t.modelValue.length > 1)
+          return `${t.modelValue.length} items selected`;
         {
-          const e = n.value.find((t) => t.key === l.modelValue[0]);
+          const e = n.value.find((l) => l.key === t.modelValue[0]);
           return (e == null ? void 0 : e.label) || "";
         }
-      } else if (l.modelValue) {
-        const e = n.value.find((t) => t.key === l.modelValue);
+      } else if (t.modelValue) {
+        const e = n.value.find((l) => l.key === t.modelValue);
         if (e)
           return e.label;
       }
-      return l.placeholder;
-    }), I = c(() => {
-      if (l.modelValue) {
-        const e = n.value.find((t) => t.key === l.modelValue);
+      return t.placeholder;
+    }), A = u(() => !t.modelValue || t.modelValue.length === 0), N = u(() => {
+      if (t.modelValue) {
+        const e = n.value.find((l) => l.key === t.modelValue);
         if (e)
           return e.icon;
       }
-      return l.placeholderIcon;
-    }), N = (e) => {
-      const t = Array.from(e.target.options).filter((i) => i.selected).map((i) => i.value), o = n.value.filter((i) => t.indexOf(i.key) >= 0), y = l.multiple ? o.map((i) => i.key) : o[0].key;
-      m(y);
+      return t.placeholderIcon;
+    }), P = (e) => {
+      const l = Array.from(e.target.options).filter((i) => i.selected).map((i) => i.value), o = n.value.filter((i) => l.indexOf(i.key) >= 0), y = t.multiple ? o.map((i) => i.key) : o[0].key;
+      f(y);
     }, q = (e) => {
-      s.value = e, a.value = n.value.findIndex((t) => t.key === e);
+      s.value = e, a.value = n.value.findIndex((l) => l.key === e);
     }, x = (e) => {
       g.value = e;
     };
     return L(() => {
       document.addEventListener("keydown", v);
-    }), D(() => {
+    }), K(() => {
       document.removeEventListener("keydown", v);
-    }), K(
-      () => u.value,
+    }), z(
+      () => r.value,
       (e) => {
-        e && (s.value = n.value[0].key, a.value = 0, f(a.value));
+        e && (s.value = n.value[0].key, a.value = 0, m(a.value));
       }
     ), {
       dropdown: p,
-      open: u,
+      open: r,
       highlightedKey: s,
       highlightedIndex: a,
       flattenedOptions: n,
-      computedLabel: A,
-      sanitizedAttributes: b,
-      computedOptions: O,
-      computedIcon: I,
+      computedLabel: O,
+      sanitizedAttributes: I,
+      computedOptions: b,
+      computedIcon: N,
+      labelIsPlaceholder: A,
       clickOption: h,
-      nativeSelectChange: N,
+      nativeSelectChange: P,
       changeHighlighted: q,
       onPlacement: x
     };
   }
 });
 export {
-  W as default
+  Z as default
 };
 //# sourceMappingURL=NeonSelect.es.js.map

package/dist/components/user-input/select/NeonSelect.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonSelect.es.js","sources":["../../../../src/components/user-input/select/NeonSelect.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 type { NeonSelectGroup } from '@/common/models/NeonSelectGroup';\nimport type { NeonSelectOption } from '@/common/models/NeonSelectOption';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonDropdown from '@/components/presentation/dropdown/NeonDropdown.vue';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport NeonSwitch from '@/components/user-input/switch/NeonSwitch.vue';\nimport { NeonDropdownPlacement } from '@/common/enums/NeonDropdownPlacement';\nimport { NeonScrollUtils } from '@/common/utils/NeonScrollUtils';\n\n/**\n * <p>The <strong>NeonSelect</strong> is the equivalent of an HTML &lt;select&gt; form control. On touch devices\n * NeonSelect will use the native select for input. <strong>NeonSelect</strong> supports grouping and multiselect.</p>\n * <p><strong>Note:</strong> As well as the options described below, pass through attributes supported by\n * <a href=\"/presentation/dropdown\">NeonDropdown</a> to change the style of the dropdown button.</p>\n */\nexport default defineComponent({\n  name: 'NeonSelect',\n  components: {\n    NeonDropdown,\n    NeonIcon,\n    NeonSwitch,\n  },\n  props: {\n    /**\n     * Id for the dropdown button\n     */\n    id: { type: String },\n    /**\n     * Placeholder to display as button label when there is no option selected.\n     */\n    placeholder: { type: String, required: true },\n    /**\n     * Display the placeholder as the first option in the select, this is useful as an alternative to a label.\n     */\n    placeholderAsOption: { type: Boolean, default: false },\n    /**\n     * Optional placeholder icon.\n     */\n    placeholderIcon: { type: String, required: false },\n    /**\n     * A list of options to render in the select.\n     */\n    options: { type: Array as () => Array<NeonSelectOption>, required: false },\n    /**\n     * A list of grouped options to render in the select.\n     */\n    groupedOptions: { type: Array as () => Array<NeonSelectGroup>, required: false },\n    /**\n     * Either a single string, indicating the key of the selected option or an array of selected keys in the case\n     * multiple = true.\n     */\n    modelValue: { type: [String, Array as () => Array<string>], required: true },\n    /**\n     * Allow multi-select.\n     */\n    multiple: { type: Boolean, default: false },\n    /**\n     * Placeholder when multiple values are selected.\n     */\n    multiselectPlaceholder: { type: String, required: false },\n    /**\n     * Disable the select\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 select.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Primary },\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 | string[]} either the selected option's key (single select) or an array of the selected keys\n     * (multi-select).\n     */\n    'update:modelValue',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n\n    const dropdown = ref<InstanceType<typeof NeonDropdown> | null>(null);\n\n    const open = ref(false);\n    const dropdownPlacement = ref<NeonDropdownPlacement>(props.placement);\n    const highlightedKey = ref<string | null>(null);\n    const highlightedIndex = ref(-1);\n\n    const flattenedOptions = computed((): NeonSelectOption[] => {\n      if (props.options) {\n        return props.options;\n      } else if (props.groupedOptions) {\n        return props.groupedOptions?.flatMap((group) => group.options);\n      }\n      return [];\n    });\n\n    const isReverse = () => {\n      if (!props.groupedOptions) {\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\n      return false;\n    };\n\n    const onNavigate = () => {\n      const element: HTMLElement | null = dropdown.value?.dropdownContent?.querySelector(\n        '.neon-select__option--highlighted',\n      ) as HTMLElement;\n\n      if (element) {\n        element.focus();\n        NeonScrollUtils.scrollIntoView(element);\n      }\n    };\n    const navigateBy = (offset: number, $event?: KeyboardEvent) => {\n      const newIndex = highlightedIndex.value + offset;\n      if (newIndex >= 0 && newIndex <= flattenedOptions.value.length - 1) {\n        highlightedIndex.value = newIndex;\n        highlightedKey.value = flattenedOptions.value[highlightedIndex.value].key;\n        $event?.preventDefault();\n        setTimeout(onNavigate);\n      }\n    };\n\n    const emitInputEvent = (value: string | string[]) => {\n      emit('update:modelValue', value);\n    };\n\n    const clickOption = (option: NeonSelectOption) => {\n      if (props.multiple) {\n        const values = [...props.modelValue];\n        const index = values.findIndex((v) => v === option.key);\n        if (index >= 0) {\n          values.splice(index, 1);\n        } else {\n          values.push(option.key);\n        }\n        emitInputEvent(values);\n      } else if (props.modelValue !== option.key) {\n        open.value = false;\n        emitInputEvent(option.key);\n      }\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 (!flattenedOptions.value[highlightedIndex.value].disabled) {\n              clickOption(flattenedOptions.value[highlightedIndex.value]);\n              $event.preventDefault();\n            }\n            break;\n          case 'Tab':\n            if (!$event.ctrlKey && !$event.metaKey && !$event.altKey) {\n              open.value = false;\n            }\n            break;\n        }\n      }\n    };\n\n    const computedOptions = computed((): Array<NeonSelectGroup> => {\n      return (\n        props.groupedOptions || [\n          {\n            group: '',\n            options: props.options || [],\n          },\n        ]\n      );\n    });\n\n    const sanitizedAttributes = computed(() => {\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      const { ...sanitized } = attrs;\n      return sanitized;\n    });\n\n    const computedLabel = computed(() => {\n      if (props.multiple && props.modelValue.length > 0) {\n        if (props.multiselectPlaceholder) {\n          return props.multiselectPlaceholder;\n        } else if (props.modelValue.length > 1) {\n          return `${props.modelValue.length} items selected`;\n        } else {\n          const selected = flattenedOptions.value.find((option) => option.key === props.modelValue[0]);\n          return selected?.label || '';\n        }\n      } else if (props.modelValue) {\n        const selected = flattenedOptions.value.find((option) => option.key === props.modelValue);\n\n        if (selected) {\n          return selected.label;\n        }\n      }\n\n      return props.placeholder;\n    });\n\n    const computedIcon = computed(() => {\n      if (props.modelValue) {\n        const selected = flattenedOptions.value.find((option) => option.key === props.modelValue);\n\n        if (selected) {\n          return selected.icon;\n        }\n      }\n\n      return props.placeholderIcon;\n    });\n\n    const nativeSelectChange = (event: Event) => {\n      const selectedKeys = Array.from((event.target as HTMLSelectElement).options)\n        .filter((opt) => opt.selected)\n        .map((opt) => opt.value);\n      const selectedOptions = flattenedOptions.value.filter((v) => selectedKeys.indexOf(v.key) >= 0);\n      const value = props.multiple ? selectedOptions.map((value) => value.key) : selectedOptions[0].key;\n      emitInputEvent(value);\n    };\n\n    const changeHighlighted = (key: string) => {\n      highlightedKey.value = key;\n      highlightedIndex.value = flattenedOptions.value.findIndex((opt) => opt.key === key);\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    watch(\n      () => open.value,\n      (open: boolean) => {\n        if (open) {\n          highlightedKey.value = flattenedOptions.value[0].key;\n          highlightedIndex.value = 0;\n          navigateBy(highlightedIndex.value);\n        }\n      },\n    );\n\n    return {\n      dropdown,\n      open,\n      highlightedKey,\n      highlightedIndex,\n      flattenedOptions,\n      computedLabel,\n      sanitizedAttributes,\n      computedOptions,\n      computedIcon,\n      clickOption,\n      nativeSelectChange,\n      changeHighlighted,\n      onPlacement,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonDropdown","NeonIcon","NeonSwitch","NeonSize","NeonFunctionalColor","NeonDropdownPlacement","props","emit","attrs","useAttrs","dropdown","ref","open","dropdownPlacement","highlightedKey","highlightedIndex","flattenedOptions","computed","_a","group","isReverse","onNavigate","element","_b","NeonScrollUtils","navigateBy","offset","$event","newIndex","emitInputEvent","value","clickOption","option","values","index","v","keyboardHandler","reverseOffset","computedOptions","sanitizedAttributes","sanitized","computedLabel","selected","computedIcon","nativeSelectChange","event","selectedKeys","opt","selectedOptions","changeHighlighted","key","onPlacement","placement","onMounted","onUnmounted","watch"],"mappings":"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"}
+{"version":3,"file":"NeonSelect.es.js","sources":["../../../../src/components/user-input/select/NeonSelect.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 type { NeonSelectGroup } from '@/common/models/NeonSelectGroup';\nimport type { NeonSelectOption } from '@/common/models/NeonSelectOption';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonDropdown from '@/components/presentation/dropdown/NeonDropdown.vue';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport NeonSwitch from '@/components/user-input/switch/NeonSwitch.vue';\nimport { NeonDropdownPlacement } from '@/common/enums/NeonDropdownPlacement';\nimport { NeonScrollUtils } from '@/common/utils/NeonScrollUtils';\nimport { NeonDropdownStyle } from '@/common/enums/NeonDropdownStyle';\n\n/**\n * <p>The <strong>NeonSelect</strong> is the equivalent of an HTML &lt;select&gt; form control. On touch devices\n * NeonSelect will use the native select for input. <strong>NeonSelect</strong> supports grouping and multiselect.</p>\n * <p><strong>Note:</strong> As well as the options described below, pass through attributes supported by\n * <a href=\"/presentation/dropdown\">NeonDropdown</a> to change the style of the dropdown button.</p>\n */\nexport default defineComponent({\n  name: 'NeonSelect',\n  components: {\n    NeonDropdown,\n    NeonIcon,\n    NeonSwitch,\n  },\n  props: {\n    /**\n     * Id for the dropdown button\n     */\n    id: { type: String },\n    /**\n     * Placeholder to display as button label when there is no option selected.\n     */\n    placeholder: { type: String, required: true },\n    /**\n     * Display the placeholder as the first option in the select, this is useful as an alternative to a label.\n     */\n    placeholderAsOption: { type: Boolean, default: false },\n    /**\n     * Optional placeholder icon.\n     */\n    placeholderIcon: { type: String, required: false },\n    /**\n     * A list of options to render in the select.\n     */\n    options: { type: Array as () => Array<NeonSelectOption>, required: false },\n    /**\n     * A list of grouped options to render in the select.\n     */\n    groupedOptions: { type: Array as () => Array<NeonSelectGroup>, required: false },\n    /**\n     * Either a single string, indicating the key of the selected option or an array of selected keys in the case\n     * multiple = true.\n     */\n    modelValue: { type: [String, Array as () => Array<string>], required: true },\n    /**\n     * Allow multi-select.\n     */\n    multiple: { type: Boolean, default: false },\n    /**\n     * Placeholder when multiple values are selected.\n     */\n    multiselectPlaceholder: { type: String, required: false },\n    /**\n     * Disable the select\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 select.\n     */\n    color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.Primary },\n    /**\n     * The button style of the select.\n     */\n    buttonStyle: { type: String as () => NeonDropdownStyle, default: NeonDropdownStyle.Input },\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 | string[]} either the selected option's key (single select) or an array of the selected keys\n     * (multi-select).\n     */\n    'update:modelValue',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n\n    const dropdown = ref<InstanceType<typeof NeonDropdown> | null>(null);\n\n    const open = ref(false);\n    const dropdownPlacement = ref<NeonDropdownPlacement>(props.placement);\n    const highlightedKey = ref<string | null>(null);\n    const highlightedIndex = ref(-1);\n\n    const flattenedOptions = computed((): NeonSelectOption[] => {\n      if (props.options) {\n        return props.options;\n      } else if (props.groupedOptions) {\n        return props.groupedOptions?.flatMap((group) => group.options);\n      }\n      return [];\n    });\n\n    const isReverse = () => {\n      if (!props.groupedOptions) {\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\n      return false;\n    };\n\n    const onNavigate = () => {\n      const element: HTMLElement | null = dropdown.value?.dropdownContent?.querySelector(\n        '.neon-select__option--highlighted',\n      ) as HTMLElement;\n\n      if (element) {\n        element.focus();\n        NeonScrollUtils.scrollIntoView(element);\n      }\n    };\n    const navigateBy = (offset: number, $event?: KeyboardEvent) => {\n      const newIndex = highlightedIndex.value + offset;\n      if (newIndex >= 0 && newIndex <= flattenedOptions.value.length - 1) {\n        highlightedIndex.value = newIndex;\n        highlightedKey.value = flattenedOptions.value[highlightedIndex.value].key;\n        $event?.preventDefault();\n        setTimeout(onNavigate);\n      }\n    };\n\n    const emitInputEvent = (value: string | string[]) => {\n      emit('update:modelValue', value);\n    };\n\n    const clickOption = (option: NeonSelectOption) => {\n      if (props.multiple) {\n        const values = [...props.modelValue];\n        const index = values.findIndex((v) => v === option.key);\n        if (index >= 0) {\n          values.splice(index, 1);\n        } else {\n          values.push(option.key);\n        }\n        emitInputEvent(values);\n      } else if (props.modelValue !== option.key) {\n        open.value = false;\n        emitInputEvent(option.key);\n      }\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 (!flattenedOptions.value[highlightedIndex.value].disabled) {\n              clickOption(flattenedOptions.value[highlightedIndex.value]);\n              $event.preventDefault();\n            }\n            break;\n          case 'Tab':\n            if (!$event.ctrlKey && !$event.metaKey && !$event.altKey) {\n              open.value = false;\n            }\n            break;\n        }\n      }\n    };\n\n    const computedOptions = computed((): Array<NeonSelectGroup> => {\n      return (\n        props.groupedOptions || [\n          {\n            group: '',\n            options: props.options || [],\n          },\n        ]\n      );\n    });\n\n    const sanitizedAttributes = computed(() => {\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      const { ...sanitized } = attrs;\n      return sanitized;\n    });\n\n    const computedLabel = computed(() => {\n      if (props.multiple && props.modelValue.length > 0) {\n        if (props.multiselectPlaceholder) {\n          return props.multiselectPlaceholder;\n        } else if (props.modelValue.length > 1) {\n          return `${props.modelValue.length} items selected`;\n        } else {\n          const selected = flattenedOptions.value.find((option) => option.key === props.modelValue[0]);\n          return selected?.label || '';\n        }\n      } else if (props.modelValue) {\n        const selected = flattenedOptions.value.find((option) => option.key === props.modelValue);\n\n        if (selected) {\n          return selected.label;\n        }\n      }\n\n      return props.placeholder;\n    });\n\n    const labelIsPlaceholder = computed(() => !props.modelValue || props.modelValue.length === 0);\n\n    const computedIcon = computed(() => {\n      if (props.modelValue) {\n        const selected = flattenedOptions.value.find((option) => option.key === props.modelValue);\n\n        if (selected) {\n          return selected.icon;\n        }\n      }\n\n      return props.placeholderIcon;\n    });\n\n    const nativeSelectChange = (event: Event) => {\n      const selectedKeys = Array.from((event.target as HTMLSelectElement).options)\n        .filter((opt) => opt.selected)\n        .map((opt) => opt.value);\n      const selectedOptions = flattenedOptions.value.filter((v) => selectedKeys.indexOf(v.key) >= 0);\n      const value = props.multiple ? selectedOptions.map((value) => value.key) : selectedOptions[0].key;\n      emitInputEvent(value);\n    };\n\n    const changeHighlighted = (key: string) => {\n      highlightedKey.value = key;\n      highlightedIndex.value = flattenedOptions.value.findIndex((opt) => opt.key === key);\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    watch(\n      () => open.value,\n      (open: boolean) => {\n        if (open) {\n          highlightedKey.value = flattenedOptions.value[0].key;\n          highlightedIndex.value = 0;\n          navigateBy(highlightedIndex.value);\n        }\n      },\n    );\n\n    return {\n      dropdown,\n      open,\n      highlightedKey,\n      highlightedIndex,\n      flattenedOptions,\n      computedLabel,\n      sanitizedAttributes,\n      computedOptions,\n      computedIcon,\n      labelIsPlaceholder,\n      clickOption,\n      nativeSelectChange,\n      changeHighlighted,\n      onPlacement,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonDropdown","NeonIcon","NeonSwitch","NeonSize","NeonFunctionalColor","NeonDropdownStyle","NeonDropdownPlacement","props","emit","attrs","useAttrs","dropdown","ref","open","dropdownPlacement","highlightedKey","highlightedIndex","flattenedOptions","computed","_a","group","isReverse","onNavigate","element","_b","NeonScrollUtils","navigateBy","offset","$event","newIndex","emitInputEvent","value","clickOption","option","values","index","v","keyboardHandler","reverseOffset","computedOptions","sanitizedAttributes","sanitized","computedLabel","selected","labelIsPlaceholder","computedIcon","nativeSelectChange","event","selectedKeys","opt","selectedOptions","changeHighlighted","key","onPlacement","placement","onMounted","onUnmounted","watch"],"mappings":"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"}

package/dist/components/user-input/select/NeonSelect.vue.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const r=require("./NeonSelect.cjs.js"),e=require("vue"),c=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),p={class:"neon-select__wrapper"},u={class:"no-style neon-select__options"},m={class:"neon-select__option-container"},k={class:"neon-select__option-label"},b=["id","aria-selected","onMouseover","onClickCapture","onEnter"],y={class:"neon-select__option-container"},h={class:"neon-select__option-label"},g=["disabled","multiple"],B=["selected"],V=["label"],v=["data-index","disabled","multiple","selected","value"],_=["data-index","disabled","multiple","selected","value"];function E(l,t,N,f,$,w){const a=e.resolveComponent("neon-switch"),i=e.resolveComponent("neon-icon"),d=e.resolveComponent("neon-dropdown");return e.openBlock(),e.createElementBlock("div",p,[e.createVNode(d,e.mergeProps({id:l.id,ref:"dropdown",modelValue:l.open,"onUpdate:modelValue":t[0]||(t[0]=n=>l.open=n),"aria-activedescendant":l.multiple?l.modelValue[0]:l.modelValue,"aria-multiselectable":l.multiple,class:[[`neon-select--${l.color}`,{"neon-select--grouped":l.groupedOptions,"neon-select--multiple":l.multiple}],"neon-select"],color:l.color,disabled:l.disabled,icon:l.computedIcon,label:l.computedLabel,size:l.size,role:"listbox"},l.sanitizedAttributes,{onDropdownPlacement:l.onPlacement}),{default:e.withCtx(()=>[e.createElementVNode("ul",u,[l.placeholderAsOption?(e.openBlock(),e.createElementBlock("li",{key:0,class:e.normalizeClass([`neon-select__option--${l.size}`,"neon-select__option neon-select__option--disabled neon-select__option-placeholder"])},[e.createElementVNode("div",m,[e.createElementVNode("span",k,e.toDisplayString(l.placeholder),1)])],2)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.computedOptions,n=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[n.group!==""?(e.openBlock(),e.createElementBlock("li",{key:n.group,class:"neon-select__option-title"},e.toDisplayString(n.group),1)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.options,o=>(e.openBlock(),e.createElementBlock("li",{id:o.key,key:o.key,"aria-selected":l.multiple?l.modelValue.indexOf(o.key)>=0:o.key===l.modelValue,class:e.normalizeClass([[{"neon-select__option--disabled":o.disabled,"neon-select__option--separator-before":o.separatorBefore,"neon-select__option--selected":l.multiple?l.modelValue.indexOf(o.key)>=0:o.key===l.modelValue,"neon-select__option--highlighted":o.key===l.highlightedKey},`neon-select__option--${l.size}`],"neon-select__option"]),role:"option",tabindex:"0",onMouseover:s=>l.changeHighlighted(o.key),onClickCapture:e.withModifiers(s=>!o.disabled&&l.clickOption(o),["stop","prevent"]),onEnter:e.withModifiers(s=>!o.disabled&&l.clickOption(o),["stop","prevent"])},[e.createElementVNode("div",y,[e.renderSlot(l.$slots,"option",{option:o},()=>[l.multiple?(e.openBlock(),e.createBlock(a,{key:0,color:l.color,modelValue:l.modelValue.indexOf(o.key)>=0,size:l.size==="l"?"m":"s","switch-style":"checkbox"},null,8,["color","modelValue","size"])):e.createCommentVNode("",!0),o.icon?(e.openBlock(),e.createBlock(i,{key:1,disabled:o.disabled,name:o.icon,class:"neon-select__option-icon"},null,8,["disabled","name"])):e.createCommentVNode("",!0),e.createElementVNode("span",h,e.toDisplayString(o.label),1)])])],42,b))),128))],64))),256))])]),_:3},16,["id","modelValue","aria-activedescendant","aria-multiselectable","class","color","disabled","icon","label","size","onDropdownPlacement"]),e.createElementVNode("select",e.mergeProps({disabled:l.disabled,multiple:l.multiple,class:"neon-select__native"},l.sanitizedAttributes,{onInput:t[1]||(t[1]=(...n)=>l.nativeSelectChange&&l.nativeSelectChange(...n))}),[e.createElementVNode("option",{selected:l.multiple?l.modelValue.length===0:l.modelValue==="",disabled:"",hidden:"",value:""},e.toDisplayString(l.placeholder),9,B),l.groupedOptions?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(l.groupedOptions,n=>(e.openBlock(),e.createElementBlock("optgroup",{key:n.group,label:n.group},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.options,(o,s)=>(e.openBlock(),e.createElementBlock("option",{key:`${o.key}-native`,"data-index":s,disabled:o.disabled,multiple:l.multiple,selected:l.multiple?l.modelValue.indexOf(o.key)>=0:o.key===l.modelValue,value:o.key},e.toDisplayString(o.label),9,v))),128))],8,V))),128)):(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:1},e.renderList(l.options,(n,o)=>(e.openBlock(),e.createElementBlock("option",{key:`${n.key}-native`,"data-index":o,disabled:n.disabled,multiple:l.multiple,selected:l.multiple?l.modelValue.indexOf(n.key)>=0:n.key===l.modelValue,value:n.key},e.toDisplayString(n.label),9,_))),128))],16,g)])}const C=c(r,[["render",E]]);module.exports=C;
+"use strict";const r=require("./NeonSelect.cjs.js"),e=require("vue"),c=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),p={class:"neon-select__wrapper"},u={class:"no-style neon-select__options"},m={class:"neon-select__option-container"},k={class:"neon-select__option-label"},b=["id","aria-selected","onMouseover","onClickCapture","onEnter"],y={class:"neon-select__option-container"},h={class:"neon-select__option-label"},g=["disabled","multiple"],B=["selected"],V=["label"],v=["data-index","disabled","multiple","selected","value"],E=["data-index","disabled","multiple","selected","value"];function _(l,t,w,N,f,$){const a=e.resolveComponent("neon-switch"),i=e.resolveComponent("neon-icon"),d=e.resolveComponent("neon-dropdown");return e.openBlock(),e.createElementBlock("div",p,[e.createVNode(d,e.mergeProps({id:l.id,ref:"dropdown",modelValue:l.open,"onUpdate:modelValue":t[0]||(t[0]=n=>l.open=n),"aria-activedescendant":l.multiple?l.modelValue[0]:l.modelValue,"aria-multiselectable":l.multiple,class:[[`neon-select--${l.color}`,{"neon-select--grouped":l.groupedOptions,"neon-select--multiple":l.multiple,"neon-select--with-placeholder":l.labelIsPlaceholder}],"neon-select"],color:l.color,disabled:l.disabled,"dropdown-style":l.buttonStyle,icon:l.computedIcon,label:l.computedLabel,size:l.size,role:"listbox"},l.sanitizedAttributes,{onDropdownPlacement:l.onPlacement}),{default:e.withCtx(()=>[e.createElementVNode("ul",u,[l.placeholderAsOption?(e.openBlock(),e.createElementBlock("li",{key:0,class:e.normalizeClass([`neon-select__option--${l.size}`,"neon-select__option neon-select__option--disabled neon-select__option-placeholder"])},[e.createElementVNode("div",m,[e.createElementVNode("span",k,e.toDisplayString(l.placeholder),1)])],2)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.computedOptions,n=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[n.group!==""?(e.openBlock(),e.createElementBlock("li",{key:n.group,class:"neon-select__option-title"},e.toDisplayString(n.group),1)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.options,o=>(e.openBlock(),e.createElementBlock("li",{id:o.key,key:o.key,"aria-selected":l.multiple?l.modelValue.indexOf(o.key)>=0:o.key===l.modelValue,class:e.normalizeClass([[{"neon-select__option--disabled":o.disabled,"neon-select__option--separator-before":o.separatorBefore,"neon-select__option--selected":l.multiple?l.modelValue.indexOf(o.key)>=0:o.key===l.modelValue,"neon-select__option--highlighted":o.key===l.highlightedKey},`neon-select__option--${l.size}`],"neon-select__option"]),role:"option",tabindex:"0",onMouseover:s=>l.changeHighlighted(o.key),onClickCapture:e.withModifiers(s=>!o.disabled&&l.clickOption(o),["stop","prevent"]),onEnter:e.withModifiers(s=>!o.disabled&&l.clickOption(o),["stop","prevent"])},[e.createElementVNode("div",y,[e.renderSlot(l.$slots,"option",{option:o},()=>[l.multiple?(e.openBlock(),e.createBlock(a,{key:0,color:l.color,modelValue:l.modelValue.indexOf(o.key)>=0,size:l.size==="l"?"m":"s","switch-style":"checkbox"},null,8,["color","modelValue","size"])):e.createCommentVNode("",!0),o.icon?(e.openBlock(),e.createBlock(i,{key:1,disabled:o.disabled,name:o.icon,class:"neon-select__option-icon"},null,8,["disabled","name"])):e.createCommentVNode("",!0),e.createElementVNode("span",h,e.toDisplayString(o.label),1)])])],42,b))),128))],64))),256))])]),_:3},16,["id","modelValue","aria-activedescendant","aria-multiselectable","class","color","disabled","dropdown-style","icon","label","size","onDropdownPlacement"]),e.createElementVNode("select",e.mergeProps({disabled:l.disabled,multiple:l.multiple,class:"neon-select__native"},l.sanitizedAttributes,{onInput:t[1]||(t[1]=(...n)=>l.nativeSelectChange&&l.nativeSelectChange(...n))}),[e.createElementVNode("option",{selected:l.multiple?l.modelValue.length===0:l.modelValue==="",disabled:"",hidden:"",value:""},e.toDisplayString(l.placeholder),9,B),l.groupedOptions?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(l.groupedOptions,n=>(e.openBlock(),e.createElementBlock("optgroup",{key:n.group,label:n.group},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.options,(o,s)=>(e.openBlock(),e.createElementBlock("option",{key:`${o.key}-native`,"data-index":s,disabled:o.disabled,multiple:l.multiple,selected:l.multiple?l.modelValue.indexOf(o.key)>=0:o.key===l.modelValue,value:o.key},e.toDisplayString(o.label),9,v))),128))],8,V))),128)):(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:1},e.renderList(l.options,(n,o)=>(e.openBlock(),e.createElementBlock("option",{key:`${n.key}-native`,"data-index":o,disabled:n.disabled,multiple:l.multiple,selected:l.multiple?l.modelValue.indexOf(n.key)>=0:n.key===l.modelValue,value:n.key},e.toDisplayString(n.label),9,E))),128))],16,g)])}const C=c(r,[["render",_]]);module.exports=C;
 //# sourceMappingURL=NeonSelect.vue.cjs.js.map

package/dist/components/user-input/select/NeonSelect.vue.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonSelect.vue.cjs.js","sources":["../../../../src/components/user-input/select/NeonSelect.vue"],"sourcesContent":["<template>\n  <div class=\"neon-select__wrapper\">\n    <neon-dropdown\n      :id=\"id\"\n      ref=\"dropdown\"\n      v-model=\"open\"\n      :aria-activedescendant=\"multiple ? modelValue[0] : modelValue\"\n      :aria-multiselectable=\"multiple\"\n      :class=\"[`neon-select--${color}`, { 'neon-select--grouped': groupedOptions, 'neon-select--multiple': multiple }]\"\n      :color=\"color\"\n      :disabled=\"disabled\"\n      :icon=\"computedIcon\"\n      :label=\"computedLabel\"\n      :size=\"size\"\n      class=\"neon-select\"\n      role=\"listbox\"\n      v-bind=\"sanitizedAttributes\"\n      @dropdown-placement=\"onPlacement\"\n    >\n      <ul class=\"no-style neon-select__options\">\n        <li\n          v-if=\"placeholderAsOption\"\n          :class=\"`neon-select__option--${size}`\"\n          class=\"neon-select__option neon-select__option--disabled neon-select__option-placeholder\"\n        >\n          <div class=\"neon-select__option-container\">\n            <span class=\"neon-select__option-label\">{{ placeholder }}</span>\n          </div>\n        </li>\n        <template v-for=\"group in computedOptions\">\n          <li v-if=\"group.group !== ''\" :key=\"group.group\" class=\"neon-select__option-title\">{{ group.group }}</li>\n          <li\n            v-for=\"option in group.options\"\n            :id=\"option.key\"\n            :key=\"option.key\"\n            :aria-selected=\"multiple ? modelValue.indexOf(option.key) >= 0 : option.key === modelValue\"\n            :class=\"[\n              {\n                'neon-select__option--disabled': option.disabled,\n                'neon-select__option--separator-before': option.separatorBefore,\n                'neon-select__option--selected': multiple\n                  ? modelValue.indexOf(option.key) >= 0\n                  : option.key === modelValue,\n                'neon-select__option--highlighted': option.key === highlightedKey,\n              },\n              `neon-select__option--${size}`,\n            ]\"\n            class=\"neon-select__option\"\n            role=\"option\"\n            tabindex=\"0\"\n            @mouseover=\"changeHighlighted(option.key)\"\n            @click.stop.prevent.capture=\"!option.disabled && clickOption(option)\"\n            @enter.stop.prevent=\"!option.disabled && clickOption(option)\"\n          >\n            <div class=\"neon-select__option-container\">\n              <!-- @slot provide a custom template for an option.<br />Bindings: <strong>option</strong>\n              (<em>NeonSelectOption</em>). This slot is purely for formatting the option, all accessibility actions\n              still apply. -->\n              <slot :option=\"option\" name=\"option\">\n                <neon-switch\n                  v-if=\"multiple\"\n                  :color=\"color\"\n                  :modelValue=\"modelValue.indexOf(option.key) >= 0\"\n                  :size=\"size === 'l' ? 'm' : 's'\"\n                  switch-style=\"checkbox\"\n                />\n                <neon-icon\n                  v-if=\"option.icon\"\n                  :disabled=\"option.disabled\"\n                  :name=\"option.icon\"\n                  class=\"neon-select__option-icon\"\n                />\n                <span class=\"neon-select__option-label\">{{ option.label }}</span>\n              </slot>\n            </div>\n          </li>\n        </template>\n      </ul>\n    </neon-dropdown>\n    <select\n      :disabled=\"disabled\"\n      :multiple=\"multiple\"\n      class=\"neon-select__native\"\n      v-bind=\"sanitizedAttributes\"\n      @input=\"nativeSelectChange\"\n    >\n      <option :selected=\"multiple ? modelValue.length === 0 : modelValue === ''\" disabled hidden value=\"\">\n        {{ placeholder }}\n      </option>\n      <template v-if=\"groupedOptions\">\n        <optgroup v-for=\"group in groupedOptions\" :key=\"group.group\" :label=\"group.group\">\n          <option\n            v-for=\"(option, index) in group.options\"\n            :key=\"`${option.key}-native`\"\n            :data-index=\"index\"\n            :disabled=\"option.disabled\"\n            :multiple=\"multiple\"\n            :selected=\"multiple ? modelValue.indexOf(option.key) >= 0 : option.key === modelValue\"\n            :value=\"option.key\"\n          >\n            {{ option.label }}\n          </option>\n        </optgroup>\n      </template>\n      <template v-else>\n        <option\n          v-for=\"(option, index) in options\"\n          :key=\"`${option.key}-native`\"\n          :data-index=\"index\"\n          :disabled=\"option.disabled\"\n          :multiple=\"multiple\"\n          :selected=\"multiple ? modelValue.indexOf(option.key) >= 0 : option.key === modelValue\"\n          :value=\"option.key\"\n        >\n          {{ option.label }}\n        </option>\n      </template>\n    </select>\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonSelect.ts\"></script>\n"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_6","_hoisted_7","_openBlock","_createElementBlock","_createVNode","_component_neon_dropdown","_mergeProps","_ctx","$event","_createElementVNode","_normalizeClass","_toDisplayString","_Fragment","_renderList","group","option","_withModifiers","_renderSlot","_createBlock","_component_neon_switch","_component_neon_icon","args","_hoisted_9","index","_hoisted_11","_hoisted_12"],"mappings":"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"}
+{"version":3,"file":"NeonSelect.vue.cjs.js","sources":["../../../../src/components/user-input/select/NeonSelect.vue"],"sourcesContent":["<template>\n  <div class=\"neon-select__wrapper\">\n    <neon-dropdown\n      :id=\"id\"\n      ref=\"dropdown\"\n      v-model=\"open\"\n      :aria-activedescendant=\"multiple ? modelValue[0] : modelValue\"\n      :aria-multiselectable=\"multiple\"\n      :class=\"[\n        `neon-select--${color}`,\n        {\n          'neon-select--grouped': groupedOptions,\n          'neon-select--multiple': multiple,\n          'neon-select--with-placeholder': labelIsPlaceholder,\n        },\n      ]\"\n      :color=\"color\"\n      :disabled=\"disabled\"\n      :dropdown-style=\"buttonStyle\"\n      :icon=\"computedIcon\"\n      :label=\"computedLabel\"\n      :size=\"size\"\n      class=\"neon-select\"\n      role=\"listbox\"\n      v-bind=\"sanitizedAttributes\"\n      @dropdown-placement=\"onPlacement\"\n    >\n      <ul class=\"no-style neon-select__options\">\n        <li\n          v-if=\"placeholderAsOption\"\n          :class=\"`neon-select__option--${size}`\"\n          class=\"neon-select__option neon-select__option--disabled neon-select__option-placeholder\"\n        >\n          <div class=\"neon-select__option-container\">\n            <span class=\"neon-select__option-label\">{{ placeholder }}</span>\n          </div>\n        </li>\n        <template v-for=\"group in computedOptions\">\n          <li v-if=\"group.group !== ''\" :key=\"group.group\" class=\"neon-select__option-title\">{{ group.group }}</li>\n          <li\n            v-for=\"option in group.options\"\n            :id=\"option.key\"\n            :key=\"option.key\"\n            :aria-selected=\"multiple ? modelValue.indexOf(option.key) >= 0 : option.key === modelValue\"\n            :class=\"[\n              {\n                'neon-select__option--disabled': option.disabled,\n                'neon-select__option--separator-before': option.separatorBefore,\n                'neon-select__option--selected': multiple\n                  ? modelValue.indexOf(option.key) >= 0\n                  : option.key === modelValue,\n                'neon-select__option--highlighted': option.key === highlightedKey,\n              },\n              `neon-select__option--${size}`,\n            ]\"\n            class=\"neon-select__option\"\n            role=\"option\"\n            tabindex=\"0\"\n            @mouseover=\"changeHighlighted(option.key)\"\n            @click.stop.prevent.capture=\"!option.disabled && clickOption(option)\"\n            @enter.stop.prevent=\"!option.disabled && clickOption(option)\"\n          >\n            <div class=\"neon-select__option-container\">\n              <!-- @slot provide a custom template for an option.<br />Bindings: <strong>option</strong>\n              (<em>NeonSelectOption</em>). This slot is purely for formatting the option, all accessibility actions\n              still apply. -->\n              <slot :option=\"option\" name=\"option\">\n                <neon-switch\n                  v-if=\"multiple\"\n                  :color=\"color\"\n                  :modelValue=\"modelValue.indexOf(option.key) >= 0\"\n                  :size=\"size === 'l' ? 'm' : 's'\"\n                  switch-style=\"checkbox\"\n                />\n                <neon-icon\n                  v-if=\"option.icon\"\n                  :disabled=\"option.disabled\"\n                  :name=\"option.icon\"\n                  class=\"neon-select__option-icon\"\n                />\n                <span class=\"neon-select__option-label\">{{ option.label }}</span>\n              </slot>\n            </div>\n          </li>\n        </template>\n      </ul>\n    </neon-dropdown>\n    <select\n      :disabled=\"disabled\"\n      :multiple=\"multiple\"\n      class=\"neon-select__native\"\n      v-bind=\"sanitizedAttributes\"\n      @input=\"nativeSelectChange\"\n    >\n      <option :selected=\"multiple ? modelValue.length === 0 : modelValue === ''\" disabled hidden value=\"\">\n        {{ placeholder }}\n      </option>\n      <template v-if=\"groupedOptions\">\n        <optgroup v-for=\"group in groupedOptions\" :key=\"group.group\" :label=\"group.group\">\n          <option\n            v-for=\"(option, index) in group.options\"\n            :key=\"`${option.key}-native`\"\n            :data-index=\"index\"\n            :disabled=\"option.disabled\"\n            :multiple=\"multiple\"\n            :selected=\"multiple ? modelValue.indexOf(option.key) >= 0 : option.key === modelValue\"\n            :value=\"option.key\"\n          >\n            {{ option.label }}\n          </option>\n        </optgroup>\n      </template>\n      <template v-else>\n        <option\n          v-for=\"(option, index) in options\"\n          :key=\"`${option.key}-native`\"\n          :data-index=\"index\"\n          :disabled=\"option.disabled\"\n          :multiple=\"multiple\"\n          :selected=\"multiple ? modelValue.indexOf(option.key) >= 0 : option.key === modelValue\"\n          :value=\"option.key\"\n        >\n          {{ option.label }}\n        </option>\n      </template>\n    </select>\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonSelect.ts\"></script>\n"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_6","_hoisted_7","_openBlock","_createElementBlock","_createVNode","_component_neon_dropdown","_mergeProps","_ctx","$event","_createElementVNode","_normalizeClass","_toDisplayString","_Fragment","_renderList","group","option","_withModifiers","_renderSlot","_createBlock","_component_neon_switch","_component_neon_icon","args","_hoisted_9","index","_hoisted_11","_hoisted_12"],"mappings":"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"}

package/dist/components/user-input/select/NeonSelect.vue.es.js

@@ -1,26 +1,34 @@
-import _ from "./NeonSelect.es.js";
-import { resolveComponent as m, openBlock as n, createElementBlock as s, createVNode as f, mergeProps as c, withCtx as g, createElementVNode as d, normalizeClass as b, toDisplayString as i, createCommentVNode as p, Fragment as t, renderList as a, withModifiers as k, renderSlot as $, createBlock as h } from "vue";
-import O from "../../../_virtual/_plugin-vue_export-helper.es.js";
-const w = { class: "neon-select__wrapper" }, z = { class: "no-style neon-select__options" }, C = { class: "neon-select__option-container" }, S = { class: "neon-select__option-label" }, B = ["id", "aria-selected", "onMouseover", "onClickCapture", "onEnter"], E = { class: "neon-select__option-container" }, N = { class: "neon-select__option-label" }, P = ["disabled", "multiple"], A = ["selected"], D = ["label"], M = ["data-index", "disabled", "multiple", "selected", "value"], I = ["data-index", "disabled", "multiple", "selected", "value"];
+import f from "./NeonSelect.es.js";
+import { resolveComponent as m, openBlock as n, createElementBlock as s, createVNode as g, mergeProps as c, withCtx as _, createElementVNode as d, normalizeClass as b, toDisplayString as i, createCommentVNode as p, Fragment as t, renderList as a, withModifiers as h, renderSlot as w, createBlock as k } from "vue";
+import $ from "../../../_virtual/_plugin-vue_export-helper.es.js";
+const O = { class: "neon-select__wrapper" }, z = { class: "no-style neon-select__options" }, C = { class: "neon-select__option-container" }, S = { class: "neon-select__option-label" }, P = ["id", "aria-selected", "onMouseover", "onClickCapture", "onEnter"], B = { class: "neon-select__option-container" }, E = { class: "neon-select__option-label" }, N = ["disabled", "multiple"], A = ["selected"], D = ["label"], I = ["data-index", "disabled", "multiple", "selected", "value"], M = ["data-index", "disabled", "multiple", "selected", "value"];
 function L(e, r, F, H, K, U) {
   const y = m("neon-switch"), v = m("neon-icon"), V = m("neon-dropdown");
-  return n(), s("div", w, [
-    f(V, c({
+  return n(), s("div", O, [
+    g(V, c({
       id: e.id,
       ref: "dropdown",
       modelValue: e.open,
       "onUpdate:modelValue": r[0] || (r[0] = (o) => e.open = o),
       "aria-activedescendant": e.multiple ? e.modelValue[0] : e.modelValue,
       "aria-multiselectable": e.multiple,
-      class: [[`neon-select--${e.color}`, { "neon-select--grouped": e.groupedOptions, "neon-select--multiple": e.multiple }], "neon-select"],
+      class: [[
+        `neon-select--${e.color}`,
+        {
+          "neon-select--grouped": e.groupedOptions,
+          "neon-select--multiple": e.multiple,
+          "neon-select--with-placeholder": e.labelIsPlaceholder
+        }
+      ], "neon-select"],
       color: e.color,
       disabled: e.disabled,
+      "dropdown-style": e.buttonStyle,
       icon: e.computedIcon,
       label: e.computedLabel,
       size: e.size,
       role: "listbox"
     }, e.sanitizedAttributes, { onDropdownPlacement: e.onPlacement }), {
-      default: g(() => [
+      default: _(() => [
         d("ul", z, [
           e.placeholderAsOption ? (n(), s("li", {
             key: 0,
@@ -51,33 +59,33 @@ function L(e, r, F, H, K, U) {
               role: "option",
               tabindex: "0",
               onMouseover: (u) => e.changeHighlighted(l.key),
-              onClickCapture: k((u) => !l.disabled && e.clickOption(l), ["stop", "prevent"]),
-              onEnter: k((u) => !l.disabled && e.clickOption(l), ["stop", "prevent"])
+              onClickCapture: h((u) => !l.disabled && e.clickOption(l), ["stop", "prevent"]),
+              onEnter: h((u) => !l.disabled && e.clickOption(l), ["stop", "prevent"])
             }, [
-              d("div", E, [
-                $(e.$slots, "option", { option: l }, () => [
-                  e.multiple ? (n(), h(y, {
+              d("div", B, [
+                w(e.$slots, "option", { option: l }, () => [
+                  e.multiple ? (n(), k(y, {
                     key: 0,
                     color: e.color,
                     modelValue: e.modelValue.indexOf(l.key) >= 0,
                     size: e.size === "l" ? "m" : "s",
                     "switch-style": "checkbox"
                   }, null, 8, ["color", "modelValue", "size"])) : p("", !0),
-                  l.icon ? (n(), h(v, {
+                  l.icon ? (n(), k(v, {
                     key: 1,
                     disabled: l.disabled,
                     name: l.icon,
                     class: "neon-select__option-icon"
                   }, null, 8, ["disabled", "name"])) : p("", !0),
-                  d("span", N, i(l.label), 1)
+                  d("span", E, i(l.label), 1)
                 ])
               ])
-            ], 42, B))), 128))
+            ], 42, P))), 128))
           ], 64))), 256))
         ])
       ]),
       _: 3
-    }, 16, ["id", "modelValue", "aria-activedescendant", "aria-multiselectable", "class", "color", "disabled", "icon", "label", "size", "onDropdownPlacement"]),
+    }, 16, ["id", "modelValue", "aria-activedescendant", "aria-multiselectable", "class", "color", "disabled", "dropdown-style", "icon", "label", "size", "onDropdownPlacement"]),
     d("select", c({
       disabled: e.disabled,
       multiple: e.multiple,
@@ -102,7 +110,7 @@ function L(e, r, F, H, K, U) {
           multiple: e.multiple,
           selected: e.multiple ? e.modelValue.indexOf(l.key) >= 0 : l.key === e.modelValue,
           value: l.key
-        }, i(l.label), 9, M))), 128))
+        }, i(l.label), 9, I))), 128))
       ], 8, D))), 128)) : (n(!0), s(t, { key: 1 }, a(e.options, (o, l) => (n(), s("option", {
         key: `${o.key}-native`,
         "data-index": l,
@@ -110,11 +118,11 @@ function L(e, r, F, H, K, U) {
         multiple: e.multiple,
         selected: e.multiple ? e.modelValue.indexOf(o.key) >= 0 : o.key === e.modelValue,
         value: o.key
-      }, i(o.label), 9, I))), 128))
-    ], 16, P)
+      }, i(o.label), 9, M))), 128))
+    ], 16, N)
   ]);
 }
-const J = /* @__PURE__ */ O(_, [["render", L]]);
+const J = /* @__PURE__ */ $(f, [["render", L]]);
 export {
   J as default
 };

package/dist/components/user-input/select/NeonSelect.vue.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"NeonSelect.vue.es.js","sources":["../../../../src/components/user-input/select/NeonSelect.vue"],"sourcesContent":["<template>\n  <div class=\"neon-select__wrapper\">\n    <neon-dropdown\n      :id=\"id\"\n      ref=\"dropdown\"\n      v-model=\"open\"\n      :aria-activedescendant=\"multiple ? modelValue[0] : modelValue\"\n      :aria-multiselectable=\"multiple\"\n      :class=\"[`neon-select--${color}`, { 'neon-select--grouped': groupedOptions, 'neon-select--multiple': multiple }]\"\n      :color=\"color\"\n      :disabled=\"disabled\"\n      :icon=\"computedIcon\"\n      :label=\"computedLabel\"\n      :size=\"size\"\n      class=\"neon-select\"\n      role=\"listbox\"\n      v-bind=\"sanitizedAttributes\"\n      @dropdown-placement=\"onPlacement\"\n    >\n      <ul class=\"no-style neon-select__options\">\n        <li\n          v-if=\"placeholderAsOption\"\n          :class=\"`neon-select__option--${size}`\"\n          class=\"neon-select__option neon-select__option--disabled neon-select__option-placeholder\"\n        >\n          <div class=\"neon-select__option-container\">\n            <span class=\"neon-select__option-label\">{{ placeholder }}</span>\n          </div>\n        </li>\n        <template v-for=\"group in computedOptions\">\n          <li v-if=\"group.group !== ''\" :key=\"group.group\" class=\"neon-select__option-title\">{{ group.group }}</li>\n          <li\n            v-for=\"option in group.options\"\n            :id=\"option.key\"\n            :key=\"option.key\"\n            :aria-selected=\"multiple ? modelValue.indexOf(option.key) >= 0 : option.key === modelValue\"\n            :class=\"[\n              {\n                'neon-select__option--disabled': option.disabled,\n                'neon-select__option--separator-before': option.separatorBefore,\n                'neon-select__option--selected': multiple\n                  ? modelValue.indexOf(option.key) >= 0\n                  : option.key === modelValue,\n                'neon-select__option--highlighted': option.key === highlightedKey,\n              },\n              `neon-select__option--${size}`,\n            ]\"\n            class=\"neon-select__option\"\n            role=\"option\"\n            tabindex=\"0\"\n            @mouseover=\"changeHighlighted(option.key)\"\n            @click.stop.prevent.capture=\"!option.disabled && clickOption(option)\"\n            @enter.stop.prevent=\"!option.disabled && clickOption(option)\"\n          >\n            <div class=\"neon-select__option-container\">\n              <!-- @slot provide a custom template for an option.<br />Bindings: <strong>option</strong>\n              (<em>NeonSelectOption</em>). This slot is purely for formatting the option, all accessibility actions\n              still apply. -->\n              <slot :option=\"option\" name=\"option\">\n                <neon-switch\n                  v-if=\"multiple\"\n                  :color=\"color\"\n                  :modelValue=\"modelValue.indexOf(option.key) >= 0\"\n                  :size=\"size === 'l' ? 'm' : 's'\"\n                  switch-style=\"checkbox\"\n                />\n                <neon-icon\n                  v-if=\"option.icon\"\n                  :disabled=\"option.disabled\"\n                  :name=\"option.icon\"\n                  class=\"neon-select__option-icon\"\n                />\n                <span class=\"neon-select__option-label\">{{ option.label }}</span>\n              </slot>\n            </div>\n          </li>\n        </template>\n      </ul>\n    </neon-dropdown>\n    <select\n      :disabled=\"disabled\"\n      :multiple=\"multiple\"\n      class=\"neon-select__native\"\n      v-bind=\"sanitizedAttributes\"\n      @input=\"nativeSelectChange\"\n    >\n      <option :selected=\"multiple ? modelValue.length === 0 : modelValue === ''\" disabled hidden value=\"\">\n        {{ placeholder }}\n      </option>\n      <template v-if=\"groupedOptions\">\n        <optgroup v-for=\"group in groupedOptions\" :key=\"group.group\" :label=\"group.group\">\n          <option\n            v-for=\"(option, index) in group.options\"\n            :key=\"`${option.key}-native`\"\n            :data-index=\"index\"\n            :disabled=\"option.disabled\"\n            :multiple=\"multiple\"\n            :selected=\"multiple ? modelValue.indexOf(option.key) >= 0 : option.key === modelValue\"\n            :value=\"option.key\"\n          >\n            {{ option.label }}\n          </option>\n        </optgroup>\n      </template>\n      <template v-else>\n        <option\n          v-for=\"(option, index) in options\"\n          :key=\"`${option.key}-native`\"\n          :data-index=\"index\"\n          :disabled=\"option.disabled\"\n          :multiple=\"multiple\"\n          :selected=\"multiple ? modelValue.indexOf(option.key) >= 0 : option.key === modelValue\"\n          :value=\"option.key\"\n        >\n          {{ option.label }}\n        </option>\n      </template>\n    </select>\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonSelect.ts\"></script>\n"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_6","_hoisted_7","_openBlock","_createElementBlock","_createVNode","_component_neon_dropdown","_mergeProps","_ctx","$event","_createElementVNode","_normalizeClass","_toDisplayString","_Fragment","_renderList","group","option","_withModifiers","_renderSlot","_createBlock","_component_neon_switch","_component_neon_icon","args","_hoisted_9","index","_hoisted_11","_hoisted_12"],"mappings":"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"}
+{"version":3,"file":"NeonSelect.vue.es.js","sources":["../../../../src/components/user-input/select/NeonSelect.vue"],"sourcesContent":["<template>\n  <div class=\"neon-select__wrapper\">\n    <neon-dropdown\n      :id=\"id\"\n      ref=\"dropdown\"\n      v-model=\"open\"\n      :aria-activedescendant=\"multiple ? modelValue[0] : modelValue\"\n      :aria-multiselectable=\"multiple\"\n      :class=\"[\n        `neon-select--${color}`,\n        {\n          'neon-select--grouped': groupedOptions,\n          'neon-select--multiple': multiple,\n          'neon-select--with-placeholder': labelIsPlaceholder,\n        },\n      ]\"\n      :color=\"color\"\n      :disabled=\"disabled\"\n      :dropdown-style=\"buttonStyle\"\n      :icon=\"computedIcon\"\n      :label=\"computedLabel\"\n      :size=\"size\"\n      class=\"neon-select\"\n      role=\"listbox\"\n      v-bind=\"sanitizedAttributes\"\n      @dropdown-placement=\"onPlacement\"\n    >\n      <ul class=\"no-style neon-select__options\">\n        <li\n          v-if=\"placeholderAsOption\"\n          :class=\"`neon-select__option--${size}`\"\n          class=\"neon-select__option neon-select__option--disabled neon-select__option-placeholder\"\n        >\n          <div class=\"neon-select__option-container\">\n            <span class=\"neon-select__option-label\">{{ placeholder }}</span>\n          </div>\n        </li>\n        <template v-for=\"group in computedOptions\">\n          <li v-if=\"group.group !== ''\" :key=\"group.group\" class=\"neon-select__option-title\">{{ group.group }}</li>\n          <li\n            v-for=\"option in group.options\"\n            :id=\"option.key\"\n            :key=\"option.key\"\n            :aria-selected=\"multiple ? modelValue.indexOf(option.key) >= 0 : option.key === modelValue\"\n            :class=\"[\n              {\n                'neon-select__option--disabled': option.disabled,\n                'neon-select__option--separator-before': option.separatorBefore,\n                'neon-select__option--selected': multiple\n                  ? modelValue.indexOf(option.key) >= 0\n                  : option.key === modelValue,\n                'neon-select__option--highlighted': option.key === highlightedKey,\n              },\n              `neon-select__option--${size}`,\n            ]\"\n            class=\"neon-select__option\"\n            role=\"option\"\n            tabindex=\"0\"\n            @mouseover=\"changeHighlighted(option.key)\"\n            @click.stop.prevent.capture=\"!option.disabled && clickOption(option)\"\n            @enter.stop.prevent=\"!option.disabled && clickOption(option)\"\n          >\n            <div class=\"neon-select__option-container\">\n              <!-- @slot provide a custom template for an option.<br />Bindings: <strong>option</strong>\n              (<em>NeonSelectOption</em>). This slot is purely for formatting the option, all accessibility actions\n              still apply. -->\n              <slot :option=\"option\" name=\"option\">\n                <neon-switch\n                  v-if=\"multiple\"\n                  :color=\"color\"\n                  :modelValue=\"modelValue.indexOf(option.key) >= 0\"\n                  :size=\"size === 'l' ? 'm' : 's'\"\n                  switch-style=\"checkbox\"\n                />\n                <neon-icon\n                  v-if=\"option.icon\"\n                  :disabled=\"option.disabled\"\n                  :name=\"option.icon\"\n                  class=\"neon-select__option-icon\"\n                />\n                <span class=\"neon-select__option-label\">{{ option.label }}</span>\n              </slot>\n            </div>\n          </li>\n        </template>\n      </ul>\n    </neon-dropdown>\n    <select\n      :disabled=\"disabled\"\n      :multiple=\"multiple\"\n      class=\"neon-select__native\"\n      v-bind=\"sanitizedAttributes\"\n      @input=\"nativeSelectChange\"\n    >\n      <option :selected=\"multiple ? modelValue.length === 0 : modelValue === ''\" disabled hidden value=\"\">\n        {{ placeholder }}\n      </option>\n      <template v-if=\"groupedOptions\">\n        <optgroup v-for=\"group in groupedOptions\" :key=\"group.group\" :label=\"group.group\">\n          <option\n            v-for=\"(option, index) in group.options\"\n            :key=\"`${option.key}-native`\"\n            :data-index=\"index\"\n            :disabled=\"option.disabled\"\n            :multiple=\"multiple\"\n            :selected=\"multiple ? modelValue.indexOf(option.key) >= 0 : option.key === modelValue\"\n            :value=\"option.key\"\n          >\n            {{ option.label }}\n          </option>\n        </optgroup>\n      </template>\n      <template v-else>\n        <option\n          v-for=\"(option, index) in options\"\n          :key=\"`${option.key}-native`\"\n          :data-index=\"index\"\n          :disabled=\"option.disabled\"\n          :multiple=\"multiple\"\n          :selected=\"multiple ? modelValue.indexOf(option.key) >= 0 : option.key === modelValue\"\n          :value=\"option.key\"\n        >\n          {{ option.label }}\n        </option>\n      </template>\n    </select>\n  </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonSelect.ts\"></script>\n"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_6","_hoisted_7","_openBlock","_createElementBlock","_createVNode","_component_neon_dropdown","_mergeProps","_ctx","$event","_createElementVNode","_normalizeClass","_toDisplayString","_Fragment","_renderList","group","option","_withModifiers","_renderSlot","_createBlock","_component_neon_switch","_component_neon_icon","args","_hoisted_9","index","_hoisted_11","_hoisted_12"],"mappings":"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"}