slim-select 2.2.3 → 2.3.1

package/dist/slimselect.global.js

@@ -68,7 +68,7 @@ var SlimSelect = (function () {
             this.id = 'ss-' + generateID();
             this.style = settings.style || '';
             this.class = settings.class || [];
-            this.isEnabled = settings.isEnabled !== undefined ? settings.isEnabled : true;
+            this.disabled = settings.disabled !== undefined ? settings.disabled : false;
             this.alwaysOpen = settings.alwaysOpen !== undefined ? settings.alwaysOpen : false;
             this.showSearch = settings.showSearch !== undefined ? settings.showSearch : true;
             this.searchPlaceholder = settings.searchPlaceholder || 'Search';
@@ -86,6 +86,8 @@ var SlimSelect = (function () {
             this.minSelected = settings.minSelected || 0;
             this.maxSelected = settings.maxSelected || 1000;
             this.timeoutDelay = settings.timeoutDelay || 200;
+            this.maxValuesShown = settings.maxValuesShown || 20;
+            this.maxValuesMessage = settings.maxValuesMessage || '{number} selected';
         }
     }
 
@@ -302,6 +304,7 @@ var SlimSelect = (function () {
                 placeholder: 'ss-placeholder',
                 values: 'ss-values',
                 single: 'ss-single',
+                max: 'ss-max',
                 value: 'ss-value',
                 valueText: 'ss-value-text',
                 valueDelete: 'ss-value-delete',
@@ -343,6 +346,7 @@ var SlimSelect = (function () {
             this.callbacks = callbacks;
             this.main = this.mainDiv();
             this.content = this.contentDiv();
+            this.updateClassStyles();
             this.settings.contentLocation.appendChild(this.content.main);
         }
         enable() {
@@ -357,24 +361,6 @@ var SlimSelect = (function () {
             this.main.arrow.path.setAttribute('d', this.classes.arrowOpen);
             this.main.main.classList.add(this.settings.openPosition === 'up' ? this.classes.openAbove : this.classes.openBelow);
             this.moveContent();
-            this.renderOptions(this.store.getData());
-            if (this.settings.contentPosition === 'relative') {
-                this.moveContentBelow();
-            }
-            else if (this.settings.openPosition.toLowerCase() === 'up') {
-                this.moveContentAbove();
-            }
-            else if (this.settings.openPosition.toLowerCase() === 'down') {
-                this.moveContentBelow();
-            }
-            else {
-                if (this.putContent(this.content.main, this.settings.isOpen) === 'up') {
-                    this.moveContentAbove();
-                }
-                else {
-                    this.moveContentBelow();
-                }
-            }
             const selectedOptions = this.store.getSelectedOptions();
             if (selectedOptions.length) {
                 const selectedId = selectedOptions[selectedOptions.length - 1].id;
@@ -391,20 +377,32 @@ var SlimSelect = (function () {
             this.content.main.classList.remove(this.classes.openBelow);
             this.main.arrow.path.setAttribute('d', this.classes.arrowClose);
         }
-        mainDiv() {
-            const main = document.createElement('div');
-            main.tabIndex = 0;
-            main.style.cssText = this.settings.style !== '' ? this.settings.style : '';
-            main.className = '';
-            main.classList.add(this.settings.id);
-            main.classList.add(this.classes.main);
-            if (this.settings.class) {
+        updateClassStyles() {
+            this.main.main.className = '';
+            this.main.main.removeAttribute('style');
+            this.content.main.className = '';
+            this.content.main.removeAttribute('style');
+            this.main.main.classList.add(this.classes.main);
+            this.content.main.classList.add(this.classes.content);
+            if (this.settings.style !== '') {
+                this.content.main.style.cssText = this.settings.style;
+            }
+            if (this.settings.class.length) {
                 for (const c of this.settings.class) {
                     if (c.trim() !== '') {
-                        main.classList.add(c.trim());
+                        this.main.main.classList.add(c.trim());
+                        this.content.main.classList.add(c.trim());
                     }
                 }
             }
+            if (this.settings.contentPosition === 'relative') {
+                this.content.main.classList.add('ss-' + this.settings.contentPosition);
+            }
+        }
+        mainDiv() {
+            const main = document.createElement('div');
+            main.dataset.id = this.settings.id;
+            main.tabIndex = 0;
             main.onfocus = () => {
                 if (this.settings.triggerFocus) {
                     this.callbacks.open();
@@ -432,7 +430,7 @@ var SlimSelect = (function () {
                 }
             };
             main.onclick = (e) => {
-                if (!this.settings.isEnabled) {
+                if (this.settings.disabled) {
                     return;
                 }
                 this.settings.isOpen ? this.callbacks.close() : this.callbacks.open();
@@ -447,7 +445,7 @@ var SlimSelect = (function () {
             }
             deselect.onclick = (e) => {
                 e.stopPropagation();
-                if (!this.settings.isEnabled) {
+                if (this.settings.disabled) {
                     return;
                 }
                 let shouldDelete = true;
@@ -457,7 +455,7 @@ var SlimSelect = (function () {
                     shouldDelete = this.callbacks.beforeChange(after, before) === true;
                 }
                 if (shouldDelete) {
-                    this.callbacks.setSelected(['']);
+                    this.callbacks.setSelected([''], false);
                     if (this.settings.closeOnSelect) {
                         this.callbacks.close();
                     }
@@ -563,6 +561,19 @@ var SlimSelect = (function () {
                     placeholder.remove();
                 }
             }
+            if (selectedOptions.length > this.settings.maxValuesShown) {
+                const singleValue = document.createElement('div');
+                singleValue.classList.add(this.classes.max);
+                singleValue.textContent = this.settings.maxValuesMessage.replace('{number}', selectedOptions.length.toString());
+                this.main.values.innerHTML = singleValue.outerHTML;
+                return;
+            }
+            else {
+                const maxValuesMessage = this.main.values.querySelector('.' + this.classes.max);
+                if (maxValuesMessage) {
+                    maxValuesMessage.remove();
+                }
+            }
             let removeNodes = [];
             for (let i = 0; i < currentNodes.length; i++) {
                 const node = currentNodes[i];
@@ -617,6 +628,9 @@ var SlimSelect = (function () {
                 deleteDiv.onclick = (e) => {
                     e.preventDefault();
                     e.stopPropagation();
+                    if (this.settings.disabled) {
+                        return;
+                    }
                     let shouldDelete = true;
                     const before = this.store.getSelectedOptions();
                     const after = before.filter((o) => {
@@ -640,7 +654,7 @@ var SlimSelect = (function () {
                                 selectedValues.push(o.value);
                             }
                         }
-                        this.callbacks.setSelected(selectedValues);
+                        this.callbacks.setSelected(selectedValues, false);
                         if (this.settings.closeOnSelect) {
                             this.callbacks.close();
                         }
@@ -661,21 +675,7 @@ var SlimSelect = (function () {
         }
         contentDiv() {
             const main = document.createElement('div');
-            main.classList.add(this.classes.content);
             main.dataset.id = this.settings.id;
-            if (this.settings.style !== '') {
-                main.style.cssText = this.settings.style;
-            }
-            if (this.settings.contentPosition === 'relative') {
-                main.classList.add('ss-' + this.settings.contentPosition);
-            }
-            if (this.settings.class.length) {
-                for (const c of this.settings.class) {
-                    if (c.trim() !== '') {
-                        main.classList.add(c.trim());
-                    }
-                }
-            }
             const search = this.searchDiv();
             main.appendChild(search.main);
             const list = this.listDiv();
@@ -688,12 +688,23 @@ var SlimSelect = (function () {
         }
         moveContent() {
             if (this.settings.contentPosition === 'relative') {
+                this.moveContentBelow();
                 return;
             }
-            const containerRect = this.main.main.getBoundingClientRect();
-            this.content.main.style.top = containerRect.top + containerRect.height + window.scrollY + 'px';
-            this.content.main.style.left = containerRect.left + window.scrollX + 'px';
-            this.content.main.style.width = containerRect.width + 'px';
+            if (this.settings.openPosition === 'down') {
+                this.moveContentBelow();
+                return;
+            }
+            else if (this.settings.openPosition === 'up') {
+                this.moveContentAbove();
+                return;
+            }
+            if (this.putContent() === 'up') {
+                this.moveContentAbove();
+            }
+            else {
+                this.moveContentBelow();
+            }
         }
         searchDiv() {
             const main = document.createElement('div');
@@ -776,10 +787,10 @@ var SlimSelect = (function () {
                         if (this.settings.isMultiple) {
                             let values = this.store.getSelected();
                             values.push(newOption.value);
-                            this.callbacks.setSelected(values);
+                            this.callbacks.setSelected(values, true);
                         }
                         else {
-                            this.callbacks.setSelected([newOption.value]);
+                            this.callbacks.setSelected([newOption.value], true);
                         }
                         this.callbacks.search('');
                         if (this.settings.closeOnSelect) {
@@ -904,8 +915,7 @@ var SlimSelect = (function () {
             this.content.list.innerHTML = '';
             if (data.length === 0) {
                 const noResults = document.createElement('div');
-                noResults.classList.add(this.classes.option);
-                noResults.classList.add(this.classes.disabled);
+                noResults.classList.add(this.classes.search);
                 noResults.innerHTML = this.settings.searchText;
                 this.content.list.appendChild(noResults);
                 return;
@@ -962,12 +972,12 @@ var SlimSelect = (function () {
                                     }
                                     return true;
                                 });
-                                this.callbacks.setSelected(newSelected);
+                                this.callbacks.setSelected(newSelected, true);
                                 return;
                             }
                             else {
                                 const newSelected = currentSelected.concat(d.options.map((o) => o.value));
-                                this.callbacks.setSelected(newSelected);
+                                this.callbacks.setSelected(newSelected, true);
                             }
                         });
                         optgroupActions.appendChild(selectAll);
@@ -981,7 +991,7 @@ var SlimSelect = (function () {
                         optgroupClosable.appendChild(optgroupClosableSvg);
                         const optgroupClosableArrow = document.createElementNS('http://www.w3.org/2000/svg', 'path');
                         optgroupClosableSvg.appendChild(optgroupClosableArrow);
-                        if (d.options.some((o) => o.selected)) {
+                        if (d.options.some((o) => o.selected) || this.content.search.input.value.trim() !== '') {
                             optgroupClosable.classList.add(this.classes.open);
                             optgroupClosableArrow.setAttribute('d', this.classes.arrowOpen);
                         }
@@ -1040,8 +1050,7 @@ var SlimSelect = (function () {
                 optionEl.style.cssText = option.style;
             }
             if (this.settings.searchHighlight && this.content.search.input.value.trim() !== '') {
-                const textOrHtml = option.html !== '' ? option.html : option.text;
-                optionEl.innerHTML = this.highlightText(textOrHtml, this.content.search.input.value, this.classes.searchHighlighter);
+                optionEl.innerHTML = this.highlightText(option.html !== '' ? option.html : option.text, this.content.search.input.value, this.classes.searchHighlighter);
             }
             else if (option.html !== '') {
                 optionEl.innerHTML = option.html;
@@ -1052,7 +1061,10 @@ var SlimSelect = (function () {
             if (this.settings.showOptionTooltips && optionEl.textContent) {
                 optionEl.setAttribute('title', optionEl.textContent);
             }
-            if ((option.selected && !this.settings.allowDeselect) || (option.disabled && !this.settings.allowDeselect)) {
+            if (!option.display) {
+                optionEl.classList.add(this.classes.hide);
+            }
+            if (option.disabled) {
                 optionEl.classList.add(this.classes.disabled);
             }
             if (option.selected && this.settings.hideSelected) {
@@ -1073,9 +1085,8 @@ var SlimSelect = (function () {
                 if (option.disabled || (option.selected && !this.settings.allowDeselect)) {
                     return;
                 }
-                if (this.settings.isMultiple &&
-                    Array.isArray(selectedOptions) &&
-                    this.settings.maxSelected <= selectedOptions.length) {
+                if ((this.settings.isMultiple && this.settings.maxSelected <= selectedOptions.length && !option.selected) ||
+                    (this.settings.isMultiple && this.settings.minSelected >= selectedOptions.length && option.selected)) {
                     return;
                 }
                 let shouldUpdate = false;
@@ -1112,7 +1123,7 @@ var SlimSelect = (function () {
                     if (!this.store.getOptionByID(elementID)) {
                         this.callbacks.addOption(option);
                     }
-                    this.callbacks.setSelected(after.map((o) => o.value));
+                    this.callbacks.setSelected(after.map((o) => o.value), false);
                     if (this.settings.closeOnSelect) {
                         this.callbacks.close();
                     }
@@ -1140,23 +1151,30 @@ var SlimSelect = (function () {
             return completedString;
         }
         moveContentAbove() {
-            let mainHeight = this.main.main.offsetHeight;
+            const mainHeight = this.main.main.offsetHeight;
             const contentHeight = this.content.main.offsetHeight;
-            const height = mainHeight + contentHeight - 1;
-            this.content.main.style.margin = '-' + height + 'px 0px 0px 0px';
-            this.content.main.style.transformOrigin = 'center bottom';
             this.main.main.classList.remove(this.classes.openBelow);
             this.main.main.classList.add(this.classes.openAbove);
             this.content.main.classList.remove(this.classes.openBelow);
             this.content.main.classList.add(this.classes.openAbove);
+            const containerRect = this.main.main.getBoundingClientRect();
+            this.content.main.style.margin = '-' + (mainHeight + contentHeight - 1) + 'px 0px 0px 0px';
+            this.content.main.style.top = containerRect.top + containerRect.height + window.scrollY + 'px';
+            this.content.main.style.left = containerRect.left + window.scrollX + 'px';
+            this.content.main.style.width = containerRect.width + 'px';
         }
         moveContentBelow() {
-            this.content.main.style.margin = '-1px 0px 0px 0px';
-            this.content.main.style.transformOrigin = 'center top';
             this.main.main.classList.remove(this.classes.openAbove);
             this.main.main.classList.add(this.classes.openBelow);
             this.content.main.classList.remove(this.classes.openAbove);
             this.content.main.classList.add(this.classes.openBelow);
+            const containerRect = this.main.main.getBoundingClientRect();
+            this.content.main.style.margin = '-1px 0px 0px 0px';
+            if (this.settings.contentPosition !== 'relative') {
+                this.content.main.style.top = containerRect.top + containerRect.height + window.scrollY + 'px';
+                this.content.main.style.left = containerRect.left + window.scrollX + 'px';
+                this.content.main.style.width = containerRect.width + 'px';
+            }
         }
         ensureElementInView(container, element) {
             const cTop = container.scrollTop + container.offsetTop;
@@ -1170,16 +1188,18 @@ var SlimSelect = (function () {
                 container.scrollTop += eBottom - cBottom;
             }
         }
-        putContent(el, isOpen) {
-            const height = el.offsetHeight;
-            const rect = el.getBoundingClientRect();
-            const elemTop = isOpen ? rect.top : rect.top - height;
-            const elemBottom = isOpen ? rect.bottom : rect.bottom + height;
-            if (elemTop <= 0) {
-                return 'down';
-            }
-            if (elemBottom >= window.innerHeight) {
-                return 'up';
+        putContent() {
+            const mainHeight = this.main.main.offsetHeight;
+            const mainRect = this.main.main.getBoundingClientRect();
+            const contentHeight = this.content.main.offsetHeight;
+            const spaceBelow = window.innerHeight - (mainRect.top + mainHeight);
+            if (spaceBelow <= contentHeight) {
+                if (mainRect.top > contentHeight) {
+                    return 'up';
+                }
+                else {
+                    return 'down';
+                }
             }
             return 'down';
         }
@@ -1190,16 +1210,17 @@ var SlimSelect = (function () {
             this.listen = false;
             this.observer = null;
             this.select = select;
+            this.select.addEventListener('change', this.valueChange.bind(this), {
+                passive: true,
+            });
+            this.observer = new MutationObserver(this.observeCall.bind(this));
+            this.changeListen(true);
         }
         enable() {
-            this.disconnectObserver();
             this.select.disabled = false;
-            this.connectObserver();
         }
         disable() {
-            this.disconnectObserver();
             this.select.disabled = true;
-            this.connectObserver();
         }
         hideUI() {
             this.select.tabIndex = -1;
@@ -1211,65 +1232,61 @@ var SlimSelect = (function () {
             this.select.style.display = '';
             this.select.removeAttribute('aria-hidden');
         }
-        changeListen(on) {
-            this.listen = on;
-            if (this.listen) {
-                this.connectObserver();
+        changeListen(listen) {
+            this.listen = listen;
+            if (listen) {
+                if (this.observer) {
+                    this.observer.observe(this.select, {
+                        subtree: true,
+                        childList: true,
+                        attributes: true,
+                    });
+                }
             }
-            else {
-                this.disconnectObserver();
+            if (!listen) {
+                if (this.observer) {
+                    this.observer.disconnect();
+                }
             }
         }
-        addSelectChangeListener(func) {
-            this.onSelectChange = func;
-            this.addObserver();
-            this.connectObserver();
-            this.changeListen(true);
-        }
-        removeSelectChangeListener() {
-            this.changeListen(false);
-            this.onSelectChange = undefined;
-        }
-        addValueChangeListener(func) {
-            this.onValueChange = func;
-            this.select.addEventListener('change', this.valueChange.bind(this), {
-                passive: true,
-            });
-        }
-        removeValueChangeListener() {
-            this.onValueChange = undefined;
-            this.select.removeEventListener('change', this.valueChange.bind(this));
-        }
         valueChange(ev) {
             if (this.listen && this.onValueChange) {
                 this.onValueChange(this.getSelectedValues());
             }
             return true;
         }
-        observeWrapper(mutations) {
-            if (this.onSelectChange) {
-                this.changeListen(false);
-                this.onSelectChange(this.getData());
-                this.changeListen(true);
+        observeCall(mutations) {
+            if (!this.listen) {
+                return;
             }
-        }
-        addObserver() {
-            if (this.observer) {
-                this.disconnectObserver();
-                this.observer = null;
+            let classChanged = false;
+            let disabledChanged = false;
+            let optgroupOptionChanged = false;
+            for (const m of mutations) {
+                if (m.target === this.select) {
+                    if (m.attributeName === 'disabled') {
+                        disabledChanged = true;
+                    }
+                    if (m.attributeName === 'class') {
+                        classChanged = true;
+                    }
+                }
+                if (m.target.nodeName === 'OPTGROUP' || m.target.nodeName === 'OPTION') {
+                    optgroupOptionChanged = true;
+                }
             }
-            this.observer = new MutationObserver(this.observeWrapper.bind(this));
-        }
-        connectObserver() {
-            if (this.observer) {
-                this.observer.observe(this.select, {
-                    childList: true,
-                });
+            if (classChanged && this.onClassChange) {
+                this.onClassChange(this.select.className.split(' '));
             }
-        }
-        disconnectObserver() {
-            if (this.observer) {
-                this.observer.disconnect();
+            if (disabledChanged && this.onDisabledChange) {
+                this.changeListen(false);
+                this.onDisabledChange(this.select.disabled);
+                this.changeListen(true);
+            }
+            if (optgroupOptionChanged && this.onOptionsChange) {
+                this.changeListen(false);
+                this.onOptionsChange(this.getData());
+                this.changeListen(true);
             }
         }
         getData() {
@@ -1287,7 +1304,7 @@ var SlimSelect = (function () {
         }
         getDataFromOptgroup(optgroup) {
             let data = {
-                id: (optgroup.dataset ? optgroup.dataset.id : false) || '',
+                id: optgroup.id,
                 label: optgroup.label,
                 selectAll: optgroup.dataset ? optgroup.dataset.selectall === 'true' : false,
                 closable: optgroup.dataset ? optgroup.dataset.closable : 'off',
@@ -1303,10 +1320,10 @@ var SlimSelect = (function () {
         }
         getDataFromOption(option) {
             return {
-                id: (option.dataset ? option.dataset.id : false) || '',
+                id: option.id,
                 value: option.value,
                 text: option.text,
-                html: option.innerHTML,
+                html: option.dataset && option.dataset.html ? option.dataset.html : '',
                 selected: option.selected,
                 display: option.style.display === 'none' ? false : true,
                 disabled: option.disabled,
@@ -1342,6 +1359,7 @@ var SlimSelect = (function () {
             return values;
         }
         setSelected(value) {
+            this.changeListen(false);
             const options = this.select.childNodes;
             for (const o of options) {
                 if (o.nodeName === 'OPTGROUP') {
@@ -1359,11 +1377,12 @@ var SlimSelect = (function () {
                     option.selected = value.includes(option.value);
                 }
             }
+            this.changeListen(true);
         }
         updateSelect(id, style, classes) {
             this.changeListen(false);
             if (id) {
-                this.select.id = id;
+                this.select.dataset.id = id;
             }
             if (style) {
                 this.select.style.cssText = style;
@@ -1411,8 +1430,12 @@ var SlimSelect = (function () {
         }
         createOption(info) {
             const optionEl = document.createElement('option');
-            optionEl.value = info.value !== '' ? info.value : info.text;
-            optionEl.innerHTML = info.html || info.text;
+            optionEl.id = info.id;
+            optionEl.value = info.value;
+            optionEl.innerHTML = info.text;
+            if (info.html !== '') {
+                optionEl.setAttribute('data-html', info.html);
+            }
             if (info.selected) {
                 optionEl.selected = info.selected;
             }
@@ -1442,15 +1465,19 @@ var SlimSelect = (function () {
         }
         destroy() {
             this.changeListen(false);
-            this.disconnectObserver();
-            this.removeSelectChangeListener();
-            this.removeValueChangeListener();
+            this.select.removeEventListener('change', this.valueChange.bind(this));
+            if (this.observer) {
+                this.observer.disconnect();
+                this.observer = null;
+            }
+            delete this.select.dataset.id;
             this.showUI();
         }
     }
 
     class SlimSelect {
         constructor(config) {
+            var _a;
             this.events = {
                 search: undefined,
                 searchFilter: (opt, search) => {
@@ -1474,23 +1501,7 @@ var SlimSelect = (function () {
                 if (!this.settings.isOpen) {
                     return;
                 }
-                if (this.settings.openPosition === 'down') {
-                    this.render.moveContentBelow();
-                    return;
-                }
-                else if (this.settings.openPosition === 'up') {
-                    this.render.moveContentAbove();
-                    return;
-                }
-                if (this.settings.contentPosition === 'relative') {
-                    this.render.moveContentBelow();
-                }
-                else if (this.render.putContent(this.render.content.main, this.settings.isOpen) === 'up') {
-                    this.render.moveContentAbove();
-                }
-                else {
-                    this.render.moveContentBelow();
-                }
+                this.render.moveContent();
             });
             this.documentClick = (e) => {
                 if (!this.settings.isOpen) {
@@ -1522,18 +1533,31 @@ var SlimSelect = (function () {
                     this.events[key] = config.events[key];
                 }
             }
+            this.settings.disabled = ((_a = config.settings) === null || _a === void 0 ? void 0 : _a.disabled) ? config.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 Select(this.selectEl);
             this.select.updateSelect(this.settings.id, this.settings.style, this.settings.class);
             this.select.hideUI();
-            this.select.addSelectChangeListener((data) => {
-                this.setData(data);
-            });
-            this.select.addValueChangeListener((values) => {
+            this.select.onValueChange = (values) => {
                 this.setSelected(values);
-            });
+            };
+            this.select.onClassChange = (classes) => {
+                this.settings.class = classes;
+                this.render.updateClassStyles();
+            };
+            this.select.onDisabledChange = (disabled) => {
+                if (disabled) {
+                    this.disable();
+                }
+                else {
+                    this.enable();
+                }
+            };
+            this.select.onOptionsChange = (data) => {
+                this.setData(data);
+            };
             this.store = new Store(this.settings.isMultiple ? 'multiple' : 'single', config.data ? config.data : this.select.getData());
             if (config.data) {
                 this.select.updateOptions(this.store.getData());
@@ -1559,7 +1583,7 @@ var SlimSelect = (function () {
             if (this.settings.openPosition === 'auto') {
                 window.addEventListener('scroll', this.windowScroll, false);
             }
-            if (!this.settings.isEnabled) {
+            if (this.settings.disabled) {
                 this.disable();
             }
             if (this.settings.alwaysOpen) {
@@ -1568,12 +1592,12 @@ var SlimSelect = (function () {
             this.selectEl.slim = this;
         }
         enable() {
-            this.settings.isEnabled = true;
+            this.settings.disabled = false;
             this.select.enable();
             this.render.enable();
         }
         disable() {
-            this.settings.isEnabled = false;
+            this.settings.disabled = true;
             this.select.disable();
             this.render.disable();
         }
@@ -1601,14 +1625,19 @@ var SlimSelect = (function () {
         getSelected() {
             return this.store.getSelected();
         }
-        setSelected(value) {
+        setSelected(value, runAfterChange = true) {
             const selected = this.store.getSelected();
             this.store.setSelectedBy('value', Array.isArray(value) ? value : [value]);
             const data = this.store.getData();
             this.select.updateOptions(data);
             this.render.renderValues();
-            this.render.renderOptions(data);
-            if (this.events.afterChange && !isEqual(selected, this.store.getSelected())) {
+            if (this.render.content.search.input.value !== '') {
+                this.search(this.render.content.search.input.value);
+            }
+            else {
+                this.render.renderOptions(data);
+            }
+            if (runAfterChange && this.events.afterChange && !isEqual(selected, this.store.getSelected())) {
                 this.events.afterChange(this.store.getSelectedOptions());
             }
         }
@@ -1624,7 +1653,7 @@ var SlimSelect = (function () {
             }
         }
         open() {
-            if (!this.settings.isEnabled || this.settings.isOpen) {
+            if (this.settings.disabled || this.settings.isOpen) {
                 return;
             }
             if (this.events.beforeOpen) {
@@ -1640,10 +1669,12 @@ var SlimSelect = (function () {
                 }
                 this.settings.isOpen = true;
             }, this.settings.timeoutDelay);
-            if (this.settings.intervalMove) {
-                clearInterval(this.settings.intervalMove);
+            if (this.settings.contentPosition === 'absolute') {
+                if (this.settings.intervalMove) {
+                    clearInterval(this.settings.intervalMove);
+                }
+                this.settings.intervalMove = setInterval(this.render.moveContent.bind(this.render), 500);
             }
-            this.settings.intervalMove = setInterval(this.render.moveContent.bind(this.render), 500);
         }
         close() {
             if (!this.settings.isOpen || this.settings.alwaysOpen) {
@@ -1653,7 +1684,9 @@ var SlimSelect = (function () {
                 this.events.beforeClose();
             }
             this.render.close();
-            this.search('');
+            if (this.render.content.search.input.value !== '') {
+                this.search('');
+            }
             this.render.mainFocus(false);
             setTimeout(() => {
                 if (this.events.afterClose) {