@syncfusion/ej2-vue-dropdowns 20.2.48 → 20.3.47
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 +10 -53
- package/dist/ej2-vue-dropdowns.umd.min.js +2 -2
- package/dist/ej2-vue-dropdowns.umd.min.js.map +1 -1
- package/dist/es6/ej2-vue-dropdowns.es2015.js +191 -46
- package/dist/es6/ej2-vue-dropdowns.es2015.js.map +1 -1
- package/dist/es6/ej2-vue-dropdowns.es5.js +200 -46
- package/dist/es6/ej2-vue-dropdowns.es5.js.map +1 -1
- package/dist/global/ej2-vue-dropdowns.min.js +2 -2
- package/mention.d.ts +4 -0
- package/mention.js +4 -0
- package/package.json +8 -8
- package/src/auto-complete/autocomplete.component.d.ts +0 -1
- package/src/auto-complete/autocomplete.component.js +3 -4
- package/src/combo-box/combobox.component.d.ts +0 -1
- package/src/combo-box/combobox.component.js +3 -4
- package/src/drop-down-list/dropdownlist.component.d.ts +0 -1
- package/src/drop-down-list/dropdownlist.component.js +3 -4
- package/src/drop-down-tree/dropdowntree.component.d.ts +0 -1
- package/src/drop-down-tree/dropdowntree.component.js +3 -4
- package/src/index.d.ts +1 -0
- package/src/index.js +1 -0
- package/src/list-box/listbox.component.d.ts +0 -1
- package/src/list-box/listbox.component.js +3 -4
- package/src/mention/index.d.ts +1 -0
- package/src/mention/index.js +1 -0
- package/src/mention/mention.component.d.ts +42 -0
- package/src/mention/mention.component.js +163 -0
- package/src/multi-select/multiselect.component.d.ts +0 -1
- package/src/multi-select/multiselect.component.js +3 -4
- package/styles/auto-complete/bootstrap-dark.css +3 -1
- package/styles/auto-complete/bootstrap.css +3 -1
- package/styles/auto-complete/bootstrap4.css +3 -1
- package/styles/auto-complete/bootstrap5-dark.css +3 -1
- package/styles/auto-complete/bootstrap5.css +3 -1
- package/styles/auto-complete/fabric-dark.css +3 -1
- package/styles/auto-complete/fabric.css +3 -1
- package/styles/auto-complete/fluent-dark.css +3 -1
- package/styles/auto-complete/fluent.css +3 -1
- package/styles/auto-complete/highcontrast-light.css +3 -1
- package/styles/auto-complete/highcontrast.css +3 -1
- package/styles/auto-complete/material-dark.css +3 -1
- package/styles/auto-complete/material.css +3 -1
- package/styles/auto-complete/tailwind-dark.css +3 -1
- package/styles/auto-complete/tailwind.css +3 -1
- package/styles/bootstrap-dark.css +94 -42
- package/styles/bootstrap-dark.scss +1 -0
- package/styles/bootstrap.css +94 -42
- package/styles/bootstrap.scss +1 -0
- package/styles/bootstrap4.css +95 -42
- package/styles/bootstrap4.scss +1 -0
- package/styles/bootstrap5-dark.css +101 -44
- package/styles/bootstrap5-dark.scss +1 -0
- package/styles/bootstrap5.css +101 -44
- package/styles/bootstrap5.scss +1 -0
- package/styles/combo-box/bootstrap-dark.css +3 -1
- package/styles/combo-box/bootstrap.css +3 -1
- package/styles/combo-box/bootstrap4.css +3 -1
- package/styles/combo-box/bootstrap5-dark.css +3 -1
- package/styles/combo-box/bootstrap5.css +3 -1
- package/styles/combo-box/fabric-dark.css +3 -1
- package/styles/combo-box/fabric.css +3 -1
- package/styles/combo-box/fluent-dark.css +3 -1
- package/styles/combo-box/fluent.css +3 -1
- package/styles/combo-box/highcontrast-light.css +3 -1
- package/styles/combo-box/highcontrast.css +3 -1
- package/styles/combo-box/material-dark.css +3 -1
- package/styles/combo-box/material.css +3 -1
- package/styles/combo-box/tailwind-dark.css +3 -1
- package/styles/combo-box/tailwind.css +3 -1
- package/styles/drop-down-base/bootstrap-dark.css +42 -1
- package/styles/drop-down-base/bootstrap.css +42 -1
- package/styles/drop-down-base/bootstrap4.css +42 -1
- package/styles/drop-down-base/bootstrap5-dark.css +42 -1
- package/styles/drop-down-base/bootstrap5.css +42 -1
- package/styles/drop-down-base/fabric-dark.css +42 -1
- package/styles/drop-down-base/fabric.css +42 -1
- package/styles/drop-down-base/fluent-dark.css +42 -1
- package/styles/drop-down-base/fluent.css +42 -1
- package/styles/drop-down-base/highcontrast-light.css +42 -1
- package/styles/drop-down-base/highcontrast.css +42 -1
- package/styles/drop-down-base/material-dark.css +42 -1
- package/styles/drop-down-base/material.css +42 -1
- package/styles/drop-down-base/tailwind-dark.css +42 -1
- package/styles/drop-down-base/tailwind.css +42 -1
- package/styles/drop-down-list/bootstrap-dark.css +5 -0
- package/styles/drop-down-list/bootstrap.css +5 -0
- package/styles/drop-down-list/bootstrap4.css +5 -0
- package/styles/drop-down-list/bootstrap5-dark.css +6 -0
- package/styles/drop-down-list/bootstrap5.css +6 -0
- package/styles/drop-down-list/fabric-dark.css +5 -0
- package/styles/drop-down-list/fabric.css +5 -0
- package/styles/drop-down-list/fluent-dark.css +6 -0
- package/styles/drop-down-list/fluent.css +6 -0
- package/styles/drop-down-list/highcontrast-light.css +5 -0
- package/styles/drop-down-list/highcontrast.css +5 -0
- package/styles/drop-down-list/material-dark.css +5 -0
- package/styles/drop-down-list/material.css +5 -0
- package/styles/drop-down-list/tailwind-dark.css +6 -0
- package/styles/drop-down-list/tailwind.css +6 -0
- package/styles/drop-down-tree/bootstrap-dark.css +4 -0
- package/styles/drop-down-tree/bootstrap.css +4 -0
- package/styles/drop-down-tree/bootstrap4.css +4 -0
- package/styles/drop-down-tree/bootstrap5-dark.css +5 -0
- package/styles/drop-down-tree/bootstrap5.css +5 -0
- package/styles/drop-down-tree/fabric-dark.css +4 -0
- package/styles/drop-down-tree/fabric.css +4 -0
- package/styles/drop-down-tree/fluent-dark.css +5 -0
- package/styles/drop-down-tree/fluent.css +5 -0
- package/styles/drop-down-tree/highcontrast-light.css +4 -0
- package/styles/drop-down-tree/highcontrast.css +4 -0
- package/styles/drop-down-tree/material-dark.css +4 -0
- package/styles/drop-down-tree/material.css +4 -0
- package/styles/drop-down-tree/tailwind-dark.css +5 -0
- package/styles/drop-down-tree/tailwind.css +5 -0
- package/styles/fabric-dark.css +94 -42
- package/styles/fabric-dark.scss +1 -0
- package/styles/fabric.css +94 -42
- package/styles/fabric.scss +1 -0
- package/styles/fluent-dark.css +101 -44
- package/styles/fluent-dark.scss +1 -0
- package/styles/fluent.css +101 -44
- package/styles/fluent.scss +1 -0
- package/styles/highcontrast-light.css +97 -42
- package/styles/highcontrast-light.scss +1 -0
- package/styles/highcontrast.css +97 -42
- package/styles/highcontrast.scss +1 -0
- package/styles/list-box/bootstrap-dark.css +12 -33
- package/styles/list-box/bootstrap.css +14 -35
- package/styles/list-box/bootstrap4.css +14 -35
- package/styles/list-box/bootstrap5-dark.css +15 -36
- package/styles/list-box/bootstrap5.css +15 -36
- package/styles/list-box/fabric-dark.css +12 -33
- package/styles/list-box/fabric.css +14 -35
- package/styles/list-box/fluent-dark.css +15 -36
- package/styles/list-box/fluent.css +15 -36
- package/styles/list-box/highcontrast-light.css +12 -33
- package/styles/list-box/highcontrast.css +14 -35
- package/styles/list-box/material-dark.css +12 -33
- package/styles/list-box/material.css +14 -35
- package/styles/list-box/tailwind-dark.css +15 -36
- package/styles/list-box/tailwind.css +15 -36
- package/styles/material-dark.css +94 -42
- package/styles/material-dark.scss +1 -0
- package/styles/material.css +94 -42
- package/styles/material.scss +1 -0
- package/styles/mention/bootstrap-dark.css +29 -0
- package/styles/mention/bootstrap-dark.scss +1 -0
- package/styles/mention/bootstrap.css +29 -0
- package/styles/mention/bootstrap.scss +1 -0
- package/styles/mention/bootstrap4.css +47 -0
- package/styles/mention/bootstrap4.scss +1 -0
- package/styles/mention/bootstrap5-dark.css +58 -0
- package/styles/mention/bootstrap5-dark.scss +1 -0
- package/styles/mention/bootstrap5.css +58 -0
- package/styles/mention/bootstrap5.scss +1 -0
- package/styles/mention/fabric-dark.css +29 -0
- package/styles/mention/fabric-dark.scss +1 -0
- package/styles/mention/fabric.css +29 -0
- package/styles/mention/fabric.scss +1 -0
- package/styles/mention/fluent-dark.css +58 -0
- package/styles/mention/fluent-dark.scss +1 -0
- package/styles/mention/fluent.css +58 -0
- package/styles/mention/fluent.scss +1 -0
- package/styles/mention/highcontrast-light.css +43 -0
- package/styles/mention/highcontrast-light.scss +1 -0
- package/styles/mention/highcontrast.css +43 -0
- package/styles/mention/highcontrast.scss +1 -0
- package/styles/mention/material-dark.css +29 -0
- package/styles/mention/material-dark.scss +1 -0
- package/styles/mention/material.css +29 -0
- package/styles/mention/material.scss +1 -0
- package/styles/mention/tailwind-dark.css +68 -0
- package/styles/mention/tailwind-dark.scss +1 -0
- package/styles/mention/tailwind.css +68 -0
- package/styles/mention/tailwind.scss +1 -0
- package/styles/multi-select/bootstrap-dark.css +10 -6
- package/styles/multi-select/bootstrap.css +10 -6
- package/styles/multi-select/bootstrap4.css +10 -6
- package/styles/multi-select/bootstrap5-dark.css +11 -6
- package/styles/multi-select/bootstrap5.css +11 -6
- package/styles/multi-select/fabric-dark.css +10 -6
- package/styles/multi-select/fabric.css +10 -6
- package/styles/multi-select/fluent-dark.css +11 -6
- package/styles/multi-select/fluent.css +11 -6
- package/styles/multi-select/highcontrast-light.css +13 -6
- package/styles/multi-select/highcontrast.css +13 -6
- package/styles/multi-select/material-dark.css +10 -6
- package/styles/multi-select/material.css +10 -6
- package/styles/multi-select/tailwind-dark.css +11 -6
- package/styles/multi-select/tailwind.css +11 -6
- package/styles/tailwind-dark.css +102 -44
- package/styles/tailwind-dark.scss +1 -0
- package/styles/tailwind.css +102 -44
- package/styles/tailwind.scss +1 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { AutoComplete, ComboBox, DropDownList, DropDownTree, ListBox, MultiSelect } from '@syncfusion/ej2-dropdowns';
|
|
1
|
+
import { AutoComplete, ComboBox, DropDownList, DropDownTree, ListBox, Mention, MultiSelect } from '@syncfusion/ej2-dropdowns';
|
|
2
2
|
import { getValue, isNullOrUndefined, isUndefined } from '@syncfusion/ej2-base';
|
|
3
|
-
import { ComponentBase, EJComponentDecorator, getProps, gh } from '@syncfusion/ej2-vue-base';
|
|
3
|
+
import { ComponentBase, EJComponentDecorator, getProps, gh, isExecute } from '@syncfusion/ej2-vue-base';
|
|
4
4
|
|
|
5
5
|
var __extends = (undefined && undefined.__extends) || (function () {
|
|
6
6
|
var extendStatics = function (d, b) {
|
|
@@ -33,7 +33,6 @@ for (var _i = 0, modelProps_1 = modelProps; _i < modelProps_1.length; _i++) {
|
|
|
33
33
|
var props_1 = modelProps_1[_i];
|
|
34
34
|
emitProbs.push('update:' + props_1);
|
|
35
35
|
}
|
|
36
|
-
var isExecute = gh ? false : true;
|
|
37
36
|
/**
|
|
38
37
|
* DropDownList contains a list of predefined values from which the user can choose
|
|
39
38
|
* ```html
|
|
@@ -149,10 +148,10 @@ var DropDownListComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
149
148
|
}
|
|
150
149
|
};
|
|
151
150
|
DropDownListComponent.prototype.render = function (createElement) {
|
|
152
|
-
var h = gh
|
|
151
|
+
var h = !isExecute ? gh : createElement;
|
|
153
152
|
var slots = null;
|
|
154
153
|
if (!isNullOrUndefined(this.$slots.default)) {
|
|
155
|
-
slots =
|
|
154
|
+
slots = !isExecute ? this.$slots.default() : this.$slots.default;
|
|
156
155
|
}
|
|
157
156
|
return h('input', slots);
|
|
158
157
|
};
|
|
@@ -250,7 +249,6 @@ for (var _i$1 = 0, modelProps_1$1 = modelProps$1; _i$1 < modelProps_1$1.length;
|
|
|
250
249
|
var props_1$1 = modelProps_1$1[_i$1];
|
|
251
250
|
emitProbs$1.push('update:' + props_1$1);
|
|
252
251
|
}
|
|
253
|
-
var isExecute$1 = gh ? false : true;
|
|
254
252
|
/**
|
|
255
253
|
* ComboBox component allows the user to type a value or choose an option from the list of predefined options available
|
|
256
254
|
* ```html
|
|
@@ -267,7 +265,7 @@ var ComboBoxComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
267
265
|
_this.hasInjectedModules = false;
|
|
268
266
|
_this.tagMapper = {};
|
|
269
267
|
_this.tagNameMapper = {};
|
|
270
|
-
_this.isVue3 = !isExecute
|
|
268
|
+
_this.isVue3 = !isExecute;
|
|
271
269
|
_this.ej2Instances = new ComboBox({});
|
|
272
270
|
_this.ej2Instances._trigger = _this.ej2Instances.trigger;
|
|
273
271
|
_this.ej2Instances.trigger = _this.trigger;
|
|
@@ -327,14 +325,14 @@ var ComboBoxComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
327
325
|
}
|
|
328
326
|
};
|
|
329
327
|
ComboBoxComponent.prototype.trigger = function (eventName, eventProp, successHandler) {
|
|
330
|
-
if (!isExecute
|
|
328
|
+
if (!isExecute) {
|
|
331
329
|
this.models = !this.models ? this.ej2Instances.referModels : this.models;
|
|
332
330
|
}
|
|
333
331
|
if ((eventName === 'change' || eventName === 'input') && this.models && (this.models.length !== 0)) {
|
|
334
332
|
var key = this.models.toString().match(/checked|value/) || [];
|
|
335
333
|
var propKey = key[0];
|
|
336
334
|
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
337
|
-
if (!isExecute
|
|
335
|
+
if (!isExecute) {
|
|
338
336
|
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
339
337
|
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
340
338
|
this.ej2Instances.vueInstance.$emit('update:modelValue', eventProp[propKey]);
|
|
@@ -351,7 +349,7 @@ var ComboBoxComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
351
349
|
var key = this.models.toString().match(/currentView|selectedDate/) || [];
|
|
352
350
|
var propKey = key[0];
|
|
353
351
|
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
354
|
-
if (!isExecute
|
|
352
|
+
if (!isExecute) {
|
|
355
353
|
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
356
354
|
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
357
355
|
}
|
|
@@ -366,10 +364,10 @@ var ComboBoxComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
366
364
|
}
|
|
367
365
|
};
|
|
368
366
|
ComboBoxComponent.prototype.render = function (createElement) {
|
|
369
|
-
var h = gh
|
|
367
|
+
var h = !isExecute ? gh : createElement;
|
|
370
368
|
var slots = null;
|
|
371
369
|
if (!isNullOrUndefined(this.$slots.default)) {
|
|
372
|
-
slots =
|
|
370
|
+
slots = !isExecute ? this.$slots.default() : this.$slots.default;
|
|
373
371
|
}
|
|
374
372
|
return h('input', slots);
|
|
375
373
|
};
|
|
@@ -415,7 +413,7 @@ var ComboBoxComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
415
413
|
model: {
|
|
416
414
|
event: 'modelchanged'
|
|
417
415
|
}
|
|
418
|
-
}, isExecute
|
|
416
|
+
}, isExecute)
|
|
419
417
|
,Options({
|
|
420
418
|
props: props,
|
|
421
419
|
watch: watch,
|
|
@@ -467,7 +465,6 @@ for (var _i$2 = 0, modelProps_1$2 = modelProps$2; _i$2 < modelProps_1$2.length;
|
|
|
467
465
|
var props_1$2 = modelProps_1$2[_i$2];
|
|
468
466
|
emitProbs$2.push('update:' + props_1$2);
|
|
469
467
|
}
|
|
470
|
-
var isExecute$2 = gh ? false : true;
|
|
471
468
|
/**
|
|
472
469
|
* The AutoComplete component provides all the matched suggestion list on typing the input from which the user can select one.
|
|
473
470
|
* ```html
|
|
@@ -484,7 +481,7 @@ var AutoCompleteComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
484
481
|
_this.hasInjectedModules = false;
|
|
485
482
|
_this.tagMapper = {};
|
|
486
483
|
_this.tagNameMapper = {};
|
|
487
|
-
_this.isVue3 = !isExecute
|
|
484
|
+
_this.isVue3 = !isExecute;
|
|
488
485
|
_this.ej2Instances = new AutoComplete({});
|
|
489
486
|
_this.ej2Instances._trigger = _this.ej2Instances.trigger;
|
|
490
487
|
_this.ej2Instances.trigger = _this.trigger;
|
|
@@ -544,14 +541,14 @@ var AutoCompleteComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
544
541
|
}
|
|
545
542
|
};
|
|
546
543
|
AutoCompleteComponent.prototype.trigger = function (eventName, eventProp, successHandler) {
|
|
547
|
-
if (!isExecute
|
|
544
|
+
if (!isExecute) {
|
|
548
545
|
this.models = !this.models ? this.ej2Instances.referModels : this.models;
|
|
549
546
|
}
|
|
550
547
|
if ((eventName === 'change' || eventName === 'input') && this.models && (this.models.length !== 0)) {
|
|
551
548
|
var key = this.models.toString().match(/checked|value/) || [];
|
|
552
549
|
var propKey = key[0];
|
|
553
550
|
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
554
|
-
if (!isExecute
|
|
551
|
+
if (!isExecute) {
|
|
555
552
|
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
556
553
|
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
557
554
|
this.ej2Instances.vueInstance.$emit('update:modelValue', eventProp[propKey]);
|
|
@@ -568,7 +565,7 @@ var AutoCompleteComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
568
565
|
var key = this.models.toString().match(/currentView|selectedDate/) || [];
|
|
569
566
|
var propKey = key[0];
|
|
570
567
|
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
571
|
-
if (!isExecute
|
|
568
|
+
if (!isExecute) {
|
|
572
569
|
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
573
570
|
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
574
571
|
}
|
|
@@ -583,10 +580,10 @@ var AutoCompleteComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
583
580
|
}
|
|
584
581
|
};
|
|
585
582
|
AutoCompleteComponent.prototype.render = function (createElement) {
|
|
586
|
-
var h = gh
|
|
583
|
+
var h = !isExecute ? gh : createElement;
|
|
587
584
|
var slots = null;
|
|
588
585
|
if (!isNullOrUndefined(this.$slots.default)) {
|
|
589
|
-
slots =
|
|
586
|
+
slots = !isExecute ? this.$slots.default() : this.$slots.default;
|
|
590
587
|
}
|
|
591
588
|
return h('input', slots);
|
|
592
589
|
};
|
|
@@ -632,7 +629,7 @@ var AutoCompleteComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
632
629
|
model: {
|
|
633
630
|
event: 'modelchanged'
|
|
634
631
|
}
|
|
635
|
-
}, isExecute
|
|
632
|
+
}, isExecute)
|
|
636
633
|
,Options({
|
|
637
634
|
props: props,
|
|
638
635
|
watch: watch,
|
|
@@ -684,7 +681,6 @@ for (var _i$3 = 0, modelProps_1$3 = modelProps$3; _i$3 < modelProps_1$3.length;
|
|
|
684
681
|
var props_1$3 = modelProps_1$3[_i$3];
|
|
685
682
|
emitProbs$3.push('update:' + props_1$3);
|
|
686
683
|
}
|
|
687
|
-
var isExecute$3 = gh ? false : true;
|
|
688
684
|
/**
|
|
689
685
|
* MultiSelect component allows the user to select a value from the predefined list of values.
|
|
690
686
|
* ```html
|
|
@@ -701,7 +697,7 @@ var MultiSelectComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
701
697
|
_this.hasInjectedModules = true;
|
|
702
698
|
_this.tagMapper = {};
|
|
703
699
|
_this.tagNameMapper = {};
|
|
704
|
-
_this.isVue3 = !isExecute
|
|
700
|
+
_this.isVue3 = !isExecute;
|
|
705
701
|
_this.ej2Instances = new MultiSelect({});
|
|
706
702
|
_this.ej2Instances._trigger = _this.ej2Instances.trigger;
|
|
707
703
|
_this.ej2Instances.trigger = _this.trigger;
|
|
@@ -761,14 +757,14 @@ var MultiSelectComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
761
757
|
}
|
|
762
758
|
};
|
|
763
759
|
MultiSelectComponent.prototype.trigger = function (eventName, eventProp, successHandler) {
|
|
764
|
-
if (!isExecute
|
|
760
|
+
if (!isExecute) {
|
|
765
761
|
this.models = !this.models ? this.ej2Instances.referModels : this.models;
|
|
766
762
|
}
|
|
767
763
|
if ((eventName === 'change' || eventName === 'input') && this.models && (this.models.length !== 0)) {
|
|
768
764
|
var key = this.models.toString().match(/checked|value/) || [];
|
|
769
765
|
var propKey = key[0];
|
|
770
766
|
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
771
|
-
if (!isExecute
|
|
767
|
+
if (!isExecute) {
|
|
772
768
|
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
773
769
|
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
774
770
|
this.ej2Instances.vueInstance.$emit('update:modelValue', eventProp[propKey]);
|
|
@@ -785,7 +781,7 @@ var MultiSelectComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
785
781
|
var key = this.models.toString().match(/currentView|selectedDate/) || [];
|
|
786
782
|
var propKey = key[0];
|
|
787
783
|
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
788
|
-
if (!isExecute
|
|
784
|
+
if (!isExecute) {
|
|
789
785
|
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
790
786
|
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
791
787
|
}
|
|
@@ -800,10 +796,10 @@ var MultiSelectComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
800
796
|
}
|
|
801
797
|
};
|
|
802
798
|
MultiSelectComponent.prototype.render = function (createElement) {
|
|
803
|
-
var h = gh
|
|
799
|
+
var h = !isExecute ? gh : createElement;
|
|
804
800
|
var slots = null;
|
|
805
801
|
if (!isNullOrUndefined(this.$slots.default)) {
|
|
806
|
-
slots =
|
|
802
|
+
slots = !isExecute ? this.$slots.default() : this.$slots.default;
|
|
807
803
|
}
|
|
808
804
|
return h('input', slots);
|
|
809
805
|
};
|
|
@@ -855,7 +851,7 @@ var MultiSelectComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
855
851
|
model: {
|
|
856
852
|
event: 'modelchanged'
|
|
857
853
|
}
|
|
858
|
-
}, isExecute
|
|
854
|
+
}, isExecute)
|
|
859
855
|
,Options({
|
|
860
856
|
props: props,
|
|
861
857
|
watch: watch,
|
|
@@ -907,7 +903,6 @@ for (var _i$4 = 0, modelProps_1$4 = modelProps$4; _i$4 < modelProps_1$4.length;
|
|
|
907
903
|
var props_1$4 = modelProps_1$4[_i$4];
|
|
908
904
|
emitProbs$4.push('update:' + props_1$4);
|
|
909
905
|
}
|
|
910
|
-
var isExecute$4 = gh ? false : true;
|
|
911
906
|
/**
|
|
912
907
|
* ListBox component allows the user to select values from the predefined list of values.
|
|
913
908
|
* ```html
|
|
@@ -924,7 +919,7 @@ var ListBoxComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
924
919
|
_this.hasInjectedModules = true;
|
|
925
920
|
_this.tagMapper = {};
|
|
926
921
|
_this.tagNameMapper = {};
|
|
927
|
-
_this.isVue3 = !isExecute
|
|
922
|
+
_this.isVue3 = !isExecute;
|
|
928
923
|
_this.ej2Instances = new ListBox({});
|
|
929
924
|
_this.ej2Instances._trigger = _this.ej2Instances.trigger;
|
|
930
925
|
_this.ej2Instances.trigger = _this.trigger;
|
|
@@ -984,14 +979,14 @@ var ListBoxComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
984
979
|
}
|
|
985
980
|
};
|
|
986
981
|
ListBoxComponent.prototype.trigger = function (eventName, eventProp, successHandler) {
|
|
987
|
-
if (!isExecute
|
|
982
|
+
if (!isExecute) {
|
|
988
983
|
this.models = !this.models ? this.ej2Instances.referModels : this.models;
|
|
989
984
|
}
|
|
990
985
|
if ((eventName === 'change' || eventName === 'input') && this.models && (this.models.length !== 0)) {
|
|
991
986
|
var key = this.models.toString().match(/checked|value/) || [];
|
|
992
987
|
var propKey = key[0];
|
|
993
988
|
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
994
|
-
if (!isExecute
|
|
989
|
+
if (!isExecute) {
|
|
995
990
|
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
996
991
|
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
997
992
|
this.ej2Instances.vueInstance.$emit('update:modelValue', eventProp[propKey]);
|
|
@@ -1008,7 +1003,7 @@ var ListBoxComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
1008
1003
|
var key = this.models.toString().match(/currentView|selectedDate/) || [];
|
|
1009
1004
|
var propKey = key[0];
|
|
1010
1005
|
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
1011
|
-
if (!isExecute
|
|
1006
|
+
if (!isExecute) {
|
|
1012
1007
|
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
1013
1008
|
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
1014
1009
|
}
|
|
@@ -1023,10 +1018,10 @@ var ListBoxComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
1023
1018
|
}
|
|
1024
1019
|
};
|
|
1025
1020
|
ListBoxComponent.prototype.render = function (createElement) {
|
|
1026
|
-
var h = gh
|
|
1021
|
+
var h = !isExecute ? gh : createElement;
|
|
1027
1022
|
var slots = null;
|
|
1028
1023
|
if (!isNullOrUndefined(this.$slots.default)) {
|
|
1029
|
-
slots =
|
|
1024
|
+
slots = !isExecute ? this.$slots.default() : this.$slots.default;
|
|
1030
1025
|
}
|
|
1031
1026
|
return h('input', slots);
|
|
1032
1027
|
};
|
|
@@ -1096,7 +1091,7 @@ var ListBoxComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
1096
1091
|
model: {
|
|
1097
1092
|
event: 'modelchanged'
|
|
1098
1093
|
}
|
|
1099
|
-
}, isExecute
|
|
1094
|
+
}, isExecute)
|
|
1100
1095
|
,Options({
|
|
1101
1096
|
props: props,
|
|
1102
1097
|
watch: watch,
|
|
@@ -1148,7 +1143,6 @@ for (var _i$5 = 0, modelProps_1$5 = modelProps$5; _i$5 < modelProps_1$5.length;
|
|
|
1148
1143
|
var props_1$5 = modelProps_1$5[_i$5];
|
|
1149
1144
|
emitProbs$5.push('update:' + props_1$5);
|
|
1150
1145
|
}
|
|
1151
|
-
var isExecute$5 = gh ? false : true;
|
|
1152
1146
|
/**
|
|
1153
1147
|
* The DropDownTree component contains a list of predefined values from which you can choose a single or multiple values.
|
|
1154
1148
|
* ```html
|
|
@@ -1165,7 +1159,7 @@ var DropDownTreeComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
1165
1159
|
_this.hasInjectedModules = false;
|
|
1166
1160
|
_this.tagMapper = {};
|
|
1167
1161
|
_this.tagNameMapper = {};
|
|
1168
|
-
_this.isVue3 = !isExecute
|
|
1162
|
+
_this.isVue3 = !isExecute;
|
|
1169
1163
|
_this.ej2Instances = new DropDownTree({});
|
|
1170
1164
|
_this.ej2Instances._trigger = _this.ej2Instances.trigger;
|
|
1171
1165
|
_this.ej2Instances.trigger = _this.trigger;
|
|
@@ -1225,14 +1219,14 @@ var DropDownTreeComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
1225
1219
|
}
|
|
1226
1220
|
};
|
|
1227
1221
|
DropDownTreeComponent.prototype.trigger = function (eventName, eventProp, successHandler) {
|
|
1228
|
-
if (!isExecute
|
|
1222
|
+
if (!isExecute) {
|
|
1229
1223
|
this.models = !this.models ? this.ej2Instances.referModels : this.models;
|
|
1230
1224
|
}
|
|
1231
1225
|
if ((eventName === 'change' || eventName === 'input') && this.models && (this.models.length !== 0)) {
|
|
1232
1226
|
var key = this.models.toString().match(/checked|value/) || [];
|
|
1233
1227
|
var propKey = key[0];
|
|
1234
1228
|
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
1235
|
-
if (!isExecute
|
|
1229
|
+
if (!isExecute) {
|
|
1236
1230
|
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
1237
1231
|
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
1238
1232
|
this.ej2Instances.vueInstance.$emit('update:modelValue', eventProp[propKey]);
|
|
@@ -1249,7 +1243,7 @@ var DropDownTreeComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
1249
1243
|
var key = this.models.toString().match(/currentView|selectedDate/) || [];
|
|
1250
1244
|
var propKey = key[0];
|
|
1251
1245
|
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
1252
|
-
if (!isExecute
|
|
1246
|
+
if (!isExecute) {
|
|
1253
1247
|
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
1254
1248
|
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
1255
1249
|
}
|
|
@@ -1264,10 +1258,10 @@ var DropDownTreeComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
1264
1258
|
}
|
|
1265
1259
|
};
|
|
1266
1260
|
DropDownTreeComponent.prototype.render = function (createElement) {
|
|
1267
|
-
var h = gh
|
|
1261
|
+
var h = !isExecute ? gh : createElement;
|
|
1268
1262
|
var slots = null;
|
|
1269
1263
|
if (!isNullOrUndefined(this.$slots.default)) {
|
|
1270
|
-
slots =
|
|
1264
|
+
slots = !isExecute ? this.$slots.default() : this.$slots.default;
|
|
1271
1265
|
}
|
|
1272
1266
|
return h('input', slots);
|
|
1273
1267
|
};
|
|
@@ -1301,7 +1295,7 @@ var DropDownTreeComponent = /** @__PURE__ @class */ (function (_super) {
|
|
|
1301
1295
|
model: {
|
|
1302
1296
|
event: 'modelchanged'
|
|
1303
1297
|
}
|
|
1304
|
-
}, isExecute
|
|
1298
|
+
}, isExecute)
|
|
1305
1299
|
,Options({
|
|
1306
1300
|
props: props,
|
|
1307
1301
|
watch: watch,
|
|
@@ -1322,6 +1316,166 @@ var DropDownTreePlugin = {
|
|
|
1322
1316
|
}
|
|
1323
1317
|
};
|
|
1324
1318
|
|
|
1325
|
-
|
|
1319
|
+
var __extends$6 = (undefined && undefined.__extends) || (function () {
|
|
1320
|
+
var extendStatics = function (d, b) {
|
|
1321
|
+
extendStatics = Object.setPrototypeOf ||
|
|
1322
|
+
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
1323
|
+
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
|
1324
|
+
return extendStatics(d, b);
|
|
1325
|
+
};
|
|
1326
|
+
return function (d, b) {
|
|
1327
|
+
extendStatics(d, b);
|
|
1328
|
+
function __() { this.constructor = d; }
|
|
1329
|
+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
1330
|
+
};
|
|
1331
|
+
})();
|
|
1332
|
+
var __decorate$6 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
1333
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
1334
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
1335
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
1336
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
1337
|
+
};
|
|
1338
|
+
// {{VueImport}}
|
|
1339
|
+
var properties$6 = ['isLazyUpdate', 'plugins', 'allowSpaces', 'cssClass', 'dataSource', 'displayTemplate', 'fields', 'filterType', 'highlight', 'ignoreCase', 'itemTemplate', 'locale', 'mentionChar', 'minLength', 'noRecordsTemplate', 'popupHeight', 'popupWidth', 'query', 'showMentionChar', 'sortOrder', 'spinnerTemplate', 'suffixText', 'suggestionCount', 'target', 'actionBegin', 'actionComplete', 'actionFailure', 'beforeOpen', 'change', 'closed', 'created', 'destroyed', 'filtering', 'opened', 'select'];
|
|
1340
|
+
var modelProps$6 = [];
|
|
1341
|
+
var testProp$6 = getProps({ props: properties$6 });
|
|
1342
|
+
var props$6 = testProp$6[0];
|
|
1343
|
+
var watch$6 = testProp$6[1];
|
|
1344
|
+
var emitProbs$6 = Object.keys(watch$6);
|
|
1345
|
+
emitProbs$6.push('modelchanged', 'update:modelValue');
|
|
1346
|
+
for (var _i$6 = 0, modelProps_1$6 = modelProps$6; _i$6 < modelProps_1$6.length; _i$6++) {
|
|
1347
|
+
var props_1$6 = modelProps_1$6[_i$6];
|
|
1348
|
+
emitProbs$6.push('update:' + props_1$6);
|
|
1349
|
+
}
|
|
1350
|
+
/**
|
|
1351
|
+
* The Mention contains a list of predefined values from which the user can choose
|
|
1352
|
+
* ```html
|
|
1353
|
+
* <ejs-mention :dataSource='data'></ejs-dropdownlist>
|
|
1354
|
+
* ```
|
|
1355
|
+
*/
|
|
1356
|
+
var MentionComponent = /** @__PURE__ @class */ (function (_super) {
|
|
1357
|
+
__extends$6(MentionComponent, _super);
|
|
1358
|
+
function MentionComponent() {
|
|
1359
|
+
var _this = _super.call(this, arguments) || this;
|
|
1360
|
+
_this.propKeys = properties$6;
|
|
1361
|
+
_this.models = modelProps$6;
|
|
1362
|
+
_this.hasChildDirective = false;
|
|
1363
|
+
_this.hasInjectedModules = false;
|
|
1364
|
+
_this.tagMapper = {};
|
|
1365
|
+
_this.tagNameMapper = {};
|
|
1366
|
+
_this.isVue3 = !isExecute;
|
|
1367
|
+
_this.ej2Instances = new Mention({});
|
|
1368
|
+
_this.bindProperties();
|
|
1369
|
+
_this.ej2Instances._setProperties = _this.ej2Instances.setProperties;
|
|
1370
|
+
_this.ej2Instances.setProperties = _this.setProperties;
|
|
1371
|
+
_this.ej2Instances.clearTemplate = _this.clearTemplate;
|
|
1372
|
+
_this.updated = _this.updated;
|
|
1373
|
+
return _this;
|
|
1374
|
+
}
|
|
1375
|
+
MentionComponent.prototype.clearTemplate = function (templateNames) {
|
|
1376
|
+
if (!templateNames) {
|
|
1377
|
+
templateNames = Object.keys(this.templateCollection || {});
|
|
1378
|
+
}
|
|
1379
|
+
if (templateNames.length && this.templateCollection) {
|
|
1380
|
+
for (var _i = 0, templateNames_1 = templateNames; _i < templateNames_1.length; _i++) {
|
|
1381
|
+
var tempName = templateNames_1[_i];
|
|
1382
|
+
var elementCollection = this.templateCollection[tempName];
|
|
1383
|
+
if (elementCollection && elementCollection.length) {
|
|
1384
|
+
for (var _a = 0, elementCollection_1 = elementCollection; _a < elementCollection_1.length; _a++) {
|
|
1385
|
+
var ele = elementCollection_1[_a];
|
|
1386
|
+
var destroy = getValue('__vue__.$destroy', ele);
|
|
1387
|
+
if (destroy) {
|
|
1388
|
+
ele.__vue__.$destroy();
|
|
1389
|
+
}
|
|
1390
|
+
if (ele.innerHTML) {
|
|
1391
|
+
ele.innerHTML = '';
|
|
1392
|
+
}
|
|
1393
|
+
}
|
|
1394
|
+
delete this.templateCollection[tempName];
|
|
1395
|
+
}
|
|
1396
|
+
}
|
|
1397
|
+
}
|
|
1398
|
+
};
|
|
1399
|
+
MentionComponent.prototype.setProperties = function (prop, muteOnChange) {
|
|
1400
|
+
var _this = this;
|
|
1401
|
+
if (this.isVue3) {
|
|
1402
|
+
this.models = !this.models ? this.ej2Instances.referModels : this.models;
|
|
1403
|
+
}
|
|
1404
|
+
if (this.ej2Instances && this.ej2Instances._setProperties) {
|
|
1405
|
+
this.ej2Instances._setProperties(prop, muteOnChange);
|
|
1406
|
+
}
|
|
1407
|
+
if (prop && this.models && this.models.length) {
|
|
1408
|
+
Object.keys(prop).map(function (key) {
|
|
1409
|
+
_this.models.map(function (model) {
|
|
1410
|
+
if ((key === model) && !(/datasource/i.test(key))) {
|
|
1411
|
+
if (_this.isVue3) {
|
|
1412
|
+
_this.ej2Instances.vueInstance.$emit('update:' + key, prop[key]);
|
|
1413
|
+
}
|
|
1414
|
+
else {
|
|
1415
|
+
_this.$emit('update:' + key, prop[key]);
|
|
1416
|
+
_this.$emit('modelchanged', prop[key]);
|
|
1417
|
+
}
|
|
1418
|
+
}
|
|
1419
|
+
});
|
|
1420
|
+
});
|
|
1421
|
+
}
|
|
1422
|
+
};
|
|
1423
|
+
MentionComponent.prototype.render = function (createElement) {
|
|
1424
|
+
var h = !isExecute ? gh : createElement;
|
|
1425
|
+
var slots = null;
|
|
1426
|
+
if (!isNullOrUndefined(this.$slots.default)) {
|
|
1427
|
+
slots = !isExecute ? this.$slots.default() : this.$slots.default;
|
|
1428
|
+
}
|
|
1429
|
+
return h('div', slots);
|
|
1430
|
+
};
|
|
1431
|
+
MentionComponent.prototype.custom = function () {
|
|
1432
|
+
this.updated();
|
|
1433
|
+
};
|
|
1434
|
+
MentionComponent.prototype.addItem = function (items, itemIndex) {
|
|
1435
|
+
return this.ej2Instances.addItem(items, itemIndex);
|
|
1436
|
+
};
|
|
1437
|
+
MentionComponent.prototype.getDataByValue = function (value) {
|
|
1438
|
+
return this.ej2Instances.getDataByValue(value);
|
|
1439
|
+
};
|
|
1440
|
+
MentionComponent.prototype.getItems = function () {
|
|
1441
|
+
return this.ej2Instances.getItems();
|
|
1442
|
+
};
|
|
1443
|
+
MentionComponent.prototype.hidePopup = function (e) {
|
|
1444
|
+
return this.ej2Instances.hidePopup(e);
|
|
1445
|
+
};
|
|
1446
|
+
MentionComponent.prototype.hideSpinner = function () {
|
|
1447
|
+
return this.ej2Instances.hideSpinner();
|
|
1448
|
+
};
|
|
1449
|
+
MentionComponent.prototype.search = function (text, positionX, positionY) {
|
|
1450
|
+
return this.ej2Instances.search(text, positionX, positionY);
|
|
1451
|
+
};
|
|
1452
|
+
MentionComponent.prototype.showPopup = function () {
|
|
1453
|
+
return this.ej2Instances.showPopup();
|
|
1454
|
+
};
|
|
1455
|
+
MentionComponent = __decorate$6([
|
|
1456
|
+
EJComponentDecorator({
|
|
1457
|
+
props: properties$6
|
|
1458
|
+
}, isExecute)
|
|
1459
|
+
,Options({
|
|
1460
|
+
props: props,
|
|
1461
|
+
watch: watch,
|
|
1462
|
+
emits: emitProbs,
|
|
1463
|
+
provide: function provide() {
|
|
1464
|
+
return {
|
|
1465
|
+
custom: this.custom
|
|
1466
|
+
};
|
|
1467
|
+
}
|
|
1468
|
+
})
|
|
1469
|
+
], MentionComponent);
|
|
1470
|
+
return MentionComponent;
|
|
1471
|
+
}(ComponentBase));
|
|
1472
|
+
var MentionPlugin = {
|
|
1473
|
+
name: 'ejs-mention',
|
|
1474
|
+
install: function (Vue) {
|
|
1475
|
+
Vue.component(MentionPlugin.name, MentionComponent);
|
|
1476
|
+
}
|
|
1477
|
+
};
|
|
1478
|
+
|
|
1479
|
+
export { DropDownListComponent, DropDownListPlugin, ComboBoxComponent, ComboBoxPlugin, AutoCompleteComponent, AutoCompletePlugin, MultiSelectComponent, MultiSelectPlugin, ListBoxComponent, ListBoxPlugin, DropDownTreeComponent, DropDownTreePlugin, MentionComponent, MentionPlugin };
|
|
1326
1480
|
export * from '@syncfusion/ej2-dropdowns';
|
|
1327
1481
|
//# sourceMappingURL=ej2-vue-dropdowns.es5.js.map
|