vgapp 0.1.7 → 0.1.8
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.
- package/CHANGELOG.md +6 -1
- package/app/modules/vgselect/js/vgselect.js +24 -57
- package/build/vgapp.css +10 -4942
- package/build/vgapp.js +3 -4275
- package/build/vgapp.js.map +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import BaseModule from "../../base-module";
|
|
2
2
|
import {
|
|
3
|
-
execute,
|
|
4
3
|
isDisabled,
|
|
5
|
-
isEmptyObj,
|
|
4
|
+
isEmptyObj, isObject,
|
|
6
5
|
mergeDeepObject,
|
|
7
6
|
noop,
|
|
8
7
|
normalizeData,
|
|
@@ -30,8 +29,9 @@ const CLASS_NAME_CURRENT = 'vg-select-current';
|
|
|
30
29
|
const CLASS_NAME_PLACEHOLDER = 'vg-select-current--placeholder';
|
|
31
30
|
const CLASS_NAME_SEARCH = 'vg-select-search';
|
|
32
31
|
|
|
33
|
-
const
|
|
32
|
+
const EVENT_CLICK_DATA_API = `click.${NAME_KEY}.data.api`;
|
|
34
33
|
const EVENT_KEY_UP_DATA_API = `keyup.${NAME_KEY}.data.api`;
|
|
34
|
+
const EVENT_RESET_DATA_API = `reset.${NAME_KEY}.data.api`;
|
|
35
35
|
const EVENT_KEY_CHANGE = `${NAME_KEY}.change`;
|
|
36
36
|
const EVENT_KEY_HIDE = `${NAME_KEY}.hide`;
|
|
37
37
|
const EVENT_KEY_HIDDEN = `${NAME_KEY}.hidden`;
|
|
@@ -52,18 +52,10 @@ class VGSelect extends BaseModule {
|
|
|
52
52
|
this._params = this._getParams(element, mergeDeepObject({
|
|
53
53
|
search: false,
|
|
54
54
|
placeholder: '',
|
|
55
|
-
ajax: {
|
|
56
|
-
route: '',
|
|
57
|
-
target: '',
|
|
58
|
-
method: 'get',
|
|
59
|
-
loader: false,
|
|
60
|
-
},
|
|
61
|
-
render: {
|
|
62
|
-
option: noop,
|
|
63
|
-
item: noop
|
|
64
|
-
}
|
|
65
55
|
}, params));
|
|
66
56
|
|
|
57
|
+
element.parentElement.style.position = 'relative';
|
|
58
|
+
|
|
67
59
|
this._drop = Selectors.find('.' + CLASS_NAME_DROPDOWN, this._element);
|
|
68
60
|
this.refresh();
|
|
69
61
|
}
|
|
@@ -155,8 +147,6 @@ class VGSelect extends BaseModule {
|
|
|
155
147
|
VGSelect.destroy(selector);
|
|
156
148
|
}
|
|
157
149
|
|
|
158
|
-
selector.parentElement.style.position = 'relative';
|
|
159
|
-
|
|
160
150
|
if (placeholder && selector.selectedIndex === 0) {
|
|
161
151
|
option_selected = '<span class="'+ CLASS_NAME_PLACEHOLDER +'">' + placeholder + '<span>';
|
|
162
152
|
} else {
|
|
@@ -220,15 +210,6 @@ class VGSelect extends BaseModule {
|
|
|
220
210
|
return element;
|
|
221
211
|
}
|
|
222
212
|
|
|
223
|
-
render(selector, callback) {
|
|
224
|
-
let list = Selectors.find('.' + CLASS_NAME_LIST, this._drop);
|
|
225
|
-
if (list) list.remove();
|
|
226
|
-
|
|
227
|
-
VGSelect.buildListOptions(selector, this._drop);
|
|
228
|
-
|
|
229
|
-
execute(callback, [this, selector]);
|
|
230
|
-
}
|
|
231
|
-
|
|
232
213
|
toggle(relatedTarget) {
|
|
233
214
|
return !this._isShown() ? this.show(relatedTarget) : this.hide();
|
|
234
215
|
}
|
|
@@ -245,28 +226,6 @@ class VGSelect extends BaseModule {
|
|
|
245
226
|
}
|
|
246
227
|
}
|
|
247
228
|
|
|
248
|
-
// TODO доделать
|
|
249
|
-
/*this._route((status, data) => {
|
|
250
|
-
let response = normalizeData(data.response),
|
|
251
|
-
select = this._element.previousSibling;
|
|
252
|
-
|
|
253
|
-
if (response.length) {
|
|
254
|
-
Selectors.findAll('option', select).forEach(option => {
|
|
255
|
-
option.remove();
|
|
256
|
-
});
|
|
257
|
-
|
|
258
|
-
response.forEach(el => {
|
|
259
|
-
let option = document.createElement('option');
|
|
260
|
-
option.innerText = el.title;
|
|
261
|
-
Manipulator.set(option, 'value', el.id);
|
|
262
|
-
|
|
263
|
-
select.append(option);
|
|
264
|
-
});
|
|
265
|
-
|
|
266
|
-
this.render(select);
|
|
267
|
-
}
|
|
268
|
-
});*/
|
|
269
|
-
|
|
270
229
|
this._element.classList.add(CLASS_NAME_SHOW);
|
|
271
230
|
|
|
272
231
|
if (this._params.search) {
|
|
@@ -306,7 +265,7 @@ class VGSelect extends BaseModule {
|
|
|
306
265
|
this._element.classList.remove(CLASS_NAME_SHOW);
|
|
307
266
|
EventHandler.trigger(this._element, EVENT_KEY_HIDDEN, {});
|
|
308
267
|
}
|
|
309
|
-
this._queueCallback(completeCallback, this.
|
|
268
|
+
this._queueCallback(completeCallback, this._drop, true, 10);
|
|
310
269
|
}
|
|
311
270
|
|
|
312
271
|
_isShown() {
|
|
@@ -331,10 +290,6 @@ class VGSelect extends BaseModule {
|
|
|
331
290
|
});
|
|
332
291
|
}
|
|
333
292
|
|
|
334
|
-
search(select) {
|
|
335
|
-
|
|
336
|
-
}
|
|
337
|
-
|
|
338
293
|
dispose() {
|
|
339
294
|
super.dispose();
|
|
340
295
|
}
|
|
@@ -390,6 +345,14 @@ class VGSelect extends BaseModule {
|
|
|
390
345
|
VGSelect.hideOpenToggles(event)
|
|
391
346
|
}
|
|
392
347
|
|
|
348
|
+
static changeSelector(select, value, data = {}) {
|
|
349
|
+
if (!isObject(data) && isEmptyObj(data)) return;
|
|
350
|
+
|
|
351
|
+
select.value = normalizeData(value);
|
|
352
|
+
EventHandler.trigger(select, EVENT_KEY_CHANGE, {data: data});
|
|
353
|
+
EventHandler.trigger(select, 'change', {data: data});
|
|
354
|
+
}
|
|
355
|
+
|
|
393
356
|
/**
|
|
394
357
|
* Инициализация
|
|
395
358
|
* @param element
|
|
@@ -402,9 +365,9 @@ class VGSelect extends BaseModule {
|
|
|
402
365
|
}
|
|
403
366
|
}
|
|
404
367
|
|
|
405
|
-
EventHandler.on(document,
|
|
368
|
+
EventHandler.on(document, EVENT_CLICK_DATA_API, VGSelect.clearDrops);
|
|
406
369
|
|
|
407
|
-
EventHandler.on(document,
|
|
370
|
+
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function () {
|
|
408
371
|
const target = this.closest('.' + CLASS_NAME_CONTAINER);
|
|
409
372
|
|
|
410
373
|
Manipulator.set(this, 'aria-expanded', true);
|
|
@@ -418,7 +381,7 @@ EventHandler.on(document, EVENT_KEY_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, functi
|
|
|
418
381
|
instance.toggle(this);
|
|
419
382
|
});
|
|
420
383
|
|
|
421
|
-
EventHandler.on(document,
|
|
384
|
+
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_OPTION_TOGGLE, function (e) {
|
|
422
385
|
let el = e.target;
|
|
423
386
|
|
|
424
387
|
if (!el.classList.contains('disabled')) {
|
|
@@ -437,9 +400,7 @@ EventHandler.on(document, EVENT_KEY_CLICK_DATA_API, SELECTOR_OPTION_TOGGLE, func
|
|
|
437
400
|
container.classList.remove('show');
|
|
438
401
|
|
|
439
402
|
let select = container.previousSibling;
|
|
440
|
-
select.value
|
|
441
|
-
EventHandler.trigger(select, EVENT_KEY_CHANGE, {value: normalizeData(el.dataset.value)});
|
|
442
|
-
EventHandler.trigger(select, 'change', {value: normalizeData(el.dataset.value)});
|
|
403
|
+
VGSelect.changeSelector(select, el.dataset.value, {value: el.dataset.value, title: el.innerHTML})
|
|
443
404
|
}
|
|
444
405
|
});
|
|
445
406
|
|
|
@@ -472,5 +433,11 @@ EventHandler.on(document, EVENT_KEY_UP_DATA_API, SELECTOR_SEARCH_TOGGLE, functio
|
|
|
472
433
|
}
|
|
473
434
|
});
|
|
474
435
|
|
|
436
|
+
EventHandler.on(document, EVENT_RESET_DATA_API, 'form', function () {
|
|
437
|
+
Selectors.findAll('select.' + CLASS_NAME_CONTAINER, this).forEach(el => {
|
|
438
|
+
VGSelect.build(el, true)
|
|
439
|
+
});
|
|
440
|
+
});
|
|
441
|
+
|
|
475
442
|
|
|
476
443
|
export default VGSelect;
|