v20.3.47 is released

Author: pipeline

components/base/CHANGELOG.md

@@ -2,13 +2,13 @@
 
 ## [Unreleased]
 
-## 20.2.44 (2022-08-16)
+## 20.3.47 (2022-09-29)
 
 ### Common
 
-#### Bug Fixes
+#### New Features
 
-- `#I385176` - The issue with the `vue-class-component` is not removed in vue 2 has been resolved.
+- `#I404540`, `#I403034`, `#F176393` - Provided the Vue 2.7 compatible support for the Vue components.
 
 ## 20.2.36 (2022-06-30)
 
@@ -19,10 +19,10 @@
 - Provided the TypeScript 4.7 compatible support for the Vue components.
 - Provided the option to register the license key by using the `npx` command. Follow these steps to register the license using the `npx` command:
 
-| The `npx` command |
+| The `npx` command | 
 |---|
-| Install the Syncfusion packages from `npm`. |
-| Add the license key either in the environment variable `SYNCFUSION_LICENSE` or in the `syncfusion-license.txt` text file. |
+| Install the Syncfusion packages from `npm`. | 
+| Add the license key either in the environment variable `SYNCFUSION_LICENSE` or in the `syncfusion-license.txt` text file. | 
 | Run the command `npx syncfusion-license activate` to automatically register the license. |
 
 ## 20.1.61 (2022-06-21)

components/base/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@syncfusion/ej2-vue-base",
-	"version": "20.2.45",
+	"version": "19.3.53",
 	"description": "A common package of Essential JS 2 base Vue libraries, methods and class definitions",
 	"author": "Syncfusion Inc.",
 	"license": "SEE LICENSE IN license",

components/base/src/component-base.ts

@@ -26,7 +26,7 @@ import Vue from 'vue';
 
  export const allVue: any = aVue;
  export const gh: any = allVue.h;
- export const isExecute: any = gh ? false : true;
+ export const isExecute: any = (parseInt(allVue.version) > 2) ? false : true;
 
  let vueImport: any;
 
@@ -85,7 +85,7 @@ import Vue from 'vue';
 
      public mounted(): void {
          let cusEle: any = this.$el ? this.$el.querySelectorAll("div.e-directive") : null;
-         if (gh && cusEle) {
+         if (!isExecute && cusEle) {
              for (let i: number = 0; i < cusEle.length; i++) {
                  cusEle[i].parentElement && cusEle[i].parentElement.removeChild(cusEle[i]);
              }

components/base/src/template.ts

@@ -9,7 +9,7 @@ import {
   getValue,
 } from "@syncfusion/ej2-base";
 
-import { aVue, allVue, gh } from "./component-base";
+import { aVue, allVue, isExecute } from "./component-base";
 
 // tslint:disable:no-any
 let stringCompiler: (
@@ -33,7 +33,7 @@ export function compile(
         innerHTML: '<div id="' + id + '"></div>',
       });
       document.body.appendChild(ele);
-      if (gh && typeof templateElement === "string") {
+      if (!isExecute && typeof templateElement === "string") {
         let vueSlot: any = getCurrentVueSlot(context.vueInstance, templateElement, root);
         if (vueSlot) {
           // Compilation for Vue 3 slot template
@@ -55,7 +55,7 @@ export function compile(
           detach(ele);
           return stringCompiler(templateElement, helper)(data);
         }
-      } else if (gh) {
+      } else if (!isExecute) {
         // Compilation for Vue 3 functional template
         let tempObj: any = templateElement.call(that, {});
         let object: any = tempObj;

components/buttons/CHANGELOG.md

@@ -2,29 +2,41 @@
 
 ## [Unreleased]
 
-## 20.2.46 (2022-08-30)
+## 20.3.47 (2022-09-29)
 
-### Checkbox
+### Floating Action Button `Preview`
 
-#### Bug Fixes
+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.
 
-- `#I399484` - The issue with aria-checked accessibility issue in angular checkbox has been fixed.
 
-## 20.2.43 (2022-08-08)
+- **Rendering** - The FAB component can be rendered as Icon only, Icon with Label, Label only, or in a disabled state.
+- **Positioning** - Supports to place various built-in positions on the target element.
+- **Styles** - The appearance of the FAB can be customized using predefined styles.
+- **Accessibility** - The FAB provides built-in compliance with the `WAI-ARIA` specifications and it is achieved through attributes.
+
+### Speed Dial `Preview`
+
+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.
+
+
+- **Rendering** - The Speed Dial component can be rendered in two display modes: Linear and Radial.
+- **Positioning** - Supports to place various built-in positions on the target element.
+- **Styles** - The appearance of the Speed Dial can be customized using predefined styles.
+- **Template Support** - The Speed Dial component action items and popup container can also be rendered with custom templates.
+- **Modal Support** - Supports showing a modal overlay behind the Speed Dial.
+- **Accessibility** - The Speed Dial provides built-in compliance with the `WAI-ARIA` specifications and it is achieved through attributes.
 
 ### Switch
 
 #### Bug Fixes
 
 - `#384387` - The issue with "Switch component click event trigger two times when we handling enable/disable dynamically" has been resolved.
 
-## 20.2.36 (2022-06-30)
-
 ### Checkbox
 
 #### Bug Fixes
 
-- `F379986` - The issue with "Screen reader reads checkbox field twice for tab keypress" has been resolved.
+- `#I399484` - The issue with aria-checked accessibility issue in angular checkbox has been fixed.
 
 ## 19.2.47 (2021-07-13)
 

components/buttons/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@syncfusion/ej2-vue-buttons",
-	"version": "20.2.46",
+	"version": "18.44.0",
 	"description": "A package of feature-rich Essential JS 2 components such as Button, CheckBox, RadioButton and Switch. for Vue",
 	"author": "Syncfusion Inc.",
 	"license": "SEE LICENSE IN license",
@@ -28,13 +28,20 @@
 		"form control",
 		"form controls",
 		"input",
+		"fab",
+		"floating button",
+		"floating action button",
+		"speeddial",
+		"floating menu",
 		"vue",
 		"vuejs",
 		"ej2-vue-buttons",
 		"vue-button",
 		"vue-checkbox",
 		"vue-radiobutton",
-		"vue-switch"
+		"vue-switch",
+		"vue-fab",
+		"vue-speeddial"
 	],
 	"repository": {
 		"type": "git",

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

@@ -1,5 +1,5 @@
 import { Options } from 'vue-class-component';
-import { ComponentBase, EJComponentDecorator, getProps, allVue, gh } from '@syncfusion/ej2-vue-base';
+import { ComponentBase, EJComponentDecorator, getProps, allVue, gh, isExecute } from '@syncfusion/ej2-vue-base';
 import { isNullOrUndefined, getValue } from '@syncfusion/ej2-base';
 
 import { Button } from '@syncfusion/ej2-buttons';
@@ -21,8 +21,6 @@ for (let props of modelProps) {
     );
 }
 
-export const isExecute: any = gh ? false : true;
-
 /**
  * Represents the Essential JS 2 VueJS Button Component
  * ```html
@@ -115,10 +113,10 @@ export class ButtonComponent extends ComponentBase {
     }
 
     public render(createElement: any) {
-        let h: any = gh || createElement;
+        let h: any = !isExecute ? gh : createElement;
         let slots: any = null;
         if(!isNullOrUndefined((this as any).$slots.default)) {
-            slots = gh ? (this as any).$slots.default() : (this as any).$slots.default;
+            slots = !isExecute ? (this as any).$slots.default() : (this as any).$slots.default;
         }
         return h('button', slots);
     }

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

@@ -1,6 +1,6 @@
 import { Options } from 'vue-class-component';
 import { isUndefined } from '@syncfusion/ej2-base';
-import { ComponentBase, EJComponentDecorator, getProps, allVue, gh } from '@syncfusion/ej2-vue-base';
+import { ComponentBase, EJComponentDecorator, getProps, allVue, gh, isExecute } from '@syncfusion/ej2-vue-base';
 import { isNullOrUndefined, getValue } from '@syncfusion/ej2-base';
 
 import { CheckBox } from '@syncfusion/ej2-buttons';
@@ -22,8 +22,6 @@ for (let props of modelProps) {
     );
 }
 
-export const isExecute: any = gh ? false : true;
-
 /**
  * Represents the Essential JS 2 VueJS CheckBox Component
  * ```html
@@ -157,10 +155,10 @@ export class CheckBoxComponent extends ComponentBase {
     }
 
     public render(createElement: any) {
-        let h: any = gh || createElement;
+        let h: any = !isExecute ? gh : createElement;
         let slots: any = null;
         if(!isNullOrUndefined((this as any).$slots.default)) {
-            slots = gh ? (this as any).$slots.default() : (this as any).$slots.default;
+            slots = !isExecute ? (this as any).$slots.default() : (this as any).$slots.default;
         }
         return h('input', slots);
     }

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

@@ -1,5 +1,5 @@
 import { Options } from 'vue-class-component';
-import { ComponentBase, EJComponentDecorator, getProps, allVue, gh } from '@syncfusion/ej2-vue-base';
+import { ComponentBase, EJComponentDecorator, getProps, allVue, gh, isExecute } from '@syncfusion/ej2-vue-base';
 import { isNullOrUndefined, getValue } from '@syncfusion/ej2-base';
 
 import { ChipList } from '@syncfusion/ej2-buttons';
@@ -22,8 +22,6 @@ for (let props of modelProps) {
     );
 }
 
-export const isExecute: any = gh ? false : true;
-
 /**
  * Represents the Essential JS 2 VueJS ChipList Component.
  * ```html
@@ -116,10 +114,10 @@ export class ChipListComponent extends ComponentBase {
     }
 
     public render(createElement: any) {
-        let h: any = gh || createElement;
+        let h: any = !isExecute ? gh : createElement;
         let slots: any = null;
         if(!isNullOrUndefined((this as any).$slots.default)) {
-            slots = gh ? (this as any).$slots.default() : (this as any).$slots.default;
+            slots = !isExecute ? (this as any).$slots.default() : (this as any).$slots.default;
         }
         return h('div', slots);
     }

components/buttons/src/chips/chips.directive.ts

@@ -1,10 +1,9 @@
-import { ComponentBase, EJComponentDecorator, allVue, gh } from '@syncfusion/ej2-vue-base';
+import { ComponentBase, EJComponentDecorator, allVue, gh, isExecute } from '@syncfusion/ej2-vue-base';
 import * as Vue3 from 'vue-class-component';
 import { Options } from 'vue-class-component';
 import { isNullOrUndefined } from '@syncfusion/ej2-base';
 import Vue from 'vue';
 // {{VueImport}}
-export const isExecute: any = gh ? false : true;
 
 let vueImport: any;
 if (!isExecute || parseInt(allVue.version) < 3) {
@@ -27,18 +26,18 @@ export class ChipsDirective extends vueImport {
         super(arguments);
     }
     public render(createElement: any): void {
-        if (gh) {
-            let h: any = gh || createElement;
+        if (!isExecute) {
+            let h: any = !isExecute ? gh : createElement;
             let slots: any = null;
             if(!isNullOrUndefined((this as any).$slots.default)) {
-                slots = gh ? (this as any).$slots.default() : (this as any).$slots.default;
+                slots = !isExecute ? (this as any).$slots.default() : (this as any).$slots.default;
             }
             return h('div', { class: 'e-directive' }, slots);
         }
         return;
     }
     public updated(): void {
-        if (gh && this.custom) {
+        if (!isExecute && this.custom) {
             this.custom();
         }
     }