simp-select 1.0.16 → 1.0.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (18) hide show
  1. package/README.md +56 -52
  2. package/dist/demo/index.html +8 -7
  3. package/dist/simpleSelect.d.ts +9 -0
  4. package/dist/simpleSelect.js +1 -1
  5. package/dist/simpleSelectItem.d.ts +3 -0
  6. package/dist/simpleSelectItemDOM.d.ts +1 -0
  7. package/dist/style.css +1 -1
  8. package/dist/types/item.types.d.ts +6 -0
  9. package/dist/types/simpleSelect.types.d.ts +1 -0
  10. package/package.json +1 -1
  11. package/src/const/simpleSelection.const.ts +2 -0
  12. package/src/demo/index.html +27 -6
  13. package/src/simpleSelect.ts +13 -0
  14. package/src/simpleSelectItem.ts +27 -3
  15. package/src/simpleSelectItemDOM.ts +18 -5
  16. package/src/style.css +4 -1
  17. package/src/types/item.types.ts +7 -0
  18. package/src/types/simpleSelect.types.ts +2 -0
package/README.md CHANGED
@@ -17,8 +17,8 @@ npm install simp-select --save
17
17
  ```
18
18
  Or you can load it via a script tag as follows:
19
19
  ```
20
- <script src="https://unpkg.com/simp-select@1.0.16/dist/simpleSelect.js" />
21
- <script src="https://unpkg.com/simp-select@1.0.16/dist/polyfill.js" /> - for IE 11
20
+ <script src="https://unpkg.com/simp-select@1.0.17/dist/simpleSelect.js" />
21
+ <script src="https://unpkg.com/simp-select@1.0.17/dist/polyfill.js" /> - for IE 11
22
22
  Or get last version
23
23
  <script src="https://unpkg.com/simp-select" />
24
24
  ```
@@ -39,56 +39,60 @@ the variable `SimpSelect` attached to `window` or `this` depending on what envir
39
39
  ## API
40
40
  #### `new ScrollToVertical(selector, <options>)`
41
41
 
42
- | Property | Value |
43
- |----------------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
44
- | **selector**(required) | string(css selector), HTMLSelectElement, HTMLSelectElement(Array, HTMLSelectElement) |
45
- | **OPTIONS:** | |
46
- | **countShowSelected**:number* | <p>default: **3** </p> Show count selected options. If more then this count, showed template: Selected: 4<p>Or - `data-simple-count-shows-selected="3"` - in select</p> |
47
- | **isSearch**:boolean* | <p>default: **false** </p> Show input for filter items <p>Or - `data-simple-select-search="true"` - in select</p> |
48
- | **isSearchInDropdown**:boolean* | <p>default: **false** </p> Show search input inside dropdown <p>Or - `data-simple-select-search-dropdown="true"` - in select</p> |
49
- | **isConfirmInMulti**:boolean* | <p>default: **false** </p> Show buttons `OK` and `Cansel`. Only Multiselect <p>Or `data-simple-is-confirm="true" - in select`</> |
50
- | **isConfirmInMultiOkClickOutside**:boolean | <p>default: **false** </p> Click outside like click by button `OK`. Only if `isConfirmInMulti=true` |
51
- | **nativeOnDevice**:string[] | <p>default: **'Android', 'BlackBerry', 'iPhone', 'iPad', 'iPod', 'Opera Mini', 'IEMobile', 'Silk'** </p> The system default select list is rendered on the matched device(Check useragent ). |
52
- | **debounceTime**:number* | <p>default: **0** </p> The change event will not be triggered immediately, but after a specified amount of time. <p>Or `data-simple-debounce-time="1000"` in select</p> |
53
- | **floatWidth**:number* | <p>default: **767** </p> Minimum screen width of device below which the dropdown is rendered like popup. <p>Or `data-simple-float-width="500" in select`</p> |
54
- | **sepChars**:string | <p>default: **,** </p> Separator for selected element. Show |
55
- | **selectAll**:boolean* | <p>default: **false**</p> Show button - `Select all` <p>Or `data-simple-select-all="true"` in select</p> |
56
- | **selectAllAfterClose**:boolean | <p>default: **false**</p> Close dropdown after click for `select all` |
57
- | **resetAll**:boolean* | <p>default: **false**</p> Show button - `Reset all` <p>Or `data-simple-reset-all="true"` in select</p> |
58
- | **resetAllAfterClose**:boolean | <p>default: **true**</p> Close dropdown after click for `Reset all` |
59
- | **isCloneClass**:boolean | <p>default: **true**</p> Clone class from native select to wrapper created select |
60
- | **isRemoveTop**:boolean* | <p>default: **false**</p> Do not create top element (Title, arrow, search ) (default: false) <p>Or `data-simple-remove-top="true"` in select</p> |
61
- | **isUp**:boolean* | <p>default: **false**</p> Dropdown rendering the direction in which to open the dropdown (default: false) <p>Or `data-simple-up="true"` in select</p> |
62
- | **isAlwaysOpen**:boolean* | <p>default: **false**</p> Dropdown always open (default: false) <p>Or `data-simple-always-open="true"` in select</p> |
63
- | **isAlwaysOpenShowDisabledTabindex**:boolean* | <p>default: **false**</p> Set tabindex (tabindex="0") for disabled element (In Always open list) |
64
- | **isOnlyPlaceholder**:boolean* | <p>default: **false**</p> Show only placeholder. Don't show selected options (default: false) <p>Or `data-simple-is-only-placeholder="true"` in select</p> |
65
- | **detectNative**:function | <p>default: **none**</p> Return `true` if need rendering native select |
66
- | **changeBodyLi**:function | <p>default: **none**</p> Custom <li>(body) item renderer |
67
- | **locale**:{key: string} | <p>default: **simpleSelectLocale** **</p> Object of locales. ** |
68
- | ***Options only DOM elements*** | |
69
- | **data-simple-placeholder="text": Select** | Replace default placeholder (locale.title) |
70
- | **data-simple-item-html-before="<div>before</div>: Select** | Add HTML before content (for item Li) |
71
- | **data-simple-item-html-after="<div>after</div>": Select** | Add HTML after content (for item Li) |
72
- | **data-simple-add-classes="class1 class2": Select** | Add classes for wrapper SimpSelect |
73
- | **data-simple-html-before="<span>before</span>": option** | Add HTML before content (for item Li) |
74
- | **data-simple-html-after="<span>after</span>": option** | Add HTML after content (for item Li) |
75
- | **data-simple-show-checkbox: Select** | Show checkbox in item (Li) (for single select) |
76
- | ***Callbacks*** | |
77
- | **callbackInitialization: (item:SimpleSelectItem) => void** | Before initialization |
78
- | **callbackInitialized**:(item:SimpleSelectItem) => void; | After initialization |
79
- | **callbackOpen**: (item:SimpleSelectItem) => void; | Open dropdown |
80
- | **callbackClose**:Open dropdown | Close dropdown |
81
- | **callbackDestroyInit**: (item:SimpleSelectItem) => void; | Before destroy SimpSelect |
82
- | **callbackDestroy**: (item:SimpleSelectItem) => void; | After destroy SimpSelect |
83
- | **callbackChangeSelect** :(e: Event, item:SimpleSelectItem) => void; | Change SimpSelect (change options) |
84
- | ***Methods*** | |
85
- | **reload**:select(DomElement).SimpSelect.reload() | Reload SimpSelect. |
86
- | **update**:select(DomElement).SimpSelect.update() | Update list (ul in dropdown) |
87
- | **detach**:select(DomElement).SimpSelect.detach() | Detach SimpSelect. |
88
- | ***const simpleSelect = new SimpleSelect('select')*** | Instance of the SimpleSelect plugin object |
89
- | **getSelectById('ID')**:simpleSelect.getSelectById('ID') | Get item SimpSelect for ID (data-simple-select-init="ID" - dem element select) |
90
- | **getSelectFirst()**:simpleSelect.getSelectFirst() | Get first item SimpSelect |
91
- | **getSelects()**:simpleSelect.getSelects() | Get list SimpSelect |
42
+ | Property | Value |
43
+ |----------------------------------------------------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
44
+ | **selector**(required) | string(css selector), HTMLSelectElement, HTMLSelectElement(Array, HTMLSelectElement) |
45
+ | **OPTIONS:** | |
46
+ | **countShowSelected**:number* | <p>default: **3** </p> Show count selected options. If more then this count, showed template: Selected: 4<p>Or - `data-simple-count-shows-selected="3"` - in select</p> |
47
+ | **isSearch**:boolean* | <p>default: **false** </p> Show input for filter items <p>Or - `data-simple-select-search="true"` - in select</p> |
48
+ | **isSearchInDropdown**:boolean* | <p>default: **false** </p> Show search input inside dropdown <p>Or - `data-simple-select-search-dropdown="true"` - in select</p> |
49
+ | **isConfirmInMulti**:boolean* | <p>default: **false** </p> Show buttons `OK` and `Cansel`. Only Multiselect <p>Or `data-simple-is-confirm="true" - in select`</> |
50
+ | **isConfirmInMultiOkClickOutside**:boolean | <p>default: **false** </p> Click outside like click by button `OK`. Only if `isConfirmInMulti=true` |
51
+ | **nativeOnDevice**:string[] | <p>default: **'Android', 'BlackBerry', 'iPhone', 'iPad', 'iPod', 'Opera Mini', 'IEMobile', 'Silk'** </p> The system default select list is rendered on the matched device(Check useragent ). |
52
+ | **debounceTime**:number* | <p>default: **0** </p> The change event will not be triggered immediately, but after a specified amount of time. <p>Or `data-simple-debounce-time="1000"` in select</p> |
53
+ | **floatWidth**:number* | <p>default: **767** </p> Minimum screen width of device below which the dropdown is rendered like popup. <p>Or `data-simple-float-width="500" in select. Or data-simple-float-none="true" - cancel for select`</p> |
54
+ | **sepChars**:string | <p>default: **,** </p> Separator for selected element. Show |
55
+ | **selectAll**:boolean* | <p>default: **false**</p> Show button - `Select all` <p>Or `data-simple-select-all="true"` in select</p> |
56
+ | **selectAllAfterClose**:boolean | <p>default: **false**</p> Close dropdown after click for `select all` |
57
+ | **resetAll**:boolean* | <p>default: **false**</p> Show button - `Reset all` <p>Or `data-simple-reset-all="true"` in select</p> |
58
+ | **resetAllAfterClose**:boolean | <p>default: **true**</p> Close dropdown after click for `Reset all` |
59
+ | **isCloneClass**:boolean | <p>default: **true**</p> Clone class from native select to wrapper created select |
60
+ | **isRemoveTop**:boolean* | <p>default: **false**</p> Do not create top element (Title, arrow, search ) (default: false) <p>Or `data-simple-remove-top="true"` in select</p> |
61
+ | **isUp**:boolean* | <p>default: **false**</p> Dropdown rendering the direction in which to open the dropdown (default: false) <p>Or `data-simple-up="true"` in select</p> |
62
+ | **isAlwaysOpen**:boolean* | <p>default: **false**</p> Dropdown always open (default: false) <p>Or `data-simple-always-open="true"` in select</p> |
63
+ | **isAlwaysOpenShowDisabledTabindex**:boolean* | <p>default: **false**</p> Set tabindex (tabindex="0") for disabled element (In Always open list) |
64
+ | **isOnlyPlaceholder**:boolean* | <p>default: **false**</p> Show only placeholder. Don't show selected options (default: false) <p>Or `data-simple-is-only-placeholder="true"` in select</p> |
65
+ | **detectNative**:function | <p>default: **none**</p> Return `true` if need rendering native select |
66
+ | **changeBodyLi**:function | <p>default: **none**</p> Custom <li>(body) item renderer |
67
+ | **locale**:{key: string} | <p>default: **simpleSelectLocale** **</p> Object of locales. ** |
68
+ | **historyMaxSize**: number | <p>default: **0** **</p> Maximum number of saved changes. ** |
69
+ | ***Options only DOM elements*** | |
70
+ | **data-simple-placeholder="text": Select** | Replace default placeholder (locale.title) |
71
+ | **data-simple-item-html-before="<div>before</div>: Select** | Add HTML before content (for item Li) |
72
+ | **data-simple-item-html-after="<div>after</div>": Select** | Add HTML after content (for item Li) |
73
+ | **data-simple-add-classes="class1 class2": Select** | Add classes for wrapper SimpSelect |
74
+ | **data-simple-html-before="<span>before</span>": option** | Add HTML before content (for item Li) |
75
+ | **data-simple-html-after="<span>after</span>": option** | Add HTML after content (for item Li) |
76
+ | **data-simple-show-checkbox: Select** | Show checkbox in item (Li) (for single select) |
77
+ | ***Callbacks*** | |
78
+ | **callbackInitialization: (item:SimpleSelectItem) => void** | Before initialization |
79
+ | **callbackInitialized**:(item:SimpleSelectItem) => void; | After initialization |
80
+ | **callbackOpen**: (item:SimpleSelectItem) => void; | Open dropdown |
81
+ | **callbackClose**:Open dropdown | Close dropdown |
82
+ | **callbackDestroyInit**: (item:SimpleSelectItem) => void; | Before destroy SimpSelect |
83
+ | **callbackDestroy**: (item:SimpleSelectItem) => void; | After destroy SimpSelect |
84
+ | **callbackChangeSelect** :(e: Event, item:SimpleSelectItem) => void; | Change SimpSelect (change options) |
85
+ | ***Methods*** | |
86
+ | **reload**:select(DomElement).SimpSelect.reload() | Reload SimpSelect. |
87
+ | **update**:select(DomElement).SimpSelect.update() | Update list (ul in dropdown) |
88
+ | **detach**:select(DomElement).SimpSelect.detach() | Detach SimpSelect. |
89
+ | **getHistory**:select(DomElement).SimpSelect.getHistory() | Get history. |
90
+ | **getHistoryLast**:select(DomElement).SimpSelect.getHistoryLast() | Get history - last element. |
91
+ | **getHistoryFirst**:select(DomElement).SimpSelect.getHistoryFirst() | Get history - first element. |
92
+ | ***const simpleSelect = new SimpleSelect('select')*** | Instance of the SimpleSelect plugin object |
93
+ | **getSelectById('ID')**:simpleSelect.getSelectById('ID') | Get item SimpSelect for ID (data-simple-select-init="ID" - dem element select) |
94
+ | **getSelectFirst()**:simpleSelect.getSelectFirst() | Get first item SimpSelect |
95
+ | **getSelects()**:simpleSelect.getSelects() | Get list SimpSelect |
92
96
 
93
97
  **Data attributes in DOM element(select) more important than initialization options.*
94
98
  ```
package/dist/demo/index.html CHANGED
@@ -22,7 +22,7 @@
22
22
  .item {
23
23
  display: block;
24
24
  width: 250px;
25
- }</style><body><div id="app"></div><div class="items"><div class="item"><select id="select_first" data-simple-placeholder="Custom title" data-simple-is-only-placeholder="true" multiple="multiple"><option value="a1">a 1</option><option value="a2">a 2</option><option value="a3">a 3</option><option value="a4">a 4</option><option value="a5">a 5</option></select></div><div class="item"><select multiple="multiple" data-simple-placeholder="custom placeholder" data-simple-is-confirm="true" data-simple-count-shows-selected="3"><option value="a1" data-simple-html-before="<span>|before| </span>" data-simple-html-after="<span> |after|</div>">b 1</option><option value="a22" disabled="disabled">b 2 dis</option><option value="a3">b 3</option><option value="a4">b 4</option><option value="a5">b 5</option></select></div><div class="item"><select id="select_second" data-simple-is-confirm="false" data-simple-reset-all="false" data-simple-select-all="true" data-simple-item-html-before="<span>before</span>" multiple="multiple" data-simple-debounce-time="1000"><optgroup label="Группа 1"><option value="1.1">multiple Опция 1.1</option></optgroup><optgroup label="Группа 2"><option value="2.1">multiple Опция 2.1</option><option value="2.2">multiple Опция 2.2</option></optgroup><optgroup label="Группа 3" disabled="disabled"><option value="3.1">multiple Опция 3.1</option><option value="3.2">multiple Опция 3.2</option><option value="3.3">multiple Опция 3.3</option></optgroup></select></div><div class="item"><select data-simple-select-search-dropdown="true" data-simple-show-checkbox="true" class="color_red" data-simple-add-classes="class1" data-simple-select-search="false"><optgroup label="Группа 1"><option value="1">Опция 1.1</option></optgroup><optgroup label="Группа 2"><option value="1">Опция 2.1</option><option value="1">Опция 2.2</option></optgroup><optgroup label="Группа 3" disabled="disabled"><option value="1">Опция 3.1</option><option value="1">Опция 3.2</option><option value="1">Опция 3.3</option></optgroup></select></div><div class="item"><select multiple="multiple" data-simple-select-search="true" data-simple-placeholder="multi and search"><option value="1">multi 1.1</option><option value="1">multi 2.1</option><option value="1">multi 2.2</option><option value="1">multi 3.1</option><option value="1">multi 3.2</option><option value="1">multi 3.3</option></select></div><div class="item"><select data-simple-add-classes="class1 class2" data-simple-item-html-before="<div>before</div>" data-simple-item-html-after="<div>after</div>" data-simple-select-search-dropdown="true" data-simple-up="true"><option>Опция 5.1</option><option>Опция 5.2</option></select></div></div><div><p>Group checkbox</p><div class="items"><label class="item"><select data-simple-select-search-dropdown="true" data-simple-show-checkbox="true" data-simple-always-open="true" class="color_red" data-simple-add-classes="class1" data-simple-select-search="false"><optgroup label="Группа 1"><option value="1">Опция 6.1</option></optgroup><optgroup label="Группа 2"><option value="1">Опция 6.1</option><option value="1">Опция 6.2</option></optgroup><optgroup label="Группа 3" disabled="disabled"><option value="1">Опция 6.1</option><option value="1">Опция 6.2</option><option value="1">Опция 6.3</option></optgroup></select></label> <label class="item"><select data-simple-select-search="true" data-simple-always-open="true" multiple="multiple"><optgroup label="Группа 1"><option value="1">Опция 7.1</option></optgroup><optgroup label="Группа 2"><option value="1">Опция 7.1</option><option value="1">Опция 7.2</option></optgroup><optgroup label="Группа 3" disabled="disabled"><option value="1">Опция 7.1</option><option value="1">Опция 7.2</option><option value="1">Опция 7.3</option></optgroup></select></label> <label class="item"><select data-simple-select-search-dropdown="true" data-simple-always-open="true" data-simple-remove-top="true" multiple="multiple"><optgroup label="Группа 1"><option value="1">Опция 8.1</option></optgroup><optgroup label="Группа 2"><option value="1" disabled="disabled">Опция 8.1</option><option value="1">Опция 8.2</option></optgroup><optgroup label="Группа 3" disabled="disabled"><option value="1">Опция 8.1</option><option value="1">Опция 8.2</option><option value="1">Опция 8.3</option></optgroup></select></label></div></div><script>const sel = new SimpleSelect('select', {
25
+ }</style><body><div id="app"></div><div class="items"><div class="item"><select multiple="multiple" data-simple-placeholder="custom width float" data-simple-float-width="1000"><option value="custom-1">custom float 1</option><option value="custom-2">custom float 2</option></select></div><div class="item"><select multiple="multiple" data-simple-placeholder="none float" data-simple-float-none="true"><option value="custom-none-1">none float 1</option><option value="custom-none-2">none float 2</option></select></div><div class="item"><select id="select_first" data-simple-placeholder="Custom title" data-simple-is-only-placeholder="true" multiple="multiple"><option value="a1">a 1</option><option value="a2">a 2</option><option value="a3">a 3</option><option value="a4">a 4</option><option value="a5">a 5</option></select></div><div class="item"><select multiple="multiple" data-simple-placeholder="custom placeholder" data-simple-is-confirm="true" data-simple-count-shows-selected="3"><option value="a1" data-simple-html-before="<span>|before| </span>" data-simple-html-after="<span> |after|</div>">b 1</option><option value="a22" disabled="disabled">b 2 dis</option><option value="a3">b 3</option><option value="a4">b 4</option><option value="a5">b 5</option></select></div><div class="item"><select id="select_second" data-simple-is-confirm="false" data-simple-reset-all="false" data-simple-select-all="true" data-simple-item-html-before="<span>before</span>" multiple="multiple" data-simple-debounce-time="1000"><optgroup label="Группа 1"><option value="1.1">multiple Опция 1.1</option></optgroup><optgroup label="Группа 2"><option value="2.1">multiple Опция 2.1</option><option value="2.2">multiple Опция 2.2</option></optgroup><optgroup label="Группа 3" disabled="disabled"><option value="3.1">multiple Опция 3.1</option><option value="3.2">multiple Опция 3.2</option><option value="3.3">multiple Опция 3.3</option></optgroup></select></div><div class="item"><select data-simple-select-search-dropdown="true" data-simple-show-checkbox="true" class="color_red" data-simple-add-classes="class1" data-simple-select-search="false"><optgroup label="Группа 1"><option value="1">Опция 1.1</option></optgroup><optgroup label="Группа 2"><option value="1">Опция 2.1</option><option value="1">Опция 2.2</option></optgroup><optgroup label="Группа 3" disabled="disabled"><option value="1">Опция 3.1</option><option value="1">Опция 3.2</option><option value="1">Опция 3.3</option></optgroup></select></div><div class="item"><select multiple="multiple" data-simple-select-search="true" data-simple-placeholder="multi and search"><option value="1">multi 1.1</option><option value="1">multi 2.1</option><option value="1">multi 2.2</option><option value="1">multi 3.1</option><option value="1">multi 3.2</option><option value="1">multi 3.3</option></select></div><div class="item"><select data-simple-add-classes="class1 class2" data-simple-item-html-before="<div>before</div>" data-simple-item-html-after="<div>after</div>" data-simple-select-search-dropdown="true" data-simple-up="true"><option>Опция 5.1</option><option>Опция 5.2</option></select></div></div><div><p>Group checkbox</p><div class="items"><label class="item"><select data-simple-select-search-dropdown="true" data-simple-show-checkbox="true" data-simple-always-open="true" class="color_red" data-simple-add-classes="class1" data-simple-select-search="false"><optgroup label="Группа 1"><option value="1">Опция 6.1</option></optgroup><optgroup label="Группа 2"><option value="1">Опция 6.1</option><option value="1">Опция 6.2</option></optgroup><optgroup label="Группа 3" disabled="disabled"><option value="1">Опция 6.1</option><option value="1">Опция 6.2</option><option value="1">Опция 6.3</option></optgroup></select></label> <label class="item"><select data-simple-select-search="true" data-simple-always-open="true" multiple="multiple"><optgroup label="Группа 1"><option value="1">Опция 7.1</option></optgroup><optgroup label="Группа 2"><option value="1">Опция 7.1</option><option value="1">Опция 7.2</option></optgroup><optgroup label="Группа 3" disabled="disabled"><option value="1">Опция 7.1</option><option value="1">Опция 7.2</option><option value="1">Опция 7.3</option></optgroup></select></label> <label class="item"><select data-simple-select-search-dropdown="true" data-simple-always-open="true" data-simple-remove-top="true" multiple="multiple"><optgroup label="Группа 1"><option value="1">Опция 8.1</option></optgroup><optgroup label="Группа 2"><option value="1" disabled="disabled">Опция 8.1</option><option value="1">Опция 8.2</option></optgroup><optgroup label="Группа 3" disabled="disabled"><option value="1">Опция 8.1</option><option value="1">Опция 8.2</option><option value="1">Опция 8.3</option></optgroup></select></label></div></div><script>const sel = new SimpleSelect('select', {
26
26
  // callbackOpen: (item) => {
27
27
  // console.log('open', item);
28
28
  // },
@@ -35,12 +35,13 @@
35
35
  // // detectNative: () => {
36
36
  // // return false;
37
37
  // // },
38
- // callbackChangeSelect: (e, that) => {
39
- // console.group();
40
- // console.log(e);
41
- // console.log(that);
42
- // console.groupEnd();
43
- // },
38
+ historyMaxSize: 2,
39
+ callbackChangeSelect: (e, that) => {
40
+ console.group();
41
+ // console.log(e);
42
+ console.log(that.history);
43
+ console.groupEnd();
44
+ },
44
45
 
45
46
  // isUp: true,
46
47
  // sepChars: ',',
package/dist/simpleSelect.d.ts CHANGED
@@ -14,6 +14,9 @@ export default class SimpleSelect {
14
14
  detectMobile(): void;
15
15
  private init;
16
16
  createMethods(select: SimpleSelectItem): {
17
+ getHistory: () => import("./types/item.types").IHistoryItem[];
18
+ getHistoryLast: () => import("./types/item.types").IHistoryItem | null;
19
+ getHistoryFirst: () => import("./types/item.types").IHistoryItem | null;
17
20
  getNativeSelect: () => HTMLSelectElement;
18
21
  reload(): void;
19
22
  update(): void;
@@ -26,12 +29,18 @@ export default class SimpleSelect {
26
29
  rebuild(selectsItems: SimpleSelectItem): void;
27
30
  getSelects(): SimpleSelectItem[];
28
31
  getSelectFirst(): {
32
+ getHistory: () => import("./types/item.types").IHistoryItem[];
33
+ getHistoryLast: () => import("./types/item.types").IHistoryItem | null;
34
+ getHistoryFirst: () => import("./types/item.types").IHistoryItem | null;
29
35
  getNativeSelect: () => HTMLSelectElement;
30
36
  reload(): void;
31
37
  update(): void;
32
38
  detach(): void;
33
39
  };
34
40
  getSelectById(id: string): {
41
+ getHistory: () => import("./types/item.types").IHistoryItem[];
42
+ getHistoryLast: () => import("./types/item.types").IHistoryItem | null;
43
+ getHistoryFirst: () => import("./types/item.types").IHistoryItem | null;
35
44
  getNativeSelect: () => HTMLSelectElement;
36
45
  reload(): void;
37
46
  update(): void;
package/dist/simpleSelect.js CHANGED
@@ -1 +1 @@
1
- !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("SimpleSelect",[],t):"object"==typeof exports?exports.SimpleSelect=t():e.SimpleSelect=t()}("undefined"==typeof self?this:self,(function(){return function(){"use strict";var e={737:function(e,t){Object.defineProperty(t,"__esModule",{value:!0}),t.initClass=t.nameMark=t.nameSelect=t.simpleSelectionOptions=t.simpleSelectLocale=void 0,t.simpleSelectLocale={noSearch:"No matches for",searchText:"Search",title:"Select",selected:"Selected:",all:"all",ok:"Ok",cansel:"Cansel",selectAll:"Select all",resetAll:"Reset all"},t.simpleSelectionOptions={isSearch:!1,searchTypeInput:"search",isSearchInDropdown:!1,countShowSelected:3,isOnlyPlaceholder:!1,isRemoveTop:!1,isConfirmInMulti:!1,isConfirmInMultiOkClickOutside:!1,nativeOnDevice:["Android","BlackBerry","iPhone","iPad","iPod","Opera Mini","IEMobile","Silk"],locale:t.simpleSelectLocale,sepChars:",",isUp:!1,isAlwaysOpen:!1,isAlwaysOpenShowDisabledTabindex:!1,floatWidth:767,isCloneClass:!0,selectAll:!1,selectAllAfterClose:!0,resetAll:!1,resetAllAfterClose:!0},t.nameSelect="SimpSelect";t.nameMark="".concat("simple-select-","init"),t.initClass="SimpleSel"},874:function(e,t,i){function s(e){return s="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},s(e)}function n(e,t){for(var i=0;i<t.length;i++){var s=t[i];s.enumerable=s.enumerable||!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(e,u(s.key),s)}}function l(e,t){return l=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},l(e,t)}function o(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var i,n=c(e);if(t){var l=c(this).constructor;i=Reflect.construct(n,arguments,l)}else i=n.apply(this,arguments);return function(e,t){if(t&&("object"===s(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return a(e)}(this,i)}}function a(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function r(){return r="undefined"!=typeof Reflect&&Reflect.get?Reflect.get.bind():function(e,t,i){var s=function(e,t){for(;!Object.prototype.hasOwnProperty.call(e,t)&&null!==(e=c(e)););return e}(e,t);if(s){var n=Object.getOwnPropertyDescriptor(s,t);return n.get?n.get.call(arguments.length<3?e:i):n.value}},r.apply(this,arguments)}function c(e){return c=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)},c(e)}function h(e,t,i){return(t=u(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function u(e){var t=function(e,t){if("object"!==s(e)||null===e)return e;var i=e[Symbol.toPrimitive];if(void 0!==i){var n=i.call(e,t||"default");if("object"!==s(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===s(t)?t:String(t)}Object.defineProperty(t,"__esModule",{value:!0}),t.SimpleSelectItem=void 0;var p=i(679),d=function(e){!function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&l(e,t)}(d,e);var t,i,s,u=o(d);function d(e,t,i){var s,n;if(function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,d),h(a(n=u.call(this,e,t,i)),"closeOutsideHandler",void 0),h(a(n),"closeEscHandler",void 0),h(a(n),"changeListener",void 0),h(a(n),"searchHandler",void 0),h(a(n),"handleResize",void 0),h(a(n),"mql",null),h(a(n),"countOpen",0),h(a(n),"multiDebounceTime",0),h(a(n),"timeoutDebounceId",null),!e)throw Error("Select is required");return n.init(),r((s=a(n),c(d.prototype)),"initDom",s).call(s),n.initAfterDom(),n}return t=d,i=[{key:"init",value:function(){var e=this;this.changeListener=this.changeListenerInit.bind(this),this.$select.addEventListener("change",this.changeListener),this.searchHandler=this.searchHandlerInit.bind(this),this.closeOutsideHandler=this.closeOutsideHandlerInit.bind(this),this.closeEscHandler=this.closeEscHandlerInit.bind(this),this.handleResize=this.handleResizeInit.bind(this),this.options.callbackInitialization&&this.options.callbackInitialization(this),!this.isNative&&this.options.floatWidth&&(this.mql=window.matchMedia("screen and (max-width: ".concat(this.options.floatWidth,"px)")),this.mql&&(this.mql.onchange=this.handleResize,this.handleResizeInit(this.mql))),this.state.subscribe("isOpen",(function(t){e.toggleOpenHandler(),!t&&e.options.isConfirmInMulti&&e.createList(),t||e.elemInputSearch&&(e.elemInputSearch.value="",e.state.setState("filterStr",""))})),this.isNative||this.options.isAlwaysOpen||(this.elemTopBody.onclick=this.clickToggleOpen.bind(this),this.elemTopBody.onkeyup=this.clickToggleOpen.bind(this))}},{key:"handleResizeInit",value:function(e){e&&(e.matches?this.state.setState("isFloat",!0):this.state.setState("isFloat",!1))}},{key:"initAfterDom",value:function(){var e=this;this.confirmOk&&(this.confirmOk.onclick=this.confirmOkHandler.bind(this)),this.confirmNo&&(this.confirmNo.onclick=this.confirmNoHandler.bind(this)),this.options.callbackInitialized&&this.options.callbackInitialized(this),this.isMulti&&!this.options.isConfirmInMulti&&((0,p.toCamelCase)("simple-debounce-time")in this.$select.dataset?this.multiDebounceTime=Number(this.$select.dataset[(0,p.toCamelCase)("simple-debounce-time")]):(this.options.debounceTime||0===this.options.debounceTime)&&(this.multiDebounceTime=this.options.debounceTime)),this.multiDebounceTime&&(this.multiDebounceChange=this.debounce(this.multiDebounceChange.bind(this),this.multiDebounceTime)),this.elemSelectAll&&(this.elemSelectAll.onclick=this.selectAllHandler.bind(this)),this.elemResetAll&&(this.elemResetAll.onclick=this.resetAllHandler.bind(this)),this.elemDropDownClose&&(this.elemDropDownClose.onclick=this.closeHandler.bind(this)),this.elemListBody&&this.elemListBody.addEventListener("keyup",(function(t){if("Enter"===t.key){var i=t.target;if(i&&(0,p.toCamelCase)("sel-opt-item")in i.dataset){t.preventDefault(),t.stopPropagation(),e.changeClickItem(i);var s=i.dataset[(0,p.toCamelCase)("sel-position")],n=e.elemListBody.querySelector('[data-sel-position="'.concat(s,'"]'));n&&n.focus()}}}))}},{key:"debounce",value:function(e,t){var i=this;return function(){for(var s=arguments.length,n=new Array(s),l=0;l<s;l++)n[l]=arguments[l];i.timeoutDebounceId&&clearTimeout(i.timeoutDebounceId),i.timeoutDebounceId=setTimeout((function(){e.apply(void 0,n),i.timeoutDebounceId=null}),t)}}},{key:"confirmOkHandler",value:function(e){e.preventDefault(),this.confirmOkBuild()}},{key:"confirmOkBuild",value:function(){var e=this.$select.options;this.elemListBody&&(this.elemListBody.querySelectorAll("[data-sel-position]").forEach((function(t){var i=parseInt(t.dataset[(0,p.toCamelCase)("sel-position")],10);if(i||0===i){var s=e[i];s&&!s.disabled&&(s.selected="true"===t.dataset[(0,p.toCamelCase)("sel-opt-checked")])}})),this.state.setState("isOpen",!1),this.triggerInit())}},{key:"confirmNoHandler",value:function(e){e.preventDefault(),this.state.setState("isOpen",!1)}},{key:"closeHandler",value:function(e){e.preventDefault(),this.state.setState("isOpen",!1)}},{key:"selectAllHandler",value:function(e){e.preventDefault(),Array.from(this.$select.options).forEach((function(e){e.disabled||(e.selected=!0)})),this.createList(),this.options.selectAllAfterClose&&this.state.setState("isOpen",!1),this.triggerInit()}},{key:"resetAllHandler",value:function(e){e.preventDefault(),Array.from(this.$select.options).forEach((function(e){e.disabled||(e.selected=!1)})),this.createList(),this.options.selectAllAfterClose&&this.state.setState("isOpen",!1),this.triggerInit()}},{key:"triggerSetup",value:function(e){if(0===e.button){var t=e.target.closest("li");t&&this.changeClickItem(t)}}},{key:"changeClickItemDom",value:function(e){"true"===e.dataset[(0,p.toCamelCase)("sel-opt-checked")]?(e.dataset[(0,p.toCamelCase)("sel-opt-checked")]="false",e.classList.remove("SimpleSel__list_item--checked")):(e.dataset[(0,p.toCamelCase)("sel-opt-checked")]="true",e.classList.add("SimpleSel__list_item--checked"))}},{key:"changeClickItem",value:function(e){if(e){var t=Number(e.dataset[(0,p.toCamelCase)("sel-position")])||0,i=this.$select.options[t];i&&!i.disabled&&(this.isMulti?this.options.isConfirmInMulti||this.isFloatWidth?this.changeClickItemDom(e):(i.selected=!i.selected,this.changeClickItemDom(e),this.createList(),this.multiDebounceChange()):(i.selected=!0,this.createList(),this.state.setState("isOpen",!1),this.triggerInit()))}}},{key:"multiDebounceChange",value:function(){this.triggerInit()}},{key:"triggerInit",value:function(){(0,p.triggerInputEvent)(this.$select)}},{key:"clickToggleOpen",value:function(e){e.preventDefault(),this.isDisabled||("click"!==e.type?e instanceof KeyboardEvent&&"Enter"===e.key&&this.state.setState("isOpen",!this.state.getState("isOpen")):this.state.setState("isOpen",!this.state.getState("isOpen")))}},{key:"closeOutsideHandlerInit",value:function(e){var t=e.target;t&&(this.elemWrap.contains(t)||(this.options.isConfirmInMulti&&this.options.isConfirmInMultiOkClickOutside&&this.confirmOkBuild(),this.state.setState("isOpen",!1)))}},{key:"closeEscHandlerInit",value:function(e){"Escape"===e.code&&(e.preventDefault(),e.stopPropagation(),this.state.setState("isOpen",!1)),"Tab"===e.code&&(e.preventDefault(),e.stopPropagation(),this.elemWrap.contains(e.target)||this.state.setState("isOpen",!1)),"ArrowUp"!==e.key&&"ArrowDown"!==e.key||(e.preventDefault(),e.stopPropagation(),this.keyBoardChangeChecked("ArrowDown"===e.key))}},{key:"keyBoardChangeChecked",value:function(e){var t=this.elemListBody.querySelectorAll('[data-sel-position]:not([data-sel-opt-disabled="true"])');if(t.length){var i,s=0;t.forEach((function(e,t){document.activeElement===e&&(s=t,i=e),e.removeAttribute("tabindex")})),(i=i?e?t[s+1]||t[0]:t[s-1]||t[t.length-1]:e?t[0]:t[t.length-1]).tabIndex=0,i.focus()}}},{key:"searchHandlerInit",value:function(e){var t=e.target;if(t){var i=t.value;this.state.setState("filterStr",i)}}},{key:"toggleOpenHandler",value:function(){var e=this;this.state.getState("isOpen")?(this.elemWrap.classList.add("SimpleSel--open"),document.addEventListener("click",this.closeOutsideHandler),document.addEventListener("keyup",this.closeEscHandler),this.elemInputSearch&&setTimeout((function(){e.elemInputSearch.focus()}),50),this.options.callbackOpen&&this.options.callbackOpen(this),this.countOpen++,this.elemDropDown&&setTimeout((function(){e.elemDropDown.scrollTop=0}),10)):(this.state.setState("filterList",""),this.elemWrap.classList.remove("SimpleSel--open"),document.removeEventListener("click",this.closeOutsideHandler),document.removeEventListener("keyup",this.closeEscHandler),this.timeoutDebounceId&&(clearTimeout(this.timeoutDebounceId),this.triggerInit()),this.options.callbackClose&&this.countOpen>0&&this.options.callbackClose(this))}},{key:"changeListenerInit",value:function(e){this.options.callbackChangeSelect&&this.options.callbackChangeSelect(e,this),this.createList(!0)}},{key:"getSelect",value:function(){return this.$select}},{key:"handlerChangeChecked",value:function(){this.elemListBody&&(this.elemListBody.onmouseup=this.triggerSetup.bind(this))}},{key:"createList",value:function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=[],i=this.$select.querySelectorAll("optgroup");if(i&&i.length?i.forEach((function(e,i){t.push((0,p.getCreateListItem)(e,(i+1).toString(),!0))})):t.push((0,p.getCreateListItem)(this.$select,"1",!1)),e){var s=this.state.getState("items");(0,p.compareObj)(s,t)||this.state.setState("items",t)}else this.state.setState("items",t)}},{key:"inputSearchHandler",value:function(){this.elemInputSearch&&this.elemInputSearch.addEventListener("input",this.searchHandler)}},{key:"detachItem",value:function(){this.options.callbackDestroyInit&&this.options.callbackDestroyInit(this);var e=this.elemWrap.parentNode;this.$select.removeEventListener("change",this.changeListener),this.elemInputSearch&&this.elemInputSearch.removeEventListener("input",this.searchHandler),this.confirmOk&&(this.confirmOk.onclick=null),this.confirmNo&&(this.confirmNo.onclick=null),e.replaceChild(this.$select,this.elemWrap),this.$select.classList.remove(this.classSelectInit),this.elemTopBody&&(this.elemTopBody.onclick=null,this.elemTopBody.onkeyup=null),this.elemListBody&&(this.elemListBody.onmouseup=null),this.elemSelectAll&&(this.elemSelectAll.onclick=null),this.elemResetAll&&(this.elemResetAll.onclick=null),this.options.callbackDestroy&&this.options.callbackDestroy(this),this.elemDropDownClose&&(this.elemDropDownClose.onclick=null),this.mql&&(this.mql.onchange=null,this.mql=null)}}],i&&n(t.prototype,i),s&&n(t,s),Object.defineProperty(t,"prototype",{writable:!1}),d}(i(844).SimpleSelectItemDOM);t.SimpleSelectItem=d},844:function(e,t,i){function s(e){return s="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},s(e)}function n(e){return function(e){if(Array.isArray(e))return l(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(!e)return;if("string"==typeof e)return l(e,t);var i=Object.prototype.toString.call(e).slice(8,-1);"Object"===i&&e.constructor&&(i=e.constructor.name);if("Map"===i||"Set"===i)return Array.from(e);if("Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i))return l(e,t)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function l(e,t){(null==t||t>e.length)&&(t=e.length);for(var i=0,s=new Array(t);i<t;i++)s[i]=e[i];return s}function o(e,t){for(var i=0;i<t.length;i++){var s=t[i];s.enumerable=s.enumerable||!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(e,r(s.key),s)}}function a(e,t,i){return(t=r(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function r(e){var t=function(e,t){if("object"!==s(e)||null===e)return e;var i=e[Symbol.toPrimitive];if(void 0!==i){var n=i.call(e,t||"default");if("object"!==s(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===s(t)?t:String(t)}Object.defineProperty(t,"__esModule",{value:!0}),t.SimpleSelectItemDOM=void 0;var c=i(679),h=i(972),u=i(737),p=function(){function e(t,i,s){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),a(this,"options",void 0),a(this,"$select",void 0),a(this,"id",void 0),a(this,"titlePlaceholder",void 0),a(this,"isDisabled",!1),a(this,"isMulti",void 0),a(this,"state",(0,h.store)({items:[],isOpen:!1,filterStr:"",isFloat:!1})),a(this,"classSelectInit",(0,c.getClass)("select_init")),a(this,"isNative",void 0),a(this,"elemWrap",document.createElement("div")),a(this,"elemTop",document.createElement("div")),a(this,"elemTopBody",document.createElement("div")),a(this,"elemDropDownWrap",null),a(this,"elemDropDown",null),a(this,"elemDropDownClose",null),a(this,"elemListBody",null),a(this,"elemInputSearch",null),a(this,"elemTitle",void 0),a(this,"confirmOk",null),a(this,"confirmNo",null),a(this,"elemControl",null),a(this,"elemSelectAll",null),a(this,"elemResetAll",null),a(this,"cloneClasses",""),a(this,"isShowCheckbox",!1),a(this,"bodyLiHTMLBeforeFromSelect",null),a(this,"bodyLiHTMLAfterFromSelect",null),a(this,"isFloatWidth",!1),a(this,"bodyOpenClass","".concat(u.initClass,"--body_open"));var n=s.id,l=s.isNative;this.$select=t,this.isMulti=t.multiple,this.id=n,this.isNative=l,this.options=(0,c.cloneObj)(i),this.options.isCloneClass&&(this.cloneClasses=this.$select.className),i.callbackInitialization&&(this.options.callbackInitialization=i.callbackInitialization),i.callbackInitialized&&(this.options.callbackInitialized=i.callbackInitialized),i.callbackOpen&&(this.options.callbackOpen=i.callbackOpen),i.callbackClose&&(this.options.callbackClose=i.callbackClose),i.callbackDestroyInit&&(this.options.callbackDestroyInit=i.callbackDestroyInit),i.callbackDestroy&&(this.options.callbackDestroy=i.callbackDestroy),i.callbackChangeSelect&&(this.options.callbackChangeSelect=i.callbackChangeSelect),i.changeBodyLi&&(this.options.changeBodyLi=i.changeBodyLi),this.isMulti&&this.$select.hasAttribute("data-simple-is-confirm")&&(this.options.isConfirmInMulti=(0,c.ifTrueDataAttr)(this.$select.getAttribute("data-simple-is-confirm"))),this.optionOverride(),this.isDisabled=this.$select.disabled}var t,i,s;return t=e,i=[{key:"optionOverride",value:function(){var e=(0,c.toCamelCase)("simple-placeholder");if(this.$select.dataset[e]?this.titlePlaceholder=this.$select.dataset[e]||"":this.titlePlaceholder=this.options.locale.title,this.$select.hasAttribute("data-simple-reset-all")&&(this.options.resetAll=(0,c.ifTrueDataAttr)(this.$select.getAttribute("data-simple-reset-all"))),this.$select.hasAttribute("data-simple-select-all")){var t=this.$select.getAttribute("data-simple-select-all");this.options.selectAll=(0,c.ifTrueDataAttr)(t)}var i=this.$select.dataset[(0,c.toCamelCase)("simple-show-checkbox")];this.isMulti?this.isShowCheckbox=!(i&&!(0,c.ifTrueDataAttr)(i)):"true"===i&&(this.isShowCheckbox=!0);var s=this.$select.dataset[(0,c.toCamelCase)("simple-item-html-before")];s&&(this.bodyLiHTMLBeforeFromSelect=s);var n=this.$select.dataset[(0,c.toCamelCase)("simple-item-html-after")];n&&(this.bodyLiHTMLAfterFromSelect=n),this.$select.hasAttribute("data-simple-up")&&(this.options.isUp=(0,c.ifTrueDataAttr)(this.$select.getAttribute("data-simple-up"))),this.$select.hasAttribute("data-simple-is-only-placeholder")&&(this.options.isOnlyPlaceholder=(0,c.ifTrueDataAttr)(this.$select.getAttribute("data-simple-is-only-placeholder"))),this.$select.hasAttribute("data-simple-remove-top")&&(this.options.isRemoveTop=(0,c.ifTrueDataAttr)(this.$select.getAttribute("data-simple-remove-top"))),this.$select.hasAttribute("data-simple-always-open")&&(this.options.isAlwaysOpen=(0,c.ifTrueDataAttr)(this.$select.getAttribute("data-simple-always-open")),this.isNative=!1,this.isFloatWidth=!1,this.options.floatWidth=0)}},{key:"initDom",value:function(){var e=this;this.createList(!1),this.createHTML(),this.state.subscribe("filterStr",(function(t){e.createListHTML(!0)})),this.state.subscribe("items",(function(t){e.createListHTML(!0),e.createTitleHTML()})),this.state.subscribe("isOpen",(function(t){e.createListHTML(!1),e.createTitleHTML(),e.toggleTabIndex(t)})),this.state.subscribe("isFloat",(function(t){e.isFloatWidth=t;var i=(0,c.getClass)("float",!0);t?e.elemWrap.classList.add(i):e.elemWrap.classList.remove(i)}))}},{key:"toggleTabIndex",value:function(e){var t=e||this.options.isAlwaysOpen?0:-1;this.state.getState("isFloat")&&(e?document.body.classList.add(this.bodyOpenClass):document.body.classList.remove(this.bodyOpenClass)),this.elemInputSearch&&(this.elemInputSearch.tabIndex=t),this.elemResetAll&&(this.elemResetAll.tabIndex=t),this.elemSelectAll&&(this.elemSelectAll.tabIndex=t),this.confirmOk&&(this.confirmOk.tabIndex=t),this.confirmNo&&(this.confirmNo.tabIndex=t)}},{key:"updateHTML",value:function(){this.createList(!0)}},{key:"createHTML",value:function(){this.$select.classList.add(this.classSelectInit),this.$select.tabIndex=-1,this.elemTopBody.className=(0,c.getClass)("top_body"),this.elemTopBody.tabIndex=this.isDisabled?-1:0,this.createIcon(),this.options.isRemoveTop||this.elemTop.appendChild(this.elemTopBody);var e=u.initClass;this.options.isCloneClass&&(e+=" ".concat(this.cloneClasses)),this.$select.hasAttribute("data-simple-add-classes")&&(e+=" ".concat(this.$select.getAttribute("data-simple-add-classes"))),this.isDisabled&&(e+=" ".concat((0,c.getClass)("disabled",!0))),this.options.isAlwaysOpen&&(e+=" ".concat((0,c.getClass)("always_open",!0))),this.options.isUp&&(e+=" ".concat((0,c.getClass)("up",!0))),e+=" ".concat(this.isMulti?(0,c.getClass)("multi",!0):(0,c.getClass)("single",!0)),this.elemWrap.className=e,this.elemWrap.dataset.countAll=this.$select.options.length.toString(),this.elemTop.className=(0,c.getClass)("top");var t=this.$select.parentNode;t&&(t.replaceChild(this.elemWrap,this.$select),this.elemWrap.appendChild(this.$select)),this.elemWrap.appendChild(this.elemTop),this.isNative?(this.$select.classList.add((0,c.getClass)("native",!0,this.classSelectInit)),this.elemWrap.classList.add((0,c.getClass)("native",!0))):(this.createDropDown(),this.createControlHTML(),this.createInputHTML()),this.createTitleHTML()}},{key:"createControlHTML",value:function(){if(this.elemDropDown&&this.isMulti&&(this.options.selectAll||this.options.resetAll)){this.elemControl=document.createElement("div"),this.elemControl.classList.add((0,c.getClass)("controls")),this.elemDropDown.insertBefore(this.elemControl,this.elemDropDown.childNodes[0]);var e=(0,c.getClass)("control");this.options.selectAll&&(this.elemSelectAll=(0,c.createButton)(),this.elemSelectAll.className="".concat(e," ").concat((0,c.getClass)("select_all",!0,e)),this.elemSelectAll.innerHTML='<span class="'.concat((0,c.getClass)("select_all__icon"),'"></span> ').concat(this.options.locale.selectAll),this.elemControl.appendChild(this.elemSelectAll)),this.options.resetAll&&(this.elemResetAll=(0,c.createButton)(),this.elemResetAll.className="".concat(e," ").concat((0,c.getClass)("reset_all",!0,e)),this.elemResetAll.innerHTML='<span class="'.concat((0,c.getClass)("reset_all__icon"),'"></span> ').concat(this.options.locale.resetAll),this.elemControl.appendChild(this.elemResetAll))}}},{key:"createIcon",value:function(){var e=document.createElement("span");e.className=(0,c.getClass)("icon"),this.elemTopBody.appendChild(e)}},{key:"createDropDown",value:function(){this.isNative||(this.elemDropDownWrap=document.createElement("div"),this.elemDropDownWrap.className=(0,c.getClass)("body"),this.options.isAlwaysOpen&&this.elemDropDownWrap.classList.add((0,c.getClass)("body-always_open",!0)),this.elemDropDown=document.createElement("div"),this.elemDropDown.className=(0,c.getClass)("body_wrap"),this.elemListBody=document.createElement("ul"),this.elemListBody.className=(0,c.getClass)("list"),this.elemDropDownWrap.append(this.elemDropDown),this.elemWrap.appendChild(this.elemDropDownWrap),this.elemDropDown.appendChild(this.elemListBody),this.elemDropDownClose=(0,c.createButton)(),this.elemDropDownClose.classList.add((0,c.getClass)("close")),this.elemDropDown.appendChild(this.elemDropDownClose),this.isMulti&&this.createIsConfirmInMultiHTML(),this.handlerChangeChecked())}},{key:"createIsConfirmInMultiHTML",value:function(){var e,t=document.createElement("div"),i=(0,c.getClass)("bottom_control");this.confirmOk=(0,c.createButton)(),this.confirmNo=(0,c.createButton)(),t.appendChild(this.confirmOk),t.appendChild(this.confirmNo),this.confirmOk.innerHTML=this.options.locale.ok,this.confirmNo.innerHTML=this.options.locale.cansel,this.confirmOk.className="".concat(i," ").concat((0,c.getClass)("ok",!0,i)),this.confirmNo.className="".concat(i," ").concat((0,c.getClass)("no",!0,i));var s=(0,c.getClass)("bottom_controls");this.options.isConfirmInMulti||(s+=" ".concat((0,c.getClass)("hide",!0,s))),t.className=s,null===(e=this.elemDropDown)||void 0===e||e.appendChild(t)}},{key:"createTitleHTML",value:function(){var e=this;if(!this.options.isRemoveTop){if(!this.elemTitle){this.elemTitle=document.createElement("div");var t=(0,c.getClass)("title");this.options.isOnlyPlaceholder&&(t+=" ".concat((0,c.getClass)("only-placeholder",!0,t))),this.elemTitle.className=t,this.elemTopBody.insertBefore(this.elemTitle,this.elemTopBody.childNodes[0])}var i=this.getChecked();this.elemTop.title="";var s=!i.length,n=this.titlePlaceholder;if(i.length&&!this.options.isOnlyPlaceholder){var l="";i.forEach((function(t,i){0!==i&&(l+="".concat(e.options.sepChars,'<span class="').concat((0,c.getClass)("sep_space",!0),'">&nbsp;</span>')),l+="".concat(t.title)})),this.elemTop.title=l;var o=this.options.countShowSelected,a=Number(this.$select.dataset.simpleCountShowsSelected);a&&a>0&&(o=a),i.length>o?(n="".concat(this.options.locale.selected," ").concat(i.length),this.$select.querySelectorAll("option").length===i.length&&(n+=" (".concat(this.options.locale.all,")"))):l&&(n=l)}this.elemTitle.innerHTML=n,s?(this.elemTitle.classList.add("SimpleSel__title--placeholder"),this.elemTitle.classList.remove("SimpleSel__title--fill"),this.elemWrap.classList.remove((0,c.getClass)("fill",!0))):(this.elemTitle.classList.remove("SimpleSel__title--placeholder"),this.elemTitle.classList.add("SimpleSel__title--fill"),this.elemWrap.classList.add((0,c.getClass)("fill",!0)))}}},{key:"filterList",value:function(){var e=this.state.getState("filterStr"),t=this.state.getState("items");if(!e)return t;e=e.toLowerCase();var i=(0,c.cloneObj)(t);return i.forEach((function(t){var i=!1;t.items.forEach((function(t){t.title.toLowerCase().indexOf(e)>=0?(i=!0,t.isShowFilter=!0):t.isShowFilter=!1})),t.isShowFilter=i})),i}},{key:"createListHTML",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];if(this.elemListBody){var i="",s=0,n=0,l=0;(t?this.filterList():this.state.getState("items")).forEach((function(t){if(t.isGroup){var o=e.createLi(t),a=o.result,r=o.countShow,h=o.countChecked,u=o.countCheckedFull;i+='<div class="'.concat((0,c.getClass)("group_items"),'">'),i+=a,i+="</div>",n+=h,s+=r,l+=u}else{var p=e.createLi(t),d=p.result,m=p.countShow,f=p.countChecked,b=p.countCheckedFull;i+=d,s+=m,n+=f,l+=b}}));var o=this.state.getState("filterStr");o&&o.length&&0===s&&(i='<div class="'.concat((0,c.getClass)("no_match"),'">'),i="".concat(this.options.locale.noSearch,' "').concat(o,'"'),i+="</div>"),this.elemWrap.dataset.countChecked=n.toString(),this.elemWrap.dataset.countCheckedFull=l.toString(),this.isMulti&&(this.elemWrap.dataset.checkAllMulti=this.$select.options.length===n?"yes":"no"),i=(0,c.removeExtraSpaces)(i),this.elemListBody.innerHTML!==i&&(this.elemListBody.innerHTML=i)}}},{key:"createInputHTML",value:function(){var e=this.options.isSearch,t=this.options.isSearchInDropdown;if("simpleSelectSearch"in this.$select.dataset&&(e="false"!==this.$select.dataset.simpleSelectSearch),"simpleSelectSearchDropdown"in this.$select.dataset&&(t="false"!==this.$select.dataset.simpleSelectSearchDropdown),e||t){this.elemInputSearch=document.createElement("input"),this.elemInputSearch.type=this.options.searchTypeInput,this.elemInputSearch.tabIndex=-1,this.elemInputSearch.autocomplete="off",this.elemInputSearch.ariaAutoComplete="none",this.elemInputSearch.inputMode="off",this.elemInputSearch.placeholder=this.options.locale.searchText,this.elemInputSearch.name="".concat(u.initClass,"_name_").concat(this.id);var i=(0,c.getClass)("search");if(t){if(this.elemDropDown){var s=document.createElement("div");s.className=(0,c.getClass)("search_wrap"),this.elemInputSearch.className="".concat(i," ").concat((0,c.getClass)("dropdown",!0,i)),s.appendChild(this.elemInputSearch),this.elemDropDown.insertBefore(s,this.elemDropDown.childNodes[0])}}else this.elemInputSearch.className="".concat(i," ").concat((0,c.getClass)("top",!0,i)),this.elemTop.appendChild(this.elemInputSearch);this.inputSearchHandler()}}},{key:"getChecked",value:function(){var e=this.state.getState("items"),t=[];return e.forEach((function(e){t=[].concat(n(t),n(e.items.filter((function(e){return e.checked}))))})),t}},{key:"createLi",value:function(e){var t=this,i="",s=0,n=0,l=0;return e.isShowFilter?(e.isGroup&&(i+='<label class="'.concat((0,c.getClass)("group_title"),'">').concat(e.titleGroup,"</label>"),i+='<ul class="'.concat((0,c.getClass)("group"),'">')),e.items.forEach((function(o){if(o.isShowFilter){s++;var a=(0,c.getClass)("list_item"),r=a;o.checked&&(n++,r+=" ".concat((0,c.getClass)("checked",!0,a)),o.value&&l++),o.disabled&&(r+=" ".concat((0,c.getClass)("disabled",!0,a))),o.value||(r+=" ".concat((0,c.getClass)("not_value",!0,a)));var h='data-sel-group-id="'.concat(e.idGroup,'"');h+="data-sel-opt-item",h+=' data-sel-position="'.concat(o.position,'"'),h+=' data-sel-id="'.concat(o.id,'"'),o.value&&(h+=' data-sel-value="'.concat(o.value,'"')),h+=' data-sel-opt-checked="'.concat(o.checked,'"'),h+=' data-sel-opt-disabled="'.concat(o.disabled,'"'),t.options.isAlwaysOpen?o.disabled&&!t.options.isAlwaysOpenShowDisabledTabindex?h+=' tabindex="-1"':h+=' tabindex="0"':h+=' tabindex="-1"',i+='<li class="'.concat(r,'" ').concat(h,">");var u=t.createLiBody(o,t.$select.options[o.position]);i+="string"==typeof u?u:u.outerHTML,i+="</li>"}})),e.isGroup&&(i+="</ul>"),{result:i,countShow:s,countChecked:n,countCheckedFull:l}):{result:i,countShow:s,countChecked:n,countCheckedFull:l}}},{key:"createLiBody",value:function(e,t){var i=document.createElement("div");i.className=(0,c.getClass)("list_item_body");var s="";return this.isShowCheckbox&&(s='<span class="'.concat((0,c.getClass)("list_item_icon"),'"></span>')),this.bodyLiHTMLBeforeFromSelect&&(s+=this.bodyLiHTMLBeforeFromSelect),t.hasAttribute("data-simple-html-before")&&(s+=t.getAttribute("data-simple-html-before")),s+="".concat(e.title),this.bodyLiHTMLAfterFromSelect&&(s+=this.bodyLiHTMLAfterFromSelect),t.hasAttribute("data-simple-html-after")&&(s+=t.getAttribute("data-simple-html-after")),i.innerHTML=s,this.options.changeBodyLi?this.options.changeBodyLi(i,t):i}},{key:"handlerChangeChecked",value:function(){console.error("This method need redefine")}},{key:"createList",value:function(e){console.error("This method need redefine")}},{key:"inputSearchHandler",value:function(){console.error("This method need redefine")}}],i&&o(t.prototype,i),s&&o(t,s),Object.defineProperty(t,"prototype",{writable:!1}),e}();t.SimpleSelectItemDOM=p},679:function(e,t,i){Object.defineProperty(t,"__esModule",{value:!0}),t.createButton=t.cloneObj=t.compareObj=t.getClass=t.getCreateListItem=t.triggerInputEvent=t.ifTrueDataAttr=t.createDataAttr=t.removeExtraSpaces=t.toCamelCase=void 0;var s=i(737);t.toCamelCase=function(e){return e.replace(/-([a-z])/g,(function(e,t){return t.toUpperCase()}))};t.removeExtraSpaces=function(e){return e.replace(/\s+/g," ").trim()};t.createDataAttr=function(e){return"data-".concat(e)};t.ifTrueDataAttr=function(e){return!!e&&("true"===e||"1"===e)},t.triggerInputEvent=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"change";try{var i=new Event(t,{bubbles:!0,cancelable:!0});e.dispatchEvent(i)}catch(i){var s=new CustomEvent(t,{bubbles:!0,cancelable:!0});e.dispatchEvent(s)}};t.getCreateListItem=function(e,t,i){var s=e.querySelectorAll("option"),n=[];s.forEach((function(e,t){n.push({id:(t+1).toString(),position:e.index,title:e.innerHTML,value:e.getAttribute("value"),checked:e.selected,disabled:e.disabled,isShowFilter:!0})}));var l={isGroup:i,idGroup:t,items:n,isShowFilter:!0};return e instanceof HTMLOptGroupElement&&(l.titleGroup=e.label||"",l.isDisabledGroup=e.disabled||!1),l};t.getClass=function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:s.initClass,n=t?"--":"__";return"".concat(i).concat(n).concat(e)};t.compareObj=function(e,t){return JSON.stringify(e)===JSON.stringify(t)};t.cloneObj=function(e){return JSON.parse(JSON.stringify(e))};t.createButton=function(){var e=document.createElement("button");return e.type="button",e.tabIndex=-1,e}},972:function(e,t){function i(e){return i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},i(e)}function s(e,t){var i=Object.keys(e);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);t&&(s=s.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),i.push.apply(i,s)}return i}function n(e,t,s){return(t=function(e){var t=function(e,t){if("object"!==i(e)||null===e)return e;var s=e[Symbol.toPrimitive];if(void 0!==s){var n=s.call(e,t||"default");if("object"!==i(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===i(t)?t:String(t)}(t))in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}Object.defineProperty(t,"__esModule",{value:!0}),t.store=void 0,t.store=function(e){var t={},i={},l=[],o=function(e){return e?e in t?t[e]:null:t},a=function(e,o){var a=function(e){for(var t=1;t<arguments.length;t++){var i=null!=arguments[t]?arguments[t]:{};t%2?s(Object(i),!0).forEach((function(t){n(e,t,i[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(i)):s(Object(i)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(i,t))}))}return e}({},t),r=t[e]||0==t[e]?t[e]:null;t[e]=o,e in i&&i[e].forEach((function(e){return e(o,r,t)})),l.forEach((function(i){return i(e,a,t)}))};return e&&Object.keys(e).forEach((function(t){a(t,e[t])})),{getState:o,setState:a,subscribe:function(e,t){e in i||(i[e]=[]),i[e].push(t);var s=o(e);return t(s,null,o()),function(){i[e]=i[e].filter((function(e){return e!==t}))}},subscribeAll:function(e){return l.push(e),e(null,null,o()),function(){l=l.filter((function(t){return t!==e}))}},unSubscribe:function(e,t){e in i&&(i[e]=i[e].filter((function(e){return e!==t})))}}}},181:function(e,t,i){i.r(t)}},t={};function i(s){var n=t[s];if(void 0!==n)return n.exports;var l=t[s]={exports:{}};return e[s](l,l.exports,i),l.exports}i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};return function(){var e=s;function t(e){return t="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},t(e)}function n(e,t){var i=Object.keys(e);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);t&&(s=s.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),i.push.apply(i,s)}return i}function l(e){for(var t=1;t<arguments.length;t++){var i=null!=arguments[t]?arguments[t]:{};t%2?n(Object(i),!0).forEach((function(t){a(e,t,i[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(i)):n(Object(i)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(i,t))}))}return e}function o(e,t){for(var i=0;i<t.length;i++){var s=t[i];s.enumerable=s.enumerable||!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(e,r(s.key),s)}}function a(e,t,i){return(t=r(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function r(e){var i=function(e,i){if("object"!==t(e)||null===e)return e;var s=e[Symbol.toPrimitive];if(void 0!==s){var n=s.call(e,i||"default");if("object"!==t(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===i?String:Number)(e)}(e,"string");return"symbol"===t(i)?i:String(i)}var c=i(737),h=i(679),u=i(874);i(181);var p=function(){function e(t,i){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),a(this,"callCount",Date.now()),a(this,"countInit",0),a(this,"$selects",[]),a(this,"options",void 0),a(this,"nameMarkTransform",(0,h.toCamelCase)(c.nameMark)),a(this,"dataNameMark",(0,h.createDataAttr)(c.nameMark)),a(this,"isNative",void 0),t||(t="select"),this.options=l(l({},c.simpleSelectionOptions),i),"string"==typeof t?this.init(Array.from(document.querySelectorAll(t))):t instanceof HTMLSelectElement?this.init([t]):t instanceof NodeList?this.init(Array.from(t)):Array.isArray(t)?this.init(t):console.warn("Wrong selector: ",t)}var t,i,s;return t=e,(i=[{key:"detectMobile",value:function(){if(this.options.detectNative)this.isNative=this.options.detectNative();else{for(var e=navigator.userAgent||navigator.vendor||window.opera,t=!1,i=0;i<this.options.nativeOnDevice.length;i++)e.toString().toLowerCase().indexOf(this.options.nativeOnDevice[i].toLowerCase())>0&&this.options.nativeOnDevice[i]&&(t=!0);this.isNative=t}}},{key:"init",value:function(e){var t=this;this.detectMobile(),e.forEach((function(e){t.build(e)}))}},{key:"createMethods",value:function(e){var t=this;return{getNativeSelect:function(){return e.getSelect()},reload:function(){t.rebuild(e)},update:function(){e.updateHTML()},detach:function(){t.detach(e)}}}},{key:"setMethods",value:function(e){e.$select[c.nameSelect]=this.createMethods(e)}},{key:"setMethodsClear",value:function(e){delete e.$select[c.nameSelect]}},{key:"build",value:function(e){if(this.nameMarkTransform in e.dataset)console.warn("This element has already been initialized",e);else{this.countInit+=1;var t="".concat(this.callCount,"-").concat(this.countInit);e.setAttribute(this.dataNameMark,t);var i=new u.SimpleSelectItem(e,this.options,{id:t,isNative:this.isNative});this.$selects.push(i),this.setMethods(i)}}},{key:"detach",value:function(e){e.detachItem(),e.$select.removeAttribute(this.dataNameMark),this.setMethodsClear(e),this.$selects=this.$selects.filter((function(t){return t!==e}))}},{key:"rebuild",value:function(e){var t=e.$select;this.detach(e),this.build(t)}},{key:"getSelects",value:function(){return this.$selects}},{key:"getSelectFirst",value:function(){return this.createMethods(this.$selects[0])}},{key:"getSelectById",value:function(e){var t=this.$selects.filter((function(t){return t.id===e}))[0];return t?this.createMethods(t):null}}])&&o(t.prototype,i),s&&o(t,s),Object.defineProperty(t,"prototype",{writable:!1}),e}();e.default=p}(),s=s.default}()}));
1
+ !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("SimpleSelect",[],t):"object"==typeof exports?exports.SimpleSelect=t():e.SimpleSelect=t()}("undefined"==typeof self?this:self,(function(){return function(){"use strict";var e={737:function(e,t){Object.defineProperty(t,"__esModule",{value:!0}),t.initClass=t.nameMark=t.nameSelect=t.simpleSelectionOptions=t.simpleSelectLocale=void 0,t.simpleSelectLocale={noSearch:"No matches for",searchText:"Search",title:"Select",selected:"Selected:",all:"all",ok:"Ok",cansel:"Cansel",selectAll:"Select all",resetAll:"Reset all"},t.simpleSelectionOptions={isSearch:!1,searchTypeInput:"search",isSearchInDropdown:!1,countShowSelected:3,isOnlyPlaceholder:!1,historyMaxSize:0,isRemoveTop:!1,isConfirmInMulti:!1,isConfirmInMultiOkClickOutside:!1,nativeOnDevice:["Android","BlackBerry","iPhone","iPad","iPod","Opera Mini","IEMobile","Silk"],locale:t.simpleSelectLocale,sepChars:",",isUp:!1,isAlwaysOpen:!1,isAlwaysOpenShowDisabledTabindex:!1,floatWidth:767,isCloneClass:!0,selectAll:!1,selectAllAfterClose:!0,resetAll:!1,resetAllAfterClose:!0},t.nameSelect="SimpSelect";t.nameMark="".concat("simple-select-","init"),t.initClass="SimpleSel"},874:function(e,t,i){function s(e){return s="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},s(e)}function n(e,t){for(var i=0;i<t.length;i++){var s=t[i];s.enumerable=s.enumerable||!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(e,u(s.key),s)}}function o(e,t){return o=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},o(e,t)}function l(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var i,n=c(e);if(t){var o=c(this).constructor;i=Reflect.construct(n,arguments,o)}else i=n.apply(this,arguments);return function(e,t){if(t&&("object"===s(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return a(e)}(this,i)}}function a(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function r(){return r="undefined"!=typeof Reflect&&Reflect.get?Reflect.get.bind():function(e,t,i){var s=function(e,t){for(;!Object.prototype.hasOwnProperty.call(e,t)&&null!==(e=c(e)););return e}(e,t);if(s){var n=Object.getOwnPropertyDescriptor(s,t);return n.get?n.get.call(arguments.length<3?e:i):n.value}},r.apply(this,arguments)}function c(e){return c=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)},c(e)}function h(e,t,i){return(t=u(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function u(e){var t=function(e,t){if("object"!==s(e)||null===e)return e;var i=e[Symbol.toPrimitive];if(void 0!==i){var n=i.call(e,t||"default");if("object"!==s(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===s(t)?t:String(t)}Object.defineProperty(t,"__esModule",{value:!0}),t.SimpleSelectItem=void 0;var p=i(679),d=function(e){!function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&o(e,t)}(d,e);var t,i,s,u=l(d);function d(e,t,i){var s,n;if(function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,d),h(a(n=u.call(this,e,t,i)),"closeOutsideHandler",void 0),h(a(n),"closeEscHandler",void 0),h(a(n),"changeListener",void 0),h(a(n),"searchHandler",void 0),h(a(n),"handleResize",void 0),h(a(n),"mql",null),h(a(n),"countOpen",0),h(a(n),"multiDebounceTime",0),h(a(n),"timeoutDebounceId",null),h(a(n),"history",[]),!e)throw Error("Select is required");return n.init(),r((s=a(n),c(d.prototype)),"initDom",s).call(s),n.initAfterDom(),n}return t=d,i=[{key:"init",value:function(){var e=this;this.changeListener=this.changeListenerInit.bind(this),this.$select.addEventListener("change",this.changeListener),this.searchHandler=this.searchHandlerInit.bind(this),this.closeOutsideHandler=this.closeOutsideHandlerInit.bind(this),this.closeEscHandler=this.closeEscHandlerInit.bind(this),this.handleResize=this.handleResizeInit.bind(this),this.options.callbackInitialization&&this.options.callbackInitialization(this),!this.isNative&&this.options.floatWidth&&(this.mql=window.matchMedia("screen and (max-width: ".concat(this.options.floatWidth,"px)")),this.mql&&(this.mql.onchange=this.handleResize,this.handleResizeInit(this.mql))),this.state.subscribe("isOpen",(function(t){e.toggleOpenHandler(),!t&&e.options.isConfirmInMulti&&e.createList(),t||e.elemInputSearch&&(e.elemInputSearch.value="",e.state.setState("filterStr",""))})),this.isNative||this.options.isAlwaysOpen||(this.elemTopBody.onclick=this.clickToggleOpen.bind(this),this.elemTopBody.onkeyup=this.clickToggleOpen.bind(this))}},{key:"handleResizeInit",value:function(e){e&&(e.matches?this.state.setState("isFloat",!0):this.state.setState("isFloat",!1))}},{key:"initAfterDom",value:function(){var e=this;this.confirmOk&&(this.confirmOk.onclick=this.confirmOkHandler.bind(this)),this.confirmNo&&(this.confirmNo.onclick=this.confirmNoHandler.bind(this)),this.options.callbackInitialized&&this.options.callbackInitialized(this),this.isMulti&&!this.options.isConfirmInMulti&&((0,p.toCamelCase)("simple-debounce-time")in this.$select.dataset?this.multiDebounceTime=Number(this.$select.dataset[(0,p.toCamelCase)("simple-debounce-time")]):(this.options.debounceTime||0===this.options.debounceTime)&&(this.multiDebounceTime=this.options.debounceTime)),this.multiDebounceTime&&(this.multiDebounceChange=this.debounce(this.multiDebounceChange.bind(this),this.multiDebounceTime)),this.elemSelectAll&&(this.elemSelectAll.onclick=this.selectAllHandler.bind(this)),this.elemResetAll&&(this.elemResetAll.onclick=this.resetAllHandler.bind(this)),this.elemDropDownClose&&(this.elemDropDownClose.onclick=this.closeHandler.bind(this)),this.elemListBody&&this.elemListBody.addEventListener("keyup",(function(t){if("Enter"===t.key){var i=t.target;if(i&&(0,p.toCamelCase)("sel-opt-item")in i.dataset){t.preventDefault(),t.stopPropagation(),e.changeClickItem(i);var s=i.dataset[(0,p.toCamelCase)("sel-position")],n=e.elemListBody.querySelector('[data-sel-position="'.concat(s,'"]'));n&&n.focus()}}}))}},{key:"debounce",value:function(e,t){var i=this;return function(){for(var s=arguments.length,n=new Array(s),o=0;o<s;o++)n[o]=arguments[o];i.timeoutDebounceId&&clearTimeout(i.timeoutDebounceId),i.timeoutDebounceId=setTimeout((function(){e.apply(void 0,n),i.timeoutDebounceId=null}),t)}}},{key:"confirmOkHandler",value:function(e){e.preventDefault(),this.confirmOkBuild()}},{key:"confirmOkBuild",value:function(){var e=this,t=this.$select.options;this.elemListBody&&(this.elemListBody.querySelectorAll("[data-sel-position]").forEach((function(i){var s=parseInt(i.dataset[(0,p.toCamelCase)("sel-position")],10);if(s||0===s){var n=t[s];if(n&&!n.disabled){var o="true"===i.dataset[(0,p.toCamelCase)("sel-opt-checked")];o!==n.selected&&e.addHistory(n,o),n.selected=o}}})),this.state.setState("isOpen",!1),this.triggerInit())}},{key:"confirmNoHandler",value:function(e){e.preventDefault(),this.state.setState("isOpen",!1)}},{key:"closeHandler",value:function(e){e.preventDefault(),this.state.setState("isOpen",!1)}},{key:"selectAllHandler",value:function(e){e.preventDefault(),Array.from(this.$select.options).forEach((function(e){e.disabled||(e.selected=!0)})),this.createList(),this.options.selectAllAfterClose&&this.state.setState("isOpen",!1),this.triggerInit()}},{key:"resetAllHandler",value:function(e){e.preventDefault(),Array.from(this.$select.options).forEach((function(e){e.disabled||(e.selected=!1)})),this.createList(),this.options.selectAllAfterClose&&this.state.setState("isOpen",!1),this.triggerInit()}},{key:"triggerSetup",value:function(e){if(0===e.button){var t=e.target.closest("li");t&&this.changeClickItem(t)}}},{key:"changeClickItemDom",value:function(e){"true"===e.dataset[(0,p.toCamelCase)("sel-opt-checked")]?(e.dataset[(0,p.toCamelCase)("sel-opt-checked")]="false",e.classList.remove("SimpleSel__list_item--checked")):(e.dataset[(0,p.toCamelCase)("sel-opt-checked")]="true",e.classList.add("SimpleSel__list_item--checked"))}},{key:"addHistory",value:function(e,t){this.options.historyMaxSize>0&&(this.history.push({value:e.value,text:e.innerHTML,selected:t,indexOption:e.index}),this.history.length>this.options.historyMaxSize&&(this.history=this.history.slice(this.history.length-this.options.historyMaxSize)))}},{key:"changeClickItem",value:function(e){if(e){var t=Number(e.dataset[(0,p.toCamelCase)("sel-position")])||0,i=this.$select.options[t];if(i&&!i.disabled)if(this.isMulti)if(this.options.isConfirmInMulti||this.isFloatWidth)this.changeClickItemDom(e);else{var s=!i.selected;i.selected=s,this.addHistory(i,s),this.changeClickItemDom(e),this.createList(),this.multiDebounceChange()}else i.selected=!0,this.addHistory(i,!0),this.createList(),this.state.setState("isOpen",!1),this.triggerInit()}}},{key:"multiDebounceChange",value:function(){this.triggerInit()}},{key:"triggerInit",value:function(){(0,p.triggerInputEvent)(this.$select)}},{key:"clickToggleOpen",value:function(e){e.preventDefault(),this.isDisabled||("click"!==e.type?e instanceof KeyboardEvent&&"Enter"===e.key&&this.state.setState("isOpen",!this.state.getState("isOpen")):this.state.setState("isOpen",!this.state.getState("isOpen")))}},{key:"closeOutsideHandlerInit",value:function(e){var t=e.target;t&&(this.elemWrap.contains(t)||(this.options.isConfirmInMulti&&this.options.isConfirmInMultiOkClickOutside&&this.confirmOkBuild(),this.state.setState("isOpen",!1)))}},{key:"closeEscHandlerInit",value:function(e){"Escape"===e.code&&(e.preventDefault(),e.stopPropagation(),this.state.setState("isOpen",!1)),"Tab"===e.code&&(e.preventDefault(),e.stopPropagation(),this.elemWrap.contains(e.target)||this.state.setState("isOpen",!1)),"ArrowUp"!==e.key&&"ArrowDown"!==e.key||(e.preventDefault(),e.stopPropagation(),this.keyBoardChangeChecked("ArrowDown"===e.key))}},{key:"keyBoardChangeChecked",value:function(e){var t=this.elemListBody.querySelectorAll('[data-sel-position]:not([data-sel-opt-disabled="true"])');if(t.length){var i,s=0;t.forEach((function(e,t){document.activeElement===e&&(s=t,i=e),e.removeAttribute("tabindex")})),(i=i?e?t[s+1]||t[0]:t[s-1]||t[t.length-1]:e?t[0]:t[t.length-1]).tabIndex=0,i.focus()}}},{key:"searchHandlerInit",value:function(e){var t=e.target;if(t){var i=t.value;this.state.setState("filterStr",i)}}},{key:"toggleOpenHandler",value:function(){var e=this;this.state.getState("isOpen")?(this.elemWrap.classList.add("SimpleSel--open"),document.addEventListener("click",this.closeOutsideHandler),document.addEventListener("keyup",this.closeEscHandler),this.elemInputSearch&&setTimeout((function(){e.elemInputSearch.focus()}),50),this.options.callbackOpen&&this.options.callbackOpen(this),this.countOpen++,this.elemDropDown&&setTimeout((function(){e.elemDropDown.scrollTop=0}),10)):(this.state.setState("filterList",""),this.elemWrap.classList.remove("SimpleSel--open"),document.removeEventListener("click",this.closeOutsideHandler),document.removeEventListener("keyup",this.closeEscHandler),this.timeoutDebounceId&&(clearTimeout(this.timeoutDebounceId),this.triggerInit()),this.options.callbackClose&&this.countOpen>0&&this.options.callbackClose(this))}},{key:"changeListenerInit",value:function(e){this.options.callbackChangeSelect&&this.options.callbackChangeSelect(e,this),this.createList(!0)}},{key:"getSelect",value:function(){return this.$select}},{key:"handlerChangeChecked",value:function(){this.elemListBody&&(this.elemListBody.onmouseup=this.triggerSetup.bind(this))}},{key:"createList",value:function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=[],i=this.$select.querySelectorAll("optgroup");if(i&&i.length?i.forEach((function(e,i){t.push((0,p.getCreateListItem)(e,(i+1).toString(),!0))})):t.push((0,p.getCreateListItem)(this.$select,"1",!1)),e){var s=this.state.getState("items");(0,p.compareObj)(s,t)||this.state.setState("items",t)}else this.state.setState("items",t)}},{key:"inputSearchHandler",value:function(){this.elemInputSearch&&this.elemInputSearch.addEventListener("input",this.searchHandler)}},{key:"detachItem",value:function(){this.options.callbackDestroyInit&&this.options.callbackDestroyInit(this);var e=this.elemWrap.parentNode;this.$select.removeEventListener("change",this.changeListener),this.elemInputSearch&&this.elemInputSearch.removeEventListener("input",this.searchHandler),this.confirmOk&&(this.confirmOk.onclick=null),this.confirmNo&&(this.confirmNo.onclick=null),e.replaceChild(this.$select,this.elemWrap),this.$select.classList.remove(this.classSelectInit),this.elemTopBody&&(this.elemTopBody.onclick=null,this.elemTopBody.onkeyup=null),this.elemListBody&&(this.elemListBody.onmouseup=null),this.elemSelectAll&&(this.elemSelectAll.onclick=null),this.elemResetAll&&(this.elemResetAll.onclick=null),this.options.callbackDestroy&&this.options.callbackDestroy(this),this.elemDropDownClose&&(this.elemDropDownClose.onclick=null),this.mql&&(this.mql.onchange=null,this.mql=null)}}],i&&n(t.prototype,i),s&&n(t,s),Object.defineProperty(t,"prototype",{writable:!1}),d}(i(844).SimpleSelectItemDOM);t.SimpleSelectItem=d},844:function(e,t,i){function s(e){return s="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},s(e)}function n(e){return function(e){if(Array.isArray(e))return o(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(!e)return;if("string"==typeof e)return o(e,t);var i=Object.prototype.toString.call(e).slice(8,-1);"Object"===i&&e.constructor&&(i=e.constructor.name);if("Map"===i||"Set"===i)return Array.from(e);if("Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i))return o(e,t)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function o(e,t){(null==t||t>e.length)&&(t=e.length);for(var i=0,s=new Array(t);i<t;i++)s[i]=e[i];return s}function l(e,t){for(var i=0;i<t.length;i++){var s=t[i];s.enumerable=s.enumerable||!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(e,r(s.key),s)}}function a(e,t,i){return(t=r(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function r(e){var t=function(e,t){if("object"!==s(e)||null===e)return e;var i=e[Symbol.toPrimitive];if(void 0!==i){var n=i.call(e,t||"default");if("object"!==s(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===s(t)?t:String(t)}Object.defineProperty(t,"__esModule",{value:!0}),t.SimpleSelectItemDOM=void 0;var c=i(679),h=i(972),u=i(737),p=function(){function e(t,i,s){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),a(this,"options",void 0),a(this,"$select",void 0),a(this,"id",void 0),a(this,"titlePlaceholder",void 0),a(this,"isDisabled",!1),a(this,"isMulti",void 0),a(this,"state",(0,h.store)({items:[],isOpen:!1,filterStr:"",isFloat:!1})),a(this,"classSelectInit",(0,c.getClass)("select_init")),a(this,"isNative",void 0),a(this,"elemWrap",document.createElement("div")),a(this,"elemTop",document.createElement("div")),a(this,"elemTopBody",document.createElement("div")),a(this,"elemDropDownWrap",null),a(this,"elemDropDown",null),a(this,"elemDropDownClose",null),a(this,"elemListBody",null),a(this,"elemInputSearch",null),a(this,"elemTitle",void 0),a(this,"confirmWrap",null),a(this,"confirmOk",null),a(this,"confirmNo",null),a(this,"elemControl",null),a(this,"elemSelectAll",null),a(this,"elemResetAll",null),a(this,"cloneClasses",""),a(this,"isShowCheckbox",!1),a(this,"bodyLiHTMLBeforeFromSelect",null),a(this,"bodyLiHTMLAfterFromSelect",null),a(this,"isFloatWidth",!1),a(this,"bodyOpenClass","".concat(u.initClass,"--body_open"));var n=s.id,o=s.isNative;this.$select=t,this.isMulti=t.multiple,this.id=n,this.isNative=o,this.options=(0,c.cloneObj)(i),this.options.isCloneClass&&(this.cloneClasses=this.$select.className),i.callbackInitialization&&(this.options.callbackInitialization=i.callbackInitialization),i.callbackInitialized&&(this.options.callbackInitialized=i.callbackInitialized),i.callbackOpen&&(this.options.callbackOpen=i.callbackOpen),i.callbackClose&&(this.options.callbackClose=i.callbackClose),i.callbackDestroyInit&&(this.options.callbackDestroyInit=i.callbackDestroyInit),i.callbackDestroy&&(this.options.callbackDestroy=i.callbackDestroy),i.callbackChangeSelect&&(this.options.callbackChangeSelect=i.callbackChangeSelect),i.changeBodyLi&&(this.options.changeBodyLi=i.changeBodyLi),this.isMulti&&this.$select.hasAttribute("data-simple-is-confirm")&&(this.options.isConfirmInMulti=(0,c.ifTrueDataAttr)(this.$select.getAttribute("data-simple-is-confirm"))),this.optionOverride(),this.isDisabled=this.$select.disabled}var t,i,s;return t=e,i=[{key:"optionOverride",value:function(){var e=(0,c.toCamelCase)("simple-placeholder");if(this.$select.dataset[e]?this.titlePlaceholder=this.$select.dataset[e]||"":this.titlePlaceholder=this.options.locale.title,this.$select.hasAttribute("data-simple-reset-all")&&(this.options.resetAll=(0,c.ifTrueDataAttr)(this.$select.getAttribute("data-simple-reset-all"))),this.$select.hasAttribute("data-simple-select-all")){var t=this.$select.getAttribute("data-simple-select-all");this.options.selectAll=(0,c.ifTrueDataAttr)(t)}var i=this.$select.dataset[(0,c.toCamelCase)("simple-show-checkbox")];this.isMulti?this.isShowCheckbox=!(i&&!(0,c.ifTrueDataAttr)(i)):"true"===i&&(this.isShowCheckbox=!0);var s=this.$select.dataset[(0,c.toCamelCase)("simple-item-html-before")];s&&(this.bodyLiHTMLBeforeFromSelect=s);var n=this.$select.dataset[(0,c.toCamelCase)("simple-item-html-after")];if(n&&(this.bodyLiHTMLAfterFromSelect=n),this.$select.hasAttribute("data-simple-up")&&(this.options.isUp=(0,c.ifTrueDataAttr)(this.$select.getAttribute("data-simple-up"))),this.$select.hasAttribute("data-simple-is-only-placeholder")&&(this.options.isOnlyPlaceholder=(0,c.ifTrueDataAttr)(this.$select.getAttribute("data-simple-is-only-placeholder"))),this.$select.hasAttribute("data-simple-remove-top")&&(this.options.isRemoveTop=(0,c.ifTrueDataAttr)(this.$select.getAttribute("data-simple-remove-top"))),this.$select.hasAttribute("data-simple-float-none")&&(this.isFloatWidth=!1,this.options.floatWidth=0),this.$select.hasAttribute("data-simple-float-width")){var o=Number(this.$select.dataset[(0,c.toCamelCase)("simple-float-width")]);o&&(this.options.floatWidth=o)}this.$select.hasAttribute("data-simple-always-open")&&(this.options.isAlwaysOpen=(0,c.ifTrueDataAttr)(this.$select.getAttribute("data-simple-always-open")),this.isNative=!1,this.isFloatWidth=!1,this.options.floatWidth=0)}},{key:"initDom",value:function(){var e=this;this.createList(!1),this.createHTML(),this.state.subscribe("filterStr",(function(t){e.createListHTML(!0)})),this.state.subscribe("items",(function(t){e.createListHTML(!0),e.createTitleHTML()})),this.state.subscribe("isOpen",(function(t){e.createListHTML(!1),e.createTitleHTML(),e.toggleTabIndex(t)})),this.state.subscribe("isFloat",(function(t){e.isFloatWidth=t;var i=(0,c.getClass)("float",!0);t?e.elemWrap.classList.add(i):e.elemWrap.classList.remove(i)}))}},{key:"toggleTabIndex",value:function(e){var t=e||this.options.isAlwaysOpen?0:-1;this.state.getState("isFloat")&&(e?document.body.classList.add(this.bodyOpenClass):document.body.classList.remove(this.bodyOpenClass)),this.elemInputSearch&&(this.elemInputSearch.tabIndex=t),this.elemResetAll&&(this.elemResetAll.tabIndex=t),this.elemSelectAll&&(this.elemSelectAll.tabIndex=t),this.confirmOk&&(this.confirmOk.tabIndex=t),this.confirmNo&&(this.confirmNo.tabIndex=t)}},{key:"updateHTML",value:function(){this.createList(!0)}},{key:"createHTML",value:function(){this.$select.classList.add(this.classSelectInit),this.$select.tabIndex=-1,this.elemTopBody.className=(0,c.getClass)("top_body"),this.elemTopBody.tabIndex=this.isDisabled?-1:0,this.createIcon(),this.options.isRemoveTop||this.elemTop.appendChild(this.elemTopBody);var e=u.initClass;this.options.isCloneClass&&(e+=" ".concat(this.cloneClasses)),this.$select.hasAttribute("data-simple-add-classes")&&(e+=" ".concat(this.$select.getAttribute("data-simple-add-classes"))),this.isDisabled&&(e+=" ".concat((0,c.getClass)("disabled",!0))),this.options.isAlwaysOpen&&(e+=" ".concat((0,c.getClass)("always_open",!0))),this.options.isUp&&(e+=" ".concat((0,c.getClass)("up",!0))),e+=" ".concat(this.isMulti?(0,c.getClass)("multi",!0):(0,c.getClass)("single",!0)),this.elemWrap.className=e,this.elemWrap.dataset.countAll=this.$select.options.length.toString(),this.elemTop.className=(0,c.getClass)("top");var t=this.$select.parentNode;t&&(t.replaceChild(this.elemWrap,this.$select),this.elemWrap.appendChild(this.$select)),this.elemWrap.appendChild(this.elemTop),this.isNative?(this.$select.classList.add((0,c.getClass)("native",!0,this.classSelectInit)),this.elemWrap.classList.add((0,c.getClass)("native",!0))):(this.createDropDown(),this.createControlHTML(),this.createInputHTML()),this.createTitleHTML()}},{key:"createControlHTML",value:function(){if(this.elemDropDown&&this.isMulti&&(this.options.selectAll||this.options.resetAll)){this.elemControl=document.createElement("div"),this.elemControl.classList.add((0,c.getClass)("controls")),this.elemDropDown.insertBefore(this.elemControl,this.elemDropDown.childNodes[0]);var e=(0,c.getClass)("control");this.options.selectAll&&(this.elemSelectAll=(0,c.createButton)(),this.elemSelectAll.className="".concat(e," ").concat((0,c.getClass)("select_all",!0,e)),this.elemSelectAll.innerHTML='<span class="'.concat((0,c.getClass)("select_all__icon"),'"></span> ').concat(this.options.locale.selectAll),this.elemControl.appendChild(this.elemSelectAll)),this.options.resetAll&&(this.elemResetAll=(0,c.createButton)(),this.elemResetAll.className="".concat(e," ").concat((0,c.getClass)("reset_all",!0,e)),this.elemResetAll.innerHTML='<span class="'.concat((0,c.getClass)("reset_all__icon"),'"></span> ').concat(this.options.locale.resetAll),this.elemControl.appendChild(this.elemResetAll))}}},{key:"createIcon",value:function(){var e=document.createElement("span");e.className=(0,c.getClass)("icon"),this.elemTopBody.appendChild(e)}},{key:"createDropDown",value:function(){this.isNative||(this.elemDropDownWrap=document.createElement("div"),this.elemDropDownWrap.className=(0,c.getClass)("body"),this.options.isAlwaysOpen&&this.elemDropDownWrap.classList.add((0,c.getClass)("body-always_open",!0)),this.elemDropDown=document.createElement("div"),this.elemDropDown.className=(0,c.getClass)("body_wrap"),this.elemListBody=document.createElement("ul"),this.elemListBody.className=(0,c.getClass)("list"),this.elemDropDownWrap.append(this.elemDropDown),this.elemWrap.appendChild(this.elemDropDownWrap),this.elemDropDown.appendChild(this.elemListBody),this.elemDropDownClose=(0,c.createButton)(),this.elemDropDownClose.classList.add((0,c.getClass)("close")),this.elemDropDown.appendChild(this.elemDropDownClose),this.isMulti&&this.createIsConfirmInMultiHTML(),this.handlerChangeChecked())}},{key:"createIsConfirmInMultiHTML",value:function(){var e;this.confirmWrap=document.createElement("div");var t=(0,c.getClass)("bottom_control");this.confirmOk=(0,c.createButton)(),this.confirmNo=(0,c.createButton)(),this.confirmWrap.appendChild(this.confirmOk),this.confirmWrap.appendChild(this.confirmNo),this.confirmOk.innerHTML=this.options.locale.ok,this.confirmNo.innerHTML=this.options.locale.cansel,this.confirmOk.className="".concat(t," ").concat((0,c.getClass)("ok",!0,t)),this.confirmNo.className="".concat(t," ").concat((0,c.getClass)("no",!0,t));var i=(0,c.getClass)("bottom_controls");this.options.isConfirmInMulti||(i+=" ".concat((0,c.getClass)("hide",!0,i))),this.confirmWrap.className=i,null===(e=this.elemDropDown)||void 0===e||e.appendChild(this.confirmWrap)}},{key:"createTitleHTML",value:function(){var e=this;if(!this.options.isRemoveTop){if(!this.elemTitle){this.elemTitle=document.createElement("div");var t=(0,c.getClass)("title");this.options.isOnlyPlaceholder&&(t+=" ".concat((0,c.getClass)("only-placeholder",!0,t))),this.elemTitle.className=t,this.elemTopBody.insertBefore(this.elemTitle,this.elemTopBody.childNodes[0])}var i=this.getChecked();this.elemTop.title="";var s=!i.length,n=this.titlePlaceholder;if(i.length&&!this.options.isOnlyPlaceholder){var o="";i.forEach((function(t,i){0!==i&&(o+="".concat(e.options.sepChars,'<span class="').concat((0,c.getClass)("sep_space",!0),'">&nbsp;</span>')),o+="".concat(t.title)})),this.elemTop.title=o;var l=this.options.countShowSelected,a=Number(this.$select.dataset.simpleCountShowsSelected);a&&a>0&&(l=a),i.length>l?(n="".concat(this.options.locale.selected," ").concat(i.length),this.$select.querySelectorAll("option").length===i.length&&(n+=" (".concat(this.options.locale.all,")"))):o&&(n=o)}this.elemTitle.innerHTML=n,s?(this.elemTitle.classList.add("SimpleSel__title--placeholder"),this.elemTitle.classList.remove("SimpleSel__title--fill"),this.elemWrap.classList.remove((0,c.getClass)("fill",!0))):(this.elemTitle.classList.remove("SimpleSel__title--placeholder"),this.elemTitle.classList.add("SimpleSel__title--fill"),this.elemWrap.classList.add((0,c.getClass)("fill",!0)))}}},{key:"filterList",value:function(){var e=this.state.getState("filterStr"),t=this.state.getState("items");if(!e)return t;e=e.toLowerCase();var i=(0,c.cloneObj)(t);return i.forEach((function(t){var i=!1;t.items.forEach((function(t){t.title.toLowerCase().indexOf(e)>=0?(i=!0,t.isShowFilter=!0):t.isShowFilter=!1})),t.isShowFilter=i})),i}},{key:"createListHTML",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];if(this.elemListBody){var i="",s=0,n=0,o=0;(t?this.filterList():this.state.getState("items")).forEach((function(t){if(t.isGroup){var l=e.createLi(t),a=l.result,r=l.countShow,h=l.countChecked,u=l.countCheckedFull;i+='<div class="'.concat((0,c.getClass)("group_items"),'">'),i+=a,i+="</div>",n+=h,s+=r,o+=u}else{var p=e.createLi(t),d=p.result,m=p.countShow,f=p.countChecked,b=p.countCheckedFull;i+=d,s+=m,n+=f,o+=b}}));var l=this.state.getState("filterStr");l&&l.length&&0===s&&(i='<div class="'.concat((0,c.getClass)("no_match"),'">'),i="".concat(this.options.locale.noSearch,' "').concat(l,'"'),i+="</div>"),this.elemWrap.dataset.countChecked=n.toString(),this.elemWrap.dataset.countCheckedFull=o.toString(),this.isMulti&&(this.elemWrap.dataset.checkAllMulti=this.$select.options.length===n?"yes":"no"),i=(0,c.removeExtraSpaces)(i),this.elemListBody.innerHTML!==i&&(this.elemListBody.innerHTML=i)}}},{key:"createInputHTML",value:function(){var e=this.options.isSearch,t=this.options.isSearchInDropdown;if("simpleSelectSearch"in this.$select.dataset&&(e="false"!==this.$select.dataset.simpleSelectSearch),"simpleSelectSearchDropdown"in this.$select.dataset&&(t="false"!==this.$select.dataset.simpleSelectSearchDropdown),e||t){this.elemInputSearch=document.createElement("input"),this.elemInputSearch.type=this.options.searchTypeInput,this.elemInputSearch.tabIndex=-1,this.elemInputSearch.autocomplete="off",this.elemInputSearch.ariaAutoComplete="none",this.elemInputSearch.inputMode="off",this.elemInputSearch.placeholder=this.options.locale.searchText,this.elemInputSearch.name="".concat(u.initClass,"_name_").concat(this.id);var i=(0,c.getClass)("search");if(t){if(this.elemDropDown){var s=document.createElement("div");s.className=(0,c.getClass)("search_wrap"),this.elemInputSearch.className="".concat(i," ").concat((0,c.getClass)("dropdown",!0,i)),s.appendChild(this.elemInputSearch),this.elemDropDown.insertBefore(s,this.elemDropDown.childNodes[0])}}else this.elemInputSearch.className="".concat(i," ").concat((0,c.getClass)("top",!0,i)),this.elemTop.appendChild(this.elemInputSearch);this.inputSearchHandler()}}},{key:"getChecked",value:function(){var e=this.state.getState("items"),t=[];return e.forEach((function(e){t=[].concat(n(t),n(e.items.filter((function(e){return e.checked}))))})),t}},{key:"createLi",value:function(e){var t=this,i="",s=0,n=0,o=0;return e.isShowFilter?(e.isGroup&&(i+='<label class="'.concat((0,c.getClass)("group_title"),'">').concat(e.titleGroup,"</label>"),i+='<ul class="'.concat((0,c.getClass)("group"),'">')),e.items.forEach((function(l){if(l.isShowFilter){s++;var a=(0,c.getClass)("list_item"),r=a;l.checked&&(n++,r+=" ".concat((0,c.getClass)("checked",!0,a)),l.value&&o++),l.disabled&&(r+=" ".concat((0,c.getClass)("disabled",!0,a))),l.value||(r+=" ".concat((0,c.getClass)("not_value",!0,a)));var h='data-sel-group-id="'.concat(e.idGroup,'"');h+="data-sel-opt-item",h+=' data-sel-position="'.concat(l.position,'"'),h+=' data-sel-id="'.concat(l.id,'"'),l.value&&(h+=' data-sel-value="'.concat(l.value,'"')),h+=' data-sel-opt-checked="'.concat(l.checked,'"'),h+=' data-sel-opt-disabled="'.concat(l.disabled,'"'),t.options.isAlwaysOpen?l.disabled&&!t.options.isAlwaysOpenShowDisabledTabindex?h+=' tabindex="-1"':h+=' tabindex="0"':h+=' tabindex="-1"',i+='<li class="'.concat(r,'" ').concat(h,">");var u=t.createLiBody(l,t.$select.options[l.position]);i+="string"==typeof u?u:u.outerHTML,i+="</li>"}})),e.isGroup&&(i+="</ul>"),{result:i,countShow:s,countChecked:n,countCheckedFull:o}):{result:i,countShow:s,countChecked:n,countCheckedFull:o}}},{key:"createLiBody",value:function(e,t){var i=document.createElement("div");i.className=(0,c.getClass)("list_item_body");var s="";return this.isShowCheckbox&&(s='<span class="'.concat((0,c.getClass)("list_item_icon"),'"></span>')),this.bodyLiHTMLBeforeFromSelect&&(s+=this.bodyLiHTMLBeforeFromSelect),t.hasAttribute("data-simple-html-before")&&(s+=t.getAttribute("data-simple-html-before")),s+="".concat(e.title),this.bodyLiHTMLAfterFromSelect&&(s+=this.bodyLiHTMLAfterFromSelect),t.hasAttribute("data-simple-html-after")&&(s+=t.getAttribute("data-simple-html-after")),i.innerHTML=s,this.options.changeBodyLi?this.options.changeBodyLi(i,t):i}},{key:"handlerChangeChecked",value:function(){console.error("This method need redefine")}},{key:"createList",value:function(e){console.error("This method need redefine")}},{key:"inputSearchHandler",value:function(){console.error("This method need redefine")}}],i&&l(t.prototype,i),s&&l(t,s),Object.defineProperty(t,"prototype",{writable:!1}),e}();t.SimpleSelectItemDOM=p},679:function(e,t,i){Object.defineProperty(t,"__esModule",{value:!0}),t.createButton=t.cloneObj=t.compareObj=t.getClass=t.getCreateListItem=t.triggerInputEvent=t.ifTrueDataAttr=t.createDataAttr=t.removeExtraSpaces=t.toCamelCase=void 0;var s=i(737);t.toCamelCase=function(e){return e.replace(/-([a-z])/g,(function(e,t){return t.toUpperCase()}))};t.removeExtraSpaces=function(e){return e.replace(/\s+/g," ").trim()};t.createDataAttr=function(e){return"data-".concat(e)};t.ifTrueDataAttr=function(e){return!!e&&("true"===e||"1"===e)},t.triggerInputEvent=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"change";try{var i=new Event(t,{bubbles:!0,cancelable:!0});e.dispatchEvent(i)}catch(i){var s=new CustomEvent(t,{bubbles:!0,cancelable:!0});e.dispatchEvent(s)}};t.getCreateListItem=function(e,t,i){var s=e.querySelectorAll("option"),n=[];s.forEach((function(e,t){n.push({id:(t+1).toString(),position:e.index,title:e.innerHTML,value:e.getAttribute("value"),checked:e.selected,disabled:e.disabled,isShowFilter:!0})}));var o={isGroup:i,idGroup:t,items:n,isShowFilter:!0};return e instanceof HTMLOptGroupElement&&(o.titleGroup=e.label||"",o.isDisabledGroup=e.disabled||!1),o};t.getClass=function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:s.initClass,n=t?"--":"__";return"".concat(i).concat(n).concat(e)};t.compareObj=function(e,t){return JSON.stringify(e)===JSON.stringify(t)};t.cloneObj=function(e){return JSON.parse(JSON.stringify(e))};t.createButton=function(){var e=document.createElement("button");return e.type="button",e.tabIndex=-1,e}},972:function(e,t){function i(e){return i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},i(e)}function s(e,t){var i=Object.keys(e);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);t&&(s=s.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),i.push.apply(i,s)}return i}function n(e,t,s){return(t=function(e){var t=function(e,t){if("object"!==i(e)||null===e)return e;var s=e[Symbol.toPrimitive];if(void 0!==s){var n=s.call(e,t||"default");if("object"!==i(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===i(t)?t:String(t)}(t))in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}Object.defineProperty(t,"__esModule",{value:!0}),t.store=void 0,t.store=function(e){var t={},i={},o=[],l=function(e){return e?e in t?t[e]:null:t},a=function(e,l){var a=function(e){for(var t=1;t<arguments.length;t++){var i=null!=arguments[t]?arguments[t]:{};t%2?s(Object(i),!0).forEach((function(t){n(e,t,i[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(i)):s(Object(i)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(i,t))}))}return e}({},t),r=t[e]||0==t[e]?t[e]:null;t[e]=l,e in i&&i[e].forEach((function(e){return e(l,r,t)})),o.forEach((function(i){return i(e,a,t)}))};return e&&Object.keys(e).forEach((function(t){a(t,e[t])})),{getState:l,setState:a,subscribe:function(e,t){e in i||(i[e]=[]),i[e].push(t);var s=l(e);return t(s,null,l()),function(){i[e]=i[e].filter((function(e){return e!==t}))}},subscribeAll:function(e){return o.push(e),e(null,null,l()),function(){o=o.filter((function(t){return t!==e}))}},unSubscribe:function(e,t){e in i&&(i[e]=i[e].filter((function(e){return e!==t})))}}}},181:function(e,t,i){i.r(t)}},t={};function i(s){var n=t[s];if(void 0!==n)return n.exports;var o=t[s]={exports:{}};return e[s](o,o.exports,i),o.exports}i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};return function(){var e=s;function t(e){return t="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},t(e)}function n(e,t){var i=Object.keys(e);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);t&&(s=s.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),i.push.apply(i,s)}return i}function o(e){for(var t=1;t<arguments.length;t++){var i=null!=arguments[t]?arguments[t]:{};t%2?n(Object(i),!0).forEach((function(t){a(e,t,i[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(i)):n(Object(i)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(i,t))}))}return e}function l(e,t){for(var i=0;i<t.length;i++){var s=t[i];s.enumerable=s.enumerable||!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(e,r(s.key),s)}}function a(e,t,i){return(t=r(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function r(e){var i=function(e,i){if("object"!==t(e)||null===e)return e;var s=e[Symbol.toPrimitive];if(void 0!==s){var n=s.call(e,i||"default");if("object"!==t(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===i?String:Number)(e)}(e,"string");return"symbol"===t(i)?i:String(i)}var c=i(737),h=i(679),u=i(874);i(181);var p=function(){function e(t,i){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),a(this,"callCount",Date.now()),a(this,"countInit",0),a(this,"$selects",[]),a(this,"options",void 0),a(this,"nameMarkTransform",(0,h.toCamelCase)(c.nameMark)),a(this,"dataNameMark",(0,h.createDataAttr)(c.nameMark)),a(this,"isNative",void 0),t||(t="select"),this.options=o(o({},c.simpleSelectionOptions),i),"string"==typeof t?this.init(Array.from(document.querySelectorAll(t))):t instanceof HTMLSelectElement?this.init([t]):t instanceof NodeList?this.init(Array.from(t)):Array.isArray(t)?this.init(t):console.warn("Wrong selector: ",t)}var t,i,s;return t=e,(i=[{key:"detectMobile",value:function(){if(this.options.detectNative)this.isNative=this.options.detectNative();else{for(var e=navigator.userAgent||navigator.vendor||window.opera,t=!1,i=0;i<this.options.nativeOnDevice.length;i++)e.toString().toLowerCase().indexOf(this.options.nativeOnDevice[i].toLowerCase())>0&&this.options.nativeOnDevice[i]&&(t=!0);this.isNative=t}}},{key:"init",value:function(e){var t=this;this.detectMobile(),e.forEach((function(e){t.build(e)}))}},{key:"createMethods",value:function(e){var t=this;return{getHistory:function(){return e.history},getHistoryLast:function(){return e.history.length?e.history[e.history.length-1]:null},getHistoryFirst:function(){return e.history.length?e.history[0]:null},getNativeSelect:function(){return e.getSelect()},reload:function(){t.rebuild(e)},update:function(){e.updateHTML()},detach:function(){t.detach(e)}}}},{key:"setMethods",value:function(e){e.$select[c.nameSelect]=this.createMethods(e)}},{key:"setMethodsClear",value:function(e){delete e.$select[c.nameSelect]}},{key:"build",value:function(e){if(this.nameMarkTransform in e.dataset)console.warn("This element has already been initialized",e);else{this.countInit+=1;var t="".concat(this.callCount,"-").concat(this.countInit);e.setAttribute(this.dataNameMark,t);var i=new u.SimpleSelectItem(e,this.options,{id:t,isNative:this.isNative});this.$selects.push(i),this.setMethods(i)}}},{key:"detach",value:function(e){e.detachItem(),e.$select.removeAttribute(this.dataNameMark),this.setMethodsClear(e),this.$selects=this.$selects.filter((function(t){return t!==e}))}},{key:"rebuild",value:function(e){var t=e.$select;this.detach(e),this.build(t)}},{key:"getSelects",value:function(){return this.$selects}},{key:"getSelectFirst",value:function(){return this.createMethods(this.$selects[0])}},{key:"getSelectById",value:function(e){var t=this.$selects.filter((function(t){return t.id===e}))[0];return t?this.createMethods(t):null}}])&&l(t.prototype,i),s&&l(t,s),Object.defineProperty(t,"prototype",{writable:!1}),e}();e.default=p}(),s=s.default}()}));
package/dist/simpleSelectItem.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  /// <reference types="node" />
2
2
  import { IItemLocalOptions, ISimpleSelectOptions } from './types/simpleSelect.types';
3
+ import { IHistoryItem } from './types/item.types';
3
4
  import { SimpleSelectItemDOM } from './simpleSelectItemDOM';
4
5
  export declare class SimpleSelectItem extends SimpleSelectItemDOM {
5
6
  closeOutsideHandler: (e: MouseEvent) => void;
@@ -11,6 +12,7 @@ export declare class SimpleSelectItem extends SimpleSelectItemDOM {
11
12
  countOpen: number;
12
13
  multiDebounceTime: number;
13
14
  timeoutDebounceId: NodeJS.Timeout | null;
15
+ history: IHistoryItem[];
14
16
  constructor(select: HTMLSelectElement, options: ISimpleSelectOptions, localOptions: IItemLocalOptions);
15
17
  init(): void;
16
18
  private handleResizeInit;
@@ -24,6 +26,7 @@ export declare class SimpleSelectItem extends SimpleSelectItemDOM {
24
26
  resetAllHandler(e: MouseEvent): void;
25
27
  triggerSetup(e: MouseEvent): void;
26
28
  changeClickItemDom(item: HTMLLIElement): void;
29
+ addHistory(option: HTMLOptionElement, isCheck: boolean): void;
27
30
  changeClickItem(item: HTMLLIElement): void;
28
31
  multiDebounceChange(): void;
29
32
  triggerInit(): void;
package/dist/simpleSelectItemDOM.d.ts CHANGED
@@ -25,6 +25,7 @@ export declare class SimpleSelectItemDOM {
25
25
  elemListBody: HTMLUListElement | null;
26
26
  elemInputSearch: HTMLInputElement | null;
27
27
  elemTitle: HTMLDivElement;
28
+ confirmWrap: HTMLElement | null;
28
29
  confirmOk: HTMLButtonElement | null;
29
30
  confirmNo: HTMLButtonElement | null;
30
31
  elemControl: HTMLDivElement | null;
package/dist/style.css CHANGED
@@ -1 +1 @@
1
- :root{--simpS_bg:#fff;--simpS_pad_hor:15px;--simpS_height_top:40px;--simpS_color:#27272a;--simpS_color_light:#eae9e9;--simpS_color_cheked:#d9d7d7;--simpS_color_yes:green;--simpS_color_no:red;--simpS_color_placeholder:#5d5c5c;--simpS_color_dis:#8b8b8b;--simpS_radius:4px;--simpS_f_size:16px;--simpS_f_shadow:0 0 3px 0 var(--simpS_color);--simpS_size_check:20px;--simpS_li_h:36px;--simpS_btn_h:34px;--simpS_btn_bg:#f9f9f9;--simpS_btn_bg_reverse:#eeecec}.SimpleSel{-webkit-box-sizing:border-box;box-sizing:border-box;color:#27272a;color:var(--simpS_color);font-size:16px;font-size:var(--simpS_f_size);position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.SimpleSel--disabled{color:#8b8b8b;color:var(--simpS_color_dis);opacity:.8}.SimpleSel *,.SimpleSel :after,.SimpleSel :before{-webkit-box-sizing:border-box;box-sizing:border-box}.SimpleSel--float .SimpleSel__select_init{visibility:hidden}.SimpleSel__select_init{-webkit-box-sizing:border-box;box-sizing:border-box;height:100%;opacity:0;position:absolute;right:0;top:0;width:100%}.SimpleSel__select_init--native{z-index:5}.SimpleSel__bottom_control,.SimpleSel__control{-webkit-font-smoothing:inherit;-moz-osx-font-smoothing:inherit;-ms-flex-line-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-content:center;align-items:center;-webkit-appearance:none;background-color:#f9f9f9;background-color:var(--simpS_btn_bg);border:none;border-radius:0;color:inherit;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;font:inherit;height:34px;height:var(--simpS_btn_h);justify-content:center;line-height:normal;margin:0;outline:none;overflow:visible;padding:1px 10px;text-align:center;width:auto}.SimpleSel__bottom_control:hover,.SimpleSel__control:hover{background-color:#eeecec;background-color:var(--simpS_btn_bg_reverse)}.SimpleSel__list_item_icon,.SimpleSel__reset_all__icon,.SimpleSel__select_all__icon{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;border:1px solid;border-radius:4px;border-radius:var(--simpS_radius);display:-webkit-box;display:-ms-flexbox;display:flex;height:20px;height:var(--simpS_size_check);justify-content:center;margin-right:7px;position:relative;width:20px;width:var(--simpS_size_check)}.SimpleSel__list_item_icon:before,.SimpleSel__select_all__icon:before{border:solid;border-width:0 2px 2px 0;content:"";display:block;height:11px;height:calc(var(--simpS_size_check)/2 + 1px);left:4px;top:1px;-webkit-transform:rotate(45deg) translate(-17%,-10%);transform:rotate(45deg) translate(-17%,-10%);-webkit-transition:all .25s;transition:all .25s;width:6.66667px;width:calc(var(--simpS_size_check)/3)}.SimpleSel__top{position:relative}.SimpleSel__top_body{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;background-color:#fff;background-color:var(--simpS_bg);border:2px solid;border-radius:4px;border-radius:var(--simpS_radius);color:currentColor;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;height:40px;height:var(--simpS_height_top);justify-content:space-between;padding:5px 0 5px 15px;padding:5px 0 5px var(--simpS_pad_hor);position:relative}.SimpleSel--disabled .SimpleSel__top_body{cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.SimpleSel__top_body:focus-visible{-webkit-box-shadow:0 0 3px 0 #27272a;box-shadow:0 0 3px 0 #27272a;-webkit-box-shadow:var(--simpS_f_shadow);box-shadow:var(--simpS_f_shadow)}.SimpleSel__title{-webkit-box-flex:1;-ms-flex:1;flex:1;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.SimpleSel__icon{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;height:40px;height:var(--simpS_height_top);justify-content:center;position:relative;width:40px;width:var(--simpS_height_top)}.SimpleSel__icon:after{border-bottom:2px solid;border-right:2px solid;content:"";display:inline;height:.5em;left:50%;position:absolute;top:calc(50% - 2px);-webkit-transform:rotate(45deg) translate(-50%,-50%);transform:rotate(45deg) translate(-50%,-50%);-webkit-transform-origin:left top;transform-origin:left top;-webkit-transition:transform .25s,top .25s;transition:transform .25s,top .25s;width:.5em}.SimpleSel--open .SimpleSel__icon:after{top:calc(50% + 2px);-webkit-transform:rotate(225deg) translate(-50%,-50%);transform:rotate(225deg) translate(-50%,-50%)}.SimpleSel--always_open .SimpleSel__icon{display:none}.SimpleSel--single[data-count-checked-full="0"] .SimpleSel__title,.SimpleSel__list_item--not_value,.SimpleSel__title--placeholder{color:#5d5c5c;color:var(--simpS_color_placeholder)}.SimpleSel__body{background-color:#fff;background-color:var(--simpS_bg);border:1px solid;border-radius:4px;border-radius:var(--simpS_radius);max-height:0;opacity:0;overflow:hidden;overflow-y:auto;position:absolute;-webkit-transition:all .25s;transition:all .25s;visibility:hidden;width:100%;z-index:3}.SimpleSel--body-always_open{max-height:none;opacity:1;position:relative;top:auto;visibility:visible}.SimpleSel:not(.SimpleSel--up) .SimpleSel--multi{margin-top:2px;top:100%}.SimpleSel--up:not(.SimpleSel--float) .SimpleSel__body{bottom:100%;margin-bottom:2px}.SimpleSel--open .SimpleSel__body{max-height:230px;opacity:1;visibility:visible}.SimpleSel__search_wrap{padding:5px 10px}.SimpleSel__search{border-radius:4px;border-radius:var(--simpS_radius);padding:2px 15px;padding:2px var(--simpS_pad_hor);width:100%}.SimpleSel__search--top{display:none;height:100%;left:0;opacity:0;position:absolute;top:0}.SimpleSel--open .SimpleSel__search--top{display:block;opacity:1}.SimpleSel__search--dropdown{border:none;border-bottom:1px solid;border-radius:0;height:34px;height:var(--simpS_btn_h)}.SimpleSel__controls{border-bottom:1px solid;display:-webkit-box;display:-ms-flexbox;display:flex}.SimpleSel__control{-webkit-box-flex:1;-ms-flex:1;flex:1}.SimpleSel__control+.SimpleSel__control{border-left:1px solid}.SimpleSel__select_all__icon{border-color:green;border-color:var(--simpS_color_yes);border-radius:50%;color:#d9d7d7;color:var(--simpS_color_cheked)}.SimpleSel[data-count-checked-full="0"] .SimpleSel__select_all__icon{color:#eae9e9;color:var(--simpS_color_light)}.SimpleSel[data-check-all-multi=yes] .SimpleSel__select_all__icon{color:green;color:var(--simpS_color_yes)}.SimpleSel__reset_all__icon{border-radius:50%;color:red;color:var(--simpS_color_no);position:relative}.SimpleSel__reset_all__icon:after,.SimpleSel__reset_all__icon:before{background-color:currentColor;content:" ";height:60%;left:8px;left:calc(var(--simpS_f_size)/2);position:absolute;width:2px}.SimpleSel__reset_all__icon:before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.SimpleSel__reset_all__icon:after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.SimpleSel__bottom_controls{border-top:1px solid;bottom:0;display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:5px;position:sticky}.SimpleSel__bottom_controls--hide{display:none!important}.SimpleSel__bottom_control--hide{display:none}.SimpleSel__bottom_control{-webkit-box-flex:1;-ms-flex:1;flex:1}.SimpleSel__bottom_control--ok{text-transform:uppercase}.SimpleSel__bottom_control+.SimpleSel__bottom_control{border-left:1px solid}.SimpleSel__list{list-style-type:none;margin:0;padding:0}.SimpleSel__group_items:not(:first-child){margin-top:5px}.SimpleSel__group_title{background-color:#eae9e9;background-color:var(--simpS_color_light);display:block;font-size:1.02em;font-weight:700;margin-bottom:2px;padding:6px 10px}.SimpleSel__group{list-style-type:none;margin:0;padding:0}.SimpleSel__list_item{cursor:pointer}.SimpleSel__list_item:not(:last-child){border-bottom:1px solid #eae9e9;border-bottom:1px solid var(--simpS_color_light)}.SimpleSel__list_item--disabled{cursor:default;opacity:.5}.SimpleSel__list_item_body{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;min-height:36px;min-height:var(--simpS_li_h);padding:5px 15px;padding:5px var(--simpS_pad_hor)}@media (hover:hover){.SimpleSel__list_item:not(.SimpleSel__list_item--disabled) .SimpleSel__list_item_body:hover{background-color:#eae9e9;background-color:var(--simpS_color_light);cursor:pointer}}.SimpleSel--single .SimpleSel__list_item--checked{background-color:#d9d7d7;background-color:var(--simpS_color_cheked)}.SimpleSel__list_item:not(.SimpleSel__list_item--checked) .SimpleSel__list_item_icon:before{height:0;opacity:0;width:0}.SimpleSel__close{display:none}.SimpleSel--body_open{overflow:hidden;position:relative}.SimpleSel--float .SimpleSel__body{-webkit-box-orient:vertical;-webkit-box-direction:normal;display:none;-ms-flex-direction:column;flex-direction:column;left:50%;max-height:90%;max-width:90%;overflow:hidden;overflow-y:auto;position:fixed;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.SimpleSel--open{z-index:7}.SimpleSel--float .SimpleSel__bottom_control--hide,.SimpleSel--float.SimpleSel--open .SimpleSel__body{display:-webkit-box;display:-ms-flexbox;display:flex}.SimpleSel--float .SimpleSel__list{-webkit-box-flex:1;-ms-flex:1;flex:1}
1
+ :root{--simpS_bg:#fff;--simpS_pad_hor:15px;--simpS_height_top:40px;--simpS_color:#27272a;--simpS_color_light:#eae9e9;--simpS_color_cheked:#d9d7d7;--simpS_color_yes:green;--simpS_color_no:red;--simpS_color_placeholder:#5d5c5c;--simpS_color_dis:#8b8b8b;--simpS_radius:4px;--simpS_f_size:16px;--simpS_f_shadow:0 0 3px 0 var(--simpS_color);--simpS_size_check:20px;--simpS_li_h:36px;--simpS_btn_h:34px;--simpS_btn_bg:#f9f9f9;--simpS_btn_bg_reverse:#eeecec}.SimpleSel{-webkit-box-sizing:border-box;box-sizing:border-box;color:#27272a;color:var(--simpS_color);font-size:16px;font-size:var(--simpS_f_size);position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.SimpleSel--disabled{color:#8b8b8b;color:var(--simpS_color_dis);opacity:.8}.SimpleSel *,.SimpleSel :after,.SimpleSel :before{-webkit-box-sizing:border-box;box-sizing:border-box}.SimpleSel--float .SimpleSel__select_init{visibility:hidden}.SimpleSel__select_init{-webkit-box-sizing:border-box;box-sizing:border-box;height:100%;opacity:0;position:absolute;right:0;top:0;width:100%}.SimpleSel__select_init--native{z-index:5}.SimpleSel__bottom_control,.SimpleSel__control{-webkit-font-smoothing:inherit;-moz-osx-font-smoothing:inherit;-ms-flex-line-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-content:center;align-items:center;-webkit-appearance:none;background-color:#f9f9f9;background-color:var(--simpS_btn_bg);border:none;border-radius:0;color:inherit;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;font:inherit;height:34px;height:var(--simpS_btn_h);justify-content:center;line-height:normal;margin:0;outline:none;overflow:visible;padding:1px 10px;text-align:center;width:auto}.SimpleSel__bottom_control:hover,.SimpleSel__control:hover{background-color:#eeecec;background-color:var(--simpS_btn_bg_reverse)}.SimpleSel__list_item_icon,.SimpleSel__reset_all__icon,.SimpleSel__select_all__icon{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;border:1px solid;border-radius:4px;border-radius:var(--simpS_radius);display:-webkit-box;display:-ms-flexbox;display:flex;height:20px;height:var(--simpS_size_check);justify-content:center;margin-right:7px;position:relative;width:20px;width:var(--simpS_size_check)}.SimpleSel__list_item_icon:before,.SimpleSel__select_all__icon:before{border:solid;border-width:0 2px 2px 0;content:"";display:block;height:11px;height:calc(var(--simpS_size_check)/2 + 1px);left:4px;top:1px;-webkit-transform:rotate(45deg) translate(-17%,-10%);transform:rotate(45deg) translate(-17%,-10%);-webkit-transition:all .25s;transition:all .25s;width:6.66667px;width:calc(var(--simpS_size_check)/3)}.SimpleSel__top{position:relative}.SimpleSel__top_body{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;background-color:#fff;background-color:var(--simpS_bg);border:2px solid;border-radius:4px;border-radius:var(--simpS_radius);color:currentColor;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;height:40px;height:var(--simpS_height_top);justify-content:space-between;padding:5px 0 5px 15px;padding:5px 0 5px var(--simpS_pad_hor);position:relative}.SimpleSel--disabled .SimpleSel__top_body{cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.SimpleSel__top_body:focus-visible{-webkit-box-shadow:0 0 3px 0 #27272a;box-shadow:0 0 3px 0 #27272a;-webkit-box-shadow:var(--simpS_f_shadow);box-shadow:var(--simpS_f_shadow)}.SimpleSel__title{-webkit-box-flex:1;-ms-flex:1;flex:1;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.SimpleSel__icon{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;height:40px;height:var(--simpS_height_top);justify-content:center;position:relative;width:40px;width:var(--simpS_height_top)}.SimpleSel__icon:after{border-bottom:2px solid;border-right:2px solid;content:"";display:inline;height:.5em;left:50%;position:absolute;top:calc(50% - 2px);-webkit-transform:rotate(45deg) translate(-50%,-50%);transform:rotate(45deg) translate(-50%,-50%);-webkit-transform-origin:left top;transform-origin:left top;-webkit-transition:transform .25s,top .25s;transition:transform .25s,top .25s;width:.5em}.SimpleSel--open .SimpleSel__icon:after{top:calc(50% + 2px);-webkit-transform:rotate(225deg) translate(-50%,-50%);transform:rotate(225deg) translate(-50%,-50%)}.SimpleSel--always_open .SimpleSel__icon{display:none}.SimpleSel--single[data-count-checked-full="0"] .SimpleSel__title,.SimpleSel__list_item--not_value,.SimpleSel__title--placeholder{color:#5d5c5c;color:var(--simpS_color_placeholder)}.SimpleSel__body{background-color:#fff;background-color:var(--simpS_bg);border:1px solid;border-radius:4px;border-radius:var(--simpS_radius);max-height:0;opacity:0;overflow:hidden;overflow-y:auto;position:absolute;-webkit-transition:all .25s;transition:all .25s;visibility:hidden;width:100%;z-index:3}.SimpleSel--body-always_open{max-height:none;opacity:1;position:relative;top:auto;visibility:visible}.SimpleSel:not(.SimpleSel--up) .SimpleSel--multi{margin-top:2px;top:100%}.SimpleSel--up:not(.SimpleSel--float) .SimpleSel__body{bottom:100%;margin-bottom:2px}.SimpleSel--open .SimpleSel__body{max-height:230px;opacity:1;visibility:visible}.SimpleSel__search_wrap{padding:5px 10px}.SimpleSel__search{border-radius:4px;border-radius:var(--simpS_radius);padding:2px 15px;padding:2px var(--simpS_pad_hor);width:100%}.SimpleSel__search--top{display:none;height:100%;left:0;opacity:0;position:absolute;top:0}.SimpleSel--open .SimpleSel__search--top{display:block;opacity:1}.SimpleSel__search--dropdown{border:none;border-bottom:1px solid;border-radius:0;height:34px;height:var(--simpS_btn_h)}.SimpleSel__controls{border-bottom:1px solid;display:-webkit-box;display:-ms-flexbox;display:flex}.SimpleSel__control{-webkit-box-flex:1;-ms-flex:1;flex:1}.SimpleSel__control+.SimpleSel__control{border-left:1px solid}.SimpleSel__select_all__icon{border-color:green;border-color:var(--simpS_color_yes);border-radius:50%;color:#d9d7d7;color:var(--simpS_color_cheked)}.SimpleSel[data-count-checked-full="0"] .SimpleSel__select_all__icon{color:#eae9e9;color:var(--simpS_color_light)}.SimpleSel[data-check-all-multi=yes] .SimpleSel__select_all__icon{color:green;color:var(--simpS_color_yes)}.SimpleSel__reset_all__icon{border-radius:50%;color:red;color:var(--simpS_color_no);position:relative}.SimpleSel__reset_all__icon:after,.SimpleSel__reset_all__icon:before{background-color:currentColor;content:" ";height:60%;left:8px;left:calc(var(--simpS_f_size)/2);position:absolute;width:2px}.SimpleSel__reset_all__icon:before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.SimpleSel__reset_all__icon:after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.SimpleSel__bottom_controls{border-top:1px solid;bottom:0;display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:5px;position:sticky}.SimpleSel__bottom_controls--hide{display:none}.SimpleSel--float .SimpleSel__bottom_controls--hide{display:-webkit-box;display:-ms-flexbox;display:flex}.SimpleSel__bottom_control--hide{display:none}.SimpleSel__bottom_control{-webkit-box-flex:1;-ms-flex:1;flex:1}.SimpleSel__bottom_control--ok{text-transform:uppercase}.SimpleSel__bottom_control+.SimpleSel__bottom_control{border-left:1px solid}.SimpleSel__list{list-style-type:none;margin:0;padding:0}.SimpleSel__group_items:not(:first-child){margin-top:5px}.SimpleSel__group_title{background-color:#eae9e9;background-color:var(--simpS_color_light);display:block;font-size:1.02em;font-weight:700;margin-bottom:2px;padding:6px 10px}.SimpleSel__group{list-style-type:none;margin:0;padding:0}.SimpleSel__list_item{cursor:pointer}.SimpleSel__list_item:not(:last-child){border-bottom:1px solid #eae9e9;border-bottom:1px solid var(--simpS_color_light)}.SimpleSel__list_item--disabled{cursor:default;opacity:.5}.SimpleSel__list_item_body{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;min-height:36px;min-height:var(--simpS_li_h);padding:5px 15px;padding:5px var(--simpS_pad_hor)}@media (hover:hover){.SimpleSel__list_item:not(.SimpleSel__list_item--disabled) .SimpleSel__list_item_body:hover{background-color:#eae9e9;background-color:var(--simpS_color_light);cursor:pointer}}.SimpleSel--single .SimpleSel__list_item--checked{background-color:#d9d7d7;background-color:var(--simpS_color_cheked)}.SimpleSel__list_item:not(.SimpleSel__list_item--checked) .SimpleSel__list_item_icon:before{height:0;opacity:0;width:0}.SimpleSel__close{display:none}.SimpleSel--body_open{overflow:hidden;position:relative}.SimpleSel--float .SimpleSel__body{-webkit-box-orient:vertical;-webkit-box-direction:normal;display:none;-ms-flex-direction:column;flex-direction:column;left:50%;max-height:90%;max-width:90%;overflow:hidden;overflow-y:auto;position:fixed;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.SimpleSel--open{z-index:7}.SimpleSel--float .SimpleSel__bottom_control--hide,.SimpleSel--float.SimpleSel--open .SimpleSel__body{display:-webkit-box;display:-ms-flexbox;display:flex}.SimpleSel--float .SimpleSel__list{-webkit-box-flex:1;-ms-flex:1;flex:1}
package/dist/types/item.types.d.ts CHANGED
@@ -22,3 +22,9 @@ export interface ICreateLiReturn {
22
22
  countCheckedFull: number;
23
23
  }
24
24
  export type selectorType = string | HTMLSelectElement | NodeListOf<HTMLSelectElement> | HTMLSelectElement[];
25
+ export interface IHistoryItem {
26
+ value: string;
27
+ text: string;
28
+ selected: boolean;
29
+ indexOption: number;
30
+ }
package/dist/types/simpleSelect.types.d.ts CHANGED
@@ -23,6 +23,7 @@ export interface ISimpleSelectOptions {
23
23
  floatWidth?: number;
24
24
  isRemoveTop: boolean;
25
25
  sepChars: string;
26
+ historyMaxSize: number;
26
27
  selectAll: boolean;
27
28
  selectAllAfterClose: boolean;
28
29
  resetAll: boolean;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "simp-select",
3
- "version": "1.0.16",
3
+ "version": "1.0.17",
4
4
  "description": "simp-select - this plugin replaces the select",
5
5
  "main": "dist/simpleSelect.js",
6
6
  "types": "dist/simpleSelect.d.ts",
package/src/const/simpleSelection.const.ts CHANGED
@@ -19,6 +19,8 @@ export const simpleSelectionOptions: ISimpleSelectOptions = {
19
19
  countShowSelected: 3,
20
20
  isOnlyPlaceholder: false,
21
21
 
22
+ historyMaxSize: 0,
23
+
22
24
  isRemoveTop: false,
23
25
 
24
26
  isConfirmInMulti: false,
package/src/demo/index.html CHANGED
@@ -45,6 +45,26 @@
45
45
  <div id="app"></div>
46
46
 
47
47
  <div class="items">
48
+ <div class="item">
49
+ <select
50
+ multiple
51
+ data-simple-placeholder="custom width float"
52
+ data-simple-float-width="1000"
53
+ >
54
+ <option value="custom-1">custom float 1</option>
55
+ <option value="custom-2">custom float 2</option>
56
+ </select>
57
+ </div>
58
+ <div class="item">
59
+ <select
60
+ multiple
61
+ data-simple-placeholder="none float"
62
+ data-simple-float-none="true"
63
+ >
64
+ <option value="custom-none-1">none float 1</option>
65
+ <option value="custom-none-2">none float 2</option>
66
+ </select>
67
+ </div>
48
68
  <div class="item">
49
69
  <select id="select_first"
50
70
 
@@ -279,12 +299,13 @@
279
299
  // // detectNative: () => {
280
300
  // // return false;
281
301
  // // },
282
- // callbackChangeSelect: (e, that) => {
283
- // console.group();
284
- // console.log(e);
285
- // console.log(that);
286
- // console.groupEnd();
287
- // },
302
+ historyMaxSize: 2,
303
+ callbackChangeSelect: (e, that) => {
304
+ console.group();
305
+ // console.log(e);
306
+ console.log(that.history);
307
+ console.groupEnd();
308
+ },
288
309
 
289
310
  // isUp: true,
290
311
  // sepChars: ',',
package/src/simpleSelect.ts CHANGED
@@ -79,6 +79,19 @@ export default class SimpleSelect {
79
79
  createMethods(select: SimpleSelectItem) {
80
80
  const self = this;
81
81
  return {
82
+ getHistory: () => select.history,
83
+ getHistoryLast: () => {
84
+ if (select.history.length) {
85
+ return select.history[select.history.length - 1];
86
+ }
87
+ return null;
88
+ },
89
+ getHistoryFirst: () => {
90
+ if (select.history.length) {
91
+ return select.history[0];
92
+ }
93
+ return null;
94
+ },
82
95
  getNativeSelect: () => select.getSelect(),
83
96
  reload() {
84
97
  self.rebuild(select);
package/src/simpleSelectItem.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { IItemLocalOptions, ISimpleSelectOptions } from './types/simpleSelect.types';
2
- import { IOptionItems } from './types/item.types';
2
+ import { IHistoryItem, IOptionItems } from './types/item.types';
3
3
  import {
4
4
  compareObj,
5
5
  getCreateListItem,
@@ -27,6 +27,8 @@ export class SimpleSelectItem extends SimpleSelectItemDOM {
27
27
 
28
28
  timeoutDebounceId: NodeJS.Timeout | null = null;
29
29
 
30
+ history: IHistoryItem[] = [];
31
+
30
32
  constructor(select: HTMLSelectElement, options: ISimpleSelectOptions, localOptions: IItemLocalOptions) {
31
33
  super(select, options, localOptions);
32
34
 
@@ -189,7 +191,12 @@ export class SimpleSelectItem extends SimpleSelectItemDOM {
189
191
  if (!option || option.disabled) {
190
192
  return;
191
193
  }
192
- option.selected = item.dataset[toCamelCase('sel-opt-checked')] === 'true';
194
+ const isSelected = item.dataset[toCamelCase('sel-opt-checked')] === 'true';
195
+
196
+ if (isSelected !== option.selected) {
197
+ this.addHistory(option, isSelected);
198
+ }
199
+ option.selected = isSelected;
193
200
  });
194
201
  this.state.setState('isOpen', false);
195
202
  this.triggerInit();
@@ -255,6 +262,20 @@ export class SimpleSelectItem extends SimpleSelectItemDOM {
255
262
  }
256
263
  }
257
264
 
265
+ addHistory(option: HTMLOptionElement, isCheck: boolean) {
266
+ if (this.options.historyMaxSize > 0) {
267
+ this.history.push({
268
+ value: option.value,
269
+ text: option.innerHTML,
270
+ selected: isCheck,
271
+ indexOption: option.index,
272
+ });
273
+ if (this.history.length > this.options.historyMaxSize) {
274
+ this.history = this.history.slice(this.history.length - this.options.historyMaxSize);
275
+ }
276
+ }
277
+ }
278
+
258
279
  changeClickItem(item: HTMLLIElement) {
259
280
  if (item) {
260
281
  const pos = Number(item.dataset[toCamelCase('sel-position')]) || 0;
@@ -264,7 +285,9 @@ export class SimpleSelectItem extends SimpleSelectItemDOM {
264
285
  if (this.options.isConfirmInMulti || this.isFloatWidth) {
265
286
  this.changeClickItemDom(item);
266
287
  } else {
267
- option.selected = !option.selected;
288
+ const nextSelected = !option.selected;
289
+ option.selected = nextSelected;
290
+ this.addHistory(option, nextSelected);
268
291
  this.changeClickItemDom(item);
269
292
  this.createList();
270
293
  this.multiDebounceChange();
@@ -272,6 +295,7 @@ export class SimpleSelectItem extends SimpleSelectItemDOM {
272
295
  } else {
273
296
  // option.selected = !option.selected;
274
297
  option.selected = true;
298
+ this.addHistory(option, true);
275
299
  this.createList();
276
300
  this.state.setState('isOpen', false);
277
301
  this.triggerInit();
package/src/simpleSelectItemDOM.ts CHANGED
@@ -55,6 +55,8 @@ export class SimpleSelectItemDOM {
55
55
 
56
56
  elemTitle!: HTMLDivElement; // not native
57
57
 
58
+ confirmWrap: HTMLElement | null = null; // not native
59
+
58
60
  confirmOk: HTMLButtonElement | null = null; // not native
59
61
 
60
62
  confirmNo: HTMLButtonElement | null = null; // not native
@@ -171,6 +173,17 @@ export class SimpleSelectItemDOM {
171
173
  this.options.isRemoveTop = ifTrueDataAttr(this.$select.getAttribute('data-simple-remove-top'));
172
174
  }
173
175
 
176
+ if (this.$select.hasAttribute('data-simple-float-none')) {
177
+ this.isFloatWidth = false;
178
+ this.options.floatWidth = 0;
179
+ }
180
+ if (this.$select.hasAttribute('data-simple-float-width')) {
181
+ const newWidth = Number(this.$select.dataset[toCamelCase('simple-float-width')]);
182
+ if (newWidth) {
183
+ this.options.floatWidth = newWidth;
184
+ }
185
+ }
186
+
174
187
  if (this.$select.hasAttribute('data-simple-always-open')) {
175
188
  this.options.isAlwaysOpen = ifTrueDataAttr(this.$select.getAttribute('data-simple-always-open'));
176
189
 
@@ -369,13 +382,13 @@ export class SimpleSelectItemDOM {
369
382
  }
370
383
 
371
384
  private createIsConfirmInMultiHTML() {
372
- const confirm = document.createElement('div');
385
+ this.confirmWrap = document.createElement('div');
373
386
 
374
387
  const classesItem = getClass('bottom_control');
375
388
  this.confirmOk = createButton();
376
389
  this.confirmNo = createButton();
377
- confirm.appendChild(this.confirmOk);
378
- confirm.appendChild(this.confirmNo);
390
+ this.confirmWrap.appendChild(this.confirmOk);
391
+ this.confirmWrap.appendChild(this.confirmNo);
379
392
 
380
393
  this.confirmOk.innerHTML = this.options.locale.ok;
381
394
  this.confirmNo.innerHTML = this.options.locale.cansel;
@@ -387,9 +400,9 @@ export class SimpleSelectItemDOM {
387
400
  if (!this.options.isConfirmInMulti) {
388
401
  classes += ` ${getClass('hide', true, classes)}`;
389
402
  }
390
- confirm.className = classes;
403
+ this.confirmWrap.className = classes;
391
404
 
392
- this.elemDropDown?.appendChild(confirm);
405
+ this.elemDropDown?.appendChild(this.confirmWrap);
393
406
  }
394
407
 
395
408
  private createTitleHTML() {
package/src/style.css CHANGED
@@ -324,7 +324,10 @@
324
324
  bottom: 0;
325
325
  }
326
326
  .SimpleSel__bottom_controls--hide {
327
- display: none !important;
327
+ display: none;
328
+ }
329
+ .SimpleSel--float .SimpleSel__bottom_controls--hide{
330
+ display: flex;
328
331
  }
329
332
  .SimpleSel__bottom_control--hide {
330
333
  display: none;
package/src/types/item.types.ts CHANGED
@@ -24,3 +24,10 @@ export interface ICreateLiReturn {
24
24
  }
25
25
 
26
26
  export type selectorType = string | HTMLSelectElement | NodeListOf<HTMLSelectElement> | HTMLSelectElement[];
27
+
28
+ export interface IHistoryItem {
29
+ value: string;
30
+ text: string;
31
+ selected: boolean;
32
+ indexOption: number;
33
+ }
package/src/types/simpleSelect.types.ts CHANGED
@@ -32,6 +32,8 @@ export interface ISimpleSelectOptions {
32
32
 
33
33
  sepChars: string;
34
34
 
35
+ historyMaxSize: number;
36
+
35
37
  selectAll: boolean;
36
38
  selectAllAfterClose: boolean;
37
39
  resetAll: boolean;