slim-select 3.4.3 → 3.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (73) hide show
  1. package/dist/classes.d.ts +47 -0
  2. package/dist/helpers.d.ts +5 -0
  3. package/dist/index.d.ts +53 -319
  4. package/dist/index.umd.d.ts +2 -0
  5. package/dist/react/index.d.ts +4 -319
  6. package/dist/react/index.js +1471 -1697
  7. package/dist/react/index.umd.js +2 -2
  8. package/dist/react/react.d.ts +17 -0
  9. package/dist/react/react.test.d.ts +1 -0
  10. package/dist/react/slim-select/react/index.d.ts +4 -0
  11. package/dist/render.d.ts +90 -0
  12. package/dist/select.d.ts +38 -0
  13. package/dist/settings.d.ts +40 -0
  14. package/dist/slimselect.cjs.js +2 -2
  15. package/dist/slimselect.cjs.js.map +1 -1
  16. package/dist/slimselect.css +1 -1
  17. package/dist/slimselect.css.map +1 -1
  18. package/dist/slimselect.es.js +1245 -1385
  19. package/dist/slimselect.es.js.map +1 -1
  20. package/dist/slimselect.iife.js +2 -2
  21. package/dist/slimselect.iife.js.map +1 -1
  22. package/dist/slimselect.js +2 -2
  23. package/dist/slimselect.js.map +1 -1
  24. package/dist/src/docs/main.d.ts +0 -0
  25. package/dist/src/docs/router.d.ts +2 -0
  26. package/dist/src/docs/store.d.ts +12 -0
  27. package/dist/store.d.ts +53 -0
  28. package/dist/vue/index.d.ts +4 -319
  29. package/dist/vue/index.js +1347 -1504
  30. package/dist/vue/index.umd.js +1 -1
  31. package/dist/vue/slim-select/vue/index.d.ts +4 -0
  32. package/package.json +30 -36
  33. package/src/slim-select/slimselect.scss +47 -5
  34. package/.nvmrc +0 -1
  35. package/.prettierignore +0 -1
  36. package/.prettierrc +0 -7
  37. package/CODE_OF_CONDUCT.md +0 -46
  38. package/CONTRIBUTING.md +0 -1
  39. package/cdn.html +0 -21
  40. package/docs.go +0 -12
  41. package/example.html +0 -25
  42. package/index.html +0 -76
  43. package/release.js +0 -191
  44. package/sitemap.js +0 -108
  45. package/src/slim-select/accessibility.test.ts +0 -782
  46. package/src/slim-select/classes.test.ts +0 -73
  47. package/src/slim-select/classes.ts +0 -117
  48. package/src/slim-select/helpers.test.ts +0 -162
  49. package/src/slim-select/helpers.ts +0 -61
  50. package/src/slim-select/index.test.ts +0 -1356
  51. package/src/slim-select/index.ts +0 -594
  52. package/src/slim-select/index.umd.ts +0 -8
  53. package/src/slim-select/react/index.tsx +0 -9
  54. package/src/slim-select/react/react.test.tsx +0 -498
  55. package/src/slim-select/react/react.tsx +0 -209
  56. package/src/slim-select/render.test.ts +0 -1927
  57. package/src/slim-select/render.ts +0 -1771
  58. package/src/slim-select/select.test.ts +0 -683
  59. package/src/slim-select/select.ts +0 -659
  60. package/src/slim-select/settings.test.ts +0 -285
  61. package/src/slim-select/settings.ts +0 -78
  62. package/src/slim-select/store.test.ts +0 -1007
  63. package/src/slim-select/store.ts +0 -433
  64. package/src/slim-select/vue/index.ts +0 -9
  65. package/src/slim-select/vue/vue.test.ts +0 -1091
  66. package/src/slim-select/vue/vue.vue +0 -224
  67. package/tsconfig.json +0 -26
  68. package/vite.config.docs.mts +0 -29
  69. package/vite.config.lib.es-cjs.ts +0 -40
  70. package/vite.config.lib.umd-iife.ts +0 -34
  71. package/vite.config.react.mts +0 -41
  72. package/vite.config.vue.mts +0 -40
  73. package/vitest.config.ts +0 -30
@@ -1,1391 +1,1251 @@
1
- class T {
2
- main;
3
- // Placeholder
4
- placeholder;
5
- // Values
6
- values;
7
- single;
8
- max;
9
- value;
10
- valueText;
11
- valueDelete;
12
- valueOut;
13
- // Deselect
14
- deselect;
15
- deselectPath;
16
- // Not a class but whatever
17
- // Arrow
18
- arrow;
19
- arrowClose;
20
- // Not a class but whatever
21
- arrowOpen;
22
- // Not a class but whatever
23
- // Content
24
- content;
25
- contentOpen;
26
- dirAbove;
27
- dirBelow;
28
- // Search
29
- search;
30
- searchHighlighter;
31
- searching;
32
- addable;
33
- addablePath;
34
- // Not a class but whatever
35
- // List optgroups/options
36
- list;
37
- // Optgroup
38
- optgroup;
39
- optgroupLabel;
40
- optgroupLabelText;
41
- optgroupActions;
42
- optgroupSelectAll;
43
- // optgroup select all
44
- optgroupSelectAllBox;
45
- // Not a class but whatever
46
- optgroupSelectAllCheck;
47
- // Not a class but whatever
48
- optgroupClosable;
49
- // Option
50
- option;
51
- optionDelete;
52
- // Not a class but whatever
53
- highlighted;
54
- // Misc
55
- mainOpen;
56
- close;
57
- selected;
58
- error;
59
- disabled;
60
- hide;
61
- constructor(e) {
62
- e || (e = {});
63
- let t = (s = "", i = "") => `${s} ${i}`.trim();
64
- this.main = t("ss-main", e.main), this.placeholder = t("ss-placeholder", e.placeholder), this.values = t("ss-values", e.values), this.single = t("ss-single", e.single), this.max = t("ss-max", e.max), this.value = t("ss-value", e.value), this.valueText = t("ss-value-text", e.valueText), this.valueDelete = t("ss-value-delete", e.valueDelete), this.valueOut = t("ss-value-out", e.valueOut), this.deselect = t("ss-deselect", e.deselect), this.deselectPath = e.deselectPath || "M10,10 L90,90 M10,90 L90,10", this.arrow = t("ss-arrow", e.arrow), this.arrowClose = e.arrowClose || "M10,30 L50,70 L90,30", this.arrowOpen = e.arrowOpen || "M10,70 L50,30 L90,70", this.content = t("ss-content", e.content), this.contentOpen = t("ss-open", e.contentOpen), this.dirAbove = t("ss-dir-above", e.dirAbove), this.dirBelow = t("ss-dir-below", e.dirBelow), this.search = t("ss-search", e.search), this.searchHighlighter = t("ss-search-highlight", e.searchHighlighter), this.searching = t("ss-searching", e.searching), this.addable = t("ss-addable", e.addable), this.addablePath = e.addablePath || "M50,10 L50,90 M10,50 L90,50", this.list = t("ss-list", e.list), this.optgroup = t("ss-optgroup", e.optgroup), this.optgroupLabel = t("ss-optgroup-label", e.optgroupLabel), this.optgroupLabelText = t("ss-optgroup-label-text", e.optgroupLabelText), this.optgroupActions = t("ss-optgroup-actions", e.optgroupActions), this.optgroupSelectAll = t("ss-selectall", e.optgroupSelectAll), 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 = t("ss-closable", e.optgroupClosable), this.option = t("ss-option", e.option), this.optionDelete = e.optionDelete || "M10,10 L90,90 M10,90 L90,10", this.highlighted = t("ss-highlighted", e.highlighted), this.mainOpen = t("ss-open", e.mainOpen), this.close = t("ss-close", e.close), this.selected = t("ss-selected", e.selected), this.error = t("ss-error", e.error), this.disabled = t("ss-disabled", e.disabled), this.hide = t("ss-hide", e.hide);
65
- }
66
- getFirst(e) {
67
- return this[e].split(" ")[0];
68
- }
69
- }
70
- function y() {
71
- return Math.random().toString(36).substring(2, 10);
72
- }
73
- function x(f, e) {
74
- function t(i, n) {
75
- return n && i && i.classList && i.classList.contains(n) || n && i && i.dataset && i.dataset.id && i.dataset.id === e ? i : null;
76
- }
77
- function s(i, n) {
78
- return !i || i === document ? null : t(i, n) ? i : s(i.parentNode, n);
79
- }
80
- return t(f, e) || s(f, e);
81
- }
82
- function S(f, e = 50, t = !1) {
83
- let s;
84
- return function(...i) {
85
- const n = self, l = () => {
86
- s = null, t || f.apply(n, i);
87
- }, a = t && !s;
88
- clearTimeout(s), s = setTimeout(l, e), a && f.apply(n, i);
89
- };
90
- }
91
- function O(f, e) {
92
- return JSON.stringify(f) === JSON.stringify(e);
93
- }
94
- function D(f) {
95
- const e = f.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g, (t) => "-" + t.toLowerCase());
96
- return f[0] === f[0].toUpperCase() ? e.substring(1) : e;
97
- }
98
- class u {
99
- id;
100
- value;
101
- text;
102
- html;
103
- defaultSelected;
104
- selected;
105
- display;
106
- disabled;
107
- placeholder;
108
- class;
109
- style;
110
- data;
111
- mandatory;
112
- constructor(e) {
113
- 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 || {};
114
- }
115
- }
116
- class m {
117
- id;
118
- label;
119
- selectAll;
120
- selectAllText;
121
- closable;
122
- options;
123
- constructor(e) {
124
- if (this.id = !e.id || e.id === "" ? y() : 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)
125
- for (const t of e.options)
126
- this.options.push(new u(t));
127
- }
128
- }
129
- class k {
130
- selectType = "single";
131
- // Main data set, never null
132
- data = [];
133
- selectedOrder = [];
134
- constructor(e, t) {
135
- this.selectType = e, this.setData(t);
136
- }
137
- // Validate DataArrayPartial
138
- validateDataArray(e) {
139
- if (!Array.isArray(e))
140
- return new Error("Data must be an array");
141
- for (let t of e)
142
- if (t)
143
- if (t instanceof m || "label" in t) {
144
- if (!("label" in t))
145
- return new Error("Optgroup must have a label");
146
- if ("options" in t && t.options)
147
- for (let s of t.options) {
148
- const i = this.validateOption(s);
149
- if (i)
150
- return i;
151
- }
152
- } else if (t instanceof u || "text" in t) {
153
- const s = this.validateOption(t);
154
- if (s)
155
- return s;
156
- } else
157
- return new Error("Data object must be a valid optgroup or option");
158
- return null;
159
- }
160
- // Validate Option
161
- validateOption(e) {
162
- return "text" in e ? null : new Error("Option must have a text");
163
- }
164
- partialToFullData(e) {
165
- let t = [];
166
- return e.forEach((s) => {
167
- if (s) {
168
- if (s instanceof m || "label" in s) {
169
- let i = [];
170
- "options" in s && s.options && s.options.forEach((n) => {
171
- i.push(new u(n));
172
- }), i.length > 0 && t.push(new m(s));
173
- }
174
- (s instanceof u || "text" in s) && t.push(new u(s));
175
- }
176
- }), t;
177
- }
178
- setData(e, t = !1) {
179
- const s = this.partialToFullData(e);
180
- let i = [];
181
- if (t) {
182
- i = this.getSelectedOptions();
183
- const n = [];
184
- i.forEach((l) => {
185
- let a = !1;
186
- for (const o of s) {
187
- if (o instanceof u && o.id === l.id) {
188
- a = !0;
189
- break;
190
- }
191
- if (o instanceof m) {
192
- for (const h of o.options)
193
- if (h.id === l.id) {
194
- a = !0;
195
- break;
196
- }
197
- }
198
- }
199
- a || n.push(l);
200
- }), this.data = [...n, ...s];
201
- } else
202
- this.data = s;
203
- if (this.selectType === "single") {
204
- const n = t && i.length === 0;
205
- this.setSelectedBy("id", this.getSelected(), n);
206
- }
207
- }
208
- // Get data will return all the data
209
- getData() {
210
- return this.filter(null, !0);
211
- }
212
- // Get data options will return the data as a
213
- // flat array of just options
214
- getDataOptions() {
215
- return this.filter(null, !1);
216
- }
217
- addOption(e, t = !1) {
218
- if (t) {
219
- let s = [new u(e)];
220
- this.setData(s.concat(this.getData()));
221
- } else
222
- this.setData(this.getData().concat(new u(e)));
223
- }
224
- // Pass in an array of id that will loop through
225
- // each option and set the selected property to true
226
- // but also clean selected by determining selectType
227
- // When allowEmptySelection is true (e.g. after search with no prior selection), single select will not auto-select the first option
228
- setSelectedBy(e, t, s = !1) {
229
- let i = null, n = !1;
230
- const l = [];
231
- for (let o of this.data) {
232
- if (o instanceof m)
233
- for (let h of o.options) {
234
- i || (i = h);
235
- let r = h[e] || "";
236
- h.selected = n ? !1 : t.includes(r), h.selected && (l.push(h), this.selectType === "single" && (n = !0));
237
- }
238
- o instanceof u && (i || (i = o), o.selected = n ? !1 : t.includes(o[e]), o.selected && (l.push(o), this.selectType === "single" && (n = !0)));
239
- }
240
- this.selectType === "single" && i && !n && !s && (i.selected = !0, l.push(i));
241
- const a = t.map((o) => l.find((h) => h[e] === o)?.id || "");
242
- this.selectedOrder = a;
243
- }
244
- getSelected() {
245
- return this.getSelectedOptions().map((e) => e.id);
246
- }
247
- getSelectedValues() {
248
- return this.getSelectedOptions().map((e) => e.value);
249
- }
250
- getSelectedOptions() {
251
- return this.filter((e) => e.selected, !1);
252
- }
253
- getOptgroupByID(e) {
254
- for (let t of this.data)
255
- if (t instanceof m && t.id === e)
256
- return t;
257
- return null;
258
- }
259
- getOptionByID(e) {
260
- let t = this.filter((s) => s.id === e, !1);
261
- return t.length ? t[0] : null;
262
- }
263
- getSelectType() {
264
- return this.selectType;
265
- }
266
- getFirstOption() {
267
- let e = null;
268
- for (let t of this.data)
269
- if (t instanceof m ? e = t.options[0] : t instanceof u && (e = t), e)
270
- break;
271
- return e;
272
- }
273
- // Take in search string and return filtered list of values
274
- search(e, t) {
275
- return e = e.trim(), e === "" ? this.getData() : this.filter((s) => t(s, e), !0);
276
- }
277
- // Filter takes in a function that will be used to filter the data
278
- // This will also keep optgroups of sub options meet the filter requirements
279
- filter(e, t) {
280
- const s = [];
281
- return this.data.forEach((i) => {
282
- if (i instanceof m) {
283
- let n = [];
284
- if (i.options.forEach((a) => {
285
- (!e || e(a)) && (t ? n.push(new u(a)) : s.push(new u(a)));
286
- }), n.length > 0) {
287
- let a = new m(i);
288
- a.options = n, s.push(a);
289
- }
290
- }
291
- i instanceof u && (!e || e(i)) && s.push(new u(i));
292
- }), s;
293
- }
294
- // Take in an array of options and reoder them based upon the selected order
295
- selectedOrderOptions(e) {
296
- const t = [];
297
- return this.selectedOrder.forEach((s) => {
298
- const i = e.find((n) => n.id === s);
299
- i && t.push(i);
300
- }), e.forEach((s) => {
301
- let i = !1;
302
- t.forEach((n) => {
303
- if (s.id === n.id) {
304
- i = !0;
305
- return;
306
- }
307
- }), i || t.push(s);
308
- }), t;
309
- }
1
+ //#region src/slim-select/classes.ts
2
+ var e = class {
3
+ main;
4
+ placeholder;
5
+ values;
6
+ single;
7
+ multiString;
8
+ max;
9
+ value;
10
+ valueText;
11
+ valueDelete;
12
+ valueOut;
13
+ deselect;
14
+ deselectPath;
15
+ arrow;
16
+ arrowClose;
17
+ arrowOpen;
18
+ content;
19
+ contentOpen;
20
+ dirAbove;
21
+ dirBelow;
22
+ search;
23
+ searchHighlighter;
24
+ searching;
25
+ status;
26
+ addable;
27
+ addablePath;
28
+ list;
29
+ optgroup;
30
+ optgroupLabel;
31
+ optgroupLabelText;
32
+ optgroupActions;
33
+ optgroupSelectAll;
34
+ optgroupSelectAllBox;
35
+ optgroupSelectAllCheck;
36
+ optgroupClosable;
37
+ option;
38
+ optionDelete;
39
+ highlighted;
40
+ mainOpen;
41
+ close;
42
+ selected;
43
+ error;
44
+ disabled;
45
+ hide;
46
+ constructor(e) {
47
+ e ||= {};
48
+ let t = (e = "", t = "") => `${e} ${t}`.trim();
49
+ this.main = t("ss-main", e.main), this.placeholder = t("ss-placeholder", e.placeholder), this.values = t("ss-values", e.values), this.single = t("ss-single", e.single), this.multiString = t("ss-multi-string", e.multiString), this.max = t("ss-max", e.max), this.value = t("ss-value", e.value), this.valueText = t("ss-value-text", e.valueText), this.valueDelete = t("ss-value-delete", e.valueDelete), this.valueOut = t("ss-value-out", e.valueOut), this.deselect = t("ss-deselect", e.deselect), this.deselectPath = e.deselectPath || "M10,10 L90,90 M10,90 L90,10", this.arrow = t("ss-arrow", e.arrow), this.arrowClose = e.arrowClose || "M10,30 L50,70 L90,30", this.arrowOpen = e.arrowOpen || "M10,70 L50,30 L90,70", this.content = t("ss-content", e.content), this.contentOpen = t("ss-open", e.contentOpen), this.dirAbove = t("ss-dir-above", e.dirAbove), this.dirBelow = t("ss-dir-below", e.dirBelow), this.search = t("ss-search", e.search), this.searchHighlighter = t("ss-search-highlight", e.searchHighlighter), this.searching = t("ss-searching", e.searching), this.status = t("ss-status", e.status), this.addable = t("ss-addable", e.addable), this.addablePath = e.addablePath || "M50,10 L50,90 M10,50 L90,50", this.list = t("ss-list", e.list), this.optgroup = t("ss-optgroup", e.optgroup), this.optgroupLabel = t("ss-optgroup-label", e.optgroupLabel), this.optgroupLabelText = t("ss-optgroup-label-text", e.optgroupLabelText), this.optgroupActions = t("ss-optgroup-actions", e.optgroupActions), this.optgroupSelectAll = t("ss-selectall", e.optgroupSelectAll), 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 = t("ss-closable", e.optgroupClosable), this.option = t("ss-option", e.option), this.optionDelete = e.optionDelete || "M10,10 L90,90 M10,90 L90,10", this.highlighted = t("ss-highlighted", e.highlighted), this.mainOpen = t("ss-open", e.mainOpen), this.close = t("ss-close", e.close), this.selected = t("ss-selected", e.selected), this.error = t("ss-error", e.error), this.disabled = t("ss-disabled", e.disabled), this.hide = t("ss-hide", e.hide);
50
+ }
51
+ getFirst(e) {
52
+ return this[e].split(" ")[0];
53
+ }
54
+ };
55
+ //#endregion
56
+ //#region src/slim-select/helpers.ts
57
+ function t() {
58
+ return Math.random().toString(36).substring(2, 10);
310
59
  }
311
- class N {
312
- settings;
313
- store;
314
- callbacks;
315
- // Used to compute the range selection
316
- lastSelectedOption;
317
- lastRenderedOptions;
318
- // Timeout tracking for cleanup
319
- closeAnimationTimeout = null;
320
- // Elements
321
- main;
322
- content;
323
- // Classes
324
- classes;
325
- constructor(e, t, s, i) {
326
- this.store = s, this.settings = e, this.classes = t, this.callbacks = i, this.lastSelectedOption = null, this.lastRenderedOptions = [], this.main = this.mainDiv(), this.content = this.contentDiv(), this.updateClassStyles(), this.updateAriaAttributes(), this.settings.contentPosition !== "relative" && (this.content.main.style.top = "-9999px", this.content.main.style.left = "-9999px", this.content.main.style.margin = "0", this.content.main.style.width = "auto"), this.settings.contentLocation && this.settings.contentLocation.appendChild(this.content.main);
327
- }
328
- // Helper method to add classes that may contain spaces
329
- // Splits by spaces and adds each class individually to avoid DOMException
330
- addClasses(e, t) {
331
- if (!t || t.trim() === "")
332
- return;
333
- const s = t.split(" ").filter((i) => i.trim() !== "");
334
- for (const i of s)
335
- e.classList.add(i.trim());
336
- }
337
- // Helper method to remove classes that may contain spaces
338
- removeClasses(e, t) {
339
- if (!t || t.trim() === "")
340
- return;
341
- const s = t.split(" ").filter((i) => i.trim() !== "");
342
- for (const i of s)
343
- e.classList.remove(i.trim());
344
- }
345
- // Remove disabled classes
346
- enable() {
347
- this.removeClasses(this.main.main, this.classes.disabled), this.main.main.setAttribute("aria-disabled", "false"), this.content.search.input.disabled = !1;
348
- }
349
- // Set disabled classes
350
- disable() {
351
- this.addClasses(this.main.main, this.classes.disabled), this.main.main.setAttribute("aria-disabled", "true"), this.content.search.input.disabled = !0;
352
- }
353
- open() {
354
- this.main.arrow.path.setAttribute("d", this.classes.arrowOpen), this.main.main.setAttribute("aria-expanded", "true"), this.closeAnimationTimeout && (clearTimeout(this.closeAnimationTimeout), this.closeAnimationTimeout = null);
355
- const t = this.settings.openPosition === "up" ? this.classes.dirAbove : this.classes.dirBelow;
356
- this.addClasses(this.main.main, t), this.addClasses(this.content.main, t), this.addClasses(this.content.main, this.classes.contentOpen), this.content.search.input.removeAttribute("aria-hidden"), this.moveContent();
357
- const s = this.store.getSelectedOptions();
358
- if (s.length) {
359
- const i = s[s.length - 1].id, n = this.content.list.querySelector('[data-id="' + i + '"]');
360
- n && this.ensureElementInView(this.content.list, n);
361
- }
362
- }
363
- close() {
364
- this.main.main.setAttribute("aria-expanded", "false"), this.main.arrow.path.setAttribute("d", this.classes.arrowClose), this.removeClasses(this.content.main, this.classes.contentOpen), this.content.search.input.setAttribute("aria-hidden", "true"), this.main.main.removeAttribute("aria-activedescendant");
365
- const e = this.getAnimationTiming();
366
- this.closeAnimationTimeout = setTimeout(() => {
367
- this.removeClasses(this.main.main, this.classes.dirAbove), this.removeClasses(this.main.main, this.classes.dirBelow), this.removeClasses(this.content.main, this.classes.dirAbove), this.removeClasses(this.content.main, this.classes.dirBelow), this.closeAnimationTimeout = null;
368
- }, e);
369
- }
370
- getAnimationTiming() {
371
- const t = getComputedStyle(this.content.main).getPropertyValue("--ss-animation-timing").trim();
372
- if (t) {
373
- if (t.endsWith("ms"))
374
- return parseFloat(t);
375
- if (t.endsWith("s"))
376
- return parseFloat(t) * 1e3;
377
- }
378
- return 200;
379
- }
380
- updateClassStyles() {
381
- if (this.main.main.className = "", this.main.main.removeAttribute("style"), this.content.main.className = "", this.content.main.removeAttribute("style"), this.addClasses(this.main.main, this.classes.main), this.addClasses(this.content.main, 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)
382
- for (const e of this.settings.class)
383
- e.trim() !== "" && (this.main.main.classList.add(e.trim()), this.content.main.classList.add(e.trim()));
384
- (this.settings.contentPosition === "relative" || this.settings.contentPosition === "fixed") && this.content.main.classList.add("ss-" + this.settings.contentPosition);
385
- }
386
- updateAriaAttributes() {
387
- const e = this.content.list.id;
388
- 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);
389
- }
390
- mainDiv() {
391
- const e = document.createElement("div");
392
- e.dataset.id = this.settings.id, e.setAttribute("aria-label", this.settings.ariaLabel), e.tabIndex = 0, e.onkeydown = (h) => {
393
- switch (h.key) {
394
- case "ArrowUp":
395
- case "ArrowDown":
396
- return this.callbacks.open(), h.key === "ArrowDown" ? this.highlight("down") : this.highlight("up"), !1;
397
- case "Tab":
398
- return this.callbacks.close(), !0;
399
- // Continue doing normal tabbing
400
- case "Enter":
401
- case " ":
402
- this.callbacks.open();
403
- const r = this.content.list.querySelector(
404
- "." + this.classes.getFirst("highlighted")
405
- );
406
- return r && r.click(), !1;
407
- case "Escape":
408
- return this.callbacks.close(), !1;
409
- }
410
- return h.key.length === 1 && this.callbacks.open(), !0;
411
- }, e.onclick = (h) => {
412
- this.settings.disabled || (this.settings.isOpen ? this.callbacks.close() : this.callbacks.open());
413
- };
414
- const t = document.createElement("div");
415
- this.addClasses(t, this.classes.values), e.appendChild(t);
416
- const s = document.createElement("div");
417
- this.addClasses(s, this.classes.deselect);
418
- const i = this.store?.getSelectedOptions();
419
- !this.settings.allowDeselect || this.settings.isMultiple && i && i.length <= 0 ? this.addClasses(s, this.classes.hide) : this.removeClasses(s, this.classes.hide), s.onclick = (h) => {
420
- if (h.stopPropagation(), this.settings.disabled)
421
- return;
422
- let r = !0;
423
- const c = this.store.getSelectedOptions(), p = [];
424
- if (this.callbacks.beforeChange && (r = this.callbacks.beforeChange(p, c) === !0), r) {
425
- if (this.settings.isMultiple)
426
- this.callbacks.setSelected([], !1), this.updateDeselectAll();
427
- else {
428
- const d = this.store.getFirstOption(), g = d ? d.id : "";
429
- this.callbacks.setSelected(g, !1);
430
- }
431
- this.settings.closeOnSelect && this.callbacks.close(), this.callbacks.afterChange && this.callbacks.afterChange(this.store.getSelectedOptions());
432
- }
433
- };
434
- const n = document.createElementNS("http://www.w3.org/2000/svg", "svg");
435
- n.setAttribute("viewBox", "0 0 100 100");
436
- const l = document.createElementNS("http://www.w3.org/2000/svg", "path");
437
- l.setAttribute("d", this.classes.deselectPath), n.appendChild(l), s.appendChild(n), e.appendChild(s);
438
- const a = document.createElementNS("http://www.w3.org/2000/svg", "svg");
439
- this.addClasses(a, this.classes.arrow), a.setAttribute("viewBox", "0 0 100 100");
440
- const o = document.createElementNS("http://www.w3.org/2000/svg", "path");
441
- return o.setAttribute("d", this.classes.arrowClose), this.settings.alwaysOpen && this.addClasses(a, this.classes.hide), a.appendChild(o), e.appendChild(a), {
442
- main: e,
443
- values: t,
444
- deselect: {
445
- main: s,
446
- svg: n,
447
- path: l
448
- },
449
- arrow: {
450
- main: a,
451
- path: o
452
- }
453
- };
454
- }
455
- mainFocus(e) {
456
- e !== "click" && this.main.main.focus({ preventScroll: !0 });
457
- }
458
- placeholder() {
459
- const e = this.store.filter((i) => i.placeholder, !1);
460
- let t = this.settings.placeholderText;
461
- e.length && (e[0].html !== "" ? t = e[0].html : e[0].text !== "" && (t = e[0].text));
462
- const s = document.createElement("div");
463
- return this.addClasses(s, this.classes.placeholder), s.innerHTML = t, s;
464
- }
465
- // Get selected values and append to multiSelected values container
466
- // and remove those who shouldnt exist
467
- renderValues() {
468
- if (!this.settings.isMultiple) {
469
- this.renderSingleValue();
470
- return;
471
- }
472
- this.renderMultipleValues(), this.updateDeselectAll();
473
- }
474
- renderSingleValue() {
475
- const e = this.store.filter((s) => s.selected && !s.placeholder, !1), t = e.length > 0 ? e[0] : null;
476
- if (!t)
477
- this.main.values.innerHTML = this.placeholder().outerHTML;
478
- else {
479
- const s = document.createElement("div");
480
- this.addClasses(s, this.classes.single), t.html ? s.innerHTML = t.html : s.innerText = t.text, this.main.values.innerHTML = s.outerHTML;
481
- }
482
- !this.settings.allowDeselect || !e.length ? this.addClasses(this.main.deselect.main, this.classes.hide) : this.removeClasses(this.main.deselect.main, this.classes.hide);
483
- }
484
- renderMultipleValues() {
485
- let e = this.main.values.childNodes, t = this.store.filter((i) => i.selected && i.display, !1);
486
- if (t.length === 0) {
487
- this.main.values.innerHTML = this.placeholder().outerHTML;
488
- return;
489
- } else {
490
- const i = this.main.values.querySelector("." + this.classes.getFirst("placeholder"));
491
- i && i.remove();
492
- }
493
- if (t.length > this.settings.maxValuesShown) {
494
- const i = document.createElement("div");
495
- this.addClasses(i, this.classes.max), i.textContent = this.settings.maxValuesMessage.replace("{number}", t.length.toString()), this.main.values.innerHTML = i.outerHTML;
496
- return;
497
- } else {
498
- const i = this.main.values.querySelector("." + this.classes.getFirst("max"));
499
- i && i.remove();
500
- }
501
- this.settings.keepOrder && (t = this.store.selectedOrderOptions(t));
502
- let s = [];
503
- for (let i = 0; i < e.length; i++) {
504
- const n = e[i], l = n.getAttribute("data-id");
505
- l && (t.filter((o) => o.id === l, !1).length || s.push(n));
506
- }
507
- for (const i of s)
508
- this.addClasses(i, this.classes.valueOut), setTimeout(() => {
509
- this.main.values.hasChildNodes() && this.main.values.contains(i) && this.main.values.removeChild(i);
510
- }, 100);
511
- e = this.main.values.childNodes;
512
- for (let i = 0; i < t.length; i++) {
513
- let n = !0;
514
- for (let l = 0; l < e.length; l++)
515
- t[i].id === String(e[l].dataset.id) && (n = !1);
516
- n && (this.settings.keepOrder ? this.main.values.appendChild(this.multipleValue(t[i])) : e.length === 0 ? this.main.values.appendChild(this.multipleValue(t[i])) : i === 0 ? this.main.values.insertBefore(this.multipleValue(t[i]), e[i]) : e[i - 1].insertAdjacentElement("afterend", this.multipleValue(t[i])));
517
- }
518
- }
519
- multipleValue(e) {
520
- const t = document.createElement("div");
521
- this.addClasses(t, this.classes.value), t.dataset.id = e.id;
522
- const s = document.createElement("div");
523
- if (this.addClasses(s, this.classes.valueText), s.textContent = e.text, t.appendChild(s), !e.mandatory) {
524
- const i = document.createElement("div");
525
- this.addClasses(i, this.classes.valueDelete), i.setAttribute("tabindex", "0"), i.onclick = (a) => {
526
- if (a.preventDefault(), a.stopPropagation(), this.settings.disabled)
527
- return;
528
- let o = !0;
529
- const h = this.store.getSelectedOptions(), r = h.filter((c) => c.selected && c.id !== e.id, !0);
530
- if (!(this.settings.minSelected && r.length < this.settings.minSelected) && (this.callbacks.beforeChange && (o = this.callbacks.beforeChange(r, h) === !0), o)) {
531
- let c = [];
532
- for (const p of r) {
533
- if (p instanceof m)
534
- for (const d of p.options)
535
- d.id && c.push(d.id);
536
- p instanceof u && c.push(p.id);
537
- }
538
- this.callbacks.setSelected(c, !1), this.settings.closeOnSelect && this.callbacks.close(), this.callbacks.afterChange && this.callbacks.afterChange(r), this.updateDeselectAll();
539
- }
540
- };
541
- const n = document.createElementNS("http://www.w3.org/2000/svg", "svg");
542
- n.setAttribute("viewBox", "0 0 100 100");
543
- const l = document.createElementNS("http://www.w3.org/2000/svg", "path");
544
- l.setAttribute("d", this.classes.optionDelete), n.appendChild(l), i.appendChild(n), t.appendChild(i), i.onkeydown = (a) => {
545
- a.key === "Enter" && i.click();
546
- };
547
- }
548
- return t;
549
- }
550
- contentDiv() {
551
- const e = document.createElement("div");
552
- e.dataset.id = this.settings.id;
553
- const t = this.searchDiv();
554
- e.appendChild(t.main);
555
- const s = this.listDiv();
556
- return e.appendChild(s), {
557
- main: e,
558
- search: t,
559
- list: s
560
- };
561
- }
562
- moveContent() {
563
- if (this.settings.contentPosition === "relative") {
564
- this.moveContentBelow();
565
- return;
566
- }
567
- if (this.settings.openPosition === "down") {
568
- this.moveContentBelow();
569
- return;
570
- } else if (this.settings.openPosition === "up") {
571
- this.moveContentAbove();
572
- return;
573
- }
574
- this.putContent() === "up" ? this.moveContentAbove() : this.moveContentBelow();
575
- }
576
- searchDiv() {
577
- const e = document.createElement("div"), t = document.createElement("input"), s = document.createElement("div");
578
- this.addClasses(e, this.classes.search);
579
- const i = {
580
- main: e,
581
- input: t
582
- };
583
- if (this.settings.showSearch || (this.addClasses(e, this.classes.hide), t.readOnly = !0), t.type = "search", t.placeholder = this.settings.searchPlaceholder, t.tabIndex = -1, t.setAttribute("aria-label", this.settings.searchPlaceholder), t.setAttribute("aria-autocomplete", "list"), t.setAttribute("autocapitalize", "off"), t.setAttribute("autocomplete", "off"), t.setAttribute("autocorrect", "off"), t.setAttribute("aria-hidden", "true"), t.oninput = S((n) => {
584
- this.callbacks.search(n.target.value);
585
- }, 100), t.onkeydown = (n) => {
586
- switch (n.key) {
587
- case "ArrowUp":
588
- case "ArrowDown":
589
- return n.key === "ArrowDown" ? this.highlight("down") : this.highlight("up"), !1;
590
- case "Tab":
591
- return this.callbacks.close(), !0;
592
- // Continue doing normal tabbing
593
- case "Escape":
594
- return this.callbacks.close(), !1;
595
- case " ":
596
- const l = this.content.list.querySelector(
597
- "." + this.classes.getFirst("highlighted")
598
- );
599
- return l ? (l.click(), !1) : !0;
600
- case "Enter":
601
- const a = this.content.list.querySelector(
602
- "." + this.classes.getFirst("highlighted")
603
- );
604
- return a ? (a.click(), !1) : this.callbacks.addable ? (s.click(), !1) : !0;
605
- }
606
- return !0;
607
- }, e.appendChild(t), this.callbacks.addable) {
608
- this.addClasses(s, this.classes.addable);
609
- const n = document.createElementNS("http://www.w3.org/2000/svg", "svg");
610
- n.setAttribute("viewBox", "0 0 100 100");
611
- const l = document.createElementNS("http://www.w3.org/2000/svg", "path");
612
- l.setAttribute("d", this.classes.addablePath), n.appendChild(l), s.appendChild(n), s.onclick = (a) => {
613
- if (a.preventDefault(), a.stopPropagation(), !this.callbacks.addable)
614
- return;
615
- const o = this.content.search.input.value.trim();
616
- if (o === "") {
617
- this.content.search.input.focus();
618
- return;
619
- }
620
- const h = (c) => {
621
- let p = new u(c);
622
- if (this.callbacks.addOption(p), this.settings.isMultiple) {
623
- let d = this.store.getSelected();
624
- d.push(p.id), this.callbacks.setSelected(d, !0);
625
- } else
626
- this.callbacks.setSelected([p.id], !0);
627
- this.callbacks.search(""), this.settings.closeOnSelect && setTimeout(() => {
628
- this.callbacks.close();
629
- }, 100);
630
- }, r = this.callbacks.addable(o);
631
- r === !1 || r === void 0 || r === null || (r instanceof Promise ? r.then((c) => {
632
- typeof c == "string" ? h({
633
- text: c,
634
- value: c
635
- }) : r instanceof Error ? this.renderError(r.message) : h(c);
636
- }) : typeof r == "string" ? h({
637
- text: r,
638
- value: r
639
- }) : r instanceof Error ? this.renderError(r.message) : h(r));
640
- }, e.appendChild(s), i.addable = {
641
- main: s,
642
- svg: n,
643
- path: l
644
- };
645
- }
646
- return i;
647
- }
648
- searchFocus() {
649
- this.content.search.input.focus({ preventScroll: !0 });
650
- }
651
- getOptions(e = !1, t = !1, s = !1) {
652
- let i = "." + this.classes.getFirst("option");
653
- return e && (i += ":not(." + this.classes.getFirst("placeholder") + ")"), t && (i += ":not(." + this.classes.getFirst("disabled") + ")"), s && (i += ":not(." + this.classes.getFirst("hide") + ")"), Array.from(this.content.list.querySelectorAll(i));
654
- }
655
- // highlightUp is used to highlight the previous option in the list
656
- highlight(e) {
657
- const t = this.getOptions(!0, !0, !0);
658
- if (t.length === 0)
659
- return;
660
- if (t.length === 1 && !t[0].classList.contains(this.classes.getFirst("highlighted"))) {
661
- this.addClasses(t[0], this.classes.highlighted);
662
- return;
663
- }
664
- let s = !1;
665
- for (const n of t)
666
- n.classList.contains(this.classes.getFirst("highlighted")) && (s = !0);
667
- if (!s) {
668
- for (const n of t)
669
- if (n.classList.contains(this.classes.getFirst("selected"))) {
670
- this.addClasses(n, this.classes.highlighted);
671
- break;
672
- }
673
- }
674
- for (let n = 0; n < t.length; n++)
675
- if (t[n].classList.contains(this.classes.getFirst("highlighted"))) {
676
- const l = t[n];
677
- this.removeClasses(l, this.classes.highlighted);
678
- const a = l.parentElement;
679
- if (a && a.classList.contains(this.classes.getFirst("mainOpen"))) {
680
- const r = a.querySelector("." + this.classes.getFirst("optgroupLabel"));
681
- r && r.click();
682
- }
683
- let o = t[e === "down" ? n + 1 < t.length ? n + 1 : 0 : n - 1 >= 0 ? n - 1 : t.length - 1];
684
- this.addClasses(o, this.classes.highlighted), this.ensureElementInView(this.content.list, o), o.id && this.main.main.setAttribute("aria-activedescendant", o.id);
685
- const h = o.parentElement;
686
- if (h && h.classList.contains(this.classes.getFirst("close"))) {
687
- const r = h.querySelector(
688
- "." + this.classes.getFirst("optgroupLabel")
689
- );
690
- r && r.click();
691
- }
692
- return;
693
- }
694
- const i = t[e === "down" ? 0 : t.length - 1];
695
- this.addClasses(i, this.classes.highlighted), i.id && this.main.main.setAttribute("aria-activedescendant", i.id), this.ensureElementInView(this.content.list, i);
696
- }
697
- // Create main container that options will reside
698
- listDiv() {
699
- const e = document.createElement("div");
700
- this.addClasses(e, this.classes.list);
701
- const t = this.settings.id + "-list";
702
- return e.id = t, e.dataset.id = t, e;
703
- }
704
- renderError(e) {
705
- this.content.list.innerHTML = "";
706
- const t = document.createElement("div");
707
- this.addClasses(t, this.classes.error), t.textContent = e, this.content.list.appendChild(t);
708
- }
709
- renderSearching() {
710
- this.content.list.innerHTML = "";
711
- const e = document.createElement("div");
712
- this.addClasses(e, this.classes.searching), e.textContent = this.settings.searchingText, this.content.list.appendChild(e);
713
- }
714
- // Take in data and add options to
715
- renderOptions(e) {
716
- if (this.lastRenderedOptions = e.map((s) => s instanceof u ? [s] : s.options.map((i) => new u(i))).flat(), this.content.list.innerHTML = "", e.length === 0) {
717
- const s = document.createElement("div");
718
- this.addClasses(s, this.classes.search), this.callbacks.addable ? s.innerHTML = this.settings.addableText.replace("{value}", this.content.search.input.value) : s.innerHTML = this.settings.searchText, this.content.list.appendChild(s);
719
- return;
720
- }
721
- this.settings.allowDeselect && !this.settings.isMultiple && (this.store.filter((i) => i.placeholder, !1).length || this.store.addOption(
722
- new u({
723
- text: "",
724
- value: "",
725
- selected: !1,
726
- placeholder: !0
727
- }),
728
- !0
729
- ));
730
- const t = document.createDocumentFragment();
731
- for (const s of e) {
732
- if (s instanceof m) {
733
- const i = document.createElement("div");
734
- this.addClasses(i, this.classes.optgroup);
735
- const n = document.createElement("div");
736
- this.addClasses(n, this.classes.optgroupLabel), i.appendChild(n);
737
- const l = document.createElement("div");
738
- this.addClasses(l, this.classes.optgroupLabelText), l.textContent = s.label, n.appendChild(l);
739
- const a = document.createElement("div");
740
- if (this.addClasses(a, this.classes.optgroupActions), n.appendChild(a), this.settings.isMultiple && s.selectAll) {
741
- const o = document.createElement("div");
742
- this.addClasses(o, this.classes.optgroupSelectAll);
743
- let h = !0;
744
- for (const g of s.options)
745
- if (!g.selected) {
746
- h = !1;
747
- break;
748
- }
749
- h && this.addClasses(o, this.classes.selected);
750
- const r = document.createElement("span");
751
- r.textContent = s.selectAllText, o.appendChild(r);
752
- const c = document.createElementNS("http://www.w3.org/2000/svg", "svg");
753
- c.setAttribute("viewBox", "0 0 100 100"), o.appendChild(c);
754
- const p = document.createElementNS("http://www.w3.org/2000/svg", "path");
755
- p.setAttribute("d", this.classes.optgroupSelectAllBox), c.appendChild(p);
756
- const d = document.createElementNS("http://www.w3.org/2000/svg", "path");
757
- d.setAttribute("d", this.classes.optgroupSelectAllCheck), c.appendChild(d), o.addEventListener("click", (g) => {
758
- g.preventDefault(), g.stopPropagation();
759
- const v = this.store.getSelected();
760
- if (h) {
761
- const C = v.filter((w) => {
762
- for (const b of s.options)
763
- if (w === b.id)
764
- return !1;
765
- return !0;
766
- });
767
- this.callbacks.setSelected(C, !0);
768
- return;
769
- } else {
770
- let C = s.options.map((b) => b.id).filter((b) => b !== void 0);
771
- const w = v.concat(C);
772
- for (const b of s.options)
773
- b.id && !this.store.getOptionByID(b.id) && this.callbacks.addOption(new u(b));
774
- this.callbacks.setSelected(w, !0);
775
- return;
776
- }
777
- }), a.appendChild(o);
778
- }
779
- if (s.closable !== "off") {
780
- const o = document.createElement("div");
781
- this.addClasses(o, this.classes.optgroupClosable);
782
- const h = document.createElementNS("http://www.w3.org/2000/svg", "svg");
783
- h.setAttribute("viewBox", "0 0 100 100"), this.addClasses(h, this.classes.arrow), o.appendChild(h);
784
- const r = document.createElementNS("http://www.w3.org/2000/svg", "path");
785
- h.appendChild(r), s.options.some((c) => c.selected) || this.content.search.input.value.trim() !== "" ? (this.addClasses(o, this.classes.mainOpen), r.setAttribute("d", this.classes.arrowOpen)) : s.closable === "open" ? (this.addClasses(i, this.classes.mainOpen), r.setAttribute("d", this.classes.arrowOpen)) : s.closable === "close" && (this.addClasses(i, this.classes.close), r.setAttribute("d", this.classes.arrowClose)), n.addEventListener("click", (c) => {
786
- c.preventDefault(), c.stopPropagation(), i.classList.contains(this.classes.getFirst("close")) ? (this.removeClasses(i, this.classes.close), this.addClasses(i, this.classes.mainOpen), r.setAttribute("d", this.classes.arrowOpen)) : (this.removeClasses(i, this.classes.mainOpen), this.addClasses(i, this.classes.close), r.setAttribute("d", this.classes.arrowClose));
787
- }), a.appendChild(o);
788
- }
789
- i.appendChild(n);
790
- for (const o of s.options)
791
- i.appendChild(this.option(new u(o))), t.appendChild(i);
792
- }
793
- s instanceof u && t.appendChild(this.option(s));
794
- }
795
- this.content.list.appendChild(t);
796
- }
797
- // Create option div element
798
- option(e) {
799
- if (e.placeholder) {
800
- const s = document.createElement("div");
801
- return this.addClasses(s, this.classes.option), this.addClasses(s, this.classes.hide), s;
802
- }
803
- const t = document.createElement("div");
804
- return t.dataset.id = e.id, t.id = this.settings.id + "-" + e.id, this.addClasses(t, this.classes.option), t.setAttribute("role", "option"), e.class && e.class.split(" ").forEach((s) => {
805
- t.classList.add(s);
806
- }), e.style && (t.style.cssText = e.style), this.settings.searchHighlight && this.content.search.input.value.trim() !== "" ? t.innerHTML = this.highlightText(
807
- e.html !== "" ? e.html : e.text,
808
- this.content.search.input.value,
809
- this.classes.searchHighlighter
810
- ) : e.html !== "" ? t.innerHTML = e.html : t.textContent = e.text, this.settings.showOptionTooltips && t.textContent && t.setAttribute("title", t.textContent), e.display || this.addClasses(t, this.classes.hide), e.disabled && this.addClasses(t, this.classes.disabled), e.selected && this.settings.hideSelected && this.addClasses(t, this.classes.hide), e.selected ? (this.addClasses(t, this.classes.selected), t.setAttribute("aria-selected", "true"), this.main.main.setAttribute("aria-activedescendant", t.id)) : (this.removeClasses(t, this.classes.selected), t.setAttribute("aria-selected", "false")), t.addEventListener("click", (s) => {
811
- s.preventDefault(), s.stopPropagation();
812
- const i = this.store.getSelected(), n = s.currentTarget, l = String(n.dataset.id), a = s.ctrlKey || s.metaKey;
813
- if (e.disabled || !this.settings.isMultiple && e.selected && !this.settings.allowDeselect || e.selected && e.mandatory || this.settings.isMultiple && this.settings.maxSelected <= i.length && !e.selected || this.settings.isMultiple && this.settings.minSelected >= i.length && e.selected && !a)
814
- return;
815
- let o = !1;
816
- const h = this.store.getSelectedOptions();
817
- let r = [];
818
- if (this.settings.isMultiple) {
819
- const c = h.some((d) => d.id === l);
820
- if (s.shiftKey && this.lastSelectedOption) {
821
- const d = this.lastRenderedOptions, g = d.findIndex((C) => C.id === this.lastSelectedOption.id), v = d.findIndex((C) => C.id === e.id);
822
- if (g >= 0 && v >= 0) {
823
- const C = Math.min(g, v), w = Math.max(g, v), E = d.slice(C, w + 1).filter((A) => !h.find((L) => L.id === A.id));
824
- h.length + E.length <= this.settings.maxSelected ? r = h.concat(E) : r = h;
825
- } else
826
- r = h;
827
- } else a ? (c ? r = h.filter((d) => d.id !== l) : r = h.concat(e), this.lastSelectedOption = e) : (c ? r = h.filter((d) => d.id !== l) : r = h.concat(e), this.lastSelectedOption = e);
828
- }
829
- if (this.settings.isMultiple || (e.selected ? r = [] : r = [e]), this.callbacks.beforeChange || (o = !0), this.callbacks.beforeChange && (this.callbacks.beforeChange(r, h) === !1 ? o = !1 : o = !0), o) {
830
- this.store.getOptionByID(l) || this.callbacks.addOption(e), this.callbacks.setSelected(
831
- r.map((d) => d.id),
832
- !1
833
- );
834
- const c = s.ctrlKey || s.metaKey || s.shiftKey;
835
- this.settings.closeOnSelect && !(this.settings.isMultiple && c) && this.callbacks.close(), this.callbacks.afterChange && this.callbacks.afterChange(r);
836
- }
837
- }), t;
838
- }
839
- destroy() {
840
- this.closeAnimationTimeout && (clearTimeout(this.closeAnimationTimeout), this.closeAnimationTimeout = null), this.main.main.remove(), this.content.main.remove();
841
- }
842
- highlightText(e, t, s) {
843
- const i = t.trim();
844
- if (i === "")
845
- return e;
846
- const n = i.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), l = document.createElement("div");
847
- l.innerHTML = e;
848
- const a = (o) => {
849
- if (o.nodeType === Node.TEXT_NODE) {
850
- const h = o.textContent || "", r = new RegExp("(" + n + ")", "i");
851
- if (r.test(h)) {
852
- const c = document.createElement("span");
853
- h.split(r).forEach((d, g) => {
854
- if (d && r.test(d)) {
855
- const v = document.createElement("mark");
856
- v.className = s, v.textContent = d, c.appendChild(v);
857
- } else d && c.appendChild(document.createTextNode(d));
858
- }), o.parentNode?.replaceChild(c, o);
859
- }
860
- } else o.nodeType === Node.ELEMENT_NODE && Array.from(o.childNodes).forEach((h) => a(h));
861
- };
862
- return Array.from(l.childNodes).forEach((o) => a(o)), l.innerHTML;
863
- }
864
- setContentDirection(e) {
865
- const t = e === "above", s = t ? this.classes.dirAbove : this.classes.dirBelow, i = t ? this.classes.dirBelow : this.classes.dirAbove;
866
- if (this.removeClasses(this.main.main, i), this.addClasses(this.main.main, s), this.removeClasses(this.content.main, i), this.addClasses(this.content.main, s), t) {
867
- const n = this.main.main.offsetHeight, l = this.content.main.offsetHeight;
868
- this.content.main.style.margin = "-" + (n + l - 1) + "px 0px 0px 0px";
869
- } else
870
- this.content.main.style.margin = "-1px 0px 0px 0px";
871
- }
872
- setContentPosition() {
873
- if (this.settings.contentPosition === "relative")
874
- return;
875
- const e = this.main.main.getBoundingClientRect();
876
- let t, s;
877
- this.settings.contentPosition === "fixed" ? (t = e.top + e.height, s = e.left) : (t = e.top + window.scrollY + e.height, s = e.left + window.scrollX), this.content.main.style.top = t + "px", this.content.main.style.left = s + "px";
878
- const i = this.settings.contentWidth;
879
- this.content.main.style.width = "", this.content.main.style.minWidth = "", this.content.main.style.maxWidth = "", i ? i.startsWith(">") ? this.content.main.style.minWidth = i.slice(1) : i.startsWith("<") ? this.content.main.style.maxWidth = i.slice(1) : this.content.main.style.width = i : this.content.main.style.width = e.width + "px";
880
- const n = 20, l = window.innerWidth - n, a = () => {
881
- const h = this.content.main.getBoundingClientRect().right;
882
- if (h <= l) return;
883
- const r = h - l, c = parseFloat(this.content.main.style.left) || 0;
884
- if (this.settings.contentPosition === "fixed") {
885
- const p = Math.max(n, c - r);
886
- this.content.main.style.left = p + "px";
887
- } else {
888
- const p = Math.max(window.scrollX + n, c - r);
889
- this.content.main.style.left = p + "px";
890
- }
891
- };
892
- requestAnimationFrame(() => {
893
- a(), requestAnimationFrame(a);
894
- });
895
- }
896
- moveContentAbove() {
897
- this.setContentDirection("above"), this.setContentPosition();
898
- }
899
- moveContentBelow() {
900
- this.setContentDirection("below"), this.setContentPosition();
901
- }
902
- ensureElementInView(e, t) {
903
- const s = e.scrollTop + e.offsetTop, i = s + e.clientHeight, n = t.offsetTop, l = n + t.clientHeight;
904
- n < s ? e.scrollTop -= s - n : l > i && (e.scrollTop += l - i);
905
- }
906
- putContent() {
907
- const e = this.main.main.offsetHeight, t = this.main.main.getBoundingClientRect(), s = this.content.main.offsetHeight;
908
- return window.innerHeight - (t.top + e) <= s && t.top > s ? "up" : "down";
909
- }
910
- // Updates deselect based on item count and allowDeselect setting
911
- updateDeselectAll() {
912
- if (!this.store || !this.settings)
913
- return;
914
- const e = this.store.getSelectedOptions(), t = e && e.length > 0, s = this.settings.isMultiple, i = this.settings.allowDeselect, n = this.main.deselect.main, l = this.classes.hide;
915
- i && !(s && !t) ? this.removeClasses(n, l) : this.addClasses(n, l);
916
- }
60
+ function n(e, t) {
61
+ function n(e, n) {
62
+ return n && e && e.classList && e.classList.contains(n) || n && e && e.dataset && e.dataset.id && e.dataset.id === t ? e : null;
63
+ }
64
+ function r(e, t) {
65
+ return !e || e === document ? null : n(e, t) ? e : r(e.parentNode, t);
66
+ }
67
+ return n(e, t) || r(e, t);
917
68
  }
918
- class M {
919
- select;
920
- // Mutation observer fields
921
- onValueChange;
922
- onClassChange;
923
- onDisabledChange;
924
- onOptionsChange;
925
- onLabelClick;
926
- // Change observers
927
- listen = !1;
928
- observer = null;
929
- isUpdating = !1;
930
- pendingOptionsChange = null;
931
- // Event handlers for preventing native select behavior (especially on iOS Safari)
932
- preventNativeSelect = null;
933
- preventNativeSelectMousedown = null;
934
- preventNativeSelectFocus = null;
935
- constructor(e) {
936
- this.select = e, this.valueChange = this.valueChange.bind(this), this.select.addEventListener("change", this.valueChange, {
937
- // allow bubbling of event
938
- passive: !0
939
- }), this.observer = new MutationObserver(this.observeCall.bind(this)), this.changeListen(!0);
940
- }
941
- enable() {
942
- this.select.disabled = !1;
943
- }
944
- disable() {
945
- this.select.disabled = !0;
946
- }
947
- hideUI() {
948
- 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"), this.preventNativeSelect || (this.preventNativeSelect = (e) => {
949
- e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation();
950
- }, this.preventNativeSelectMousedown = (e) => {
951
- e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation();
952
- }, this.preventNativeSelectFocus = (e) => {
953
- e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation();
954
- }, this.select.addEventListener("click", this.preventNativeSelect, { capture: !0, passive: !1 }), this.select.addEventListener("mousedown", this.preventNativeSelectMousedown, { capture: !0, passive: !1 }), this.select.addEventListener("focus", this.preventNativeSelectFocus, { capture: !0, passive: !1 }));
955
- }
956
- showUI() {
957
- 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"), this.preventNativeSelect && (this.select.removeEventListener("click", this.preventNativeSelect, { capture: !0 }), this.preventNativeSelect = null), this.preventNativeSelectMousedown && (this.select.removeEventListener("mousedown", this.preventNativeSelectMousedown, { capture: !0 }), this.preventNativeSelectMousedown = null), this.preventNativeSelectFocus && (this.select.removeEventListener("focus", this.preventNativeSelectFocus, { capture: !0 }), this.preventNativeSelectFocus = null);
958
- }
959
- changeListen(e) {
960
- this.listen = e, e && this.observer && this.observer.observe(this.select, {
961
- subtree: !0,
962
- // subtree for optgroups options
963
- childList: !0,
964
- // children changes
965
- attributes: !0
966
- // attributes changes
967
- }), e || this.observer && this.observer.disconnect();
968
- }
969
- // This function get triggers when the select value changes
970
- // and will call the onValueChange function if it exists
971
- valueChange(e) {
972
- return this.listen && this.onValueChange && this.onValueChange(this.getSelectedOptions()), !0;
973
- }
974
- observeCall(e) {
975
- if (!this.listen)
976
- return;
977
- let t = !1, s = !1, i = !1, n = !1;
978
- for (const l of e) {
979
- if (l.target === this.select && (l.attributeName === "disabled" && (s = !0), l.attributeName === "class" && (t = !0), l.type === "childList")) {
980
- for (const a of Array.from(l.addedNodes))
981
- if (a.nodeName === "OPTION" && a.value === this.select.value) {
982
- n = !0;
983
- break;
984
- }
985
- i = !0;
986
- }
987
- (l.target.nodeName === "OPTGROUP" || l.target.nodeName === "OPTION") && (i = !0);
988
- }
989
- if (t && this.onClassChange && this.onClassChange(this.select.className.split(" ")), s && this.onDisabledChange && (this.changeListen(!1), this.onDisabledChange(this.select.disabled), this.changeListen(!0)), i && this.onOptionsChange) {
990
- if (this.isUpdating) {
991
- if (this.select.options.length > 0) {
992
- const l = this.getData();
993
- l.length > 0 && (this.pendingOptionsChange = l);
994
- }
995
- n && this.select.dispatchEvent(new Event("change"));
996
- return;
997
- }
998
- this.changeListen(!1), this.onOptionsChange(this.getData()), this.changeListen(!0);
999
- }
1000
- n && this.select.dispatchEvent(new Event("change"));
1001
- }
1002
- // From the select element pull optgroup and options into data
1003
- getData() {
1004
- let e = [];
1005
- const t = this.select.childNodes;
1006
- for (const s of t)
1007
- s.nodeName === "OPTGROUP" && e.push(this.getDataFromOptgroup(s)), s.nodeName === "OPTION" && e.push(this.getDataFromOption(s));
1008
- return e;
1009
- }
1010
- getDataFromOptgroup(e) {
1011
- let t = {
1012
- id: e.id,
1013
- label: e.label,
1014
- selectAll: e.dataset ? e.dataset.selectall === "true" : !1,
1015
- selectAllText: e.dataset ? e.dataset.selectalltext : "Select all",
1016
- closable: e.dataset ? e.dataset.closable : "off",
1017
- options: []
1018
- };
1019
- const s = e.childNodes;
1020
- for (const i of s)
1021
- i.nodeName === "OPTION" && t.options.push(this.getDataFromOption(i));
1022
- return t;
1023
- }
1024
- // From passed in option pull pieces of usable information
1025
- getDataFromOption(e) {
1026
- return {
1027
- id: e.id,
1028
- value: e.value,
1029
- text: e.text,
1030
- html: e.dataset && e.dataset.html ? e.dataset.html : "",
1031
- defaultSelected: e.defaultSelected,
1032
- selected: e.selected,
1033
- display: e.style.display !== "none",
1034
- disabled: e.disabled,
1035
- mandatory: e.dataset ? e.dataset.mandatory === "true" : !1,
1036
- placeholder: e.dataset.placeholder === "true",
1037
- class: e.className,
1038
- style: e.style.cssText,
1039
- data: e.dataset
1040
- };
1041
- }
1042
- getSelectedOptions() {
1043
- let e = [];
1044
- const t = this.select.childNodes;
1045
- for (const s of t) {
1046
- if (s.nodeName === "OPTGROUP") {
1047
- const i = s.childNodes;
1048
- for (const n of i)
1049
- if (n.nodeName === "OPTION") {
1050
- const l = n;
1051
- l.selected && e.push(this.getDataFromOption(l));
1052
- }
1053
- }
1054
- if (s.nodeName === "OPTION") {
1055
- const i = s;
1056
- i.selected && e.push(this.getDataFromOption(i));
1057
- }
1058
- }
1059
- return e;
1060
- }
1061
- getSelectedValues() {
1062
- return this.getSelectedOptions().map((e) => e.value);
1063
- }
1064
- setSelected(e) {
1065
- this.changeListen(!1);
1066
- const t = this.select.childNodes;
1067
- for (const s of t) {
1068
- if (s.nodeName === "OPTGROUP") {
1069
- const n = s.childNodes;
1070
- for (const l of n)
1071
- if (l.nodeName === "OPTION") {
1072
- const a = l;
1073
- a.selected = e.includes(a.id);
1074
- }
1075
- }
1076
- if (s.nodeName === "OPTION") {
1077
- const i = s;
1078
- i.selected = e.includes(i.id);
1079
- }
1080
- }
1081
- this.changeListen(!0);
1082
- }
1083
- // Set selected options by value instead of id
1084
- // This is useful when the id is not known
1085
- // and only the value is known
1086
- // but the value is not unique and can be duplicated
1087
- setSelectedByValue(e) {
1088
- this.changeListen(!1);
1089
- const t = this.select.childNodes;
1090
- for (const s of t) {
1091
- if (s.nodeName === "OPTGROUP") {
1092
- const n = s.childNodes;
1093
- for (const l of n)
1094
- if (l.nodeName === "OPTION") {
1095
- const a = l;
1096
- a.selected = e.includes(a.value);
1097
- }
1098
- }
1099
- if (s.nodeName === "OPTION") {
1100
- const i = s;
1101
- i.selected = e.includes(i.value);
1102
- }
1103
- }
1104
- this.changeListen(!0);
1105
- }
1106
- updateSelect(e, t, s) {
1107
- this.changeListen(!1), e && (this.select.dataset.id = e), t && (this.select.style.cssText = t), s && (this.select.className = "", s.forEach((i) => {
1108
- i.trim() !== "" && this.select.classList.add(i.trim());
1109
- })), this.changeListen(!0);
1110
- }
1111
- updateOptions(e) {
1112
- if (!(!e || e.length === 0)) {
1113
- this.isUpdating = !0, this.pendingOptionsChange = null, this.changeListen(!1), this.select.innerHTML = "";
1114
- for (const t of e)
1115
- t instanceof m && this.select.appendChild(this.createOptgroup(t)), t instanceof u && this.select.appendChild(this.createOption(t));
1116
- if (this.select.dispatchEvent(new Event("change", { bubbles: !0 })), this.changeListen(!0), this.isUpdating = !1, this.pendingOptionsChange !== null) {
1117
- const t = this.pendingOptionsChange;
1118
- t.length > 0 && this.onOptionsChange ? (this.pendingOptionsChange = null, this.changeListen(!1), this.onOptionsChange(t), this.changeListen(!0)) : this.pendingOptionsChange = null;
1119
- }
1120
- }
1121
- }
1122
- createOptgroup(e) {
1123
- const t = document.createElement("optgroup");
1124
- 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)
1125
- for (const s of e.options)
1126
- t.appendChild(this.createOption(s));
1127
- return t;
1128
- }
1129
- createOption(e) {
1130
- const t = document.createElement("option");
1131
- 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) => {
1132
- t.classList.add(s);
1133
- }), e.data && typeof e.data == "object" && Object.keys(e.data).forEach((s) => {
1134
- t.setAttribute("data-" + D(s), e.data[s]);
1135
- }), t;
1136
- }
1137
- // Find and handle labels associated with this select
1138
- setupLabelHandlers() {
1139
- const e = [], t = this.select.id;
1140
- t && document.querySelectorAll(`label[for="${t}"]`).forEach((l) => e.push(l));
1141
- let s = this.select.parentElement;
1142
- for (; s && s !== document.body; ) {
1143
- if (s.tagName === "LABEL") {
1144
- e.push(s);
1145
- break;
1146
- }
1147
- s = s.parentElement;
1148
- }
1149
- Array.from(new Set(e)).forEach((n) => {
1150
- if (n.__slimSelectLabelHandler)
1151
- return;
1152
- const l = (a) => {
1153
- const o = a.target, h = x(o, this.select.dataset.id);
1154
- a.preventDefault(), !h && this.onLabelClick && this.onLabelClick();
1155
- };
1156
- n.__slimSelectLabelHandler = l, n.addEventListener("click", l, { capture: !0, passive: !1 });
1157
- });
1158
- }
1159
- // Remove label handlers
1160
- removeLabelHandlers() {
1161
- const e = [], t = this.select.id;
1162
- t && document.querySelectorAll(`label[for="${t}"]`).forEach((l) => e.push(l));
1163
- let s = this.select.parentElement;
1164
- for (; s && s !== document.body; ) {
1165
- if (s.tagName === "LABEL") {
1166
- e.push(s);
1167
- break;
1168
- }
1169
- s = s.parentElement;
1170
- }
1171
- Array.from(new Set(e)).forEach((n) => {
1172
- const l = n.__slimSelectLabelHandler;
1173
- l && (n.removeEventListener("click", l, { capture: !0 }), delete n.__slimSelectLabelHandler);
1174
- });
1175
- }
1176
- destroy() {
1177
- this.changeListen(!1), this.select.removeEventListener("change", this.valueChange), this.preventNativeSelect && (this.select.removeEventListener("click", this.preventNativeSelect, { capture: !0 }), this.preventNativeSelect = null), this.preventNativeSelectMousedown && (this.select.removeEventListener("mousedown", this.preventNativeSelectMousedown, { capture: !0 }), this.preventNativeSelectMousedown = null), this.preventNativeSelectFocus && (this.select.removeEventListener("focus", this.preventNativeSelectFocus, { capture: !0 }), this.preventNativeSelectFocus = null), this.observer && (this.observer.disconnect(), this.observer = null), this.removeLabelHandlers(), delete this.select.dataset.id, this.showUI();
1178
- }
69
+ function r(e, t = 50, n = !1) {
70
+ let r;
71
+ return function(...i) {
72
+ let a = self, o = () => {
73
+ r = null, n || e.apply(a, i);
74
+ }, s = n && !r;
75
+ clearTimeout(r), r = setTimeout(o, t), s && e.apply(a, i);
76
+ };
1179
77
  }
1180
- class P {
1181
- id = "";
1182
- // Primary ID for the select
1183
- style = "";
1184
- // Style attribute from the select element
1185
- class = [];
1186
- // Class attribute from the select element
1187
- // Dynamic settings
1188
- isMultiple = !1;
1189
- isOpen = !1;
1190
- isFullOpen = !1;
1191
- intervalMove = null;
1192
- // Fields set from constructor
1193
- disabled;
1194
- alwaysOpen;
1195
- showSearch;
1196
- focusSearch;
1197
- keepSearch;
1198
- ariaLabel;
1199
- searchPlaceholder;
1200
- searchText;
1201
- searchingText;
1202
- searchHighlight;
1203
- closeOnSelect;
1204
- contentLocation;
1205
- contentPosition;
1206
- contentWidth;
1207
- openPosition;
1208
- placeholderText;
1209
- allowDeselect;
1210
- hideSelected;
1211
- keepOrder;
1212
- showOptionTooltips;
1213
- minSelected;
1214
- maxSelected;
1215
- timeoutDelay;
1216
- maxValuesShown;
1217
- maxValuesMessage;
1218
- addableText;
1219
- constructor(e) {
1220
- e || (e = {}), this.id = "ss-" + y(), 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.keepSearch = e.keepSearch !== void 0 ? e.keepSearch : !1, 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.contentWidth = e.contentWidth || "", 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}';
1221
- }
78
+ function i(e, t) {
79
+ return JSON.stringify(e) === JSON.stringify(t);
1222
80
  }
1223
- class F {
1224
- selectEl;
1225
- // Classes
1226
- settings;
1227
- cssClasses;
1228
- select;
1229
- store;
1230
- render;
1231
- // Timeout tracking for cleanup
1232
- openTimeout = null;
1233
- closeTimeout = null;
1234
- // Events
1235
- events = {
1236
- search: void 0,
1237
- searchFilter: (e, t) => e.text.toLowerCase().indexOf(t.toLowerCase()) !== -1,
1238
- addable: void 0,
1239
- beforeChange: void 0,
1240
- afterChange: void 0,
1241
- beforeOpen: void 0,
1242
- afterOpen: void 0,
1243
- beforeClose: void 0,
1244
- afterClose: void 0
1245
- };
1246
- constructor(e) {
1247
- if (this.selectEl = typeof e.select == "string" ? document.querySelector(e.select) : e.select, !this.selectEl) {
1248
- e.events && e.events.error && e.events.error(new Error("Could not find select element"));
1249
- return;
1250
- }
1251
- if (this.selectEl.tagName !== "SELECT") {
1252
- e.events && e.events.error && e.events.error(new Error("Element isnt of type select"));
1253
- return;
1254
- }
1255
- this.selectEl.dataset.ssid && this.destroy(), this.settings = new P(e.settings), this.cssClasses = new T(e.cssClasses);
1256
- const t = ["beforeOpen", "afterOpen", "beforeClose", "afterClose"];
1257
- for (const a in e.events)
1258
- e.events.hasOwnProperty(a) && (t.indexOf(a) !== -1 ? this.events[a] = S(e.events[a], 100) : this.events[a] = e.events[a]);
1259
- 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 M(this.selectEl), this.selectEl.id || (this.selectEl.id = this.settings.id), this.select.updateSelect(this.settings.id, this.settings.style, this.settings.class), this.select.hideUI(), this.select.onValueChange = (a) => {
1260
- this.setSelected(a.map((o) => o.id));
1261
- }, this.select.onClassChange = (a) => {
1262
- this.settings.class = a, this.render.updateClassStyles();
1263
- }, this.select.onDisabledChange = (a) => {
1264
- a ? this.disable() : this.enable();
1265
- }, this.select.onOptionsChange = (a) => {
1266
- this.setData(a || []);
1267
- }, this.select.onLabelClick = () => {
1268
- this.settings.disabled || (this.settings.isOpen ? this.close() : this.open());
1269
- };
1270
- const s = e.data ? e.data : this.select.getData();
1271
- this.store = new k(this.settings.isMultiple ? "multiple" : "single", s), e.data && this.select.updateOptions(this.store.getData());
1272
- const i = {
1273
- open: this.open.bind(this),
1274
- close: this.close.bind(this),
1275
- addable: this.events.addable ? this.events.addable : void 0,
1276
- setSelected: this.setSelected.bind(this),
1277
- addOption: this.addOption.bind(this),
1278
- search: this.search.bind(this),
1279
- beforeChange: this.events.beforeChange,
1280
- afterChange: this.events.afterChange
1281
- };
1282
- this.render = new N(this.settings, this.cssClasses, this.store, i), this.render.renderValues(), this.render.renderOptions(this.store.getData());
1283
- const n = this.selectEl.getAttribute("aria-label"), l = this.selectEl.getAttribute("aria-labelledby");
1284
- n ? this.render.main.main.setAttribute("aria-label", n) : l && this.render.main.main.setAttribute("aria-labelledby", l), this.selectEl.parentNode && this.selectEl.parentNode.insertBefore(this.render.main.main, this.selectEl.nextSibling), window.addEventListener("resize", this.windowResize, !1), this.settings.openPosition === "auto" && window.addEventListener("scroll", this.windowScroll, !1), document.addEventListener("visibilitychange", this.windowVisibilityChange), this.settings.disabled && this.disable(), this.settings.alwaysOpen && this.open(), this.select.setupLabelHandlers(), this.selectEl.slim = this;
1285
- }
1286
- // Set to enabled and remove disabled classes
1287
- enable() {
1288
- this.settings.disabled = !1, this.select.enable(), this.render.enable();
1289
- }
1290
- // Set to disabled and add disabled classes
1291
- disable() {
1292
- this.settings.disabled = !0, this.select.disable(), this.render.disable();
1293
- }
1294
- getData() {
1295
- return this.store.getData();
1296
- }
1297
- setData(e) {
1298
- const t = this.store.getSelected(), s = this.store.validateDataArray(e);
1299
- if (s) {
1300
- this.events.error && this.events.error(s);
1301
- return;
1302
- }
1303
- this.store.setData(e);
1304
- const i = this.store.getData();
1305
- this.select.updateOptions(i), this.render.renderValues(), this.render.renderOptions(i), this.events.afterChange && !O(t, this.store.getSelected()) && this.events.afterChange(this.store.getSelectedOptions());
1306
- }
1307
- getSelected() {
1308
- let e = this.store.getSelectedOptions();
1309
- return this.settings.keepOrder && (e = this.store.selectedOrderOptions(e)), e.map((t) => t.value);
1310
- }
1311
- // Will take in a string or array of strings and set the selected by either the id or value
1312
- setSelected(e, t = !0) {
1313
- const s = this.store.getSelected(), i = this.store.getDataOptions();
1314
- e = Array.isArray(e) ? e : [e];
1315
- const n = [];
1316
- for (const a of e) {
1317
- if (i.find((o) => o.id == a)) {
1318
- n.push(a);
1319
- continue;
1320
- }
1321
- for (const o of i.filter((h) => h.value == a))
1322
- n.push(o.id);
1323
- }
1324
- this.store.setSelectedBy("id", n);
1325
- const l = this.store.getData();
1326
- this.select.updateOptions(l), this.render.renderValues(), this.render.content.search.input.value !== "" ? this.search(this.render.content.search.input.value) : this.render.renderOptions(l), t && this.events.afterChange && !O(s, this.store.getSelected()) && this.events.afterChange(this.store.getSelectedOptions());
1327
- }
1328
- addOption(e) {
1329
- const t = this.store.getSelected();
1330
- this.store.getDataOptions().some((i) => i.value === (e.value ?? e.text)) || this.store.addOption(e);
1331
- const s = this.store.getData();
1332
- this.select.updateOptions(s), this.render.renderValues(), this.render.renderOptions(s), this.events.afterChange && !O(t, this.store.getSelected()) && this.events.afterChange(this.store.getSelectedOptions());
1333
- }
1334
- open() {
1335
- this.settings.disabled || this.settings.isOpen || (this.closeTimeout && (clearTimeout(this.closeTimeout), this.closeTimeout = null), 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(() => {
1336
- this.events.afterOpen && this.events.afterOpen(), this.settings.isOpen && (this.settings.isFullOpen = !0), document.addEventListener("click", this.documentClick);
1337
- }, 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)));
1338
- }
1339
- close(e = null) {
1340
- !this.settings.isOpen || this.settings.alwaysOpen || (this.openTimeout && (clearTimeout(this.openTimeout), this.openTimeout = null), this.events.beforeClose && this.events.beforeClose(), this.render.close(), !this.settings.keepSearch && this.render.content.search.input.value !== "" && this.search(""), this.render.mainFocus(e), this.settings.isOpen = !1, this.settings.isFullOpen = !1, this.closeTimeout = setTimeout(() => {
1341
- this.events.afterClose && this.events.afterClose(), document.removeEventListener("click", this.documentClick);
1342
- }, this.settings.timeoutDelay), this.settings.intervalMove && clearInterval(this.settings.intervalMove));
1343
- }
1344
- // Take in string value and search current options
1345
- search(e) {
1346
- if (this.render.content.search.input.value !== e && (this.render.content.search.input.value = e), e === "") {
1347
- this.render.renderOptions(this.store.getData());
1348
- return;
1349
- }
1350
- if (!this.events.search) {
1351
- const s = e === "" ? this.store.getData() : this.store.search(e, this.events.searchFilter);
1352
- this.render.renderOptions(s);
1353
- return;
1354
- }
1355
- this.render.renderSearching();
1356
- const t = this.events.search(e, this.store.getSelectedOptions());
1357
- if (t instanceof Promise) {
1358
- t.then((s) => {
1359
- this.store.setData(s, !0), this.select.updateOptions(this.store.getData()), this.render.renderOptions(this.store.getData());
1360
- }).catch((s) => {
1361
- this.render.renderError(typeof s == "string" ? s : s.message);
1362
- });
1363
- return;
1364
- } 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");
1365
- }
1366
- destroy() {
1367
- 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();
1368
- }
1369
- windowResize = S(() => {
1370
- !this.settings.isOpen && !this.settings.isFullOpen || this.render.moveContent();
1371
- });
1372
- // Event listener for window scrolling
1373
- windowScroll = S(() => {
1374
- !this.settings.isOpen && !this.settings.isFullOpen || this.render.moveContent();
1375
- });
1376
- // Event listener for document click
1377
- documentClick = (e) => {
1378
- this.settings.isOpen && e.target && !x(e.target, this.settings.id) && this.close(e.type);
1379
- };
1380
- // Event Listener for window visibility change
1381
- windowVisibilityChange = () => {
1382
- document.hidden && this.close();
1383
- };
81
+ function a(e) {
82
+ let t = e.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g, (e) => "-" + e.toLowerCase());
83
+ return e[0] === e[0].toUpperCase() ? t.substring(1) : t;
1384
84
  }
1385
- export {
1386
- m as Optgroup,
1387
- u as Option,
1388
- P as Settings,
1389
- F as default
85
+ //#endregion
86
+ //#region src/slim-select/store.ts
87
+ var o = class {
88
+ id;
89
+ value;
90
+ text;
91
+ html;
92
+ defaultSelected;
93
+ selected;
94
+ display;
95
+ disabled;
96
+ placeholder;
97
+ class;
98
+ style;
99
+ data;
100
+ mandatory;
101
+ constructor(e) {
102
+ this.id = !e.id || e.id === "" ? t() : 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 ? !1 : e.defaultSelected, this.selected = e.selected === void 0 ? !1 : e.selected, this.display = e.display === void 0 ? !0 : e.display, this.disabled = e.disabled === void 0 ? !1 : e.disabled, this.mandatory = e.mandatory === void 0 ? !1 : e.mandatory, this.placeholder = e.placeholder === void 0 ? !1 : e.placeholder, this.class = e.class || "", this.style = e.style || "", this.data = e.data || {};
103
+ }
104
+ }, s = class {
105
+ id;
106
+ label;
107
+ selectAll;
108
+ selectAllText;
109
+ closable;
110
+ options;
111
+ constructor(e) {
112
+ if (this.id = !e.id || e.id === "" ? t() : 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 (let t of e.options) this.options.push(new o(t));
113
+ }
114
+ }, c = class {
115
+ selectType = "single";
116
+ data = [];
117
+ selectedOrder = [];
118
+ constructor(e, t) {
119
+ this.selectType = e, this.setData(t);
120
+ }
121
+ validateDataArray(e) {
122
+ if (!Array.isArray(e)) return /* @__PURE__ */ Error("Data must be an array");
123
+ for (let t of e) if (t) if (t instanceof s || "label" in t) {
124
+ if (!("label" in t)) return /* @__PURE__ */ Error("Optgroup must have a label");
125
+ if ("options" in t && t.options) for (let e of t.options) {
126
+ let t = this.validateOption(e);
127
+ if (t) return t;
128
+ }
129
+ } else if (t instanceof o || "text" in t) {
130
+ let e = this.validateOption(t);
131
+ if (e) return e;
132
+ } else return /* @__PURE__ */ Error("Data object must be a valid optgroup or option");
133
+ return null;
134
+ }
135
+ validateOption(e) {
136
+ return "text" in e ? null : /* @__PURE__ */ Error("Option must have a text");
137
+ }
138
+ partialToFullData(e) {
139
+ let t = [];
140
+ return e.forEach((e) => {
141
+ if (e) {
142
+ if (e instanceof s || "label" in e) {
143
+ let n = [];
144
+ "options" in e && e.options && e.options.forEach((e) => {
145
+ n.push(new o(e));
146
+ }), n.length > 0 && t.push(new s(e));
147
+ }
148
+ (e instanceof o || "text" in e) && t.push(new o(e));
149
+ }
150
+ }), t;
151
+ }
152
+ setData(e, t = !1) {
153
+ let n = this.partialToFullData(e), r = [];
154
+ if (t) {
155
+ r = this.getSelectedOptions();
156
+ let e = [];
157
+ r.forEach((t) => {
158
+ let r = !1;
159
+ for (let e of n) {
160
+ if (e instanceof o && e.id === t.id) {
161
+ r = !0;
162
+ break;
163
+ }
164
+ if (e instanceof s) {
165
+ for (let n of e.options) if (n.id === t.id) {
166
+ r = !0;
167
+ break;
168
+ }
169
+ }
170
+ }
171
+ r || e.push(t);
172
+ }), this.data = [...e, ...n];
173
+ } else this.data = n;
174
+ if (this.selectType === "single") {
175
+ let e = t && r.length === 0;
176
+ this.setSelectedBy("id", this.getSelected(), e);
177
+ }
178
+ }
179
+ getData() {
180
+ return this.filter(null, !0);
181
+ }
182
+ getDataOptions() {
183
+ return this.filter(null, !1);
184
+ }
185
+ addOption(e, t = !1) {
186
+ if (t) {
187
+ let t = [new o(e)];
188
+ this.setData(t.concat(this.getData()));
189
+ } else this.setData(this.getData().concat(new o(e)));
190
+ }
191
+ setSelectedBy(e, t, n = !1) {
192
+ let r = null, i = !1, a = [];
193
+ for (let n of this.data) {
194
+ if (n instanceof s) for (let o of n.options) {
195
+ r ||= o;
196
+ let n = o[e] || "";
197
+ o.selected = i ? !1 : t.includes(n), o.selected && (a.push(o), this.selectType === "single" && (i = !0));
198
+ }
199
+ n instanceof o && (r ||= n, n.selected = i ? !1 : t.includes(n[e]), n.selected && (a.push(n), this.selectType === "single" && (i = !0)));
200
+ }
201
+ this.selectType === "single" && r && !i && !n && (r.selected = !0, a.push(r));
202
+ let c = t.map((t) => a.find((n) => n[e] === t)?.id || "");
203
+ this.selectedOrder = c;
204
+ }
205
+ getSelected() {
206
+ return this.getSelectedOptions().map((e) => e.id);
207
+ }
208
+ getSelectedValues() {
209
+ return this.getSelectedOptions().map((e) => e.value);
210
+ }
211
+ getSelectedOptions() {
212
+ return this.filter((e) => e.selected, !1);
213
+ }
214
+ getOptgroupByID(e) {
215
+ for (let t of this.data) if (t instanceof s && t.id === e) return t;
216
+ return null;
217
+ }
218
+ getOptionByID(e) {
219
+ let t = this.filter((t) => t.id === e, !1);
220
+ return t.length ? t[0] : null;
221
+ }
222
+ getSelectType() {
223
+ return this.selectType;
224
+ }
225
+ getFirstOption() {
226
+ let e = null;
227
+ for (let t of this.data) if (t instanceof s ? e = t.options[0] : t instanceof o && (e = t), e) break;
228
+ return e;
229
+ }
230
+ search(e, t) {
231
+ return e = e.trim(), e === "" ? this.getData() : this.filter((n) => t(n, e), !0);
232
+ }
233
+ filter(e, t) {
234
+ let n = [];
235
+ return this.data.forEach((r) => {
236
+ if (r instanceof s) {
237
+ let i = [];
238
+ if (r.options.forEach((r) => {
239
+ (!e || e(r)) && (t ? i.push(new o(r)) : n.push(new o(r)));
240
+ }), i.length > 0) {
241
+ let e = new s(r);
242
+ e.options = i, n.push(e);
243
+ }
244
+ }
245
+ r instanceof o && (!e || e(r)) && n.push(new o(r));
246
+ }), n;
247
+ }
248
+ selectedOrderOptions(e) {
249
+ let t = [];
250
+ return this.selectedOrder.forEach((n) => {
251
+ let r = e.find((e) => e.id === n);
252
+ r && t.push(r);
253
+ }), e.forEach((e) => {
254
+ let n = !1;
255
+ t.forEach((t) => {
256
+ if (e.id === t.id) {
257
+ n = !0;
258
+ return;
259
+ }
260
+ }), n || t.push(e);
261
+ }), t;
262
+ }
263
+ }, l = class {
264
+ settings;
265
+ store;
266
+ callbacks;
267
+ lastSelectedOption;
268
+ lastRenderedOptions;
269
+ closeAnimationTimeout = null;
270
+ main;
271
+ content;
272
+ classes;
273
+ constructor(e, t, n, r) {
274
+ this.store = n, this.settings = e, this.classes = t, this.callbacks = r, this.lastSelectedOption = null, this.lastRenderedOptions = [], this.main = this.mainDiv(), this.content = this.contentDiv(), this.updateClassStyles(), this.updateAriaAttributes(), this.settings.contentPosition !== "relative" && (this.content.main.style.top = "-9999px", this.content.main.style.left = "-9999px", this.content.main.style.margin = "0", this.content.main.style.width = "auto"), this.settings.contentLocation && this.settings.contentLocation.appendChild(this.content.main);
275
+ }
276
+ addClasses(e, t) {
277
+ if (!t || t.trim() === "") return;
278
+ let n = t.split(" ").filter((e) => e.trim() !== "");
279
+ for (let t of n) e.classList.add(t.trim());
280
+ }
281
+ removeClasses(e, t) {
282
+ if (!t || t.trim() === "") return;
283
+ let n = t.split(" ").filter((e) => e.trim() !== "");
284
+ for (let t of n) e.classList.remove(t.trim());
285
+ }
286
+ enable() {
287
+ this.removeClasses(this.main.main, this.classes.disabled), this.main.main.setAttribute("aria-disabled", "false"), this.content.search.input.disabled = !1;
288
+ }
289
+ disable() {
290
+ this.addClasses(this.main.main, this.classes.disabled), this.main.main.setAttribute("aria-disabled", "true"), this.content.search.input.disabled = !0;
291
+ }
292
+ open() {
293
+ this.main.arrow.path.setAttribute("d", this.classes.arrowOpen), this.main.main.setAttribute("aria-expanded", "true"), this.closeAnimationTimeout &&= (clearTimeout(this.closeAnimationTimeout), null);
294
+ let e = this.settings.openPosition === "up" ? this.classes.dirAbove : this.classes.dirBelow;
295
+ this.addClasses(this.main.main, e), this.addClasses(this.content.main, e), this.addClasses(this.content.main, this.classes.contentOpen), this.content.search.input.removeAttribute("aria-hidden"), this.moveContent();
296
+ let t = this.store.getSelectedOptions();
297
+ if (t.length) {
298
+ let e = t[t.length - 1].id, n = this.content.list.querySelector("[data-id=\"" + e + "\"]");
299
+ n && this.ensureElementInView(this.content.list, n);
300
+ }
301
+ }
302
+ close() {
303
+ this.main.main.setAttribute("aria-expanded", "false"), this.main.arrow.path.setAttribute("d", this.classes.arrowClose), this.removeClasses(this.content.main, this.classes.contentOpen), this.content.search.input.setAttribute("aria-hidden", "true"), this.main.main.removeAttribute("aria-activedescendant");
304
+ let e = this.getAnimationTiming();
305
+ this.closeAnimationTimeout = setTimeout(() => {
306
+ this.removeClasses(this.main.main, this.classes.dirAbove), this.removeClasses(this.main.main, this.classes.dirBelow), this.removeClasses(this.content.main, this.classes.dirAbove), this.removeClasses(this.content.main, this.classes.dirBelow), this.closeAnimationTimeout = null;
307
+ }, e);
308
+ }
309
+ getAnimationTiming() {
310
+ let e = getComputedStyle(this.content.main).getPropertyValue("--ss-animation-timing").trim();
311
+ if (e) {
312
+ if (e.endsWith("ms")) return parseFloat(e);
313
+ if (e.endsWith("s")) return parseFloat(e) * 1e3;
314
+ }
315
+ return 200;
316
+ }
317
+ updateClassStyles() {
318
+ if (this.main.main.className = "", this.main.main.removeAttribute("style"), this.content.main.className = "", this.content.main.removeAttribute("style"), this.addClasses(this.main.main, this.classes.main), this.addClasses(this.content.main, 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 (let e of this.settings.class) e.trim() !== "" && (this.main.main.classList.add(e.trim()), this.content.main.classList.add(e.trim()));
319
+ (this.settings.contentPosition === "relative" || this.settings.contentPosition === "fixed") && this.content.main.classList.add("ss-" + this.settings.contentPosition);
320
+ }
321
+ updateAriaAttributes() {
322
+ let e = this.content.list.id;
323
+ 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);
324
+ }
325
+ mainDiv() {
326
+ let e = document.createElement("div");
327
+ e.dataset.id = this.settings.id, e.setAttribute("aria-label", this.settings.ariaLabel), e.tabIndex = 0, e.onkeydown = (e) => {
328
+ switch (e.key) {
329
+ case "ArrowUp":
330
+ case "ArrowDown": return this.callbacks.open(), e.key === "ArrowDown" ? this.highlight("down") : this.highlight("up"), !1;
331
+ case "Tab": return this.callbacks.close(), !0;
332
+ case "Enter":
333
+ case " ":
334
+ this.callbacks.open();
335
+ let t = this.content.list.querySelector("." + this.classes.getFirst("highlighted"));
336
+ return t && t.click(), !1;
337
+ case "Escape": return this.callbacks.close(), !1;
338
+ }
339
+ return e.key.length === 1 && this.callbacks.open(), !0;
340
+ }, e.onclick = (e) => {
341
+ this.settings.disabled || (this.settings.isOpen ? this.callbacks.close() : this.callbacks.open());
342
+ };
343
+ let t = document.createElement("div");
344
+ this.addClasses(t, this.classes.values), e.appendChild(t);
345
+ let n = document.createElement("div");
346
+ this.addClasses(n, this.classes.deselect), n.setAttribute("role", "button"), n.setAttribute("aria-label", this.settings.deselectText), n.setAttribute("tabindex", "0");
347
+ let r = this.store?.getSelectedOptions();
348
+ !this.settings.allowDeselect || this.settings.isMultiple && r && r.length <= 0 ? this.addClasses(n, this.classes.hide) : this.removeClasses(n, this.classes.hide), n.onclick = (e) => {
349
+ if (e.stopPropagation(), this.settings.disabled) return;
350
+ let t = !0, n = this.store.getSelectedOptions();
351
+ if (this.callbacks.beforeChange && (t = this.callbacks.beforeChange([], n) === !0), t) {
352
+ if (this.settings.isMultiple) this.callbacks.setSelected([], !1), this.updateDeselectAll();
353
+ else {
354
+ let e = this.store.getFirstOption(), t = e ? e.id : "";
355
+ this.callbacks.setSelected(t, !1);
356
+ }
357
+ this.settings.closeOnSelect && this.callbacks.close(), this.callbacks.afterChange && this.callbacks.afterChange(this.store.getSelectedOptions());
358
+ }
359
+ }, n.onkeydown = (e) => {
360
+ (e.key === "Enter" || e.key === " ") && (e.preventDefault(), n.click());
361
+ };
362
+ let i = document.createElementNS("http://www.w3.org/2000/svg", "svg");
363
+ i.setAttribute("viewBox", "0 0 100 100");
364
+ let a = document.createElementNS("http://www.w3.org/2000/svg", "path");
365
+ a.setAttribute("d", this.classes.deselectPath), i.appendChild(a), n.appendChild(i), e.appendChild(n);
366
+ let o = document.createElementNS("http://www.w3.org/2000/svg", "svg");
367
+ this.addClasses(o, this.classes.arrow), o.setAttribute("viewBox", "0 0 100 100");
368
+ let s = document.createElementNS("http://www.w3.org/2000/svg", "path");
369
+ return s.setAttribute("d", this.classes.arrowClose), this.settings.alwaysOpen && this.addClasses(o, this.classes.hide), o.appendChild(s), e.appendChild(o), {
370
+ main: e,
371
+ values: t,
372
+ deselect: {
373
+ main: n,
374
+ svg: i,
375
+ path: a
376
+ },
377
+ arrow: {
378
+ main: o,
379
+ path: s
380
+ }
381
+ };
382
+ }
383
+ mainFocus(e) {
384
+ e !== "click" && this.main.main.focus({ preventScroll: !0 });
385
+ }
386
+ placeholder() {
387
+ let e = this.store.filter((e) => e.placeholder, !1), t = this.settings.placeholderText;
388
+ e.length && (e[0].html === "" ? e[0].text !== "" && (t = e[0].text) : t = e[0].html);
389
+ let n = document.createElement("div");
390
+ return this.addClasses(n, this.classes.placeholder), n.innerHTML = t, n;
391
+ }
392
+ renderValues() {
393
+ if (!this.settings.isMultiple) {
394
+ this.renderSingleValue();
395
+ return;
396
+ }
397
+ this.renderMultipleValues(), this.updateDeselectAll();
398
+ }
399
+ renderSingleValue() {
400
+ let e = this.store.filter((e) => e.selected && !e.placeholder, !1), t = e.length > 0 ? e[0] : null;
401
+ if (!t) this.main.values.innerHTML = this.placeholder().outerHTML;
402
+ else {
403
+ let e = document.createElement("div");
404
+ this.addClasses(e, this.classes.single), t.html ? e.innerHTML = t.html : e.innerText = t.text, this.main.values.innerHTML = e.outerHTML;
405
+ }
406
+ !this.settings.allowDeselect || !e.length ? this.addClasses(this.main.deselect.main, this.classes.hide) : this.removeClasses(this.main.deselect.main, this.classes.hide);
407
+ }
408
+ renderMultipleValues() {
409
+ let e = this.main.values.childNodes, t = this.store.filter((e) => e.selected && e.display, !1);
410
+ if (t.length === 0) {
411
+ this.main.values.innerHTML = this.placeholder().outerHTML;
412
+ return;
413
+ } else {
414
+ let e = this.main.values.querySelector("." + this.classes.getFirst("placeholder"));
415
+ e && e.remove();
416
+ }
417
+ if (this.settings.multiString) {
418
+ let e = t;
419
+ this.settings.keepOrder && (e = this.store.selectedOrderOptions(e));
420
+ let n = document.createElement("div");
421
+ this.addClasses(n, this.classes.multiString), n.textContent = e.map((e) => e.text).join(", "), this.settings.showOptionTooltips && n.setAttribute("title", n.textContent), this.main.values.innerHTML = n.outerHTML;
422
+ return;
423
+ }
424
+ if (t.length > this.settings.maxValuesShown) {
425
+ let e = document.createElement("div");
426
+ this.addClasses(e, this.classes.max), e.textContent = this.settings.maxValuesMessage.replace("{number}", t.length.toString()), this.main.values.innerHTML = e.outerHTML;
427
+ return;
428
+ } else {
429
+ let e = this.main.values.querySelector("." + this.classes.getFirst("max"));
430
+ e && e.remove();
431
+ }
432
+ this.settings.keepOrder && (t = this.store.selectedOrderOptions(t));
433
+ let n = [];
434
+ for (let r = 0; r < e.length; r++) {
435
+ let i = e[r], a = i.getAttribute("data-id");
436
+ a && (t.filter((e) => e.id === a, !1).length || n.push(i));
437
+ }
438
+ for (let e of n) this.addClasses(e, this.classes.valueOut), setTimeout(() => {
439
+ this.main.values.hasChildNodes() && this.main.values.contains(e) && this.main.values.removeChild(e);
440
+ }, 100);
441
+ e = this.main.values.childNodes;
442
+ for (let n = 0; n < t.length; n++) {
443
+ let r = !0;
444
+ for (let i = 0; i < e.length; i++) t[n].id === String(e[i].dataset.id) && (r = !1);
445
+ r && (this.settings.keepOrder || e.length === 0 ? this.main.values.appendChild(this.multipleValue(t[n])) : n === 0 ? this.main.values.insertBefore(this.multipleValue(t[n]), e[n]) : e[n - 1].insertAdjacentElement("afterend", this.multipleValue(t[n])));
446
+ }
447
+ }
448
+ multipleValue(e) {
449
+ let t = document.createElement("div");
450
+ this.addClasses(t, this.classes.value), t.dataset.id = e.id;
451
+ let n = document.createElement("div");
452
+ if (this.addClasses(n, this.classes.valueText), n.textContent = e.text, t.appendChild(n), !e.mandatory) {
453
+ let n = document.createElement("div");
454
+ this.addClasses(n, this.classes.valueDelete), n.setAttribute("tabindex", "0"), n.setAttribute("role", "button"), n.setAttribute("aria-label", `${this.settings.removeText} ${e.text}`), n.onclick = (t) => {
455
+ if (t.preventDefault(), t.stopPropagation(), this.settings.disabled) return;
456
+ let n = !0, r = this.store.getSelectedOptions(), i = r.filter((t) => t.selected && t.id !== e.id, !0);
457
+ if (!(this.settings.minSelected && i.length < this.settings.minSelected) && (this.callbacks.beforeChange && (n = this.callbacks.beforeChange(i, r) === !0), n)) {
458
+ let e = [];
459
+ for (let t of i) {
460
+ if (t instanceof s) for (let n of t.options) n.id && e.push(n.id);
461
+ t instanceof o && e.push(t.id);
462
+ }
463
+ this.callbacks.setSelected(e, !1), this.settings.closeOnSelect && this.callbacks.close(), this.callbacks.afterChange && this.callbacks.afterChange(i), this.updateDeselectAll();
464
+ }
465
+ };
466
+ let r = document.createElementNS("http://www.w3.org/2000/svg", "svg");
467
+ r.setAttribute("viewBox", "0 0 100 100");
468
+ let i = document.createElementNS("http://www.w3.org/2000/svg", "path");
469
+ i.setAttribute("d", this.classes.optionDelete), r.appendChild(i), n.appendChild(r), t.appendChild(n), n.onkeydown = (e) => {
470
+ e.key === "Enter" && n.click();
471
+ };
472
+ }
473
+ return t;
474
+ }
475
+ contentDiv() {
476
+ let e = document.createElement("div");
477
+ e.dataset.id = this.settings.id;
478
+ let t = this.searchDiv();
479
+ e.appendChild(t.main);
480
+ let n = document.createElement("div");
481
+ this.addClasses(n, this.classes.status), n.setAttribute("aria-live", "polite"), n.setAttribute("aria-atomic", "true"), n.setAttribute("role", "status"), e.appendChild(n);
482
+ let r = this.listDiv();
483
+ return e.appendChild(r), {
484
+ main: e,
485
+ search: t,
486
+ status: n,
487
+ list: r
488
+ };
489
+ }
490
+ announce(e) {
491
+ this.settings.showSearch && (this.content.status.textContent = e);
492
+ }
493
+ moveContent() {
494
+ if (this.settings.contentPosition === "relative") {
495
+ this.moveContentBelow();
496
+ return;
497
+ }
498
+ if (this.settings.openPosition === "down") {
499
+ this.moveContentBelow();
500
+ return;
501
+ } else if (this.settings.openPosition === "up") {
502
+ this.moveContentAbove();
503
+ return;
504
+ }
505
+ this.putContent() === "up" ? this.moveContentAbove() : this.moveContentBelow();
506
+ }
507
+ searchDiv() {
508
+ let e = document.createElement("div"), t = document.createElement("input"), n = document.createElement("div");
509
+ this.addClasses(e, this.classes.search);
510
+ let i = {
511
+ main: e,
512
+ input: t
513
+ };
514
+ if (this.settings.showSearch || (this.addClasses(e, this.classes.hide), t.readOnly = !0), t.type = "search", t.placeholder = this.settings.searchPlaceholder, t.tabIndex = -1, t.setAttribute("aria-label", this.settings.searchPlaceholder), t.setAttribute("aria-autocomplete", "list"), t.setAttribute("autocapitalize", "off"), t.setAttribute("autocomplete", "off"), t.setAttribute("autocorrect", "off"), t.setAttribute("aria-hidden", "true"), t.oninput = r((e) => {
515
+ this.callbacks.search(e.target.value);
516
+ }, 100), t.onkeydown = (e) => {
517
+ switch (e.key) {
518
+ case "ArrowUp":
519
+ case "ArrowDown": return e.key === "ArrowDown" ? this.highlight("down") : this.highlight("up"), !1;
520
+ case "Tab": return this.callbacks.close(), !0;
521
+ case "Escape": return this.callbacks.close(), !1;
522
+ case " ":
523
+ let t = this.content.list.querySelector("." + this.classes.getFirst("highlighted"));
524
+ return t ? (t.click(), !1) : !0;
525
+ case "Enter":
526
+ let r = this.content.list.querySelector("." + this.classes.getFirst("highlighted"));
527
+ return r ? (r.click(), !1) : this.callbacks.addable ? (n.click(), !1) : !0;
528
+ }
529
+ return !0;
530
+ }, e.appendChild(t), this.callbacks.addable) {
531
+ this.addClasses(n, this.classes.addable);
532
+ let t = document.createElementNS("http://www.w3.org/2000/svg", "svg");
533
+ t.setAttribute("viewBox", "0 0 100 100");
534
+ let r = document.createElementNS("http://www.w3.org/2000/svg", "path");
535
+ r.setAttribute("d", this.classes.addablePath), t.appendChild(r), n.appendChild(t), n.onclick = (e) => {
536
+ if (e.preventDefault(), e.stopPropagation(), !this.callbacks.addable) return;
537
+ let t = this.content.search.input.value.trim();
538
+ if (t === "") {
539
+ this.content.search.input.focus();
540
+ return;
541
+ }
542
+ let n = (e) => {
543
+ let t = new o(e);
544
+ if (this.callbacks.addOption(t), this.settings.isMultiple) {
545
+ let e = this.store.getSelected();
546
+ e.push(t.id), this.callbacks.setSelected(e, !0);
547
+ } else this.callbacks.setSelected([t.id], !0);
548
+ this.callbacks.search(""), this.settings.closeOnSelect && setTimeout(() => {
549
+ this.callbacks.close();
550
+ }, 100);
551
+ }, r = this.callbacks.addable(t);
552
+ r === !1 || r == null || (r instanceof Promise ? r.then((e) => {
553
+ typeof e == "string" ? n({
554
+ text: e,
555
+ value: e
556
+ }) : r instanceof Error ? this.renderError(r.message) : n(e);
557
+ }) : typeof r == "string" ? n({
558
+ text: r,
559
+ value: r
560
+ }) : r instanceof Error ? this.renderError(r.message) : n(r));
561
+ }, e.appendChild(n), i.addable = {
562
+ main: n,
563
+ svg: t,
564
+ path: r
565
+ };
566
+ }
567
+ return i;
568
+ }
569
+ searchFocus() {
570
+ this.content.search.input.focus({ preventScroll: !0 });
571
+ }
572
+ getOptions(e = !1, t = !1, n = !1) {
573
+ let r = "." + this.classes.getFirst("option");
574
+ return e && (r += ":not(." + this.classes.getFirst("placeholder") + ")"), t && (r += ":not(." + this.classes.getFirst("disabled") + ")"), n && (r += ":not(." + this.classes.getFirst("hide") + ")"), Array.from(this.content.list.querySelectorAll(r));
575
+ }
576
+ highlight(e) {
577
+ let t = this.getOptions(!0, !0, !0);
578
+ if (t.length === 0) return;
579
+ if (t.length === 1 && !t[0].classList.contains(this.classes.getFirst("highlighted"))) {
580
+ this.addClasses(t[0], this.classes.highlighted);
581
+ return;
582
+ }
583
+ let n = !1;
584
+ for (let e of t) e.classList.contains(this.classes.getFirst("highlighted")) && (n = !0);
585
+ if (!n) {
586
+ for (let e of t) if (e.classList.contains(this.classes.getFirst("selected"))) {
587
+ this.addClasses(e, this.classes.highlighted);
588
+ break;
589
+ }
590
+ }
591
+ for (let n = 0; n < t.length; n++) if (t[n].classList.contains(this.classes.getFirst("highlighted"))) {
592
+ let r = t[n];
593
+ this.removeClasses(r, this.classes.highlighted);
594
+ let i = r.parentElement;
595
+ if (i && i.classList.contains(this.classes.getFirst("mainOpen"))) {
596
+ let e = i.querySelector("." + this.classes.getFirst("optgroupLabel"));
597
+ e && e.click();
598
+ }
599
+ let a = t[e === "down" ? n + 1 < t.length ? n + 1 : 0 : n - 1 >= 0 ? n - 1 : t.length - 1];
600
+ this.addClasses(a, this.classes.highlighted), this.ensureElementInView(this.content.list, a), a.id && this.main.main.setAttribute("aria-activedescendant", a.id);
601
+ let o = a.parentElement;
602
+ if (o && o.classList.contains(this.classes.getFirst("close"))) {
603
+ let e = o.querySelector("." + this.classes.getFirst("optgroupLabel"));
604
+ e && e.click();
605
+ }
606
+ return;
607
+ }
608
+ let r = t[e === "down" ? 0 : t.length - 1];
609
+ this.addClasses(r, this.classes.highlighted), r.id && this.main.main.setAttribute("aria-activedescendant", r.id), this.ensureElementInView(this.content.list, r);
610
+ }
611
+ listDiv() {
612
+ let e = document.createElement("div");
613
+ this.addClasses(e, this.classes.list);
614
+ let t = this.settings.id + "-list";
615
+ return e.id = t, e.dataset.id = t, e;
616
+ }
617
+ renderError(e) {
618
+ this.content.list.innerHTML = "";
619
+ let t = document.createElement("div");
620
+ this.addClasses(t, this.classes.error), t.textContent = e, this.content.list.appendChild(t);
621
+ }
622
+ renderSearching() {
623
+ this.content.list.innerHTML = "";
624
+ let e = document.createElement("div");
625
+ this.addClasses(e, this.classes.searching), e.textContent = this.settings.searchingText, this.content.list.appendChild(e), this.announce(this.settings.searchingText);
626
+ }
627
+ renderOptions(e) {
628
+ if (this.lastRenderedOptions = e.map((e) => e instanceof o ? [e] : e.options.map((e) => new o(e))).flat(), this.content.list.innerHTML = "", e.length === 0) {
629
+ let e = document.createElement("div");
630
+ if (this.addClasses(e, this.classes.search), this.callbacks.addable) {
631
+ let t = this.settings.addableText.replace("{value}", this.content.search.input.value);
632
+ e.innerHTML = t, this.announce(t);
633
+ } else e.innerHTML = this.settings.searchText, this.announce(this.settings.searchText);
634
+ this.content.list.appendChild(e);
635
+ return;
636
+ }
637
+ this.settings.allowDeselect && !this.settings.isMultiple && (this.store.filter((e) => e.placeholder, !1).length || this.store.addOption(new o({
638
+ text: "",
639
+ value: "",
640
+ selected: !1,
641
+ placeholder: !0
642
+ }), !0));
643
+ let t = document.createDocumentFragment();
644
+ for (let n of e) {
645
+ if (n instanceof s) {
646
+ let e = document.createElement("div");
647
+ this.addClasses(e, this.classes.optgroup);
648
+ let r = document.createElement("div");
649
+ this.addClasses(r, this.classes.optgroupLabel), e.appendChild(r);
650
+ let i = document.createElement("div");
651
+ this.addClasses(i, this.classes.optgroupLabelText), i.textContent = n.label, r.appendChild(i);
652
+ let a = document.createElement("div");
653
+ if (this.addClasses(a, this.classes.optgroupActions), r.appendChild(a), this.settings.isMultiple && n.selectAll) {
654
+ let e = document.createElement("div");
655
+ this.addClasses(e, this.classes.optgroupSelectAll);
656
+ let t = !0;
657
+ for (let e of n.options) if (!e.selected) {
658
+ t = !1;
659
+ break;
660
+ }
661
+ t && this.addClasses(e, this.classes.selected);
662
+ let r = document.createElement("span");
663
+ r.textContent = n.selectAllText, e.appendChild(r);
664
+ let i = document.createElementNS("http://www.w3.org/2000/svg", "svg");
665
+ i.setAttribute("viewBox", "0 0 100 100"), e.appendChild(i);
666
+ let s = document.createElementNS("http://www.w3.org/2000/svg", "path");
667
+ s.setAttribute("d", this.classes.optgroupSelectAllBox), i.appendChild(s);
668
+ let c = document.createElementNS("http://www.w3.org/2000/svg", "path");
669
+ c.setAttribute("d", this.classes.optgroupSelectAllCheck), i.appendChild(c), e.addEventListener("click", (e) => {
670
+ e.preventDefault(), e.stopPropagation();
671
+ let r = this.store.getSelected();
672
+ if (t) {
673
+ let e = r.filter((e) => {
674
+ for (let t of n.options) if (e === t.id) return !1;
675
+ return !0;
676
+ });
677
+ this.callbacks.setSelected(e, !0);
678
+ return;
679
+ } else {
680
+ let e = n.options.map((e) => e.id).filter((e) => e !== void 0), t = r.concat(e);
681
+ for (let e of n.options) e.id && !this.store.getOptionByID(e.id) && this.callbacks.addOption(new o(e));
682
+ this.callbacks.setSelected(t, !0);
683
+ return;
684
+ }
685
+ }), a.appendChild(e);
686
+ }
687
+ if (n.closable !== "off") {
688
+ let t = document.createElement("div");
689
+ this.addClasses(t, this.classes.optgroupClosable);
690
+ let i = document.createElementNS("http://www.w3.org/2000/svg", "svg");
691
+ i.setAttribute("viewBox", "0 0 100 100"), this.addClasses(i, this.classes.arrow), t.appendChild(i);
692
+ let o = document.createElementNS("http://www.w3.org/2000/svg", "path");
693
+ i.appendChild(o), n.options.some((e) => e.selected) || this.content.search.input.value.trim() !== "" ? (this.addClasses(t, this.classes.mainOpen), o.setAttribute("d", this.classes.arrowOpen)) : n.closable === "open" ? (this.addClasses(e, this.classes.mainOpen), o.setAttribute("d", this.classes.arrowOpen)) : n.closable === "close" && (this.addClasses(e, this.classes.close), o.setAttribute("d", this.classes.arrowClose)), r.addEventListener("click", (t) => {
694
+ t.preventDefault(), t.stopPropagation(), e.classList.contains(this.classes.getFirst("close")) ? (this.removeClasses(e, this.classes.close), this.addClasses(e, this.classes.mainOpen), o.setAttribute("d", this.classes.arrowOpen)) : (this.removeClasses(e, this.classes.mainOpen), this.addClasses(e, this.classes.close), o.setAttribute("d", this.classes.arrowClose));
695
+ }), a.appendChild(t);
696
+ }
697
+ e.appendChild(r);
698
+ for (let r of n.options) e.appendChild(this.option(new o(r))), t.appendChild(e);
699
+ }
700
+ n instanceof o && t.appendChild(this.option(n));
701
+ }
702
+ this.content.list.appendChild(t), this.announce(this.settings.resultsText.replace("{count}", String(this.lastRenderedOptions.length)));
703
+ }
704
+ option(e) {
705
+ if (e.placeholder) {
706
+ let e = document.createElement("div");
707
+ return this.addClasses(e, this.classes.option), this.addClasses(e, this.classes.hide), e;
708
+ }
709
+ let t = document.createElement("div");
710
+ return t.dataset.id = e.id, t.id = this.settings.id + "-" + e.id, this.addClasses(t, this.classes.option), t.setAttribute("role", "option"), e.class && e.class.split(" ").forEach((e) => {
711
+ t.classList.add(e);
712
+ }), e.style && (t.style.cssText = e.style), this.settings.searchHighlight && this.content.search.input.value.trim() !== "" ? t.innerHTML = this.highlightText(e.html === "" ? e.text : e.html, this.content.search.input.value, this.classes.searchHighlighter) : e.html === "" ? t.textContent = e.text : t.innerHTML = e.html, this.settings.showOptionTooltips && t.textContent && t.setAttribute("title", t.textContent), e.display || this.addClasses(t, this.classes.hide), e.disabled && this.addClasses(t, this.classes.disabled), e.selected && this.settings.hideSelected && this.addClasses(t, this.classes.hide), e.selected ? (this.addClasses(t, this.classes.selected), t.setAttribute("aria-selected", "true"), this.main.main.setAttribute("aria-activedescendant", t.id)) : (this.removeClasses(t, this.classes.selected), t.setAttribute("aria-selected", "false")), t.addEventListener("click", (t) => {
713
+ t.preventDefault(), t.stopPropagation();
714
+ let n = this.store.getSelected(), r = t.currentTarget, i = String(r.dataset.id), a = t.ctrlKey || t.metaKey;
715
+ if (e.disabled || !this.settings.isMultiple && e.selected && !this.settings.allowDeselect || e.selected && e.mandatory || this.settings.isMultiple && this.settings.maxSelected <= n.length && !e.selected || this.settings.isMultiple && this.settings.minSelected >= n.length && e.selected && !a) return;
716
+ let o = !1, s = this.store.getSelectedOptions(), c = [];
717
+ if (this.settings.isMultiple) {
718
+ let n = s.some((e) => e.id === i);
719
+ if (t.shiftKey && this.lastSelectedOption) {
720
+ let t = this.lastRenderedOptions, n = t.findIndex((e) => e.id === this.lastSelectedOption.id), r = t.findIndex((t) => t.id === e.id);
721
+ if (n >= 0 && r >= 0) {
722
+ let e = Math.min(n, r), i = Math.max(n, r), a = t.slice(e, i + 1).filter((e) => !s.find((t) => t.id === e.id));
723
+ c = s.length + a.length <= this.settings.maxSelected ? s.concat(a) : s;
724
+ } else c = s;
725
+ } else c = n ? s.filter((e) => e.id !== i) : s.concat(e), this.lastSelectedOption = e;
726
+ }
727
+ if (this.settings.isMultiple || (c = e.selected ? [] : [e]), this.callbacks.beforeChange || (o = !0), this.callbacks.beforeChange && (o = this.callbacks.beforeChange(c, s) !== !1), o) {
728
+ this.store.getOptionByID(i) || this.callbacks.addOption(e), this.callbacks.setSelected(c.map((e) => e.id), !1);
729
+ let n = t.ctrlKey || t.metaKey || t.shiftKey;
730
+ this.settings.closeOnSelect && !(this.settings.isMultiple && n) && this.callbacks.close(), this.callbacks.afterChange && this.callbacks.afterChange(c);
731
+ }
732
+ }), t;
733
+ }
734
+ destroy() {
735
+ this.closeAnimationTimeout &&= (clearTimeout(this.closeAnimationTimeout), null), this.main.main.remove(), this.content.main.remove();
736
+ }
737
+ highlightText(e, t, n) {
738
+ let r = t.trim();
739
+ if (r === "") return e;
740
+ let i = r.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), a = document.createElement("div");
741
+ a.innerHTML = e;
742
+ let o = (e) => {
743
+ if (e.nodeType === Node.TEXT_NODE) {
744
+ let t = e.textContent || "", r = RegExp("(" + i + ")", "i");
745
+ if (r.test(t)) {
746
+ let i = document.createElement("span");
747
+ t.split(r).forEach((e, t) => {
748
+ if (e && r.test(e)) {
749
+ let t = document.createElement("mark");
750
+ t.className = n, t.textContent = e, i.appendChild(t);
751
+ } else e && i.appendChild(document.createTextNode(e));
752
+ }), e.parentNode?.replaceChild(i, e);
753
+ }
754
+ } else e.nodeType === Node.ELEMENT_NODE && Array.from(e.childNodes).forEach((e) => o(e));
755
+ };
756
+ return Array.from(a.childNodes).forEach((e) => o(e)), a.innerHTML;
757
+ }
758
+ setContentDirection(e) {
759
+ let t = e === "above", n = t ? this.classes.dirAbove : this.classes.dirBelow, r = t ? this.classes.dirBelow : this.classes.dirAbove;
760
+ if (this.removeClasses(this.main.main, r), this.addClasses(this.main.main, n), this.removeClasses(this.content.main, r), this.addClasses(this.content.main, n), t) {
761
+ let e = this.main.main.offsetHeight, t = this.content.main.offsetHeight;
762
+ this.content.main.style.margin = "-" + (e + t - 1) + "px 0px 0px 0px";
763
+ } else this.content.main.style.margin = "-1px 0px 0px 0px";
764
+ }
765
+ setContentPosition() {
766
+ if (this.settings.contentPosition === "relative") return;
767
+ let e = this.main.main.getBoundingClientRect(), t, n;
768
+ this.settings.contentPosition === "fixed" ? (t = e.top + e.height, n = e.left) : (t = e.top + window.scrollY + e.height, n = e.left + window.scrollX), this.content.main.style.top = t + "px", this.content.main.style.left = n + "px";
769
+ let r = this.settings.contentWidth;
770
+ this.content.main.style.width = "", this.content.main.style.minWidth = "", this.content.main.style.maxWidth = "", r ? r.startsWith(">") ? this.content.main.style.minWidth = r.slice(1) : r.startsWith("<") ? this.content.main.style.maxWidth = r.slice(1) : this.content.main.style.width = r : this.content.main.style.width = e.width + "px";
771
+ let i = window.innerWidth - 20, a = () => {
772
+ let e = this.content.main.getBoundingClientRect().right;
773
+ if (e <= i) return;
774
+ let t = e - i, n = parseFloat(this.content.main.style.left) || 0;
775
+ if (this.settings.contentPosition === "fixed") {
776
+ let e = Math.max(20, n - t);
777
+ this.content.main.style.left = e + "px";
778
+ } else {
779
+ let e = Math.max(window.scrollX + 20, n - t);
780
+ this.content.main.style.left = e + "px";
781
+ }
782
+ };
783
+ requestAnimationFrame(() => {
784
+ a(), requestAnimationFrame(a);
785
+ });
786
+ }
787
+ moveContentAbove() {
788
+ this.setContentDirection("above"), this.setContentPosition();
789
+ }
790
+ moveContentBelow() {
791
+ this.setContentDirection("below"), this.setContentPosition();
792
+ }
793
+ ensureElementInView(e, t) {
794
+ let n = e.scrollTop + e.offsetTop, r = n + e.clientHeight, i = t.offsetTop, a = i + t.clientHeight;
795
+ i < n ? e.scrollTop -= n - i : a > r && (e.scrollTop += a - r);
796
+ }
797
+ putContent() {
798
+ let e = this.main.main.offsetHeight, t = this.main.main.getBoundingClientRect(), n = this.content.main.offsetHeight;
799
+ return window.innerHeight - (t.top + e) <= n && t.top > n ? "up" : "down";
800
+ }
801
+ updateDeselectAll() {
802
+ if (!this.store || !this.settings) return;
803
+ let e = this.store.getSelectedOptions(), t = e && e.length > 0, n = this.settings.isMultiple, r = this.settings.allowDeselect, i = this.main.deselect.main, a = this.classes.hide;
804
+ r && !(n && !t) ? this.removeClasses(i, a) : this.addClasses(i, a);
805
+ }
806
+ }, u = class {
807
+ select;
808
+ onValueChange;
809
+ onClassChange;
810
+ onDisabledChange;
811
+ onOptionsChange;
812
+ onLabelClick;
813
+ listen = !1;
814
+ observer = null;
815
+ isUpdating = !1;
816
+ pendingOptionsChange = null;
817
+ preventNativeSelect = null;
818
+ preventNativeSelectMousedown = null;
819
+ preventNativeSelectFocus = null;
820
+ constructor(e) {
821
+ 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);
822
+ }
823
+ enable() {
824
+ this.select.disabled = !1;
825
+ }
826
+ disable() {
827
+ this.select.disabled = !0;
828
+ }
829
+ hideUI() {
830
+ 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"), this.preventNativeSelect || (this.preventNativeSelect = (e) => {
831
+ e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation();
832
+ }, this.preventNativeSelectMousedown = (e) => {
833
+ e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation();
834
+ }, this.preventNativeSelectFocus = (e) => {
835
+ e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation();
836
+ }, this.select.addEventListener("click", this.preventNativeSelect, {
837
+ capture: !0,
838
+ passive: !1
839
+ }), this.select.addEventListener("mousedown", this.preventNativeSelectMousedown, {
840
+ capture: !0,
841
+ passive: !1
842
+ }), this.select.addEventListener("focus", this.preventNativeSelectFocus, {
843
+ capture: !0,
844
+ passive: !1
845
+ }));
846
+ }
847
+ showUI() {
848
+ 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"), this.preventNativeSelect &&= (this.select.removeEventListener("click", this.preventNativeSelect, { capture: !0 }), null), this.preventNativeSelectMousedown &&= (this.select.removeEventListener("mousedown", this.preventNativeSelectMousedown, { capture: !0 }), null), this.preventNativeSelectFocus &&= (this.select.removeEventListener("focus", this.preventNativeSelectFocus, { capture: !0 }), null);
849
+ }
850
+ changeListen(e) {
851
+ this.listen = e, e && this.observer && this.observer.observe(this.select, {
852
+ subtree: !0,
853
+ childList: !0,
854
+ attributes: !0
855
+ }), e || this.observer && this.observer.disconnect();
856
+ }
857
+ valueChange(e) {
858
+ return this.listen && this.onValueChange && this.onValueChange(this.getSelectedOptions()), !0;
859
+ }
860
+ observeCall(e) {
861
+ if (!this.listen) return;
862
+ let t = !1, n = !1, r = !1, i = !1;
863
+ for (let a of e) {
864
+ if (a.target === this.select && (a.attributeName === "disabled" && (n = !0), a.attributeName === "class" && (t = !0), a.type === "childList")) {
865
+ for (let e of Array.from(a.addedNodes)) if (e.nodeName === "OPTION" && e.value === this.select.value) {
866
+ i = !0;
867
+ break;
868
+ }
869
+ r = !0;
870
+ }
871
+ (a.target.nodeName === "OPTGROUP" || a.target.nodeName === "OPTION") && (r = !0);
872
+ }
873
+ if (t && this.onClassChange && this.onClassChange(this.select.className.split(" ")), n && this.onDisabledChange && (this.changeListen(!1), this.onDisabledChange(this.select.disabled), this.changeListen(!0)), r && this.onOptionsChange) {
874
+ if (this.isUpdating) {
875
+ if (this.select.options.length > 0) {
876
+ let e = this.getData();
877
+ e.length > 0 && (this.pendingOptionsChange = e);
878
+ }
879
+ i && this.select.dispatchEvent(new Event("change"));
880
+ return;
881
+ }
882
+ this.changeListen(!1), this.onOptionsChange(this.getData()), this.changeListen(!0);
883
+ }
884
+ i && this.select.dispatchEvent(new Event("change"));
885
+ }
886
+ getData() {
887
+ let e = [], t = this.select.childNodes;
888
+ for (let n of t) n.nodeName === "OPTGROUP" && e.push(this.getDataFromOptgroup(n)), n.nodeName === "OPTION" && e.push(this.getDataFromOption(n));
889
+ return e;
890
+ }
891
+ getDataFromOptgroup(e) {
892
+ let t = {
893
+ id: e.id,
894
+ label: e.label,
895
+ selectAll: e.dataset ? e.dataset.selectall === "true" : !1,
896
+ selectAllText: e.dataset ? e.dataset.selectalltext : "Select all",
897
+ closable: e.dataset ? e.dataset.closable : "off",
898
+ options: []
899
+ }, n = e.childNodes;
900
+ for (let e of n) e.nodeName === "OPTION" && t.options.push(this.getDataFromOption(e));
901
+ return t;
902
+ }
903
+ getDataFromOption(e) {
904
+ return {
905
+ id: e.id,
906
+ value: e.value,
907
+ text: e.text,
908
+ html: e.dataset && e.dataset.html ? e.dataset.html : "",
909
+ defaultSelected: e.defaultSelected,
910
+ selected: e.selected,
911
+ display: e.style.display !== "none",
912
+ disabled: e.disabled,
913
+ mandatory: e.dataset ? e.dataset.mandatory === "true" : !1,
914
+ placeholder: e.dataset.placeholder === "true",
915
+ class: e.className,
916
+ style: e.style.cssText,
917
+ data: e.dataset
918
+ };
919
+ }
920
+ getSelectedOptions() {
921
+ let e = [], t = this.select.childNodes;
922
+ for (let n of t) {
923
+ if (n.nodeName === "OPTGROUP") {
924
+ let t = n.childNodes;
925
+ for (let n of t) if (n.nodeName === "OPTION") {
926
+ let t = n;
927
+ t.selected && e.push(this.getDataFromOption(t));
928
+ }
929
+ }
930
+ if (n.nodeName === "OPTION") {
931
+ let t = n;
932
+ t.selected && e.push(this.getDataFromOption(t));
933
+ }
934
+ }
935
+ return e;
936
+ }
937
+ getSelectedValues() {
938
+ return this.getSelectedOptions().map((e) => e.value);
939
+ }
940
+ setSelected(e) {
941
+ this.changeListen(!1);
942
+ let t = this.select.childNodes;
943
+ for (let n of t) {
944
+ if (n.nodeName === "OPTGROUP") {
945
+ let t = n.childNodes;
946
+ for (let n of t) if (n.nodeName === "OPTION") {
947
+ let t = n;
948
+ t.selected = e.includes(t.id);
949
+ }
950
+ }
951
+ if (n.nodeName === "OPTION") {
952
+ let t = n;
953
+ t.selected = e.includes(t.id);
954
+ }
955
+ }
956
+ this.changeListen(!0);
957
+ }
958
+ setSelectedByValue(e) {
959
+ this.changeListen(!1);
960
+ let t = this.select.childNodes;
961
+ for (let n of t) {
962
+ if (n.nodeName === "OPTGROUP") {
963
+ let t = n.childNodes;
964
+ for (let n of t) if (n.nodeName === "OPTION") {
965
+ let t = n;
966
+ t.selected = e.includes(t.value);
967
+ }
968
+ }
969
+ if (n.nodeName === "OPTION") {
970
+ let t = n;
971
+ t.selected = e.includes(t.value);
972
+ }
973
+ }
974
+ this.changeListen(!0);
975
+ }
976
+ updateSelect(e, t, n) {
977
+ this.changeListen(!1), e && (this.select.dataset.id = e), t && (this.select.style.cssText = t), n && (this.select.className = "", n.forEach((e) => {
978
+ e.trim() !== "" && this.select.classList.add(e.trim());
979
+ })), this.changeListen(!0);
980
+ }
981
+ updateOptions(e) {
982
+ if (!(!e || e.length === 0)) {
983
+ this.isUpdating = !0, this.pendingOptionsChange = null, this.changeListen(!1), this.select.innerHTML = "";
984
+ for (let t of e) t instanceof s && this.select.appendChild(this.createOptgroup(t)), t instanceof o && this.select.appendChild(this.createOption(t));
985
+ if (this.select.dispatchEvent(new Event("change", { bubbles: !0 })), this.changeListen(!0), this.isUpdating = !1, this.pendingOptionsChange !== null) {
986
+ let e = this.pendingOptionsChange;
987
+ e.length > 0 && this.onOptionsChange ? (this.pendingOptionsChange = null, this.changeListen(!1), this.onOptionsChange(e), this.changeListen(!0)) : this.pendingOptionsChange = null;
988
+ }
989
+ }
990
+ }
991
+ createOptgroup(e) {
992
+ let t = document.createElement("optgroup");
993
+ 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 (let n of e.options) t.appendChild(this.createOption(n));
994
+ return t;
995
+ }
996
+ createOption(e) {
997
+ let t = document.createElement("option");
998
+ 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((e) => {
999
+ t.classList.add(e);
1000
+ }), e.data && typeof e.data == "object" && Object.keys(e.data).forEach((n) => {
1001
+ t.setAttribute("data-" + a(n), e.data[n]);
1002
+ }), t;
1003
+ }
1004
+ setupLabelHandlers() {
1005
+ let e = [], t = this.select.id;
1006
+ t && document.querySelectorAll(`label[for="${t}"]`).forEach((t) => e.push(t));
1007
+ let r = this.select.parentElement;
1008
+ for (; r && r !== document.body;) {
1009
+ if (r.tagName === "LABEL") {
1010
+ e.push(r);
1011
+ break;
1012
+ }
1013
+ r = r.parentElement;
1014
+ }
1015
+ Array.from(new Set(e)).forEach((e) => {
1016
+ if (e.__slimSelectLabelHandler) return;
1017
+ let t = (e) => {
1018
+ let t = e.target, r = n(t, this.select.dataset.id);
1019
+ e.preventDefault(), !r && this.onLabelClick && this.onLabelClick();
1020
+ };
1021
+ e.__slimSelectLabelHandler = t, e.addEventListener("click", t, {
1022
+ capture: !0,
1023
+ passive: !1
1024
+ });
1025
+ });
1026
+ }
1027
+ removeLabelHandlers() {
1028
+ let e = [], t = this.select.id;
1029
+ t && document.querySelectorAll(`label[for="${t}"]`).forEach((t) => e.push(t));
1030
+ let n = this.select.parentElement;
1031
+ for (; n && n !== document.body;) {
1032
+ if (n.tagName === "LABEL") {
1033
+ e.push(n);
1034
+ break;
1035
+ }
1036
+ n = n.parentElement;
1037
+ }
1038
+ Array.from(new Set(e)).forEach((e) => {
1039
+ let t = e.__slimSelectLabelHandler;
1040
+ t && (e.removeEventListener("click", t, { capture: !0 }), delete e.__slimSelectLabelHandler);
1041
+ });
1042
+ }
1043
+ destroy() {
1044
+ this.changeListen(!1), this.select.removeEventListener("change", this.valueChange), this.preventNativeSelect &&= (this.select.removeEventListener("click", this.preventNativeSelect, { capture: !0 }), null), this.preventNativeSelectMousedown &&= (this.select.removeEventListener("mousedown", this.preventNativeSelectMousedown, { capture: !0 }), null), this.preventNativeSelectFocus &&= (this.select.removeEventListener("focus", this.preventNativeSelectFocus, { capture: !0 }), null), this.observer &&= (this.observer.disconnect(), null), this.removeLabelHandlers(), delete this.select.dataset.id, this.showUI();
1045
+ }
1046
+ }, d = class {
1047
+ id = "";
1048
+ style = "";
1049
+ class = [];
1050
+ isMultiple = !1;
1051
+ isOpen = !1;
1052
+ isFullOpen = !1;
1053
+ intervalMove = null;
1054
+ disabled;
1055
+ alwaysOpen;
1056
+ showSearch;
1057
+ focusSearch;
1058
+ keepSearch;
1059
+ ariaLabel;
1060
+ searchPlaceholder;
1061
+ searchText;
1062
+ searchingText;
1063
+ resultsText;
1064
+ deselectText;
1065
+ removeText;
1066
+ searchHighlight;
1067
+ closeOnSelect;
1068
+ contentLocation;
1069
+ contentPosition;
1070
+ contentWidth;
1071
+ openPosition;
1072
+ placeholderText;
1073
+ allowDeselect;
1074
+ hideSelected;
1075
+ multiString;
1076
+ keepOrder;
1077
+ showOptionTooltips;
1078
+ minSelected;
1079
+ maxSelected;
1080
+ timeoutDelay;
1081
+ maxValuesShown;
1082
+ maxValuesMessage;
1083
+ addableText;
1084
+ constructor(e) {
1085
+ e ||= {}, this.id = "ss-" + t(), this.style = e.style || "", this.class = e.class || [], this.disabled = e.disabled === void 0 ? !1 : e.disabled, this.alwaysOpen = e.alwaysOpen === void 0 ? !1 : e.alwaysOpen, this.showSearch = e.showSearch === void 0 ? !0 : e.showSearch, this.focusSearch = e.focusSearch === void 0 ? !0 : e.focusSearch, this.keepSearch = e.keepSearch === void 0 ? !1 : e.keepSearch, this.ariaLabel = e.ariaLabel || "Combobox", this.searchPlaceholder = e.searchPlaceholder || "Search...", this.searchText = e.searchText || "No Results", this.searchingText = e.searchingText || "Searching...", this.resultsText = e.resultsText || "{count} results available", this.deselectText = e.deselectText || "Clear", this.removeText = e.removeText || "Remove", this.searchHighlight = e.searchHighlight === void 0 ? !1 : e.searchHighlight, this.closeOnSelect = e.closeOnSelect === void 0 ? !0 : e.closeOnSelect, this.contentLocation = e.contentLocation || document.body, this.contentPosition = e.contentPosition || "absolute", this.contentWidth = e.contentWidth || "", this.openPosition = e.openPosition || "auto", this.placeholderText = e.placeholderText === void 0 ? "Select Value" : e.placeholderText, this.allowDeselect = e.allowDeselect === void 0 ? !1 : e.allowDeselect, this.hideSelected = e.hideSelected === void 0 ? !1 : e.hideSelected, this.multiString = e.multiString === void 0 ? !1 : e.multiString, this.keepOrder = e.keepOrder === void 0 ? !1 : e.keepOrder, this.showOptionTooltips = e.showOptionTooltips === void 0 ? !1 : e.showOptionTooltips, 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}";
1086
+ }
1087
+ }, f = class {
1088
+ selectEl;
1089
+ settings;
1090
+ cssClasses;
1091
+ select;
1092
+ store;
1093
+ render;
1094
+ openTimeout = null;
1095
+ closeTimeout = null;
1096
+ events = {
1097
+ search: void 0,
1098
+ searchFilter: (e, t) => e.text.toLowerCase().indexOf(t.toLowerCase()) !== -1,
1099
+ addable: void 0,
1100
+ beforeChange: void 0,
1101
+ afterChange: void 0,
1102
+ beforeOpen: void 0,
1103
+ afterOpen: void 0,
1104
+ beforeClose: void 0,
1105
+ afterClose: void 0
1106
+ };
1107
+ constructor(t) {
1108
+ if (this.selectEl = typeof t.select == "string" ? document.querySelector(t.select) : t.select, !this.selectEl) {
1109
+ t.events && t.events.error && t.events.error(/* @__PURE__ */ Error("Could not find select element"));
1110
+ return;
1111
+ }
1112
+ if (this.selectEl.tagName !== "SELECT") {
1113
+ t.events && t.events.error && t.events.error(/* @__PURE__ */ Error("Element isnt of type select"));
1114
+ return;
1115
+ }
1116
+ this.selectEl.dataset.ssid && this.destroy(), this.settings = new d(t.settings), this.cssClasses = new e(t.cssClasses);
1117
+ let n = [
1118
+ "beforeOpen",
1119
+ "afterOpen",
1120
+ "beforeClose",
1121
+ "afterClose"
1122
+ ];
1123
+ for (let e in t.events) t.events.hasOwnProperty(e) && (n.indexOf(e) === -1 ? this.events[e] = t.events[e] : this.events[e] = r(t.events[e], 100));
1124
+ this.settings.disabled = t.settings?.disabled ? t.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 u(this.selectEl), this.selectEl.id || (this.selectEl.id = this.settings.id), this.select.updateSelect(this.settings.id, this.settings.style, this.settings.class), this.select.hideUI(), this.select.onValueChange = (e) => {
1125
+ this.setSelected(e.map((e) => e.id));
1126
+ }, this.select.onClassChange = (e) => {
1127
+ this.settings.class = e, this.render.updateClassStyles();
1128
+ }, this.select.onDisabledChange = (e) => {
1129
+ e ? this.disable() : this.enable();
1130
+ }, this.select.onOptionsChange = (e) => {
1131
+ this.setData(e || []);
1132
+ }, this.select.onLabelClick = () => {
1133
+ this.settings.disabled || (this.settings.isOpen ? this.close() : this.open());
1134
+ };
1135
+ let i = t.data ? t.data : this.select.getData();
1136
+ this.store = new c(this.settings.isMultiple ? "multiple" : "single", i), t.data && this.select.updateOptions(this.store.getData());
1137
+ let a = {
1138
+ open: this.open.bind(this),
1139
+ close: this.close.bind(this),
1140
+ addable: this.events.addable ? this.events.addable : void 0,
1141
+ setSelected: this.setSelected.bind(this),
1142
+ addOption: this.addOption.bind(this),
1143
+ search: this.search.bind(this),
1144
+ beforeChange: this.events.beforeChange,
1145
+ afterChange: this.events.afterChange
1146
+ };
1147
+ this.render = new l(this.settings, this.cssClasses, this.store, a), this.render.renderValues(), this.render.renderOptions(this.store.getData());
1148
+ let o = this.selectEl.getAttribute("aria-label"), s = this.selectEl.getAttribute("aria-labelledby");
1149
+ if (o) this.render.main.main.setAttribute("aria-label", o);
1150
+ else if (s) this.render.main.main.removeAttribute("aria-label"), this.render.main.main.setAttribute("aria-labelledby", s);
1151
+ else if (this.selectEl.labels && this.selectEl.labels.length > 0) {
1152
+ let e = Array.from(this.selectEl.labels).map((e, t) => (e.id ||= `${this.settings.id}-label-${t}`, e.id));
1153
+ this.render.main.main.removeAttribute("aria-label"), this.render.main.main.setAttribute("aria-labelledby", e.join(" "));
1154
+ }
1155
+ this.selectEl.parentNode && this.selectEl.parentNode.insertBefore(this.render.main.main, this.selectEl.nextSibling), window.addEventListener("resize", this.windowResize, !1), this.settings.openPosition === "auto" && window.addEventListener("scroll", this.windowScroll, !1), document.addEventListener("visibilitychange", this.windowVisibilityChange), this.settings.disabled && this.disable(), this.settings.alwaysOpen && this.open(), this.select.setupLabelHandlers(), this.selectEl.slim = this;
1156
+ }
1157
+ enable() {
1158
+ this.settings.disabled = !1, this.select.enable(), this.render.enable();
1159
+ }
1160
+ disable() {
1161
+ this.settings.disabled = !0, this.select.disable(), this.render.disable();
1162
+ }
1163
+ getData() {
1164
+ return this.store.getData();
1165
+ }
1166
+ setData(e) {
1167
+ let t = this.store.getSelected(), n = this.store.validateDataArray(e);
1168
+ if (n) {
1169
+ this.events.error && this.events.error(n);
1170
+ return;
1171
+ }
1172
+ this.store.setData(e);
1173
+ let r = this.store.getData();
1174
+ this.select.updateOptions(r), this.render.renderValues(), this.render.renderOptions(r), this.events.afterChange && !i(t, this.store.getSelected()) && this.events.afterChange(this.store.getSelectedOptions());
1175
+ }
1176
+ getSelected() {
1177
+ let e = this.store.getSelectedOptions();
1178
+ return this.settings.keepOrder && (e = this.store.selectedOrderOptions(e)), e.map((e) => e.value);
1179
+ }
1180
+ setSelected(e, t = !0) {
1181
+ let n = this.store.getSelected(), r = this.store.getDataOptions();
1182
+ e = Array.isArray(e) ? e : [e];
1183
+ let a = [];
1184
+ for (let t of e) {
1185
+ if (r.find((e) => e.id == t)) {
1186
+ a.push(t);
1187
+ continue;
1188
+ }
1189
+ for (let e of r.filter((e) => e.value == t)) a.push(e.id);
1190
+ }
1191
+ this.store.setSelectedBy("id", a);
1192
+ let o = this.store.getData();
1193
+ this.select.updateOptions(o), this.render.renderValues(), this.render.content.search.input.value === "" ? this.render.renderOptions(o) : this.search(this.render.content.search.input.value), t && this.events.afterChange && !i(n, this.store.getSelected()) && this.events.afterChange(this.store.getSelectedOptions());
1194
+ }
1195
+ addOption(e) {
1196
+ let t = this.store.getSelected();
1197
+ this.store.getDataOptions().some((t) => t.value === (e.value ?? e.text)) || this.store.addOption(e);
1198
+ let n = this.store.getData();
1199
+ this.select.updateOptions(n), this.render.renderValues(), this.render.renderOptions(n), this.events.afterChange && !i(t, this.store.getSelected()) && this.events.afterChange(this.store.getSelectedOptions());
1200
+ }
1201
+ open() {
1202
+ this.settings.disabled || this.settings.isOpen || (this.closeTimeout &&= (clearTimeout(this.closeTimeout), null), 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(() => {
1203
+ this.events.afterOpen && this.events.afterOpen(), this.settings.isOpen && (this.settings.isFullOpen = !0), document.addEventListener("click", this.documentClick);
1204
+ }, 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)));
1205
+ }
1206
+ close(e = null) {
1207
+ !this.settings.isOpen || this.settings.alwaysOpen || (this.openTimeout &&= (clearTimeout(this.openTimeout), null), this.events.beforeClose && this.events.beforeClose(), this.render.close(), !this.settings.keepSearch && this.render.content.search.input.value !== "" && this.search(""), this.render.mainFocus(e), this.settings.isOpen = !1, this.settings.isFullOpen = !1, this.closeTimeout = setTimeout(() => {
1208
+ this.events.afterClose && this.events.afterClose(), document.removeEventListener("click", this.documentClick);
1209
+ }, this.settings.timeoutDelay), this.settings.intervalMove && clearInterval(this.settings.intervalMove));
1210
+ }
1211
+ search(e) {
1212
+ if (this.render.content.search.input.value !== e && (this.render.content.search.input.value = e), e === "") {
1213
+ this.render.renderOptions(this.store.getData());
1214
+ return;
1215
+ }
1216
+ if (!this.events.search) {
1217
+ let t = e === "" ? this.store.getData() : this.store.search(e, this.events.searchFilter);
1218
+ this.render.renderOptions(t);
1219
+ return;
1220
+ }
1221
+ this.render.renderSearching();
1222
+ let t = this.events.search(e, this.store.getSelectedOptions());
1223
+ if (t instanceof Promise) {
1224
+ t.then((e) => {
1225
+ this.store.setData(e, !0), this.select.updateOptions(this.store.getData()), this.render.renderOptions(this.store.getData());
1226
+ }).catch((e) => {
1227
+ this.render.renderError(typeof e == "string" ? e : e.message);
1228
+ });
1229
+ return;
1230
+ } 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");
1231
+ }
1232
+ destroy() {
1233
+ this.openTimeout &&= (clearTimeout(this.openTimeout), null), this.closeTimeout &&= (clearTimeout(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();
1234
+ }
1235
+ windowResize = r(() => {
1236
+ !this.settings.isOpen && !this.settings.isFullOpen || this.render.moveContent();
1237
+ });
1238
+ windowScroll = r(() => {
1239
+ !this.settings.isOpen && !this.settings.isFullOpen || this.render.moveContent();
1240
+ });
1241
+ documentClick = (e) => {
1242
+ this.settings.isOpen && e.target && !n(e.target, this.settings.id) && this.close(e.type);
1243
+ };
1244
+ windowVisibilityChange = () => {
1245
+ document.hidden && this.close();
1246
+ };
1390
1247
  };
1391
- //# sourceMappingURL=slimselect.es.js.map
1248
+ //#endregion
1249
+ export { s as Optgroup, o as Option, d as Settings, f as default };
1250
+
1251
+ //# sourceMappingURL=slimselect.es.js.map