slim-select 3.4.2 → 3.4.3

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.
@@ -71,21 +71,21 @@ function y() {
71
71
  return Math.random().toString(36).substring(2, 10);
72
72
  }
73
73
  function x(f, e) {
74
- function t(i, l) {
75
- return l && i && i.classList && i.classList.contains(l) || l && i && i.dataset && i.dataset.id && i.dataset.id === e ? i : null;
74
+ function t(i, n) {
75
+ return n && i && i.classList && i.classList.contains(n) || n && i && i.dataset && i.dataset.id && i.dataset.id === e ? i : null;
76
76
  }
77
- function s(i, l) {
78
- return !i || i === document ? null : t(i, l) ? i : s(i.parentNode, l);
77
+ function s(i, n) {
78
+ return !i || i === document ? null : t(i, n) ? i : s(i.parentNode, n);
79
79
  }
80
80
  return t(f, e) || s(f, e);
81
81
  }
82
82
  function S(f, e = 50, t = !1) {
83
83
  let s;
84
84
  return function(...i) {
85
- const l = self, n = () => {
86
- s = null, t || f.apply(l, i);
85
+ const n = self, l = () => {
86
+ s = null, t || f.apply(n, i);
87
87
  }, a = t && !s;
88
- clearTimeout(s), s = setTimeout(n, e), a && f.apply(l, i);
88
+ clearTimeout(s), s = setTimeout(l, e), a && f.apply(n, i);
89
89
  };
90
90
  }
91
91
  function O(f, e) {
@@ -167,8 +167,8 @@ class k {
167
167
  if (s) {
168
168
  if (s instanceof m || "label" in s) {
169
169
  let i = [];
170
- "options" in s && s.options && s.options.forEach((l) => {
171
- i.push(new u(l));
170
+ "options" in s && s.options && s.options.forEach((n) => {
171
+ i.push(new u(n));
172
172
  }), i.length > 0 && t.push(new m(s));
173
173
  }
174
174
  (s instanceof u || "text" in s) && t.push(new u(s));
@@ -180,29 +180,29 @@ class k {
180
180
  let i = [];
181
181
  if (t) {
182
182
  i = this.getSelectedOptions();
183
- const l = [];
184
- i.forEach((n) => {
183
+ const n = [];
184
+ i.forEach((l) => {
185
185
  let a = !1;
186
186
  for (const o of s) {
187
- if (o instanceof u && o.id === n.id) {
187
+ if (o instanceof u && o.id === l.id) {
188
188
  a = !0;
189
189
  break;
190
190
  }
191
191
  if (o instanceof m) {
192
192
  for (const h of o.options)
193
- if (h.id === n.id) {
193
+ if (h.id === l.id) {
194
194
  a = !0;
195
195
  break;
196
196
  }
197
197
  }
198
198
  }
199
- a || l.push(n);
200
- }), this.data = [...l, ...s];
199
+ a || n.push(l);
200
+ }), this.data = [...n, ...s];
201
201
  } else
202
202
  this.data = s;
203
203
  if (this.selectType === "single") {
204
- const l = t && i.length === 0;
205
- this.setSelectedBy("id", this.getSelected(), l);
204
+ const n = t && i.length === 0;
205
+ this.setSelectedBy("id", this.getSelected(), n);
206
206
  }
207
207
  }
208
208
  // Get data will return all the data
@@ -226,19 +226,19 @@ class k {
226
226
  // but also clean selected by determining selectType
227
227
  // When allowEmptySelection is true (e.g. after search with no prior selection), single select will not auto-select the first option
228
228
  setSelectedBy(e, t, s = !1) {
229
- let i = null, l = !1;
230
- const n = [];
229
+ let i = null, n = !1;
230
+ const l = [];
231
231
  for (let o of this.data) {
232
232
  if (o instanceof m)
233
233
  for (let h of o.options) {
234
234
  i || (i = h);
235
235
  let r = h[e] || "";
236
- h.selected = l ? !1 : t.includes(r), h.selected && (n.push(h), this.selectType === "single" && (l = !0));
236
+ h.selected = n ? !1 : t.includes(r), h.selected && (l.push(h), this.selectType === "single" && (n = !0));
237
237
  }
238
- o instanceof u && (i || (i = o), o.selected = l ? !1 : t.includes(o[e]), o.selected && (n.push(o), this.selectType === "single" && (l = !0)));
238
+ o instanceof u && (i || (i = o), o.selected = n ? !1 : t.includes(o[e]), o.selected && (l.push(o), this.selectType === "single" && (n = !0)));
239
239
  }
240
- this.selectType === "single" && i && !l && !s && (i.selected = !0, n.push(i));
241
- const a = t.map((o) => n.find((h) => h[e] === o)?.id || "");
240
+ this.selectType === "single" && i && !n && !s && (i.selected = !0, l.push(i));
241
+ const a = t.map((o) => l.find((h) => h[e] === o)?.id || "");
242
242
  this.selectedOrder = a;
243
243
  }
244
244
  getSelected() {
@@ -280,12 +280,12 @@ class k {
280
280
  const s = [];
281
281
  return this.data.forEach((i) => {
282
282
  if (i instanceof m) {
283
- let l = [];
283
+ let n = [];
284
284
  if (i.options.forEach((a) => {
285
- (!e || e(a)) && (t ? l.push(new u(a)) : s.push(new u(a)));
286
- }), l.length > 0) {
285
+ (!e || e(a)) && (t ? n.push(new u(a)) : s.push(new u(a)));
286
+ }), n.length > 0) {
287
287
  let a = new m(i);
288
- a.options = l, s.push(a);
288
+ a.options = n, s.push(a);
289
289
  }
290
290
  }
291
291
  i instanceof u && (!e || e(i)) && s.push(new u(i));
@@ -295,12 +295,12 @@ class k {
295
295
  selectedOrderOptions(e) {
296
296
  const t = [];
297
297
  return this.selectedOrder.forEach((s) => {
298
- const i = e.find((l) => l.id === s);
298
+ const i = e.find((n) => n.id === s);
299
299
  i && t.push(i);
300
300
  }), e.forEach((s) => {
301
301
  let i = !1;
302
- t.forEach((l) => {
303
- if (s.id === l.id) {
302
+ t.forEach((n) => {
303
+ if (s.id === n.id) {
304
304
  i = !0;
305
305
  return;
306
306
  }
@@ -314,6 +314,7 @@ class N {
314
314
  callbacks;
315
315
  // Used to compute the range selection
316
316
  lastSelectedOption;
317
+ lastRenderedOptions;
317
318
  // Timeout tracking for cleanup
318
319
  closeAnimationTimeout = null;
319
320
  // Elements
@@ -322,7 +323,7 @@ class N {
322
323
  // Classes
323
324
  classes;
324
325
  constructor(e, t, s, i) {
325
- this.store = s, this.settings = e, this.classes = t, this.callbacks = i, this.lastSelectedOption = null, this.main = this.mainDiv(), this.content = this.contentDiv(), this.updateClassStyles(), this.updateAriaAttributes(), this.settings.contentPosition !== "relative" && (this.content.main.style.top = "-9999px", this.content.main.style.left = "-9999px", this.content.main.style.margin = "0", this.content.main.style.width = "auto"), this.settings.contentLocation && this.settings.contentLocation.appendChild(this.content.main);
326
+ this.store = s, this.settings = e, this.classes = t, this.callbacks = i, this.lastSelectedOption = null, this.lastRenderedOptions = [], this.main = this.mainDiv(), this.content = this.contentDiv(), this.updateClassStyles(), this.updateAriaAttributes(), this.settings.contentPosition !== "relative" && (this.content.main.style.top = "-9999px", this.content.main.style.left = "-9999px", this.content.main.style.margin = "0", this.content.main.style.width = "auto"), this.settings.contentLocation && this.settings.contentLocation.appendChild(this.content.main);
326
327
  }
327
328
  // Helper method to add classes that may contain spaces
328
329
  // Splits by spaces and adds each class individually to avoid DOMException
@@ -355,8 +356,8 @@ class N {
355
356
  this.addClasses(this.main.main, t), this.addClasses(this.content.main, t), this.addClasses(this.content.main, this.classes.contentOpen), this.content.search.input.removeAttribute("aria-hidden"), this.moveContent();
356
357
  const s = this.store.getSelectedOptions();
357
358
  if (s.length) {
358
- const i = s[s.length - 1].id, l = this.content.list.querySelector('[data-id="' + i + '"]');
359
- l && this.ensureElementInView(this.content.list, l);
359
+ const i = s[s.length - 1].id, n = this.content.list.querySelector('[data-id="' + i + '"]');
360
+ n && this.ensureElementInView(this.content.list, n);
360
361
  }
361
362
  }
362
363
  close() {
@@ -430,10 +431,10 @@ class N {
430
431
  this.settings.closeOnSelect && this.callbacks.close(), this.callbacks.afterChange && this.callbacks.afterChange(this.store.getSelectedOptions());
431
432
  }
432
433
  };
433
- const l = document.createElementNS("http://www.w3.org/2000/svg", "svg");
434
- l.setAttribute("viewBox", "0 0 100 100");
435
- const n = document.createElementNS("http://www.w3.org/2000/svg", "path");
436
- n.setAttribute("d", this.classes.deselectPath), l.appendChild(n), s.appendChild(l), e.appendChild(s);
434
+ const n = document.createElementNS("http://www.w3.org/2000/svg", "svg");
435
+ n.setAttribute("viewBox", "0 0 100 100");
436
+ const l = document.createElementNS("http://www.w3.org/2000/svg", "path");
437
+ l.setAttribute("d", this.classes.deselectPath), n.appendChild(l), s.appendChild(n), e.appendChild(s);
437
438
  const a = document.createElementNS("http://www.w3.org/2000/svg", "svg");
438
439
  this.addClasses(a, this.classes.arrow), a.setAttribute("viewBox", "0 0 100 100");
439
440
  const o = document.createElementNS("http://www.w3.org/2000/svg", "path");
@@ -442,8 +443,8 @@ class N {
442
443
  values: t,
443
444
  deselect: {
444
445
  main: s,
445
- svg: l,
446
- path: n
446
+ svg: n,
447
+ path: l
447
448
  },
448
449
  arrow: {
449
450
  main: a,
@@ -500,8 +501,8 @@ class N {
500
501
  this.settings.keepOrder && (t = this.store.selectedOrderOptions(t));
501
502
  let s = [];
502
503
  for (let i = 0; i < e.length; i++) {
503
- const l = e[i], n = l.getAttribute("data-id");
504
- n && (t.filter((o) => o.id === n, !1).length || s.push(l));
504
+ const n = e[i], l = n.getAttribute("data-id");
505
+ l && (t.filter((o) => o.id === l, !1).length || s.push(n));
505
506
  }
506
507
  for (const i of s)
507
508
  this.addClasses(i, this.classes.valueOut), setTimeout(() => {
@@ -509,10 +510,10 @@ class N {
509
510
  }, 100);
510
511
  e = this.main.values.childNodes;
511
512
  for (let i = 0; i < t.length; i++) {
512
- let l = !0;
513
- for (let n = 0; n < e.length; n++)
514
- t[i].id === String(e[n].dataset.id) && (l = !1);
515
- l && (this.settings.keepOrder ? this.main.values.appendChild(this.multipleValue(t[i])) : e.length === 0 ? this.main.values.appendChild(this.multipleValue(t[i])) : i === 0 ? this.main.values.insertBefore(this.multipleValue(t[i]), e[i]) : e[i - 1].insertAdjacentElement("afterend", this.multipleValue(t[i])));
513
+ let n = !0;
514
+ for (let l = 0; l < e.length; l++)
515
+ t[i].id === String(e[l].dataset.id) && (n = !1);
516
+ n && (this.settings.keepOrder ? this.main.values.appendChild(this.multipleValue(t[i])) : e.length === 0 ? this.main.values.appendChild(this.multipleValue(t[i])) : i === 0 ? this.main.values.insertBefore(this.multipleValue(t[i]), e[i]) : e[i - 1].insertAdjacentElement("afterend", this.multipleValue(t[i])));
516
517
  }
517
518
  }
518
519
  multipleValue(e) {
@@ -537,10 +538,10 @@ class N {
537
538
  this.callbacks.setSelected(c, !1), this.settings.closeOnSelect && this.callbacks.close(), this.callbacks.afterChange && this.callbacks.afterChange(r), this.updateDeselectAll();
538
539
  }
539
540
  };
540
- const l = document.createElementNS("http://www.w3.org/2000/svg", "svg");
541
- l.setAttribute("viewBox", "0 0 100 100");
542
- const n = document.createElementNS("http://www.w3.org/2000/svg", "path");
543
- n.setAttribute("d", this.classes.optionDelete), l.appendChild(n), i.appendChild(l), t.appendChild(i), i.onkeydown = (a) => {
541
+ const n = document.createElementNS("http://www.w3.org/2000/svg", "svg");
542
+ n.setAttribute("viewBox", "0 0 100 100");
543
+ const l = document.createElementNS("http://www.w3.org/2000/svg", "path");
544
+ l.setAttribute("d", this.classes.optionDelete), n.appendChild(l), i.appendChild(n), t.appendChild(i), i.onkeydown = (a) => {
544
545
  a.key === "Enter" && i.click();
545
546
  };
546
547
  }
@@ -579,23 +580,23 @@ class N {
579
580
  main: e,
580
581
  input: t
581
582
  };
582
- if (this.settings.showSearch || (this.addClasses(e, this.classes.hide), t.readOnly = !0), t.type = "search", t.placeholder = this.settings.searchPlaceholder, t.tabIndex = -1, t.setAttribute("aria-label", this.settings.searchPlaceholder), t.setAttribute("aria-autocomplete", "list"), t.setAttribute("autocapitalize", "off"), t.setAttribute("autocomplete", "off"), t.setAttribute("autocorrect", "off"), t.setAttribute("aria-hidden", "true"), t.oninput = S((l) => {
583
- this.callbacks.search(l.target.value);
584
- }, 100), t.onkeydown = (l) => {
585
- switch (l.key) {
583
+ if (this.settings.showSearch || (this.addClasses(e, this.classes.hide), t.readOnly = !0), t.type = "search", t.placeholder = this.settings.searchPlaceholder, t.tabIndex = -1, t.setAttribute("aria-label", this.settings.searchPlaceholder), t.setAttribute("aria-autocomplete", "list"), t.setAttribute("autocapitalize", "off"), t.setAttribute("autocomplete", "off"), t.setAttribute("autocorrect", "off"), t.setAttribute("aria-hidden", "true"), t.oninput = S((n) => {
584
+ this.callbacks.search(n.target.value);
585
+ }, 100), t.onkeydown = (n) => {
586
+ switch (n.key) {
586
587
  case "ArrowUp":
587
588
  case "ArrowDown":
588
- return l.key === "ArrowDown" ? this.highlight("down") : this.highlight("up"), !1;
589
+ return n.key === "ArrowDown" ? this.highlight("down") : this.highlight("up"), !1;
589
590
  case "Tab":
590
591
  return this.callbacks.close(), !0;
591
592
  // Continue doing normal tabbing
592
593
  case "Escape":
593
594
  return this.callbacks.close(), !1;
594
595
  case " ":
595
- const n = this.content.list.querySelector(
596
+ const l = this.content.list.querySelector(
596
597
  "." + this.classes.getFirst("highlighted")
597
598
  );
598
- return n ? (n.click(), !1) : !0;
599
+ return l ? (l.click(), !1) : !0;
599
600
  case "Enter":
600
601
  const a = this.content.list.querySelector(
601
602
  "." + this.classes.getFirst("highlighted")
@@ -605,10 +606,10 @@ class N {
605
606
  return !0;
606
607
  }, e.appendChild(t), this.callbacks.addable) {
607
608
  this.addClasses(s, this.classes.addable);
608
- const l = document.createElementNS("http://www.w3.org/2000/svg", "svg");
609
- l.setAttribute("viewBox", "0 0 100 100");
610
- const n = document.createElementNS("http://www.w3.org/2000/svg", "path");
611
- n.setAttribute("d", this.classes.addablePath), l.appendChild(n), s.appendChild(l), s.onclick = (a) => {
609
+ const n = document.createElementNS("http://www.w3.org/2000/svg", "svg");
610
+ n.setAttribute("viewBox", "0 0 100 100");
611
+ const l = document.createElementNS("http://www.w3.org/2000/svg", "path");
612
+ l.setAttribute("d", this.classes.addablePath), n.appendChild(l), s.appendChild(n), s.onclick = (a) => {
612
613
  if (a.preventDefault(), a.stopPropagation(), !this.callbacks.addable)
613
614
  return;
614
615
  const o = this.content.search.input.value.trim();
@@ -638,8 +639,8 @@ class N {
638
639
  }) : r instanceof Error ? this.renderError(r.message) : h(r));
639
640
  }, e.appendChild(s), i.addable = {
640
641
  main: s,
641
- svg: l,
642
- path: n
642
+ svg: n,
643
+ path: l
643
644
  };
644
645
  }
645
646
  return i;
@@ -661,25 +662,25 @@ class N {
661
662
  return;
662
663
  }
663
664
  let s = !1;
664
- for (const l of t)
665
- l.classList.contains(this.classes.getFirst("highlighted")) && (s = !0);
665
+ for (const n of t)
666
+ n.classList.contains(this.classes.getFirst("highlighted")) && (s = !0);
666
667
  if (!s) {
667
- for (const l of t)
668
- if (l.classList.contains(this.classes.getFirst("selected"))) {
669
- this.addClasses(l, this.classes.highlighted);
668
+ for (const n of t)
669
+ if (n.classList.contains(this.classes.getFirst("selected"))) {
670
+ this.addClasses(n, this.classes.highlighted);
670
671
  break;
671
672
  }
672
673
  }
673
- for (let l = 0; l < t.length; l++)
674
- if (t[l].classList.contains(this.classes.getFirst("highlighted"))) {
675
- const n = t[l];
676
- this.removeClasses(n, this.classes.highlighted);
677
- const a = n.parentElement;
674
+ for (let n = 0; n < t.length; n++)
675
+ if (t[n].classList.contains(this.classes.getFirst("highlighted"))) {
676
+ const l = t[n];
677
+ this.removeClasses(l, this.classes.highlighted);
678
+ const a = l.parentElement;
678
679
  if (a && a.classList.contains(this.classes.getFirst("mainOpen"))) {
679
680
  const r = a.querySelector("." + this.classes.getFirst("optgroupLabel"));
680
681
  r && r.click();
681
682
  }
682
- let o = t[e === "down" ? l + 1 < t.length ? l + 1 : 0 : l - 1 >= 0 ? l - 1 : t.length - 1];
683
+ let o = t[e === "down" ? n + 1 < t.length ? n + 1 : 0 : n - 1 >= 0 ? n - 1 : t.length - 1];
683
684
  this.addClasses(o, this.classes.highlighted), this.ensureElementInView(this.content.list, o), o.id && this.main.main.setAttribute("aria-activedescendant", o.id);
684
685
  const h = o.parentElement;
685
686
  if (h && h.classList.contains(this.classes.getFirst("close"))) {
@@ -712,7 +713,7 @@ class N {
712
713
  }
713
714
  // Take in data and add options to
714
715
  renderOptions(e) {
715
- if (this.content.list.innerHTML = "", e.length === 0) {
716
+ if (this.lastRenderedOptions = e.map((s) => s instanceof u ? [s] : s.options.map((i) => new u(i))).flat(), this.content.list.innerHTML = "", e.length === 0) {
716
717
  const s = document.createElement("div");
717
718
  this.addClasses(s, this.classes.search), this.callbacks.addable ? s.innerHTML = this.settings.addableText.replace("{value}", this.content.search.input.value) : s.innerHTML = this.settings.searchText, this.content.list.appendChild(s);
718
719
  return;
@@ -731,12 +732,12 @@ class N {
731
732
  if (s instanceof m) {
732
733
  const i = document.createElement("div");
733
734
  this.addClasses(i, this.classes.optgroup);
734
- const l = document.createElement("div");
735
- this.addClasses(l, this.classes.optgroupLabel), i.appendChild(l);
736
735
  const n = document.createElement("div");
737
- this.addClasses(n, this.classes.optgroupLabelText), n.textContent = s.label, l.appendChild(n);
736
+ this.addClasses(n, this.classes.optgroupLabel), i.appendChild(n);
737
+ const l = document.createElement("div");
738
+ this.addClasses(l, this.classes.optgroupLabelText), l.textContent = s.label, n.appendChild(l);
738
739
  const a = document.createElement("div");
739
- if (this.addClasses(a, this.classes.optgroupActions), l.appendChild(a), this.settings.isMultiple && s.selectAll) {
740
+ if (this.addClasses(a, this.classes.optgroupActions), n.appendChild(a), this.settings.isMultiple && s.selectAll) {
740
741
  const o = document.createElement("div");
741
742
  this.addClasses(o, this.classes.optgroupSelectAll);
742
743
  let h = !0;
@@ -781,11 +782,11 @@ class N {
781
782
  const h = document.createElementNS("http://www.w3.org/2000/svg", "svg");
782
783
  h.setAttribute("viewBox", "0 0 100 100"), this.addClasses(h, this.classes.arrow), o.appendChild(h);
783
784
  const r = document.createElementNS("http://www.w3.org/2000/svg", "path");
784
- h.appendChild(r), s.options.some((c) => c.selected) || this.content.search.input.value.trim() !== "" ? (this.addClasses(o, this.classes.mainOpen), r.setAttribute("d", this.classes.arrowOpen)) : s.closable === "open" ? (this.addClasses(i, this.classes.mainOpen), r.setAttribute("d", this.classes.arrowOpen)) : s.closable === "close" && (this.addClasses(i, this.classes.close), r.setAttribute("d", this.classes.arrowClose)), l.addEventListener("click", (c) => {
785
+ h.appendChild(r), s.options.some((c) => c.selected) || this.content.search.input.value.trim() !== "" ? (this.addClasses(o, this.classes.mainOpen), r.setAttribute("d", this.classes.arrowOpen)) : s.closable === "open" ? (this.addClasses(i, this.classes.mainOpen), r.setAttribute("d", this.classes.arrowOpen)) : s.closable === "close" && (this.addClasses(i, this.classes.close), r.setAttribute("d", this.classes.arrowClose)), n.addEventListener("click", (c) => {
785
786
  c.preventDefault(), c.stopPropagation(), i.classList.contains(this.classes.getFirst("close")) ? (this.removeClasses(i, this.classes.close), this.addClasses(i, this.classes.mainOpen), r.setAttribute("d", this.classes.arrowOpen)) : (this.removeClasses(i, this.classes.mainOpen), this.addClasses(i, this.classes.close), r.setAttribute("d", this.classes.arrowClose));
786
787
  }), a.appendChild(o);
787
788
  }
788
- i.appendChild(l);
789
+ i.appendChild(n);
789
790
  for (const o of s.options)
790
791
  i.appendChild(this.option(new u(o))), t.appendChild(i);
791
792
  }
@@ -808,25 +809,25 @@ class N {
808
809
  this.classes.searchHighlighter
809
810
  ) : e.html !== "" ? t.innerHTML = e.html : t.textContent = e.text, this.settings.showOptionTooltips && t.textContent && t.setAttribute("title", t.textContent), e.display || this.addClasses(t, this.classes.hide), e.disabled && this.addClasses(t, this.classes.disabled), e.selected && this.settings.hideSelected && this.addClasses(t, this.classes.hide), e.selected ? (this.addClasses(t, this.classes.selected), t.setAttribute("aria-selected", "true"), this.main.main.setAttribute("aria-activedescendant", t.id)) : (this.removeClasses(t, this.classes.selected), t.setAttribute("aria-selected", "false")), t.addEventListener("click", (s) => {
810
811
  s.preventDefault(), s.stopPropagation();
811
- const i = this.store.getSelected(), l = s.currentTarget, n = String(l.dataset.id), a = s.ctrlKey || s.metaKey;
812
+ const i = this.store.getSelected(), n = s.currentTarget, l = String(n.dataset.id), a = s.ctrlKey || s.metaKey;
812
813
  if (e.disabled || !this.settings.isMultiple && e.selected && !this.settings.allowDeselect || e.selected && e.mandatory || this.settings.isMultiple && this.settings.maxSelected <= i.length && !e.selected || this.settings.isMultiple && this.settings.minSelected >= i.length && e.selected && !a)
813
814
  return;
814
815
  let o = !1;
815
816
  const h = this.store.getSelectedOptions();
816
817
  let r = [];
817
818
  if (this.settings.isMultiple) {
818
- const c = h.some((d) => d.id === n);
819
+ const c = h.some((d) => d.id === l);
819
820
  if (s.shiftKey && this.lastSelectedOption) {
820
- const d = this.store.getDataOptions(), g = d.findIndex((C) => C.id === this.lastSelectedOption.id), v = d.findIndex((C) => C.id === e.id);
821
+ const d = this.lastRenderedOptions, g = d.findIndex((C) => C.id === this.lastSelectedOption.id), v = d.findIndex((C) => C.id === e.id);
821
822
  if (g >= 0 && v >= 0) {
822
823
  const C = Math.min(g, v), w = Math.max(g, v), E = d.slice(C, w + 1).filter((A) => !h.find((L) => L.id === A.id));
823
824
  h.length + E.length <= this.settings.maxSelected ? r = h.concat(E) : r = h;
824
825
  } else
825
826
  r = h;
826
- } else a ? (c ? r = h.filter((d) => d.id !== n) : r = h.concat(e), this.lastSelectedOption = e) : (c ? r = h.filter((d) => d.id !== n) : r = h.concat(e), this.lastSelectedOption = e);
827
+ } else a ? (c ? r = h.filter((d) => d.id !== l) : r = h.concat(e), this.lastSelectedOption = e) : (c ? r = h.filter((d) => d.id !== l) : r = h.concat(e), this.lastSelectedOption = e);
827
828
  }
828
829
  if (this.settings.isMultiple || (e.selected ? r = [] : r = [e]), this.callbacks.beforeChange || (o = !0), this.callbacks.beforeChange && (this.callbacks.beforeChange(r, h) === !1 ? o = !1 : o = !0), o) {
829
- this.store.getOptionByID(n) || this.callbacks.addOption(e), this.callbacks.setSelected(
830
+ this.store.getOptionByID(l) || this.callbacks.addOption(e), this.callbacks.setSelected(
830
831
  r.map((d) => d.id),
831
832
  !1
832
833
  );
@@ -842,11 +843,11 @@ class N {
842
843
  const i = t.trim();
843
844
  if (i === "")
844
845
  return e;
845
- const l = i.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), n = document.createElement("div");
846
- n.innerHTML = e;
846
+ const n = i.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), l = document.createElement("div");
847
+ l.innerHTML = e;
847
848
  const a = (o) => {
848
849
  if (o.nodeType === Node.TEXT_NODE) {
849
- const h = o.textContent || "", r = new RegExp("(" + l + ")", "i");
850
+ const h = o.textContent || "", r = new RegExp("(" + n + ")", "i");
850
851
  if (r.test(h)) {
851
852
  const c = document.createElement("span");
852
853
  h.split(r).forEach((d, g) => {
@@ -858,13 +859,13 @@ class N {
858
859
  }
859
860
  } else o.nodeType === Node.ELEMENT_NODE && Array.from(o.childNodes).forEach((h) => a(h));
860
861
  };
861
- return Array.from(n.childNodes).forEach((o) => a(o)), n.innerHTML;
862
+ return Array.from(l.childNodes).forEach((o) => a(o)), l.innerHTML;
862
863
  }
863
864
  setContentDirection(e) {
864
865
  const t = e === "above", s = t ? this.classes.dirAbove : this.classes.dirBelow, i = t ? this.classes.dirBelow : this.classes.dirAbove;
865
866
  if (this.removeClasses(this.main.main, i), this.addClasses(this.main.main, s), this.removeClasses(this.content.main, i), this.addClasses(this.content.main, s), t) {
866
- const l = this.main.main.offsetHeight, n = this.content.main.offsetHeight;
867
- this.content.main.style.margin = "-" + (l + n - 1) + "px 0px 0px 0px";
867
+ const n = this.main.main.offsetHeight, l = this.content.main.offsetHeight;
868
+ this.content.main.style.margin = "-" + (n + l - 1) + "px 0px 0px 0px";
868
869
  } else
869
870
  this.content.main.style.margin = "-1px 0px 0px 0px";
870
871
  }
@@ -876,15 +877,15 @@ class N {
876
877
  this.settings.contentPosition === "fixed" ? (t = e.top + e.height, s = e.left) : (t = e.top + window.scrollY + e.height, s = e.left + window.scrollX), this.content.main.style.top = t + "px", this.content.main.style.left = s + "px";
877
878
  const i = this.settings.contentWidth;
878
879
  this.content.main.style.width = "", this.content.main.style.minWidth = "", this.content.main.style.maxWidth = "", i ? i.startsWith(">") ? this.content.main.style.minWidth = i.slice(1) : i.startsWith("<") ? this.content.main.style.maxWidth = i.slice(1) : this.content.main.style.width = i : this.content.main.style.width = e.width + "px";
879
- const l = 20, n = window.innerWidth - l, a = () => {
880
+ const n = 20, l = window.innerWidth - n, a = () => {
880
881
  const h = this.content.main.getBoundingClientRect().right;
881
- if (h <= n) return;
882
- const r = h - n, c = parseFloat(this.content.main.style.left) || 0;
882
+ if (h <= l) return;
883
+ const r = h - l, c = parseFloat(this.content.main.style.left) || 0;
883
884
  if (this.settings.contentPosition === "fixed") {
884
- const p = Math.max(l, c - r);
885
+ const p = Math.max(n, c - r);
885
886
  this.content.main.style.left = p + "px";
886
887
  } else {
887
- const p = Math.max(window.scrollX + l, c - r);
888
+ const p = Math.max(window.scrollX + n, c - r);
888
889
  this.content.main.style.left = p + "px";
889
890
  }
890
891
  };
@@ -899,8 +900,8 @@ class N {
899
900
  this.setContentDirection("below"), this.setContentPosition();
900
901
  }
901
902
  ensureElementInView(e, t) {
902
- const s = e.scrollTop + e.offsetTop, i = s + e.clientHeight, l = t.offsetTop, n = l + t.clientHeight;
903
- l < s ? e.scrollTop -= s - l : n > i && (e.scrollTop += n - i);
903
+ const s = e.scrollTop + e.offsetTop, i = s + e.clientHeight, n = t.offsetTop, l = n + t.clientHeight;
904
+ n < s ? e.scrollTop -= s - n : l > i && (e.scrollTop += l - i);
904
905
  }
905
906
  putContent() {
906
907
  const e = this.main.main.offsetHeight, t = this.main.main.getBoundingClientRect(), s = this.content.main.offsetHeight;
@@ -910,8 +911,8 @@ class N {
910
911
  updateDeselectAll() {
911
912
  if (!this.store || !this.settings)
912
913
  return;
913
- const e = this.store.getSelectedOptions(), t = e && e.length > 0, s = this.settings.isMultiple, i = this.settings.allowDeselect, l = this.main.deselect.main, n = this.classes.hide;
914
- i && !(s && !t) ? this.removeClasses(l, n) : this.addClasses(l, n);
914
+ const e = this.store.getSelectedOptions(), t = e && e.length > 0, s = this.settings.isMultiple, i = this.settings.allowDeselect, n = this.main.deselect.main, l = this.classes.hide;
915
+ i && !(s && !t) ? this.removeClasses(n, l) : this.addClasses(n, l);
915
916
  }
916
917
  }
917
918
  class M {
@@ -973,30 +974,30 @@ class M {
973
974
  observeCall(e) {
974
975
  if (!this.listen)
975
976
  return;
976
- let t = !1, s = !1, i = !1, l = !1;
977
- for (const n of e) {
978
- if (n.target === this.select && (n.attributeName === "disabled" && (s = !0), n.attributeName === "class" && (t = !0), n.type === "childList")) {
979
- for (const a of Array.from(n.addedNodes))
977
+ let t = !1, s = !1, i = !1, n = !1;
978
+ for (const l of e) {
979
+ if (l.target === this.select && (l.attributeName === "disabled" && (s = !0), l.attributeName === "class" && (t = !0), l.type === "childList")) {
980
+ for (const a of Array.from(l.addedNodes))
980
981
  if (a.nodeName === "OPTION" && a.value === this.select.value) {
981
- l = !0;
982
+ n = !0;
982
983
  break;
983
984
  }
984
985
  i = !0;
985
986
  }
986
- (n.target.nodeName === "OPTGROUP" || n.target.nodeName === "OPTION") && (i = !0);
987
+ (l.target.nodeName === "OPTGROUP" || l.target.nodeName === "OPTION") && (i = !0);
987
988
  }
988
989
  if (t && this.onClassChange && this.onClassChange(this.select.className.split(" ")), s && this.onDisabledChange && (this.changeListen(!1), this.onDisabledChange(this.select.disabled), this.changeListen(!0)), i && this.onOptionsChange) {
989
990
  if (this.isUpdating) {
990
991
  if (this.select.options.length > 0) {
991
- const n = this.getData();
992
- n.length > 0 && (this.pendingOptionsChange = n);
992
+ const l = this.getData();
993
+ l.length > 0 && (this.pendingOptionsChange = l);
993
994
  }
994
- l && this.select.dispatchEvent(new Event("change"));
995
+ n && this.select.dispatchEvent(new Event("change"));
995
996
  return;
996
997
  }
997
998
  this.changeListen(!1), this.onOptionsChange(this.getData()), this.changeListen(!0);
998
999
  }
999
- l && this.select.dispatchEvent(new Event("change"));
1000
+ n && this.select.dispatchEvent(new Event("change"));
1000
1001
  }
1001
1002
  // From the select element pull optgroup and options into data
1002
1003
  getData() {
@@ -1044,10 +1045,10 @@ class M {
1044
1045
  for (const s of t) {
1045
1046
  if (s.nodeName === "OPTGROUP") {
1046
1047
  const i = s.childNodes;
1047
- for (const l of i)
1048
- if (l.nodeName === "OPTION") {
1049
- const n = l;
1050
- n.selected && e.push(this.getDataFromOption(n));
1048
+ for (const n of i)
1049
+ if (n.nodeName === "OPTION") {
1050
+ const l = n;
1051
+ l.selected && e.push(this.getDataFromOption(l));
1051
1052
  }
1052
1053
  }
1053
1054
  if (s.nodeName === "OPTION") {
@@ -1065,10 +1066,10 @@ class M {
1065
1066
  const t = this.select.childNodes;
1066
1067
  for (const s of t) {
1067
1068
  if (s.nodeName === "OPTGROUP") {
1068
- const l = s.childNodes;
1069
- for (const n of l)
1070
- if (n.nodeName === "OPTION") {
1071
- const a = n;
1069
+ const n = s.childNodes;
1070
+ for (const l of n)
1071
+ if (l.nodeName === "OPTION") {
1072
+ const a = l;
1072
1073
  a.selected = e.includes(a.id);
1073
1074
  }
1074
1075
  }
@@ -1088,10 +1089,10 @@ class M {
1088
1089
  const t = this.select.childNodes;
1089
1090
  for (const s of t) {
1090
1091
  if (s.nodeName === "OPTGROUP") {
1091
- const l = s.childNodes;
1092
- for (const n of l)
1093
- if (n.nodeName === "OPTION") {
1094
- const a = n;
1092
+ const n = s.childNodes;
1093
+ for (const l of n)
1094
+ if (l.nodeName === "OPTION") {
1095
+ const a = l;
1095
1096
  a.selected = e.includes(a.value);
1096
1097
  }
1097
1098
  }
@@ -1136,7 +1137,7 @@ class M {
1136
1137
  // Find and handle labels associated with this select
1137
1138
  setupLabelHandlers() {
1138
1139
  const e = [], t = this.select.id;
1139
- t && document.querySelectorAll(`label[for="${t}"]`).forEach((n) => e.push(n));
1140
+ t && document.querySelectorAll(`label[for="${t}"]`).forEach((l) => e.push(l));
1140
1141
  let s = this.select.parentElement;
1141
1142
  for (; s && s !== document.body; ) {
1142
1143
  if (s.tagName === "LABEL") {
@@ -1145,20 +1146,20 @@ class M {
1145
1146
  }
1146
1147
  s = s.parentElement;
1147
1148
  }
1148
- Array.from(new Set(e)).forEach((l) => {
1149
- if (l.__slimSelectLabelHandler)
1149
+ Array.from(new Set(e)).forEach((n) => {
1150
+ if (n.__slimSelectLabelHandler)
1150
1151
  return;
1151
- const n = (a) => {
1152
+ const l = (a) => {
1152
1153
  const o = a.target, h = x(o, this.select.dataset.id);
1153
1154
  a.preventDefault(), !h && this.onLabelClick && this.onLabelClick();
1154
1155
  };
1155
- l.__slimSelectLabelHandler = n, l.addEventListener("click", n, { capture: !0, passive: !1 });
1156
+ n.__slimSelectLabelHandler = l, n.addEventListener("click", l, { capture: !0, passive: !1 });
1156
1157
  });
1157
1158
  }
1158
1159
  // Remove label handlers
1159
1160
  removeLabelHandlers() {
1160
1161
  const e = [], t = this.select.id;
1161
- t && document.querySelectorAll(`label[for="${t}"]`).forEach((n) => e.push(n));
1162
+ t && document.querySelectorAll(`label[for="${t}"]`).forEach((l) => e.push(l));
1162
1163
  let s = this.select.parentElement;
1163
1164
  for (; s && s !== document.body; ) {
1164
1165
  if (s.tagName === "LABEL") {
@@ -1167,9 +1168,9 @@ class M {
1167
1168
  }
1168
1169
  s = s.parentElement;
1169
1170
  }
1170
- Array.from(new Set(e)).forEach((l) => {
1171
- const n = l.__slimSelectLabelHandler;
1172
- n && (l.removeEventListener("click", n, { capture: !0 }), delete l.__slimSelectLabelHandler);
1171
+ Array.from(new Set(e)).forEach((n) => {
1172
+ const l = n.__slimSelectLabelHandler;
1173
+ l && (n.removeEventListener("click", l, { capture: !0 }), delete n.__slimSelectLabelHandler);
1173
1174
  });
1174
1175
  }
1175
1176
  destroy() {
@@ -1279,8 +1280,8 @@ class F {
1279
1280
  afterChange: this.events.afterChange
1280
1281
  };
1281
1282
  this.render = new N(this.settings, this.cssClasses, this.store, i), this.render.renderValues(), this.render.renderOptions(this.store.getData());
1282
- const l = this.selectEl.getAttribute("aria-label"), n = this.selectEl.getAttribute("aria-labelledby");
1283
- l ? this.render.main.main.setAttribute("aria-label", l) : n && this.render.main.main.setAttribute("aria-labelledby", n), this.selectEl.parentNode && this.selectEl.parentNode.insertBefore(this.render.main.main, this.selectEl.nextSibling), window.addEventListener("resize", this.windowResize, !1), this.settings.openPosition === "auto" && window.addEventListener("scroll", this.windowScroll, !1), document.addEventListener("visibilitychange", this.windowVisibilityChange), this.settings.disabled && this.disable(), this.settings.alwaysOpen && this.open(), this.select.setupLabelHandlers(), this.selectEl.slim = this;
1283
+ const n = this.selectEl.getAttribute("aria-label"), l = this.selectEl.getAttribute("aria-labelledby");
1284
+ n ? this.render.main.main.setAttribute("aria-label", n) : l && this.render.main.main.setAttribute("aria-labelledby", l), this.selectEl.parentNode && this.selectEl.parentNode.insertBefore(this.render.main.main, this.selectEl.nextSibling), window.addEventListener("resize", this.windowResize, !1), this.settings.openPosition === "auto" && window.addEventListener("scroll", this.windowScroll, !1), document.addEventListener("visibilitychange", this.windowVisibilityChange), this.settings.disabled && this.disable(), this.settings.alwaysOpen && this.open(), this.select.setupLabelHandlers(), this.selectEl.slim = this;
1284
1285
  }
1285
1286
  // Set to enabled and remove disabled classes
1286
1287
  enable() {
@@ -1311,18 +1312,18 @@ class F {
1311
1312
  setSelected(e, t = !0) {
1312
1313
  const s = this.store.getSelected(), i = this.store.getDataOptions();
1313
1314
  e = Array.isArray(e) ? e : [e];
1314
- const l = [];
1315
+ const n = [];
1315
1316
  for (const a of e) {
1316
1317
  if (i.find((o) => o.id == a)) {
1317
- l.push(a);
1318
+ n.push(a);
1318
1319
  continue;
1319
1320
  }
1320
1321
  for (const o of i.filter((h) => h.value == a))
1321
- l.push(o.id);
1322
+ n.push(o.id);
1322
1323
  }
1323
- this.store.setSelectedBy("id", l);
1324
- const n = this.store.getData();
1325
- this.select.updateOptions(n), this.render.renderValues(), this.render.content.search.input.value !== "" ? this.search(this.render.content.search.input.value) : this.render.renderOptions(n), t && this.events.afterChange && !O(s, this.store.getSelected()) && this.events.afterChange(this.store.getSelectedOptions());
1324
+ this.store.setSelectedBy("id", n);
1325
+ const l = this.store.getData();
1326
+ this.select.updateOptions(l), this.render.renderValues(), this.render.content.search.input.value !== "" ? this.search(this.render.content.search.input.value) : this.render.renderOptions(l), t && this.events.afterChange && !O(s, this.store.getSelected()) && this.events.afterChange(this.store.getSelectedOptions());
1326
1327
  }
1327
1328
  addOption(e) {
1328
1329
  const t = this.store.getSelected();