Skip to content

Commit 1d4082b

Browse files
author
pipeline
committed
v22.2.5 is released
1 parent e363f59 commit 1d4082b

File tree

1,168 files changed

+2788
-476
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

1,168 files changed

+2788
-476
lines changed

‎components/base/CHANGELOG.md

+33
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,39 @@
22

33
## [Unreleased]
44

5+
## 22.2.5 (2023-07-27)
6+
7+
### Common
8+
9+
#### Bug Fixes
10+
11+
- `#I460439` - The issue with "the Vue components create multiple app instances when using templates" has been resolved.
12+
13+
## 22.1.34 (2023-06-21)
14+
15+
### Common
16+
17+
#### New Features
18+
19+
- Provided the TypeScript 5 compatible support for the Vue components.
20+
21+
## 21.2.9 (2023-06-06)
22+
23+
### Common
24+
25+
#### Bug Fixes
26+
27+
- `#I457123` - The issue with "Unable to render Grid component using v-for and a slot template in Vue 3" has been resolved.
28+
- `#I468694` - The issue with "Unable to access the global directives in Vue 3 slot templates" has been resolved.
29+
30+
## 21.2.6 (2023-05-23)
31+
32+
### Common
33+
34+
#### Bug Fixes
35+
36+
- `#I453141` - The issue with "Unable to access the template data inside the external template while using Composition API" has been resolved.
37+
538
## 21.1.41 (2023-04-18)
639

740
### Common

‎components/base/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@syncfusion/ej2-vue-base",
3-
"version": "21.2.3",
3+
"version": "19.3.53",
44
"description": "A common package of Essential JS 2 base Vue libraries, methods and class definitions",
55
"author": "Syncfusion Inc.",
66
"license": "SEE LICENSE IN license",

‎components/base/src/component-base.ts

+2-12
Original file line numberDiff line numberDiff line change
@@ -78,18 +78,7 @@ export let ComponentBase = vueDefineComponent({
7878
this.ej2Instances.appendTo(this.$el);
7979
},
8080
updated(): void {
81-
if (this.isVue3) {
82-
this.setModelValue();
83-
}
84-
if (this.hasChildDirective) {
85-
let childKey: Object = {};
86-
this.fetchChildPropValues(childKey);
87-
let curChildDir: string = JSON.stringify(childKey);
88-
if (this.childDirObjects !== curChildDir) {
89-
this.childDirObjects = curChildDir;
90-
this.assignValueToWrapper(childKey, false);
91-
}
92-
}
81+
this.updated();
9382
},
9483
beforeDestroy(): void {
9584
this.destroyComponent();
@@ -257,6 +246,7 @@ export let ComponentBase = vueDefineComponent({
257246
let slot: any = [];
258247
let innerDirValues: any;
259248
slot = slots.default ? slots.default() : slots;
249+
slot = slot.flatMap((item: any) => Array.isArray(item.children) ? item.children : item);
260250
let items: any = {};
261251
items[`${tagName}`] = [];
262252
for (const childSlot of slot) {

‎components/base/src/template.ts

+38-32
Original file line numberDiff line numberDiff line change
@@ -20,23 +20,19 @@ export function compile(
2020
innerHTML: '<div id="' + id + '"></div>',
2121
});
2222
document.body.appendChild(ele);
23-
if (!isExecute && typeof templateElement === "string") {
23+
if (!isExecute && (typeof templateElement === "string" || (templateElement.prototype && templateElement.prototype.CSPTemplate && typeof templateElement === 'function'))) {
2424
let vueSlot: any = getCurrentVueSlot(context.vueInstance, templateElement, root);
2525
if (vueSlot) {
2626
// Compilation for Vue 3 slot template
27-
let app: any = Vue.createApp({
27+
let app: any = Vue.createVNode({
2828
render () {
2929
return vueSlot[`${templateElement}`]({ data: data });
3030
}
31-
});
32-
if (plugins) {
33-
for (let i: number = 0; i < plugins.length; i++) {
34-
app.use(plugins[parseInt(i.toString(), 10)]);
35-
}
36-
}
31+
}, plugins);
32+
ele.innerHTML = '';
3733
// Get values for Vue 3 slot template
3834
getValues(app, context.vueInstance, root);
39-
app.mount("#" + pid);
35+
Vue.render(app, ele);
4036
returnEle = ele.childNodes;
4137
detach(ele);
4238
} else {
@@ -68,9 +64,18 @@ export function compile(
6864
}
6965
let tempRef: any;
7066
if (propsData) {
71-
tempRef = (<any>Object).assign(templateCompRef.data(), propsData);
72-
} else {
73-
tempRef = (<any>Object).assign(templateCompRef.data(), dataObj.data);
67+
if (templateCompRef.setup) {
68+
tempRef = (<any>Object).assign(templateCompRef.setup(null, { expose: function () {}}), propsData);
69+
} else {
70+
tempRef = (<any>Object).assign(templateCompRef.data(), propsData);
71+
}
72+
}
73+
else {
74+
if (templateCompRef.setup) {
75+
tempRef = (<any>Object).assign(templateCompRef.setup(null, { expose: function () {}}), dataObj.data);
76+
} else {
77+
tempRef = (<any>Object).assign(templateCompRef.data(), dataObj.data);
78+
}
7479
if (templateCompRef.components) {
7580
let objkeys: any = Object.keys(templateCompRef.components) || [];
7681
for (let objstring of objkeys) {
@@ -82,19 +87,23 @@ export function compile(
8287
}
8388
}
8489
}
85-
templateCompRef.data = function () { return tempRef; };
86-
let app: any = Vue.createApp(templateCompRef);
87-
if (plugins) {
88-
for (let i: number = 0; i < plugins.length; i++) {
89-
app.use(plugins[parseInt(i.toString(), 10)]);
90+
if (templateCompRef.setup) {
91+
templateCompRef.setup = function (__props: any, { expose: __expose }: any) {
92+
__expose();
93+
const __returned__ = tempRef;
94+
Object.defineProperty(__returned__, '__isScriptSetup', { enumerable: false, value: true });
95+
return __returned__;
9096
}
9197
}
98+
templateCompRef.data = function () { return tempRef; };
99+
let app: any = Vue.createVNode(templateCompRef, plugins);
100+
ele.innerHTML = '';
92101
// Get values for Vue 3 functional template
93102
getValues(app, context.vueInstance, root);
94-
app.mount("#" + pid);
103+
Vue.render(app, ele);
95104
returnEle = ele.childNodes;
96105
detach(ele);
97-
} else if (typeof templateElement === "string") {
106+
} else if (typeof templateElement === "string" || (templateElement.prototype && templateElement.prototype.CSPTemplate && typeof templateElement === 'function')) {
98107
let vueSlot: any = getVueSlot(context.vueInstance, templateElement, root);
99108
if (vueSlot) {
100109
// Get provide values for Vue 2 slot template
@@ -140,6 +149,12 @@ export function compile(
140149
if (typeof templateFunction !== "function") {
141150
templateFunction = Vue.extend(templateFunction);
142151
}
152+
if (templateFunction.options.setup) {
153+
var variables: any = (<any>Object).assign(templateFunction.options.setup(), dataObj.data);
154+
templateFunction.options.setup = function(__props: any) {
155+
return variables;
156+
};
157+
}
143158
let templateVue: any = new templateFunction(dataObj);
144159
// let templateVue = new Vue(tempObj.template);
145160
// templateVue.$data.data = extend(tempObj.data, data);
@@ -173,13 +188,7 @@ function getValues(app: any, cInstance: any, root: any): any {
173188
return;
174189
}
175190
// Get globally defined variables.
176-
let globalVariables: string[] = ['components', 'mixins', 'provides'];
177-
for (let i: number = 0; i < globalVariables.length; i++) {
178-
let gVariable: string = globalVariables[i];
179-
if (app['_context'][gVariable] && vueInstance['$']['appContext'][gVariable]) {
180-
app['_context'][gVariable] = vueInstance['$']['appContext'][gVariable];
181-
}
182-
}
191+
app['appContext'] = vueInstance['$']['appContext'];
183192
// Get provide value from child component.
184193
let provided: any = {};
185194
let getProvideValue: any = (vueinstance: any) => {
@@ -189,12 +198,8 @@ function getValues(app: any, cInstance: any, root: any): any {
189198
}
190199
};
191200
getProvideValue(vueInstance);
192-
if (app['_context']['provides']) {
193-
app._context.provides = {...app._context.provides, ...provided};
194-
}
195-
// Get globally defined properties.
196-
if (app['_context']['config']['globalProperties'] && vueInstance['$']['appContext']['config']['globalProperties']) {
197-
app['_context']['config']['globalProperties'] = vueInstance['$']['appContext']['config']['globalProperties'];
201+
if (app['appContext']['provides']) {
202+
app.appContext.provides = {...app.appContext.provides, ...provided};
198203
}
199204
}
200205

@@ -258,6 +263,7 @@ function getChildVueSlot(slots: any, templateElement: any): any {
258263
return slots;
259264
} else if (slots && slots.default) {
260265
let childSlots: any = slots.default();
266+
childSlots = childSlots.flatMap((item: any) => Array.isArray(item.children) ? item.children : item);
261267
for (let i: number = 0; i < childSlots.length; i++) {
262268
let slot: any = getChildVueSlot(childSlots[parseInt(i.toString(), 10)].children, templateElement);
263269
if (slot) {

‎components/buttons/CHANGELOG.md

+54-22
Original file line numberDiff line numberDiff line change
@@ -2,49 +2,73 @@
22

33
## [Unreleased]
44

5-
## 21.2.3 (2023-05-03)
5+
## 22.2.5 (2023-07-27)
66

7-
### Switch
7+
### Checkbox
88

99
#### Bug Fixes
1010

11-
- `#I456259` - provided the `role` attribute support to `htmlAttributes` property of switch component.
11+
- `#I483250` - The issue with "CheckBox not working in IE 11" has been resolved.
1212

13-
## 21.1.37 (2023-03-29)
13+
## 22.1.39 (2023-07-18)
14+
15+
### Speed Dial
16+
17+
#### Bug Fixes
18+
19+
- `#I478092` - Enhanced the component's functionality, by introducing the `isPrimary` property to specify whether it is a primary button or not.
20+
21+
## 22.1.38 (2023-07-11)
22+
23+
### Switch
24+
25+
#### Bug Fixes
26+
27+
- `#I478637` - The issue with "Change event trigger twice for key down action of switch component" has been resolved.
1428

1529
### Checkbox
1630

31+
- Resolved checkbox wrapper width issue.
32+
33+
## 21.2.10 (2023-06-13)
34+
35+
### RadioButton
36+
1737
#### Bug Fixes
1838

19-
- `#I436942` - The issue with "Validation rule not display properly when we use Checkbox within form validator" has been resolved.
39+
- `#F182133` - The issue with "Correcting Ripple element is not destroyed properly while clicking on radio button component" has been resolved.
2040

21-
### Chip
41+
## 21.2.6 (2023-05-23)
2242

23-
#### New Features
43+
### RadioButton
2444

25-
- `#I422263` - The Chip component now supports htmlAttributes, which enables users to add required attributes such as 'aria-label', 'title', 'class', and more to the Chip item.
45+
#### Bug Fixes
2646

27-
### Floating Action Button `Preview`
47+
- `#I463728` - The issue with "Provide the boolean value support for radio button while using the v-model property in VUE platform" has been resolved.
2848

29-
The Floating Action Button (FAB) component performs the primary action that appears in front of all screen contents. It can be positioned in relation to a page or a target container.
49+
## 21.2.5 (2023-05-16)
3050

51+
### RadioButton
3152

32-
- **Rendering** - The FAB component can be rendered as Icon only, Icon with Label, Label only, or in a disabled state.
33-
- **Positioning** - Supports to place various built-in positions on the target element.
34-
- **Styles** - The appearance of the FAB can be customized using predefined styles.
35-
- **Accessibility** - The FAB provides built-in compliance with the `WAI-ARIA` specifications and it is achieved through attributes.
53+
#### Bug Fixes
3654

37-
### Speed Dial `Preview`
55+
- `#F182133` - The issue with "Ripple element is not destroyed properly while clicking on radio button component" has been resolved.
3856

39-
The Speed Dial component is an extension of the floating action button that displays a list of action buttons when clicked. It is useful when there is more than one primary action for the page.
57+
## 21.2.3 (2023-05-03)
4058

59+
### Switch
4160

42-
- **Rendering** - The Speed Dial component can be rendered in two display modes: Linear and Radial.
43-
- **Positioning** - Supports to place various built-in positions on the target element.
44-
- **Styles** - The appearance of the Speed Dial can be customized using predefined styles.
45-
- **Template Support** - The Speed Dial component action items and popup container can also be rendered with custom templates.
46-
- **Modal Support** - Supports showing a modal overlay behind the Speed Dial.
47-
- **Accessibility** - The Speed Dial provides built-in compliance with the `WAI-ARIA` specifications and it is achieved through attributes.
61+
#### Bug Fixes
62+
63+
- `#I456259` - provided the `role` attribute support to `htmlAttributes` property of switch component.
64+
65+
## 21.1.37 (2023-03-29)
66+
67+
### Checkbox
68+
69+
#### Bug Fixes
70+
71+
- `#I436942` - The issue with "Validation rule not display properly when we use Checkbox within form validator" has been resolved.
4872

4973
## 21.1.35 (2023-03-23)
5074

@@ -517,6 +541,14 @@ RadioButton is a graphical user interface element that allows to select one opti
517541
- **Sizes** - Provided with different sizes of RadioButton.
518542

519543

544+
## 21.1.36 (2023-06-28)
545+
546+
### Chip
547+
548+
#### New Features
549+
550+
- `#I422263` - Provided the htmlAttributes support for the Chip component.
551+
520552
## 18.4.39 (2021-01-28)
521553

522554
### RadioButton

‎components/buttons/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@syncfusion/ej2-vue-buttons",
3-
"version": "21.1.37",
3+
"version": "22.1.39",
44
"description": "A package of feature-rich Essential JS 2 components such as Button, CheckBox, RadioButton and Switch. for Vue",
55
"author": "Syncfusion Inc.",
66
"license": "SEE LICENSE IN license",

‎components/buttons/src/button/button.component.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export let ButtonComponent = vueDefineComponent({
2727
provide() { return { custom: this.custom } },
2828
data() {
2929
return {
30-
ej2Instances: new Button({}) as any,
30+
ej2Instance: new Button({}) as any,
3131
propKeys: properties as string[],
3232
models: modelProps as string[],
3333
hasChildDirective: false as boolean,

‎components/buttons/src/check-box/checkbox.component.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export let CheckBoxComponent = vueDefineComponent({
2929
provide() { return { custom: this.custom } },
3030
data() {
3131
return {
32-
ej2Instances: new CheckBox({}) as any,
32+
ej2Instance: new CheckBox({}) as any,
3333
propKeys: properties as string[],
3434
models: modelProps as string[],
3535
hasChildDirective: false as boolean,

‎components/buttons/src/chips/chiplist.component.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ export let ChipListComponent = vueDefineComponent({
2828
provide() { return { custom: this.custom } },
2929
data() {
3030
return {
31-
ej2Instances: new ChipList({}) as any,
31+
ej2Instance: new ChipList({}) as any,
3232
propKeys: properties as string[],
3333
models: modelProps as string[],
3434
hasChildDirective: true as boolean,

‎components/buttons/src/floating-action-button/fab.component.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export let FabComponent = vueDefineComponent({
2727
provide() { return { custom: this.custom } },
2828
data() {
2929
return {
30-
ej2Instances: new Fab({}) as any,
30+
ej2Instance: new Fab({}) as any,
3131
propKeys: properties as string[],
3232
models: modelProps as string[],
3333
hasChildDirective: false as boolean,

‎components/buttons/src/radio-button/radiobutton.component.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export let RadioButtonComponent = vueDefineComponent({
2929
provide() { return { custom: this.custom } },
3030
data() {
3131
return {
32-
ej2Instances: new RadioButton({}) as any,
32+
ej2Instance: new RadioButton({}) as any,
3333
propKeys: properties as string[],
3434
models: modelProps as string[],
3535
hasChildDirective: false as boolean,

‎components/buttons/src/speed-dial/speeddial.component.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { SpeedDial } from '@syncfusion/ej2-buttons';
66
import { SpeedDialItemsDirective, SpeedDialItemDirective, SpeedDialItemsPlugin, SpeedDialItemPlugin } from './items.directive'
77

88

9-
export const properties: string[] = ['isLazyUpdate', 'plugins', 'animation', 'closeIconCss', 'content', 'cssClass', 'direction', 'disabled', 'enablePersistence', 'enableRtl', 'iconPosition', 'itemTemplate', 'items', 'locale', 'modal', 'mode', 'openIconCss', 'opensOnHover', 'popupTemplate', 'position', 'radialSettings', 'target', 'visible', 'beforeClose', 'beforeItemRender', 'beforeOpen', 'clicked', 'created', 'onClose', 'onOpen'];
9+
export const properties: string[] = ['isLazyUpdate', 'plugins', 'animation', 'closeIconCss', 'content', 'cssClass', 'direction', 'disabled', 'enablePersistence', 'enableRtl', 'iconPosition', 'isPrimary', 'itemTemplate', 'items', 'locale', 'modal', 'mode', 'openIconCss', 'opensOnHover', 'popupTemplate', 'position', 'radialSettings', 'target', 'visible', 'beforeClose', 'beforeItemRender', 'beforeOpen', 'clicked', 'created', 'onClose', 'onOpen'];
1010
export const modelProps: string[] = ['visible'];
1111

1212
export const testProp: any = getProps({props: properties});
@@ -30,7 +30,7 @@ export let SpeedDialComponent = vueDefineComponent({
3030
provide() { return { custom: this.custom } },
3131
data() {
3232
return {
33-
ej2Instances: new SpeedDial({}) as any,
33+
ej2Instance: new SpeedDial({}) as any,
3434
propKeys: properties as string[],
3535
models: modelProps as string[],
3636
hasChildDirective: true as boolean,

‎components/buttons/src/switch/switch.component.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export let SwitchComponent = vueDefineComponent({
2929
provide() { return { custom: this.custom } },
3030
data() {
3131
return {
32-
ej2Instances: new Switch({}) as any,
32+
ej2Instance: new Switch({}) as any,
3333
propKeys: properties as string[],
3434
models: modelProps as string[],
3535
hasChildDirective: false as boolean,

0 commit comments

Comments
 (0)