@aotearoan/neon 21.0.2 → 22.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/dist/components/navigation/dropdown-menu/NeonDropdownMenu.cjs.js +1 -1
  2. package/dist/components/navigation/dropdown-menu/NeonDropdownMenu.cjs.js.map +1 -1
  3. package/dist/components/navigation/dropdown-menu/NeonDropdownMenu.es.js +30 -31
  4. package/dist/components/navigation/dropdown-menu/NeonDropdownMenu.es.js.map +1 -1
  5. package/dist/components/navigation/dropdown-menu/NeonDropdownMenu.vue.cjs.js +1 -1
  6. package/dist/components/navigation/dropdown-menu/NeonDropdownMenu.vue.cjs.js.map +1 -1
  7. package/dist/components/navigation/dropdown-menu/NeonDropdownMenu.vue.es.js +23 -23
  8. package/dist/components/navigation/dropdown-menu/NeonDropdownMenu.vue.es.js.map +1 -1
  9. package/dist/components/navigation/menu/NeonMenu.cjs.js +1 -1
  10. package/dist/components/navigation/menu/NeonMenu.cjs.js.map +1 -1
  11. package/dist/components/navigation/menu/NeonMenu.es.js +57 -55
  12. package/dist/components/navigation/menu/NeonMenu.es.js.map +1 -1
  13. package/dist/components/navigation/menu/NeonMenu.vue.cjs.js +1 -1
  14. package/dist/components/navigation/menu/NeonMenu.vue.cjs.js.map +1 -1
  15. package/dist/components/navigation/menu/NeonMenu.vue.es.js +20 -21
  16. package/dist/components/navigation/menu/NeonMenu.vue.es.js.map +1 -1
  17. package/dist/components/presentation/dropdown/NeonDropdown.cjs.js +1 -1
  18. package/dist/components/presentation/dropdown/NeonDropdown.cjs.js.map +1 -1
  19. package/dist/components/presentation/dropdown/NeonDropdown.es.js +38 -47
  20. package/dist/components/presentation/dropdown/NeonDropdown.es.js.map +1 -1
  21. package/dist/components/user-input/search/NeonSearch.cjs.js +1 -1
  22. package/dist/components/user-input/search/NeonSearch.cjs.js.map +1 -1
  23. package/dist/components/user-input/search/NeonSearch.es.js +95 -82
  24. package/dist/components/user-input/search/NeonSearch.es.js.map +1 -1
  25. package/dist/components/user-input/search/NeonSearch.vue.cjs.js +1 -1
  26. package/dist/components/user-input/search/NeonSearch.vue.cjs.js.map +1 -1
  27. package/dist/components/user-input/search/NeonSearch.vue.es.js +19 -19
  28. package/dist/components/user-input/search/NeonSearch.vue.es.js.map +1 -1
  29. package/dist/components/user-input/toggle/NeonToggle.cjs.js +1 -1
  30. package/dist/components/user-input/toggle/NeonToggle.cjs.js.map +1 -1
  31. package/dist/components/user-input/toggle/NeonToggle.es.js +10 -10
  32. package/dist/components/user-input/toggle/NeonToggle.es.js.map +1 -1
  33. package/dist/components/user-input/toggle/NeonToggle.vue.cjs.js +1 -1
  34. package/dist/components/user-input/toggle/NeonToggle.vue.cjs.js.map +1 -1
  35. package/dist/components/user-input/toggle/NeonToggle.vue.es.js +1 -1
  36. package/dist/components/user-input/toggle/NeonToggle.vue.es.js.map +1 -1
  37. package/dist/src/components/navigation/dropdown-menu/NeonDropdownMenu.d.ts +134 -83
  38. package/dist/src/components/navigation/menu/NeonMenu.d.ts +38 -18
  39. package/dist/src/components/navigation/mobile-menu/NeonMobileMenu.d.ts +14 -11
  40. package/dist/src/components/presentation/dropdown/NeonDropdown.d.ts +34 -27
  41. package/dist/src/components/user-input/date-picker/NeonDatePicker.d.ts +5 -18
  42. package/dist/src/components/user-input/search/NeonSearch.d.ts +188 -208
  43. package/dist/src/components/user-input/select/NeonSelect.d.ts +21 -110
  44. package/dist/src/components/user-input/toggle/NeonToggle.d.ts +1 -1
  45. package/package.json +1 -1
  46. package/src/sass/components/_badge.scss +1 -0
  47. package/src/sass/components/_card.scss +7 -7
  48. package/src/sass/components/_skeleton-loader.scss +3 -4
  49. package/src/sass/components/_slider.scss +1 -1
  50. package/src/sass/components/_toggle.scss +9 -3
  51. package/src/sass/variables.scss +10 -7
@@ -1,15 +1,15 @@
1
- import V from "./NeonSearch.es.js";
2
- import { resolveComponent as r, openBlock as l, createElementBlock as s, createVNode as d, mergeProps as u, withCtx as m, createElementVNode as i, Fragment as h, renderList as b, withModifiers as t, normalizeClass as p, renderSlot as $, createBlock as v, createCommentVNode as y, toDisplayString as w, withKeys as g } from "vue";
3
- import z from "../../../_virtual/_plugin-vue_export-helper.es.js";
4
- const A = { class: "neon-search__wrapper" }, O = { class: "no-style neon-search__options" }, S = ["id", "onMouseover", "onClickCapture", "onSpaceCapture", "onEnterCapture"], _ = { class: "neon-search__option-container" }, B = { class: "neon-search__option-label" };
5
- function P(e, n, E, F, N, D) {
6
- const c = r("neon-icon"), k = r("neon-chip"), C = r("neon-input"), f = r("neon-dropdown");
7
- return l(), s("div", A, [
1
+ import $ from "./NeonSearch.es.js";
2
+ import { resolveComponent as r, openBlock as l, createElementBlock as s, createVNode as d, mergeProps as u, withCtx as m, createElementVNode as i, Fragment as h, renderList as b, withModifiers as t, normalizeClass as p, renderSlot as w, createBlock as v, createCommentVNode as k, toDisplayString as g, withKeys as z } from "vue";
3
+ import V from "../../../_virtual/_plugin-vue_export-helper.es.js";
4
+ const _ = { class: "neon-search__wrapper" }, O = { class: "no-style neon-search__options" }, S = ["id", "onMouseover", "onClickCapture", "onSpaceCapture", "onEnterCapture"], B = { class: "neon-search__option-container" }, P = { class: "neon-search__option-label" };
5
+ function A(e, n, D, E, F, N) {
6
+ const c = r("neon-icon"), C = r("neon-chip"), y = r("neon-input"), f = r("neon-dropdown");
7
+ return l(), s("div", _, [
8
8
  d(f, u({
9
9
  ref: "dropdown",
10
10
  modelValue: e.open,
11
11
  "onUpdate:modelValue": n[3] || (n[3] = (o) => e.open = o),
12
- "aria-activedescendant": e.multiple && Array.isArray(e.modelValue) ? e.modelValue[0] && e.modelValue[0].key : e.modelValue,
12
+ "aria-activedescendant": e.activeDescendant,
13
13
  "aria-multiselectable": e.multiple,
14
14
  class: [[
15
15
  `neon-search--${e.color}`,
@@ -40,7 +40,7 @@ function P(e, n, E, F, N, D) {
40
40
  color: "low-contrast",
41
41
  name: "search"
42
42
  }, null, 8, ["disabled"]),
43
- e.multiple && Array.isArray(e.modelValue) ? (l(!0), s(h, { key: 0 }, b(e.modelValue, (o, a) => (l(), v(k, {
43
+ e.multiple && Array.isArray(e.modelValue) ? (l(!0), s(h, { key: 0 }, b(e.modelValue, (o, a) => (l(), v(C, {
44
44
  id: o.key,
45
45
  key: o.key,
46
46
  class: p({ "neon-chip--last-chip": a === e.modelValue.length - 1 }),
@@ -52,23 +52,23 @@ function P(e, n, E, F, N, D) {
52
52
  "aria-selected": "true",
53
53
  role: "option",
54
54
  onClose: (K) => e.removeSelected(o)
55
- }, null, 8, ["id", "class", "color", "disabled", "label", "size", "onClose"]))), 128)) : y("", !0),
56
- d(C, u({
55
+ }, null, 8, ["id", "class", "color", "disabled", "label", "size", "onClose"]))), 128)) : k("", !0),
56
+ d(y, u({
57
57
  ref: "searchInput",
58
58
  autocomplete: e.autocomplete,
59
59
  color: e.color,
60
60
  disabled: e.disabled,
61
- modelValue: e.filter,
61
+ "model-Value": e.filter,
62
62
  placeholder: e.placeholder,
63
63
  size: e.size,
64
64
  class: "neon-search__input"
65
65
  }, e.sanitizedAttributes, {
66
66
  onFocus: n[0] || (n[0] = (o) => e.showOptions()),
67
- onKeydownCapture: n[1] || (n[1] = g(t(() => {
67
+ onKeydownCapture: n[1] || (n[1] = z(t(() => {
68
68
  }, ["prevent", "stop"]), ["enter"])),
69
69
  "onUpdate:modelValue": e.onFilterChange,
70
70
  onIconClick: n[2] || (n[2] = (o) => e.onFilterChange(""))
71
- }), null, 16, ["autocomplete", "color", "disabled", "modelValue", "placeholder", "size", "onUpdate:modelValue"])
71
+ }), null, 16, ["autocomplete", "color", "disabled", "model-Value", "placeholder", "size", "onUpdate:modelValue"])
72
72
  ], 2)
73
73
  ]),
74
74
  default: m(() => [
@@ -91,14 +91,14 @@ function P(e, n, E, F, N, D) {
91
91
  onSpaceCapture: t((a) => e.clickOption(o), ["stop", "prevent"]),
92
92
  onEnterCapture: t((a) => e.clickOption(o), ["stop", "prevent"])
93
93
  }, [
94
- i("div", _, [
95
- $(e.$slots, "option", { option: o }, () => [
94
+ i("div", B, [
95
+ w(e.$slots, "option", { option: o }, () => [
96
96
  o.icon ? (l(), v(c, {
97
97
  key: 0,
98
98
  name: o.icon,
99
99
  class: "neon-search__option-icon"
100
- }, null, 8, ["name"])) : y("", !0),
101
- i("span", B, w(o.label), 1)
100
+ }, null, 8, ["name"])) : k("", !0),
101
+ i("span", P, g(o.label), 1)
102
102
  ])
103
103
  ])
104
104
  ], 42, S))), 128))
@@ -108,7 +108,7 @@ function P(e, n, E, F, N, D) {
108
108
  }, 16, ["modelValue", "aria-activedescendant", "aria-multiselectable", "class", "color", "disabled", "placement", "size", "onDropdownPlacement"])
109
109
  ]);
110
110
  }
111
- const H = /* @__PURE__ */ z(V, [["render", P]]);
111
+ const H = /* @__PURE__ */ V($, [["render", A]]);
112
112
  export {
113
113
  H as default
114
114
  };
@@ -1 +1 @@
1
- {"version":3,"file":"NeonSearch.vue.es.js","sources":["../../../../src/components/user-input/search/NeonSearch.vue"],"sourcesContent":["<template>\n <div class=\"neon-search__wrapper\">\n <neon-dropdown\n ref=\"dropdown\"\n v-model=\"open\"\n :aria-activedescendant=\"multiple && Array.isArray(modelValue) ? modelValue[0] && modelValue[0].key : modelValue\"\n :aria-multiselectable=\"multiple\"\n :class=\"[\n `neon-search--${color}`,\n {\n 'neon-search--multiple': multiple,\n 'neon-search--disabled': disabled,\n 'neon-search--empty': computedOptions.length === 0,\n },\n ]\"\n :color=\"color\"\n :disabled=\"disabled\"\n :placement=\"dropdownPlacement\"\n :size=\"size\"\n class=\"neon-search\"\n role=\"listbox\"\n v-bind=\"sanitizedAttributes\"\n @dropdown-placement=\"onPlacement\"\n >\n <template #dropdown-button>\n <div\n ref=\"dropdownButton\"\n :class=\"[\n `neon-search__container--${size}`,\n `neon-search__container--${color}`,\n { 'neon-search__container--disabled': disabled },\n ]\"\n class=\"neon-search__container\"\n >\n <neon-icon :disabled=\"disabled\" class=\"neon-search__search-icon\" color=\"low-contrast\" name=\"search\" />\n <template v-if=\"multiple && Array.isArray(modelValue)\">\n <neon-chip\n v-for=\"(selected, index) in modelValue\"\n :id=\"selected.key\"\n :key=\"selected.key\"\n :class=\"{ 'neon-chip--last-chip': index === modelValue.length - 1 }\"\n :color=\"selected.chipColor\"\n :disabled=\"disabled\"\n :label=\"selected.label\"\n :size=\"size\"\n action=\"remove\"\n aria-selected=\"true\"\n role=\"option\"\n @close=\"removeSelected(selected)\"\n />\n </template>\n <neon-input\n ref=\"searchInput\"\n :autocomplete=\"autocomplete\"\n :color=\"color\"\n :disabled=\"disabled\"\n :modelValue=\"filter\"\n :placeholder=\"placeholder\"\n :size=\"size\"\n class=\"neon-search__input\"\n v-bind=\"sanitizedAttributes\"\n @focus=\"showOptions()\"\n @keydown.enter.prevent.stop.capture=\"\"\n @update:modelValue=\"onFilterChange\"\n @icon-click=\"onFilterChange('')\"\n />\n </div>\n </template>\n <template #default>\n <ul class=\"no-style neon-search__options\">\n <li\n v-for=\"option in computedOptions\"\n :id=\"option.key\"\n :key=\"option.key\"\n :class=\"[\n {\n 'neon-search__option--separator-before': option.separatorBefore,\n 'neon-search__option--highlighted': option.key === highlightedKey,\n },\n `neon-search__option--${size}`,\n ]\"\n aria-selected=\"false\"\n class=\"neon-search__option\"\n role=\"option\"\n tabindex=\"0\"\n @mouseover=\"changeHighlighted(option.key)\"\n @click.stop.prevent.capture=\"clickOption(option)\"\n @space.stop.prevent.capture=\"clickOption(option)\"\n @enter.stop.prevent.capture=\"clickOption(option)\"\n >\n <div class=\"neon-search__option-container\">\n <!-- @slot provide a custom template for an option.<br />Bindings: <strong>option</strong>\n (<em>NeonSearchOption</em>). This slot is purely for formatting the option, all accessibility actions\n still apply. -->\n <slot :option=\"option\" name=\"option\">\n <neon-icon v-if=\"option.icon\" :name=\"option.icon\" class=\"neon-search__option-icon\" />\n <span class=\"neon-search__option-label\">{{ option.label }}</span>\n </slot>\n </div>\n </li>\n </ul>\n </template>\n </neon-dropdown>\n </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonSearch.ts\"></script>\n"],"names":["_hoisted_1","_hoisted_2","_hoisted_4","_hoisted_5","_openBlock","_createElementBlock","_createVNode","_component_neon_dropdown","_mergeProps","_ctx","$event","_createElementVNode","_normalizeClass","_component_neon_icon","_Fragment","_renderList","selected","index","_createBlock","_component_neon_chip","_component_neon_input","option","_withModifiers","_renderSlot","_toDisplayString"],"mappings":";;;AACO,MAAAA,IAAA,EAAA,OAAM,uBAAsB,GAoEvBC,IAAA,EAAA,OAAM,gCAA+B,oFAqBhCC,IAAA,EAAA,OAAM,gCAA+B,GAMhCC,IAAA,EAAA,OAAM,4BAA2B;;;AA/FrD,SAAAC,EAAA,GAAAC,EAsGM,OAtGNL,GAsGM;AAAA,IArGJM,EAoGgBC,GApGhBC,EAoGgB;AAAA,MAnGd,KAAI;AAAA,kBACKC,EAAA;AAAA,oDAAAA,EAAA,OAAIC;AAAA,MACZ,yBAAuBD,EAAA,YAAY,MAAM,QAAQA,EAAA,UAAU,IAAIA,aAAU,CAAA,KAAOA,EAAA,WAAU,CAAA,EAAI,MAAMA,EAAA;AAAA,MACpG,wBAAsBA,EAAA;AAAA,MACtB,OAAK,CAAA;AAAA,wBAA4BA,EAAA,KAAK;AAAA;mCAAiDA,EAAA;AAAA,mCAA6CA,EAAA;AAAA,UAA0C,sBAAAA,EAAA,gBAAgB,WAAM;AAAA;SAY/L,aAAa;AAAA,MAJlB,OAAOA,EAAA;AAAA,MACP,UAAUA,EAAA;AAAA,MACV,WAAWA,EAAA;AAAA,MACX,MAAMA,EAAA;AAAA,MAEP,MAAK;AAAA,OACGA,EAAA,qBAAmB,EAC1B,qBAAoBA,EAAA,YAAW,CAAA,GAAA;AAAA,MAErB,qBACT,MAyCM;AAAA,QAzCNE,EAyCM,OAAA;AAAA,UAxCJ,KAAI;AAAA,UACH,OAAKC,EAAA,CAAA;AAAA,uCAA2CH,EAAA,IAAI;AAAA,uCAA2CA,EAAA,KAAK;AAAA,kDAAsDA,EAAA,SAAQ;AAAA,aAK7J,wBAAwB,CAAA;AAAA;UAE9BH,EAAsGO,GAAA;AAAA,YAA1F,UAAUJ,EAAA;AAAA,YAAU,OAAM;AAAA,YAA2B,OAAM;AAAA,YAAe,MAAK;AAAA;UAC3EA,EAAA,YAAY,MAAM,QAAQA,EAAA,UAAU,KAClDL,EAAA,EAAA,GAAAC,EAaES,GAAA,EAAA,KAAA,EAAA,GAAAC,EAZ4BN,EAAA,YAAU,CAA9BO,GAAUC,YADpBC,EAaEC,GAAA;AAAA,YAXC,IAAIH,EAAS;AAAA,YACb,KAAKA,EAAS;AAAA,YACd,OAAKJ,EAAA,EAAA,wBAA4BK,MAAUR,EAAA,WAAW,SAAM,GAAA;AAAA,YAC5D,OAAOO,EAAS;AAAA,YAChB,UAAUP,EAAA;AAAA,YACV,OAAOO,EAAS;AAAA,YAChB,MAAMP,EAAA;AAAA,YACP,QAAO;AAAA,YACP,iBAAc;AAAA,YACd,MAAK;AAAA,YACJ,SAAK,CAAAC,MAAED,EAAA,eAAeO,CAAQ;AAAA;UAGnCV,EAcEc,GAdFZ,EAcE;AAAA,YAbA,KAAI;AAAA,YACH,cAAcC,EAAA;AAAA,YACd,OAAOA,EAAA;AAAA,YACP,UAAUA,EAAA;AAAA,YACV,YAAYA,EAAA;AAAA,YACZ,aAAaA,EAAA;AAAA,YACb,MAAMA,EAAA;AAAA,YACP,OAAM;AAAA,aACEA,EAAA,qBAAmB;AAAA,YAC1B,gCAAOA,EAAA,YAAW;AAAA,kDACnB,MAAA;AAAA,YAAA,GAAsC,CAAA,WAAA,MAAA,CAAA,GAAA,CAAA,OAAA,CAAA;AAAA,YACrC,uBAAmBA,EAAA;AAAA,YACnB,oCAAYA,EAAA,eAAc,EAAA;AAAA;;;MAItB,WACT,MA+BK;AAAA,QA/BLE,EA+BK,MA/BLV,GA+BK;AAAA,kBA9BHI,EA6BKS,GAAA,MAAAC,EA5BcN,EAAA,iBAAe,CAAzBY,YADThB,EA6BK,MAAA;AAAA,YA3BF,IAAIgB,EAAO;AAAA,YACX,KAAKA,EAAO;AAAA,YACZ,OAAKT,EAAA,CAAA;AAAA;gBAA6E,yCAAAS,EAAO;AAAA,oDAAqEA,EAAO,QAAQZ,EAAA;AAAA;sCAAuEA,EAAA,IAAI;AAAA,eAQnP,qBAAqB,CAAA;AAAA,YAD3B,iBAAc;AAAA,YAEd,MAAK;AAAA,YACL,UAAS;AAAA,YACR,aAAS,CAAAC,MAAED,EAAA,kBAAkBY,EAAO,GAAG;AAAA,YACX,gBAAAC,EAAA,CAAAZ,MAAAD,EAAA,YAAYY,CAAM,GAAA,CAAA,QAAA,SAAA,CAAA;AAAA,YAClB,gBAAAC,EAAA,CAAAZ,MAAAD,EAAA,YAAYY,CAAM,GAAA,CAAA,QAAA,SAAA,CAAA;AAAA,YAClB,gBAAAC,EAAA,CAAAZ,MAAAD,EAAA,YAAYY,CAAM,GAAA,CAAA,QAAA,SAAA,CAAA;AAAA;YAE/CV,EAQM,OARNT,GAQM;AAAA,cAJJqB,EAGOd,EAAA,QAAA,UAAA,EAHA,QAAQY,EAAM,GAArB,MAGO;AAAA,gBAFYA,EAAO,aAAxBH,EAAqFL,GAAA;AAAA;kBAAtD,MAAMQ,EAAO;AAAA,kBAAM,OAAM;AAAA;gBACxDV,EAAiE,QAAjER,GAAiEqB,EAAtBH,EAAO,KAAK,GAAA,CAAA;AAAA;;;;;;;;;;"}
1
+ {"version":3,"file":"NeonSearch.vue.es.js","sources":["../../../../src/components/user-input/search/NeonSearch.vue"],"sourcesContent":["<template>\n <div class=\"neon-search__wrapper\">\n <neon-dropdown\n ref=\"dropdown\"\n v-model=\"open\"\n :aria-activedescendant=\"activeDescendant\"\n :aria-multiselectable=\"multiple\"\n :class=\"[\n `neon-search--${color}`,\n {\n 'neon-search--multiple': multiple,\n 'neon-search--disabled': disabled,\n 'neon-search--empty': computedOptions.length === 0,\n },\n ]\"\n :color=\"color\"\n :disabled=\"disabled\"\n :placement=\"dropdownPlacement\"\n :size=\"size\"\n class=\"neon-search\"\n role=\"listbox\"\n v-bind=\"sanitizedAttributes\"\n @dropdown-placement=\"onPlacement\"\n >\n <template #dropdown-button>\n <div\n ref=\"dropdownButton\"\n :class=\"[\n `neon-search__container--${size}`,\n `neon-search__container--${color}`,\n { 'neon-search__container--disabled': disabled },\n ]\"\n class=\"neon-search__container\"\n >\n <neon-icon :disabled=\"disabled\" class=\"neon-search__search-icon\" color=\"low-contrast\" name=\"search\" />\n <template v-if=\"multiple && Array.isArray(modelValue)\">\n <neon-chip\n v-for=\"(selected, index) in modelValue\"\n :id=\"selected.key\"\n :key=\"selected.key\"\n :class=\"{ 'neon-chip--last-chip': index === modelValue.length - 1 }\"\n :color=\"selected.chipColor\"\n :disabled=\"disabled\"\n :label=\"selected.label\"\n :size=\"size\"\n action=\"remove\"\n aria-selected=\"true\"\n role=\"option\"\n @close=\"removeSelected(selected)\"\n />\n </template>\n <neon-input\n ref=\"searchInput\"\n :autocomplete=\"autocomplete\"\n :color=\"color\"\n :disabled=\"disabled\"\n :model-Value=\"filter\"\n :placeholder=\"placeholder\"\n :size=\"size\"\n class=\"neon-search__input\"\n v-bind=\"sanitizedAttributes\"\n @focus=\"showOptions()\"\n @keydown.enter.prevent.stop.capture=\"\"\n @update:modelValue=\"onFilterChange\"\n @icon-click=\"onFilterChange('')\"\n />\n </div>\n </template>\n <template #default>\n <ul class=\"no-style neon-search__options\">\n <li\n v-for=\"option in computedOptions\"\n :id=\"option.key\"\n :key=\"option.key\"\n :class=\"[\n {\n 'neon-search__option--separator-before': option.separatorBefore,\n 'neon-search__option--highlighted': option.key === highlightedKey,\n },\n `neon-search__option--${size}`,\n ]\"\n aria-selected=\"false\"\n class=\"neon-search__option\"\n role=\"option\"\n tabindex=\"0\"\n @mouseover=\"changeHighlighted(option.key)\"\n @click.stop.prevent.capture=\"clickOption(option)\"\n @space.stop.prevent.capture=\"clickOption(option)\"\n @enter.stop.prevent.capture=\"clickOption(option)\"\n >\n <div class=\"neon-search__option-container\">\n <!-- @slot provide a custom template for an option.<br />Bindings: <strong>option</strong>\n (<em>NeonSearchOption</em>). This slot is purely for formatting the option, all accessibility actions\n still apply. -->\n <slot :option=\"option\" name=\"option\">\n <neon-icon v-if=\"option.icon\" :name=\"option.icon\" class=\"neon-search__option-icon\" />\n <span class=\"neon-search__option-label\">{{ option.label }}</span>\n </slot>\n </div>\n </li>\n </ul>\n </template>\n </neon-dropdown>\n </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonSearch.ts\"></script>\n"],"names":["_hoisted_1","_hoisted_2","_hoisted_4","_hoisted_5","_openBlock","_createElementBlock","_createVNode","_component_neon_dropdown","_mergeProps","_ctx","$event","_createElementVNode","_normalizeClass","_component_neon_icon","_Fragment","_renderList","selected","index","_createBlock","_component_neon_chip","_component_neon_input","option","_withModifiers","_renderSlot","_toDisplayString"],"mappings":";;;AACO,MAAAA,IAAA,EAAA,OAAM,uBAAsB,GAoEvBC,IAAA,EAAA,OAAM,gCAA+B,oFAqBhCC,IAAA,EAAA,OAAM,gCAA+B,GAMhCC,IAAA,EAAA,OAAM,4BAA2B;;;AA/FrD,SAAAC,EAAA,GAAAC,EAsGM,OAtGNL,GAsGM;AAAA,IArGJM,EAoGgBC,GApGhBC,EAoGgB;AAAA,MAnGd,KAAI;AAAA,kBACKC,EAAA;AAAA,oDAAAA,EAAA,OAAIC;AAAA,MACZ,yBAAuBD,EAAA;AAAA,MACvB,wBAAsBA,EAAA;AAAA,MACtB,OAAK,CAAA;AAAA,wBAA4BA,EAAA,KAAK;AAAA;mCAAiDA,EAAA;AAAA,mCAA6CA,EAAA;AAAA,UAA0C,sBAAAA,EAAA,gBAAgB,WAAM;AAAA;SAY/L,aAAa;AAAA,MAJlB,OAAOA,EAAA;AAAA,MACP,UAAUA,EAAA;AAAA,MACV,WAAWA,EAAA;AAAA,MACX,MAAMA,EAAA;AAAA,MAEP,MAAK;AAAA,OACGA,EAAA,qBAAmB,EAC1B,qBAAoBA,EAAA,YAAW,CAAA,GAAA;AAAA,MAErB,qBACT,MAyCM;AAAA,QAzCNE,EAyCM,OAAA;AAAA,UAxCJ,KAAI;AAAA,UACH,OAAKC,EAAA,CAAA;AAAA,uCAA2CH,EAAA,IAAI;AAAA,uCAA2CA,EAAA,KAAK;AAAA,kDAAsDA,EAAA,SAAQ;AAAA,aAK7J,wBAAwB,CAAA;AAAA;UAE9BH,EAAsGO,GAAA;AAAA,YAA1F,UAAUJ,EAAA;AAAA,YAAU,OAAM;AAAA,YAA2B,OAAM;AAAA,YAAe,MAAK;AAAA;UAC3EA,EAAA,YAAY,MAAM,QAAQA,EAAA,UAAU,KAClDL,EAAA,EAAA,GAAAC,EAaES,GAAA,EAAA,KAAA,EAAA,GAAAC,EAZ4BN,EAAA,YAAU,CAA9BO,GAAUC,YADpBC,EAaEC,GAAA;AAAA,YAXC,IAAIH,EAAS;AAAA,YACb,KAAKA,EAAS;AAAA,YACd,OAAKJ,EAAA,EAAA,wBAA4BK,MAAUR,EAAA,WAAW,SAAM,GAAA;AAAA,YAC5D,OAAOO,EAAS;AAAA,YAChB,UAAUP,EAAA;AAAA,YACV,OAAOO,EAAS;AAAA,YAChB,MAAMP,EAAA;AAAA,YACP,QAAO;AAAA,YACP,iBAAc;AAAA,YACd,MAAK;AAAA,YACJ,SAAK,CAAAC,MAAED,EAAA,eAAeO,CAAQ;AAAA;UAGnCV,EAcEc,GAdFZ,EAcE;AAAA,YAbA,KAAI;AAAA,YACH,cAAcC,EAAA;AAAA,YACd,OAAOA,EAAA;AAAA,YACP,UAAUA,EAAA;AAAA,YACV,eAAaA,EAAA;AAAA,YACb,aAAaA,EAAA;AAAA,YACb,MAAMA,EAAA;AAAA,YACP,OAAM;AAAA,aACEA,EAAA,qBAAmB;AAAA,YAC1B,gCAAOA,EAAA,YAAW;AAAA,kDACnB,MAAA;AAAA,YAAA,GAAsC,CAAA,WAAA,MAAA,CAAA,GAAA,CAAA,OAAA,CAAA;AAAA,YACrC,uBAAmBA,EAAA;AAAA,YACnB,oCAAYA,EAAA,eAAc,EAAA;AAAA;;;MAItB,WACT,MA+BK;AAAA,QA/BLE,EA+BK,MA/BLV,GA+BK;AAAA,kBA9BHI,EA6BKS,GAAA,MAAAC,EA5BcN,EAAA,iBAAe,CAAzBY,YADThB,EA6BK,MAAA;AAAA,YA3BF,IAAIgB,EAAO;AAAA,YACX,KAAKA,EAAO;AAAA,YACZ,OAAKT,EAAA,CAAA;AAAA;gBAA6E,yCAAAS,EAAO;AAAA,oDAAqEA,EAAO,QAAQZ,EAAA;AAAA;sCAAuEA,EAAA,IAAI;AAAA,eAQnP,qBAAqB,CAAA;AAAA,YAD3B,iBAAc;AAAA,YAEd,MAAK;AAAA,YACL,UAAS;AAAA,YACR,aAAS,CAAAC,MAAED,EAAA,kBAAkBY,EAAO,GAAG;AAAA,YACX,gBAAAC,EAAA,CAAAZ,MAAAD,EAAA,YAAYY,CAAM,GAAA,CAAA,QAAA,SAAA,CAAA;AAAA,YAClB,gBAAAC,EAAA,CAAAZ,MAAAD,EAAA,YAAYY,CAAM,GAAA,CAAA,QAAA,SAAA,CAAA;AAAA,YAClB,gBAAAC,EAAA,CAAAZ,MAAAD,EAAA,YAAYY,CAAM,GAAA,CAAA,QAAA,SAAA,CAAA;AAAA;YAE/CV,EAQM,OARNT,GAQM;AAAA,cAJJqB,EAGOd,EAAA,QAAA,UAAA,EAHA,QAAQY,EAAM,GAArB,MAGO;AAAA,gBAFYA,EAAO,aAAxBH,EAAqFL,GAAA;AAAA;kBAAtD,MAAMQ,EAAO;AAAA,kBAAM,OAAM;AAAA;gBACxDV,EAAiE,QAAjER,GAAiEqB,EAAtBH,EAAO,KAAK,GAAA,CAAA;AAAA;;;;;;;;;;"}
@@ -1,2 +1,2 @@
1
- "use strict";const t=require("vue"),d=require("../../../common/enums/NeonSize.cjs.js"),c=require("../../../common/enums/NeonFunctionalColor.cjs.js"),p=require("../../../common/enums/NeonToggleStyle.cjs.js"),g=require("../../../common/enums/NeonOrientation.cjs.js"),m=require("../../presentation/icon/NeonIcon.vue.cjs.js"),y=t.defineComponent({name:"NeonToggle",components:{NeonIcon:m},props:{name:{type:String,required:!0},modelValue:{type:String,required:!0},model:{type:Array,required:!0},toggleStyle:{type:String,default:()=>p.NeonToggleStyle.Toggle},size:{type:String,default:()=>d.NeonSize.Medium},orientation:{type:String,default:()=>g.NeonOrientation.Vertical},color:{type:String,default:()=>c.NeonFunctionalColor.Primary},disabled:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(n,{emit:i,slots:r}){const l=t.useAttrs(),o=e=>{i("update:modelValue",e)},u=e=>{n.disabled||o(e)},s=t.computed(()=>{const{onClick:e,...a}=l;return a});return{selectOption:e=>{!n.disabled&&!e.disabled&&o(e.key)},onInput:u,sanitizedAttributes:s,slots:r}}});module.exports=y;
1
+ "use strict";const n=require("vue"),d=require("../../../common/enums/NeonSize.cjs.js"),c=require("../../../common/enums/NeonFunctionalColor.cjs.js"),g=require("../../../common/enums/NeonToggleStyle.cjs.js"),y=require("../../../common/enums/NeonOrientation.cjs.js"),m=require("../../presentation/icon/NeonIcon.vue.cjs.js"),p=n.defineComponent({name:"NeonToggle",components:{NeonIcon:m},props:{name:{type:String,required:!0},modelValue:{type:String,required:!0},model:{type:Array,required:!0},toggleStyle:{type:String,default:()=>g.NeonToggleStyle.Toggle},size:{type:String,default:()=>d.NeonSize.Medium},orientation:{type:String,default:()=>y.NeonOrientation.Vertical},color:{type:String,default:()=>c.NeonFunctionalColor.Primary},disabled:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(t,{emit:i,slots:r}){const l=n.useAttrs(),o=e=>{i("update:modelValue",e)},u=e=>{!t.disabled&&!e.disabled&&t.modelValue!==e.key&&o(e.key)},s=n.computed(()=>{const{onClick:e,...a}=l;return a});return{selectOption:e=>{!t.disabled&&!e.disabled&&o(e.key)},onInput:u,sanitizedAttributes:s,slots:r}}});module.exports=p;
2
2
  //# sourceMappingURL=NeonToggle.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"NeonToggle.cjs.js","sources":["../../../../src/components/user-input/toggle/NeonToggle.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent, useAttrs } from 'vue';\nimport type { NeonToggleModel } from '@/common/models/NeonToggleModel';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport { NeonToggleStyle } from '@/common/enums/NeonToggleStyle';\nimport { NeonOrientation } from '@/common/enums/NeonOrientation';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\n\n/**\n * <p>A toggle component for selecting one value from a range of options. This is equivalent to a radio button group. It can be styled as a <em>Toggle</em> or as <em>Radio buttons</em>.\n */\nexport default defineComponent({\n name: 'NeonToggle',\n components: {\n NeonIcon,\n },\n props: {\n /**\n * The name of the radio button group.\n */\n name: { type: String, required: true },\n /**\n * The key of the selected option.\n */\n modelValue: { type: String, required: true },\n /**\n * The list of options to present to the user.\n */\n model: { type: Array as () => Array<NeonToggleModel>, required: true },\n /**\n * The style of toggle to display to the user.\n */\n toggleStyle: { type: String as () => NeonToggleStyle, default: () => NeonToggleStyle.Toggle },\n /**\n * The size of the toggle.\n */\n size: { type: String as () => NeonSize, default: () => NeonSize.Medium },\n /**\n * The orientation of the toggle if the style is a radio button group.\n */\n orientation: { type: String as () => NeonOrientation, default: () => NeonOrientation.Vertical },\n /**\n * The color of the toggle.\n */\n color: { type: String as () => NeonFunctionalColor, default: () => NeonFunctionalColor.Primary },\n /**\n * Whether the toggle is disabled.\n */\n disabled: { type: Boolean, default: false },\n },\n emits: [\n /**\n * Emitted when the selected value changes.\n * @type {string} The key of the selected model item.\n */\n 'update:modelValue',\n ],\n setup(props, { emit, slots }) {\n const attrs = useAttrs();\n const emitInput = (key: string) => {\n emit('update:modelValue', key);\n };\n\n const onInput = (key: string) => {\n if (!props.disabled) {\n emitInput(key);\n }\n };\n\n const sanitizedAttributes = computed(() => {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const { onClick, ...sanitized } = attrs;\n return sanitized;\n });\n\n const selectOption = (option: NeonToggleModel) => {\n if (!props.disabled && !option.disabled) {\n emitInput(option.key);\n }\n };\n\n return {\n selectOption,\n onInput,\n sanitizedAttributes,\n slots,\n };\n },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonToggleStyle","NeonSize","NeonOrientation","NeonFunctionalColor","props","emit","slots","attrs","useAttrs","emitInput","key","onInput","sanitizedAttributes","computed","onClick","sanitized","option"],"mappings":"kUAWAA,EAAeC,kBAAgB,CAC7B,KAAM,aACN,WAAY,CACV,SAAAC,CAAA,EAEF,MAAO,CAIL,KAAM,CAAE,KAAM,OAAQ,SAAU,EAAA,EAIhC,WAAY,CAAE,KAAM,OAAQ,SAAU,EAAA,EAItC,MAAO,CAAE,KAAM,MAAuC,SAAU,EAAA,EAIhE,YAAa,CAAE,KAAM,OAAiC,QAAS,IAAMC,EAAAA,gBAAgB,MAAA,EAIrF,KAAM,CAAE,KAAM,OAA0B,QAAS,IAAMC,EAAAA,SAAS,MAAA,EAIhE,YAAa,CAAE,KAAM,OAAiC,QAAS,IAAMC,EAAAA,gBAAgB,QAAA,EAIrF,MAAO,CAAE,KAAM,OAAqC,QAAS,IAAMC,EAAAA,oBAAoB,OAAA,EAIvF,SAAU,CAAE,KAAM,QAAS,QAAS,EAAA,CAAM,EAE5C,MAAO,CAKL,mBAAA,EAEF,MAAMC,EAAO,CAAE,KAAAC,EAAM,MAAAC,GAAS,CAC5B,MAAMC,EAAQC,EAAAA,SAAA,EACRC,EAAaC,GAAgB,CACjCL,EAAK,oBAAqBK,CAAG,CAC/B,EAEMC,EAAWD,GAAgB,CAC1BN,EAAM,UACTK,EAAUC,CAAG,CAEjB,EAEME,EAAsBC,EAAAA,SAAS,IAAM,CAEzC,KAAM,CAAE,QAAAC,EAAS,GAAGC,CAAA,EAAcR,EAClC,OAAOQ,CACT,CAAC,EAQD,MAAO,CACL,aAPoBC,GAA4B,CAC5C,CAACZ,EAAM,UAAY,CAACY,EAAO,UAC7BP,EAAUO,EAAO,GAAG,CAExB,EAIE,QAAAL,EACA,oBAAAC,EACA,MAAAN,CAAA,CAEJ,CACF,CAAC"}
1
+ {"version":3,"file":"NeonToggle.cjs.js","sources":["../../../../src/components/user-input/toggle/NeonToggle.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent, useAttrs } from 'vue';\nimport type { NeonToggleModel } from '@/common/models/NeonToggleModel';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport { NeonToggleStyle } from '@/common/enums/NeonToggleStyle';\nimport { NeonOrientation } from '@/common/enums/NeonOrientation';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\n\n/**\n * <p>A toggle component for selecting one value from a range of options. This is equivalent to a radio button group. It can be styled as a <em>Toggle</em> or as <em>Radio buttons</em>.\n */\nexport default defineComponent({\n name: 'NeonToggle',\n components: {\n NeonIcon,\n },\n props: {\n /**\n * The name of the radio button group.\n */\n name: { type: String, required: true },\n /**\n * The key of the selected option.\n */\n modelValue: { type: String, required: true },\n /**\n * The list of options to present to the user.\n */\n model: { type: Array as () => Array<NeonToggleModel>, required: true },\n /**\n * The style of toggle to display to the user.\n */\n toggleStyle: { type: String as () => NeonToggleStyle, default: () => NeonToggleStyle.Toggle },\n /**\n * The size of the toggle.\n */\n size: { type: String as () => NeonSize, default: () => NeonSize.Medium },\n /**\n * The orientation of the toggle if the style is a radio button group.\n */\n orientation: { type: String as () => NeonOrientation, default: () => NeonOrientation.Vertical },\n /**\n * The color of the toggle.\n */\n color: { type: String as () => NeonFunctionalColor, default: () => NeonFunctionalColor.Primary },\n /**\n * Whether the toggle is disabled.\n */\n disabled: { type: Boolean, default: false },\n },\n emits: [\n /**\n * Emitted when the selected value changes.\n * @type {string} The key of the selected model item.\n */\n 'update:modelValue',\n ],\n setup(props, { emit, slots }) {\n const attrs = useAttrs();\n const emitInput = (key: string) => {\n emit('update:modelValue', key);\n };\n\n const onInput = (option: NeonToggleModel) => {\n if (!props.disabled && !option.disabled && props.modelValue !== option.key) {\n emitInput(option.key);\n }\n };\n\n const sanitizedAttributes = computed(() => {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const { onClick, ...sanitized } = attrs;\n return sanitized;\n });\n\n const selectOption = (option: NeonToggleModel) => {\n if (!props.disabled && !option.disabled) {\n emitInput(option.key);\n }\n };\n\n return {\n selectOption,\n onInput,\n sanitizedAttributes,\n slots,\n };\n },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonToggleStyle","NeonSize","NeonOrientation","NeonFunctionalColor","props","emit","slots","attrs","useAttrs","emitInput","key","onInput","option","sanitizedAttributes","computed","onClick","sanitized"],"mappings":"kUAWAA,EAAeC,kBAAgB,CAC7B,KAAM,aACN,WAAY,CACV,SAAAC,CAAA,EAEF,MAAO,CAIL,KAAM,CAAE,KAAM,OAAQ,SAAU,EAAA,EAIhC,WAAY,CAAE,KAAM,OAAQ,SAAU,EAAA,EAItC,MAAO,CAAE,KAAM,MAAuC,SAAU,EAAA,EAIhE,YAAa,CAAE,KAAM,OAAiC,QAAS,IAAMC,EAAAA,gBAAgB,MAAA,EAIrF,KAAM,CAAE,KAAM,OAA0B,QAAS,IAAMC,EAAAA,SAAS,MAAA,EAIhE,YAAa,CAAE,KAAM,OAAiC,QAAS,IAAMC,EAAAA,gBAAgB,QAAA,EAIrF,MAAO,CAAE,KAAM,OAAqC,QAAS,IAAMC,EAAAA,oBAAoB,OAAA,EAIvF,SAAU,CAAE,KAAM,QAAS,QAAS,EAAA,CAAM,EAE5C,MAAO,CAKL,mBAAA,EAEF,MAAMC,EAAO,CAAE,KAAAC,EAAM,MAAAC,GAAS,CAC5B,MAAMC,EAAQC,EAAAA,SAAA,EACRC,EAAaC,GAAgB,CACjCL,EAAK,oBAAqBK,CAAG,CAC/B,EAEMC,EAAWC,GAA4B,CACvC,CAACR,EAAM,UAAY,CAACQ,EAAO,UAAYR,EAAM,aAAeQ,EAAO,KACrEH,EAAUG,EAAO,GAAG,CAExB,EAEMC,EAAsBC,EAAAA,SAAS,IAAM,CAEzC,KAAM,CAAE,QAAAC,EAAS,GAAGC,CAAA,EAAcT,EAClC,OAAOS,CACT,CAAC,EAQD,MAAO,CACL,aAPoBJ,GAA4B,CAC5C,CAACR,EAAM,UAAY,CAACQ,EAAO,UAC7BH,EAAUG,EAAO,GAAG,CAExB,EAIE,QAAAD,EACA,oBAAAE,EACA,MAAAP,CAAA,CAEJ,CACF,CAAC"}
@@ -2,12 +2,12 @@ import { defineComponent as u, useAttrs as m, computed as s } from "vue";
2
2
  import { NeonSize as p } from "../../../common/enums/NeonSize.es.js";
3
3
  import { NeonFunctionalColor as c } from "../../../common/enums/NeonFunctionalColor.es.js";
4
4
  import { NeonToggleStyle as f } from "../../../common/enums/NeonToggleStyle.es.js";
5
- import { NeonOrientation as g } from "../../../common/enums/NeonOrientation.es.js";
6
- import y from "../../presentation/icon/NeonIcon.vue.es.js";
7
- const C = u({
5
+ import { NeonOrientation as y } from "../../../common/enums/NeonOrientation.es.js";
6
+ import g from "../../presentation/icon/NeonIcon.vue.es.js";
7
+ const A = u({
8
8
  name: "NeonToggle",
9
9
  components: {
10
- NeonIcon: y
10
+ NeonIcon: g
11
11
  },
12
12
  props: {
13
13
  /**
@@ -33,7 +33,7 @@ const C = u({
33
33
  /**
34
34
  * The orientation of the toggle if the style is a radio button group.
35
35
  */
36
- orientation: { type: String, default: () => g.Vertical },
36
+ orientation: { type: String, default: () => y.Vertical },
37
37
  /**
38
38
  * The color of the toggle.
39
39
  */
@@ -50,11 +50,11 @@ const C = u({
50
50
  */
51
51
  "update:modelValue"
52
52
  ],
53
- setup(t, { emit: n, slots: r }) {
53
+ setup(t, { emit: r, slots: n }) {
54
54
  const i = m(), o = (e) => {
55
- n("update:modelValue", e);
55
+ r("update:modelValue", e);
56
56
  }, l = (e) => {
57
- t.disabled || o(e);
57
+ !t.disabled && !e.disabled && t.modelValue !== e.key && o(e.key);
58
58
  }, a = s(() => {
59
59
  const { onClick: e, ...d } = i;
60
60
  return d;
@@ -65,11 +65,11 @@ const C = u({
65
65
  },
66
66
  onInput: l,
67
67
  sanitizedAttributes: a,
68
- slots: r
68
+ slots: n
69
69
  };
70
70
  }
71
71
  });
72
72
  export {
73
- C as default
73
+ A as default
74
74
  };
75
75
  //# sourceMappingURL=NeonToggle.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"NeonToggle.es.js","sources":["../../../../src/components/user-input/toggle/NeonToggle.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent, useAttrs } from 'vue';\nimport type { NeonToggleModel } from '@/common/models/NeonToggleModel';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport { NeonToggleStyle } from '@/common/enums/NeonToggleStyle';\nimport { NeonOrientation } from '@/common/enums/NeonOrientation';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\n\n/**\n * <p>A toggle component for selecting one value from a range of options. This is equivalent to a radio button group. It can be styled as a <em>Toggle</em> or as <em>Radio buttons</em>.\n */\nexport default defineComponent({\n name: 'NeonToggle',\n components: {\n NeonIcon,\n },\n props: {\n /**\n * The name of the radio button group.\n */\n name: { type: String, required: true },\n /**\n * The key of the selected option.\n */\n modelValue: { type: String, required: true },\n /**\n * The list of options to present to the user.\n */\n model: { type: Array as () => Array<NeonToggleModel>, required: true },\n /**\n * The style of toggle to display to the user.\n */\n toggleStyle: { type: String as () => NeonToggleStyle, default: () => NeonToggleStyle.Toggle },\n /**\n * The size of the toggle.\n */\n size: { type: String as () => NeonSize, default: () => NeonSize.Medium },\n /**\n * The orientation of the toggle if the style is a radio button group.\n */\n orientation: { type: String as () => NeonOrientation, default: () => NeonOrientation.Vertical },\n /**\n * The color of the toggle.\n */\n color: { type: String as () => NeonFunctionalColor, default: () => NeonFunctionalColor.Primary },\n /**\n * Whether the toggle is disabled.\n */\n disabled: { type: Boolean, default: false },\n },\n emits: [\n /**\n * Emitted when the selected value changes.\n * @type {string} The key of the selected model item.\n */\n 'update:modelValue',\n ],\n setup(props, { emit, slots }) {\n const attrs = useAttrs();\n const emitInput = (key: string) => {\n emit('update:modelValue', key);\n };\n\n const onInput = (key: string) => {\n if (!props.disabled) {\n emitInput(key);\n }\n };\n\n const sanitizedAttributes = computed(() => {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const { onClick, ...sanitized } = attrs;\n return sanitized;\n });\n\n const selectOption = (option: NeonToggleModel) => {\n if (!props.disabled && !option.disabled) {\n emitInput(option.key);\n }\n };\n\n return {\n selectOption,\n onInput,\n sanitizedAttributes,\n slots,\n };\n },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonToggleStyle","NeonSize","NeonOrientation","NeonFunctionalColor","props","emit","slots","attrs","useAttrs","emitInput","key","onInput","sanitizedAttributes","computed","onClick","sanitized","option"],"mappings":";;;;;;AAWA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV,UAAAC;AAAA,EAAA;AAAA,EAEF,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,MAAM,EAAE,MAAM,QAAQ,UAAU,GAAA;AAAA;AAAA;AAAA;AAAA,IAIhC,YAAY,EAAE,MAAM,QAAQ,UAAU,GAAA;AAAA;AAAA;AAAA;AAAA,IAItC,OAAO,EAAE,MAAM,OAAuC,UAAU,GAAA;AAAA;AAAA;AAAA;AAAA,IAIhE,aAAa,EAAE,MAAM,QAAiC,SAAS,MAAMC,EAAgB,OAAA;AAAA;AAAA;AAAA;AAAA,IAIrF,MAAM,EAAE,MAAM,QAA0B,SAAS,MAAMC,EAAS,OAAA;AAAA;AAAA;AAAA;AAAA,IAIhE,aAAa,EAAE,MAAM,QAAiC,SAAS,MAAMC,EAAgB,SAAA;AAAA;AAAA;AAAA;AAAA,IAIrF,OAAO,EAAE,MAAM,QAAqC,SAAS,MAAMC,EAAoB,QAAA;AAAA;AAAA;AAAA;AAAA,IAIvF,UAAU,EAAE,MAAM,SAAS,SAAS,GAAA;AAAA,EAAM;AAAA,EAE5C,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL;AAAA,EAAA;AAAA,EAEF,MAAMC,GAAO,EAAE,MAAAC,GAAM,OAAAC,KAAS;AAC5B,UAAMC,IAAQC,EAAA,GACRC,IAAY,CAACC,MAAgB;AACjC,MAAAL,EAAK,qBAAqBK,CAAG;AAAA,IAC/B,GAEMC,IAAU,CAACD,MAAgB;AAC/B,MAAKN,EAAM,YACTK,EAAUC,CAAG;AAAA,IAEjB,GAEME,IAAsBC,EAAS,MAAM;AAEzC,YAAM,EAAE,SAAAC,GAAS,GAAGC,EAAA,IAAcR;AAClC,aAAOQ;AAAA,IACT,CAAC;AAQD,WAAO;AAAA,MACL,cAPmB,CAACC,MAA4B;AAChD,QAAI,CAACZ,EAAM,YAAY,CAACY,EAAO,YAC7BP,EAAUO,EAAO,GAAG;AAAA,MAExB;AAAA,MAIE,SAAAL;AAAA,MACA,qBAAAC;AAAA,MACA,OAAAN;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;"}
1
+ {"version":3,"file":"NeonToggle.es.js","sources":["../../../../src/components/user-input/toggle/NeonToggle.ts?vue&type=script&src=true&lang.ts"],"sourcesContent":["import { computed, defineComponent, useAttrs } from 'vue';\nimport type { NeonToggleModel } from '@/common/models/NeonToggleModel';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport { NeonToggleStyle } from '@/common/enums/NeonToggleStyle';\nimport { NeonOrientation } from '@/common/enums/NeonOrientation';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\n\n/**\n * <p>A toggle component for selecting one value from a range of options. This is equivalent to a radio button group. It can be styled as a <em>Toggle</em> or as <em>Radio buttons</em>.\n */\nexport default defineComponent({\n name: 'NeonToggle',\n components: {\n NeonIcon,\n },\n props: {\n /**\n * The name of the radio button group.\n */\n name: { type: String, required: true },\n /**\n * The key of the selected option.\n */\n modelValue: { type: String, required: true },\n /**\n * The list of options to present to the user.\n */\n model: { type: Array as () => Array<NeonToggleModel>, required: true },\n /**\n * The style of toggle to display to the user.\n */\n toggleStyle: { type: String as () => NeonToggleStyle, default: () => NeonToggleStyle.Toggle },\n /**\n * The size of the toggle.\n */\n size: { type: String as () => NeonSize, default: () => NeonSize.Medium },\n /**\n * The orientation of the toggle if the style is a radio button group.\n */\n orientation: { type: String as () => NeonOrientation, default: () => NeonOrientation.Vertical },\n /**\n * The color of the toggle.\n */\n color: { type: String as () => NeonFunctionalColor, default: () => NeonFunctionalColor.Primary },\n /**\n * Whether the toggle is disabled.\n */\n disabled: { type: Boolean, default: false },\n },\n emits: [\n /**\n * Emitted when the selected value changes.\n * @type {string} The key of the selected model item.\n */\n 'update:modelValue',\n ],\n setup(props, { emit, slots }) {\n const attrs = useAttrs();\n const emitInput = (key: string) => {\n emit('update:modelValue', key);\n };\n\n const onInput = (option: NeonToggleModel) => {\n if (!props.disabled && !option.disabled && props.modelValue !== option.key) {\n emitInput(option.key);\n }\n };\n\n const sanitizedAttributes = computed(() => {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const { onClick, ...sanitized } = attrs;\n return sanitized;\n });\n\n const selectOption = (option: NeonToggleModel) => {\n if (!props.disabled && !option.disabled) {\n emitInput(option.key);\n }\n };\n\n return {\n selectOption,\n onInput,\n sanitizedAttributes,\n slots,\n };\n },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonToggleStyle","NeonSize","NeonOrientation","NeonFunctionalColor","props","emit","slots","attrs","useAttrs","emitInput","key","onInput","option","sanitizedAttributes","computed","onClick","sanitized"],"mappings":";;;;;;AAWA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV,UAAAC;AAAA,EAAA;AAAA,EAEF,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,MAAM,EAAE,MAAM,QAAQ,UAAU,GAAA;AAAA;AAAA;AAAA;AAAA,IAIhC,YAAY,EAAE,MAAM,QAAQ,UAAU,GAAA;AAAA;AAAA;AAAA;AAAA,IAItC,OAAO,EAAE,MAAM,OAAuC,UAAU,GAAA;AAAA;AAAA;AAAA;AAAA,IAIhE,aAAa,EAAE,MAAM,QAAiC,SAAS,MAAMC,EAAgB,OAAA;AAAA;AAAA;AAAA;AAAA,IAIrF,MAAM,EAAE,MAAM,QAA0B,SAAS,MAAMC,EAAS,OAAA;AAAA;AAAA;AAAA;AAAA,IAIhE,aAAa,EAAE,MAAM,QAAiC,SAAS,MAAMC,EAAgB,SAAA;AAAA;AAAA;AAAA;AAAA,IAIrF,OAAO,EAAE,MAAM,QAAqC,SAAS,MAAMC,EAAoB,QAAA;AAAA;AAAA;AAAA;AAAA,IAIvF,UAAU,EAAE,MAAM,SAAS,SAAS,GAAA;AAAA,EAAM;AAAA,EAE5C,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL;AAAA,EAAA;AAAA,EAEF,MAAMC,GAAO,EAAE,MAAAC,GAAM,OAAAC,KAAS;AAC5B,UAAMC,IAAQC,EAAA,GACRC,IAAY,CAACC,MAAgB;AACjC,MAAAL,EAAK,qBAAqBK,CAAG;AAAA,IAC/B,GAEMC,IAAU,CAACC,MAA4B;AAC3C,MAAI,CAACR,EAAM,YAAY,CAACQ,EAAO,YAAYR,EAAM,eAAeQ,EAAO,OACrEH,EAAUG,EAAO,GAAG;AAAA,IAExB,GAEMC,IAAsBC,EAAS,MAAM;AAEzC,YAAM,EAAE,SAAAC,GAAS,GAAGC,EAAA,IAAcT;AAClC,aAAOS;AAAA,IACT,CAAC;AAQD,WAAO;AAAA,MACL,cAPmB,CAACJ,MAA4B;AAChD,QAAI,CAACR,EAAM,YAAY,CAACQ,EAAO,YAC7BH,EAAUG,EAAO,GAAG;AAAA,MAExB;AAAA,MAIE,SAAAD;AAAA,MACA,qBAAAE;AAAA,MACA,OAAAP;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;"}
@@ -1,2 +1,2 @@
1
- "use strict";const d=require("./NeonToggle.cjs.js"),e=require("vue"),s=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),r=["aria-checked","aria-disabled","tabindex","onKeydown"],i=["checked","disabled","name","value","onClick"],c={key:0,class:"neon-toggle__radio-button"},g={key:0,class:"neon-toggle__radio-button-indicator"},b={key:1};function u(l,m,y,_,h,p){const a=e.resolveComponent("neon-icon");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([[`neon-toggle--${l.toggleStyle}`,`neon-toggle--${l.disabled?"low-contrast":l.color}`,`neon-toggle--${l.orientation}`,`neon-toggle--${l.size}`,{"neon-toggle--disabled":l.disabled}],"neon-toggle"]),role:"radiogroup"},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.model,(n,t)=>(e.openBlock(),e.createElementBlock("label",{key:n.key,"aria-checked":n.key===l.modelValue,"aria-disabled":l.disabled||n.disabled,class:e.normalizeClass([{"neon-toggle__label--disabled":l.disabled||n.disabled,"neon-toggle__label--checked":n.key===l.modelValue,"neon-toggle__label--with-icon":n.icon,"neon-toggle__label--with-slot-override":l.slots.option,"neon-toggle__label--with-text":n.label},"neon-toggle__label no-style"]),tabindex:!l.disabled&&!n.disabled?0:void 0,role:"radio",onKeydown:[e.withKeys(o=>l.selectOption(n),["enter"]),e.withKeys(e.withModifiers(o=>l.selectOption(n),["prevent"]),["space"])]},[e.createElementVNode("input",e.mergeProps({checked:n.key===l.modelValue,disabled:l.disabled||n.disabled,name:l.name,tabindex:-1,value:n.key,class:"neon-toggle__input",type:"radio"},{ref_for:!0},l.sanitizedAttributes,{onClick:o=>l.onInput(n.key)}),null,16,i),l.toggleStyle==="radio-buttons"?(e.openBlock(),e.createElementBlock("div",c,[n.key===l.modelValue?(e.openBlock(),e.createElementBlock("div",g)):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0),e.renderSlot(l.$slots,"option",{index:t,option:n},()=>[n.icon?(e.openBlock(),e.createBlock(a,{key:0,disabled:l.disabled||n.disabled,name:n.icon},null,8,["disabled","name"])):e.createCommentVNode("",!0),n.label?(e.openBlock(),e.createElementBlock("span",b,e.toDisplayString(n.label),1)):e.createCommentVNode("",!0)])],42,r))),128))],2)}const k=s(d,[["render",u]]);module.exports=k;
1
+ "use strict";const d=require("./NeonToggle.cjs.js"),e=require("vue"),s=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),r=["aria-checked","aria-disabled","tabindex","onKeydown"],i=["checked","disabled","name","value","onClick"],c={key:0,class:"neon-toggle__radio-button"},g={key:0,class:"neon-toggle__radio-button-indicator"},b={key:1};function u(l,m,y,_,h,p){const a=e.resolveComponent("neon-icon");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([[`neon-toggle--${l.toggleStyle}`,`neon-toggle--${l.disabled?"low-contrast":l.color}`,`neon-toggle--${l.orientation}`,`neon-toggle--${l.size}`,{"neon-toggle--disabled":l.disabled}],"neon-toggle"]),role:"radiogroup"},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.model,(n,t)=>(e.openBlock(),e.createElementBlock("label",{key:n.key,"aria-checked":n.key===l.modelValue,"aria-disabled":l.disabled||n.disabled,class:e.normalizeClass([{"neon-toggle__label--disabled":l.disabled||n.disabled,"neon-toggle__label--checked":n.key===l.modelValue,"neon-toggle__label--with-icon":n.icon,"neon-toggle__label--with-slot-override":l.slots.option,"neon-toggle__label--with-text":n.label},"neon-toggle__label no-style"]),tabindex:!l.disabled&&!n.disabled?0:void 0,role:"radio",onKeydown:[e.withKeys(o=>l.selectOption(n),["enter"]),e.withKeys(e.withModifiers(o=>l.selectOption(n),["prevent"]),["space"])]},[e.createElementVNode("input",e.mergeProps({checked:n.key===l.modelValue,disabled:l.disabled||n.disabled,name:l.name,tabindex:-1,value:n.key,class:"neon-toggle__input",type:"radio"},{ref_for:!0},l.sanitizedAttributes,{onClick:o=>l.onInput(n)}),null,16,i),l.toggleStyle==="radio-buttons"?(e.openBlock(),e.createElementBlock("div",c,[n.key===l.modelValue?(e.openBlock(),e.createElementBlock("div",g)):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0),e.renderSlot(l.$slots,"option",{index:t,option:n},()=>[n.icon?(e.openBlock(),e.createBlock(a,{key:0,disabled:l.disabled||n.disabled,name:n.icon},null,8,["disabled","name"])):e.createCommentVNode("",!0),n.label?(e.openBlock(),e.createElementBlock("span",b,e.toDisplayString(n.label),1)):e.createCommentVNode("",!0)])],42,r))),128))],2)}const k=s(d,[["render",u]]);module.exports=k;
2
2
  //# sourceMappingURL=NeonToggle.vue.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"NeonToggle.vue.cjs.js","sources":["../../../../src/components/user-input/toggle/NeonToggle.vue"],"sourcesContent":["<template>\n <div\n :class=\"[\n `neon-toggle--${toggleStyle}`,\n `neon-toggle--${disabled ? 'low-contrast' : color}`,\n `neon-toggle--${orientation}`,\n `neon-toggle--${size}`,\n { 'neon-toggle--disabled': disabled },\n ]\"\n class=\"neon-toggle\"\n role=\"radiogroup\"\n >\n <label\n v-for=\"(option, index) in model\"\n :key=\"option.key\"\n :aria-checked=\"option.key === modelValue\"\n :aria-disabled=\"disabled || option.disabled\"\n :class=\"{\n 'neon-toggle__label--disabled': disabled || option.disabled,\n 'neon-toggle__label--checked': option.key === modelValue,\n 'neon-toggle__label--with-icon': option.icon,\n 'neon-toggle__label--with-slot-override': slots.option,\n 'neon-toggle__label--with-text': option.label,\n }\"\n :tabindex=\"!disabled && !option.disabled ? 0 : undefined\"\n class=\"neon-toggle__label no-style\"\n role=\"radio\"\n @keydown.enter=\"selectOption(option)\"\n @keydown.space.prevent=\"selectOption(option)\"\n >\n <input\n :checked=\"option.key === modelValue\"\n :disabled=\"disabled || option.disabled\"\n :name=\"name\"\n :tabindex=\"-1\"\n :value=\"option.key\"\n class=\"neon-toggle__input\"\n type=\"radio\"\n v-bind=\"sanitizedAttributes\"\n @click=\"onInput(option.key)\"\n />\n <div v-if=\"toggleStyle === 'radio-buttons'\" class=\"neon-toggle__radio-button\">\n <div v-if=\"option.key === modelValue\" class=\"neon-toggle__radio-button-indicator\"></div>\n </div>\n <!-- @slot This slot is for overriding the option rendering, it is passed two arguments, <em>option</em> - the option model & <em>index</em> -->\n <slot :index=\"index\" :option=\"option\" name=\"option\">\n <neon-icon v-if=\"option.icon\" :disabled=\"disabled || option.disabled\" :name=\"option.icon\" />\n <span v-if=\"option.label\">{{ option.label }}</span>\n </slot>\n </label>\n </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonToggle.ts\" />\n"],"names":["_createElementBlock","_normalizeClass","_ctx","_openBlock","_Fragment","_renderList","option","index","_withKeys","$event","_withModifiers","_createElementVNode","_mergeProps","_hoisted_3","_hoisted_4","_renderSlot","_createBlock","_component_neon_icon","_hoisted_5","_toDisplayString"],"mappings":"0PAyCkD,MAAM,sCACV,MAAM,sIAzClDA,EAAAA,mBAiDM,MAAA,CAhDH,MAAKC,EAAAA,eAAA,CAAA,iBAA0BC,EAAA,WAAW,GAA0B,gBAAAA,EAAA,wBAA4BA,EAAA,KAAK,mBAA0BA,EAAA,WAAW,mBAA0BA,EAAA,IAAI,4BAAqCA,EAAA,QAAQ,GAOhN,aAAa,CAAA,EACnB,KAAK,gBAELC,EAAAA,UAAA,EAAA,EAAAH,EAAAA,mBAqCQI,WAAA,KAAAC,EAAAA,WApCoBH,EAAA,MAAK,CAAvBI,EAAQC,mBADlBP,EAAAA,mBAqCQ,QAAA,CAnCL,IAAKM,EAAO,IACZ,eAAcA,EAAO,MAAQJ,EAAA,WAC7B,gBAAeA,EAAA,UAAYI,EAAO,SAClC,MAAKL,EAAAA,eAAA,CAAA,gCAA4CC,EAAA,UAAYI,EAAO,uCAAiDA,EAAO,MAAQJ,EAAA,WAAqD,gCAAAI,EAAO,KAAwD,yCAAAJ,EAAA,MAAM,OAAiD,gCAAAI,EAAO,OAQjT,6BAA6B,CAAA,EADlC,UAAWJ,EAAA,UAAQ,CAAKI,EAAO,WAAe,OAE/C,KAAK,QACJ,UAAO,CAAQE,EAAAA,SAAAC,GAAAP,EAAA,aAAaI,CAAM,EAAA,CAAA,OAAA,CAAA,EACXE,EAAAA,SAAAE,EAAAA,cAAAD,GAAAP,EAAA,aAAaI,CAAM,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,OAAA,CAAA,KAE3CK,EAAAA,mBAUE,QAVFC,aAUE,CATC,QAASN,EAAO,MAAQJ,EAAA,WACxB,SAAUA,EAAA,UAAYI,EAAO,SAC7B,KAAMJ,EAAA,KACN,SAAU,GACV,MAAOI,EAAO,IACf,MAAM,qBACN,KAAK,sBACGJ,EAAA,oBAAmB,CAC1B,QAAKO,GAAEP,EAAA,QAAQI,EAAO,GAAG,eAEjBJ,EAAA,cAAW,iBAAtBC,EAAAA,YAAAH,EAAAA,mBAEM,MAFNa,EAEM,CADOP,EAAO,MAAQJ,EAAA,YAA1BC,EAAAA,YAAAH,EAAAA,mBAAwF,MAAxFc,CAAwF,8DAG1FC,aAGOb,EAAA,OAAA,SAAA,CAHA,MAAOK,EAAQ,OAAQD,GAA9B,IAGO,CAFYA,EAAO,oBAAxBU,EAAAA,YAA4FC,EAAA,OAA7D,SAAUf,EAAA,UAAYI,EAAO,SAAW,KAAMA,EAAO,+DACxEA,EAAO,qBAAnBN,EAAAA,mBAAmD,OAAAkB,EAAAC,EAAAA,gBAAtBb,EAAO,KAAK,EAAA,CAAA"}
1
+ {"version":3,"file":"NeonToggle.vue.cjs.js","sources":["../../../../src/components/user-input/toggle/NeonToggle.vue"],"sourcesContent":["<template>\n <div\n :class=\"[\n `neon-toggle--${toggleStyle}`,\n `neon-toggle--${disabled ? 'low-contrast' : color}`,\n `neon-toggle--${orientation}`,\n `neon-toggle--${size}`,\n { 'neon-toggle--disabled': disabled },\n ]\"\n class=\"neon-toggle\"\n role=\"radiogroup\"\n >\n <label\n v-for=\"(option, index) in model\"\n :key=\"option.key\"\n :aria-checked=\"option.key === modelValue\"\n :aria-disabled=\"disabled || option.disabled\"\n :class=\"{\n 'neon-toggle__label--disabled': disabled || option.disabled,\n 'neon-toggle__label--checked': option.key === modelValue,\n 'neon-toggle__label--with-icon': option.icon,\n 'neon-toggle__label--with-slot-override': slots.option,\n 'neon-toggle__label--with-text': option.label,\n }\"\n :tabindex=\"!disabled && !option.disabled ? 0 : undefined\"\n class=\"neon-toggle__label no-style\"\n role=\"radio\"\n @keydown.enter=\"selectOption(option)\"\n @keydown.space.prevent=\"selectOption(option)\"\n >\n <input\n :checked=\"option.key === modelValue\"\n :disabled=\"disabled || option.disabled\"\n :name=\"name\"\n :tabindex=\"-1\"\n :value=\"option.key\"\n class=\"neon-toggle__input\"\n type=\"radio\"\n v-bind=\"sanitizedAttributes\"\n @click=\"onInput(option)\"\n />\n <div v-if=\"toggleStyle === 'radio-buttons'\" class=\"neon-toggle__radio-button\">\n <div v-if=\"option.key === modelValue\" class=\"neon-toggle__radio-button-indicator\"></div>\n </div>\n <!-- @slot This slot is for overriding the option rendering, it is passed two arguments, <em>option</em> - the option model & <em>index</em> -->\n <slot :index=\"index\" :option=\"option\" name=\"option\">\n <neon-icon v-if=\"option.icon\" :disabled=\"disabled || option.disabled\" :name=\"option.icon\" />\n <span v-if=\"option.label\">{{ option.label }}</span>\n </slot>\n </label>\n </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonToggle.ts\" />\n"],"names":["_createElementBlock","_normalizeClass","_ctx","_openBlock","_Fragment","_renderList","option","index","_withKeys","$event","_withModifiers","_createElementVNode","_mergeProps","_hoisted_3","_hoisted_4","_renderSlot","_createBlock","_component_neon_icon","_hoisted_5","_toDisplayString"],"mappings":"0PAyCkD,MAAM,sCACV,MAAM,sIAzClDA,EAAAA,mBAiDM,MAAA,CAhDH,MAAKC,EAAAA,eAAA,CAAA,iBAA0BC,EAAA,WAAW,GAA0B,gBAAAA,EAAA,wBAA4BA,EAAA,KAAK,mBAA0BA,EAAA,WAAW,mBAA0BA,EAAA,IAAI,4BAAqCA,EAAA,QAAQ,GAOhN,aAAa,CAAA,EACnB,KAAK,gBAELC,EAAAA,UAAA,EAAA,EAAAH,EAAAA,mBAqCQI,WAAA,KAAAC,EAAAA,WApCoBH,EAAA,MAAK,CAAvBI,EAAQC,mBADlBP,EAAAA,mBAqCQ,QAAA,CAnCL,IAAKM,EAAO,IACZ,eAAcA,EAAO,MAAQJ,EAAA,WAC7B,gBAAeA,EAAA,UAAYI,EAAO,SAClC,MAAKL,EAAAA,eAAA,CAAA,gCAA4CC,EAAA,UAAYI,EAAO,uCAAiDA,EAAO,MAAQJ,EAAA,WAAqD,gCAAAI,EAAO,KAAwD,yCAAAJ,EAAA,MAAM,OAAiD,gCAAAI,EAAO,OAQjT,6BAA6B,CAAA,EADlC,UAAWJ,EAAA,UAAQ,CAAKI,EAAO,WAAe,OAE/C,KAAK,QACJ,UAAO,CAAQE,EAAAA,SAAAC,GAAAP,EAAA,aAAaI,CAAM,EAAA,CAAA,OAAA,CAAA,EACXE,EAAAA,SAAAE,EAAAA,cAAAD,GAAAP,EAAA,aAAaI,CAAM,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,OAAA,CAAA,KAE3CK,EAAAA,mBAUE,QAVFC,aAUE,CATC,QAASN,EAAO,MAAQJ,EAAA,WACxB,SAAUA,EAAA,UAAYI,EAAO,SAC7B,KAAMJ,EAAA,KACN,SAAU,GACV,MAAOI,EAAO,IACf,MAAM,qBACN,KAAK,sBACGJ,EAAA,oBAAmB,CAC1B,QAAKO,GAAEP,EAAA,QAAQI,CAAM,eAEbJ,EAAA,cAAW,iBAAtBC,EAAAA,YAAAH,EAAAA,mBAEM,MAFNa,EAEM,CADOP,EAAO,MAAQJ,EAAA,YAA1BC,EAAAA,YAAAH,EAAAA,mBAAwF,MAAxFc,CAAwF,8DAG1FC,aAGOb,EAAA,OAAA,SAAA,CAHA,MAAOK,EAAQ,OAAQD,GAA9B,IAGO,CAFYA,EAAO,oBAAxBU,EAAAA,YAA4FC,EAAA,OAA7D,SAAUf,EAAA,UAAYI,EAAO,SAAW,KAAMA,EAAO,+DACxEA,EAAO,qBAAnBN,EAAAA,mBAAmD,OAAAkB,EAAAC,EAAAA,gBAAtBb,EAAO,KAAK,EAAA,CAAA"}
@@ -47,7 +47,7 @@ function S(e, z, B, K, N, E) {
47
47
  class: "neon-toggle__input",
48
48
  type: "radio"
49
49
  }, { ref_for: !0 }, e.sanitizedAttributes, {
50
- onClick: (a) => e.onInput(l.key)
50
+ onClick: (a) => e.onInput(l)
51
51
  }), null, 16, w),
52
52
  e.toggleStyle === "radio-buttons" ? (n(), o("div", p, [
53
53
  l.key === e.modelValue ? (n(), o("div", V)) : d("", !0)
@@ -1 +1 @@
1
- {"version":3,"file":"NeonToggle.vue.es.js","sources":["../../../../src/components/user-input/toggle/NeonToggle.vue"],"sourcesContent":["<template>\n <div\n :class=\"[\n `neon-toggle--${toggleStyle}`,\n `neon-toggle--${disabled ? 'low-contrast' : color}`,\n `neon-toggle--${orientation}`,\n `neon-toggle--${size}`,\n { 'neon-toggle--disabled': disabled },\n ]\"\n class=\"neon-toggle\"\n role=\"radiogroup\"\n >\n <label\n v-for=\"(option, index) in model\"\n :key=\"option.key\"\n :aria-checked=\"option.key === modelValue\"\n :aria-disabled=\"disabled || option.disabled\"\n :class=\"{\n 'neon-toggle__label--disabled': disabled || option.disabled,\n 'neon-toggle__label--checked': option.key === modelValue,\n 'neon-toggle__label--with-icon': option.icon,\n 'neon-toggle__label--with-slot-override': slots.option,\n 'neon-toggle__label--with-text': option.label,\n }\"\n :tabindex=\"!disabled && !option.disabled ? 0 : undefined\"\n class=\"neon-toggle__label no-style\"\n role=\"radio\"\n @keydown.enter=\"selectOption(option)\"\n @keydown.space.prevent=\"selectOption(option)\"\n >\n <input\n :checked=\"option.key === modelValue\"\n :disabled=\"disabled || option.disabled\"\n :name=\"name\"\n :tabindex=\"-1\"\n :value=\"option.key\"\n class=\"neon-toggle__input\"\n type=\"radio\"\n v-bind=\"sanitizedAttributes\"\n @click=\"onInput(option.key)\"\n />\n <div v-if=\"toggleStyle === 'radio-buttons'\" class=\"neon-toggle__radio-button\">\n <div v-if=\"option.key === modelValue\" class=\"neon-toggle__radio-button-indicator\"></div>\n </div>\n <!-- @slot This slot is for overriding the option rendering, it is passed two arguments, <em>option</em> - the option model & <em>index</em> -->\n <slot :index=\"index\" :option=\"option\" name=\"option\">\n <neon-icon v-if=\"option.icon\" :disabled=\"disabled || option.disabled\" :name=\"option.icon\" />\n <span v-if=\"option.label\">{{ option.label }}</span>\n </slot>\n </label>\n </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonToggle.ts\" />\n"],"names":["_createElementBlock","_normalizeClass","_ctx","_openBlock","_Fragment","_renderList","option","index","_withKeys","$event","_withModifiers","_createElementVNode","_mergeProps","_hoisted_3","_hoisted_4","_renderSlot","_createBlock","_component_neon_icon","_hoisted_5","_toDisplayString"],"mappings":";;;;;EAyCkD,OAAM;;;EACV,OAAM;;;;cAzClDA,EAiDM,OAAA;AAAA,IAhDH,OAAKC,EAAA,CAAA;AAAA,sBAA0BC,EAAA,WAAW;AAAA,MAA0B,gBAAAA,EAAA,4BAA4BA,EAAA,KAAK;AAAA,sBAA0BA,EAAA,WAAW;AAAA,sBAA0BA,EAAA,IAAI;AAAA,iCAAqCA,EAAA,SAAQ;AAAA,OAOhN,aAAa,CAAA;AAAA,IACnB,MAAK;AAAA;KAELC,EAAA,EAAA,GAAAH,EAqCQI,GAAA,MAAAC,EApCoBH,EAAA,OAAK,CAAvBI,GAAQC,YADlBP,EAqCQ,SAAA;AAAA,MAnCL,KAAKM,EAAO;AAAA,MACZ,gBAAcA,EAAO,QAAQJ,EAAA;AAAA,MAC7B,iBAAeA,EAAA,YAAYI,EAAO;AAAA,MAClC,OAAKL,EAAA,CAAA;AAAA,wCAA4CC,EAAA,YAAYI,EAAO;AAAA,uCAAiDA,EAAO,QAAQJ,EAAA;AAAA,QAAqD,iCAAAI,EAAO;AAAA,QAAwD,0CAAAJ,EAAA,MAAM;AAAA,QAAiD,iCAAAI,EAAO;AAAA,SAQjT,6BAA6B,CAAA;AAAA,MADlC,WAAWJ,EAAA,YAAQ,CAAKI,EAAO,eAAe;AAAA,MAE/C,MAAK;AAAA,MACJ,WAAO;AAAA,QAAQE,EAAA,CAAAC,MAAAP,EAAA,aAAaI,CAAM,GAAA,CAAA,OAAA,CAAA;AAAA,QACXE,EAAAE,EAAA,CAAAD,MAAAP,EAAA,aAAaI,CAAM,GAAA,CAAA,SAAA,CAAA,GAAA,CAAA,OAAA,CAAA;AAAA;;MAE3CK,EAUE,SAVFC,EAUE;AAAA,QATC,SAASN,EAAO,QAAQJ,EAAA;AAAA,QACxB,UAAUA,EAAA,YAAYI,EAAO;AAAA,QAC7B,MAAMJ,EAAA;AAAA,QACN,UAAU;AAAA,QACV,OAAOI,EAAO;AAAA,QACf,OAAM;AAAA,QACN,MAAK;AAAA,0BACGJ,EAAA,qBAAmB;AAAA,QAC1B,SAAK,CAAAO,MAAEP,EAAA,QAAQI,EAAO,GAAG;AAAA;MAEjBJ,EAAA,gBAAW,mBAAtBC,KAAAH,EAEM,OAFNa,GAEM;AAAA,QADOP,EAAO,QAAQJ,EAAA,cAA1BC,KAAAH,EAAwF,OAAxFc,CAAwF;;MAG1FC,EAGOb,EAAA,QAAA,UAAA;AAAA,QAHA,OAAOK;AAAA,QAAQ,QAAQD;AAAA,SAA9B,MAGO;AAAA,QAFYA,EAAO,aAAxBU,EAA4FC,GAAA;AAAA;UAA7D,UAAUf,EAAA,YAAYI,EAAO;AAAA,UAAW,MAAMA,EAAO;AAAA;QACxEA,EAAO,cAAnBN,EAAmD,QAAAkB,GAAAC,EAAtBb,EAAO,KAAK,GAAA,CAAA;;;;;;"}
1
+ {"version":3,"file":"NeonToggle.vue.es.js","sources":["../../../../src/components/user-input/toggle/NeonToggle.vue"],"sourcesContent":["<template>\n <div\n :class=\"[\n `neon-toggle--${toggleStyle}`,\n `neon-toggle--${disabled ? 'low-contrast' : color}`,\n `neon-toggle--${orientation}`,\n `neon-toggle--${size}`,\n { 'neon-toggle--disabled': disabled },\n ]\"\n class=\"neon-toggle\"\n role=\"radiogroup\"\n >\n <label\n v-for=\"(option, index) in model\"\n :key=\"option.key\"\n :aria-checked=\"option.key === modelValue\"\n :aria-disabled=\"disabled || option.disabled\"\n :class=\"{\n 'neon-toggle__label--disabled': disabled || option.disabled,\n 'neon-toggle__label--checked': option.key === modelValue,\n 'neon-toggle__label--with-icon': option.icon,\n 'neon-toggle__label--with-slot-override': slots.option,\n 'neon-toggle__label--with-text': option.label,\n }\"\n :tabindex=\"!disabled && !option.disabled ? 0 : undefined\"\n class=\"neon-toggle__label no-style\"\n role=\"radio\"\n @keydown.enter=\"selectOption(option)\"\n @keydown.space.prevent=\"selectOption(option)\"\n >\n <input\n :checked=\"option.key === modelValue\"\n :disabled=\"disabled || option.disabled\"\n :name=\"name\"\n :tabindex=\"-1\"\n :value=\"option.key\"\n class=\"neon-toggle__input\"\n type=\"radio\"\n v-bind=\"sanitizedAttributes\"\n @click=\"onInput(option)\"\n />\n <div v-if=\"toggleStyle === 'radio-buttons'\" class=\"neon-toggle__radio-button\">\n <div v-if=\"option.key === modelValue\" class=\"neon-toggle__radio-button-indicator\"></div>\n </div>\n <!-- @slot This slot is for overriding the option rendering, it is passed two arguments, <em>option</em> - the option model & <em>index</em> -->\n <slot :index=\"index\" :option=\"option\" name=\"option\">\n <neon-icon v-if=\"option.icon\" :disabled=\"disabled || option.disabled\" :name=\"option.icon\" />\n <span v-if=\"option.label\">{{ option.label }}</span>\n </slot>\n </label>\n </div>\n</template>\n\n<script lang=\"ts\" src=\"./NeonToggle.ts\" />\n"],"names":["_createElementBlock","_normalizeClass","_ctx","_openBlock","_Fragment","_renderList","option","index","_withKeys","$event","_withModifiers","_createElementVNode","_mergeProps","_hoisted_3","_hoisted_4","_renderSlot","_createBlock","_component_neon_icon","_hoisted_5","_toDisplayString"],"mappings":";;;;;EAyCkD,OAAM;;;EACV,OAAM;;;;cAzClDA,EAiDM,OAAA;AAAA,IAhDH,OAAKC,EAAA,CAAA;AAAA,sBAA0BC,EAAA,WAAW;AAAA,MAA0B,gBAAAA,EAAA,4BAA4BA,EAAA,KAAK;AAAA,sBAA0BA,EAAA,WAAW;AAAA,sBAA0BA,EAAA,IAAI;AAAA,iCAAqCA,EAAA,SAAQ;AAAA,OAOhN,aAAa,CAAA;AAAA,IACnB,MAAK;AAAA;KAELC,EAAA,EAAA,GAAAH,EAqCQI,GAAA,MAAAC,EApCoBH,EAAA,OAAK,CAAvBI,GAAQC,YADlBP,EAqCQ,SAAA;AAAA,MAnCL,KAAKM,EAAO;AAAA,MACZ,gBAAcA,EAAO,QAAQJ,EAAA;AAAA,MAC7B,iBAAeA,EAAA,YAAYI,EAAO;AAAA,MAClC,OAAKL,EAAA,CAAA;AAAA,wCAA4CC,EAAA,YAAYI,EAAO;AAAA,uCAAiDA,EAAO,QAAQJ,EAAA;AAAA,QAAqD,iCAAAI,EAAO;AAAA,QAAwD,0CAAAJ,EAAA,MAAM;AAAA,QAAiD,iCAAAI,EAAO;AAAA,SAQjT,6BAA6B,CAAA;AAAA,MADlC,WAAWJ,EAAA,YAAQ,CAAKI,EAAO,eAAe;AAAA,MAE/C,MAAK;AAAA,MACJ,WAAO;AAAA,QAAQE,EAAA,CAAAC,MAAAP,EAAA,aAAaI,CAAM,GAAA,CAAA,OAAA,CAAA;AAAA,QACXE,EAAAE,EAAA,CAAAD,MAAAP,EAAA,aAAaI,CAAM,GAAA,CAAA,SAAA,CAAA,GAAA,CAAA,OAAA,CAAA;AAAA;;MAE3CK,EAUE,SAVFC,EAUE;AAAA,QATC,SAASN,EAAO,QAAQJ,EAAA;AAAA,QACxB,UAAUA,EAAA,YAAYI,EAAO;AAAA,QAC7B,MAAMJ,EAAA;AAAA,QACN,UAAU;AAAA,QACV,OAAOI,EAAO;AAAA,QACf,OAAM;AAAA,QACN,MAAK;AAAA,0BACGJ,EAAA,qBAAmB;AAAA,QAC1B,SAAK,CAAAO,MAAEP,EAAA,QAAQI,CAAM;AAAA;MAEbJ,EAAA,gBAAW,mBAAtBC,KAAAH,EAEM,OAFNa,GAEM;AAAA,QADOP,EAAO,QAAQJ,EAAA,cAA1BC,KAAAH,EAAwF,OAAxFc,CAAwF;;MAG1FC,EAGOb,EAAA,QAAA,UAAA;AAAA,QAHA,OAAOK;AAAA,QAAQ,QAAQD;AAAA,SAA9B,MAGO;AAAA,QAFYA,EAAO,aAAxBU,EAA4FC,GAAA;AAAA;UAA7D,UAAUf,EAAA,YAAYI,EAAO;AAAA,UAAW,MAAMA,EAAO;AAAA;QACxEA,EAAO,cAAnBN,EAAmD,QAAAkB,GAAAC,EAAtBb,EAAO,KAAK,GAAA,CAAA;;;;;;"}