@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.
Files changed (81) hide show
  1. package/CHANGELOG.md +0 -88
  2. package/dist/ej2-vue-dropdowns.umd.min.js +2 -2
  3. package/dist/ej2-vue-dropdowns.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-vue-dropdowns.es2015.js +928 -1087
  5. package/dist/es6/ej2-vue-dropdowns.es2015.js.map +1 -1
  6. package/dist/es6/ej2-vue-dropdowns.es5.js +1012 -1206
  7. package/dist/es6/ej2-vue-dropdowns.es5.js.map +1 -1
  8. package/dist/global/ej2-vue-dropdowns.min.js +2 -2
  9. package/package.json +9 -9
  10. package/src/auto-complete/autocomplete.component.d.ts +3 -36
  11. package/src/auto-complete/autocomplete.component.js +152 -183
  12. package/src/combo-box/combobox.component.d.ts +3 -36
  13. package/src/combo-box/combobox.component.js +152 -183
  14. package/src/drop-down-list/dropdownlist.component.d.ts +3 -36
  15. package/src/drop-down-list/dropdownlist.component.js +152 -183
  16. package/src/drop-down-tree/dropdowntree.component.d.ts +3 -32
  17. package/src/drop-down-tree/dropdowntree.component.js +140 -171
  18. package/src/list-box/listbox.component.d.ts +3 -44
  19. package/src/list-box/listbox.component.js +176 -207
  20. package/src/mention/mention.component.d.ts +3 -28
  21. package/src/mention/mention.component.js +101 -130
  22. package/src/multi-select/multiselect.component.d.ts +3 -38
  23. package/src/multi-select/multiselect.component.js +158 -189
  24. package/styles/bootstrap-dark.css +2 -15
  25. package/styles/bootstrap.css +2 -5
  26. package/styles/bootstrap4.css +3 -14
  27. package/styles/bootstrap5-dark.css +5 -8
  28. package/styles/bootstrap5.css +5 -8
  29. package/styles/drop-down-base/bootstrap-dark.css +2 -2
  30. package/styles/drop-down-base/bootstrap.css +2 -2
  31. package/styles/drop-down-base/bootstrap4.css +2 -10
  32. package/styles/drop-down-base/bootstrap5-dark.css +2 -2
  33. package/styles/drop-down-base/bootstrap5.css +2 -2
  34. package/styles/drop-down-base/fabric-dark.css +2 -2
  35. package/styles/drop-down-base/fabric.css +2 -2
  36. package/styles/drop-down-base/fluent-dark.css +2 -2
  37. package/styles/drop-down-base/fluent.css +2 -2
  38. package/styles/drop-down-base/highcontrast-light.css +2 -2
  39. package/styles/drop-down-base/highcontrast.css +2 -2
  40. package/styles/drop-down-base/material-dark.css +2 -2
  41. package/styles/drop-down-base/material.css +2 -2
  42. package/styles/drop-down-base/tailwind-dark.css +2 -2
  43. package/styles/drop-down-base/tailwind.css +2 -2
  44. package/styles/drop-down-list/bootstrap-dark.css +0 -3
  45. package/styles/drop-down-list/bootstrap.css +0 -3
  46. package/styles/drop-down-list/bootstrap4.css +1 -12
  47. package/styles/drop-down-list/bootstrap5-dark.css +0 -3
  48. package/styles/drop-down-list/bootstrap5.css +0 -3
  49. package/styles/drop-down-list/fabric-dark.css +0 -3
  50. package/styles/drop-down-list/fabric.css +0 -3
  51. package/styles/drop-down-list/fluent-dark.css +0 -3
  52. package/styles/drop-down-list/fluent.css +0 -3
  53. package/styles/drop-down-list/highcontrast-light.css +0 -3
  54. package/styles/drop-down-list/highcontrast.css +0 -3
  55. package/styles/drop-down-list/material-dark.css +1 -3
  56. package/styles/drop-down-list/material.css +0 -3
  57. package/styles/drop-down-list/tailwind-dark.css +1 -4
  58. package/styles/drop-down-list/tailwind.css +1 -4
  59. package/styles/drop-down-tree/bootstrap4.css +0 -8
  60. package/styles/drop-down-tree/material-dark.css +1 -0
  61. package/styles/fabric-dark.css +2 -15
  62. package/styles/fabric.css +2 -5
  63. package/styles/fluent-dark.css +6 -9
  64. package/styles/fluent.css +6 -9
  65. package/styles/highcontrast-light.css +9 -15
  66. package/styles/highcontrast.css +15 -11
  67. package/styles/list-box/bootstrap4.css +0 -8
  68. package/styles/material-dark.css +4 -15
  69. package/styles/material.css +2 -5
  70. package/styles/mention/bootstrap4.css +0 -8
  71. package/styles/multi-select/bootstrap4.css +0 -8
  72. package/styles/multi-select/bootstrap5-dark.css +3 -3
  73. package/styles/multi-select/bootstrap5.css +3 -3
  74. package/styles/multi-select/fluent-dark.css +4 -4
  75. package/styles/multi-select/fluent.css +4 -4
  76. package/styles/multi-select/highcontrast-light.css +7 -0
  77. package/styles/multi-select/highcontrast.css +13 -6
  78. package/styles/multi-select/tailwind-dark.css +2 -1
  79. package/styles/multi-select/tailwind.css +2 -1
  80. package/styles/tailwind-dark.css +5 -7
  81. package/styles/tailwind.css +5 -7
@@ -1,32 +1,10 @@
1
- var __extends = (this && this.__extends) || (function () {
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 = /** @class */ (function (_super) {
42
- __extends(MentionComponent, _super);
43
- function MentionComponent() {
44
- var _this = _super.call(this, arguments) || this;
45
- _this.propKeys = properties;
46
- _this.models = modelProps;
47
- _this.hasChildDirective = false;
48
- _this.hasInjectedModules = false;
49
- _this.tagMapper = {};
50
- _this.tagNameMapper = {};
51
- _this.isVue3 = !isExecute;
52
- _this.ej2Instances = new Mention({});
53
- _this.bindProperties();
54
- _this.ej2Instances._setProperties = _this.ej2Instances.setProperties;
55
- _this.ej2Instances.setProperties = _this.setProperties;
56
- _this.ej2Instances.clearTemplate = _this.clearTemplate;
57
- _this.updated = _this.updated;
58
- return _this;
59
- }
60
- MentionComponent.prototype.clearTemplate = function (templateNames) {
61
- if (!templateNames) {
62
- templateNames = Object.keys(this.templateCollection || {});
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
- if (templateNames.length && this.templateCollection) {
65
- for (var _i = 0, templateNames_1 = templateNames; _i < templateNames_1.length; _i++) {
66
- var tempName = templateNames_1[_i];
67
- var elementCollection = this.templateCollection[tempName];
68
- if (elementCollection && elementCollection.length) {
69
- for (var _a = 0, elementCollection_1 = elementCollection; _a < elementCollection_1.length; _a++) {
70
- var ele = elementCollection_1[_a];
71
- var destroy = getValue('__vue__.$destroy', ele);
72
- if (destroy) {
73
- ele.__vue__.$destroy();
74
- }
75
- if (ele.innerHTML) {
76
- ele.innerHTML = '';
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
- MentionComponent.prototype.setProperties = function (prop, muteOnChange) {
85
- var _this = this;
86
- if (this.isVue3) {
87
- this.models = !this.models ? this.ej2Instances.referModels : this.models;
88
- }
89
- if (this.ej2Instances && this.ej2Instances._setProperties) {
90
- this.ej2Instances._setProperties(prop, muteOnChange);
91
- }
92
- if (prop && this.models && this.models.length) {
93
- Object.keys(prop).map(function (key) {
94
- _this.models.map(function (model) {
95
- if ((key === model) && !(/datasource/i.test(key))) {
96
- if (_this.isVue3) {
97
- _this.ej2Instances.vueInstance.$emit('update:' + key, prop[key]);
98
- }
99
- else {
100
- _this.$emit('update:' + key, prop[key]);
101
- _this.$emit('modelchanged', prop[key]);
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
- ], MentionComponent);
152
- return MentionComponent;
153
- }(ComponentBase));
154
- export { MentionComponent };
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 class MultiSelectComponent extends ComponentBase {
15
- ej2Instances: any;
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;