v19.3.43 is released

Author: pipeline

components/barcodegenerator/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@syncfusion/ej2-vue-barcode-generator",
-	"version": "19.1.63",
+	"version": "19.1.66",
 	"description": "Barcode generator component is a pure JavaScript library which will convert a string to Barcode and show it to the user. This supports major 1D and 2D barcodes including coda bar, code 128, QR Code. for Vue",
 	"author": "Syncfusion Inc.",
 	"license": "SEE LICENSE IN license",

components/barcodegenerator/src/barcode-generator/barcodegenerator.component.ts

@@ -1,6 +1,6 @@
 import { Options } from 'vue-class-component';
 import { ComponentBase, EJComponentDecorator, getProps, allVue, gh } from '@syncfusion/ej2-vue-base';
-import { isNullOrUndefined } from '@syncfusion/ej2-base';
+import { isNullOrUndefined, getValue } from '@syncfusion/ej2-base';
 
 import { BarcodeGenerator } from '@syncfusion/ej2-barcode-generator';
 
@@ -49,15 +49,42 @@ export class BarcodeGeneratorComponent extends ComponentBase {
     public tagMapper: { [key: string]: Object } = {};
     public tagNameMapper: Object = {};
     public isVue3: boolean;
-    
+    public templateCollection: any;
     constructor() {
         super(arguments);
         this.isVue3 = !isExecute;
         this.ej2Instances = new BarcodeGenerator({});
         this.bindProperties();
         this.ej2Instances._setProperties = this.ej2Instances.setProperties;
         this.ej2Instances.setProperties = this.setProperties;
+        this.ej2Instances.clearTemplate = this.clearTemplate;
+    }
+
+ public clearTemplate(templateNames?: string[]): any {
+    if (!templateNames){
+       templateNames = Object.keys(this.templateCollection || {});
+    }
+    if (templateNames.length &&  this.templateCollection) {
+    for (let tempName of templateNames){
+       let elementCollection: any = this.templateCollection[tempName];
+       if(elementCollection && elementCollection.length) {
+       for(let ele of elementCollection) {
+           let destroy: any = getValue('__vue__.$destroy', ele);
+           if (destroy) {
+               ele.__vue__.$destroy();
+           }
+           if (ele.innerHTML){
+               ele.innerHTML = '';
+           }
+       }
+       delete this.templateCollection[tempName];
+       }
     }
+}
+ }
+
+
+
     public setProperties(prop: any, muteOnChange: boolean): void {
         if(this.isVue3) {
             this.models = !this.models ? this.ej2Instances.referModels : this.models;
@@ -73,6 +100,7 @@ export class BarcodeGeneratorComponent extends ComponentBase {
                             this.ej2Instances.vueInstance.$emit('update:' + key, prop[key]);
                         } else {
                             (this as any).$emit('update:' + key, prop[key]);
+                            (this as any).$emit('modelchanged', prop[key]);
                         }
                     }
                 });

components/barcodegenerator/src/datamatrix-generator/datamatrixgenerator.component.ts

@@ -1,6 +1,6 @@
 import { Options } from 'vue-class-component';
 import { ComponentBase, EJComponentDecorator, getProps, allVue, gh } from '@syncfusion/ej2-vue-base';
-import { isNullOrUndefined } from '@syncfusion/ej2-base';
+import { isNullOrUndefined, getValue } from '@syncfusion/ej2-base';
 
 import { DataMatrixGenerator } from '@syncfusion/ej2-barcode-generator';
 
@@ -49,15 +49,42 @@ export class DataMatrixGeneratorComponent extends ComponentBase {
     public tagMapper: { [key: string]: Object } = {};
     public tagNameMapper: Object = {};
     public isVue3: boolean;
-    
+    public templateCollection: any;
     constructor() {
         super(arguments);
         this.isVue3 = !isExecute;
         this.ej2Instances = new DataMatrixGenerator({});
         this.bindProperties();
         this.ej2Instances._setProperties = this.ej2Instances.setProperties;
         this.ej2Instances.setProperties = this.setProperties;
+        this.ej2Instances.clearTemplate = this.clearTemplate;
+    }
+
+ public clearTemplate(templateNames?: string[]): any {
+    if (!templateNames){
+       templateNames = Object.keys(this.templateCollection || {});
+    }
+    if (templateNames.length &&  this.templateCollection) {
+    for (let tempName of templateNames){
+       let elementCollection: any = this.templateCollection[tempName];
+       if(elementCollection && elementCollection.length) {
+       for(let ele of elementCollection) {
+           let destroy: any = getValue('__vue__.$destroy', ele);
+           if (destroy) {
+               ele.__vue__.$destroy();
+           }
+           if (ele.innerHTML){
+               ele.innerHTML = '';
+           }
+       }
+       delete this.templateCollection[tempName];
+       }
     }
+}
+ }
+
+
+
     public setProperties(prop: any, muteOnChange: boolean): void {
         if(this.isVue3) {
             this.models = !this.models ? this.ej2Instances.referModels : this.models;
@@ -73,6 +100,7 @@ export class DataMatrixGeneratorComponent extends ComponentBase {
                             this.ej2Instances.vueInstance.$emit('update:' + key, prop[key]);
                         } else {
                             (this as any).$emit('update:' + key, prop[key]);
+                            (this as any).$emit('modelchanged', prop[key]);
                         }
                     }
                 });

components/barcodegenerator/src/qrcode-generator/qrcodegenerator.component.ts

@@ -1,6 +1,6 @@
 import { Options } from 'vue-class-component';
 import { ComponentBase, EJComponentDecorator, getProps, allVue, gh } from '@syncfusion/ej2-vue-base';
-import { isNullOrUndefined } from '@syncfusion/ej2-base';
+import { isNullOrUndefined, getValue } from '@syncfusion/ej2-base';
 
 import { QRCodeGenerator } from '@syncfusion/ej2-barcode-generator';
 
@@ -49,15 +49,42 @@ export class QRCodeGeneratorComponent extends ComponentBase {
     public tagMapper: { [key: string]: Object } = {};
     public tagNameMapper: Object = {};
     public isVue3: boolean;
-    
+    public templateCollection: any;
     constructor() {
         super(arguments);
         this.isVue3 = !isExecute;
         this.ej2Instances = new QRCodeGenerator({});
         this.bindProperties();
         this.ej2Instances._setProperties = this.ej2Instances.setProperties;
         this.ej2Instances.setProperties = this.setProperties;
+        this.ej2Instances.clearTemplate = this.clearTemplate;
+    }
+
+ public clearTemplate(templateNames?: string[]): any {
+    if (!templateNames){
+       templateNames = Object.keys(this.templateCollection || {});
+    }
+    if (templateNames.length &&  this.templateCollection) {
+    for (let tempName of templateNames){
+       let elementCollection: any = this.templateCollection[tempName];
+       if(elementCollection && elementCollection.length) {
+       for(let ele of elementCollection) {
+           let destroy: any = getValue('__vue__.$destroy', ele);
+           if (destroy) {
+               ele.__vue__.$destroy();
+           }
+           if (ele.innerHTML){
+               ele.innerHTML = '';
+           }
+       }
+       delete this.templateCollection[tempName];
+       }
     }
+}
+ }
+
+
+
     public setProperties(prop: any, muteOnChange: boolean): void {
         if(this.isVue3) {
             this.models = !this.models ? this.ej2Instances.referModels : this.models;
@@ -73,6 +100,7 @@ export class QRCodeGeneratorComponent extends ComponentBase {
                             this.ej2Instances.vueInstance.$emit('update:' + key, prop[key]);
                         } else {
                             (this as any).$emit('update:' + key, prop[key]);
+                            (this as any).$emit('modelchanged', prop[key]);
                         }
                     }
                 });

components/barcodegenerator/styles/barcode/bootstrap5-dark.scss

@@ -0,0 +1 @@
+@import 'ej2-barcode-generator/styles/barcode/bootstrap5-dark.scss';

components/barcodegenerator/styles/barcode/bootstrap5.scss

@@ -0,0 +1 @@
+@import 'ej2-barcode-generator/styles/barcode/bootstrap5.scss';

components/barcodegenerator/styles/bootstrap5-dark.scss

@@ -0,0 +1 @@
+@import 'barcode/bootstrap5-dark.scss';

components/barcodegenerator/styles/bootstrap5.scss

@@ -0,0 +1 @@
+@import 'barcode/bootstrap5.scss';