slim-select 3.4.3 → 3.5.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 +46 -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 +1459 -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 +88 -0
  12. package/dist/select.d.ts +38 -0
  13. package/dist/settings.d.ts +39 -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 +1233 -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 +1335 -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 +34 -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,1239 @@
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
+ addable;
26
+ addablePath;
27
+ list;
28
+ optgroup;
29
+ optgroupLabel;
30
+ optgroupLabelText;
31
+ optgroupActions;
32
+ optgroupSelectAll;
33
+ optgroupSelectAllBox;
34
+ optgroupSelectAllCheck;
35
+ optgroupClosable;
36
+ option;
37
+ optionDelete;
38
+ highlighted;
39
+ mainOpen;
40
+ close;
41
+ selected;
42
+ error;
43
+ disabled;
44
+ hide;
45
+ constructor(e) {
46
+ e ||= {};
47
+ let t = (e = "", t = "") => `${e} ${t}`.trim();
48
+ 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.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);
49
+ }
50
+ getFirst(e) {
51
+ return this[e].split(" ")[0];
52
+ }
53
+ };
54
+ //#endregion
55
+ //#region src/slim-select/helpers.ts
56
+ function t() {
57
+ return Math.random().toString(36).substring(2, 10);
310
58
  }
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
- }
59
+ function n(e, t) {
60
+ function n(e, n) {
61
+ return n && e && e.classList && e.classList.contains(n) || n && e && e.dataset && e.dataset.id && e.dataset.id === t ? e : null;
62
+ }
63
+ function r(e, t) {
64
+ return !e || e === document ? null : n(e, t) ? e : r(e.parentNode, t);
65
+ }
66
+ return n(e, t) || r(e, t);
917
67
  }
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
- }
68
+ function r(e, t = 50, n = !1) {
69
+ let r;
70
+ return function(...i) {
71
+ let a = self, o = () => {
72
+ r = null, n || e.apply(a, i);
73
+ }, s = n && !r;
74
+ clearTimeout(r), r = setTimeout(o, t), s && e.apply(a, i);
75
+ };
1179
76
  }
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
- }
77
+ function i(e, t) {
78
+ return JSON.stringify(e) === JSON.stringify(t);
1222
79
  }
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
- };
80
+ function a(e) {
81
+ let t = e.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g, (e) => "-" + e.toLowerCase());
82
+ return e[0] === e[0].toUpperCase() ? t.substring(1) : t;
1384
83
  }
1385
- export {
1386
- m as Optgroup,
1387
- u as Option,
1388
- P as Settings,
1389
- F as default
84
+ //#endregion
85
+ //#region src/slim-select/store.ts
86
+ var o = class {
87
+ id;
88
+ value;
89
+ text;
90
+ html;
91
+ defaultSelected;
92
+ selected;
93
+ display;
94
+ disabled;
95
+ placeholder;
96
+ class;
97
+ style;
98
+ data;
99
+ mandatory;
100
+ constructor(e) {
101
+ 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 || {};
102
+ }
103
+ }, s = class {
104
+ id;
105
+ label;
106
+ selectAll;
107
+ selectAllText;
108
+ closable;
109
+ options;
110
+ constructor(e) {
111
+ 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));
112
+ }
113
+ }, c = class {
114
+ selectType = "single";
115
+ data = [];
116
+ selectedOrder = [];
117
+ constructor(e, t) {
118
+ this.selectType = e, this.setData(t);
119
+ }
120
+ validateDataArray(e) {
121
+ if (!Array.isArray(e)) return /* @__PURE__ */ Error("Data must be an array");
122
+ for (let t of e) if (t) if (t instanceof s || "label" in t) {
123
+ if (!("label" in t)) return /* @__PURE__ */ Error("Optgroup must have a label");
124
+ if ("options" in t && t.options) for (let e of t.options) {
125
+ let t = this.validateOption(e);
126
+ if (t) return t;
127
+ }
128
+ } else if (t instanceof o || "text" in t) {
129
+ let e = this.validateOption(t);
130
+ if (e) return e;
131
+ } else return /* @__PURE__ */ Error("Data object must be a valid optgroup or option");
132
+ return null;
133
+ }
134
+ validateOption(e) {
135
+ return "text" in e ? null : /* @__PURE__ */ Error("Option must have a text");
136
+ }
137
+ partialToFullData(e) {
138
+ let t = [];
139
+ return e.forEach((e) => {
140
+ if (e) {
141
+ if (e instanceof s || "label" in e) {
142
+ let n = [];
143
+ "options" in e && e.options && e.options.forEach((e) => {
144
+ n.push(new o(e));
145
+ }), n.length > 0 && t.push(new s(e));
146
+ }
147
+ (e instanceof o || "text" in e) && t.push(new o(e));
148
+ }
149
+ }), t;
150
+ }
151
+ setData(e, t = !1) {
152
+ let n = this.partialToFullData(e), r = [];
153
+ if (t) {
154
+ r = this.getSelectedOptions();
155
+ let e = [];
156
+ r.forEach((t) => {
157
+ let r = !1;
158
+ for (let e of n) {
159
+ if (e instanceof o && e.id === t.id) {
160
+ r = !0;
161
+ break;
162
+ }
163
+ if (e instanceof s) {
164
+ for (let n of e.options) if (n.id === t.id) {
165
+ r = !0;
166
+ break;
167
+ }
168
+ }
169
+ }
170
+ r || e.push(t);
171
+ }), this.data = [...e, ...n];
172
+ } else this.data = n;
173
+ if (this.selectType === "single") {
174
+ let e = t && r.length === 0;
175
+ this.setSelectedBy("id", this.getSelected(), e);
176
+ }
177
+ }
178
+ getData() {
179
+ return this.filter(null, !0);
180
+ }
181
+ getDataOptions() {
182
+ return this.filter(null, !1);
183
+ }
184
+ addOption(e, t = !1) {
185
+ if (t) {
186
+ let t = [new o(e)];
187
+ this.setData(t.concat(this.getData()));
188
+ } else this.setData(this.getData().concat(new o(e)));
189
+ }
190
+ setSelectedBy(e, t, n = !1) {
191
+ let r = null, i = !1, a = [];
192
+ for (let n of this.data) {
193
+ if (n instanceof s) for (let o of n.options) {
194
+ r ||= o;
195
+ let n = o[e] || "";
196
+ o.selected = i ? !1 : t.includes(n), o.selected && (a.push(o), this.selectType === "single" && (i = !0));
197
+ }
198
+ n instanceof o && (r ||= n, n.selected = i ? !1 : t.includes(n[e]), n.selected && (a.push(n), this.selectType === "single" && (i = !0)));
199
+ }
200
+ this.selectType === "single" && r && !i && !n && (r.selected = !0, a.push(r));
201
+ let c = t.map((t) => a.find((n) => n[e] === t)?.id || "");
202
+ this.selectedOrder = c;
203
+ }
204
+ getSelected() {
205
+ return this.getSelectedOptions().map((e) => e.id);
206
+ }
207
+ getSelectedValues() {
208
+ return this.getSelectedOptions().map((e) => e.value);
209
+ }
210
+ getSelectedOptions() {
211
+ return this.filter((e) => e.selected, !1);
212
+ }
213
+ getOptgroupByID(e) {
214
+ for (let t of this.data) if (t instanceof s && t.id === e) return t;
215
+ return null;
216
+ }
217
+ getOptionByID(e) {
218
+ let t = this.filter((t) => t.id === e, !1);
219
+ return t.length ? t[0] : null;
220
+ }
221
+ getSelectType() {
222
+ return this.selectType;
223
+ }
224
+ getFirstOption() {
225
+ let e = null;
226
+ for (let t of this.data) if (t instanceof s ? e = t.options[0] : t instanceof o && (e = t), e) break;
227
+ return e;
228
+ }
229
+ search(e, t) {
230
+ return e = e.trim(), e === "" ? this.getData() : this.filter((n) => t(n, e), !0);
231
+ }
232
+ filter(e, t) {
233
+ let n = [];
234
+ return this.data.forEach((r) => {
235
+ if (r instanceof s) {
236
+ let i = [];
237
+ if (r.options.forEach((r) => {
238
+ (!e || e(r)) && (t ? i.push(new o(r)) : n.push(new o(r)));
239
+ }), i.length > 0) {
240
+ let e = new s(r);
241
+ e.options = i, n.push(e);
242
+ }
243
+ }
244
+ r instanceof o && (!e || e(r)) && n.push(new o(r));
245
+ }), n;
246
+ }
247
+ selectedOrderOptions(e) {
248
+ let t = [];
249
+ return this.selectedOrder.forEach((n) => {
250
+ let r = e.find((e) => e.id === n);
251
+ r && t.push(r);
252
+ }), e.forEach((e) => {
253
+ let n = !1;
254
+ t.forEach((t) => {
255
+ if (e.id === t.id) {
256
+ n = !0;
257
+ return;
258
+ }
259
+ }), n || t.push(e);
260
+ }), t;
261
+ }
262
+ }, l = class {
263
+ settings;
264
+ store;
265
+ callbacks;
266
+ lastSelectedOption;
267
+ lastRenderedOptions;
268
+ closeAnimationTimeout = null;
269
+ main;
270
+ content;
271
+ classes;
272
+ constructor(e, t, n, r) {
273
+ 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);
274
+ }
275
+ addClasses(e, t) {
276
+ if (!t || t.trim() === "") return;
277
+ let n = t.split(" ").filter((e) => e.trim() !== "");
278
+ for (let t of n) e.classList.add(t.trim());
279
+ }
280
+ removeClasses(e, t) {
281
+ if (!t || t.trim() === "") return;
282
+ let n = t.split(" ").filter((e) => e.trim() !== "");
283
+ for (let t of n) e.classList.remove(t.trim());
284
+ }
285
+ enable() {
286
+ this.removeClasses(this.main.main, this.classes.disabled), this.main.main.setAttribute("aria-disabled", "false"), this.content.search.input.disabled = !1;
287
+ }
288
+ disable() {
289
+ this.addClasses(this.main.main, this.classes.disabled), this.main.main.setAttribute("aria-disabled", "true"), this.content.search.input.disabled = !0;
290
+ }
291
+ open() {
292
+ this.main.arrow.path.setAttribute("d", this.classes.arrowOpen), this.main.main.setAttribute("aria-expanded", "true"), this.closeAnimationTimeout &&= (clearTimeout(this.closeAnimationTimeout), null);
293
+ let e = this.settings.openPosition === "up" ? this.classes.dirAbove : this.classes.dirBelow;
294
+ 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();
295
+ let t = this.store.getSelectedOptions();
296
+ if (t.length) {
297
+ let e = t[t.length - 1].id, n = this.content.list.querySelector("[data-id=\"" + e + "\"]");
298
+ n && this.ensureElementInView(this.content.list, n);
299
+ }
300
+ }
301
+ close() {
302
+ 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");
303
+ let e = this.getAnimationTiming();
304
+ this.closeAnimationTimeout = setTimeout(() => {
305
+ 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;
306
+ }, e);
307
+ }
308
+ getAnimationTiming() {
309
+ let e = getComputedStyle(this.content.main).getPropertyValue("--ss-animation-timing").trim();
310
+ if (e) {
311
+ if (e.endsWith("ms")) return parseFloat(e);
312
+ if (e.endsWith("s")) return parseFloat(e) * 1e3;
313
+ }
314
+ return 200;
315
+ }
316
+ updateClassStyles() {
317
+ 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()));
318
+ (this.settings.contentPosition === "relative" || this.settings.contentPosition === "fixed") && this.content.main.classList.add("ss-" + this.settings.contentPosition);
319
+ }
320
+ updateAriaAttributes() {
321
+ let e = this.content.list.id;
322
+ 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);
323
+ }
324
+ mainDiv() {
325
+ let e = document.createElement("div");
326
+ e.dataset.id = this.settings.id, e.setAttribute("aria-label", this.settings.ariaLabel), e.tabIndex = 0, e.onkeydown = (e) => {
327
+ switch (e.key) {
328
+ case "ArrowUp":
329
+ case "ArrowDown": return this.callbacks.open(), e.key === "ArrowDown" ? this.highlight("down") : this.highlight("up"), !1;
330
+ case "Tab": return this.callbacks.close(), !0;
331
+ case "Enter":
332
+ case " ":
333
+ this.callbacks.open();
334
+ let t = this.content.list.querySelector("." + this.classes.getFirst("highlighted"));
335
+ return t && t.click(), !1;
336
+ case "Escape": return this.callbacks.close(), !1;
337
+ }
338
+ return e.key.length === 1 && this.callbacks.open(), !0;
339
+ }, e.onclick = (e) => {
340
+ this.settings.disabled || (this.settings.isOpen ? this.callbacks.close() : this.callbacks.open());
341
+ };
342
+ let t = document.createElement("div");
343
+ this.addClasses(t, this.classes.values), e.appendChild(t);
344
+ let n = document.createElement("div");
345
+ this.addClasses(n, this.classes.deselect), n.setAttribute("role", "button"), n.setAttribute("aria-label", this.settings.deselectText), n.setAttribute("tabindex", "0");
346
+ let r = this.store?.getSelectedOptions();
347
+ !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) => {
348
+ if (e.stopPropagation(), this.settings.disabled) return;
349
+ let t = !0, n = this.store.getSelectedOptions();
350
+ if (this.callbacks.beforeChange && (t = this.callbacks.beforeChange([], n) === !0), t) {
351
+ if (this.settings.isMultiple) this.callbacks.setSelected([], !1), this.updateDeselectAll();
352
+ else {
353
+ let e = this.store.getFirstOption(), t = e ? e.id : "";
354
+ this.callbacks.setSelected(t, !1);
355
+ }
356
+ this.settings.closeOnSelect && this.callbacks.close(), this.callbacks.afterChange && this.callbacks.afterChange(this.store.getSelectedOptions());
357
+ }
358
+ }, n.onkeydown = (e) => {
359
+ (e.key === "Enter" || e.key === " ") && (e.preventDefault(), n.click());
360
+ };
361
+ let i = document.createElementNS("http://www.w3.org/2000/svg", "svg");
362
+ i.setAttribute("viewBox", "0 0 100 100");
363
+ let a = document.createElementNS("http://www.w3.org/2000/svg", "path");
364
+ a.setAttribute("d", this.classes.deselectPath), i.appendChild(a), n.appendChild(i), e.appendChild(n);
365
+ let o = document.createElementNS("http://www.w3.org/2000/svg", "svg");
366
+ this.addClasses(o, this.classes.arrow), o.setAttribute("viewBox", "0 0 100 100");
367
+ let s = document.createElementNS("http://www.w3.org/2000/svg", "path");
368
+ return s.setAttribute("d", this.classes.arrowClose), this.settings.alwaysOpen && this.addClasses(o, this.classes.hide), o.appendChild(s), e.appendChild(o), {
369
+ main: e,
370
+ values: t,
371
+ deselect: {
372
+ main: n,
373
+ svg: i,
374
+ path: a
375
+ },
376
+ arrow: {
377
+ main: o,
378
+ path: s
379
+ }
380
+ };
381
+ }
382
+ mainFocus(e) {
383
+ e !== "click" && this.main.main.focus({ preventScroll: !0 });
384
+ }
385
+ placeholder() {
386
+ let e = this.store.filter((e) => e.placeholder, !1), t = this.settings.placeholderText;
387
+ e.length && (e[0].html === "" ? e[0].text !== "" && (t = e[0].text) : t = e[0].html);
388
+ let n = document.createElement("div");
389
+ return this.addClasses(n, this.classes.placeholder), n.innerHTML = t, n;
390
+ }
391
+ renderValues() {
392
+ if (!this.settings.isMultiple) {
393
+ this.renderSingleValue();
394
+ return;
395
+ }
396
+ this.renderMultipleValues(), this.updateDeselectAll();
397
+ }
398
+ renderSingleValue() {
399
+ let e = this.store.filter((e) => e.selected && !e.placeholder, !1), t = e.length > 0 ? e[0] : null;
400
+ if (!t) this.main.values.innerHTML = this.placeholder().outerHTML;
401
+ else {
402
+ let e = document.createElement("div");
403
+ this.addClasses(e, this.classes.single), t.html ? e.innerHTML = t.html : e.innerText = t.text, this.main.values.innerHTML = e.outerHTML;
404
+ }
405
+ !this.settings.allowDeselect || !e.length ? this.addClasses(this.main.deselect.main, this.classes.hide) : this.removeClasses(this.main.deselect.main, this.classes.hide);
406
+ }
407
+ renderMultipleValues() {
408
+ let e = this.main.values.childNodes, t = this.store.filter((e) => e.selected && e.display, !1);
409
+ if (t.length === 0) {
410
+ this.main.values.innerHTML = this.placeholder().outerHTML;
411
+ return;
412
+ } else {
413
+ let e = this.main.values.querySelector("." + this.classes.getFirst("placeholder"));
414
+ e && e.remove();
415
+ }
416
+ if (this.settings.multiString) {
417
+ let e = t;
418
+ this.settings.keepOrder && (e = this.store.selectedOrderOptions(e));
419
+ let n = document.createElement("div");
420
+ 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;
421
+ return;
422
+ }
423
+ if (t.length > this.settings.maxValuesShown) {
424
+ let e = document.createElement("div");
425
+ this.addClasses(e, this.classes.max), e.textContent = this.settings.maxValuesMessage.replace("{number}", t.length.toString()), this.main.values.innerHTML = e.outerHTML;
426
+ return;
427
+ } else {
428
+ let e = this.main.values.querySelector("." + this.classes.getFirst("max"));
429
+ e && e.remove();
430
+ }
431
+ this.settings.keepOrder && (t = this.store.selectedOrderOptions(t));
432
+ let n = [];
433
+ for (let r = 0; r < e.length; r++) {
434
+ let i = e[r], a = i.getAttribute("data-id");
435
+ a && (t.filter((e) => e.id === a, !1).length || n.push(i));
436
+ }
437
+ for (let e of n) this.addClasses(e, this.classes.valueOut), setTimeout(() => {
438
+ this.main.values.hasChildNodes() && this.main.values.contains(e) && this.main.values.removeChild(e);
439
+ }, 100);
440
+ e = this.main.values.childNodes;
441
+ for (let n = 0; n < t.length; n++) {
442
+ let r = !0;
443
+ for (let i = 0; i < e.length; i++) t[n].id === String(e[i].dataset.id) && (r = !1);
444
+ 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])));
445
+ }
446
+ }
447
+ multipleValue(e) {
448
+ let t = document.createElement("div");
449
+ this.addClasses(t, this.classes.value), t.dataset.id = e.id;
450
+ let n = document.createElement("div");
451
+ if (this.addClasses(n, this.classes.valueText), n.textContent = e.text, t.appendChild(n), !e.mandatory) {
452
+ let n = document.createElement("div");
453
+ 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) => {
454
+ if (t.preventDefault(), t.stopPropagation(), this.settings.disabled) return;
455
+ let n = !0, r = this.store.getSelectedOptions(), i = r.filter((t) => t.selected && t.id !== e.id, !0);
456
+ if (!(this.settings.minSelected && i.length < this.settings.minSelected) && (this.callbacks.beforeChange && (n = this.callbacks.beforeChange(i, r) === !0), n)) {
457
+ let e = [];
458
+ for (let t of i) {
459
+ if (t instanceof s) for (let n of t.options) n.id && e.push(n.id);
460
+ t instanceof o && e.push(t.id);
461
+ }
462
+ this.callbacks.setSelected(e, !1), this.settings.closeOnSelect && this.callbacks.close(), this.callbacks.afterChange && this.callbacks.afterChange(i), this.updateDeselectAll();
463
+ }
464
+ };
465
+ let r = document.createElementNS("http://www.w3.org/2000/svg", "svg");
466
+ r.setAttribute("viewBox", "0 0 100 100");
467
+ let i = document.createElementNS("http://www.w3.org/2000/svg", "path");
468
+ i.setAttribute("d", this.classes.optionDelete), r.appendChild(i), n.appendChild(r), t.appendChild(n), n.onkeydown = (e) => {
469
+ e.key === "Enter" && n.click();
470
+ };
471
+ }
472
+ return t;
473
+ }
474
+ contentDiv() {
475
+ let e = document.createElement("div");
476
+ e.dataset.id = this.settings.id;
477
+ let t = this.searchDiv();
478
+ e.appendChild(t.main);
479
+ let n = this.listDiv();
480
+ return e.appendChild(n), {
481
+ main: e,
482
+ search: t,
483
+ list: n
484
+ };
485
+ }
486
+ moveContent() {
487
+ if (this.settings.contentPosition === "relative") {
488
+ this.moveContentBelow();
489
+ return;
490
+ }
491
+ if (this.settings.openPosition === "down") {
492
+ this.moveContentBelow();
493
+ return;
494
+ } else if (this.settings.openPosition === "up") {
495
+ this.moveContentAbove();
496
+ return;
497
+ }
498
+ this.putContent() === "up" ? this.moveContentAbove() : this.moveContentBelow();
499
+ }
500
+ searchDiv() {
501
+ let e = document.createElement("div"), t = document.createElement("input"), n = document.createElement("div");
502
+ this.addClasses(e, this.classes.search);
503
+ let i = {
504
+ main: e,
505
+ input: t
506
+ };
507
+ 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) => {
508
+ this.callbacks.search(e.target.value);
509
+ }, 100), t.onkeydown = (e) => {
510
+ switch (e.key) {
511
+ case "ArrowUp":
512
+ case "ArrowDown": return e.key === "ArrowDown" ? this.highlight("down") : this.highlight("up"), !1;
513
+ case "Tab": return this.callbacks.close(), !0;
514
+ case "Escape": return this.callbacks.close(), !1;
515
+ case " ":
516
+ let t = this.content.list.querySelector("." + this.classes.getFirst("highlighted"));
517
+ return t ? (t.click(), !1) : !0;
518
+ case "Enter":
519
+ let r = this.content.list.querySelector("." + this.classes.getFirst("highlighted"));
520
+ return r ? (r.click(), !1) : this.callbacks.addable ? (n.click(), !1) : !0;
521
+ }
522
+ return !0;
523
+ }, e.appendChild(t), this.callbacks.addable) {
524
+ this.addClasses(n, this.classes.addable);
525
+ let t = document.createElementNS("http://www.w3.org/2000/svg", "svg");
526
+ t.setAttribute("viewBox", "0 0 100 100");
527
+ let r = document.createElementNS("http://www.w3.org/2000/svg", "path");
528
+ r.setAttribute("d", this.classes.addablePath), t.appendChild(r), n.appendChild(t), n.onclick = (e) => {
529
+ if (e.preventDefault(), e.stopPropagation(), !this.callbacks.addable) return;
530
+ let t = this.content.search.input.value.trim();
531
+ if (t === "") {
532
+ this.content.search.input.focus();
533
+ return;
534
+ }
535
+ let n = (e) => {
536
+ let t = new o(e);
537
+ if (this.callbacks.addOption(t), this.settings.isMultiple) {
538
+ let e = this.store.getSelected();
539
+ e.push(t.id), this.callbacks.setSelected(e, !0);
540
+ } else this.callbacks.setSelected([t.id], !0);
541
+ this.callbacks.search(""), this.settings.closeOnSelect && setTimeout(() => {
542
+ this.callbacks.close();
543
+ }, 100);
544
+ }, r = this.callbacks.addable(t);
545
+ r === !1 || r == null || (r instanceof Promise ? r.then((e) => {
546
+ typeof e == "string" ? n({
547
+ text: e,
548
+ value: e
549
+ }) : r instanceof Error ? this.renderError(r.message) : n(e);
550
+ }) : typeof r == "string" ? n({
551
+ text: r,
552
+ value: r
553
+ }) : r instanceof Error ? this.renderError(r.message) : n(r));
554
+ }, e.appendChild(n), i.addable = {
555
+ main: n,
556
+ svg: t,
557
+ path: r
558
+ };
559
+ }
560
+ return i;
561
+ }
562
+ searchFocus() {
563
+ this.content.search.input.focus({ preventScroll: !0 });
564
+ }
565
+ getOptions(e = !1, t = !1, n = !1) {
566
+ let r = "." + this.classes.getFirst("option");
567
+ 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));
568
+ }
569
+ highlight(e) {
570
+ let t = this.getOptions(!0, !0, !0);
571
+ if (t.length === 0) return;
572
+ if (t.length === 1 && !t[0].classList.contains(this.classes.getFirst("highlighted"))) {
573
+ this.addClasses(t[0], this.classes.highlighted);
574
+ return;
575
+ }
576
+ let n = !1;
577
+ for (let e of t) e.classList.contains(this.classes.getFirst("highlighted")) && (n = !0);
578
+ if (!n) {
579
+ for (let e of t) if (e.classList.contains(this.classes.getFirst("selected"))) {
580
+ this.addClasses(e, this.classes.highlighted);
581
+ break;
582
+ }
583
+ }
584
+ for (let n = 0; n < t.length; n++) if (t[n].classList.contains(this.classes.getFirst("highlighted"))) {
585
+ let r = t[n];
586
+ this.removeClasses(r, this.classes.highlighted);
587
+ let i = r.parentElement;
588
+ if (i && i.classList.contains(this.classes.getFirst("mainOpen"))) {
589
+ let e = i.querySelector("." + this.classes.getFirst("optgroupLabel"));
590
+ e && e.click();
591
+ }
592
+ let a = t[e === "down" ? n + 1 < t.length ? n + 1 : 0 : n - 1 >= 0 ? n - 1 : t.length - 1];
593
+ this.addClasses(a, this.classes.highlighted), this.ensureElementInView(this.content.list, a), a.id && this.main.main.setAttribute("aria-activedescendant", a.id);
594
+ let o = a.parentElement;
595
+ if (o && o.classList.contains(this.classes.getFirst("close"))) {
596
+ let e = o.querySelector("." + this.classes.getFirst("optgroupLabel"));
597
+ e && e.click();
598
+ }
599
+ return;
600
+ }
601
+ let r = t[e === "down" ? 0 : t.length - 1];
602
+ this.addClasses(r, this.classes.highlighted), r.id && this.main.main.setAttribute("aria-activedescendant", r.id), this.ensureElementInView(this.content.list, r);
603
+ }
604
+ listDiv() {
605
+ let e = document.createElement("div");
606
+ this.addClasses(e, this.classes.list);
607
+ let t = this.settings.id + "-list";
608
+ return e.id = t, e.dataset.id = t, e;
609
+ }
610
+ renderError(e) {
611
+ this.content.list.innerHTML = "";
612
+ let t = document.createElement("div");
613
+ this.addClasses(t, this.classes.error), t.textContent = e, this.content.list.appendChild(t);
614
+ }
615
+ renderSearching() {
616
+ this.content.list.innerHTML = "";
617
+ let e = document.createElement("div");
618
+ this.addClasses(e, this.classes.searching), e.textContent = this.settings.searchingText, this.content.list.appendChild(e);
619
+ }
620
+ renderOptions(e) {
621
+ 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) {
622
+ let e = document.createElement("div");
623
+ this.addClasses(e, this.classes.search), this.callbacks.addable ? e.innerHTML = this.settings.addableText.replace("{value}", this.content.search.input.value) : e.innerHTML = this.settings.searchText, this.content.list.appendChild(e);
624
+ return;
625
+ }
626
+ this.settings.allowDeselect && !this.settings.isMultiple && (this.store.filter((e) => e.placeholder, !1).length || this.store.addOption(new o({
627
+ text: "",
628
+ value: "",
629
+ selected: !1,
630
+ placeholder: !0
631
+ }), !0));
632
+ let t = document.createDocumentFragment();
633
+ for (let n of e) {
634
+ if (n instanceof s) {
635
+ let e = document.createElement("div");
636
+ this.addClasses(e, this.classes.optgroup);
637
+ let r = document.createElement("div");
638
+ this.addClasses(r, this.classes.optgroupLabel), e.appendChild(r);
639
+ let i = document.createElement("div");
640
+ this.addClasses(i, this.classes.optgroupLabelText), i.textContent = n.label, r.appendChild(i);
641
+ let a = document.createElement("div");
642
+ if (this.addClasses(a, this.classes.optgroupActions), r.appendChild(a), this.settings.isMultiple && n.selectAll) {
643
+ let e = document.createElement("div");
644
+ this.addClasses(e, this.classes.optgroupSelectAll);
645
+ let t = !0;
646
+ for (let e of n.options) if (!e.selected) {
647
+ t = !1;
648
+ break;
649
+ }
650
+ t && this.addClasses(e, this.classes.selected);
651
+ let r = document.createElement("span");
652
+ r.textContent = n.selectAllText, e.appendChild(r);
653
+ let i = document.createElementNS("http://www.w3.org/2000/svg", "svg");
654
+ i.setAttribute("viewBox", "0 0 100 100"), e.appendChild(i);
655
+ let s = document.createElementNS("http://www.w3.org/2000/svg", "path");
656
+ s.setAttribute("d", this.classes.optgroupSelectAllBox), i.appendChild(s);
657
+ let c = document.createElementNS("http://www.w3.org/2000/svg", "path");
658
+ c.setAttribute("d", this.classes.optgroupSelectAllCheck), i.appendChild(c), e.addEventListener("click", (e) => {
659
+ e.preventDefault(), e.stopPropagation();
660
+ let r = this.store.getSelected();
661
+ if (t) {
662
+ let e = r.filter((e) => {
663
+ for (let t of n.options) if (e === t.id) return !1;
664
+ return !0;
665
+ });
666
+ this.callbacks.setSelected(e, !0);
667
+ return;
668
+ } else {
669
+ let e = n.options.map((e) => e.id).filter((e) => e !== void 0), t = r.concat(e);
670
+ for (let e of n.options) e.id && !this.store.getOptionByID(e.id) && this.callbacks.addOption(new o(e));
671
+ this.callbacks.setSelected(t, !0);
672
+ return;
673
+ }
674
+ }), a.appendChild(e);
675
+ }
676
+ if (n.closable !== "off") {
677
+ let t = document.createElement("div");
678
+ this.addClasses(t, this.classes.optgroupClosable);
679
+ let i = document.createElementNS("http://www.w3.org/2000/svg", "svg");
680
+ i.setAttribute("viewBox", "0 0 100 100"), this.addClasses(i, this.classes.arrow), t.appendChild(i);
681
+ let o = document.createElementNS("http://www.w3.org/2000/svg", "path");
682
+ 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) => {
683
+ 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));
684
+ }), a.appendChild(t);
685
+ }
686
+ e.appendChild(r);
687
+ for (let r of n.options) e.appendChild(this.option(new o(r))), t.appendChild(e);
688
+ }
689
+ n instanceof o && t.appendChild(this.option(n));
690
+ }
691
+ this.content.list.appendChild(t);
692
+ }
693
+ option(e) {
694
+ if (e.placeholder) {
695
+ let e = document.createElement("div");
696
+ return this.addClasses(e, this.classes.option), this.addClasses(e, this.classes.hide), e;
697
+ }
698
+ let t = document.createElement("div");
699
+ 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) => {
700
+ t.classList.add(e);
701
+ }), 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) => {
702
+ t.preventDefault(), t.stopPropagation();
703
+ let n = this.store.getSelected(), r = t.currentTarget, i = String(r.dataset.id), a = t.ctrlKey || t.metaKey;
704
+ 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;
705
+ let o = !1, s = this.store.getSelectedOptions(), c = [];
706
+ if (this.settings.isMultiple) {
707
+ let n = s.some((e) => e.id === i);
708
+ if (t.shiftKey && this.lastSelectedOption) {
709
+ let t = this.lastRenderedOptions, n = t.findIndex((e) => e.id === this.lastSelectedOption.id), r = t.findIndex((t) => t.id === e.id);
710
+ if (n >= 0 && r >= 0) {
711
+ 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));
712
+ c = s.length + a.length <= this.settings.maxSelected ? s.concat(a) : s;
713
+ } else c = s;
714
+ } else c = n ? s.filter((e) => e.id !== i) : s.concat(e), this.lastSelectedOption = e;
715
+ }
716
+ if (this.settings.isMultiple || (c = e.selected ? [] : [e]), this.callbacks.beforeChange || (o = !0), this.callbacks.beforeChange && (o = this.callbacks.beforeChange(c, s) !== !1), o) {
717
+ this.store.getOptionByID(i) || this.callbacks.addOption(e), this.callbacks.setSelected(c.map((e) => e.id), !1);
718
+ let n = t.ctrlKey || t.metaKey || t.shiftKey;
719
+ this.settings.closeOnSelect && !(this.settings.isMultiple && n) && this.callbacks.close(), this.callbacks.afterChange && this.callbacks.afterChange(c);
720
+ }
721
+ }), t;
722
+ }
723
+ destroy() {
724
+ this.closeAnimationTimeout &&= (clearTimeout(this.closeAnimationTimeout), null), this.main.main.remove(), this.content.main.remove();
725
+ }
726
+ highlightText(e, t, n) {
727
+ let r = t.trim();
728
+ if (r === "") return e;
729
+ let i = r.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), a = document.createElement("div");
730
+ a.innerHTML = e;
731
+ let o = (e) => {
732
+ if (e.nodeType === Node.TEXT_NODE) {
733
+ let t = e.textContent || "", r = RegExp("(" + i + ")", "i");
734
+ if (r.test(t)) {
735
+ let i = document.createElement("span");
736
+ t.split(r).forEach((e, t) => {
737
+ if (e && r.test(e)) {
738
+ let t = document.createElement("mark");
739
+ t.className = n, t.textContent = e, i.appendChild(t);
740
+ } else e && i.appendChild(document.createTextNode(e));
741
+ }), e.parentNode?.replaceChild(i, e);
742
+ }
743
+ } else e.nodeType === Node.ELEMENT_NODE && Array.from(e.childNodes).forEach((e) => o(e));
744
+ };
745
+ return Array.from(a.childNodes).forEach((e) => o(e)), a.innerHTML;
746
+ }
747
+ setContentDirection(e) {
748
+ let t = e === "above", n = t ? this.classes.dirAbove : this.classes.dirBelow, r = t ? this.classes.dirBelow : this.classes.dirAbove;
749
+ 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) {
750
+ let e = this.main.main.offsetHeight, t = this.content.main.offsetHeight;
751
+ this.content.main.style.margin = "-" + (e + t - 1) + "px 0px 0px 0px";
752
+ } else this.content.main.style.margin = "-1px 0px 0px 0px";
753
+ }
754
+ setContentPosition() {
755
+ if (this.settings.contentPosition === "relative") return;
756
+ let e = this.main.main.getBoundingClientRect(), t, n;
757
+ 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";
758
+ let r = this.settings.contentWidth;
759
+ 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";
760
+ let i = window.innerWidth - 20, a = () => {
761
+ let e = this.content.main.getBoundingClientRect().right;
762
+ if (e <= i) return;
763
+ let t = e - i, n = parseFloat(this.content.main.style.left) || 0;
764
+ if (this.settings.contentPosition === "fixed") {
765
+ let e = Math.max(20, n - t);
766
+ this.content.main.style.left = e + "px";
767
+ } else {
768
+ let e = Math.max(window.scrollX + 20, n - t);
769
+ this.content.main.style.left = e + "px";
770
+ }
771
+ };
772
+ requestAnimationFrame(() => {
773
+ a(), requestAnimationFrame(a);
774
+ });
775
+ }
776
+ moveContentAbove() {
777
+ this.setContentDirection("above"), this.setContentPosition();
778
+ }
779
+ moveContentBelow() {
780
+ this.setContentDirection("below"), this.setContentPosition();
781
+ }
782
+ ensureElementInView(e, t) {
783
+ let n = e.scrollTop + e.offsetTop, r = n + e.clientHeight, i = t.offsetTop, a = i + t.clientHeight;
784
+ i < n ? e.scrollTop -= n - i : a > r && (e.scrollTop += a - r);
785
+ }
786
+ putContent() {
787
+ let e = this.main.main.offsetHeight, t = this.main.main.getBoundingClientRect(), n = this.content.main.offsetHeight;
788
+ return window.innerHeight - (t.top + e) <= n && t.top > n ? "up" : "down";
789
+ }
790
+ updateDeselectAll() {
791
+ if (!this.store || !this.settings) return;
792
+ 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;
793
+ r && !(n && !t) ? this.removeClasses(i, a) : this.addClasses(i, a);
794
+ }
795
+ }, u = class {
796
+ select;
797
+ onValueChange;
798
+ onClassChange;
799
+ onDisabledChange;
800
+ onOptionsChange;
801
+ onLabelClick;
802
+ listen = !1;
803
+ observer = null;
804
+ isUpdating = !1;
805
+ pendingOptionsChange = null;
806
+ preventNativeSelect = null;
807
+ preventNativeSelectMousedown = null;
808
+ preventNativeSelectFocus = null;
809
+ constructor(e) {
810
+ 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);
811
+ }
812
+ enable() {
813
+ this.select.disabled = !1;
814
+ }
815
+ disable() {
816
+ this.select.disabled = !0;
817
+ }
818
+ hideUI() {
819
+ 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) => {
820
+ e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation();
821
+ }, this.preventNativeSelectMousedown = (e) => {
822
+ e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation();
823
+ }, this.preventNativeSelectFocus = (e) => {
824
+ e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation();
825
+ }, this.select.addEventListener("click", this.preventNativeSelect, {
826
+ capture: !0,
827
+ passive: !1
828
+ }), this.select.addEventListener("mousedown", this.preventNativeSelectMousedown, {
829
+ capture: !0,
830
+ passive: !1
831
+ }), this.select.addEventListener("focus", this.preventNativeSelectFocus, {
832
+ capture: !0,
833
+ passive: !1
834
+ }));
835
+ }
836
+ showUI() {
837
+ 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);
838
+ }
839
+ changeListen(e) {
840
+ this.listen = e, e && this.observer && this.observer.observe(this.select, {
841
+ subtree: !0,
842
+ childList: !0,
843
+ attributes: !0
844
+ }), e || this.observer && this.observer.disconnect();
845
+ }
846
+ valueChange(e) {
847
+ return this.listen && this.onValueChange && this.onValueChange(this.getSelectedOptions()), !0;
848
+ }
849
+ observeCall(e) {
850
+ if (!this.listen) return;
851
+ let t = !1, n = !1, r = !1, i = !1;
852
+ for (let a of e) {
853
+ if (a.target === this.select && (a.attributeName === "disabled" && (n = !0), a.attributeName === "class" && (t = !0), a.type === "childList")) {
854
+ for (let e of Array.from(a.addedNodes)) if (e.nodeName === "OPTION" && e.value === this.select.value) {
855
+ i = !0;
856
+ break;
857
+ }
858
+ r = !0;
859
+ }
860
+ (a.target.nodeName === "OPTGROUP" || a.target.nodeName === "OPTION") && (r = !0);
861
+ }
862
+ 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) {
863
+ if (this.isUpdating) {
864
+ if (this.select.options.length > 0) {
865
+ let e = this.getData();
866
+ e.length > 0 && (this.pendingOptionsChange = e);
867
+ }
868
+ i && this.select.dispatchEvent(new Event("change"));
869
+ return;
870
+ }
871
+ this.changeListen(!1), this.onOptionsChange(this.getData()), this.changeListen(!0);
872
+ }
873
+ i && this.select.dispatchEvent(new Event("change"));
874
+ }
875
+ getData() {
876
+ let e = [], t = this.select.childNodes;
877
+ for (let n of t) n.nodeName === "OPTGROUP" && e.push(this.getDataFromOptgroup(n)), n.nodeName === "OPTION" && e.push(this.getDataFromOption(n));
878
+ return e;
879
+ }
880
+ getDataFromOptgroup(e) {
881
+ let t = {
882
+ id: e.id,
883
+ label: e.label,
884
+ selectAll: e.dataset ? e.dataset.selectall === "true" : !1,
885
+ selectAllText: e.dataset ? e.dataset.selectalltext : "Select all",
886
+ closable: e.dataset ? e.dataset.closable : "off",
887
+ options: []
888
+ }, n = e.childNodes;
889
+ for (let e of n) e.nodeName === "OPTION" && t.options.push(this.getDataFromOption(e));
890
+ return t;
891
+ }
892
+ getDataFromOption(e) {
893
+ return {
894
+ id: e.id,
895
+ value: e.value,
896
+ text: e.text,
897
+ html: e.dataset && e.dataset.html ? e.dataset.html : "",
898
+ defaultSelected: e.defaultSelected,
899
+ selected: e.selected,
900
+ display: e.style.display !== "none",
901
+ disabled: e.disabled,
902
+ mandatory: e.dataset ? e.dataset.mandatory === "true" : !1,
903
+ placeholder: e.dataset.placeholder === "true",
904
+ class: e.className,
905
+ style: e.style.cssText,
906
+ data: e.dataset
907
+ };
908
+ }
909
+ getSelectedOptions() {
910
+ let e = [], t = this.select.childNodes;
911
+ for (let n of t) {
912
+ if (n.nodeName === "OPTGROUP") {
913
+ let t = n.childNodes;
914
+ for (let n of t) if (n.nodeName === "OPTION") {
915
+ let t = n;
916
+ t.selected && e.push(this.getDataFromOption(t));
917
+ }
918
+ }
919
+ if (n.nodeName === "OPTION") {
920
+ let t = n;
921
+ t.selected && e.push(this.getDataFromOption(t));
922
+ }
923
+ }
924
+ return e;
925
+ }
926
+ getSelectedValues() {
927
+ return this.getSelectedOptions().map((e) => e.value);
928
+ }
929
+ setSelected(e) {
930
+ this.changeListen(!1);
931
+ let t = this.select.childNodes;
932
+ for (let n of t) {
933
+ if (n.nodeName === "OPTGROUP") {
934
+ let t = n.childNodes;
935
+ for (let n of t) if (n.nodeName === "OPTION") {
936
+ let t = n;
937
+ t.selected = e.includes(t.id);
938
+ }
939
+ }
940
+ if (n.nodeName === "OPTION") {
941
+ let t = n;
942
+ t.selected = e.includes(t.id);
943
+ }
944
+ }
945
+ this.changeListen(!0);
946
+ }
947
+ setSelectedByValue(e) {
948
+ this.changeListen(!1);
949
+ let t = this.select.childNodes;
950
+ for (let n of t) {
951
+ if (n.nodeName === "OPTGROUP") {
952
+ let t = n.childNodes;
953
+ for (let n of t) if (n.nodeName === "OPTION") {
954
+ let t = n;
955
+ t.selected = e.includes(t.value);
956
+ }
957
+ }
958
+ if (n.nodeName === "OPTION") {
959
+ let t = n;
960
+ t.selected = e.includes(t.value);
961
+ }
962
+ }
963
+ this.changeListen(!0);
964
+ }
965
+ updateSelect(e, t, n) {
966
+ this.changeListen(!1), e && (this.select.dataset.id = e), t && (this.select.style.cssText = t), n && (this.select.className = "", n.forEach((e) => {
967
+ e.trim() !== "" && this.select.classList.add(e.trim());
968
+ })), this.changeListen(!0);
969
+ }
970
+ updateOptions(e) {
971
+ if (!(!e || e.length === 0)) {
972
+ this.isUpdating = !0, this.pendingOptionsChange = null, this.changeListen(!1), this.select.innerHTML = "";
973
+ for (let t of e) t instanceof s && this.select.appendChild(this.createOptgroup(t)), t instanceof o && this.select.appendChild(this.createOption(t));
974
+ if (this.select.dispatchEvent(new Event("change", { bubbles: !0 })), this.changeListen(!0), this.isUpdating = !1, this.pendingOptionsChange !== null) {
975
+ let e = this.pendingOptionsChange;
976
+ e.length > 0 && this.onOptionsChange ? (this.pendingOptionsChange = null, this.changeListen(!1), this.onOptionsChange(e), this.changeListen(!0)) : this.pendingOptionsChange = null;
977
+ }
978
+ }
979
+ }
980
+ createOptgroup(e) {
981
+ let t = document.createElement("optgroup");
982
+ 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));
983
+ return t;
984
+ }
985
+ createOption(e) {
986
+ let t = document.createElement("option");
987
+ 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) => {
988
+ t.classList.add(e);
989
+ }), e.data && typeof e.data == "object" && Object.keys(e.data).forEach((n) => {
990
+ t.setAttribute("data-" + a(n), e.data[n]);
991
+ }), t;
992
+ }
993
+ setupLabelHandlers() {
994
+ let e = [], t = this.select.id;
995
+ t && document.querySelectorAll(`label[for="${t}"]`).forEach((t) => e.push(t));
996
+ let r = this.select.parentElement;
997
+ for (; r && r !== document.body;) {
998
+ if (r.tagName === "LABEL") {
999
+ e.push(r);
1000
+ break;
1001
+ }
1002
+ r = r.parentElement;
1003
+ }
1004
+ Array.from(new Set(e)).forEach((e) => {
1005
+ if (e.__slimSelectLabelHandler) return;
1006
+ let t = (e) => {
1007
+ let t = e.target, r = n(t, this.select.dataset.id);
1008
+ e.preventDefault(), !r && this.onLabelClick && this.onLabelClick();
1009
+ };
1010
+ e.__slimSelectLabelHandler = t, e.addEventListener("click", t, {
1011
+ capture: !0,
1012
+ passive: !1
1013
+ });
1014
+ });
1015
+ }
1016
+ removeLabelHandlers() {
1017
+ let e = [], t = this.select.id;
1018
+ t && document.querySelectorAll(`label[for="${t}"]`).forEach((t) => e.push(t));
1019
+ let n = this.select.parentElement;
1020
+ for (; n && n !== document.body;) {
1021
+ if (n.tagName === "LABEL") {
1022
+ e.push(n);
1023
+ break;
1024
+ }
1025
+ n = n.parentElement;
1026
+ }
1027
+ Array.from(new Set(e)).forEach((e) => {
1028
+ let t = e.__slimSelectLabelHandler;
1029
+ t && (e.removeEventListener("click", t, { capture: !0 }), delete e.__slimSelectLabelHandler);
1030
+ });
1031
+ }
1032
+ destroy() {
1033
+ 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();
1034
+ }
1035
+ }, d = class {
1036
+ id = "";
1037
+ style = "";
1038
+ class = [];
1039
+ isMultiple = !1;
1040
+ isOpen = !1;
1041
+ isFullOpen = !1;
1042
+ intervalMove = null;
1043
+ disabled;
1044
+ alwaysOpen;
1045
+ showSearch;
1046
+ focusSearch;
1047
+ keepSearch;
1048
+ ariaLabel;
1049
+ searchPlaceholder;
1050
+ searchText;
1051
+ searchingText;
1052
+ deselectText;
1053
+ removeText;
1054
+ searchHighlight;
1055
+ closeOnSelect;
1056
+ contentLocation;
1057
+ contentPosition;
1058
+ contentWidth;
1059
+ openPosition;
1060
+ placeholderText;
1061
+ allowDeselect;
1062
+ hideSelected;
1063
+ multiString;
1064
+ keepOrder;
1065
+ showOptionTooltips;
1066
+ minSelected;
1067
+ maxSelected;
1068
+ timeoutDelay;
1069
+ maxValuesShown;
1070
+ maxValuesMessage;
1071
+ addableText;
1072
+ constructor(e) {
1073
+ 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.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}";
1074
+ }
1075
+ }, f = class {
1076
+ selectEl;
1077
+ settings;
1078
+ cssClasses;
1079
+ select;
1080
+ store;
1081
+ render;
1082
+ openTimeout = null;
1083
+ closeTimeout = null;
1084
+ events = {
1085
+ search: void 0,
1086
+ searchFilter: (e, t) => e.text.toLowerCase().indexOf(t.toLowerCase()) !== -1,
1087
+ addable: void 0,
1088
+ beforeChange: void 0,
1089
+ afterChange: void 0,
1090
+ beforeOpen: void 0,
1091
+ afterOpen: void 0,
1092
+ beforeClose: void 0,
1093
+ afterClose: void 0
1094
+ };
1095
+ constructor(t) {
1096
+ if (this.selectEl = typeof t.select == "string" ? document.querySelector(t.select) : t.select, !this.selectEl) {
1097
+ t.events && t.events.error && t.events.error(/* @__PURE__ */ Error("Could not find select element"));
1098
+ return;
1099
+ }
1100
+ if (this.selectEl.tagName !== "SELECT") {
1101
+ t.events && t.events.error && t.events.error(/* @__PURE__ */ Error("Element isnt of type select"));
1102
+ return;
1103
+ }
1104
+ this.selectEl.dataset.ssid && this.destroy(), this.settings = new d(t.settings), this.cssClasses = new e(t.cssClasses);
1105
+ let n = [
1106
+ "beforeOpen",
1107
+ "afterOpen",
1108
+ "beforeClose",
1109
+ "afterClose"
1110
+ ];
1111
+ 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));
1112
+ 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) => {
1113
+ this.setSelected(e.map((e) => e.id));
1114
+ }, this.select.onClassChange = (e) => {
1115
+ this.settings.class = e, this.render.updateClassStyles();
1116
+ }, this.select.onDisabledChange = (e) => {
1117
+ e ? this.disable() : this.enable();
1118
+ }, this.select.onOptionsChange = (e) => {
1119
+ this.setData(e || []);
1120
+ }, this.select.onLabelClick = () => {
1121
+ this.settings.disabled || (this.settings.isOpen ? this.close() : this.open());
1122
+ };
1123
+ let i = t.data ? t.data : this.select.getData();
1124
+ this.store = new c(this.settings.isMultiple ? "multiple" : "single", i), t.data && this.select.updateOptions(this.store.getData());
1125
+ let a = {
1126
+ open: this.open.bind(this),
1127
+ close: this.close.bind(this),
1128
+ addable: this.events.addable ? this.events.addable : void 0,
1129
+ setSelected: this.setSelected.bind(this),
1130
+ addOption: this.addOption.bind(this),
1131
+ search: this.search.bind(this),
1132
+ beforeChange: this.events.beforeChange,
1133
+ afterChange: this.events.afterChange
1134
+ };
1135
+ this.render = new l(this.settings, this.cssClasses, this.store, a), this.render.renderValues(), this.render.renderOptions(this.store.getData());
1136
+ let o = this.selectEl.getAttribute("aria-label"), s = this.selectEl.getAttribute("aria-labelledby");
1137
+ if (o) this.render.main.main.setAttribute("aria-label", o);
1138
+ else if (s) this.render.main.main.removeAttribute("aria-label"), this.render.main.main.setAttribute("aria-labelledby", s);
1139
+ else if (this.selectEl.labels && this.selectEl.labels.length > 0) {
1140
+ let e = Array.from(this.selectEl.labels).map((e, t) => (e.id ||= `${this.settings.id}-label-${t}`, e.id));
1141
+ this.render.main.main.removeAttribute("aria-label"), this.render.main.main.setAttribute("aria-labelledby", e.join(" "));
1142
+ }
1143
+ 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;
1144
+ }
1145
+ enable() {
1146
+ this.settings.disabled = !1, this.select.enable(), this.render.enable();
1147
+ }
1148
+ disable() {
1149
+ this.settings.disabled = !0, this.select.disable(), this.render.disable();
1150
+ }
1151
+ getData() {
1152
+ return this.store.getData();
1153
+ }
1154
+ setData(e) {
1155
+ let t = this.store.getSelected(), n = this.store.validateDataArray(e);
1156
+ if (n) {
1157
+ this.events.error && this.events.error(n);
1158
+ return;
1159
+ }
1160
+ this.store.setData(e);
1161
+ let r = this.store.getData();
1162
+ 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());
1163
+ }
1164
+ getSelected() {
1165
+ let e = this.store.getSelectedOptions();
1166
+ return this.settings.keepOrder && (e = this.store.selectedOrderOptions(e)), e.map((e) => e.value);
1167
+ }
1168
+ setSelected(e, t = !0) {
1169
+ let n = this.store.getSelected(), r = this.store.getDataOptions();
1170
+ e = Array.isArray(e) ? e : [e];
1171
+ let a = [];
1172
+ for (let t of e) {
1173
+ if (r.find((e) => e.id == t)) {
1174
+ a.push(t);
1175
+ continue;
1176
+ }
1177
+ for (let e of r.filter((e) => e.value == t)) a.push(e.id);
1178
+ }
1179
+ this.store.setSelectedBy("id", a);
1180
+ let o = this.store.getData();
1181
+ 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());
1182
+ }
1183
+ addOption(e) {
1184
+ let t = this.store.getSelected();
1185
+ this.store.getDataOptions().some((t) => t.value === (e.value ?? e.text)) || this.store.addOption(e);
1186
+ let n = this.store.getData();
1187
+ 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());
1188
+ }
1189
+ open() {
1190
+ 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(() => {
1191
+ this.events.afterOpen && this.events.afterOpen(), this.settings.isOpen && (this.settings.isFullOpen = !0), document.addEventListener("click", this.documentClick);
1192
+ }, 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)));
1193
+ }
1194
+ close(e = null) {
1195
+ !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(() => {
1196
+ this.events.afterClose && this.events.afterClose(), document.removeEventListener("click", this.documentClick);
1197
+ }, this.settings.timeoutDelay), this.settings.intervalMove && clearInterval(this.settings.intervalMove));
1198
+ }
1199
+ search(e) {
1200
+ if (this.render.content.search.input.value !== e && (this.render.content.search.input.value = e), e === "") {
1201
+ this.render.renderOptions(this.store.getData());
1202
+ return;
1203
+ }
1204
+ if (!this.events.search) {
1205
+ let t = e === "" ? this.store.getData() : this.store.search(e, this.events.searchFilter);
1206
+ this.render.renderOptions(t);
1207
+ return;
1208
+ }
1209
+ this.render.renderSearching();
1210
+ let t = this.events.search(e, this.store.getSelectedOptions());
1211
+ if (t instanceof Promise) {
1212
+ t.then((e) => {
1213
+ this.store.setData(e, !0), this.select.updateOptions(this.store.getData()), this.render.renderOptions(this.store.getData());
1214
+ }).catch((e) => {
1215
+ this.render.renderError(typeof e == "string" ? e : e.message);
1216
+ });
1217
+ return;
1218
+ } 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");
1219
+ }
1220
+ destroy() {
1221
+ 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();
1222
+ }
1223
+ windowResize = r(() => {
1224
+ !this.settings.isOpen && !this.settings.isFullOpen || this.render.moveContent();
1225
+ });
1226
+ windowScroll = r(() => {
1227
+ !this.settings.isOpen && !this.settings.isFullOpen || this.render.moveContent();
1228
+ });
1229
+ documentClick = (e) => {
1230
+ this.settings.isOpen && e.target && !n(e.target, this.settings.id) && this.close(e.type);
1231
+ };
1232
+ windowVisibilityChange = () => {
1233
+ document.hidden && this.close();
1234
+ };
1390
1235
  };
1391
- //# sourceMappingURL=slimselect.es.js.map
1236
+ //#endregion
1237
+ export { s as Optgroup, o as Option, d as Settings, f as default };
1238
+
1239
+ //# sourceMappingURL=slimselect.es.js.map