slim-select 3.0.1 → 3.0.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.
package/dist/vue/index.js CHANGED
@@ -109,7 +109,7 @@ class p {
109
109
  this.id = !e.id || e.id === "" ? y() : e.id, this.value = e.value === void 0 ? e.text || "" : e.value || "", this.text = e.text || "", this.html = e.html || "", this.defaultSelected = e.defaultSelected !== void 0 ? e.defaultSelected : !1, this.selected = e.selected !== void 0 ? e.selected : !1, this.display = e.display !== void 0 ? e.display : !0, this.disabled = e.disabled !== void 0 ? e.disabled : !1, this.mandatory = e.mandatory !== void 0 ? e.mandatory : !1, this.placeholder = e.placeholder !== void 0 ? e.placeholder : !1, this.class = e.class || "", this.style = e.style || "", this.data = e.data || {};
110
110
  }
111
111
  }
112
- class g {
112
+ class m {
113
113
  id;
114
114
  label;
115
115
  selectAll;
@@ -122,7 +122,7 @@ class g {
122
122
  this.options.push(new p(t));
123
123
  }
124
124
  }
125
- class V {
125
+ class B {
126
126
  selectType = "single";
127
127
  // Main data set, never null
128
128
  data = [];
@@ -136,7 +136,7 @@ class V {
136
136
  return new Error("Data must be an array");
137
137
  for (let t of e)
138
138
  if (t)
139
- if (t instanceof g || "label" in t) {
139
+ if (t instanceof m || "label" in t) {
140
140
  if (!("label" in t))
141
141
  return new Error("Optgroup must have a label");
142
142
  if ("options" in t && t.options)
@@ -161,11 +161,11 @@ class V {
161
161
  let t = [];
162
162
  return e.forEach((s) => {
163
163
  if (s) {
164
- if (s instanceof g || "label" in s) {
164
+ if (s instanceof m || "label" in s) {
165
165
  let i = [];
166
166
  "options" in s && s.options && s.options.forEach((l) => {
167
167
  i.push(new p(l));
168
- }), i.length > 0 && t.push(new g(s));
168
+ }), i.length > 0 && t.push(new m(s));
169
169
  }
170
170
  (s instanceof p || "text" in s) && t.push(new p(s));
171
171
  }
@@ -182,7 +182,7 @@ class V {
182
182
  n = !0;
183
183
  break;
184
184
  }
185
- if (o instanceof g) {
185
+ if (o instanceof m) {
186
186
  for (const c of o.options)
187
187
  if (c.id === a.id) {
188
188
  n = !0;
@@ -219,7 +219,7 @@ class V {
219
219
  let s = null, i = !1;
220
220
  const l = [];
221
221
  for (let n of this.data) {
222
- if (n instanceof g)
222
+ if (n instanceof m)
223
223
  for (let o of n.options) {
224
224
  s || (s = o);
225
225
  let c = o[e] || "";
@@ -242,7 +242,7 @@ class V {
242
242
  }
243
243
  getOptgroupByID(e) {
244
244
  for (let t of this.data)
245
- if (t instanceof g && t.id === e)
245
+ if (t instanceof m && t.id === e)
246
246
  return t;
247
247
  return null;
248
248
  }
@@ -256,7 +256,7 @@ class V {
256
256
  getFirstOption() {
257
257
  let e = null;
258
258
  for (let t of this.data)
259
- if (t instanceof g ? e = t.options[0] : t instanceof p && (e = t), e)
259
+ if (t instanceof m ? e = t.options[0] : t instanceof p && (e = t), e)
260
260
  break;
261
261
  return e;
262
262
  }
@@ -269,12 +269,12 @@ class V {
269
269
  filter(e, t) {
270
270
  const s = [];
271
271
  return this.data.forEach((i) => {
272
- if (i instanceof g) {
272
+ if (i instanceof m) {
273
273
  let l = [];
274
274
  if (i.options.forEach((n) => {
275
275
  (!e || e(n)) && (t ? l.push(new p(n)) : s.push(new p(n)));
276
276
  }), l.length > 0) {
277
- let n = new g(i);
277
+ let n = new m(i);
278
278
  n.options = l, s.push(n);
279
279
  }
280
280
  }
@@ -298,7 +298,7 @@ class V {
298
298
  }), t;
299
299
  }
300
300
  }
301
- class B {
301
+ class V {
302
302
  settings;
303
303
  store;
304
304
  callbacks;
@@ -331,7 +331,9 @@ class B {
331
331
  }
332
332
  }
333
333
  close() {
334
- this.main.main.setAttribute("aria-expanded", "false"), this.main.arrow.path.setAttribute("d", this.classes.arrowClose), this.content.main.classList.remove(this.classes.contentOpen), this.content.search.input.setAttribute("aria-hidden", "true"), this.main.main.removeAttribute("aria-activedescendant");
334
+ this.main.main.setAttribute("aria-expanded", "false"), this.main.arrow.path.setAttribute("d", this.classes.arrowClose), this.content.main.classList.remove(this.classes.contentOpen), this.content.search.input.setAttribute("aria-hidden", "true"), this.main.main.removeAttribute("aria-activedescendant"), setTimeout(() => {
335
+ this.main.main.classList.remove(this.classes.dirAbove, this.classes.dirBelow), this.content.main.classList.remove(this.classes.dirAbove, this.classes.dirBelow);
336
+ }, 100);
335
337
  }
336
338
  updateClassStyles() {
337
339
  if (this.main.main.className = "", this.main.main.removeAttribute("style"), this.content.main.className = "", this.content.main.removeAttribute("style"), this.main.main.classList.add(this.classes.main), this.content.main.classList.add(this.classes.content), this.settings.style !== "" && (this.main.main.style.cssText = this.settings.style, this.content.main.style.cssText = this.settings.style), this.settings.class.length)
@@ -379,8 +381,8 @@ class B {
379
381
  if (this.settings.isMultiple)
380
382
  this.callbacks.setSelected([], !1), this.updateDeselectAll();
381
383
  else {
382
- const u = this.store.getFirstOption(), m = u ? u.id : "";
383
- this.callbacks.setSelected(m, !1);
384
+ const u = this.store.getFirstOption(), g = u ? u.id : "";
385
+ this.callbacks.setSelected(g, !1);
384
386
  }
385
387
  this.settings.closeOnSelect && this.callbacks.close(), this.callbacks.afterChange && this.callbacks.afterChange(this.store.getSelectedOptions());
386
388
  }
@@ -484,7 +486,7 @@ class B {
484
486
  if (!(this.settings.minSelected && r.length < this.settings.minSelected) && (this.callbacks.beforeChange && (o = this.callbacks.beforeChange(r, c) === !0), o)) {
485
487
  let d = [];
486
488
  for (const f of r) {
487
- if (f instanceof g)
489
+ if (f instanceof m)
488
490
  for (const u of f.options)
489
491
  u.id && d.push(u.id);
490
492
  f instanceof p && d.push(f.id);
@@ -680,7 +682,7 @@ class B {
680
682
  ));
681
683
  const t = document.createDocumentFragment();
682
684
  for (const s of e) {
683
- if (s instanceof g) {
685
+ if (s instanceof m) {
684
686
  const i = document.createElement("div");
685
687
  i.classList.add(this.classes.optgroup);
686
688
  const l = document.createElement("div");
@@ -692,8 +694,8 @@ class B {
692
694
  const o = document.createElement("div");
693
695
  o.classList.add(this.classes.optgroupSelectAll);
694
696
  let c = !0;
695
- for (const m of s.options)
696
- if (!m.selected) {
697
+ for (const g of s.options)
698
+ if (!g.selected) {
697
699
  c = !1;
698
700
  break;
699
701
  }
@@ -705,8 +707,8 @@ class B {
705
707
  const f = document.createElementNS("http://www.w3.org/2000/svg", "path");
706
708
  f.setAttribute("d", this.classes.optgroupSelectAllBox), d.appendChild(f);
707
709
  const u = document.createElementNS("http://www.w3.org/2000/svg", "path");
708
- u.setAttribute("d", this.classes.optgroupSelectAllCheck), d.appendChild(u), o.addEventListener("click", (m) => {
709
- m.preventDefault(), m.stopPropagation();
710
+ u.setAttribute("d", this.classes.optgroupSelectAllCheck), d.appendChild(u), o.addEventListener("click", (g) => {
711
+ g.preventDefault(), g.stopPropagation();
710
712
  const b = this.store.getSelected();
711
713
  if (c) {
712
714
  const w = b.filter((O) => {
@@ -769,9 +771,9 @@ class B {
769
771
  if (this.settings.isMultiple) {
770
772
  const d = c.some((u) => u.id === a);
771
773
  if (s.shiftKey && this.lastSelectedOption) {
772
- const u = this.store.getDataOptions(), m = u.findIndex((w) => w.id === this.lastSelectedOption.id), b = u.findIndex((w) => w.id === e.id);
773
- if (m >= 0 && b >= 0) {
774
- const w = Math.min(m, b), O = Math.max(m, b), L = u.slice(w, O + 1).filter((x) => !c.find((A) => A.id === x.id));
774
+ const u = this.store.getDataOptions(), g = u.findIndex((w) => w.id === this.lastSelectedOption.id), b = u.findIndex((w) => w.id === e.id);
775
+ if (g >= 0 && b >= 0) {
776
+ const w = Math.min(g, b), O = Math.max(g, b), L = u.slice(w, O + 1).filter((x) => !c.find((A) => A.id === x.id));
775
777
  c.length + L.length <= this.settings.maxSelected ? r = c.concat(L) : r = c;
776
778
  } else
777
779
  r = c;
@@ -801,7 +803,7 @@ class B {
801
803
  const c = o.textContent || "", r = new RegExp("(" + l + ")", "i");
802
804
  if (r.test(c)) {
803
805
  const d = document.createElement("span");
804
- c.split(r).forEach((u, m) => {
806
+ c.split(r).forEach((u, g) => {
805
807
  if (u && r.test(u)) {
806
808
  const b = document.createElement("mark");
807
809
  b.className = s, b.textContent = u, d.appendChild(b);
@@ -1011,7 +1013,7 @@ class I {
1011
1013
  updateOptions(e) {
1012
1014
  this.changeListen(!1), this.select.innerHTML = "";
1013
1015
  for (const t of e)
1014
- t instanceof g && this.select.appendChild(this.createOptgroup(t)), t instanceof p && this.select.appendChild(this.createOption(t));
1016
+ t instanceof m && this.select.appendChild(this.createOptgroup(t)), t instanceof p && this.select.appendChild(this.createOption(t));
1015
1017
  this.select.dispatchEvent(new Event("change", { bubbles: !0 })), this.changeListen(!0);
1016
1018
  }
1017
1019
  createOptgroup(e) {
@@ -1120,7 +1122,7 @@ let F = class {
1120
1122
  this.setData(n);
1121
1123
  };
1122
1124
  const s = e.data ? e.data : this.select.getData();
1123
- this.store = new V(this.settings.isMultiple ? "multiple" : "single", s), e.data && this.select.updateOptions(this.store.getData());
1125
+ this.store = new B(this.settings.isMultiple ? "multiple" : "single", s), e.data && this.select.updateOptions(this.store.getData());
1124
1126
  const i = {
1125
1127
  open: this.open.bind(this),
1126
1128
  close: this.close.bind(this),
@@ -1131,7 +1133,7 @@ let F = class {
1131
1133
  beforeChange: this.events.beforeChange,
1132
1134
  afterChange: this.events.afterChange
1133
1135
  };
1134
- this.render = new B(this.settings, this.cssClasses, this.store, i), this.render.renderValues(), this.render.renderOptions(this.store.getData());
1136
+ this.render = new V(this.settings, this.cssClasses, this.store, i), this.render.renderValues(), this.render.renderOptions(this.store.getData());
1135
1137
  const l = this.selectEl.getAttribute("aria-label"), a = this.selectEl.getAttribute("aria-labelledby");
1136
1138
  l ? this.render.main.main.setAttribute("aria-label", l) : a && this.render.main.main.setAttribute("aria-labelledby", a), 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.selectEl.slim = this;
1137
1139
  }
@@ -1334,7 +1336,7 @@ function q(h, e, t, s, i, l) {
1334
1336
  }
1335
1337
  const z = /* @__PURE__ */ $(R, [["render", q]]);
1336
1338
  export {
1337
- g as Optgroup,
1339
+ m as Optgroup,
1338
1340
  p as Option,
1339
1341
  H as Settings,
1340
1342
  z as default
@@ -1 +1 @@
1
- (function(b,S){typeof exports=="object"&&typeof module<"u"?S(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],S):(b=typeof globalThis<"u"?globalThis:b||self,S(b.SlimSelectVue={},b.Vue))})(this,function(b,S){"use strict";class T{main;placeholder;values;single;max;value;valueText;valueDelete;valueOut;deselect;deselectPath;arrow;arrowClose;arrowOpen;content;contentOpen;dirAbove;dirBelow;search;searchHighlighter;searching;addable;addablePath;list;optgroup;optgroupLabel;optgroupLabelText;optgroupActions;optgroupSelectAll;optgroupSelectAllBox;optgroupSelectAllCheck;optgroupClosable;option;optionDelete;highlighted;mainOpen;close;selected;error;disabled;hide;constructor(e){e||(e={}),this.main=e.main||"ss-main",this.placeholder=e.placeholder||"ss-placeholder",this.values=e.values||"ss-values",this.single=e.single||"ss-single",this.max=e.max||"ss-max",this.value=e.value||"ss-value",this.valueText=e.valueText||"ss-value-text",this.valueDelete=e.valueDelete||"ss-value-delete",this.valueOut=e.valueOut||"ss-value-out",this.deselect=e.deselect||"ss-deselect",this.deselectPath=e.deselectPath||"M10,10 L90,90 M10,90 L90,10",this.arrow=e.arrow||"ss-arrow",this.arrowClose=e.arrowClose||"M10,30 L50,70 L90,30",this.arrowOpen=e.arrowOpen||"M10,70 L50,30 L90,70",this.content=e.content||"ss-content",this.contentOpen=e.contentOpen||"ss-open",this.dirAbove=e.dirAbove||"ss-dir-above",this.dirBelow=e.dirBelow||"ss-dir-below",this.search=e.search||"ss-search",this.searchHighlighter=e.searchHighlighter||"ss-search-highlight",this.searching=e.searching||"ss-searching",this.addable=e.addable||"ss-addable",this.addablePath=e.addablePath||"M50,10 L50,90 M10,50 L90,50",this.list=e.list||"ss-list",this.optgroup=e.optgroup||"ss-optgroup",this.optgroupLabel=e.optgroupLabel||"ss-optgroup-label",this.optgroupLabelText=e.optgroupLabelText||"ss-optgroup-label-text",this.optgroupActions=e.optgroupActions||"ss-optgroup-actions",this.optgroupSelectAll=e.optgroupSelectAll||"ss-selectall",this.optgroupSelectAllBox=e.optgroupSelectAllBox||"M60,10 L10,10 L10,90 L90,90 L90,50",this.optgroupSelectAllCheck=e.optgroupSelectAllCheck||"M30,45 L50,70 L90,10",this.optgroupClosable=e.optgroupClosable||"ss-closable",this.option=e.option||"ss-option",this.optionDelete=e.optionDelete||"M10,10 L90,90 M10,90 L90,10",this.highlighted=e.highlighted||"ss-highlighted",this.mainOpen=e.mainOpen||"ss-open",this.close=e.close||"ss-close",this.selected=e.selected||"ss-selected",this.error=e.error||"ss-error",this.disabled=e.disabled||"ss-disabled",this.hide=e.hide||"ss-hide"}}function L(){return Math.random().toString(36).substring(2,10)}function D(h,e){function t(i,l){return l&&i&&i.classList&&i.classList.contains(l)||l&&i&&i.dataset&&i.dataset.id&&i.dataset.id===e?i:null}function s(i,l){return!i||i===document?null:t(i,l)?i:s(i.parentNode,l)}return t(h,e)||s(h,e)}function y(h,e=50,t=!1){let s;return function(...i){const l=self,a=()=>{s=null,t||h.apply(l,i)},n=t&&!s;clearTimeout(s),s=setTimeout(a,e),n&&h.apply(l,i)}}function x(h,e){return JSON.stringify(h)===JSON.stringify(e)}function k(h){const e=h.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g,t=>"-"+t.toLowerCase());return h[0]===h[0].toUpperCase()?e.substring(1):e}class p{id;value;text;html;defaultSelected;selected;display;disabled;placeholder;class;style;data;mandatory;constructor(e){this.id=!e.id||e.id===""?L():e.id,this.value=e.value===void 0?e.text||"":e.value||"",this.text=e.text||"",this.html=e.html||"",this.defaultSelected=e.defaultSelected!==void 0?e.defaultSelected:!1,this.selected=e.selected!==void 0?e.selected:!1,this.display=e.display!==void 0?e.display:!0,this.disabled=e.disabled!==void 0?e.disabled:!1,this.mandatory=e.mandatory!==void 0?e.mandatory:!1,this.placeholder=e.placeholder!==void 0?e.placeholder:!1,this.class=e.class||"",this.style=e.style||"",this.data=e.data||{}}}class g{id;label;selectAll;selectAllText;closable;options;constructor(e){if(this.id=!e.id||e.id===""?L():e.id,this.label=e.label||"",this.selectAll=e.selectAll===void 0?!1:e.selectAll,this.selectAllText=e.selectAllText||"Select All",this.closable=e.closable||"off",this.options=[],e.options)for(const t of e.options)this.options.push(new p(t))}}class N{selectType="single";data=[];selectedOrder=[];constructor(e,t){this.selectType=e,this.setData(t)}validateDataArray(e){if(!Array.isArray(e))return new Error("Data must be an array");for(let t of e)if(t)if(t instanceof g||"label"in t){if(!("label"in t))return new Error("Optgroup must have a label");if("options"in t&&t.options)for(let s of t.options){const i=this.validateOption(s);if(i)return i}}else if(t instanceof p||"text"in t){const s=this.validateOption(t);if(s)return s}else return new Error("Data object must be a valid optgroup or option");return null}validateOption(e){return"text"in e?null:new Error("Option must have a text")}partialToFullData(e){let t=[];return e.forEach(s=>{if(s){if(s instanceof g||"label"in s){let i=[];"options"in s&&s.options&&s.options.forEach(l=>{i.push(new p(l))}),i.length>0&&t.push(new g(s))}(s instanceof p||"text"in s)&&t.push(new p(s))}}),t}setData(e,t=!1){const s=this.partialToFullData(e);if(t){const i=this.getSelectedOptions(),l=[];i.forEach(a=>{let n=!1;for(const o of s){if(o instanceof p&&o.id===a.id){n=!0;break}if(o instanceof g){for(const c of o.options)if(c.id===a.id){n=!0;break}}}n||l.push(a)}),this.data=[...l,...s]}else this.data=s;this.selectType==="single"&&this.setSelectedBy("id",this.getSelected())}getData(){return this.filter(null,!0)}getDataOptions(){return this.filter(null,!1)}addOption(e,t=!1){if(t){let s=[new p(e)];this.setData(s.concat(this.getData()))}else this.setData(this.getData().concat(new p(e)))}setSelectedBy(e,t){let s=null,i=!1;const l=[];for(let n of this.data){if(n instanceof g)for(let o of n.options){s||(s=o);let c=o[e]||"";o.selected=i?!1:t.includes(c),o.selected&&(l.push(o),this.selectType==="single"&&(i=!0))}n instanceof p&&(s||(s=n),n.selected=i?!1:t.includes(n[e]),n.selected&&(l.push(n),this.selectType==="single"&&(i=!0)))}this.selectType==="single"&&s&&!i&&(s.selected=!0,l.push(s));const a=t.map(n=>l.find(o=>o[e]===n)?.id||"");this.selectedOrder=a}getSelected(){return this.getSelectedOptions().map(e=>e.id)}getSelectedValues(){return this.getSelectedOptions().map(e=>e.value)}getSelectedOptions(){return this.filter(e=>e.selected,!1)}getOptgroupByID(e){for(let t of this.data)if(t instanceof g&&t.id===e)return t;return null}getOptionByID(e){let t=this.filter(s=>s.id===e,!1);return t.length?t[0]:null}getSelectType(){return this.selectType}getFirstOption(){let e=null;for(let t of this.data)if(t instanceof g?e=t.options[0]:t instanceof p&&(e=t),e)break;return e}search(e,t){return e=e.trim(),e===""?this.getData():this.filter(s=>t(s,e),!0)}filter(e,t){const s=[];return this.data.forEach(i=>{if(i instanceof g){let l=[];if(i.options.forEach(n=>{(!e||e(n))&&(t?l.push(new p(n)):s.push(new p(n)))}),l.length>0){let n=new g(i);n.options=l,s.push(n)}}i instanceof p&&(!e||e(i))&&s.push(new p(i))}),s}selectedOrderOptions(e){const t=[];return this.selectedOrder.forEach(s=>{const i=e.find(l=>l.id===s);i&&t.push(i)}),e.forEach(s=>{let i=!1;t.forEach(l=>{if(s.id===l.id){i=!0;return}}),i||t.push(s)}),t}}class M{settings;store;callbacks;lastSelectedOption;main;content;classes;constructor(e,t,s,i){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.contentLocation&&this.settings.contentLocation.appendChild(this.content.main)}enable(){this.main.main.classList.remove(this.classes.disabled),this.main.main.setAttribute("aria-disabled","false"),this.content.search.input.disabled=!1}disable(){this.main.main.classList.add(this.classes.disabled),this.main.main.setAttribute("aria-disabled","true"),this.content.search.input.disabled=!0}open(){this.main.arrow.path.setAttribute("d",this.classes.arrowOpen),this.main.main.setAttribute("aria-expanded","true");const t=this.settings.openPosition==="up"?this.classes.dirAbove:this.classes.dirBelow;this.main.main.classList.add(t),this.content.main.classList.add(t),this.content.main.classList.add(this.classes.contentOpen),this.content.search.input.removeAttribute("aria-hidden"),this.moveContent();const s=this.store.getSelectedOptions();if(s.length){const i=s[s.length-1].id,l=this.content.list.querySelector('[data-id="'+i+'"]');l&&this.ensureElementInView(this.content.list,l)}}close(){this.main.main.setAttribute("aria-expanded","false"),this.main.arrow.path.setAttribute("d",this.classes.arrowClose),this.content.main.classList.remove(this.classes.contentOpen),this.content.search.input.setAttribute("aria-hidden","true"),this.main.main.removeAttribute("aria-activedescendant")}updateClassStyles(){if(this.main.main.className="",this.main.main.removeAttribute("style"),this.content.main.className="",this.content.main.removeAttribute("style"),this.main.main.classList.add(this.classes.main),this.content.main.classList.add(this.classes.content),this.settings.style!==""&&(this.main.main.style.cssText=this.settings.style,this.content.main.style.cssText=this.settings.style),this.settings.class.length)for(const e of this.settings.class)e.trim()!==""&&(this.main.main.classList.add(e.trim()),this.content.main.classList.add(e.trim()));(this.settings.contentPosition==="relative"||this.settings.contentPosition==="fixed")&&this.content.main.classList.add("ss-"+this.settings.contentPosition)}updateAriaAttributes(){const e=this.content.list.id;this.main.main.role="combobox",this.main.main.setAttribute("aria-haspopup","listbox"),this.main.main.setAttribute("aria-controls",e),this.main.main.setAttribute("aria-expanded","false"),this.content.list.setAttribute("role","listbox"),this.content.list.setAttribute("aria-label",this.settings.ariaLabel+" listbox"),this.settings.isMultiple&&this.content.list.setAttribute("aria-multiselectable","true"),this.content.search.input.setAttribute("aria-controls",e)}mainDiv(){const e=document.createElement("div");e.dataset.id=this.settings.id,e.setAttribute("aria-label",this.settings.ariaLabel),e.tabIndex=0,e.onkeydown=c=>{switch(c.key){case"ArrowUp":case"ArrowDown":return this.callbacks.open(),c.key==="ArrowDown"?this.highlight("down"):this.highlight("up"),!1;case"Tab":return this.callbacks.close(),!0;case"Enter":case" ":this.callbacks.open();const r=this.content.list.querySelector("."+this.classes.highlighted);return r&&r.click(),!1;case"Escape":return this.callbacks.close(),!1}return c.key.length===1&&this.callbacks.open(),!0},e.onclick=c=>{this.settings.disabled||(this.settings.isOpen?this.callbacks.close():this.callbacks.open())};const t=document.createElement("div");t.classList.add(this.classes.values),e.appendChild(t);const s=document.createElement("div");s.classList.add(this.classes.deselect);const i=this.store?.getSelectedOptions();!this.settings.allowDeselect||this.settings.isMultiple&&i&&i.length<=0?s.classList.add(this.classes.hide):s.classList.remove(this.classes.hide),s.onclick=c=>{if(c.stopPropagation(),this.settings.disabled)return;let r=!0;const d=this.store.getSelectedOptions(),f=[];if(this.callbacks.beforeChange&&(r=this.callbacks.beforeChange(f,d)===!0),r){if(this.settings.isMultiple)this.callbacks.setSelected([],!1),this.updateDeselectAll();else{const u=this.store.getFirstOption(),m=u?u.id:"";this.callbacks.setSelected(m,!1)}this.settings.closeOnSelect&&this.callbacks.close(),this.callbacks.afterChange&&this.callbacks.afterChange(this.store.getSelectedOptions())}};const l=document.createElementNS("http://www.w3.org/2000/svg","svg");l.setAttribute("viewBox","0 0 100 100");const a=document.createElementNS("http://www.w3.org/2000/svg","path");a.setAttribute("d",this.classes.deselectPath),l.appendChild(a),s.appendChild(l),e.appendChild(s);const n=document.createElementNS("http://www.w3.org/2000/svg","svg");n.classList.add(this.classes.arrow),n.setAttribute("viewBox","0 0 100 100");const o=document.createElementNS("http://www.w3.org/2000/svg","path");return o.setAttribute("d",this.classes.arrowClose),this.settings.alwaysOpen&&n.classList.add(this.classes.hide),n.appendChild(o),e.appendChild(n),{main:e,values:t,deselect:{main:s,svg:l,path:a},arrow:{main:n,path:o}}}mainFocus(e){e!=="click"&&this.main.main.focus({preventScroll:!0})}placeholder(){const e=this.store.filter(i=>i.placeholder,!1);let t=this.settings.placeholderText;e.length&&(e[0].html!==""?t=e[0].html:e[0].text!==""&&(t=e[0].text));const s=document.createElement("div");return s.classList.add(this.classes.placeholder),s.innerHTML=t,s}renderValues(){if(!this.settings.isMultiple){this.renderSingleValue();return}this.renderMultipleValues(),this.updateDeselectAll()}renderSingleValue(){const e=this.store.filter(s=>s.selected&&!s.placeholder,!1),t=e.length>0?e[0]:null;if(!t)this.main.values.innerHTML=this.placeholder().outerHTML;else{const s=document.createElement("div");s.classList.add(this.classes.single),t.html?s.innerHTML=t.html:s.innerText=t.text,this.main.values.innerHTML=s.outerHTML}!this.settings.allowDeselect||!e.length?this.main.deselect.main.classList.add(this.classes.hide):this.main.deselect.main.classList.remove(this.classes.hide)}renderMultipleValues(){let e=this.main.values.childNodes,t=this.store.filter(i=>i.selected&&i.display,!1);if(t.length===0){this.main.values.innerHTML=this.placeholder().outerHTML;return}else{const i=this.main.values.querySelector("."+this.classes.placeholder);i&&i.remove()}if(t.length>this.settings.maxValuesShown){const i=document.createElement("div");i.classList.add(this.classes.max),i.textContent=this.settings.maxValuesMessage.replace("{number}",t.length.toString()),this.main.values.innerHTML=i.outerHTML;return}else{const i=this.main.values.querySelector("."+this.classes.max);i&&i.remove()}this.settings.keepOrder&&(t=this.store.selectedOrderOptions(t));let s=[];for(let i=0;i<e.length;i++){const l=e[i],a=l.getAttribute("data-id");a&&(t.filter(o=>o.id===a,!1).length||s.push(l))}for(const i of s)i.classList.add(this.classes.valueOut),setTimeout(()=>{this.main.values.hasChildNodes()&&this.main.values.contains(i)&&this.main.values.removeChild(i)},100);e=this.main.values.childNodes;for(let i=0;i<t.length;i++){let l=!0;for(let a=0;a<e.length;a++)t[i].id===String(e[a].dataset.id)&&(l=!1);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])))}}multipleValue(e){const t=document.createElement("div");t.classList.add(this.classes.value),t.dataset.id=e.id;const s=document.createElement("div");if(s.classList.add(this.classes.valueText),s.textContent=e.text,t.appendChild(s),!e.mandatory){const i=document.createElement("div");i.classList.add(this.classes.valueDelete),i.setAttribute("tabindex","0"),i.onclick=n=>{if(n.preventDefault(),n.stopPropagation(),this.settings.disabled)return;let o=!0;const c=this.store.getSelectedOptions(),r=c.filter(d=>d.selected&&d.id!==e.id,!0);if(!(this.settings.minSelected&&r.length<this.settings.minSelected)&&(this.callbacks.beforeChange&&(o=this.callbacks.beforeChange(r,c)===!0),o)){let d=[];for(const f of r){if(f instanceof g)for(const u of f.options)u.id&&d.push(u.id);f instanceof p&&d.push(f.id)}this.callbacks.setSelected(d,!1),this.settings.closeOnSelect&&this.callbacks.close(),this.callbacks.afterChange&&this.callbacks.afterChange(r),this.updateDeselectAll()}};const l=document.createElementNS("http://www.w3.org/2000/svg","svg");l.setAttribute("viewBox","0 0 100 100");const a=document.createElementNS("http://www.w3.org/2000/svg","path");a.setAttribute("d",this.classes.optionDelete),l.appendChild(a),i.appendChild(l),t.appendChild(i),i.onkeydown=n=>{n.key==="Enter"&&i.click()}}return t}contentDiv(){const e=document.createElement("div");e.dataset.id=this.settings.id;const t=this.searchDiv();e.appendChild(t.main);const s=this.listDiv();return e.appendChild(s),{main:e,search:t,list:s}}moveContent(){if(this.settings.contentPosition==="relative"){this.moveContentBelow();return}if(this.settings.openPosition==="down"){this.moveContentBelow();return}else if(this.settings.openPosition==="up"){this.moveContentAbove();return}this.putContent()==="up"?this.moveContentAbove():this.moveContentBelow()}searchDiv(){const e=document.createElement("div"),t=document.createElement("input"),s=document.createElement("div");e.classList.add(this.classes.search);const i={main:e,input:t};if(this.settings.showSearch||(e.classList.add(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=y(l=>{this.callbacks.search(l.target.value)},100),t.onkeydown=l=>{switch(l.key){case"ArrowUp":case"ArrowDown":return l.key==="ArrowDown"?this.highlight("down"):this.highlight("up"),!1;case"Tab":return this.callbacks.close(),!0;case"Escape":return this.callbacks.close(),!1;case" ":const a=this.content.list.querySelector("."+this.classes.highlighted);return a?(a.click(),!1):!0;case"Enter":const n=this.content.list.querySelector("."+this.classes.highlighted);return n?(n.click(),!1):this.callbacks.addable?(s.click(),!1):!0}return!0},e.appendChild(t),this.callbacks.addable){s.classList.add(this.classes.addable);const l=document.createElementNS("http://www.w3.org/2000/svg","svg");l.setAttribute("viewBox","0 0 100 100");const a=document.createElementNS("http://www.w3.org/2000/svg","path");a.setAttribute("d",this.classes.addablePath),l.appendChild(a),s.appendChild(l),s.onclick=n=>{if(n.preventDefault(),n.stopPropagation(),!this.callbacks.addable)return;const o=this.content.search.input.value.trim();if(o===""){this.content.search.input.focus();return}const c=d=>{let f=new p(d);if(this.callbacks.addOption(f),this.settings.isMultiple){let u=this.store.getSelected();u.push(f.id),this.callbacks.setSelected(u,!0)}else this.callbacks.setSelected([f.id],!0);this.callbacks.search(""),this.settings.closeOnSelect&&setTimeout(()=>{this.callbacks.close()},100)},r=this.callbacks.addable(o);r===!1||r===void 0||r===null||(r instanceof Promise?r.then(d=>{typeof d=="string"?c({text:d,value:d}):r instanceof Error?this.renderError(r.message):c(d)}):typeof r=="string"?c({text:r,value:r}):r instanceof Error?this.renderError(r.message):c(r))},e.appendChild(s),i.addable={main:s,svg:l,path:a}}return i}searchFocus(){this.content.search.input.focus()}clearSearch(){this.content.search.input.value=""}getOptions(e=!1,t=!1,s=!1){let i="."+this.classes.option;return e&&(i+=":not(."+this.classes.placeholder+")"),t&&(i+=":not(."+this.classes.disabled+")"),s&&(i+=":not(."+this.classes.hide+")"),Array.from(this.content.list.querySelectorAll(i))}highlight(e){const t=this.getOptions(!0,!0,!0);if(t.length===0)return;if(t.length===1&&!t[0].classList.contains(this.classes.highlighted)){t[0].classList.add(this.classes.highlighted);return}let s=!1;for(const l of t)l.classList.contains(this.classes.highlighted)&&(s=!0);if(!s){for(const l of t)if(l.classList.contains(this.classes.selected)){l.classList.add(this.classes.highlighted);break}}for(let l=0;l<t.length;l++)if(t[l].classList.contains(this.classes.highlighted)){const a=t[l];a.classList.remove(this.classes.highlighted);const n=a.parentElement;if(n&&n.classList.contains(this.classes.mainOpen)){const r=n.querySelector("."+this.classes.optgroupLabel);r&&r.click()}let o=t[e==="down"?l+1<t.length?l+1:0:l-1>=0?l-1:t.length-1];o.classList.add(this.classes.highlighted),this.ensureElementInView(this.content.list,o),o.id&&this.main.main.setAttribute("aria-activedescendant",o.id);const c=o.parentElement;if(c&&c.classList.contains(this.classes.close)){const r=c.querySelector("."+this.classes.optgroupLabel);r&&r.click()}return}const i=t[e==="down"?0:t.length-1];i.classList.add(this.classes.highlighted),i.id&&this.main.main.setAttribute("aria-activedescendant",i.id),this.ensureElementInView(this.content.list,i)}listDiv(){const e=document.createElement("div");e.classList.add(this.classes.list);const t=this.settings.id+"-list";return e.id=t,e.dataset.id=t,e}renderError(e){this.content.list.innerHTML="";const t=document.createElement("div");t.classList.add(this.classes.error),t.textContent=e,this.content.list.appendChild(t)}renderSearching(){this.content.list.innerHTML="";const e=document.createElement("div");e.classList.add(this.classes.searching),e.textContent=this.settings.searchingText,this.content.list.appendChild(e)}renderOptions(e){if(this.content.list.innerHTML="",e.length===0){const s=document.createElement("div");s.classList.add(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);return}this.settings.allowDeselect&&!this.settings.isMultiple&&(this.store.filter(i=>i.placeholder,!1).length||this.store.addOption(new p({text:"",value:"",selected:!1,placeholder:!0}),!0));const t=document.createDocumentFragment();for(const s of e){if(s instanceof g){const i=document.createElement("div");i.classList.add(this.classes.optgroup);const l=document.createElement("div");l.classList.add(this.classes.optgroupLabel),i.appendChild(l);const a=document.createElement("div");a.classList.add(this.classes.optgroupLabelText),a.textContent=s.label,l.appendChild(a);const n=document.createElement("div");if(n.classList.add(this.classes.optgroupActions),l.appendChild(n),this.settings.isMultiple&&s.selectAll){const o=document.createElement("div");o.classList.add(this.classes.optgroupSelectAll);let c=!0;for(const m of s.options)if(!m.selected){c=!1;break}c&&o.classList.add(this.classes.selected);const r=document.createElement("span");r.textContent=s.selectAllText,o.appendChild(r);const d=document.createElementNS("http://www.w3.org/2000/svg","svg");d.setAttribute("viewBox","0 0 100 100"),o.appendChild(d);const f=document.createElementNS("http://www.w3.org/2000/svg","path");f.setAttribute("d",this.classes.optgroupSelectAllBox),d.appendChild(f);const u=document.createElementNS("http://www.w3.org/2000/svg","path");u.setAttribute("d",this.classes.optgroupSelectAllCheck),d.appendChild(u),o.addEventListener("click",m=>{m.preventDefault(),m.stopPropagation();const v=this.store.getSelected();if(c){const O=v.filter(C=>{for(const w of s.options)if(C===w.id)return!1;return!0});this.callbacks.setSelected(O,!0);return}else{let O=s.options.map(w=>w.id).filter(w=>w!==void 0);const C=v.concat(O);for(const w of s.options)w.id&&!this.store.getOptionByID(w.id)&&this.callbacks.addOption(new p(w));this.callbacks.setSelected(C,!0);return}}),n.appendChild(o)}if(s.closable!=="off"){const o=document.createElement("div");o.classList.add(this.classes.optgroupClosable);const c=document.createElementNS("http://www.w3.org/2000/svg","svg");c.setAttribute("viewBox","0 0 100 100"),c.classList.add(this.classes.arrow),o.appendChild(c);const r=document.createElementNS("http://www.w3.org/2000/svg","path");c.appendChild(r),s.options.some(d=>d.selected)||this.content.search.input.value.trim()!==""?(o.classList.add(this.classes.mainOpen),r.setAttribute("d",this.classes.arrowOpen)):s.closable==="open"?(i.classList.add(this.classes.mainOpen),r.setAttribute("d",this.classes.arrowOpen)):s.closable==="close"&&(i.classList.add(this.classes.close),r.setAttribute("d",this.classes.arrowClose)),l.addEventListener("click",d=>{d.preventDefault(),d.stopPropagation(),i.classList.contains(this.classes.close)?(i.classList.remove(this.classes.close),i.classList.add(this.classes.mainOpen),r.setAttribute("d",this.classes.arrowOpen)):(i.classList.remove(this.classes.mainOpen),i.classList.add(this.classes.close),r.setAttribute("d",this.classes.arrowClose))}),n.appendChild(o)}i.appendChild(l);for(const o of s.options)i.appendChild(this.option(new p(o))),t.appendChild(i)}s instanceof p&&t.appendChild(this.option(s))}this.content.list.appendChild(t)}option(e){if(e.placeholder){const s=document.createElement("div");return s.classList.add(this.classes.option),s.classList.add(this.classes.hide),s}const t=document.createElement("div");return t.dataset.id=e.id,t.id=this.settings.id+"-"+e.id,t.classList.add(this.classes.option),t.setAttribute("role","option"),e.class&&e.class.split(" ").forEach(s=>{t.classList.add(s)}),e.style&&(t.style.cssText=e.style),this.settings.searchHighlight&&this.content.search.input.value.trim()!==""?t.innerHTML=this.highlightText(e.html!==""?e.html:e.text,this.content.search.input.value,this.classes.searchHighlighter):e.html!==""?t.innerHTML=e.html:t.textContent=e.text,this.settings.showOptionTooltips&&t.textContent&&t.setAttribute("title",t.textContent),e.display||t.classList.add(this.classes.hide),e.disabled&&t.classList.add(this.classes.disabled),e.selected&&this.settings.hideSelected&&t.classList.add(this.classes.hide),e.selected?(t.classList.add(this.classes.selected),t.setAttribute("aria-selected","true"),this.main.main.setAttribute("aria-activedescendant",t.id)):(t.classList.remove(this.classes.selected),t.setAttribute("aria-selected","false")),t.addEventListener("click",s=>{s.preventDefault(),s.stopPropagation();const i=this.store.getSelected(),l=s.currentTarget,a=String(l.dataset.id),n=s.ctrlKey||s.metaKey;if(e.disabled||!this.settings.isMultiple&&e.selected&&!this.settings.allowDeselect||this.settings.isMultiple&&this.settings.maxSelected<=i.length&&!e.selected||this.settings.isMultiple&&this.settings.minSelected>=i.length&&e.selected&&!n)return;let o=!1;const c=this.store.getSelectedOptions();let r=[];if(this.settings.isMultiple){const d=c.some(u=>u.id===a);if(s.shiftKey&&this.lastSelectedOption){const u=this.store.getDataOptions(),m=u.findIndex(O=>O.id===this.lastSelectedOption.id),v=u.findIndex(O=>O.id===e.id);if(m>=0&&v>=0){const O=Math.min(m,v),C=Math.max(m,v),E=u.slice(O,C+1).filter($=>!c.find(U=>U.id===$.id));c.length+E.length<=this.settings.maxSelected?r=c.concat(E):r=c}else r=c}else n?(d?r=c.filter(u=>u.id!==a):r=c.concat(e),this.lastSelectedOption=e):(d?r=c.filter(u=>u.id!==a):r=c.concat(e),this.lastSelectedOption=e)}if(this.settings.isMultiple||(e.selected?r=[]:r=[e]),this.callbacks.beforeChange||(o=!0),this.callbacks.beforeChange&&(this.callbacks.beforeChange(r,c)===!1?o=!1:o=!0),o){this.store.getOptionByID(a)||this.callbacks.addOption(e),this.callbacks.setSelected(r.map(u=>u.id),!1);const d=s.ctrlKey||s.metaKey||s.shiftKey;this.settings.closeOnSelect&&!(this.settings.isMultiple&&d)&&this.callbacks.close(),this.callbacks.afterChange&&this.callbacks.afterChange(r)}}),t}destroy(){this.main.main.remove(),this.content.main.remove()}highlightText(e,t,s){const i=t.trim();if(i==="")return e;const l=i.replace(/[.*+?^${}()|[\]\\]/g,"\\$&"),a=document.createElement("div");a.innerHTML=e;const n=o=>{if(o.nodeType===Node.TEXT_NODE){const c=o.textContent||"",r=new RegExp("("+l+")","i");if(r.test(c)){const d=document.createElement("span");c.split(r).forEach((u,m)=>{if(u&&r.test(u)){const v=document.createElement("mark");v.className=s,v.textContent=u,d.appendChild(v)}else u&&d.appendChild(document.createTextNode(u))}),o.parentNode?.replaceChild(d,o)}}else o.nodeType===Node.ELEMENT_NODE&&Array.from(o.childNodes).forEach(c=>n(c))};return Array.from(a.childNodes).forEach(o=>n(o)),a.innerHTML}moveContentAbove(){const e=this.main.main.offsetHeight,t=this.content.main.offsetHeight;this.main.main.classList.remove(this.classes.dirBelow),this.main.main.classList.add(this.classes.dirAbove),this.content.main.classList.remove(this.classes.dirBelow),this.content.main.classList.add(this.classes.dirAbove);const s=this.main.main.getBoundingClientRect();this.content.main.style.margin="-"+(e+t-1)+"px 0px 0px 0px",this.content.main.style.top=s.top+s.height+(this.settings.contentPosition==="fixed"?0:window.scrollY)+"px",this.content.main.style.left=s.left+(this.settings.contentPosition==="fixed"?0:window.scrollX)+"px",this.content.main.style.width=s.width+"px"}moveContentBelow(){this.main.main.classList.remove(this.classes.dirAbove),this.main.main.classList.add(this.classes.dirBelow),this.content.main.classList.remove(this.classes.dirAbove),this.content.main.classList.add(this.classes.dirBelow);const e=this.main.main.getBoundingClientRect();this.content.main.style.margin="-1px 0px 0px 0px",this.settings.contentPosition!=="relative"&&(this.content.main.style.top=e.top+e.height+(this.settings.contentPosition==="fixed"?0:window.scrollY)+"px",this.content.main.style.left=e.left+(this.settings.contentPosition==="fixed"?0:window.scrollX)+"px",this.content.main.style.width=e.width+"px")}ensureElementInView(e,t){const s=e.scrollTop+e.offsetTop,i=s+e.clientHeight,l=t.offsetTop,a=l+t.clientHeight;l<s?e.scrollTop-=s-l:a>i&&(e.scrollTop+=a-i)}putContent(){const e=this.main.main.offsetHeight,t=this.main.main.getBoundingClientRect(),s=this.content.main.offsetHeight;return window.innerHeight-(t.top+e)<=s&&t.top>s?"up":"down"}updateDeselectAll(){if(!this.store||!this.settings)return;const e=this.store.getSelectedOptions(),t=e&&e.length>0,s=this.settings.isMultiple,i=this.settings.allowDeselect,l=this.main.deselect.main,a=this.classes.hide;i&&!(s&&!t)?l.classList.remove(a):l.classList.add(a)}}class P{select;onValueChange;onClassChange;onDisabledChange;onOptionsChange;listen=!1;observer=null;constructor(e){this.select=e,this.valueChange=this.valueChange.bind(this),this.select.addEventListener("change",this.valueChange,{passive:!0}),this.observer=new MutationObserver(this.observeCall.bind(this)),this.changeListen(!0)}enable(){this.select.disabled=!1}disable(){this.select.disabled=!0}hideUI(){this.select.tabIndex=-1,this.select.style.position="absolute",this.select.style.width="1px",this.select.style.height="1px",this.select.style.opacity="0",this.select.style.overflow="hidden",this.select.style.pointerEvents="none",this.select.style.margin="0",this.select.style.padding="0",this.select.style.borderWidth="0",this.select.style.clip="rect(0 0 0 0)",this.select.setAttribute("aria-hidden","true")}showUI(){this.select.removeAttribute("tabindex"),this.select.style.position="",this.select.style.width="",this.select.style.height="",this.select.style.opacity="",this.select.style.overflow="",this.select.style.pointerEvents="",this.select.style.margin="",this.select.style.padding="",this.select.style.borderWidth="",this.select.style.clip="",this.select.removeAttribute("aria-hidden")}changeListen(e){this.listen=e,e&&this.observer&&this.observer.observe(this.select,{subtree:!0,childList:!0,attributes:!0}),e||this.observer&&this.observer.disconnect()}valueChange(e){return this.listen&&this.onValueChange&&this.onValueChange(this.getSelectedOptions()),!0}observeCall(e){if(!this.listen)return;let t=!1,s=!1,i=!1;for(const l of e){if(l.target===this.select&&(l.attributeName==="disabled"&&(s=!0),l.attributeName==="class"&&(t=!0),l.type==="childList")){for(const a of Array.from(l.addedNodes))if(a.nodeName==="OPTION"&&a.value===this.select.value){this.select.dispatchEvent(new Event("change"));break}i=!0}(l.target.nodeName==="OPTGROUP"||l.target.nodeName==="OPTION")&&(i=!0)}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&&(this.changeListen(!1),this.onOptionsChange(this.getData()),this.changeListen(!0))}getData(){let e=[];const t=this.select.childNodes;for(const s of t)s.nodeName==="OPTGROUP"&&e.push(this.getDataFromOptgroup(s)),s.nodeName==="OPTION"&&e.push(this.getDataFromOption(s));return e}getDataFromOptgroup(e){let t={id:e.id,label:e.label,selectAll:e.dataset?e.dataset.selectall==="true":!1,selectAllText:e.dataset?e.dataset.selectalltext:"Select all",closable:e.dataset?e.dataset.closable:"off",options:[]};const s=e.childNodes;for(const i of s)i.nodeName==="OPTION"&&t.options.push(this.getDataFromOption(i));return t}getDataFromOption(e){return{id:e.id,value:e.value,text:e.text,html:e.dataset&&e.dataset.html?e.dataset.html:"",defaultSelected:e.defaultSelected,selected:e.selected,display:e.style.display!=="none",disabled:e.disabled,mandatory:e.dataset?e.dataset.mandatory==="true":!1,placeholder:e.dataset.placeholder==="true",class:e.className,style:e.style.cssText,data:e.dataset}}getSelectedOptions(){let e=[];const t=this.select.childNodes;for(const s of t){if(s.nodeName==="OPTGROUP"){const i=s.childNodes;for(const l of i)if(l.nodeName==="OPTION"){const a=l;a.selected&&e.push(this.getDataFromOption(a))}}if(s.nodeName==="OPTION"){const i=s;i.selected&&e.push(this.getDataFromOption(i))}}return e}getSelectedValues(){return this.getSelectedOptions().map(e=>e.value)}setSelected(e){this.changeListen(!1);const t=this.select.childNodes;for(const s of t){if(s.nodeName==="OPTGROUP"){const l=s.childNodes;for(const a of l)if(a.nodeName==="OPTION"){const n=a;n.selected=e.includes(n.id)}}if(s.nodeName==="OPTION"){const i=s;i.selected=e.includes(i.id)}}this.changeListen(!0)}setSelectedByValue(e){this.changeListen(!1);const t=this.select.childNodes;for(const s of t){if(s.nodeName==="OPTGROUP"){const l=s.childNodes;for(const a of l)if(a.nodeName==="OPTION"){const n=a;n.selected=e.includes(n.value)}}if(s.nodeName==="OPTION"){const i=s;i.selected=e.includes(i.value)}}this.changeListen(!0)}updateSelect(e,t,s){this.changeListen(!1),e&&(this.select.dataset.id=e),t&&(this.select.style.cssText=t),s&&(this.select.className="",s.forEach(i=>{i.trim()!==""&&this.select.classList.add(i.trim())})),this.changeListen(!0)}updateOptions(e){this.changeListen(!1),this.select.innerHTML="";for(const t of e)t instanceof g&&this.select.appendChild(this.createOptgroup(t)),t instanceof p&&this.select.appendChild(this.createOption(t));this.select.dispatchEvent(new Event("change",{bubbles:!0})),this.changeListen(!0)}createOptgroup(e){const t=document.createElement("optgroup");if(t.id=e.id,t.label=e.label,e.selectAll&&(t.dataset.selectAll="true"),e.closable!=="off"&&(t.dataset.closable=e.closable),e.options)for(const s of e.options)t.appendChild(this.createOption(s));return t}createOption(e){const t=document.createElement("option");return t.id=e.id,t.value=e.value,t.textContent=e.text,e.html!==""&&t.setAttribute("data-html",e.html),t.defaultSelected=e.defaultSelected,t.selected=e.selected,e.disabled&&(t.disabled=!0),e.display||(t.style.display="none"),e.placeholder&&t.setAttribute("data-placeholder","true"),e.mandatory&&t.setAttribute("data-mandatory","true"),e.class&&e.class.split(" ").forEach(s=>{t.classList.add(s)}),e.data&&typeof e.data=="object"&&Object.keys(e.data).forEach(s=>{t.setAttribute("data-"+k(s),e.data[s])}),t}destroy(){this.changeListen(!1),this.select.removeEventListener("change",this.valueChange),this.observer&&(this.observer.disconnect(),this.observer=null),delete this.select.dataset.id,this.showUI()}}class A{id="";style="";class=[];isMultiple=!1;isOpen=!1;isFullOpen=!1;intervalMove=null;disabled;alwaysOpen;showSearch;focusSearch;ariaLabel;searchPlaceholder;searchText;searchingText;searchHighlight;closeOnSelect;contentLocation;contentPosition;openPosition;placeholderText;allowDeselect;hideSelected;keepOrder;showOptionTooltips;minSelected;maxSelected;timeoutDelay;maxValuesShown;maxValuesMessage;addableText;constructor(e){e||(e={}),this.id="ss-"+L(),this.style=e.style||"",this.class=e.class||[],this.disabled=e.disabled!==void 0?e.disabled:!1,this.alwaysOpen=e.alwaysOpen!==void 0?e.alwaysOpen:!1,this.showSearch=e.showSearch!==void 0?e.showSearch:!0,this.focusSearch=e.focusSearch!==void 0?e.focusSearch:!0,this.ariaLabel=e.ariaLabel||"Combobox",this.searchPlaceholder=e.searchPlaceholder||"Search",this.searchText=e.searchText||"No Results",this.searchingText=e.searchingText||"Searching...",this.searchHighlight=e.searchHighlight!==void 0?e.searchHighlight:!1,this.closeOnSelect=e.closeOnSelect!==void 0?e.closeOnSelect:!0,this.contentLocation=e.contentLocation||document.body,this.contentPosition=e.contentPosition||"absolute",this.openPosition=e.openPosition||"auto",this.placeholderText=e.placeholderText!==void 0?e.placeholderText:"Select Value",this.allowDeselect=e.allowDeselect!==void 0?e.allowDeselect:!1,this.hideSelected=e.hideSelected!==void 0?e.hideSelected:!1,this.keepOrder=e.keepOrder!==void 0?e.keepOrder:!1,this.showOptionTooltips=e.showOptionTooltips!==void 0?e.showOptionTooltips:!1,this.minSelected=e.minSelected||0,this.maxSelected=e.maxSelected||1e3,this.timeoutDelay=e.timeoutDelay||200,this.maxValuesShown=e.maxValuesShown||20,this.maxValuesMessage=e.maxValuesMessage||"{number} selected",this.addableText=e.addableText||'Press "Enter" to add {value}'}}let V=class{selectEl;settings;cssClasses;select;store;render;openTimeout=null;closeTimeout=null;events={search:void 0,searchFilter:(e,t)=>e.text.toLowerCase().indexOf(t.toLowerCase())!==-1,addable:void 0,beforeChange:void 0,afterChange:void 0,beforeOpen:void 0,afterOpen:void 0,beforeClose:void 0,afterClose:void 0};constructor(e){if(this.selectEl=typeof e.select=="string"?document.querySelector(e.select):e.select,!this.selectEl){e.events&&e.events.error&&e.events.error(new Error("Could not find select element"));return}if(this.selectEl.tagName!=="SELECT"){e.events&&e.events.error&&e.events.error(new Error("Element isnt of type select"));return}this.selectEl.dataset.ssid&&this.destroy(),this.settings=new A(e.settings),this.cssClasses=new T(e.cssClasses);const t=["beforeOpen","afterOpen","beforeClose","afterClose"];for(const n in e.events)e.events.hasOwnProperty(n)&&(t.indexOf(n)!==-1?this.events[n]=y(e.events[n],100):this.events[n]=e.events[n]);this.settings.disabled=e.settings?.disabled?e.settings.disabled:this.selectEl.disabled,this.settings.isMultiple=this.selectEl.multiple,this.settings.style=this.selectEl.style.cssText,this.settings.class=this.selectEl.className.split(" "),this.select=new P(this.selectEl),this.select.updateSelect(this.settings.id,this.settings.style,this.settings.class),this.select.hideUI(),this.select.onValueChange=n=>{this.setSelected(n.map(o=>o.id))},this.select.onClassChange=n=>{this.settings.class=n,this.render.updateClassStyles()},this.select.onDisabledChange=n=>{n?this.disable():this.enable()},this.select.onOptionsChange=n=>{this.setData(n)};const s=e.data?e.data:this.select.getData();this.store=new N(this.settings.isMultiple?"multiple":"single",s),e.data&&this.select.updateOptions(this.store.getData());const i={open:this.open.bind(this),close:this.close.bind(this),addable:this.events.addable?this.events.addable:void 0,setSelected:this.setSelected.bind(this),addOption:this.addOption.bind(this),search:this.search.bind(this),beforeChange:this.events.beforeChange,afterChange:this.events.afterChange};this.render=new M(this.settings,this.cssClasses,this.store,i),this.render.renderValues(),this.render.renderOptions(this.store.getData());const l=this.selectEl.getAttribute("aria-label"),a=this.selectEl.getAttribute("aria-labelledby");l?this.render.main.main.setAttribute("aria-label",l):a&&this.render.main.main.setAttribute("aria-labelledby",a),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.selectEl.slim=this}enable(){this.settings.disabled=!1,this.select.enable(),this.render.enable()}disable(){this.settings.disabled=!0,this.select.disable(),this.render.disable()}getData(){return this.store.getData()}setData(e){const t=this.store.getSelected(),s=this.store.validateDataArray(e);if(s){this.events.error&&this.events.error(s);return}this.store.setData(e);const i=this.store.getData();this.select.updateOptions(i),this.render.renderValues(),this.render.renderOptions(i),this.events.afterChange&&!x(t,this.store.getSelected())&&this.events.afterChange(this.store.getSelectedOptions())}getSelected(){let e=this.store.getSelectedOptions();return this.settings.keepOrder&&(e=this.store.selectedOrderOptions(e)),e.map(t=>t.value)}setSelected(e,t=!0){const s=this.store.getSelected(),i=this.store.getDataOptions();e=Array.isArray(e)?e:[e];const l=[];for(const n of e){if(i.find(o=>o.id==n)){l.push(n);continue}for(const o of i.filter(c=>c.value==n))l.push(o.id)}this.store.setSelectedBy("id",l);const a=this.store.getData();this.select.updateOptions(a),this.render.renderValues(),this.render.content.search.input.value!==""?this.search(this.render.content.search.input.value):this.render.renderOptions(a),t&&this.events.afterChange&&!x(s,this.store.getSelected())&&this.events.afterChange(this.store.getSelectedOptions())}addOption(e){const t=this.store.getSelected();this.store.getDataOptions().some(i=>i.value===(e.value??e.text))||this.store.addOption(e);const s=this.store.getData();this.select.updateOptions(s),this.render.renderValues(),this.render.renderOptions(s),this.events.afterChange&&!x(t,this.store.getSelected())&&this.events.afterChange(this.store.getSelectedOptions())}open(){this.settings.disabled||this.settings.isOpen||(this.events.beforeOpen&&this.events.beforeOpen(),this.render.open(),this.settings.showSearch&&this.settings.focusSearch&&this.render.searchFocus(),this.settings.isOpen=!0,this.openTimeout=setTimeout(()=>{this.events.afterOpen&&this.events.afterOpen(),this.settings.isOpen&&(this.settings.isFullOpen=!0),document.addEventListener("click",this.documentClick)},this.settings.timeoutDelay),this.settings.contentPosition==="absolute"&&(this.settings.intervalMove&&clearInterval(this.settings.intervalMove),this.settings.intervalMove=setInterval(this.render.moveContent.bind(this.render),500)))}close(e=null){!this.settings.isOpen||this.settings.alwaysOpen||(this.events.beforeClose&&this.events.beforeClose(),this.render.close(),this.render.clearSearch(),this.render.mainFocus(e),this.settings.isOpen=!1,this.settings.isFullOpen=!1,this.closeTimeout=setTimeout(()=>{this.events.afterClose&&this.events.afterClose(),document.removeEventListener("click",this.documentClick)},this.settings.timeoutDelay),this.settings.intervalMove&&clearInterval(this.settings.intervalMove))}search(e){if(this.render.content.search.input.value!==e&&(this.render.content.search.input.value=e),!this.events.search){const s=e===""?this.store.getData():this.store.search(e,this.events.searchFilter);this.render.renderOptions(s);return}this.render.renderSearching();const t=this.events.search(e,this.store.getSelectedOptions());if(t instanceof Promise){t.then(s=>{this.store.setData(s,!0),this.select.updateOptions(this.store.getData()),this.render.renderOptions(this.store.getData())}).catch(s=>{this.render.renderError(typeof s=="string"?s:s.message)});return}else Array.isArray(t)?(this.store.setData(t,!0),this.select.updateOptions(this.store.getData()),this.render.renderOptions(this.store.getData())):this.render.renderError("Search event must return a promise or an array of data")}destroy(){this.openTimeout&&(clearTimeout(this.openTimeout),this.openTimeout=null),this.closeTimeout&&(clearTimeout(this.closeTimeout),this.closeTimeout=null),this.settings.intervalMove&&(clearInterval(this.settings.intervalMove),this.settings.intervalMove=null),document.removeEventListener("click",this.documentClick),window.removeEventListener("resize",this.windowResize,!1),this.settings.openPosition==="auto"&&window.removeEventListener("scroll",this.windowScroll,!1),document.removeEventListener("visibilitychange",this.windowVisibilityChange),this.store.setData([]),this.render.destroy(),this.select.destroy()}windowResize=y(()=>{!this.settings.isOpen&&!this.settings.isFullOpen||this.render.moveContent()});windowScroll=y(()=>{!this.settings.isOpen&&!this.settings.isFullOpen||this.render.moveContent()});documentClick=e=>{this.settings.isOpen&&e.target&&!D(e.target,this.settings.id)&&this.close(e.type)};windowVisibilityChange=()=>{document.hidden&&this.close()}};const B=S.defineComponent({name:"SlimSelect",props:{modelValue:{type:[String,Array,void 0]},multiple:{type:Boolean,default:!1},data:{type:Array},settings:{type:Object},events:{type:Object,default:()=>({})}},emits:["update:modelValue"],data(){return{slim:null}},mounted(){this.$slots.default&&this.$slots.default().length>0&&this.data&&console.warn("[SlimSelect Vue] Both slot content and data prop are provided. Data prop will take precedence and slot content will be ignored.");let e={select:this.$refs.slim};this.data&&(e.data=this.data),this.settings&&(e.settings=this.settings);const t=this.events?.afterChange;e.events={...this.events,afterChange:i=>{const l=this.multiple?i.map(a=>a.value):i.length>0?i[0].value:"";this.value!==l&&(this.value=l),t&&t(i)}},this.slim=new V(e);let s=this.$props.multiple?this.slim.getSelected():this.slim.getSelected()[0];this.value!==s&&this.slim.setSelected(this.value,!1)},updated(){if(this.slim&&!this.data){const h=this.slim.getSelected(),e=Array.isArray(this.value)?this.value:[this.value];JSON.stringify(h.sort())!==JSON.stringify(e.sort())&&this.slim.setSelected(this.value,!1)}},beforeUnmount(){this.slim&&this.slim.destroy()},watch:{modelValue:{handler:function(h){this.slim&&this.slim.setSelected(this.getCleanValue(h),!1)}},data:{handler:function(h){this.slim&&this.slim.setData(h)},deep:!0}},computed:{value:{get(){return this.getCleanValue(this.$props.modelValue)},set(h){this.$emit("update:modelValue",h)}}},methods:{getSlimSelect(){return this.slim},getCleanValue(h){const e=this.$props.multiple;return typeof h=="string"?e?[h]:h:Array.isArray(h)?e?h:h[0]:e?[]:""}}}),I=(h,e)=>{const t=h.__vccOpts||h;for(const[s,i]of e)t[s]=i;return t},H=["multiple"];function F(h,e,t,s,i,l){return S.openBlock(),S.createElementBlock("select",{multiple:h.multiple,ref:"slim"},[S.renderSlot(h.$slots,"default")],8,H)}const R=I(B,[["render",F]]);b.Optgroup=g,b.Option=p,b.Settings=A,b.default=R,Object.defineProperties(b,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
1
+ (function(b,S){typeof exports=="object"&&typeof module<"u"?S(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],S):(b=typeof globalThis<"u"?globalThis:b||self,S(b.SlimSelectVue={},b.Vue))})(this,function(b,S){"use strict";class T{main;placeholder;values;single;max;value;valueText;valueDelete;valueOut;deselect;deselectPath;arrow;arrowClose;arrowOpen;content;contentOpen;dirAbove;dirBelow;search;searchHighlighter;searching;addable;addablePath;list;optgroup;optgroupLabel;optgroupLabelText;optgroupActions;optgroupSelectAll;optgroupSelectAllBox;optgroupSelectAllCheck;optgroupClosable;option;optionDelete;highlighted;mainOpen;close;selected;error;disabled;hide;constructor(e){e||(e={}),this.main=e.main||"ss-main",this.placeholder=e.placeholder||"ss-placeholder",this.values=e.values||"ss-values",this.single=e.single||"ss-single",this.max=e.max||"ss-max",this.value=e.value||"ss-value",this.valueText=e.valueText||"ss-value-text",this.valueDelete=e.valueDelete||"ss-value-delete",this.valueOut=e.valueOut||"ss-value-out",this.deselect=e.deselect||"ss-deselect",this.deselectPath=e.deselectPath||"M10,10 L90,90 M10,90 L90,10",this.arrow=e.arrow||"ss-arrow",this.arrowClose=e.arrowClose||"M10,30 L50,70 L90,30",this.arrowOpen=e.arrowOpen||"M10,70 L50,30 L90,70",this.content=e.content||"ss-content",this.contentOpen=e.contentOpen||"ss-open",this.dirAbove=e.dirAbove||"ss-dir-above",this.dirBelow=e.dirBelow||"ss-dir-below",this.search=e.search||"ss-search",this.searchHighlighter=e.searchHighlighter||"ss-search-highlight",this.searching=e.searching||"ss-searching",this.addable=e.addable||"ss-addable",this.addablePath=e.addablePath||"M50,10 L50,90 M10,50 L90,50",this.list=e.list||"ss-list",this.optgroup=e.optgroup||"ss-optgroup",this.optgroupLabel=e.optgroupLabel||"ss-optgroup-label",this.optgroupLabelText=e.optgroupLabelText||"ss-optgroup-label-text",this.optgroupActions=e.optgroupActions||"ss-optgroup-actions",this.optgroupSelectAll=e.optgroupSelectAll||"ss-selectall",this.optgroupSelectAllBox=e.optgroupSelectAllBox||"M60,10 L10,10 L10,90 L90,90 L90,50",this.optgroupSelectAllCheck=e.optgroupSelectAllCheck||"M30,45 L50,70 L90,10",this.optgroupClosable=e.optgroupClosable||"ss-closable",this.option=e.option||"ss-option",this.optionDelete=e.optionDelete||"M10,10 L90,90 M10,90 L90,10",this.highlighted=e.highlighted||"ss-highlighted",this.mainOpen=e.mainOpen||"ss-open",this.close=e.close||"ss-close",this.selected=e.selected||"ss-selected",this.error=e.error||"ss-error",this.disabled=e.disabled||"ss-disabled",this.hide=e.hide||"ss-hide"}}function L(){return Math.random().toString(36).substring(2,10)}function D(h,e){function t(i,l){return l&&i&&i.classList&&i.classList.contains(l)||l&&i&&i.dataset&&i.dataset.id&&i.dataset.id===e?i:null}function s(i,l){return!i||i===document?null:t(i,l)?i:s(i.parentNode,l)}return t(h,e)||s(h,e)}function y(h,e=50,t=!1){let s;return function(...i){const l=self,a=()=>{s=null,t||h.apply(l,i)},n=t&&!s;clearTimeout(s),s=setTimeout(a,e),n&&h.apply(l,i)}}function x(h,e){return JSON.stringify(h)===JSON.stringify(e)}function k(h){const e=h.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g,t=>"-"+t.toLowerCase());return h[0]===h[0].toUpperCase()?e.substring(1):e}class p{id;value;text;html;defaultSelected;selected;display;disabled;placeholder;class;style;data;mandatory;constructor(e){this.id=!e.id||e.id===""?L():e.id,this.value=e.value===void 0?e.text||"":e.value||"",this.text=e.text||"",this.html=e.html||"",this.defaultSelected=e.defaultSelected!==void 0?e.defaultSelected:!1,this.selected=e.selected!==void 0?e.selected:!1,this.display=e.display!==void 0?e.display:!0,this.disabled=e.disabled!==void 0?e.disabled:!1,this.mandatory=e.mandatory!==void 0?e.mandatory:!1,this.placeholder=e.placeholder!==void 0?e.placeholder:!1,this.class=e.class||"",this.style=e.style||"",this.data=e.data||{}}}class g{id;label;selectAll;selectAllText;closable;options;constructor(e){if(this.id=!e.id||e.id===""?L():e.id,this.label=e.label||"",this.selectAll=e.selectAll===void 0?!1:e.selectAll,this.selectAllText=e.selectAllText||"Select All",this.closable=e.closable||"off",this.options=[],e.options)for(const t of e.options)this.options.push(new p(t))}}class N{selectType="single";data=[];selectedOrder=[];constructor(e,t){this.selectType=e,this.setData(t)}validateDataArray(e){if(!Array.isArray(e))return new Error("Data must be an array");for(let t of e)if(t)if(t instanceof g||"label"in t){if(!("label"in t))return new Error("Optgroup must have a label");if("options"in t&&t.options)for(let s of t.options){const i=this.validateOption(s);if(i)return i}}else if(t instanceof p||"text"in t){const s=this.validateOption(t);if(s)return s}else return new Error("Data object must be a valid optgroup or option");return null}validateOption(e){return"text"in e?null:new Error("Option must have a text")}partialToFullData(e){let t=[];return e.forEach(s=>{if(s){if(s instanceof g||"label"in s){let i=[];"options"in s&&s.options&&s.options.forEach(l=>{i.push(new p(l))}),i.length>0&&t.push(new g(s))}(s instanceof p||"text"in s)&&t.push(new p(s))}}),t}setData(e,t=!1){const s=this.partialToFullData(e);if(t){const i=this.getSelectedOptions(),l=[];i.forEach(a=>{let n=!1;for(const o of s){if(o instanceof p&&o.id===a.id){n=!0;break}if(o instanceof g){for(const c of o.options)if(c.id===a.id){n=!0;break}}}n||l.push(a)}),this.data=[...l,...s]}else this.data=s;this.selectType==="single"&&this.setSelectedBy("id",this.getSelected())}getData(){return this.filter(null,!0)}getDataOptions(){return this.filter(null,!1)}addOption(e,t=!1){if(t){let s=[new p(e)];this.setData(s.concat(this.getData()))}else this.setData(this.getData().concat(new p(e)))}setSelectedBy(e,t){let s=null,i=!1;const l=[];for(let n of this.data){if(n instanceof g)for(let o of n.options){s||(s=o);let c=o[e]||"";o.selected=i?!1:t.includes(c),o.selected&&(l.push(o),this.selectType==="single"&&(i=!0))}n instanceof p&&(s||(s=n),n.selected=i?!1:t.includes(n[e]),n.selected&&(l.push(n),this.selectType==="single"&&(i=!0)))}this.selectType==="single"&&s&&!i&&(s.selected=!0,l.push(s));const a=t.map(n=>l.find(o=>o[e]===n)?.id||"");this.selectedOrder=a}getSelected(){return this.getSelectedOptions().map(e=>e.id)}getSelectedValues(){return this.getSelectedOptions().map(e=>e.value)}getSelectedOptions(){return this.filter(e=>e.selected,!1)}getOptgroupByID(e){for(let t of this.data)if(t instanceof g&&t.id===e)return t;return null}getOptionByID(e){let t=this.filter(s=>s.id===e,!1);return t.length?t[0]:null}getSelectType(){return this.selectType}getFirstOption(){let e=null;for(let t of this.data)if(t instanceof g?e=t.options[0]:t instanceof p&&(e=t),e)break;return e}search(e,t){return e=e.trim(),e===""?this.getData():this.filter(s=>t(s,e),!0)}filter(e,t){const s=[];return this.data.forEach(i=>{if(i instanceof g){let l=[];if(i.options.forEach(n=>{(!e||e(n))&&(t?l.push(new p(n)):s.push(new p(n)))}),l.length>0){let n=new g(i);n.options=l,s.push(n)}}i instanceof p&&(!e||e(i))&&s.push(new p(i))}),s}selectedOrderOptions(e){const t=[];return this.selectedOrder.forEach(s=>{const i=e.find(l=>l.id===s);i&&t.push(i)}),e.forEach(s=>{let i=!1;t.forEach(l=>{if(s.id===l.id){i=!0;return}}),i||t.push(s)}),t}}class M{settings;store;callbacks;lastSelectedOption;main;content;classes;constructor(e,t,s,i){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.contentLocation&&this.settings.contentLocation.appendChild(this.content.main)}enable(){this.main.main.classList.remove(this.classes.disabled),this.main.main.setAttribute("aria-disabled","false"),this.content.search.input.disabled=!1}disable(){this.main.main.classList.add(this.classes.disabled),this.main.main.setAttribute("aria-disabled","true"),this.content.search.input.disabled=!0}open(){this.main.arrow.path.setAttribute("d",this.classes.arrowOpen),this.main.main.setAttribute("aria-expanded","true");const t=this.settings.openPosition==="up"?this.classes.dirAbove:this.classes.dirBelow;this.main.main.classList.add(t),this.content.main.classList.add(t),this.content.main.classList.add(this.classes.contentOpen),this.content.search.input.removeAttribute("aria-hidden"),this.moveContent();const s=this.store.getSelectedOptions();if(s.length){const i=s[s.length-1].id,l=this.content.list.querySelector('[data-id="'+i+'"]');l&&this.ensureElementInView(this.content.list,l)}}close(){this.main.main.setAttribute("aria-expanded","false"),this.main.arrow.path.setAttribute("d",this.classes.arrowClose),this.content.main.classList.remove(this.classes.contentOpen),this.content.search.input.setAttribute("aria-hidden","true"),this.main.main.removeAttribute("aria-activedescendant"),setTimeout(()=>{this.main.main.classList.remove(this.classes.dirAbove,this.classes.dirBelow),this.content.main.classList.remove(this.classes.dirAbove,this.classes.dirBelow)},100)}updateClassStyles(){if(this.main.main.className="",this.main.main.removeAttribute("style"),this.content.main.className="",this.content.main.removeAttribute("style"),this.main.main.classList.add(this.classes.main),this.content.main.classList.add(this.classes.content),this.settings.style!==""&&(this.main.main.style.cssText=this.settings.style,this.content.main.style.cssText=this.settings.style),this.settings.class.length)for(const e of this.settings.class)e.trim()!==""&&(this.main.main.classList.add(e.trim()),this.content.main.classList.add(e.trim()));(this.settings.contentPosition==="relative"||this.settings.contentPosition==="fixed")&&this.content.main.classList.add("ss-"+this.settings.contentPosition)}updateAriaAttributes(){const e=this.content.list.id;this.main.main.role="combobox",this.main.main.setAttribute("aria-haspopup","listbox"),this.main.main.setAttribute("aria-controls",e),this.main.main.setAttribute("aria-expanded","false"),this.content.list.setAttribute("role","listbox"),this.content.list.setAttribute("aria-label",this.settings.ariaLabel+" listbox"),this.settings.isMultiple&&this.content.list.setAttribute("aria-multiselectable","true"),this.content.search.input.setAttribute("aria-controls",e)}mainDiv(){const e=document.createElement("div");e.dataset.id=this.settings.id,e.setAttribute("aria-label",this.settings.ariaLabel),e.tabIndex=0,e.onkeydown=c=>{switch(c.key){case"ArrowUp":case"ArrowDown":return this.callbacks.open(),c.key==="ArrowDown"?this.highlight("down"):this.highlight("up"),!1;case"Tab":return this.callbacks.close(),!0;case"Enter":case" ":this.callbacks.open();const r=this.content.list.querySelector("."+this.classes.highlighted);return r&&r.click(),!1;case"Escape":return this.callbacks.close(),!1}return c.key.length===1&&this.callbacks.open(),!0},e.onclick=c=>{this.settings.disabled||(this.settings.isOpen?this.callbacks.close():this.callbacks.open())};const t=document.createElement("div");t.classList.add(this.classes.values),e.appendChild(t);const s=document.createElement("div");s.classList.add(this.classes.deselect);const i=this.store?.getSelectedOptions();!this.settings.allowDeselect||this.settings.isMultiple&&i&&i.length<=0?s.classList.add(this.classes.hide):s.classList.remove(this.classes.hide),s.onclick=c=>{if(c.stopPropagation(),this.settings.disabled)return;let r=!0;const d=this.store.getSelectedOptions(),f=[];if(this.callbacks.beforeChange&&(r=this.callbacks.beforeChange(f,d)===!0),r){if(this.settings.isMultiple)this.callbacks.setSelected([],!1),this.updateDeselectAll();else{const u=this.store.getFirstOption(),m=u?u.id:"";this.callbacks.setSelected(m,!1)}this.settings.closeOnSelect&&this.callbacks.close(),this.callbacks.afterChange&&this.callbacks.afterChange(this.store.getSelectedOptions())}};const l=document.createElementNS("http://www.w3.org/2000/svg","svg");l.setAttribute("viewBox","0 0 100 100");const a=document.createElementNS("http://www.w3.org/2000/svg","path");a.setAttribute("d",this.classes.deselectPath),l.appendChild(a),s.appendChild(l),e.appendChild(s);const n=document.createElementNS("http://www.w3.org/2000/svg","svg");n.classList.add(this.classes.arrow),n.setAttribute("viewBox","0 0 100 100");const o=document.createElementNS("http://www.w3.org/2000/svg","path");return o.setAttribute("d",this.classes.arrowClose),this.settings.alwaysOpen&&n.classList.add(this.classes.hide),n.appendChild(o),e.appendChild(n),{main:e,values:t,deselect:{main:s,svg:l,path:a},arrow:{main:n,path:o}}}mainFocus(e){e!=="click"&&this.main.main.focus({preventScroll:!0})}placeholder(){const e=this.store.filter(i=>i.placeholder,!1);let t=this.settings.placeholderText;e.length&&(e[0].html!==""?t=e[0].html:e[0].text!==""&&(t=e[0].text));const s=document.createElement("div");return s.classList.add(this.classes.placeholder),s.innerHTML=t,s}renderValues(){if(!this.settings.isMultiple){this.renderSingleValue();return}this.renderMultipleValues(),this.updateDeselectAll()}renderSingleValue(){const e=this.store.filter(s=>s.selected&&!s.placeholder,!1),t=e.length>0?e[0]:null;if(!t)this.main.values.innerHTML=this.placeholder().outerHTML;else{const s=document.createElement("div");s.classList.add(this.classes.single),t.html?s.innerHTML=t.html:s.innerText=t.text,this.main.values.innerHTML=s.outerHTML}!this.settings.allowDeselect||!e.length?this.main.deselect.main.classList.add(this.classes.hide):this.main.deselect.main.classList.remove(this.classes.hide)}renderMultipleValues(){let e=this.main.values.childNodes,t=this.store.filter(i=>i.selected&&i.display,!1);if(t.length===0){this.main.values.innerHTML=this.placeholder().outerHTML;return}else{const i=this.main.values.querySelector("."+this.classes.placeholder);i&&i.remove()}if(t.length>this.settings.maxValuesShown){const i=document.createElement("div");i.classList.add(this.classes.max),i.textContent=this.settings.maxValuesMessage.replace("{number}",t.length.toString()),this.main.values.innerHTML=i.outerHTML;return}else{const i=this.main.values.querySelector("."+this.classes.max);i&&i.remove()}this.settings.keepOrder&&(t=this.store.selectedOrderOptions(t));let s=[];for(let i=0;i<e.length;i++){const l=e[i],a=l.getAttribute("data-id");a&&(t.filter(o=>o.id===a,!1).length||s.push(l))}for(const i of s)i.classList.add(this.classes.valueOut),setTimeout(()=>{this.main.values.hasChildNodes()&&this.main.values.contains(i)&&this.main.values.removeChild(i)},100);e=this.main.values.childNodes;for(let i=0;i<t.length;i++){let l=!0;for(let a=0;a<e.length;a++)t[i].id===String(e[a].dataset.id)&&(l=!1);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])))}}multipleValue(e){const t=document.createElement("div");t.classList.add(this.classes.value),t.dataset.id=e.id;const s=document.createElement("div");if(s.classList.add(this.classes.valueText),s.textContent=e.text,t.appendChild(s),!e.mandatory){const i=document.createElement("div");i.classList.add(this.classes.valueDelete),i.setAttribute("tabindex","0"),i.onclick=n=>{if(n.preventDefault(),n.stopPropagation(),this.settings.disabled)return;let o=!0;const c=this.store.getSelectedOptions(),r=c.filter(d=>d.selected&&d.id!==e.id,!0);if(!(this.settings.minSelected&&r.length<this.settings.minSelected)&&(this.callbacks.beforeChange&&(o=this.callbacks.beforeChange(r,c)===!0),o)){let d=[];for(const f of r){if(f instanceof g)for(const u of f.options)u.id&&d.push(u.id);f instanceof p&&d.push(f.id)}this.callbacks.setSelected(d,!1),this.settings.closeOnSelect&&this.callbacks.close(),this.callbacks.afterChange&&this.callbacks.afterChange(r),this.updateDeselectAll()}};const l=document.createElementNS("http://www.w3.org/2000/svg","svg");l.setAttribute("viewBox","0 0 100 100");const a=document.createElementNS("http://www.w3.org/2000/svg","path");a.setAttribute("d",this.classes.optionDelete),l.appendChild(a),i.appendChild(l),t.appendChild(i),i.onkeydown=n=>{n.key==="Enter"&&i.click()}}return t}contentDiv(){const e=document.createElement("div");e.dataset.id=this.settings.id;const t=this.searchDiv();e.appendChild(t.main);const s=this.listDiv();return e.appendChild(s),{main:e,search:t,list:s}}moveContent(){if(this.settings.contentPosition==="relative"){this.moveContentBelow();return}if(this.settings.openPosition==="down"){this.moveContentBelow();return}else if(this.settings.openPosition==="up"){this.moveContentAbove();return}this.putContent()==="up"?this.moveContentAbove():this.moveContentBelow()}searchDiv(){const e=document.createElement("div"),t=document.createElement("input"),s=document.createElement("div");e.classList.add(this.classes.search);const i={main:e,input:t};if(this.settings.showSearch||(e.classList.add(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=y(l=>{this.callbacks.search(l.target.value)},100),t.onkeydown=l=>{switch(l.key){case"ArrowUp":case"ArrowDown":return l.key==="ArrowDown"?this.highlight("down"):this.highlight("up"),!1;case"Tab":return this.callbacks.close(),!0;case"Escape":return this.callbacks.close(),!1;case" ":const a=this.content.list.querySelector("."+this.classes.highlighted);return a?(a.click(),!1):!0;case"Enter":const n=this.content.list.querySelector("."+this.classes.highlighted);return n?(n.click(),!1):this.callbacks.addable?(s.click(),!1):!0}return!0},e.appendChild(t),this.callbacks.addable){s.classList.add(this.classes.addable);const l=document.createElementNS("http://www.w3.org/2000/svg","svg");l.setAttribute("viewBox","0 0 100 100");const a=document.createElementNS("http://www.w3.org/2000/svg","path");a.setAttribute("d",this.classes.addablePath),l.appendChild(a),s.appendChild(l),s.onclick=n=>{if(n.preventDefault(),n.stopPropagation(),!this.callbacks.addable)return;const o=this.content.search.input.value.trim();if(o===""){this.content.search.input.focus();return}const c=d=>{let f=new p(d);if(this.callbacks.addOption(f),this.settings.isMultiple){let u=this.store.getSelected();u.push(f.id),this.callbacks.setSelected(u,!0)}else this.callbacks.setSelected([f.id],!0);this.callbacks.search(""),this.settings.closeOnSelect&&setTimeout(()=>{this.callbacks.close()},100)},r=this.callbacks.addable(o);r===!1||r===void 0||r===null||(r instanceof Promise?r.then(d=>{typeof d=="string"?c({text:d,value:d}):r instanceof Error?this.renderError(r.message):c(d)}):typeof r=="string"?c({text:r,value:r}):r instanceof Error?this.renderError(r.message):c(r))},e.appendChild(s),i.addable={main:s,svg:l,path:a}}return i}searchFocus(){this.content.search.input.focus()}clearSearch(){this.content.search.input.value=""}getOptions(e=!1,t=!1,s=!1){let i="."+this.classes.option;return e&&(i+=":not(."+this.classes.placeholder+")"),t&&(i+=":not(."+this.classes.disabled+")"),s&&(i+=":not(."+this.classes.hide+")"),Array.from(this.content.list.querySelectorAll(i))}highlight(e){const t=this.getOptions(!0,!0,!0);if(t.length===0)return;if(t.length===1&&!t[0].classList.contains(this.classes.highlighted)){t[0].classList.add(this.classes.highlighted);return}let s=!1;for(const l of t)l.classList.contains(this.classes.highlighted)&&(s=!0);if(!s){for(const l of t)if(l.classList.contains(this.classes.selected)){l.classList.add(this.classes.highlighted);break}}for(let l=0;l<t.length;l++)if(t[l].classList.contains(this.classes.highlighted)){const a=t[l];a.classList.remove(this.classes.highlighted);const n=a.parentElement;if(n&&n.classList.contains(this.classes.mainOpen)){const r=n.querySelector("."+this.classes.optgroupLabel);r&&r.click()}let o=t[e==="down"?l+1<t.length?l+1:0:l-1>=0?l-1:t.length-1];o.classList.add(this.classes.highlighted),this.ensureElementInView(this.content.list,o),o.id&&this.main.main.setAttribute("aria-activedescendant",o.id);const c=o.parentElement;if(c&&c.classList.contains(this.classes.close)){const r=c.querySelector("."+this.classes.optgroupLabel);r&&r.click()}return}const i=t[e==="down"?0:t.length-1];i.classList.add(this.classes.highlighted),i.id&&this.main.main.setAttribute("aria-activedescendant",i.id),this.ensureElementInView(this.content.list,i)}listDiv(){const e=document.createElement("div");e.classList.add(this.classes.list);const t=this.settings.id+"-list";return e.id=t,e.dataset.id=t,e}renderError(e){this.content.list.innerHTML="";const t=document.createElement("div");t.classList.add(this.classes.error),t.textContent=e,this.content.list.appendChild(t)}renderSearching(){this.content.list.innerHTML="";const e=document.createElement("div");e.classList.add(this.classes.searching),e.textContent=this.settings.searchingText,this.content.list.appendChild(e)}renderOptions(e){if(this.content.list.innerHTML="",e.length===0){const s=document.createElement("div");s.classList.add(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);return}this.settings.allowDeselect&&!this.settings.isMultiple&&(this.store.filter(i=>i.placeholder,!1).length||this.store.addOption(new p({text:"",value:"",selected:!1,placeholder:!0}),!0));const t=document.createDocumentFragment();for(const s of e){if(s instanceof g){const i=document.createElement("div");i.classList.add(this.classes.optgroup);const l=document.createElement("div");l.classList.add(this.classes.optgroupLabel),i.appendChild(l);const a=document.createElement("div");a.classList.add(this.classes.optgroupLabelText),a.textContent=s.label,l.appendChild(a);const n=document.createElement("div");if(n.classList.add(this.classes.optgroupActions),l.appendChild(n),this.settings.isMultiple&&s.selectAll){const o=document.createElement("div");o.classList.add(this.classes.optgroupSelectAll);let c=!0;for(const m of s.options)if(!m.selected){c=!1;break}c&&o.classList.add(this.classes.selected);const r=document.createElement("span");r.textContent=s.selectAllText,o.appendChild(r);const d=document.createElementNS("http://www.w3.org/2000/svg","svg");d.setAttribute("viewBox","0 0 100 100"),o.appendChild(d);const f=document.createElementNS("http://www.w3.org/2000/svg","path");f.setAttribute("d",this.classes.optgroupSelectAllBox),d.appendChild(f);const u=document.createElementNS("http://www.w3.org/2000/svg","path");u.setAttribute("d",this.classes.optgroupSelectAllCheck),d.appendChild(u),o.addEventListener("click",m=>{m.preventDefault(),m.stopPropagation();const v=this.store.getSelected();if(c){const O=v.filter(C=>{for(const w of s.options)if(C===w.id)return!1;return!0});this.callbacks.setSelected(O,!0);return}else{let O=s.options.map(w=>w.id).filter(w=>w!==void 0);const C=v.concat(O);for(const w of s.options)w.id&&!this.store.getOptionByID(w.id)&&this.callbacks.addOption(new p(w));this.callbacks.setSelected(C,!0);return}}),n.appendChild(o)}if(s.closable!=="off"){const o=document.createElement("div");o.classList.add(this.classes.optgroupClosable);const c=document.createElementNS("http://www.w3.org/2000/svg","svg");c.setAttribute("viewBox","0 0 100 100"),c.classList.add(this.classes.arrow),o.appendChild(c);const r=document.createElementNS("http://www.w3.org/2000/svg","path");c.appendChild(r),s.options.some(d=>d.selected)||this.content.search.input.value.trim()!==""?(o.classList.add(this.classes.mainOpen),r.setAttribute("d",this.classes.arrowOpen)):s.closable==="open"?(i.classList.add(this.classes.mainOpen),r.setAttribute("d",this.classes.arrowOpen)):s.closable==="close"&&(i.classList.add(this.classes.close),r.setAttribute("d",this.classes.arrowClose)),l.addEventListener("click",d=>{d.preventDefault(),d.stopPropagation(),i.classList.contains(this.classes.close)?(i.classList.remove(this.classes.close),i.classList.add(this.classes.mainOpen),r.setAttribute("d",this.classes.arrowOpen)):(i.classList.remove(this.classes.mainOpen),i.classList.add(this.classes.close),r.setAttribute("d",this.classes.arrowClose))}),n.appendChild(o)}i.appendChild(l);for(const o of s.options)i.appendChild(this.option(new p(o))),t.appendChild(i)}s instanceof p&&t.appendChild(this.option(s))}this.content.list.appendChild(t)}option(e){if(e.placeholder){const s=document.createElement("div");return s.classList.add(this.classes.option),s.classList.add(this.classes.hide),s}const t=document.createElement("div");return t.dataset.id=e.id,t.id=this.settings.id+"-"+e.id,t.classList.add(this.classes.option),t.setAttribute("role","option"),e.class&&e.class.split(" ").forEach(s=>{t.classList.add(s)}),e.style&&(t.style.cssText=e.style),this.settings.searchHighlight&&this.content.search.input.value.trim()!==""?t.innerHTML=this.highlightText(e.html!==""?e.html:e.text,this.content.search.input.value,this.classes.searchHighlighter):e.html!==""?t.innerHTML=e.html:t.textContent=e.text,this.settings.showOptionTooltips&&t.textContent&&t.setAttribute("title",t.textContent),e.display||t.classList.add(this.classes.hide),e.disabled&&t.classList.add(this.classes.disabled),e.selected&&this.settings.hideSelected&&t.classList.add(this.classes.hide),e.selected?(t.classList.add(this.classes.selected),t.setAttribute("aria-selected","true"),this.main.main.setAttribute("aria-activedescendant",t.id)):(t.classList.remove(this.classes.selected),t.setAttribute("aria-selected","false")),t.addEventListener("click",s=>{s.preventDefault(),s.stopPropagation();const i=this.store.getSelected(),l=s.currentTarget,a=String(l.dataset.id),n=s.ctrlKey||s.metaKey;if(e.disabled||!this.settings.isMultiple&&e.selected&&!this.settings.allowDeselect||this.settings.isMultiple&&this.settings.maxSelected<=i.length&&!e.selected||this.settings.isMultiple&&this.settings.minSelected>=i.length&&e.selected&&!n)return;let o=!1;const c=this.store.getSelectedOptions();let r=[];if(this.settings.isMultiple){const d=c.some(u=>u.id===a);if(s.shiftKey&&this.lastSelectedOption){const u=this.store.getDataOptions(),m=u.findIndex(O=>O.id===this.lastSelectedOption.id),v=u.findIndex(O=>O.id===e.id);if(m>=0&&v>=0){const O=Math.min(m,v),C=Math.max(m,v),E=u.slice(O,C+1).filter($=>!c.find(U=>U.id===$.id));c.length+E.length<=this.settings.maxSelected?r=c.concat(E):r=c}else r=c}else n?(d?r=c.filter(u=>u.id!==a):r=c.concat(e),this.lastSelectedOption=e):(d?r=c.filter(u=>u.id!==a):r=c.concat(e),this.lastSelectedOption=e)}if(this.settings.isMultiple||(e.selected?r=[]:r=[e]),this.callbacks.beforeChange||(o=!0),this.callbacks.beforeChange&&(this.callbacks.beforeChange(r,c)===!1?o=!1:o=!0),o){this.store.getOptionByID(a)||this.callbacks.addOption(e),this.callbacks.setSelected(r.map(u=>u.id),!1);const d=s.ctrlKey||s.metaKey||s.shiftKey;this.settings.closeOnSelect&&!(this.settings.isMultiple&&d)&&this.callbacks.close(),this.callbacks.afterChange&&this.callbacks.afterChange(r)}}),t}destroy(){this.main.main.remove(),this.content.main.remove()}highlightText(e,t,s){const i=t.trim();if(i==="")return e;const l=i.replace(/[.*+?^${}()|[\]\\]/g,"\\$&"),a=document.createElement("div");a.innerHTML=e;const n=o=>{if(o.nodeType===Node.TEXT_NODE){const c=o.textContent||"",r=new RegExp("("+l+")","i");if(r.test(c)){const d=document.createElement("span");c.split(r).forEach((u,m)=>{if(u&&r.test(u)){const v=document.createElement("mark");v.className=s,v.textContent=u,d.appendChild(v)}else u&&d.appendChild(document.createTextNode(u))}),o.parentNode?.replaceChild(d,o)}}else o.nodeType===Node.ELEMENT_NODE&&Array.from(o.childNodes).forEach(c=>n(c))};return Array.from(a.childNodes).forEach(o=>n(o)),a.innerHTML}moveContentAbove(){const e=this.main.main.offsetHeight,t=this.content.main.offsetHeight;this.main.main.classList.remove(this.classes.dirBelow),this.main.main.classList.add(this.classes.dirAbove),this.content.main.classList.remove(this.classes.dirBelow),this.content.main.classList.add(this.classes.dirAbove);const s=this.main.main.getBoundingClientRect();this.content.main.style.margin="-"+(e+t-1)+"px 0px 0px 0px",this.content.main.style.top=s.top+s.height+(this.settings.contentPosition==="fixed"?0:window.scrollY)+"px",this.content.main.style.left=s.left+(this.settings.contentPosition==="fixed"?0:window.scrollX)+"px",this.content.main.style.width=s.width+"px"}moveContentBelow(){this.main.main.classList.remove(this.classes.dirAbove),this.main.main.classList.add(this.classes.dirBelow),this.content.main.classList.remove(this.classes.dirAbove),this.content.main.classList.add(this.classes.dirBelow);const e=this.main.main.getBoundingClientRect();this.content.main.style.margin="-1px 0px 0px 0px",this.settings.contentPosition!=="relative"&&(this.content.main.style.top=e.top+e.height+(this.settings.contentPosition==="fixed"?0:window.scrollY)+"px",this.content.main.style.left=e.left+(this.settings.contentPosition==="fixed"?0:window.scrollX)+"px",this.content.main.style.width=e.width+"px")}ensureElementInView(e,t){const s=e.scrollTop+e.offsetTop,i=s+e.clientHeight,l=t.offsetTop,a=l+t.clientHeight;l<s?e.scrollTop-=s-l:a>i&&(e.scrollTop+=a-i)}putContent(){const e=this.main.main.offsetHeight,t=this.main.main.getBoundingClientRect(),s=this.content.main.offsetHeight;return window.innerHeight-(t.top+e)<=s&&t.top>s?"up":"down"}updateDeselectAll(){if(!this.store||!this.settings)return;const e=this.store.getSelectedOptions(),t=e&&e.length>0,s=this.settings.isMultiple,i=this.settings.allowDeselect,l=this.main.deselect.main,a=this.classes.hide;i&&!(s&&!t)?l.classList.remove(a):l.classList.add(a)}}class P{select;onValueChange;onClassChange;onDisabledChange;onOptionsChange;listen=!1;observer=null;constructor(e){this.select=e,this.valueChange=this.valueChange.bind(this),this.select.addEventListener("change",this.valueChange,{passive:!0}),this.observer=new MutationObserver(this.observeCall.bind(this)),this.changeListen(!0)}enable(){this.select.disabled=!1}disable(){this.select.disabled=!0}hideUI(){this.select.tabIndex=-1,this.select.style.position="absolute",this.select.style.width="1px",this.select.style.height="1px",this.select.style.opacity="0",this.select.style.overflow="hidden",this.select.style.pointerEvents="none",this.select.style.margin="0",this.select.style.padding="0",this.select.style.borderWidth="0",this.select.style.clip="rect(0 0 0 0)",this.select.setAttribute("aria-hidden","true")}showUI(){this.select.removeAttribute("tabindex"),this.select.style.position="",this.select.style.width="",this.select.style.height="",this.select.style.opacity="",this.select.style.overflow="",this.select.style.pointerEvents="",this.select.style.margin="",this.select.style.padding="",this.select.style.borderWidth="",this.select.style.clip="",this.select.removeAttribute("aria-hidden")}changeListen(e){this.listen=e,e&&this.observer&&this.observer.observe(this.select,{subtree:!0,childList:!0,attributes:!0}),e||this.observer&&this.observer.disconnect()}valueChange(e){return this.listen&&this.onValueChange&&this.onValueChange(this.getSelectedOptions()),!0}observeCall(e){if(!this.listen)return;let t=!1,s=!1,i=!1;for(const l of e){if(l.target===this.select&&(l.attributeName==="disabled"&&(s=!0),l.attributeName==="class"&&(t=!0),l.type==="childList")){for(const a of Array.from(l.addedNodes))if(a.nodeName==="OPTION"&&a.value===this.select.value){this.select.dispatchEvent(new Event("change"));break}i=!0}(l.target.nodeName==="OPTGROUP"||l.target.nodeName==="OPTION")&&(i=!0)}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&&(this.changeListen(!1),this.onOptionsChange(this.getData()),this.changeListen(!0))}getData(){let e=[];const t=this.select.childNodes;for(const s of t)s.nodeName==="OPTGROUP"&&e.push(this.getDataFromOptgroup(s)),s.nodeName==="OPTION"&&e.push(this.getDataFromOption(s));return e}getDataFromOptgroup(e){let t={id:e.id,label:e.label,selectAll:e.dataset?e.dataset.selectall==="true":!1,selectAllText:e.dataset?e.dataset.selectalltext:"Select all",closable:e.dataset?e.dataset.closable:"off",options:[]};const s=e.childNodes;for(const i of s)i.nodeName==="OPTION"&&t.options.push(this.getDataFromOption(i));return t}getDataFromOption(e){return{id:e.id,value:e.value,text:e.text,html:e.dataset&&e.dataset.html?e.dataset.html:"",defaultSelected:e.defaultSelected,selected:e.selected,display:e.style.display!=="none",disabled:e.disabled,mandatory:e.dataset?e.dataset.mandatory==="true":!1,placeholder:e.dataset.placeholder==="true",class:e.className,style:e.style.cssText,data:e.dataset}}getSelectedOptions(){let e=[];const t=this.select.childNodes;for(const s of t){if(s.nodeName==="OPTGROUP"){const i=s.childNodes;for(const l of i)if(l.nodeName==="OPTION"){const a=l;a.selected&&e.push(this.getDataFromOption(a))}}if(s.nodeName==="OPTION"){const i=s;i.selected&&e.push(this.getDataFromOption(i))}}return e}getSelectedValues(){return this.getSelectedOptions().map(e=>e.value)}setSelected(e){this.changeListen(!1);const t=this.select.childNodes;for(const s of t){if(s.nodeName==="OPTGROUP"){const l=s.childNodes;for(const a of l)if(a.nodeName==="OPTION"){const n=a;n.selected=e.includes(n.id)}}if(s.nodeName==="OPTION"){const i=s;i.selected=e.includes(i.id)}}this.changeListen(!0)}setSelectedByValue(e){this.changeListen(!1);const t=this.select.childNodes;for(const s of t){if(s.nodeName==="OPTGROUP"){const l=s.childNodes;for(const a of l)if(a.nodeName==="OPTION"){const n=a;n.selected=e.includes(n.value)}}if(s.nodeName==="OPTION"){const i=s;i.selected=e.includes(i.value)}}this.changeListen(!0)}updateSelect(e,t,s){this.changeListen(!1),e&&(this.select.dataset.id=e),t&&(this.select.style.cssText=t),s&&(this.select.className="",s.forEach(i=>{i.trim()!==""&&this.select.classList.add(i.trim())})),this.changeListen(!0)}updateOptions(e){this.changeListen(!1),this.select.innerHTML="";for(const t of e)t instanceof g&&this.select.appendChild(this.createOptgroup(t)),t instanceof p&&this.select.appendChild(this.createOption(t));this.select.dispatchEvent(new Event("change",{bubbles:!0})),this.changeListen(!0)}createOptgroup(e){const t=document.createElement("optgroup");if(t.id=e.id,t.label=e.label,e.selectAll&&(t.dataset.selectAll="true"),e.closable!=="off"&&(t.dataset.closable=e.closable),e.options)for(const s of e.options)t.appendChild(this.createOption(s));return t}createOption(e){const t=document.createElement("option");return t.id=e.id,t.value=e.value,t.textContent=e.text,e.html!==""&&t.setAttribute("data-html",e.html),t.defaultSelected=e.defaultSelected,t.selected=e.selected,e.disabled&&(t.disabled=!0),e.display||(t.style.display="none"),e.placeholder&&t.setAttribute("data-placeholder","true"),e.mandatory&&t.setAttribute("data-mandatory","true"),e.class&&e.class.split(" ").forEach(s=>{t.classList.add(s)}),e.data&&typeof e.data=="object"&&Object.keys(e.data).forEach(s=>{t.setAttribute("data-"+k(s),e.data[s])}),t}destroy(){this.changeListen(!1),this.select.removeEventListener("change",this.valueChange),this.observer&&(this.observer.disconnect(),this.observer=null),delete this.select.dataset.id,this.showUI()}}class A{id="";style="";class=[];isMultiple=!1;isOpen=!1;isFullOpen=!1;intervalMove=null;disabled;alwaysOpen;showSearch;focusSearch;ariaLabel;searchPlaceholder;searchText;searchingText;searchHighlight;closeOnSelect;contentLocation;contentPosition;openPosition;placeholderText;allowDeselect;hideSelected;keepOrder;showOptionTooltips;minSelected;maxSelected;timeoutDelay;maxValuesShown;maxValuesMessage;addableText;constructor(e){e||(e={}),this.id="ss-"+L(),this.style=e.style||"",this.class=e.class||[],this.disabled=e.disabled!==void 0?e.disabled:!1,this.alwaysOpen=e.alwaysOpen!==void 0?e.alwaysOpen:!1,this.showSearch=e.showSearch!==void 0?e.showSearch:!0,this.focusSearch=e.focusSearch!==void 0?e.focusSearch:!0,this.ariaLabel=e.ariaLabel||"Combobox",this.searchPlaceholder=e.searchPlaceholder||"Search",this.searchText=e.searchText||"No Results",this.searchingText=e.searchingText||"Searching...",this.searchHighlight=e.searchHighlight!==void 0?e.searchHighlight:!1,this.closeOnSelect=e.closeOnSelect!==void 0?e.closeOnSelect:!0,this.contentLocation=e.contentLocation||document.body,this.contentPosition=e.contentPosition||"absolute",this.openPosition=e.openPosition||"auto",this.placeholderText=e.placeholderText!==void 0?e.placeholderText:"Select Value",this.allowDeselect=e.allowDeselect!==void 0?e.allowDeselect:!1,this.hideSelected=e.hideSelected!==void 0?e.hideSelected:!1,this.keepOrder=e.keepOrder!==void 0?e.keepOrder:!1,this.showOptionTooltips=e.showOptionTooltips!==void 0?e.showOptionTooltips:!1,this.minSelected=e.minSelected||0,this.maxSelected=e.maxSelected||1e3,this.timeoutDelay=e.timeoutDelay||200,this.maxValuesShown=e.maxValuesShown||20,this.maxValuesMessage=e.maxValuesMessage||"{number} selected",this.addableText=e.addableText||'Press "Enter" to add {value}'}}let V=class{selectEl;settings;cssClasses;select;store;render;openTimeout=null;closeTimeout=null;events={search:void 0,searchFilter:(e,t)=>e.text.toLowerCase().indexOf(t.toLowerCase())!==-1,addable:void 0,beforeChange:void 0,afterChange:void 0,beforeOpen:void 0,afterOpen:void 0,beforeClose:void 0,afterClose:void 0};constructor(e){if(this.selectEl=typeof e.select=="string"?document.querySelector(e.select):e.select,!this.selectEl){e.events&&e.events.error&&e.events.error(new Error("Could not find select element"));return}if(this.selectEl.tagName!=="SELECT"){e.events&&e.events.error&&e.events.error(new Error("Element isnt of type select"));return}this.selectEl.dataset.ssid&&this.destroy(),this.settings=new A(e.settings),this.cssClasses=new T(e.cssClasses);const t=["beforeOpen","afterOpen","beforeClose","afterClose"];for(const n in e.events)e.events.hasOwnProperty(n)&&(t.indexOf(n)!==-1?this.events[n]=y(e.events[n],100):this.events[n]=e.events[n]);this.settings.disabled=e.settings?.disabled?e.settings.disabled:this.selectEl.disabled,this.settings.isMultiple=this.selectEl.multiple,this.settings.style=this.selectEl.style.cssText,this.settings.class=this.selectEl.className.split(" "),this.select=new P(this.selectEl),this.select.updateSelect(this.settings.id,this.settings.style,this.settings.class),this.select.hideUI(),this.select.onValueChange=n=>{this.setSelected(n.map(o=>o.id))},this.select.onClassChange=n=>{this.settings.class=n,this.render.updateClassStyles()},this.select.onDisabledChange=n=>{n?this.disable():this.enable()},this.select.onOptionsChange=n=>{this.setData(n)};const s=e.data?e.data:this.select.getData();this.store=new N(this.settings.isMultiple?"multiple":"single",s),e.data&&this.select.updateOptions(this.store.getData());const i={open:this.open.bind(this),close:this.close.bind(this),addable:this.events.addable?this.events.addable:void 0,setSelected:this.setSelected.bind(this),addOption:this.addOption.bind(this),search:this.search.bind(this),beforeChange:this.events.beforeChange,afterChange:this.events.afterChange};this.render=new M(this.settings,this.cssClasses,this.store,i),this.render.renderValues(),this.render.renderOptions(this.store.getData());const l=this.selectEl.getAttribute("aria-label"),a=this.selectEl.getAttribute("aria-labelledby");l?this.render.main.main.setAttribute("aria-label",l):a&&this.render.main.main.setAttribute("aria-labelledby",a),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.selectEl.slim=this}enable(){this.settings.disabled=!1,this.select.enable(),this.render.enable()}disable(){this.settings.disabled=!0,this.select.disable(),this.render.disable()}getData(){return this.store.getData()}setData(e){const t=this.store.getSelected(),s=this.store.validateDataArray(e);if(s){this.events.error&&this.events.error(s);return}this.store.setData(e);const i=this.store.getData();this.select.updateOptions(i),this.render.renderValues(),this.render.renderOptions(i),this.events.afterChange&&!x(t,this.store.getSelected())&&this.events.afterChange(this.store.getSelectedOptions())}getSelected(){let e=this.store.getSelectedOptions();return this.settings.keepOrder&&(e=this.store.selectedOrderOptions(e)),e.map(t=>t.value)}setSelected(e,t=!0){const s=this.store.getSelected(),i=this.store.getDataOptions();e=Array.isArray(e)?e:[e];const l=[];for(const n of e){if(i.find(o=>o.id==n)){l.push(n);continue}for(const o of i.filter(c=>c.value==n))l.push(o.id)}this.store.setSelectedBy("id",l);const a=this.store.getData();this.select.updateOptions(a),this.render.renderValues(),this.render.content.search.input.value!==""?this.search(this.render.content.search.input.value):this.render.renderOptions(a),t&&this.events.afterChange&&!x(s,this.store.getSelected())&&this.events.afterChange(this.store.getSelectedOptions())}addOption(e){const t=this.store.getSelected();this.store.getDataOptions().some(i=>i.value===(e.value??e.text))||this.store.addOption(e);const s=this.store.getData();this.select.updateOptions(s),this.render.renderValues(),this.render.renderOptions(s),this.events.afterChange&&!x(t,this.store.getSelected())&&this.events.afterChange(this.store.getSelectedOptions())}open(){this.settings.disabled||this.settings.isOpen||(this.events.beforeOpen&&this.events.beforeOpen(),this.render.open(),this.settings.showSearch&&this.settings.focusSearch&&this.render.searchFocus(),this.settings.isOpen=!0,this.openTimeout=setTimeout(()=>{this.events.afterOpen&&this.events.afterOpen(),this.settings.isOpen&&(this.settings.isFullOpen=!0),document.addEventListener("click",this.documentClick)},this.settings.timeoutDelay),this.settings.contentPosition==="absolute"&&(this.settings.intervalMove&&clearInterval(this.settings.intervalMove),this.settings.intervalMove=setInterval(this.render.moveContent.bind(this.render),500)))}close(e=null){!this.settings.isOpen||this.settings.alwaysOpen||(this.events.beforeClose&&this.events.beforeClose(),this.render.close(),this.render.clearSearch(),this.render.mainFocus(e),this.settings.isOpen=!1,this.settings.isFullOpen=!1,this.closeTimeout=setTimeout(()=>{this.events.afterClose&&this.events.afterClose(),document.removeEventListener("click",this.documentClick)},this.settings.timeoutDelay),this.settings.intervalMove&&clearInterval(this.settings.intervalMove))}search(e){if(this.render.content.search.input.value!==e&&(this.render.content.search.input.value=e),!this.events.search){const s=e===""?this.store.getData():this.store.search(e,this.events.searchFilter);this.render.renderOptions(s);return}this.render.renderSearching();const t=this.events.search(e,this.store.getSelectedOptions());if(t instanceof Promise){t.then(s=>{this.store.setData(s,!0),this.select.updateOptions(this.store.getData()),this.render.renderOptions(this.store.getData())}).catch(s=>{this.render.renderError(typeof s=="string"?s:s.message)});return}else Array.isArray(t)?(this.store.setData(t,!0),this.select.updateOptions(this.store.getData()),this.render.renderOptions(this.store.getData())):this.render.renderError("Search event must return a promise or an array of data")}destroy(){this.openTimeout&&(clearTimeout(this.openTimeout),this.openTimeout=null),this.closeTimeout&&(clearTimeout(this.closeTimeout),this.closeTimeout=null),this.settings.intervalMove&&(clearInterval(this.settings.intervalMove),this.settings.intervalMove=null),document.removeEventListener("click",this.documentClick),window.removeEventListener("resize",this.windowResize,!1),this.settings.openPosition==="auto"&&window.removeEventListener("scroll",this.windowScroll,!1),document.removeEventListener("visibilitychange",this.windowVisibilityChange),this.store.setData([]),this.render.destroy(),this.select.destroy()}windowResize=y(()=>{!this.settings.isOpen&&!this.settings.isFullOpen||this.render.moveContent()});windowScroll=y(()=>{!this.settings.isOpen&&!this.settings.isFullOpen||this.render.moveContent()});documentClick=e=>{this.settings.isOpen&&e.target&&!D(e.target,this.settings.id)&&this.close(e.type)};windowVisibilityChange=()=>{document.hidden&&this.close()}};const B=S.defineComponent({name:"SlimSelect",props:{modelValue:{type:[String,Array,void 0]},multiple:{type:Boolean,default:!1},data:{type:Array},settings:{type:Object},events:{type:Object,default:()=>({})}},emits:["update:modelValue"],data(){return{slim:null}},mounted(){this.$slots.default&&this.$slots.default().length>0&&this.data&&console.warn("[SlimSelect Vue] Both slot content and data prop are provided. Data prop will take precedence and slot content will be ignored.");let e={select:this.$refs.slim};this.data&&(e.data=this.data),this.settings&&(e.settings=this.settings);const t=this.events?.afterChange;e.events={...this.events,afterChange:i=>{const l=this.multiple?i.map(a=>a.value):i.length>0?i[0].value:"";this.value!==l&&(this.value=l),t&&t(i)}},this.slim=new V(e);let s=this.$props.multiple?this.slim.getSelected():this.slim.getSelected()[0];this.value!==s&&this.slim.setSelected(this.value,!1)},updated(){if(this.slim&&!this.data){const h=this.slim.getSelected(),e=Array.isArray(this.value)?this.value:[this.value];JSON.stringify(h.sort())!==JSON.stringify(e.sort())&&this.slim.setSelected(this.value,!1)}},beforeUnmount(){this.slim&&this.slim.destroy()},watch:{modelValue:{handler:function(h){this.slim&&this.slim.setSelected(this.getCleanValue(h),!1)}},data:{handler:function(h){this.slim&&this.slim.setData(h)},deep:!0}},computed:{value:{get(){return this.getCleanValue(this.$props.modelValue)},set(h){this.$emit("update:modelValue",h)}}},methods:{getSlimSelect(){return this.slim},getCleanValue(h){const e=this.$props.multiple;return typeof h=="string"?e?[h]:h:Array.isArray(h)?e?h:h[0]:e?[]:""}}}),I=(h,e)=>{const t=h.__vccOpts||h;for(const[s,i]of e)t[s]=i;return t},H=["multiple"];function F(h,e,t,s,i,l){return S.openBlock(),S.createElementBlock("select",{multiple:h.multiple,ref:"slim"},[S.renderSlot(h.$slots,"default")],8,H)}const R=I(B,[["render",F]]);b.Optgroup=g,b.Option=p,b.Settings=A,b.default=R,Object.defineProperties(b,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
package/example.html ADDED
@@ -0,0 +1,25 @@
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>SlimSelect Example</title>
7
+ <script src="https://unpkg.com/slim-select@latest/dist/slimselect.js"></script>
8
+ <link href="https://unpkg.com/slim-select@latest/dist/slimselect.css" rel="stylesheet" />
9
+ </head>
10
+ <body>
11
+ <h1>SlimSelect Test</h1>
12
+
13
+ <select id="selectElement">
14
+ <option>Option 1</option>
15
+ <option>Option 2</option>
16
+ <option>Option 3</option>
17
+ </select>
18
+
19
+ <script>
20
+ new SlimSelect({
21
+ select: '#selectElement'
22
+ })
23
+ </script>
24
+ </body>
25
+ </html>
package/index.html CHANGED
@@ -4,11 +4,51 @@
4
4
  <meta charset="UTF-8" />
5
5
  <link rel="icon" href="/favicon.ico" />
6
6
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
- <title>Slim Select</title>
8
- <meta name="description" content="Advanced select dropdown" />
9
- <meta property="og:type" content="article" />
10
- <meta property="og:title" content="Slim Select" />
11
- <meta property="og:description" content="Advanced select dropdown" />
7
+
8
+ <!-- Primary Meta Tags -->
9
+ <title>SlimSelect - Advanced JavaScript Select Dropdown Library | Vanilla JS Multi-select</title>
10
+ <meta name="title" content="SlimSelect - Advanced JavaScript Select Dropdown Library | Vanilla JS Multi-select" />
11
+ <meta
12
+ name="description"
13
+ content="SlimSelect is a lightweight, advanced select dropdown library for vanilla JavaScript. Features multi-select, search, custom styling, and framework support for React and Vue. No jQuery required."
14
+ />
15
+ <meta
16
+ name="keywords"
17
+ content="javascript select dropdown, vanilla js select, multi-select dropdown, searchable select, custom select dropdown, react select component, vue select component, select2 alternative, chosen alternative, lightweight select library"
18
+ />
19
+ <meta name="author" content="Brian Voelker" />
20
+ <meta name="robots" content="index, follow" />
21
+ <link rel="canonical" href="https://slimselectjs.com" />
22
+
23
+ <!-- Open Graph / Facebook -->
24
+ <meta property="og:type" content="website" />
25
+ <meta property="og:url" content="https://slimselectjs.com" />
26
+ <meta property="og:title" content="SlimSelect - Advanced JavaScript Select Dropdown Library" />
27
+ <meta
28
+ property="og:description"
29
+ content="Lightweight, feature-rich select dropdown library for vanilla JavaScript. Multi-select, search, custom styling, and framework support. No jQuery required."
30
+ />
31
+ <meta property="og:image" content="https://slimselectjs.com/slimselect.gif" />
32
+ <meta property="og:site_name" content="SlimSelect" />
33
+ <meta property="og:locale" content="en_US" />
34
+
35
+ <!-- Twitter -->
36
+ <meta property="twitter:card" content="summary_large_image" />
37
+ <meta property="twitter:url" content="https://slimselectjs.com" />
38
+ <meta property="twitter:title" content="SlimSelect - Advanced JavaScript Select Dropdown Library" />
39
+ <meta
40
+ property="twitter:description"
41
+ content="Lightweight, feature-rich select dropdown library for vanilla JavaScript. Multi-select, search, custom styling, and framework support."
42
+ />
43
+ <meta property="twitter:image" content="https://slimselectjs.com/slimselect.gif" />
44
+
45
+ <!-- Additional Meta Tags -->
46
+ <meta name="theme-color" content="#5897fb" />
47
+ <meta name="apple-mobile-web-app-capable" content="yes" />
48
+ <meta name="apple-mobile-web-app-status-bar-style" content="default" />
49
+ <meta name="apple-mobile-web-app-title" content="SlimSelect" />
50
+
51
+ <!-- Google AdSense -->
12
52
  <meta name="google-adsense-account" content="ca-pub-4428453911800052" />
13
53
  </head>
14
54
  <body>
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "slim-select",
3
3
  "description": "Slim advanced select dropdown",
4
- "version": "3.0.1",
4
+ "version": "3.0.3",
5
5
  "type": "module",
6
6
  "author": "Brian Voelker <brian@webiswhatido.com> (http://webiswhatido.com)",
7
7
  "homepage": "https://slimselectjs.com",
@@ -51,9 +51,11 @@
51
51
  "format": "prettier --write --cache --parser typescript \"src/**/*.ts\"",
52
52
  "build": "npm run typecheck && npm run build:clean && npm run build:library && npm run build:docs",
53
53
  "build:clean": "rimraf ./dist/* && rimraf ./docs/*",
54
- "build:docs": "vite build --config vite.config.docs.mts",
54
+ "build:docs": "npm run generate:sitemap && vite build --config vite.config.docs.mts",
55
55
  "build:library": "npm run build:library:js && npm run build:library:vue && npm run build:library:react && npm run build:library:css",
56
- "build:library:js": "vite build --config vite.config.lib.mts",
56
+ "build:library:js": "npm run build:es-cjs && npm run build:umd-iife",
57
+ "build:es-cjs": "vite build --config vite.config.lib.es-cjs.ts",
58
+ "build:umd-iife": "vite build --config vite.config.lib.umd-iife.ts",
57
59
  "build:library:vue": "vite build --config vite.config.vue.mts",
58
60
  "build:library:react": "vite build --config vite.config.react.mts",
59
61
  "build:library:css": "sass src/slim-select/slimselect.scss dist/slimselect.css --style=compressed",
@@ -62,6 +64,7 @@
62
64
  "test": "vitest run",
63
65
  "test:watch": "vitest",
64
66
  "test:coverage": "vitest run --coverage",
67
+ "generate:sitemap": "node sitemap.js",
65
68
  "release": "node release.js"
66
69
  },
67
70
  "devDependencies": {