diff --git a/bundle/easydropdown.js b/bundle/easydropdown.js index ec39d09..ecc2eaf 100644 --- a/bundle/easydropdown.js +++ b/bundle/easydropdown.js @@ -1,2 +1,2 @@ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.easydropdown=t():e.easydropdown=t()}(window,function(){return function(e){var t={};function n(o){if(t[o])return t[o].exports;var r=t[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=e,n.c=t,n.d=function(e,t,o){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:o})},n.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=70)}([function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(52);function r(e,t,n,o){var r=e(o,n),i=r.maxVisibleItemsOverride>-1?r.maxVisibleItemsOverride:n.behavior.maxVisibleItems,a=o.item.length>i,u=o.sumItemsHeight(i);t.open(u,r.type,a)}t.dispatchOpen=r;var i=r.bind(null,o.default);t.default=i},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(18),r=n(4);t.ArrayStrategy=r.default,t.default=o.default},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){return e.reduce(function(e,t){if("string"==typeof t)e.push(t);else{var n=t[0],o=t[1];n&&e.push(o)}return e},[]).join(" ")}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});t.default=function(e,t){var n=t.actions,o=t.timers;window.clearTimeout(o.keyingTimeoutId),n.keying(),o.keyingTimeoutId=window.setTimeout(function(){return n.resetKeying()},100),e.disabled=!0,setTimeout(function(){e.disabled=!1,e.focus()})}},function(e,t,n){"use strict";var o;Object.defineProperty(t,"__esModule",{value:!0}),function(e){e.PUSH="PUSH",e.REPLACE="REPLACE"}(o||(o={})),t.default=o},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=function(){return function(){this.label="",this.value="",this.isDisabled=!1}}();t.default=o},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=function(){function e(){this.label="",this.options=[],this.isDisabled=!1}return Object.defineProperty(e.prototype,"totalOptions",{get:function(){return this.options.length},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"hasLabel",{get:function(){return""!==this.label},enumerable:!0,configurable:!0}),e}();t.default=o},function(e,t,n){"use strict";var o;Object.defineProperty(t,"__esModule",{value:!0}),function(e){e.AT_TOP="AT_TOP",e.SCROLLED="SCROLLED",e.AT_BOTTOM="AT_BOTTOM"}(o||(o={})),t.default=o},function(e,t,n){"use strict";var o;Object.defineProperty(t,"__esModule",{value:!0}),function(e){e.CLOSED="CLOSED",e.OPEN_ABOVE="OPEN_ABOVE",e.OPEN_BELOW="OPEN_BELOW"}(o||(o={})),t.default=o},function(e,t,n){"use strict";var o;Object.defineProperty(t,"__esModule",{value:!0}),function(e){e.NONE="NONE",e.FULL="FULL",e.REPLACE="REPLACE",e.INNER="INNER",e.OUTER="OUTER"}(o=t.DomChangeType||(t.DomChangeType={})),t.default=o},function(e,t,n){"use strict";var o;Object.defineProperty(t,"__esModule",{value:!0}),function(e){e.ADD="ADD",e.EDIT="EDIT",e.REMOVE="REMOVE"}(o||(o={})),t.default=o},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e,t){var n=t.state,o=t.actions,r=t.dom;n.isOpen&&(o.close(),r.select.blur())}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.UP=38,t.DOWN=40,t.SPACE=32,t.ENTER=13,t.ESC=27},function(e,t,n){"use strict";var o;Object.defineProperty(t,"__esModule",{value:!0}),function(e){e.NONE="NONE",e.TOP="TOP",e.BOTTOM="BOTTOM"}(o||(o={})),t.default=o},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.OPTION='[data-ref~="option"]'},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e,t,n){void 0===n&&(n=!1);var o=e.parentNode;if(n&&e.matches(t))return e;for(;o&&o!==document.body;){if(o.matches&&o.matches(t))return o;if(!o.parentNode)return null;o=o.parentNode}return null}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(62),r=n(61),i=n(60),a=function(){return function(){this.callbacks=new r.default,this.classNames=new i.default,this.behavior=new o.default,Object.seal(this)}}();t.default=a},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.MERGE_ERROR=function(e,t){return void 0===t&&(t=""),'Unknown property "'+e+'"'+(t?'. Did you mean "'+t+'"?':"")},t.TYPE_ERROR_TARGET=function(e){return'[Helpful Merge] Target "'+e+'" must be a valid object'},t.TYPE_ERROR_SOURCE=function(e){return'[Helpful Merge] Source "'+e+'" must be a valid object'},t.INVALID_ARRAY_STRATEGY=function(e){return'[Helpful Merge] Invalid array strategy "'+e+'"'}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(65),r=n(4),i=n(64),a=n(63),u=n(17);function s(e,t,n){void 0===n&&(n=null);var i,l=[];if(i=n instanceof o.default?n:new o.default,"boolean"==typeof n&&!0===n)i.deep=!0;else if(n&&i!==n&&"object"==typeof n&&(s(i,n),[r.default.PUSH,r.default.REPLACE].indexOf(i.arrayStrategy)<0))throw RangeError(u.INVALID_ARRAY_STRATEGY(i.arrayStrategy));if(!e||"object"!=typeof e)throw new TypeError(u.TYPE_ERROR_TARGET(e));if(!t||"object"!=typeof t)throw new TypeError(u.TYPE_ERROR_SOURCE(t));if(Array.isArray(t)){if(i.arrayStrategy===r.default.PUSH)return e.push.apply(e,t),e;for(var d=0;d` element');i=!0,o.groups.push(e.mapGroup(s));for(var l=0,d=void 0;d=s.children[l];l++)o.lastGroup.options.push(e.mapOption(d,s)),d.selected&&(o.selectedIndex=o.totalOptions-1);i=!1}else o.placeholder=s.textContent,s.value="";return Object.seal(o)},e.mapGroup=function(e){return void 0===e&&(e=null),o.default(new i.default,{label:e?e.label:"",isDisabled:!!e&&e.disabled})},e.mapOption=function(e,t){if(void 0===t&&(t=null),!(e instanceof HTMLOptionElement))throw new TypeError("[EasyDropDown] Invalid markup structure");var n=null!==t&&t.disabled;return o.default(new a.default,{label:e.textContent,value:e.value,isDisabled:e.disabled||n})},e}();t.default=s},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(13),r=n(8),i=n(7);t.default=function(e){return{focus:function(){e.isFocused=!0},blur:function(){e.isFocused=!1},invalidate:function(){e.isInvalid=!0},validate:function(){e.isInvalid=!1},topOut:function(){e.scrollStatus=i.default.AT_TOP},bottomOut:function(){e.scrollStatus=i.default.AT_BOTTOM},scroll:function(){e.scrollStatus=i.default.SCROLLED},makeScrollable:function(){e.isScrollable=!0},makeUnscrollable:function(){e.isScrollable=!1},open:function(t,n,i){if(!e.isDisabled){switch(this.closeOthers(),n){case o.default.NONE:case o.default.TOP:e.bodyStatus=r.default.OPEN_BELOW;break;case o.default.BOTTOM:e.bodyStatus=r.default.OPEN_ABOVE}e.isScrollable=i,e.maxBodyHeight=t,this.scrollToView(e,!0)}},close:function(){e.bodyStatus=r.default.CLOSED,e.focusedIndex=-1},selectOption:function(t){var n=e.getOptionFromIndex(t);t>-1&&(!n||n.isDisabled)||(e.selectedIndex=t,e.isInvalid&&this.validate(),e.isSearching?this.scrollToView(e):this.close())},focusOption:function(t,n){void 0===n&&(n=!1);var o=Math.abs(t-e.focusedIndex)>1;e.focusedIndex=t,n&&this.scrollToView(e,o)},search:function(){e.isSearching=!0},resetSearch:function(){e.isSearching=!1},keying:function(){e.isKeying=!0},resetKeying:function(){e.isKeying=!1},useNative:function(){e.isUseNativeMode=!0}}}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(1),r=n(25),i=function(){function e(){}return e.proxyActions=function(t,n,i){var a=e.createStateProxy(t,i),u=r.default(a);return o.default(u,n),u},e.createStateProxy=function(t,n){return Object.seal(e.getPropertyDescriptorsFromValue(t,n).reduce(function(e,t){var n=t.key,o=t.get,r=t.set;return Object.defineProperty(e,n,{enumerable:!0,get:o,set:r})},{}))},e.getPropertyDescriptorsFromValue=function(t,n){var o=Object.getPrototypeOf(t);return Object.keys(t).concat(Object.keys(o)).reduce(function(r,i){var a="function"==typeof(Object.getOwnPropertyDescriptor(t,i)||Object.getOwnPropertyDescriptor(o,i)).get;return r.push({get:e.readPropertyValue.bind(null,t,i),set:a?void 0:e.updatePropertyValue.bind(null,t,i,n),key:i}),r},[])},e.readPropertyValue=function(e,t){return e[t]},e.updatePropertyValue=function(e,t,n,o){e[t]!==o&&(e[t]=o,n(e,t))},e}();t.default=i},function(e,t,n){"use strict";function o(e,t,n,o,r){var i;return t0?e+i+r:e}Object.defineProperty(t,"__esModule",{value:!0}),t.getScrollTop=o,t.default=function(e,t,n,r){void 0===r&&(r=!1);var i=Math.max(0,n.focusedIndex>-1?n.focusedIndex:n.selectedIndex),a=e.option[i];if(a){var u=r?n.maxBodyHeight/2-a.offsetHeight/2:0,s=o(e.itemsList.scrollTop,a.offsetTop,a.offsetHeight,n.maxBodyHeight,u);s!==e.itemsList.scrollTop&&(e.itemsList.scrollTop=s)}}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e,t){for(var n=0,o=t;n-1?n(function(){return a(e,t)}):a(e,t)})}function a(e,t){switch(t.type){case o.default.ADD:case o.default.EDIT:e.setAttribute(t.name,t.value);break;case o.default.REMOVE:e.removeAttribute(t.name)}}t.default=function e(t,n){switch(n.type){case r.default.NONE:return t;case r.default.REPLACE:return t.parentElement.replaceChild(n.newNode,t),n.newNode;case r.default.INNER:return t instanceof Text?t.textContent=n.newTextContent:n.childCommands.length>0?n.childCommands.forEach(function(n,o){return e(t.childNodes[o],n)}):t.innerHTML=n.newInnerHtml,t;case r.default.OUTER:return i(t,n.attributeChanges),t;case r.default.FULL:return n.childCommands.length>0?n.childCommands.forEach(function(n,o){return e(t.childNodes[o],n)}):t.innerHTML=n.newInnerHtml,i(t,n.attributeChanges),t}}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=function(){return function(){this.newNode=null,this.newInnerHtml="",this.newTextContent="",this.attributeChanges=[],this.childCommands=[],this.index=null}}();t.default=o},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(1),r=n(10),i=n(9),a=n(32);function u(e,t){for(var n=Math.max(e.attributes.length,t.attributes.length),o={},a=[],u=0;u1&&d.sort();u=0;for(var c=void 0;c=d[u];u++){var f=o[c],p={type:null,name:c,value:null};f[0]!==f[1]&&(void 0===f[0]?(p.type=r.default.ADD,p.value=f[1]):void 0===f[1]?(p.type=r.default.REMOVE,p.value=""):(p.type=r.default.EDIT,p.value=f[1]),a.push(p))}return{type:i.default.OUTER,attributeChanges:a}}t.default=function e(t,n){var r=-1,s=new a.default;if(t instanceof HTMLSelectElement)return s.type=i.default.NONE,s;if(t instanceof Text&&n instanceof Text)t.textContent===n.textContent?s.type=i.default.NONE:(s.type=i.default.INNER,s.newTextContent=n.textContent);else if(t instanceof HTMLElement&&n instanceof HTMLElement)if(t.tagName!==n.tagName)s.type=i.default.REPLACE,s.newNode=n;else if(t.outerHTML===n.outerHTML)s.type=i.default.NONE;else if(t.innerHTML===n.innerHTML)o.default(s,u(t,n));else if(o.default(s,u(t,n)),s.attributeChanges.length>0?s.type=i.default.FULL:s.type=i.default.INNER,(r=t.childNodes.length)>0&&r===n.childNodes.length)for(var l=0,d=void 0;d=t.childNodes[l];l++)s.childCommands.push(e(d,n.childNodes[l]));else s.newInnerHtml=n.innerHTML;else s.type=i.default.REPLACE,s.newNode=n;return s}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=function(){function e(){this.select=null,this.root=null,this.head=null,this.value=null,this.body=null,this.arrow=null,this.itemsList=null,this.item=[],this.group=[],this.option=[]}return e.prototype.sumItemsHeight=function(e){void 0===e&&(e=1/0);for(var t=0,n=0,o=void 0;(o=this.item[n])&&n!==e;n++)t+=o.offsetHeight;return t},e}();t.default=o},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=document.createElement("div");return t.innerHTML=e,t.firstElementChild}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});t.default=function(e,t){return'\n \n "+e.humanReadableValue+"\n \n "}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});t.default=function(e,t){return''}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(37),r=n(36);t.default=function(e,t){return'\n
\n '+r.default(e,t)+"\n "+o.default(e,t)+'\n \n
\n'}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2);t.default=function(e,t,n){var r=t.selectedOption===e;return'\n \n "+e.label+"\n \n "}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(39);t.default=function(e,t,n){return'\n
\n '+(e.hasLabel?'
'+e.label+"
":"")+"\n "+e.options.map(function(e){return r.default(e,t,n)}).join("")+"\n
\n "}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(40);t.default=function(e,t){var n=o.default([t.body,[e.isAtTop,t.bodyAtTop],[e.isAtBottom,t.bodyAtBottom],[e.isScrollable,t.bodyScrollable]]),i=e.isOpen?'style="max-height: '+e.maxBodyHeight+'px;"':"";return'\n \n
\n "+e.groups.map(function(n){return r.default(n,e,t)}).join("")+"\n
\n
\n \n \n '}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(41),i=n(38);t.default=function(e,t){return'\n \n "+i.default(e,t)+"\n "+(e.isUseNativeMode?"":r.default(e,t))+"\n \n "}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(42),r=n(35),i=n(34),a=n(33),u=n(31),s=function(){function e(e){this.dom=new i.default,this.classNames=e}return e.prototype.render=function(t,n){var a=o.default(t,this.classNames),u=r.default(a);return this.dom=new i.default,this.dom.root=u,this.dom.option.length=this.dom.group.length=0,e.queryDomRefs(this.dom),this.injectSelect(n),this.dom},e.prototype.update=function(e,t){var n=o.default(e,this.classNames),i=r.default(n),s=a.default(this.dom.root,i);u.default(this.dom.root,s),"selectedIndex"===t&&this.syncSelectWithValue(e.value)},e.prototype.destroy=function(){this.dom.select.classList.remove(this.classNames.select);try{this.dom.root.parentElement.replaceChild(this.dom.select,this.dom.root)}catch(e){}},e.prototype.injectSelect=function(e){var t=e.parentElement,n=this.dom.select;if(!t)throw new Error("[EasyDropDown] The provided `\n \n'}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2);t.default=function(e,t,n){var r=t.selectedOption===e;return'\n \n "+e.label+"\n \n "}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(39);t.default=function(e,t,n){return'\n
\n '+(e.hasLabel?'
'+e.label+"
":"")+"\n "+e.options.map(function(e){return r.default(e,t,n)}).join("")+"\n
\n "}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(40);t.default=function(e,t){var n=o.default([t.body,[e.isAtTop,t.bodyAtTop],[e.isAtBottom,t.bodyAtBottom],[e.isScrollable,t.bodyScrollable]]),i=e.isOpen?'style="max-height: '+e.maxBodyHeight+'px;"':"";return'\n \n
\n "+e.groups.map(function(n){return r.default(n,e,t)}).join("")+"\n
\n
\n \n \n '}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(41),i=n(38);t.default=function(e,t){return'\n \n "+i.default(e,t)+"\n "+(e.isUseNativeMode?"":r.default(e,t))+"\n \n "}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(42),r=n(35),i=n(34),a=n(33),u=n(31),s=function(){function e(e){this.dom=new i.default,this.classNames=e}return e.prototype.render=function(t,n){var a=o.default(t,this.classNames),u=r.default(a);return this.dom=new i.default,this.dom.root=u,this.dom.option.length=this.dom.group.length=0,e.queryDomRefs(this.dom),this.injectSelect(n),this.dom},e.prototype.update=function(e,t){var n=o.default(e,this.classNames),i=r.default(n),s=a.default(this.dom.root,i);u.default(this.dom.root,s),"selectedIndex"===t&&this.syncSelectWithValue(e.value)},e.prototype.destroy=function(){this.dom.select.classList.remove(this.classNames.select);try{this.dom.root.parentElement.replaceChild(this.dom.select,this.dom.root)}catch(e){}},e.prototype.injectSelect=function(e){var t=e.parentElement,n=this.dom.select;if(!t)throw new Error("[EasyDropDown] The provided ``\n * element (for example, adding or removing an option).\n */\n\n public refresh: () => void;\n\n /**\n * Destroys the instance by removing all EasyDropDown-generated\n * elements from the DOM, and unbinding all event handlers.\n * The underlying select is returned to the root position.\n */\n\n public destroy: () => void;\n\n /**\n * An accessor property allowing writing to and reading\n * from the dropdown's value.\n */\n\n public value: string;\n\n constructor(implementation: Easydropdown) {\n this.open = implementation.open.bind(implementation);\n this.close = implementation.close.bind(implementation);\n this.refresh = implementation.refresh.bind(implementation);\n this.destroy = implementation.destroy.bind(implementation);\n\n Object.defineProperties(this, {\n value: {\n get: () => implementation.value,\n set: (nextValue: string) => implementation.value = nextValue\n }\n });\n }\n}\n\nexport default EasydropdownFacade;","class Timers {\n public pollChangeIntervalId: number;\n public pollMutationIntervalId: number;\n public searchTimeoutId: number;\n public keyingTimeoutId: number;\n\n public clear(): void {\n Object.keys(this).forEach(key => window.clearInterval(this[key]));\n }\n}\n\nexport default Timers;","import merge from 'helpful-merge';\n\nimport Config from '../Config/Config';\n\nimport BodyStatus from './Constants/BodyStatus';\nimport ScrollStatus from './Constants/ScrollStatus';\nimport Group from './Group';\nimport Option from './Option';\n\nclass State {\n public groups: Group[] = [];\n public focusedIndex: number = -1;\n public selectedIndex: number = -1;\n public maxVisibleItemsOverride: number = -1;\n public maxBodyHeight: number = -1;\n public name: string = '';\n public placeholder: string = '';\n public scrollStatus: ScrollStatus = ScrollStatus.AT_TOP;\n public bodyStatus: BodyStatus = BodyStatus.CLOSED;\n public isDisabled: boolean = false;\n public isRequired: boolean = false;\n public isInvalid: boolean = false;\n public isFocused: boolean = false;\n public isUseNativeMode: boolean = false;\n public isScrollable: boolean = false;\n public isSearching: boolean = false;\n public isKeying: boolean = false;\n\n private config: Config;\n\n constructor(stateRaw: any = null, config = new Config()) {\n this.config = config;\n\n if (!stateRaw) return;\n\n merge(this, stateRaw);\n\n this.groups = this.groups.map((groupRaw) => {\n const group = merge(new Group(), groupRaw);\n\n group.options = group.options.map(optionRaw => merge(new Option(), optionRaw));\n\n return group;\n });\n }\n\n public get totalGroups(): number {\n return this.groups.length;\n }\n\n public get lastGroup(): Group {\n return this.groups[this.groups.length - 1];\n }\n\n public get totalOptions(): number {\n return this.groups.reduce((total: number, group: Group) => total + group.totalOptions, 0);\n }\n\n public get selectedOption(): Option {\n return this.getOptionFromIndex(this.selectedIndex);\n }\n\n public get focusedOption(): Option {\n return this.getOptionFromIndex(this.focusedIndex);\n }\n\n public get value(): string {\n return this.selectedOption ? this.selectedOption.value : '';\n }\n\n public get humanReadableValue(): string {\n if (\n (!this.hasValue && this.hasPlaceholder) ||\n (\n this.config.behavior.showPlaceholderWhenOpen &&\n this.hasPlaceholder &&\n this.isOpen\n )\n ) {\n return this.placeholder;\n }\n\n return this.label;\n }\n\n public get label(): string {\n return this.selectedOption ? this.selectedOption.label : '';\n }\n\n public get hasPlaceholder(): boolean {\n return this.placeholder !== '';\n }\n\n public get isPlaceholderShown(): boolean {\n return this.hasPlaceholder && !this.hasValue;\n }\n\n public get hasValue(): boolean {\n return this.value !== '';\n }\n\n public get isGrouped(): boolean {\n return Boolean(this.groups.find(group => group.hasLabel));\n }\n\n public get isOpen(): boolean {\n return this.bodyStatus !== BodyStatus.CLOSED;\n }\n\n public get isClosed(): boolean {\n return this.bodyStatus === BodyStatus.CLOSED;\n }\n\n public get isOpenAbove(): boolean {\n return this.bodyStatus === BodyStatus.OPEN_ABOVE;\n }\n\n public get isOpenBelow(): boolean {\n return this.bodyStatus === BodyStatus.OPEN_BELOW;\n }\n\n public get isAtTop(): boolean {\n return this.scrollStatus === ScrollStatus.AT_TOP;\n }\n\n public get isAtBottom(): boolean {\n return this.scrollStatus === ScrollStatus.AT_BOTTOM;\n }\n\n public getOptionFromIndex(index: number): Option {\n let groupStartIndex = 0;\n\n for (const group of this.groups) {\n if (index < 0 ) break;\n\n const groupEndIndex = Math.max(0, groupStartIndex + group.totalOptions - 1);\n\n if (index <= groupEndIndex) {\n const option = group.options[index - groupStartIndex];\n\n return option;\n }\n\n groupStartIndex += group.totalOptions;\n }\n\n return null;\n }\n\n public getOptionIndexFromValue(value: string): number {\n let index: number = -1;\n\n for (const group of this.groups) {\n for (const option of group.options) {\n index++;\n\n if (option.value === value) {\n return index;\n }\n }\n }\n\n return -1;\n }\n}\n\nexport default State;","function isMobilePlatform(userAgent: string): boolean {\n const isIos = /(ipad|iphone|ipod)/gi.test(userAgent);\n const isAndroid = /android/gi.test(userAgent);\n const isOperaMini = /opera mini/gi.test(userAgent);\n const isWindowsPhone = /windows phone/gi.test(userAgent);\n\n if (isIos || isAndroid || isOperaMini || isWindowsPhone) {\n return true;\n }\n\n return false;\n}\n\nexport default isMobilePlatform;","import merge from 'helpful-merge';\n\nimport Config from '../Config/Config';\nimport isMobilePlatform from '../Shared/Util/isMobilePlatform';\n\nimport Group from './Group';\nimport Option from './Option';\nimport State from './State';\n\nclass StateMapper {\n public static mapFromSelect(selectElement: HTMLSelectElement, config: Config): State {\n const state = new State(null, config);\n\n let isWithinGroup = false;\n\n state.name = selectElement.name;\n state.isDisabled = selectElement.disabled;\n state.isRequired = selectElement.required;\n\n state.isUseNativeMode = (\n config.behavior.useNativeUiOnMobile &&\n isMobilePlatform(window.navigator.userAgent)\n );\n\n for (let i = 0, child: Element; (child = selectElement.children[i]); i++) {\n if (i === 0 && child.getAttribute('data-placeholder') !== null) {\n state.placeholder = child.textContent;\n (child as HTMLOptionElement).value = '';\n\n continue;\n }\n\n if (child instanceof HTMLOptionElement) {\n if (isWithinGroup === false) {\n state.groups.push(StateMapper.mapGroup());\n\n isWithinGroup = true;\n }\n\n state.lastGroup.options.push(StateMapper.mapOption(child));\n\n if (child.selected) state.selectedIndex = state.totalOptions - 1;\n } else if (child instanceof HTMLOptGroupElement) {\n isWithinGroup = true;\n\n state.groups.push(StateMapper.mapGroup(child));\n\n for (let j = 0, groupChild: Element; (groupChild = child.children[j]); j++) {\n state.lastGroup.options.push(\n StateMapper.mapOption(\n groupChild as HTMLOptionElement,\n child as HTMLOptGroupElement\n )\n );\n\n if ((groupChild as HTMLOptionElement).selected) state.selectedIndex = state.totalOptions - 1;\n }\n\n isWithinGroup = false;\n } else {\n throw new TypeError(\n `[EasyDropDown] Invalid child tag \"${child.tagName}\" found in provided \\`\n \n`);\n\nexport default head;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport Option from '../State/Option';\nimport State from '../State/State';\n\nfunction option(optionState: Option, state: State, classNames: ClassNames): string {\n const isSelected = state.selectedOption === optionState;\n\n const className = composeClassName([\n classNames.option,\n [isSelected, classNames.optionSelected],\n [optionState === state.focusedOption, classNames.optionFocused],\n [optionState.isDisabled, classNames.optionDisabled]\n ]);\n\n return (`\n \n ${optionState.label}\n \n `);\n}\n\nexport default option;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport Group from '../State/Group';\nimport State from '../State/State';\n\nimport option from './option';\n\nconst group = (groupState: Group, state: State, classNames: ClassNames) => {\n const className = composeClassName([\n classNames.group,\n [groupState.isDisabled, classNames.groupDisabled],\n [groupState.hasLabel, classNames.groupHasLabel]\n ]);\n\n return (`\n
\n ${groupState.hasLabel ?\n `
${groupState.label}
` : ''\n }\n ${groupState.options.map(optionState => option(optionState, state, classNames)).join('')}\n
\n `);\n};\n\nexport default group;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport State from '../State/State';\n\nimport group from './group';\n\nfunction body(state: State, classNames: ClassNames): string {\n const className = composeClassName([\n classNames.body,\n [state.isAtTop, classNames.bodyAtTop],\n [state.isAtBottom, classNames.bodyAtBottom],\n [state.isScrollable, classNames.bodyScrollable]\n ]);\n\n const styleAttr = state.isOpen ?\n `style=\"max-height: ${state.maxBodyHeight}px;\"` : '';\n\n return (`\n \n
\n ${state.groups.map(groupState => group(groupState, state, classNames)).join('')}\n
\n
\n
\n \n `);\n}\n\nexport default body;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport State from '../State/State';\n\nimport body from './body';\nimport head from './head';\n\nconst root = (state: State, classNames: ClassNames) => {\n const className = composeClassName([\n classNames.root,\n [state.isDisabled, classNames.rootDisabled],\n [state.isInvalid, classNames.rootInvalid],\n [state.isOpen, classNames.rootOpen],\n [state.isFocused, classNames.rootFocused],\n [state.hasValue, classNames.rootHasValue],\n [state.isOpenAbove, classNames.rootOpenAbove],\n [state.isOpenBelow, classNames.rootOpenBelow],\n [state.isUseNativeMode, classNames.rootNative]\n ]);\n\n return (`\n \n ${head(state, classNames)}\n ${state.isUseNativeMode ? '' : body(state, classNames)}\n \n `);\n};\n\nexport default root;","import root from '../Components/root';\nimport ClassNames from '../Config/ClassNames';\nimport createDomElementFromHtml from '../Shared/Util/createDomElementFromHtml';\nimport State from '../State/State';\n\nimport Dom from './Dom';\nimport domDiff from './domDiff';\nimport domPatch from './domPatch';\n\nclass Renderer {\n public classNames: ClassNames;\n public dom: Dom;\n\n constructor(classNames: ClassNames) {\n this.dom = new Dom();\n this.classNames = classNames;\n }\n\n public render(state: State, selectElement: HTMLSelectElement): Dom {\n const html = root(state, this.classNames);\n const rootElement = createDomElementFromHtml(html) as HTMLDivElement;\n\n this.dom = new Dom();\n this.dom.root = rootElement;\n\n this.dom.option.length = this.dom.group.length = 0;\n\n Renderer.queryDomRefs(this.dom);\n\n this.injectSelect(selectElement);\n\n return this.dom;\n }\n\n public update(state: State, key?: keyof State): void {\n const nextHtml = root(state, this.classNames);\n const nextRoot = createDomElementFromHtml(nextHtml) as HTMLDivElement;\n const diffCommand = domDiff(this.dom.root, nextRoot);\n\n domPatch(this.dom.root, diffCommand);\n\n if (key === 'selectedIndex') {\n this.syncSelectWithValue(state.value);\n }\n }\n\n public destroy(): void {\n this.dom.select.classList.remove(this.classNames.select);\n\n try {\n this.dom.root.parentElement.replaceChild(this.dom.select, this.dom.root);\n } catch (err) { /**/ }\n }\n\n private injectSelect(selectElement: HTMLSelectElement): void {\n const parent = selectElement.parentElement;\n const tempSelect = this.dom.select;\n\n if (!parent) throw new Error('[EasyDropDown] The provided ``\n * element (for example, adding or removing an option).\n */\n\n public refresh: () => void;\n\n /**\n * Destroys the instance by removing all EasyDropDown-generated\n * elements from the DOM, and unbinding all event handlers.\n * The underlying select is returned to the root position.\n */\n\n public destroy: () => void;\n\n /**\n * An accessor property allowing writing to and reading\n * from the dropdown's value.\n */\n\n public value: string;\n\n constructor(implementation: Easydropdown) {\n this.open = implementation.open.bind(implementation);\n this.close = implementation.close.bind(implementation);\n this.refresh = implementation.refresh.bind(implementation);\n this.destroy = implementation.destroy.bind(implementation);\n\n Object.defineProperties(this, {\n value: {\n get: () => implementation.value,\n set: (nextValue: string) => implementation.value = nextValue\n }\n });\n }\n}\n\nexport default EasydropdownFacade;","class Timers {\n public pollChangeIntervalId: number;\n public pollMutationIntervalId: number;\n public searchTimeoutId: number;\n public keyingTimeoutId: number;\n\n public clear(): void {\n Object.keys(this).forEach(key => window.clearInterval(this[key]));\n }\n}\n\nexport default Timers;","import merge from 'helpful-merge';\n\nimport Config from '../Config/Config';\n\nimport BodyStatus from './Constants/BodyStatus';\nimport ScrollStatus from './Constants/ScrollStatus';\nimport Group from './Group';\nimport Option from './Option';\n\nclass State {\n public groups: Group[] = [];\n public focusedIndex: number = -1;\n public selectedIndex: number = -1;\n public maxVisibleItemsOverride: number = -1;\n public maxBodyHeight: number = -1;\n public name: string = '';\n public placeholder: string = '';\n public scrollStatus: ScrollStatus = ScrollStatus.AT_TOP;\n public bodyStatus: BodyStatus = BodyStatus.CLOSED;\n public isDisabled: boolean = false;\n public isRequired: boolean = false;\n public isInvalid: boolean = false;\n public isFocused: boolean = false;\n public isUseNativeMode: boolean = false;\n public isScrollable: boolean = false;\n public isSearching: boolean = false;\n public isKeying: boolean = false;\n\n private config: Config;\n\n constructor(stateRaw: any = null, config = new Config()) {\n this.config = config;\n\n if (!stateRaw) return;\n\n merge(this, stateRaw);\n\n this.groups = this.groups.map((groupRaw) => {\n const group = merge(new Group(), groupRaw);\n\n group.options = group.options.map(optionRaw => merge(new Option(), optionRaw));\n\n return group;\n });\n }\n\n public get totalGroups(): number {\n return this.groups.length;\n }\n\n public get lastGroup(): Group {\n return this.groups[this.groups.length - 1];\n }\n\n public get totalOptions(): number {\n return this.groups.reduce((total: number, group: Group) => total + group.totalOptions, 0);\n }\n\n public get selectedOption(): Option {\n return this.getOptionFromIndex(this.selectedIndex);\n }\n\n public get focusedOption(): Option {\n return this.getOptionFromIndex(this.focusedIndex);\n }\n\n public get value(): string {\n return this.selectedOption ? this.selectedOption.value : '';\n }\n\n public get humanReadableValue(): string {\n if (\n (!this.hasValue && this.hasPlaceholder) ||\n (\n this.config.behavior.showPlaceholderWhenOpen &&\n this.hasPlaceholder &&\n this.isOpen\n )\n ) {\n return this.placeholder;\n }\n\n return this.label;\n }\n\n public get label(): string {\n return this.selectedOption ? this.selectedOption.label : '';\n }\n\n public get hasPlaceholder(): boolean {\n return this.placeholder !== '';\n }\n\n public get isPlaceholderShown(): boolean {\n return this.hasPlaceholder && !this.hasValue;\n }\n\n public get hasValue(): boolean {\n return this.value !== '';\n }\n\n public get isGrouped(): boolean {\n return Boolean(this.groups.find(group => group.hasLabel));\n }\n\n public get isOpen(): boolean {\n return this.bodyStatus !== BodyStatus.CLOSED;\n }\n\n public get isClosed(): boolean {\n return this.bodyStatus === BodyStatus.CLOSED;\n }\n\n public get isOpenAbove(): boolean {\n return this.bodyStatus === BodyStatus.OPEN_ABOVE;\n }\n\n public get isOpenBelow(): boolean {\n return this.bodyStatus === BodyStatus.OPEN_BELOW;\n }\n\n public get isAtTop(): boolean {\n return this.scrollStatus === ScrollStatus.AT_TOP;\n }\n\n public get isAtBottom(): boolean {\n return this.scrollStatus === ScrollStatus.AT_BOTTOM;\n }\n\n public getOptionFromIndex(index: number): Option {\n let groupStartIndex = 0;\n\n for (const group of this.groups) {\n if (index < 0 ) break;\n\n const groupEndIndex = Math.max(0, groupStartIndex + group.totalOptions - 1);\n\n if (index <= groupEndIndex) {\n const option = group.options[index - groupStartIndex];\n\n return option;\n }\n\n groupStartIndex += group.totalOptions;\n }\n\n return null;\n }\n\n public getOptionIndexFromValue(value: string): number {\n let index: number = -1;\n\n for (const group of this.groups) {\n for (const option of group.options) {\n index++;\n\n if (option.value === value) {\n return index;\n }\n }\n }\n\n return -1;\n }\n}\n\nexport default State;","function isMobilePlatform(userAgent: string): boolean {\n const isIos = /(ipad|iphone|ipod)/gi.test(userAgent);\n const isAndroid = /android/gi.test(userAgent);\n const isOperaMini = /opera mini/gi.test(userAgent);\n const isWindowsPhone = /windows phone/gi.test(userAgent);\n\n if (isIos || isAndroid || isOperaMini || isWindowsPhone) {\n return true;\n }\n\n return false;\n}\n\nexport default isMobilePlatform;","import merge from 'helpful-merge';\n\nimport Config from '../Config/Config';\nimport isMobilePlatform from '../Shared/Util/isMobilePlatform';\n\nimport Group from './Group';\nimport Option from './Option';\nimport State from './State';\n\nclass StateMapper {\n public static mapFromSelect(selectElement: HTMLSelectElement, config: Config): State {\n const state = new State(null, config);\n\n let isWithinGroup = false;\n\n state.name = selectElement.name;\n state.isDisabled = selectElement.disabled;\n state.isRequired = selectElement.required;\n\n state.isUseNativeMode = (\n config.behavior.useNativeUiOnMobile &&\n isMobilePlatform(window.navigator.userAgent)\n );\n\n for (let i = 0, child: Element; (child = selectElement.children[i]); i++) {\n if (i === 0 && child.getAttribute('data-placeholder') !== null) {\n state.placeholder = child.textContent;\n (child as HTMLOptionElement).value = '';\n\n continue;\n }\n\n if (child instanceof HTMLOptionElement) {\n if (isWithinGroup === false) {\n state.groups.push(StateMapper.mapGroup());\n\n isWithinGroup = true;\n }\n\n state.lastGroup.options.push(StateMapper.mapOption(child));\n\n if (child.selected) state.selectedIndex = state.totalOptions - 1;\n } else if (child instanceof HTMLOptGroupElement) {\n isWithinGroup = true;\n\n state.groups.push(StateMapper.mapGroup(child));\n\n for (let j = 0, groupChild: Element; (groupChild = child.children[j]); j++) {\n state.lastGroup.options.push(\n StateMapper.mapOption(\n groupChild as HTMLOptionElement,\n child as HTMLOptGroupElement\n )\n );\n\n if ((groupChild as HTMLOptionElement).selected) state.selectedIndex = state.totalOptions - 1;\n }\n\n isWithinGroup = false;\n } else {\n throw new TypeError(\n `[EasyDropDown] Invalid child tag \"${child.tagName}\" found in provided \\`\n \n`);\n\nexport default head;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport Option from '../State/Option';\nimport State from '../State/State';\n\nfunction option(optionState: Option, state: State, classNames: ClassNames): string {\n const isSelected = state.selectedOption === optionState;\n\n const className = composeClassName([\n classNames.option,\n [isSelected, classNames.optionSelected],\n [optionState === state.focusedOption, classNames.optionFocused],\n [optionState.isDisabled, classNames.optionDisabled]\n ]);\n\n return (`\n \n ${optionState.label}\n \n `);\n}\n\nexport default option;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport Group from '../State/Group';\nimport State from '../State/State';\n\nimport option from './option';\n\nconst group = (groupState: Group, state: State, classNames: ClassNames) => {\n const className = composeClassName([\n classNames.group,\n [groupState.isDisabled, classNames.groupDisabled],\n [groupState.hasLabel, classNames.groupHasLabel]\n ]);\n\n return (`\n
\n ${groupState.hasLabel ?\n `
${groupState.label}
` : ''\n }\n ${groupState.options.map(optionState => option(optionState, state, classNames)).join('')}\n
\n `);\n};\n\nexport default group;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport State from '../State/State';\n\nimport group from './group';\n\nfunction body(state: State, classNames: ClassNames): string {\n const className = composeClassName([\n classNames.body,\n [state.isAtTop, classNames.bodyAtTop],\n [state.isAtBottom, classNames.bodyAtBottom],\n [state.isScrollable, classNames.bodyScrollable]\n ]);\n\n const styleAttr = state.isOpen ?\n `style=\"max-height: ${state.maxBodyHeight}px;\"` : '';\n\n return (`\n \n
\n ${state.groups.map(groupState => group(groupState, state, classNames)).join('')}\n
\n
\n
\n \n `);\n}\n\nexport default body;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport State from '../State/State';\n\nimport body from './body';\nimport head from './head';\n\nconst root = (state: State, classNames: ClassNames) => {\n const className = composeClassName([\n classNames.root,\n [state.isDisabled, classNames.rootDisabled],\n [state.isInvalid, classNames.rootInvalid],\n [state.isOpen, classNames.rootOpen],\n [state.isFocused, classNames.rootFocused],\n [state.hasValue, classNames.rootHasValue],\n [state.isOpenAbove, classNames.rootOpenAbove],\n [state.isOpenBelow, classNames.rootOpenBelow],\n [state.isUseNativeMode, classNames.rootNative]\n ]);\n\n return (`\n \n ${head(state, classNames)}\n ${state.isUseNativeMode ? '' : body(state, classNames)}\n \n `);\n};\n\nexport default root;","import root from '../Components/root';\nimport ClassNames from '../Config/ClassNames';\nimport createDomElementFromHtml from '../Shared/Util/createDomElementFromHtml';\nimport State from '../State/State';\n\nimport Dom from './Dom';\nimport domDiff from './domDiff';\nimport domPatch from './domPatch';\n\nclass Renderer {\n public classNames: ClassNames;\n public dom: Dom;\n\n constructor(classNames: ClassNames) {\n this.dom = new Dom();\n this.classNames = classNames;\n }\n\n public render(state: State, selectElement: HTMLSelectElement): Dom {\n const html = root(state, this.classNames);\n const rootElement = createDomElementFromHtml(html) as HTMLDivElement;\n\n this.dom = new Dom();\n this.dom.root = rootElement;\n\n this.dom.option.length = this.dom.group.length = 0;\n\n Renderer.queryDomRefs(this.dom);\n\n this.injectSelect(selectElement);\n\n return this.dom;\n }\n\n public update(state: State, key?: keyof State): void {\n const nextHtml = root(state, this.classNames);\n const nextRoot = createDomElementFromHtml(nextHtml) as HTMLDivElement;\n const diffCommand = domDiff(this.dom.root, nextRoot);\n\n domPatch(this.dom.root, diffCommand);\n\n if (key === 'selectedIndex') {\n this.syncSelectWithValue(state.value);\n }\n }\n\n public destroy(): void {\n this.dom.select.classList.remove(this.classNames.select);\n\n try {\n this.dom.root.parentElement.replaceChild(this.dom.select, this.dom.root);\n } catch (err) { /**/ }\n }\n\n private injectSelect(selectElement: HTMLSelectElement): void {\n const parent = selectElement.parentElement;\n const tempSelect = this.dom.select;\n\n if (!parent) throw new Error('[EasyDropDown] The provided `\n \n'}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2);t.default=function(e,t,n){var r=t.selectedOption===e;return'\n \n "+e.label+"\n \n "}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(39);t.default=function(e,t,n){return'\n
\n '+(e.hasLabel?'
'+e.label+"
":"")+"\n "+e.options.map(function(e){return r.default(e,t,n)}).join("")+"\n
\n "}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(40);t.default=function(e,t){var n=o.default([t.body,[e.isAtTop,t.bodyAtTop],[e.isAtBottom,t.bodyAtBottom],[e.isScrollable,t.bodyScrollable]]),i=e.isOpen?'style="max-height: '+e.maxBodyHeight+'px;"':"";return'\n \n
\n "+e.groups.map(function(n){return r.default(n,e,t)}).join("")+"\n
\n
\n \n \n '}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(41),i=n(38);t.default=function(e,t){return'\n \n "+i.default(e,t)+"\n "+(e.isUseNativeMode?"":r.default(e,t))+"\n \n "}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(42),r=n(35),i=n(34),a=n(33),u=n(31),s=function(){function e(e){this.dom=new i.default,this.classNames=e}return e.prototype.render=function(t,n){var a=o.default(t,this.classNames),u=r.default(a);return this.dom=new i.default,this.dom.root=u,this.dom.option.length=this.dom.group.length=0,e.queryDomRefs(this.dom),this.injectSelect(n),this.dom},e.prototype.update=function(e,t){var n=o.default(e,this.classNames),i=r.default(n),s=a.default(this.dom.root,i);u.default(this.dom.root,s),"selectedIndex"===t&&this.syncSelectWithValue(e.value)},e.prototype.destroy=function(){this.dom.select.classList.remove(this.classNames.select);try{this.dom.root.parentElement.replaceChild(this.dom.select,this.dom.root)}catch(e){}},e.prototype.injectSelect=function(e){var t=e.parentElement,n=this.dom.select;if(!t)throw new Error("[EasyDropDown] The provided `\n \n'}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2);t.default=function(e,t,n){var r=t.selectedOption===e;return'\n \n "+e.label+"\n \n "}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(39);t.default=function(e,t,n){return'\n
\n '+(e.hasLabel?'
'+e.label+"
":"")+"\n "+e.options.map(function(e){return r.default(e,t,n)}).join("")+"\n
\n "}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(40);t.default=function(e,t){var n=o.default([t.body,[e.isAtTop,t.bodyAtTop],[e.isAtBottom,t.bodyAtBottom],[e.isScrollable,t.bodyScrollable]]),i=e.isOpen?'style="max-height: '+e.maxBodyHeight+'px;"':"";return'\n \n
\n "+e.groups.map(function(n){return r.default(n,e,t)}).join("")+"\n
\n
\n \n \n '}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(41),i=n(38);t.default=function(e,t){return'\n \n "+i.default(e,t)+"\n "+(e.isUseNativeMode?"":r.default(e,t))+"\n \n "}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var o=n(42),r=n(35),i=n(34),a=n(33),u=n(31),s=function(){function e(e){this.dom=new i.default,this.classNames=e}return e.prototype.render=function(t,n){var a=o.default(t,this.classNames),u=r.default(a);return this.dom=new i.default,this.dom.root=u,this.dom.option.length=this.dom.group.length=0,e.queryDomRefs(this.dom),this.injectSelect(n),this.dom},e.prototype.update=function(e,t){var n=o.default(e,this.classNames),i=r.default(n),s=a.default(this.dom.root,i);u.default(this.dom.root,s),"selectedIndex"===t&&this.syncSelectWithValue(e.value)},e.prototype.destroy=function(){this.dom.select.classList.remove(this.classNames.select);try{this.dom.root.parentElement.replaceChild(this.dom.select,this.dom.root)}catch(e){}},e.prototype.injectSelect=function(e){var t=e.parentElement,n=this.dom.select;if(!t)throw new Error("[EasyDropDown] The provided ``\n * element (for example, adding or removing an option).\n */\n\n public refresh: () => void;\n\n /**\n * Destroys the instance by removing all EasyDropDown-generated\n * elements from the DOM, and unbinding all event handlers.\n * The underlying select is returned to the root position.\n */\n\n public destroy: () => void;\n\n /**\n * An accessor property allowing writing to and reading\n * from the dropdown's value.\n */\n\n public value: string;\n\n constructor(implementation: Easydropdown) {\n this.open = implementation.open.bind(implementation);\n this.close = implementation.close.bind(implementation);\n this.refresh = implementation.refresh.bind(implementation);\n this.destroy = implementation.destroy.bind(implementation);\n\n Object.defineProperties(this, {\n value: {\n get: () => implementation.value,\n set: (nextValue: string) => implementation.value = nextValue\n }\n });\n }\n}\n\nexport default EasydropdownFacade;","class Timers {\n public pollChangeIntervalId: number;\n public pollMutationIntervalId: number;\n public searchTimeoutId: number;\n public keyingTimeoutId: number;\n\n public clear(): void {\n Object.keys(this).forEach(key => window.clearInterval(this[key]));\n }\n}\n\nexport default Timers;","import merge from 'helpful-merge';\n\nimport Config from '../Config/Config';\n\nimport BodyStatus from './Constants/BodyStatus';\nimport ScrollStatus from './Constants/ScrollStatus';\nimport Group from './Group';\nimport Option from './Option';\n\nclass State {\n public groups: Group[] = [];\n public focusedIndex: number = -1;\n public selectedIndex: number = -1;\n public maxVisibleItemsOverride: number = -1;\n public maxBodyHeight: number = -1;\n public name: string = '';\n public placeholder: string = '';\n public scrollStatus: ScrollStatus = ScrollStatus.AT_TOP;\n public bodyStatus: BodyStatus = BodyStatus.CLOSED;\n public isDisabled: boolean = false;\n public isRequired: boolean = false;\n public isInvalid: boolean = false;\n public isFocused: boolean = false;\n public isUseNativeMode: boolean = false;\n public isScrollable: boolean = false;\n public isSearching: boolean = false;\n public isKeying: boolean = false;\n\n private config: Config;\n\n constructor(stateRaw: any = null, config = new Config()) {\n this.config = config;\n\n if (!stateRaw) return;\n\n merge(this, stateRaw);\n\n this.groups = this.groups.map((groupRaw) => {\n const group = merge(new Group(), groupRaw);\n\n group.options = group.options.map(optionRaw => merge(new Option(), optionRaw));\n\n return group;\n });\n }\n\n public get totalGroups(): number {\n return this.groups.length;\n }\n\n public get lastGroup(): Group {\n return this.groups[this.groups.length - 1];\n }\n\n public get totalOptions(): number {\n return this.groups.reduce((total: number, group: Group) => total + group.totalOptions, 0);\n }\n\n public get selectedOption(): Option {\n return this.getOptionFromIndex(this.selectedIndex);\n }\n\n public get focusedOption(): Option {\n return this.getOptionFromIndex(this.focusedIndex);\n }\n\n public get value(): string {\n return this.selectedOption ? this.selectedOption.value : '';\n }\n\n public get humanReadableValue(): string {\n if (\n (!this.hasValue && this.hasPlaceholder) ||\n (\n this.config.behavior.showPlaceholderWhenOpen &&\n this.hasPlaceholder &&\n this.isOpen\n )\n ) {\n return this.placeholder;\n }\n\n return this.label;\n }\n\n public get label(): string {\n return this.selectedOption ? this.selectedOption.label : '';\n }\n\n public get hasPlaceholder(): boolean {\n return this.placeholder !== '';\n }\n\n public get isPlaceholderShown(): boolean {\n return this.hasPlaceholder && !this.hasValue;\n }\n\n public get hasValue(): boolean {\n return this.value !== '';\n }\n\n public get isGrouped(): boolean {\n return Boolean(this.groups.find(group => group.hasLabel));\n }\n\n public get isOpen(): boolean {\n return this.bodyStatus !== BodyStatus.CLOSED;\n }\n\n public get isClosed(): boolean {\n return this.bodyStatus === BodyStatus.CLOSED;\n }\n\n public get isOpenAbove(): boolean {\n return this.bodyStatus === BodyStatus.OPEN_ABOVE;\n }\n\n public get isOpenBelow(): boolean {\n return this.bodyStatus === BodyStatus.OPEN_BELOW;\n }\n\n public get isAtTop(): boolean {\n return this.scrollStatus === ScrollStatus.AT_TOP;\n }\n\n public get isAtBottom(): boolean {\n return this.scrollStatus === ScrollStatus.AT_BOTTOM;\n }\n\n public getOptionFromIndex(index: number): Option {\n let groupStartIndex = 0;\n\n for (const group of this.groups) {\n if (index < 0 ) break;\n\n const groupEndIndex = Math.max(0, groupStartIndex + group.totalOptions - 1);\n\n if (index <= groupEndIndex) {\n const option = group.options[index - groupStartIndex];\n\n return option;\n }\n\n groupStartIndex += group.totalOptions;\n }\n\n return null;\n }\n\n public getOptionIndexFromValue(value: string): number {\n let index: number = -1;\n\n for (const group of this.groups) {\n for (const option of group.options) {\n index++;\n\n if (option.value === value) {\n return index;\n }\n }\n }\n\n return -1;\n }\n}\n\nexport default State;","function isMobilePlatform(userAgent: string): boolean {\n const isIos = /(ipad|iphone|ipod)/gi.test(userAgent);\n const isAndroid = /android/gi.test(userAgent);\n const isOperaMini = /opera mini/gi.test(userAgent);\n const isWindowsPhone = /windows phone/gi.test(userAgent);\n\n if (isIos || isAndroid || isOperaMini || isWindowsPhone) {\n return true;\n }\n\n return false;\n}\n\nexport default isMobilePlatform;","import merge from 'helpful-merge';\n\nimport Config from '../Config/Config';\nimport isMobilePlatform from '../Shared/Util/isMobilePlatform';\n\nimport Group from './Group';\nimport Option from './Option';\nimport State from './State';\n\nclass StateMapper {\n public static mapFromSelect(selectElement: HTMLSelectElement, config: Config): State {\n const state = new State(null, config);\n\n let isWithinGroup = false;\n\n state.name = selectElement.name;\n state.isDisabled = selectElement.disabled;\n state.isRequired = selectElement.required;\n\n state.isUseNativeMode = (\n config.behavior.useNativeUiOnMobile &&\n isMobilePlatform(window.navigator.userAgent)\n );\n\n for (let i = 0, child: Element; (child = selectElement.children[i]); i++) {\n if (i === 0 && child.getAttribute('data-placeholder') !== null) {\n state.placeholder = child.textContent;\n (child as HTMLOptionElement).value = '';\n\n continue;\n }\n\n if (child instanceof HTMLOptionElement) {\n if (isWithinGroup === false) {\n state.groups.push(StateMapper.mapGroup());\n\n isWithinGroup = true;\n }\n\n state.lastGroup.options.push(StateMapper.mapOption(child));\n\n if (child.selected) state.selectedIndex = state.totalOptions - 1;\n } else if (child instanceof HTMLOptGroupElement) {\n isWithinGroup = true;\n\n state.groups.push(StateMapper.mapGroup(child));\n\n for (let j = 0, groupChild: Element; (groupChild = child.children[j]); j++) {\n state.lastGroup.options.push(\n StateMapper.mapOption(\n groupChild as HTMLOptionElement,\n child as HTMLOptGroupElement\n )\n );\n\n if ((groupChild as HTMLOptionElement).selected) state.selectedIndex = state.totalOptions - 1;\n }\n\n isWithinGroup = false;\n } else {\n throw new TypeError(\n `[EasyDropDown] Invalid child tag \"${child.tagName}\" found in provided \\`\n \n`);\n\nexport default head;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport Option from '../State/Option';\nimport State from '../State/State';\n\nfunction option(optionState: Option, state: State, classNames: ClassNames): string {\n const isSelected = state.selectedOption === optionState;\n\n const className = composeClassName([\n classNames.option,\n [isSelected, classNames.optionSelected],\n [optionState === state.focusedOption, classNames.optionFocused],\n [optionState.isDisabled, classNames.optionDisabled]\n ]);\n\n return (`\n \n ${optionState.label}\n \n `);\n}\n\nexport default option;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport Group from '../State/Group';\nimport State from '../State/State';\n\nimport option from './option';\n\nconst group = (groupState: Group, state: State, classNames: ClassNames) => {\n const className = composeClassName([\n classNames.group,\n [groupState.isDisabled, classNames.groupDisabled],\n [groupState.hasLabel, classNames.groupHasLabel]\n ]);\n\n return (`\n
\n ${groupState.hasLabel ?\n `
${groupState.label}
` : ''\n }\n ${groupState.options.map(optionState => option(optionState, state, classNames)).join('')}\n
\n `);\n};\n\nexport default group;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport State from '../State/State';\n\nimport group from './group';\n\nfunction body(state: State, classNames: ClassNames): string {\n const className = composeClassName([\n classNames.body,\n [state.isAtTop, classNames.bodyAtTop],\n [state.isAtBottom, classNames.bodyAtBottom],\n [state.isScrollable, classNames.bodyScrollable]\n ]);\n\n const styleAttr = state.isOpen ?\n `style=\"max-height: ${state.maxBodyHeight}px;\"` : '';\n\n return (`\n \n
\n ${state.groups.map(groupState => group(groupState, state, classNames)).join('')}\n
\n
\n
\n \n `);\n}\n\nexport default body;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport State from '../State/State';\n\nimport body from './body';\nimport head from './head';\n\nconst root = (state: State, classNames: ClassNames) => {\n const className = composeClassName([\n classNames.root,\n [state.isDisabled, classNames.rootDisabled],\n [state.isInvalid, classNames.rootInvalid],\n [state.isOpen, classNames.rootOpen],\n [state.isFocused, classNames.rootFocused],\n [state.hasValue, classNames.rootHasValue],\n [state.isOpenAbove, classNames.rootOpenAbove],\n [state.isOpenBelow, classNames.rootOpenBelow],\n [state.isUseNativeMode, classNames.rootNative]\n ]);\n\n return (`\n \n ${head(state, classNames)}\n ${state.isUseNativeMode ? '' : body(state, classNames)}\n \n `);\n};\n\nexport default root;","import root from '../Components/root';\nimport ClassNames from '../Config/ClassNames';\nimport createDomElementFromHtml from '../Shared/Util/createDomElementFromHtml';\nimport State from '../State/State';\n\nimport Dom from './Dom';\nimport domDiff from './domDiff';\nimport domPatch from './domPatch';\n\nclass Renderer {\n public classNames: ClassNames;\n public dom: Dom;\n\n constructor(classNames: ClassNames) {\n this.dom = new Dom();\n this.classNames = classNames;\n }\n\n public render(state: State, selectElement: HTMLSelectElement): Dom {\n const html = root(state, this.classNames);\n const rootElement = createDomElementFromHtml(html) as HTMLDivElement;\n\n this.dom = new Dom();\n this.dom.root = rootElement;\n\n this.dom.option.length = this.dom.group.length = 0;\n\n Renderer.queryDomRefs(this.dom);\n\n this.injectSelect(selectElement);\n\n return this.dom;\n }\n\n public update(state: State, key?: keyof State): void {\n const nextHtml = root(state, this.classNames);\n const nextRoot = createDomElementFromHtml(nextHtml) as HTMLDivElement;\n const diffCommand = domDiff(this.dom.root, nextRoot);\n\n domPatch(this.dom.root, diffCommand);\n\n if (key === 'selectedIndex') {\n this.syncSelectWithValue(state.value);\n }\n }\n\n public destroy(): void {\n this.dom.select.classList.remove(this.classNames.select);\n\n try {\n this.dom.root.parentElement.replaceChild(this.dom.select, this.dom.root);\n } catch (err) { /**/ }\n }\n\n private injectSelect(selectElement: HTMLSelectElement): void {\n const parent = selectElement.parentElement;\n const tempSelect = this.dom.select;\n\n if (!parent) throw new Error('[EasyDropDown] The provided ``\n * element (for example, adding or removing an option).\n */\n\n public refresh: () => void;\n\n /**\n * Destroys the instance by removing all EasyDropDown-generated\n * elements from the DOM, and unbinding all event handlers.\n * The underlying select is returned to the root position.\n */\n\n public destroy: () => void;\n\n /**\n * An accessor property allowing writing to and reading\n * from the dropdown's value.\n */\n\n public value: string;\n\n constructor(implementation: Easydropdown) {\n this.open = implementation.open.bind(implementation);\n this.close = implementation.close.bind(implementation);\n this.refresh = implementation.refresh.bind(implementation);\n this.destroy = implementation.destroy.bind(implementation);\n\n Object.defineProperties(this, {\n value: {\n get: () => implementation.value,\n set: (nextValue: string) => implementation.value = nextValue\n }\n });\n }\n}\n\nexport default EasydropdownFacade;","class Timers {\n public pollChangeIntervalId: number;\n public pollMutationIntervalId: number;\n public searchTimeoutId: number;\n public keyingTimeoutId: number;\n\n public clear(): void {\n Object.keys(this).forEach(key => window.clearInterval(this[key]));\n }\n}\n\nexport default Timers;","import merge from 'helpful-merge';\n\nimport Config from '../Config/Config';\n\nimport BodyStatus from './Constants/BodyStatus';\nimport ScrollStatus from './Constants/ScrollStatus';\nimport Group from './Group';\nimport Option from './Option';\n\nclass State {\n public groups: Group[] = [];\n public focusedIndex: number = -1;\n public selectedIndex: number = -1;\n public maxVisibleItemsOverride: number = -1;\n public maxBodyHeight: number = -1;\n public name: string = '';\n public placeholder: string = '';\n public scrollStatus: ScrollStatus = ScrollStatus.AT_TOP;\n public bodyStatus: BodyStatus = BodyStatus.CLOSED;\n public isDisabled: boolean = false;\n public isRequired: boolean = false;\n public isInvalid: boolean = false;\n public isFocused: boolean = false;\n public isUseNativeMode: boolean = false;\n public isScrollable: boolean = false;\n public isSearching: boolean = false;\n public isKeying: boolean = false;\n\n private config: Config;\n\n constructor(stateRaw: any = null, config = new Config()) {\n this.config = config;\n\n if (!stateRaw) return;\n\n merge(this, stateRaw);\n\n this.groups = this.groups.map((groupRaw) => {\n const group = merge(new Group(), groupRaw);\n\n group.options = group.options.map(optionRaw => merge(new Option(), optionRaw));\n\n return group;\n });\n }\n\n public get totalGroups(): number {\n return this.groups.length;\n }\n\n public get lastGroup(): Group {\n return this.groups[this.groups.length - 1];\n }\n\n public get totalOptions(): number {\n return this.groups.reduce((total: number, group: Group) => total + group.totalOptions, 0);\n }\n\n public get selectedOption(): Option {\n return this.getOptionFromIndex(this.selectedIndex);\n }\n\n public get focusedOption(): Option {\n return this.getOptionFromIndex(this.focusedIndex);\n }\n\n public get value(): string {\n return this.selectedOption ? this.selectedOption.value : '';\n }\n\n public get humanReadableValue(): string {\n if (\n (!this.hasValue && this.hasPlaceholder) ||\n (\n this.config.behavior.showPlaceholderWhenOpen &&\n this.hasPlaceholder &&\n this.isOpen\n )\n ) {\n return this.placeholder;\n }\n\n return this.label;\n }\n\n public get label(): string {\n return this.selectedOption ? this.selectedOption.label : '';\n }\n\n public get hasPlaceholder(): boolean {\n return this.placeholder !== '';\n }\n\n public get isPlaceholderShown(): boolean {\n return this.hasPlaceholder && !this.hasValue;\n }\n\n public get hasValue(): boolean {\n return this.value !== '';\n }\n\n public get isGrouped(): boolean {\n return Boolean(this.groups.find(group => group.hasLabel));\n }\n\n public get isOpen(): boolean {\n return this.bodyStatus !== BodyStatus.CLOSED;\n }\n\n public get isClosed(): boolean {\n return this.bodyStatus === BodyStatus.CLOSED;\n }\n\n public get isOpenAbove(): boolean {\n return this.bodyStatus === BodyStatus.OPEN_ABOVE;\n }\n\n public get isOpenBelow(): boolean {\n return this.bodyStatus === BodyStatus.OPEN_BELOW;\n }\n\n public get isAtTop(): boolean {\n return this.scrollStatus === ScrollStatus.AT_TOP;\n }\n\n public get isAtBottom(): boolean {\n return this.scrollStatus === ScrollStatus.AT_BOTTOM;\n }\n\n public getOptionFromIndex(index: number): Option {\n let groupStartIndex = 0;\n\n for (const group of this.groups) {\n if (index < 0 ) break;\n\n const groupEndIndex = Math.max(0, groupStartIndex + group.totalOptions - 1);\n\n if (index <= groupEndIndex) {\n const option = group.options[index - groupStartIndex];\n\n return option;\n }\n\n groupStartIndex += group.totalOptions;\n }\n\n return null;\n }\n\n public getOptionIndexFromValue(value: string): number {\n let index: number = -1;\n\n for (const group of this.groups) {\n for (const option of group.options) {\n index++;\n\n if (option.value === value) {\n return index;\n }\n }\n }\n\n return -1;\n }\n}\n\nexport default State;","function isMobilePlatform(userAgent: string): boolean {\n const isIos = /(ipad|iphone|ipod)/gi.test(userAgent);\n const isAndroid = /android/gi.test(userAgent);\n const isOperaMini = /opera mini/gi.test(userAgent);\n const isWindowsPhone = /windows phone/gi.test(userAgent);\n\n if (isIos || isAndroid || isOperaMini || isWindowsPhone) {\n return true;\n }\n\n return false;\n}\n\nexport default isMobilePlatform;","import merge from 'helpful-merge';\n\nimport Config from '../Config/Config';\nimport isMobilePlatform from '../Shared/Util/isMobilePlatform';\n\nimport Group from './Group';\nimport Option from './Option';\nimport State from './State';\n\nclass StateMapper {\n public static mapFromSelect(selectElement: HTMLSelectElement, config: Config): State {\n const state = new State(null, config);\n\n let isWithinGroup = false;\n\n state.name = selectElement.name;\n state.isDisabled = selectElement.disabled;\n state.isRequired = selectElement.required;\n\n state.isUseNativeMode = (\n config.behavior.useNativeUiOnMobile &&\n isMobilePlatform(window.navigator.userAgent)\n );\n\n for (let i = 0, child: Element; (child = selectElement.children[i]); i++) {\n if (i === 0 && child.getAttribute('data-placeholder') !== null) {\n state.placeholder = child.textContent;\n (child as HTMLOptionElement).value = '';\n\n continue;\n }\n\n if (child instanceof HTMLOptionElement) {\n if (isWithinGroup === false) {\n state.groups.push(StateMapper.mapGroup());\n\n isWithinGroup = true;\n }\n\n state.lastGroup.options.push(StateMapper.mapOption(child));\n\n if (child.selected) state.selectedIndex = state.totalOptions - 1;\n } else if (child instanceof HTMLOptGroupElement) {\n isWithinGroup = true;\n\n state.groups.push(StateMapper.mapGroup(child));\n\n for (let j = 0, groupChild: Element; (groupChild = child.children[j]); j++) {\n state.lastGroup.options.push(\n StateMapper.mapOption(\n groupChild as HTMLOptionElement,\n child as HTMLOptGroupElement\n )\n );\n\n if ((groupChild as HTMLOptionElement).selected) state.selectedIndex = state.totalOptions - 1;\n }\n\n isWithinGroup = false;\n } else {\n throw new TypeError(\n `[EasyDropDown] Invalid child tag \"${child.tagName}\" found in provided \\`\n \n`);\n\nexport default head;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport Option from '../State/Option';\nimport State from '../State/State';\n\nfunction option(optionState: Option, state: State, classNames: ClassNames): string {\n const isSelected = state.selectedOption === optionState;\n\n const className = composeClassName([\n classNames.option,\n [isSelected, classNames.optionSelected],\n [optionState === state.focusedOption, classNames.optionFocused],\n [optionState.isDisabled, classNames.optionDisabled]\n ]);\n\n return (`\n \n ${optionState.label}\n \n `);\n}\n\nexport default option;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport Group from '../State/Group';\nimport State from '../State/State';\n\nimport option from './option';\n\nconst group = (groupState: Group, state: State, classNames: ClassNames) => {\n const className = composeClassName([\n classNames.group,\n [groupState.isDisabled, classNames.groupDisabled],\n [groupState.hasLabel, classNames.groupHasLabel]\n ]);\n\n return (`\n
\n ${groupState.hasLabel ?\n `
${groupState.label}
` : ''\n }\n ${groupState.options.map(optionState => option(optionState, state, classNames)).join('')}\n
\n `);\n};\n\nexport default group;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport State from '../State/State';\n\nimport group from './group';\n\nfunction body(state: State, classNames: ClassNames): string {\n const className = composeClassName([\n classNames.body,\n [state.isAtTop, classNames.bodyAtTop],\n [state.isAtBottom, classNames.bodyAtBottom],\n [state.isScrollable, classNames.bodyScrollable]\n ]);\n\n const styleAttr = state.isOpen ?\n `style=\"max-height: ${state.maxBodyHeight}px;\"` : '';\n\n return (`\n \n
\n ${state.groups.map(groupState => group(groupState, state, classNames)).join('')}\n
\n
\n
\n \n `);\n}\n\nexport default body;","import ClassNames from '../Config/ClassNames';\nimport composeClassName from '../Shared/Util/composeClassName';\nimport State from '../State/State';\n\nimport body from './body';\nimport head from './head';\n\nconst root = (state: State, classNames: ClassNames) => {\n const className = composeClassName([\n classNames.root,\n [state.isDisabled, classNames.rootDisabled],\n [state.isInvalid, classNames.rootInvalid],\n [state.isOpen, classNames.rootOpen],\n [state.isFocused, classNames.rootFocused],\n [state.hasValue, classNames.rootHasValue],\n [state.isOpenAbove, classNames.rootOpenAbove],\n [state.isOpenBelow, classNames.rootOpenBelow],\n [state.isUseNativeMode, classNames.rootNative]\n ]);\n\n return (`\n \n ${head(state, classNames)}\n ${state.isUseNativeMode ? '' : body(state, classNames)}\n \n `);\n};\n\nexport default root;","import root from '../Components/root';\nimport ClassNames from '../Config/ClassNames';\nimport createDomElementFromHtml from '../Shared/Util/createDomElementFromHtml';\nimport State from '../State/State';\n\nimport Dom from './Dom';\nimport domDiff from './domDiff';\nimport domPatch from './domPatch';\n\nclass Renderer {\n public classNames: ClassNames;\n public dom: Dom;\n\n constructor(classNames: ClassNames) {\n this.dom = new Dom();\n this.classNames = classNames;\n }\n\n public render(state: State, selectElement: HTMLSelectElement): Dom {\n const html = root(state, this.classNames);\n const rootElement = createDomElementFromHtml(html) as HTMLDivElement;\n\n this.dom = new Dom();\n this.dom.root = rootElement;\n\n this.dom.option.length = this.dom.group.length = 0;\n\n Renderer.queryDomRefs(this.dom);\n\n this.injectSelect(selectElement);\n\n return this.dom;\n }\n\n public update(state: State, key?: keyof State): void {\n const nextHtml = root(state, this.classNames);\n const nextRoot = createDomElementFromHtml(nextHtml) as HTMLDivElement;\n const diffCommand = domDiff(this.dom.root, nextRoot);\n\n domPatch(this.dom.root, diffCommand);\n\n if (key === 'selectedIndex') {\n this.syncSelectWithValue(state.value);\n }\n }\n\n public destroy(): void {\n this.dom.select.classList.remove(this.classNames.select);\n\n try {\n this.dom.root.parentElement.replaceChild(this.dom.select, this.dom.root);\n } catch (err) { /**/ }\n }\n\n private injectSelect(selectElement: HTMLSelectElement): void {\n const parent = selectElement.parentElement;\n const tempSelect = this.dom.select;\n\n if (!parent) throw new Error('[EasyDropDown] The provided `