Skip to content

Commit 94de2bd

Browse files
brianvoebrianvoe
committed
Merge branch 'develop'
2 parents 8a105ca + 4813fe4 commit 94de2bd

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

59 files changed

+20734
-12331
lines changed

‎dist/render.d.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ export interface Callbacks {
44
open: () => void;
55
close: () => void;
66
addable?: (value: string) => Promise<OptionOptional | string> | OptionOptional | string | false | undefined | null;
7-
setSelected: (value: string[], runAfterChange: boolean) => void;
7+
setSelected: (value: string | string[], runAfterChange: boolean) => void;
88
addOption: (option: Option) => void;
99
search: (search: string) => void;
1010
beforeChange?: (newVal: Option[], oldVal: Option[]) => boolean | void;

‎dist/settings.d.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ export default class Settings {
1111
disabled: boolean;
1212
alwaysOpen: boolean;
1313
showSearch: boolean;
14+
ariaLabel: string;
1415
searchPlaceholder: string;
1516
searchText: string;
1617
searchingText: string;

‎dist/slimselect.cjs.js‎

Lines changed: 43 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -70,6 +70,7 @@ class Settings {
7070
this.disabled = settings.disabled !== undefined ? settings.disabled : false;
7171
this.alwaysOpen = settings.alwaysOpen !== undefined ? settings.alwaysOpen : false;
7272
this.showSearch = settings.showSearch !== undefined ? settings.showSearch : true;
73+
this.ariaLabel = settings.ariaLabel || 'Combobox';
7374
this.searchPlaceholder = settings.searchPlaceholder || 'Search';
7475
this.searchText = settings.searchText || 'No Results';
7576
this.searchingText = settings.searchingText || 'Searching...';
@@ -257,6 +258,24 @@ class Store {
257258
}, false);
258259
return options.length ? options[0] : null;
259260
}
261+
getSelectType() {
262+
return this.selectType;
263+
}
264+
getFirstOption() {
265+
let option = null;
266+
for (let dataObj of this.data) {
267+
if (dataObj instanceof Optgroup) {
268+
option = dataObj.options[0];
269+
}
270+
else if (dataObj instanceof Option) {
271+
option = dataObj;
272+
}
273+
if (option) {
274+
break;
275+
}
276+
}
277+
return option;
278+
}
260279
search(search, searchFilter) {
261280
search = search.trim();
262281
if (search === '') {
@@ -295,9 +314,6 @@ class Store {
295314
});
296315
return dataSearch;
297316
}
298-
getSelectType() {
299-
return this.selectType;
300-
}
301317
}
302318

303319
class Render {
@@ -417,7 +433,7 @@ class Render {
417433
var _a;
418434
const main = document.createElement('div');
419435
main.dataset.id = this.settings.id;
420-
main.id = this.settings.id;
436+
main.setAttribute('aria-label', this.settings.ariaLabel);
421437
main.tabIndex = 0;
422438
main.onkeydown = (e) => {
423439
switch (e.key) {
@@ -441,6 +457,7 @@ class Render {
441457
this.callbacks.close();
442458
return false;
443459
}
460+
return false;
444461
};
445462
main.onclick = (e) => {
446463
if (this.settings.disabled) {
@@ -477,13 +494,15 @@ class Render {
477494
this.updateDeselectAll();
478495
}
479496
else {
480-
this.callbacks.setSelected([''], false);
497+
const firstOption = this.store.getFirstOption();
498+
const value = firstOption ? firstOption.value : '';
499+
this.callbacks.setSelected(value, false);
481500
}
482501
if (this.settings.closeOnSelect) {
483502
this.callbacks.close();
484503
}
485504
if (this.callbacks.afterChange) {
486-
this.callbacks.afterChange(after);
505+
this.callbacks.afterChange(this.store.getSelectedOptions());
487506
}
488507
}
489508
};
@@ -706,7 +725,6 @@ class Render {
706725
contentDiv() {
707726
const main = document.createElement('div');
708727
main.dataset.id = this.settings.id;
709-
main.id = this.settings.id;
710728
const search = this.searchDiv();
711729
main.appendChild(search.main);
712730
const list = this.listDiv();
@@ -787,6 +805,7 @@ class Render {
787805
}
788806
return true;
789807
}
808+
return true;
790809
};
791810
main.appendChild(input);
792811
if (this.callbacks.addable) {
@@ -890,6 +909,20 @@ class Render {
890909
return;
891910
}
892911
}
912+
let highlighted = false;
913+
for (const o of options) {
914+
if (o.classList.contains(this.classes.highlighted)) {
915+
highlighted = true;
916+
}
917+
}
918+
if (!highlighted) {
919+
for (const o of options) {
920+
if (o.classList.contains(this.classes.selected)) {
921+
o.classList.add(this.classes.highlighted);
922+
break;
923+
}
924+
}
925+
}
893926
for (let i = 0; i < options.length; i++) {
894927
if (options[i].classList.contains(this.classes.highlighted)) {
895928
const prevOption = options[i];
@@ -1262,7 +1295,8 @@ class Select {
12621295
this.listen = false;
12631296
this.observer = null;
12641297
this.select = select;
1265-
this.select.addEventListener('change', this.valueChange.bind(this), {
1298+
this.valueChange = this.valueChange.bind(this);
1299+
this.select.addEventListener('change', this.valueChange, {
12661300
passive: true,
12671301
});
12681302
this.observer = new MutationObserver(this.observeCall.bind(this));
@@ -1518,7 +1552,7 @@ class Select {
15181552
}
15191553
destroy() {
15201554
this.changeListen(false);
1521-
this.select.removeEventListener('change', this.valueChange.bind(this));
1555+
this.select.removeEventListener('change', this.valueChange);
15221556
if (this.observer) {
15231557
this.observer.disconnect();
15241558
this.observer = null;

‎dist/slimselect.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/slimselect.css.map‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/slimselect.es.js‎

Lines changed: 43 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,7 @@ class Settings {
6868
this.disabled = settings.disabled !== undefined ? settings.disabled : false;
6969
this.alwaysOpen = settings.alwaysOpen !== undefined ? settings.alwaysOpen : false;
7070
this.showSearch = settings.showSearch !== undefined ? settings.showSearch : true;
71+
this.ariaLabel = settings.ariaLabel || 'Combobox';
7172
this.searchPlaceholder = settings.searchPlaceholder || 'Search';
7273
this.searchText = settings.searchText || 'No Results';
7374
this.searchingText = settings.searchingText || 'Searching...';
@@ -255,6 +256,24 @@ class Store {
255256
}, false);
256257
return options.length ? options[0] : null;
257258
}
259+
getSelectType() {
260+
return this.selectType;
261+
}
262+
getFirstOption() {
263+
let option = null;
264+
for (let dataObj of this.data) {
265+
if (dataObj instanceof Optgroup) {
266+
option = dataObj.options[0];
267+
}
268+
else if (dataObj instanceof Option) {
269+
option = dataObj;
270+
}
271+
if (option) {
272+
break;
273+
}
274+
}
275+
return option;
276+
}
258277
search(search, searchFilter) {
259278
search = search.trim();
260279
if (search === '') {
@@ -293,9 +312,6 @@ class Store {
293312
});
294313
return dataSearch;
295314
}
296-
getSelectType() {
297-
return this.selectType;
298-
}
299315
}
300316

301317
class Render {
@@ -415,7 +431,7 @@ class Render {
415431
var _a;
416432
const main = document.createElement('div');
417433
main.dataset.id = this.settings.id;
418-
main.id = this.settings.id;
434+
main.setAttribute('aria-label', this.settings.ariaLabel);
419435
main.tabIndex = 0;
420436
main.onkeydown = (e) => {
421437
switch (e.key) {
@@ -439,6 +455,7 @@ class Render {
439455
this.callbacks.close();
440456
return false;
441457
}
458+
return false;
442459
};
443460
main.onclick = (e) => {
444461
if (this.settings.disabled) {
@@ -475,13 +492,15 @@ class Render {
475492
this.updateDeselectAll();
476493
}
477494
else {
478-
this.callbacks.setSelected([''], false);
495+
const firstOption = this.store.getFirstOption();
496+
const value = firstOption ? firstOption.value : '';
497+
this.callbacks.setSelected(value, false);
479498
}
480499
if (this.settings.closeOnSelect) {
481500
this.callbacks.close();
482501
}
483502
if (this.callbacks.afterChange) {
484-
this.callbacks.afterChange(after);
503+
this.callbacks.afterChange(this.store.getSelectedOptions());
485504
}
486505
}
487506
};
@@ -704,7 +723,6 @@ class Render {
704723
contentDiv() {
705724
const main = document.createElement('div');
706725
main.dataset.id = this.settings.id;
707-
main.id = this.settings.id;
708726
const search = this.searchDiv();
709727
main.appendChild(search.main);
710728
const list = this.listDiv();
@@ -785,6 +803,7 @@ class Render {
785803
}
786804
return true;
787805
}
806+
return true;
788807
};
789808
main.appendChild(input);
790809
if (this.callbacks.addable) {
@@ -888,6 +907,20 @@ class Render {
888907
return;
889908
}
890909
}
910+
let highlighted = false;
911+
for (const o of options) {
912+
if (o.classList.contains(this.classes.highlighted)) {
913+
highlighted = true;
914+
}
915+
}
916+
if (!highlighted) {
917+
for (const o of options) {
918+
if (o.classList.contains(this.classes.selected)) {
919+
o.classList.add(this.classes.highlighted);
920+
break;
921+
}
922+
}
923+
}
891924
for (let i = 0; i < options.length; i++) {
892925
if (options[i].classList.contains(this.classes.highlighted)) {
893926
const prevOption = options[i];
@@ -1260,7 +1293,8 @@ class Select {
12601293
this.listen = false;
12611294
this.observer = null;
12621295
this.select = select;
1263-
this.select.addEventListener('change', this.valueChange.bind(this), {
1296+
this.valueChange = this.valueChange.bind(this);
1297+
this.select.addEventListener('change', this.valueChange, {
12641298
passive: true,
12651299
});
12661300
this.observer = new MutationObserver(this.observeCall.bind(this));
@@ -1516,7 +1550,7 @@ class Select {
15161550
}
15171551
destroy() {
15181552
this.changeListen(false);
1519-
this.select.removeEventListener('change', this.valueChange.bind(this));
1553+
this.select.removeEventListener('change', this.valueChange);
15201554
if (this.observer) {
15211555
this.observer.disconnect();
15221556
this.observer = null;

0 commit comments

Comments
 (0)