@syncfusion/ej2-vue-dropdowns 20.4.53 → 21.1.35
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 +0 -88
- 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 +928 -1087
- package/dist/es6/ej2-vue-dropdowns.es2015.js.map +1 -1
- package/dist/es6/ej2-vue-dropdowns.es5.js +1012 -1206
- package/dist/es6/ej2-vue-dropdowns.es5.js.map +1 -1
- package/dist/global/ej2-vue-dropdowns.min.js +2 -2
- package/package.json +9 -9
- package/src/auto-complete/autocomplete.component.d.ts +3 -36
- package/src/auto-complete/autocomplete.component.js +152 -183
- package/src/combo-box/combobox.component.d.ts +3 -36
- package/src/combo-box/combobox.component.js +152 -183
- package/src/drop-down-list/dropdownlist.component.d.ts +3 -36
- package/src/drop-down-list/dropdownlist.component.js +152 -183
- package/src/drop-down-tree/dropdowntree.component.d.ts +3 -32
- package/src/drop-down-tree/dropdowntree.component.js +140 -171
- package/src/list-box/listbox.component.d.ts +3 -44
- package/src/list-box/listbox.component.js +176 -207
- package/src/mention/mention.component.d.ts +3 -28
- package/src/mention/mention.component.js +101 -130
- package/src/multi-select/multiselect.component.d.ts +3 -38
- package/src/multi-select/multiselect.component.js +158 -189
- package/styles/bootstrap-dark.css +2 -15
- package/styles/bootstrap.css +2 -5
- package/styles/bootstrap4.css +3 -14
- package/styles/bootstrap5-dark.css +5 -8
- package/styles/bootstrap5.css +5 -8
- package/styles/drop-down-base/bootstrap-dark.css +2 -2
- package/styles/drop-down-base/bootstrap.css +2 -2
- package/styles/drop-down-base/bootstrap4.css +2 -10
- package/styles/drop-down-base/bootstrap5-dark.css +2 -2
- package/styles/drop-down-base/bootstrap5.css +2 -2
- package/styles/drop-down-base/fabric-dark.css +2 -2
- package/styles/drop-down-base/fabric.css +2 -2
- package/styles/drop-down-base/fluent-dark.css +2 -2
- package/styles/drop-down-base/fluent.css +2 -2
- package/styles/drop-down-base/highcontrast-light.css +2 -2
- package/styles/drop-down-base/highcontrast.css +2 -2
- package/styles/drop-down-base/material-dark.css +2 -2
- package/styles/drop-down-base/material.css +2 -2
- package/styles/drop-down-base/tailwind-dark.css +2 -2
- package/styles/drop-down-base/tailwind.css +2 -2
- package/styles/drop-down-list/bootstrap-dark.css +0 -3
- package/styles/drop-down-list/bootstrap.css +0 -3
- package/styles/drop-down-list/bootstrap4.css +1 -12
- package/styles/drop-down-list/bootstrap5-dark.css +0 -3
- package/styles/drop-down-list/bootstrap5.css +0 -3
- package/styles/drop-down-list/fabric-dark.css +0 -3
- package/styles/drop-down-list/fabric.css +0 -3
- package/styles/drop-down-list/fluent-dark.css +0 -3
- package/styles/drop-down-list/fluent.css +0 -3
- package/styles/drop-down-list/highcontrast-light.css +0 -3
- package/styles/drop-down-list/highcontrast.css +0 -3
- package/styles/drop-down-list/material-dark.css +1 -3
- package/styles/drop-down-list/material.css +0 -3
- package/styles/drop-down-list/tailwind-dark.css +1 -4
- package/styles/drop-down-list/tailwind.css +1 -4
- package/styles/drop-down-tree/bootstrap4.css +0 -8
- package/styles/drop-down-tree/material-dark.css +1 -0
- package/styles/fabric-dark.css +2 -15
- package/styles/fabric.css +2 -5
- package/styles/fluent-dark.css +6 -9
- package/styles/fluent.css +6 -9
- package/styles/highcontrast-light.css +9 -15
- package/styles/highcontrast.css +15 -11
- package/styles/list-box/bootstrap4.css +0 -8
- package/styles/material-dark.css +4 -15
- package/styles/material.css +2 -5
- package/styles/mention/bootstrap4.css +0 -8
- package/styles/multi-select/bootstrap4.css +0 -8
- package/styles/multi-select/bootstrap5-dark.css +3 -3
- package/styles/multi-select/bootstrap5.css +3 -3
- package/styles/multi-select/fluent-dark.css +4 -4
- package/styles/multi-select/fluent.css +4 -4
- package/styles/multi-select/highcontrast-light.css +7 -0
- package/styles/multi-select/highcontrast.css +13 -6
- package/styles/multi-select/tailwind-dark.css +2 -1
- package/styles/multi-select/tailwind.css +2 -1
- package/styles/tailwind-dark.css +5 -7
- package/styles/tailwind.css +5 -7
|
@@ -1,32 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
var extendStatics = function (d, b) {
|
|
3
|
-
extendStatics = Object.setPrototypeOf ||
|
|
4
|
-
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
5
|
-
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
|
6
|
-
return extendStatics(d, b);
|
|
7
|
-
};
|
|
8
|
-
return function (d, b) {
|
|
9
|
-
extendStatics(d, b);
|
|
10
|
-
function __() { this.constructor = d; }
|
|
11
|
-
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
12
|
-
};
|
|
13
|
-
})();
|
|
14
|
-
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
15
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
16
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
17
|
-
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;
|
|
18
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
19
|
-
};
|
|
20
|
-
import { ComponentBase, EJComponentDecorator, getProps, gh, isExecute } from '@syncfusion/ej2-vue-base';
|
|
1
|
+
import { ComponentBase, gh, getProps, isExecute, vueDefineComponent } from '@syncfusion/ej2-vue-base';
|
|
21
2
|
import { isNullOrUndefined, getValue } from '@syncfusion/ej2-base';
|
|
22
3
|
import { Mention } from '@syncfusion/ej2-dropdowns';
|
|
23
|
-
import { Options } from 'vue-class-component';
|
|
24
4
|
export var properties = ['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'];
|
|
25
5
|
export var modelProps = [];
|
|
26
6
|
export var testProp = getProps({ props: properties });
|
|
27
|
-
export var props = testProp[0];
|
|
28
|
-
export var watch = testProp[1];
|
|
29
|
-
export var emitProbs = Object.keys(watch);
|
|
7
|
+
export var props = testProp[0], watch = testProp[1], emitProbs = Object.keys(watch);
|
|
30
8
|
emitProbs.push('modelchanged', 'update:modelValue');
|
|
31
9
|
for (var _i = 0, modelProps_1 = modelProps; _i < modelProps_1.length; _i++) {
|
|
32
10
|
var props_1 = modelProps_1[_i];
|
|
@@ -38,120 +16,113 @@ for (var _i = 0, modelProps_1 = modelProps; _i < modelProps_1.length; _i++) {
|
|
|
38
16
|
* <ejs-mention :dataSource='data'></ejs-mention>
|
|
39
17
|
* ```
|
|
40
18
|
*/
|
|
41
|
-
var MentionComponent =
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
19
|
+
export var MentionComponent = vueDefineComponent({
|
|
20
|
+
name: 'MentionComponent',
|
|
21
|
+
mixins: [ComponentBase],
|
|
22
|
+
props: props,
|
|
23
|
+
watch: watch,
|
|
24
|
+
emits: emitProbs,
|
|
25
|
+
provide: function () { return { custom: this.custom }; },
|
|
26
|
+
data: function () {
|
|
27
|
+
return {
|
|
28
|
+
ej2Instances: new Mention({}),
|
|
29
|
+
propKeys: properties,
|
|
30
|
+
models: modelProps,
|
|
31
|
+
hasChildDirective: false,
|
|
32
|
+
hasInjectedModules: false,
|
|
33
|
+
tagMapper: {},
|
|
34
|
+
tagNameMapper: {},
|
|
35
|
+
isVue3: !isExecute,
|
|
36
|
+
templateCollection: {},
|
|
37
|
+
};
|
|
38
|
+
},
|
|
39
|
+
created: function () {
|
|
40
|
+
this.bindProperties();
|
|
41
|
+
this.ej2Instances._setProperties = this.ej2Instances.setProperties;
|
|
42
|
+
this.ej2Instances.setProperties = this.setProperties;
|
|
43
|
+
this.ej2Instances.clearTemplate = this.clearTemplate;
|
|
44
|
+
this.updated = this.updated;
|
|
45
|
+
},
|
|
46
|
+
render: function (createElement) {
|
|
47
|
+
var h = !isExecute ? gh : createElement;
|
|
48
|
+
var slots = null;
|
|
49
|
+
if (!isNullOrUndefined(this.$slots.default)) {
|
|
50
|
+
slots = !isExecute ? this.$slots.default() : this.$slots.default;
|
|
63
51
|
}
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
52
|
+
return h('div', slots);
|
|
53
|
+
},
|
|
54
|
+
methods: {
|
|
55
|
+
clearTemplate: function (templateNames) {
|
|
56
|
+
if (!templateNames) {
|
|
57
|
+
templateNames = Object.keys(this.templateCollection || {});
|
|
58
|
+
}
|
|
59
|
+
if (templateNames.length && this.templateCollection) {
|
|
60
|
+
for (var _i = 0, templateNames_1 = templateNames; _i < templateNames_1.length; _i++) {
|
|
61
|
+
var tempName = templateNames_1[_i];
|
|
62
|
+
var elementCollection = this.templateCollection[tempName];
|
|
63
|
+
if (elementCollection && elementCollection.length) {
|
|
64
|
+
for (var _a = 0, elementCollection_1 = elementCollection; _a < elementCollection_1.length; _a++) {
|
|
65
|
+
var ele = elementCollection_1[_a];
|
|
66
|
+
var destroy = getValue('__vue__.$destroy', ele);
|
|
67
|
+
if (destroy) {
|
|
68
|
+
ele.__vue__.$destroy();
|
|
69
|
+
}
|
|
70
|
+
if (ele.innerHTML) {
|
|
71
|
+
ele.innerHTML = '';
|
|
72
|
+
}
|
|
77
73
|
}
|
|
74
|
+
delete this.templateCollection[tempName];
|
|
78
75
|
}
|
|
79
|
-
delete this.templateCollection[tempName];
|
|
80
76
|
}
|
|
81
77
|
}
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
78
|
+
},
|
|
79
|
+
setProperties: function (prop, muteOnChange) {
|
|
80
|
+
var _this = this;
|
|
81
|
+
if (this.isVue3) {
|
|
82
|
+
this.models = !this.models ? this.ej2Instances.referModels : this.models;
|
|
83
|
+
}
|
|
84
|
+
if (this.ej2Instances && this.ej2Instances._setProperties) {
|
|
85
|
+
this.ej2Instances._setProperties(prop, muteOnChange);
|
|
86
|
+
}
|
|
87
|
+
if (prop && this.models && this.models.length) {
|
|
88
|
+
Object.keys(prop).map(function (key) {
|
|
89
|
+
_this.models.map(function (model) {
|
|
90
|
+
if ((key === model) && !(/datasource/i.test(key))) {
|
|
91
|
+
if (_this.isVue3) {
|
|
92
|
+
_this.ej2Instances.vueInstance.$emit('update:' + key, prop[key]);
|
|
93
|
+
}
|
|
94
|
+
else {
|
|
95
|
+
_this.$emit('update:' + key, prop[key]);
|
|
96
|
+
_this.$emit('modelchanged', prop[key]);
|
|
97
|
+
}
|
|
102
98
|
}
|
|
103
|
-
}
|
|
99
|
+
});
|
|
104
100
|
});
|
|
105
|
-
});
|
|
106
|
-
}
|
|
107
|
-
};
|
|
108
|
-
MentionComponent.prototype.render = function (createElement) {
|
|
109
|
-
var h = !isExecute ? gh : createElement;
|
|
110
|
-
var slots = null;
|
|
111
|
-
if (!isNullOrUndefined(this.$slots.default)) {
|
|
112
|
-
slots = !isExecute ? this.$slots.default() : this.$slots.default;
|
|
113
|
-
}
|
|
114
|
-
return h('div', slots);
|
|
115
|
-
};
|
|
116
|
-
MentionComponent.prototype.custom = function () {
|
|
117
|
-
this.updated();
|
|
118
|
-
};
|
|
119
|
-
MentionComponent.prototype.addItem = function (items, itemIndex) {
|
|
120
|
-
return this.ej2Instances.addItem(items, itemIndex);
|
|
121
|
-
};
|
|
122
|
-
MentionComponent.prototype.getDataByValue = function (value) {
|
|
123
|
-
return this.ej2Instances.getDataByValue(value);
|
|
124
|
-
};
|
|
125
|
-
MentionComponent.prototype.getItems = function () {
|
|
126
|
-
return this.ej2Instances.getItems();
|
|
127
|
-
};
|
|
128
|
-
MentionComponent.prototype.hidePopup = function (e) {
|
|
129
|
-
return this.ej2Instances.hidePopup(e);
|
|
130
|
-
};
|
|
131
|
-
MentionComponent.prototype.search = function (text, positionX, positionY) {
|
|
132
|
-
return this.ej2Instances.search(text, positionX, positionY);
|
|
133
|
-
};
|
|
134
|
-
MentionComponent.prototype.showPopup = function () {
|
|
135
|
-
return this.ej2Instances.showPopup();
|
|
136
|
-
};
|
|
137
|
-
MentionComponent = __decorate([
|
|
138
|
-
EJComponentDecorator({
|
|
139
|
-
props: properties
|
|
140
|
-
}, isExecute)
|
|
141
|
-
,Options({
|
|
142
|
-
props: props,
|
|
143
|
-
watch: watch,
|
|
144
|
-
emits: emitProbs,
|
|
145
|
-
provide: function provide() {
|
|
146
|
-
return {
|
|
147
|
-
custom: this.custom
|
|
148
|
-
};
|
|
149
101
|
}
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
}
|
|
154
|
-
|
|
102
|
+
},
|
|
103
|
+
custom: function () {
|
|
104
|
+
this.updated();
|
|
105
|
+
},
|
|
106
|
+
addItem: function (items, itemIndex) {
|
|
107
|
+
return this.ej2Instances.addItem(items, itemIndex);
|
|
108
|
+
},
|
|
109
|
+
getDataByValue: function (value) {
|
|
110
|
+
return this.ej2Instances.getDataByValue(value);
|
|
111
|
+
},
|
|
112
|
+
getItems: function () {
|
|
113
|
+
return this.ej2Instances.getItems();
|
|
114
|
+
},
|
|
115
|
+
hidePopup: function (e) {
|
|
116
|
+
return this.ej2Instances.hidePopup(e);
|
|
117
|
+
},
|
|
118
|
+
search: function (text, positionX, positionY) {
|
|
119
|
+
return this.ej2Instances.search(text, positionX, positionY);
|
|
120
|
+
},
|
|
121
|
+
showPopup: function () {
|
|
122
|
+
return this.ej2Instances.showPopup();
|
|
123
|
+
},
|
|
124
|
+
}
|
|
125
|
+
});
|
|
155
126
|
export var MentionPlugin = {
|
|
156
127
|
name: 'ejs-mention',
|
|
157
128
|
install: function (Vue) {
|
|
@@ -1,50 +1,15 @@
|
|
|
1
|
-
import { ComponentBase } from '@syncfusion/ej2-vue-base';
|
|
2
1
|
export declare const properties: string[];
|
|
3
2
|
export declare const modelProps: string[];
|
|
4
3
|
export declare const testProp: any;
|
|
5
|
-
export declare const props: any;
|
|
6
|
-
export declare const watch: any;
|
|
7
|
-
export declare const emitProbs: any;
|
|
4
|
+
export declare const props: any, watch: any, emitProbs: any;
|
|
8
5
|
/**
|
|
9
6
|
* MultiSelect component allows the user to select a value from the predefined list of values.
|
|
10
7
|
* ```html
|
|
11
8
|
* <ejs-multiselect :dataSource='data'></ejs-multiselect>
|
|
12
9
|
* ```
|
|
13
10
|
*/
|
|
14
|
-
export declare
|
|
15
|
-
|
|
16
|
-
propKeys: string[];
|
|
17
|
-
models: string[];
|
|
18
|
-
hasChildDirective: boolean;
|
|
19
|
-
protected hasInjectedModules: boolean;
|
|
20
|
-
tagMapper: {
|
|
21
|
-
[key: string]: Object;
|
|
22
|
-
};
|
|
23
|
-
tagNameMapper: Object;
|
|
24
|
-
isVue3: boolean;
|
|
25
|
-
templateCollection: any;
|
|
26
|
-
constructor();
|
|
27
|
-
clearTemplate(templateNames?: string[]): any;
|
|
28
|
-
setProperties(prop: any, muteOnChange: boolean): void;
|
|
29
|
-
trigger(eventName: string, eventProp: {
|
|
30
|
-
[key: string]: Object;
|
|
31
|
-
}, successHandler?: Function): void;
|
|
32
|
-
render(createElement: any): any;
|
|
33
|
-
custom(): void;
|
|
34
|
-
addItem(items: undefined[] | undefined | string | boolean | number | string[] | boolean[] | number[], itemIndex?: number): void;
|
|
35
|
-
clear(): void;
|
|
36
|
-
filter(dataSource: undefined[] | Object | string[] | number[] | boolean[], query?: Object, fields?: Object): void;
|
|
37
|
-
focusIn(): void;
|
|
38
|
-
focusOut(): void;
|
|
39
|
-
getDataByValue(value: string | number | boolean): Object | string | number | boolean;
|
|
40
|
-
getItems(): Object[];
|
|
41
|
-
hidePopup(e?: Object | Object): void;
|
|
42
|
-
hideSpinner(): void;
|
|
43
|
-
requiredModules(): Object[];
|
|
44
|
-
selectAll(state: boolean): void;
|
|
45
|
-
showPopup(e?: Object | Object | Object): void;
|
|
46
|
-
showSpinner(): void;
|
|
47
|
-
}
|
|
11
|
+
export declare let MultiSelectComponent: any;
|
|
12
|
+
export declare type MultiSelectComponent = InstanceType<typeof MultiSelectComponent>;
|
|
48
13
|
export declare const MultiSelectPlugin: {
|
|
49
14
|
name: string;
|
|
50
15
|
install(Vue: any): void;
|