@syncfusion/ej2-vue-charts 19.4.52 → 20.1.47

package/dist/es6/ej2-vue-charts.es2015.js

@@ -1,8 +1,8 @@
 import { AccumulationChart, BulletChart, Chart, RangeNavigator, Smithchart, Sparkline, StockChart } from '@syncfusion/ej2-charts';
 import { ComponentBase, EJComponentDecorator, allVue, getProps, gh } from '@syncfusion/ej2-vue-base';
 import { Vue } from 'vue-class-component';
-import Vue$1 from 'vue';
 import { getValue, isNullOrUndefined, isUndefined } from '@syncfusion/ej2-base';
+import Vue$1 from 'vue';
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -10,6 +10,7 @@ var __decorate = (undefined && undefined.__decorate) || function (decorators, ta
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute = gh ? false : true;
 let vueImport;
 if (!isExecute || parseInt(allVue.version) < 3) {
@@ -18,16 +19,47 @@ if (!isExecute || parseInt(allVue.version) < 3) {
 else {
     vueImport = Vue$1;
 }
-let TrendlinesDirective = class TrendlinesDirective extends vueImport {
-    render() {
+let TrendlinesDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class TrendlinesDirective extends vueImport {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-trendlines';
     }
 };
 TrendlinesDirective = __decorate([
     EJComponentDecorator({}, isExecute)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], TrendlinesDirective);
 const TrendlinesPlugin = {
     name: 'e-trendlines',
@@ -59,6 +91,7 @@ var __decorate$1 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$1 = gh ? false : true;
 let vueImport$1;
 if (!isExecute$1 || parseInt(allVue.version) < 3) {
@@ -67,16 +100,47 @@ if (!isExecute$1 || parseInt(allVue.version) < 3) {
 else {
     vueImport$1 = Vue$1;
 }
-let SegmentsDirective = class SegmentsDirective extends vueImport$1 {
-    render() {
+let SegmentsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class SegmentsDirective extends vueImport$1 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-segments';
     }
 };
 SegmentsDirective = __decorate$1([
     EJComponentDecorator({}, isExecute$1)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], SegmentsDirective);
 const SegmentsPlugin = {
     name: 'e-segments',
@@ -108,6 +172,7 @@ var __decorate$2 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$2 = gh ? false : true;
 let vueImport$2;
 if (!isExecute$2 || parseInt(allVue.version) < 3) {
@@ -116,16 +181,47 @@ if (!isExecute$2 || parseInt(allVue.version) < 3) {
 else {
     vueImport$2 = Vue$1;
 }
-let SeriesCollectionDirective = class SeriesCollectionDirective extends vueImport$2 {
-    render() {
+let SeriesCollectionDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class SeriesCollectionDirective extends vueImport$2 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-series-collection';
     }
 };
 SeriesCollectionDirective = __decorate$2([
     EJComponentDecorator({}, isExecute$2)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], SeriesCollectionDirective);
 const SeriesCollectionPlugin = {
     name: 'e-series-collection',
@@ -157,6 +253,7 @@ var __decorate$3 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$3 = gh ? false : true;
 let vueImport$3;
 if (!isExecute$3 || parseInt(allVue.version) < 3) {
@@ -165,16 +262,47 @@ if (!isExecute$3 || parseInt(allVue.version) < 3) {
 else {
     vueImport$3 = Vue$1;
 }
-let StripLinesDirective = class StripLinesDirective extends vueImport$3 {
-    render() {
+let StripLinesDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class StripLinesDirective extends vueImport$3 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-striplines';
     }
 };
 StripLinesDirective = __decorate$3([
     EJComponentDecorator({}, isExecute$3)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], StripLinesDirective);
 const StripLinesPlugin = {
     name: 'e-striplines',
@@ -206,6 +334,7 @@ var __decorate$4 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$4 = gh ? false : true;
 let vueImport$4;
 if (!isExecute$4 || parseInt(allVue.version) < 3) {
@@ -214,16 +343,47 @@ if (!isExecute$4 || parseInt(allVue.version) < 3) {
 else {
     vueImport$4 = Vue$1;
 }
-let CategoriesDirective = class CategoriesDirective extends vueImport$4 {
-    render() {
+let CategoriesDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class CategoriesDirective extends vueImport$4 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-categories';
     }
 };
 CategoriesDirective = __decorate$4([
     EJComponentDecorator({}, isExecute$4)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], CategoriesDirective);
 const CategoriesPlugin = {
     name: 'e-categories',
@@ -255,6 +415,7 @@ var __decorate$5 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$5 = gh ? false : true;
 let vueImport$5;
 if (!isExecute$5 || parseInt(allVue.version) < 3) {
@@ -263,16 +424,47 @@ if (!isExecute$5 || parseInt(allVue.version) < 3) {
 else {
     vueImport$5 = Vue$1;
 }
-let MultiLevelLabelsDirective = class MultiLevelLabelsDirective extends vueImport$5 {
-    render() {
+let MultiLevelLabelsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class MultiLevelLabelsDirective extends vueImport$5 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-multilevellabels';
     }
 };
 MultiLevelLabelsDirective = __decorate$5([
     EJComponentDecorator({}, isExecute$5)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], MultiLevelLabelsDirective);
 const MultiLevelLabelsPlugin = {
     name: 'e-multilevellabels',
@@ -304,6 +496,7 @@ var __decorate$6 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$6 = gh ? false : true;
 let vueImport$6;
 if (!isExecute$6 || parseInt(allVue.version) < 3) {
@@ -312,16 +505,47 @@ if (!isExecute$6 || parseInt(allVue.version) < 3) {
 else {
     vueImport$6 = Vue$1;
 }
-let AxesDirective = class AxesDirective extends vueImport$6 {
-    render() {
+let AxesDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class AxesDirective extends vueImport$6 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-axes';
     }
 };
 AxesDirective = __decorate$6([
     EJComponentDecorator({}, isExecute$6)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], AxesDirective);
 const AxesPlugin = {
     name: 'e-axes',
@@ -353,6 +577,7 @@ var __decorate$7 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$7 = gh ? false : true;
 let vueImport$7;
 if (!isExecute$7 || parseInt(allVue.version) < 3) {
@@ -361,16 +586,47 @@ if (!isExecute$7 || parseInt(allVue.version) < 3) {
 else {
     vueImport$7 = Vue$1;
 }
-let RowsDirective = class RowsDirective extends vueImport$7 {
-    render() {
+let RowsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class RowsDirective extends vueImport$7 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-rows';
     }
 };
 RowsDirective = __decorate$7([
     EJComponentDecorator({}, isExecute$7)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], RowsDirective);
 const RowsPlugin = {
     name: 'e-rows',
@@ -402,6 +658,7 @@ var __decorate$8 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$8 = gh ? false : true;
 let vueImport$8;
 if (!isExecute$8 || parseInt(allVue.version) < 3) {
@@ -410,16 +667,47 @@ if (!isExecute$8 || parseInt(allVue.version) < 3) {
 else {
     vueImport$8 = Vue$1;
 }
-let ColumnsDirective = class ColumnsDirective extends vueImport$8 {
-    render() {
+let ColumnsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class ColumnsDirective extends vueImport$8 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-columns';
     }
 };
 ColumnsDirective = __decorate$8([
     EJComponentDecorator({}, isExecute$8)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], ColumnsDirective);
 const ColumnsPlugin = {
     name: 'e-columns',
@@ -451,6 +739,7 @@ var __decorate$9 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$9 = gh ? false : true;
 let vueImport$9;
 if (!isExecute$9 || parseInt(allVue.version) < 3) {
@@ -459,16 +748,47 @@ if (!isExecute$9 || parseInt(allVue.version) < 3) {
 else {
     vueImport$9 = Vue$1;
 }
-let RangeColorSettingsDirective = class RangeColorSettingsDirective extends vueImport$9 {
-    render() {
+let RangeColorSettingsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class RangeColorSettingsDirective extends vueImport$9 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-rangecolorsettings';
     }
 };
 RangeColorSettingsDirective = __decorate$9([
     EJComponentDecorator({}, isExecute$9)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], RangeColorSettingsDirective);
 const RangeColorSettingsPlugin = {
     name: 'e-rangecolorsettings',
@@ -500,6 +820,7 @@ var __decorate$10 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$10 = gh ? false : true;
 let vueImport$10;
 if (!isExecute$10 || parseInt(allVue.version) < 3) {
@@ -508,16 +829,47 @@ if (!isExecute$10 || parseInt(allVue.version) < 3) {
 else {
     vueImport$10 = Vue$1;
 }
-let AnnotationsDirective = class AnnotationsDirective extends vueImport$10 {
-    render() {
+let AnnotationsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class AnnotationsDirective extends vueImport$10 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-annotations';
     }
 };
 AnnotationsDirective = __decorate$10([
     EJComponentDecorator({}, isExecute$10)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], AnnotationsDirective);
 const AnnotationsPlugin = {
     name: 'e-annotations',
@@ -561,6 +913,7 @@ var __decorate$11 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$11 = gh ? false : true;
 let vueImport$11;
 if (!isExecute$11 || parseInt(allVue.version) < 3) {
@@ -569,16 +922,47 @@ if (!isExecute$11 || parseInt(allVue.version) < 3) {
 else {
     vueImport$11 = Vue$1;
 }
-let SelectedDataIndexesDirective = class SelectedDataIndexesDirective extends vueImport$11 {
-    render() {
+let SelectedDataIndexesDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class SelectedDataIndexesDirective extends vueImport$11 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-selecteddataindexes';
     }
 };
 SelectedDataIndexesDirective = __decorate$11([
     EJComponentDecorator({}, isExecute$11)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], SelectedDataIndexesDirective);
 const SelectedDataIndexesPlugin = {
     name: 'e-selecteddataindexes',
@@ -610,6 +994,7 @@ var __decorate$12 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$12 = gh ? false : true;
 let vueImport$12;
 if (!isExecute$12 || parseInt(allVue.version) < 3) {
@@ -618,16 +1003,47 @@ if (!isExecute$12 || parseInt(allVue.version) < 3) {
 else {
     vueImport$12 = Vue$1;
 }
-let IndicatorsDirective = class IndicatorsDirective extends vueImport$12 {
-    render() {
+let IndicatorsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class IndicatorsDirective extends vueImport$12 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-indicators';
     }
 };
 IndicatorsDirective = __decorate$12([
     EJComponentDecorator({}, isExecute$12)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], IndicatorsDirective);
 const IndicatorsPlugin = {
     name: 'e-indicators',
@@ -681,7 +1097,12 @@ let ChartComponent =
 /* Start Options({
     props: props,
     watch: watch,
-    emits: emitProbs
+    emits: emitProbs,
+    provide: function provide() {
+        return {
+            custom: this.custom
+        };
+    }
 }) End */
 class ChartComponent extends ComponentBase {
     constructor() {
@@ -700,6 +1121,7 @@ class ChartComponent extends ComponentBase {
         this.ej2Instances._setProperties = this.ej2Instances.setProperties;
         this.ej2Instances.setProperties = this.setProperties;
         this.ej2Instances.clearTemplate = this.clearTemplate;
+        this.updated = this.updated;
     }
     clearTemplate(templateNames) {
         if (!templateNames) {
@@ -792,6 +1214,9 @@ class ChartComponent extends ComponentBase {
         }
         return h('div', slots);
     }
+    custom() {
+        this.updated();
+    }
     addAxes(axisCollection) {
         return this.ej2Instances.addAxes(axisCollection);
     }
@@ -839,7 +1264,12 @@ ChartComponent = __decorate$13([
     /* Start Options({
         props: props,
         watch: watch,
-        emits: emitProbs
+        emits: emitProbs,
+        provide: function provide() {
+            return {
+                custom: this.custom
+            };
+        }
     }) End */
 ], ChartComponent);
 const ChartPlugin = {
@@ -881,6 +1311,7 @@ var __decorate$14 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$14 = gh ? false : true;
 let vueImport$13;
 if (!isExecute$14 || parseInt(allVue.version) < 3) {
@@ -889,16 +1320,47 @@ if (!isExecute$14 || parseInt(allVue.version) < 3) {
 else {
     vueImport$13 = Vue$1;
 }
-let AccumulationSeriesCollectionDirective = class AccumulationSeriesCollectionDirective extends vueImport$13 {
-    render() {
+let AccumulationSeriesCollectionDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class AccumulationSeriesCollectionDirective extends vueImport$13 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-accumulation-series-collection';
     }
 };
 AccumulationSeriesCollectionDirective = __decorate$14([
     EJComponentDecorator({}, isExecute$14)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], AccumulationSeriesCollectionDirective);
 const AccumulationSeriesCollectionPlugin = {
     name: 'e-accumulation-series-collection',
@@ -930,6 +1392,7 @@ var __decorate$15 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$15 = gh ? false : true;
 let vueImport$14;
 if (!isExecute$15 || parseInt(allVue.version) < 3) {
@@ -938,16 +1401,47 @@ if (!isExecute$15 || parseInt(allVue.version) < 3) {
 else {
     vueImport$14 = Vue$1;
 }
-let AccumulationAnnotationsDirective = class AccumulationAnnotationsDirective extends vueImport$14 {
-    render() {
+let AccumulationAnnotationsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class AccumulationAnnotationsDirective extends vueImport$14 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-accumulation-annotations';
     }
 };
 AccumulationAnnotationsDirective = __decorate$15([
     EJComponentDecorator({}, isExecute$15)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], AccumulationAnnotationsDirective);
 const AccumulationAnnotationsPlugin = {
     name: 'e-accumulation-annotations',
@@ -1001,7 +1495,12 @@ let AccumulationChartComponent =
 /* Start Options({
     props: props,
     watch: watch,
-    emits: emitProbs
+    emits: emitProbs,
+    provide: function provide() {
+        return {
+            custom: this.custom
+        };
+    }
 }) End */
 class AccumulationChartComponent extends ComponentBase {
     constructor() {
@@ -1020,6 +1519,7 @@ class AccumulationChartComponent extends ComponentBase {
         this.ej2Instances._setProperties = this.ej2Instances.setProperties;
         this.ej2Instances.setProperties = this.setProperties;
         this.ej2Instances.clearTemplate = this.clearTemplate;
+        this.updated = this.updated;
     }
     clearTemplate(templateNames) {
         if (!templateNames) {
@@ -1112,6 +1612,9 @@ class AccumulationChartComponent extends ComponentBase {
         }
         return h('div', slots);
     }
+    custom() {
+        this.updated();
+    }
     export(type, fileName) {
         return this.ej2Instances.export(type, fileName);
     }
@@ -1135,7 +1638,12 @@ AccumulationChartComponent = __decorate$16([
     /* Start Options({
         props: props,
         watch: watch,
-        emits: emitProbs
+        emits: emitProbs,
+        provide: function provide() {
+            return {
+                custom: this.custom
+            };
+        }
     }) End */
 ], AccumulationChartComponent);
 const AccumulationChartPlugin = {
@@ -1155,6 +1663,7 @@ var __decorate$17 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$17 = gh ? false : true;
 let vueImport$15;
 if (!isExecute$17 || parseInt(allVue.version) < 3) {
@@ -1163,16 +1672,47 @@ if (!isExecute$17 || parseInt(allVue.version) < 3) {
 else {
     vueImport$15 = Vue$1;
 }
-let RangenavigatorSeriesCollectionDirective = class RangenavigatorSeriesCollectionDirective extends vueImport$15 {
-    render() {
+let RangenavigatorSeriesCollectionDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class RangenavigatorSeriesCollectionDirective extends vueImport$15 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-rangenavigator-series-collection';
     }
 };
 RangenavigatorSeriesCollectionDirective = __decorate$17([
     EJComponentDecorator({}, isExecute$17)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], RangenavigatorSeriesCollectionDirective);
 const RangenavigatorSeriesCollectionPlugin = {
     name: 'e-rangenavigator-series-collection',
@@ -1226,7 +1766,12 @@ let RangeNavigatorComponent =
 /* Start Options({
     props: props,
     watch: watch,
-    emits: emitProbs
+    emits: emitProbs,
+    provide: function provide() {
+        return {
+            custom: this.custom
+        };
+    }
 }) End */
 class RangeNavigatorComponent extends ComponentBase {
     constructor() {
@@ -1245,6 +1790,7 @@ class RangeNavigatorComponent extends ComponentBase {
         this.ej2Instances._setProperties = this.ej2Instances.setProperties;
         this.ej2Instances.setProperties = this.setProperties;
         this.ej2Instances.clearTemplate = this.clearTemplate;
+        this.updated = this.updated;
     }
     clearTemplate(templateNames) {
         if (!templateNames) {
@@ -1337,6 +1883,9 @@ class RangeNavigatorComponent extends ComponentBase {
         }
         return h('div', slots);
     }
+    custom() {
+        this.updated();
+    }
     createSecondaryElement() {
         return this.ej2Instances.createSecondaryElement();
     }
@@ -1346,8 +1895,8 @@ class RangeNavigatorComponent extends ComponentBase {
     print(id) {
         return this.ej2Instances.print(id);
     }
-    renderChart() {
-        return this.ej2Instances.renderChart();
+    renderChart(resize) {
+        return this.ej2Instances.renderChart(resize);
     }
 };
 RangeNavigatorComponent = __decorate$18([
@@ -1360,7 +1909,12 @@ RangeNavigatorComponent = __decorate$18([
     /* Start Options({
         props: props,
         watch: watch,
-        emits: emitProbs
+        emits: emitProbs,
+        provide: function provide() {
+            return {
+                custom: this.custom
+            };
+        }
     }) End */
 ], RangeNavigatorComponent);
 const RangeNavigatorPlugin = {
@@ -1378,6 +1932,7 @@ var __decorate$19 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$19 = gh ? false : true;
 let vueImport$16;
 if (!isExecute$19 || parseInt(allVue.version) < 3) {
@@ -1386,16 +1941,47 @@ if (!isExecute$19 || parseInt(allVue.version) < 3) {
 else {
     vueImport$16 = Vue$1;
 }
-let RangeBandSettingsDirective = class RangeBandSettingsDirective extends vueImport$16 {
-    render() {
+let RangeBandSettingsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class RangeBandSettingsDirective extends vueImport$16 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-rangeBandSettings';
     }
 };
 RangeBandSettingsDirective = __decorate$19([
     EJComponentDecorator({}, isExecute$19)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], RangeBandSettingsDirective);
 const RangeBandSettingsPlugin = {
     name: 'e-rangeBandSettings',
@@ -1449,7 +2035,12 @@ let SparklineComponent =
 /* Start Options({
     props: props,
     watch: watch,
-    emits: emitProbs
+    emits: emitProbs,
+    provide: function provide() {
+        return {
+            custom: this.custom
+        };
+    }
 }) End */
 class SparklineComponent extends ComponentBase {
     constructor() {
@@ -1466,6 +2057,7 @@ class SparklineComponent extends ComponentBase {
         this.ej2Instances._setProperties = this.ej2Instances.setProperties;
         this.ej2Instances.setProperties = this.setProperties;
         this.ej2Instances.clearTemplate = this.clearTemplate;
+        this.updated = this.updated;
     }
     clearTemplate(templateNames) {
         if (!templateNames) {
@@ -1520,6 +2112,9 @@ class SparklineComponent extends ComponentBase {
         }
         return h('div', slots);
     }
+    custom() {
+        this.updated();
+    }
     renderSparkline() {
         return this.ej2Instances.renderSparkline();
     }
@@ -1531,7 +2126,12 @@ SparklineComponent = __decorate$20([
     /* Start Options({
         props: props,
         watch: watch,
-        emits: emitProbs
+        emits: emitProbs,
+        provide: function provide() {
+            return {
+                custom: this.custom
+            };
+        }
     }) End */
 ], SparklineComponent);
 const SparklinePlugin = {
@@ -1549,6 +2149,7 @@ var __decorate$21 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$21 = gh ? false : true;
 let vueImport$17;
 if (!isExecute$21 || parseInt(allVue.version) < 3) {
@@ -1557,16 +2158,47 @@ if (!isExecute$21 || parseInt(allVue.version) < 3) {
 else {
     vueImport$17 = Vue$1;
 }
-let SmithchartSeriesCollectionDirective = class SmithchartSeriesCollectionDirective extends vueImport$17 {
-    render() {
+let SmithchartSeriesCollectionDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class SmithchartSeriesCollectionDirective extends vueImport$17 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-seriesCollection';
     }
 };
 SmithchartSeriesCollectionDirective = __decorate$21([
     EJComponentDecorator({}, isExecute$21)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], SmithchartSeriesCollectionDirective);
 const SmithchartSeriesCollectionPlugin = {
     name: 'e-seriesCollection',
@@ -1620,7 +2252,12 @@ let SmithchartComponent =
 /* Start Options({
     props: props,
     watch: watch,
-    emits: emitProbs
+    emits: emitProbs,
+    provide: function provide() {
+        return {
+            custom: this.custom
+        };
+    }
 }) End */
 class SmithchartComponent extends ComponentBase {
     constructor() {
@@ -1637,6 +2274,7 @@ class SmithchartComponent extends ComponentBase {
         this.ej2Instances._setProperties = this.ej2Instances.setProperties;
         this.ej2Instances.setProperties = this.setProperties;
         this.ej2Instances.clearTemplate = this.clearTemplate;
+        this.updated = this.updated;
     }
     clearTemplate(templateNames) {
         if (!templateNames) {
@@ -1691,6 +2329,9 @@ class SmithchartComponent extends ComponentBase {
         }
         return h('div', slots);
     }
+    custom() {
+        this.updated();
+    }
     export(type, fileName, orientation) {
         return this.ej2Instances.export(type, fileName, orientation);
     }
@@ -1717,7 +2358,12 @@ SmithchartComponent = __decorate$22([
     /* Start Options({
         props: props,
         watch: watch,
-        emits: emitProbs
+        emits: emitProbs,
+        provide: function provide() {
+            return {
+                custom: this.custom
+            };
+        }
     }) End */
 ], SmithchartComponent);
 const SmithchartPlugin = {
@@ -1735,6 +2381,7 @@ var __decorate$23 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$23 = gh ? false : true;
 let vueImport$18;
 if (!isExecute$23 || parseInt(allVue.version) < 3) {
@@ -1743,16 +2390,47 @@ if (!isExecute$23 || parseInt(allVue.version) < 3) {
 else {
     vueImport$18 = Vue$1;
 }
-let StockChartTrendlinesDirective = class StockChartTrendlinesDirective extends vueImport$18 {
-    render() {
+let StockChartTrendlinesDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class StockChartTrendlinesDirective extends vueImport$18 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-trendlines';
     }
 };
 StockChartTrendlinesDirective = __decorate$23([
     EJComponentDecorator({}, isExecute$23)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], StockChartTrendlinesDirective);
 const StockChartTrendlinesPlugin = {
     name: 'e-trendlines',
@@ -1784,6 +2462,7 @@ var __decorate$24 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$24 = gh ? false : true;
 let vueImport$19;
 if (!isExecute$24 || parseInt(allVue.version) < 3) {
@@ -1792,16 +2471,47 @@ if (!isExecute$24 || parseInt(allVue.version) < 3) {
 else {
     vueImport$19 = Vue$1;
 }
-let StockChartSeriesCollectionDirective = class StockChartSeriesCollectionDirective extends vueImport$19 {
-    render() {
+let StockChartSeriesCollectionDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class StockChartSeriesCollectionDirective extends vueImport$19 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-stockchart-series-collection';
     }
 };
 StockChartSeriesCollectionDirective = __decorate$24([
     EJComponentDecorator({}, isExecute$24)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], StockChartSeriesCollectionDirective);
 const StockChartSeriesCollectionPlugin = {
     name: 'e-stockchart-series-collection',
@@ -1833,6 +2543,7 @@ var __decorate$25 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$25 = gh ? false : true;
 let vueImport$20;
 if (!isExecute$25 || parseInt(allVue.version) < 3) {
@@ -1841,16 +2552,47 @@ if (!isExecute$25 || parseInt(allVue.version) < 3) {
 else {
     vueImport$20 = Vue$1;
 }
-let StockChartAxesDirective = class StockChartAxesDirective extends vueImport$20 {
-    render() {
+let StockChartAxesDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class StockChartAxesDirective extends vueImport$20 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-stockchart-axes';
     }
 };
 StockChartAxesDirective = __decorate$25([
     EJComponentDecorator({}, isExecute$25)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], StockChartAxesDirective);
 const StockChartAxesPlugin = {
     name: 'e-stockchart-axes',
@@ -1882,6 +2624,7 @@ var __decorate$26 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$26 = gh ? false : true;
 let vueImport$21;
 if (!isExecute$26 || parseInt(allVue.version) < 3) {
@@ -1890,16 +2633,47 @@ if (!isExecute$26 || parseInt(allVue.version) < 3) {
 else {
     vueImport$21 = Vue$1;
 }
-let StockChartRowsDirective = class StockChartRowsDirective extends vueImport$21 {
-    render() {
+let StockChartRowsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class StockChartRowsDirective extends vueImport$21 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-stockchart-rows';
     }
 };
 StockChartRowsDirective = __decorate$26([
     EJComponentDecorator({}, isExecute$26)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], StockChartRowsDirective);
 const StockChartRowsPlugin = {
     name: 'e-stockchart-rows',
@@ -1931,6 +2705,7 @@ var __decorate$27 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$27 = gh ? false : true;
 let vueImport$22;
 if (!isExecute$27 || parseInt(allVue.version) < 3) {
@@ -1939,16 +2714,47 @@ if (!isExecute$27 || parseInt(allVue.version) < 3) {
 else {
     vueImport$22 = Vue$1;
 }
-let StockChartAnnotationsDirective = class StockChartAnnotationsDirective extends vueImport$22 {
-    render() {
+let StockChartAnnotationsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class StockChartAnnotationsDirective extends vueImport$22 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-stockchart-annotations';
     }
 };
 StockChartAnnotationsDirective = __decorate$27([
     EJComponentDecorator({}, isExecute$27)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], StockChartAnnotationsDirective);
 const StockChartAnnotationsPlugin = {
     name: 'e-stockchart-annotations',
@@ -1992,6 +2798,7 @@ var __decorate$28 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$28 = gh ? false : true;
 let vueImport$23;
 if (!isExecute$28 || parseInt(allVue.version) < 3) {
@@ -2000,16 +2807,47 @@ if (!isExecute$28 || parseInt(allVue.version) < 3) {
 else {
     vueImport$23 = Vue$1;
 }
-let StockChartSelectedDataIndexesDirective = class StockChartSelectedDataIndexesDirective extends vueImport$23 {
-    render() {
+let StockChartSelectedDataIndexesDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class StockChartSelectedDataIndexesDirective extends vueImport$23 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-stockchart-selectedDataIndexes';
     }
 };
 StockChartSelectedDataIndexesDirective = __decorate$28([
     EJComponentDecorator({}, isExecute$28)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], StockChartSelectedDataIndexesDirective);
 const StockChartSelectedDataIndexesPlugin = {
     name: 'e-stockchart-selectedDataIndexes',
@@ -2041,6 +2879,7 @@ var __decorate$29 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$29 = gh ? false : true;
 let vueImport$24;
 if (!isExecute$29 || parseInt(allVue.version) < 3) {
@@ -2049,16 +2888,47 @@ if (!isExecute$29 || parseInt(allVue.version) < 3) {
 else {
     vueImport$24 = Vue$1;
 }
-let StockChartPeriodsDirective = class StockChartPeriodsDirective extends vueImport$24 {
-    render() {
+let StockChartPeriodsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class StockChartPeriodsDirective extends vueImport$24 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-stockchart-periods';
     }
 };
 StockChartPeriodsDirective = __decorate$29([
     EJComponentDecorator({}, isExecute$29)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], StockChartPeriodsDirective);
 const StockChartPeriodsPlugin = {
     name: 'e-stockchart-periods',
@@ -2090,6 +2960,7 @@ var __decorate$30 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$30 = gh ? false : true;
 let vueImport$25;
 if (!isExecute$30 || parseInt(allVue.version) < 3) {
@@ -2098,16 +2969,47 @@ if (!isExecute$30 || parseInt(allVue.version) < 3) {
 else {
     vueImport$25 = Vue$1;
 }
-let StockEventsDirective = class StockEventsDirective extends vueImport$25 {
-    render() {
+let StockEventsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class StockEventsDirective extends vueImport$25 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-stockchart-stockevents';
     }
 };
 StockEventsDirective = __decorate$30([
     EJComponentDecorator({}, isExecute$30)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], StockEventsDirective);
 const StockEventsPlugin = {
     name: 'e-stockchart-stockevents',
@@ -2139,6 +3041,7 @@ var __decorate$31 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$31 = gh ? false : true;
 let vueImport$26;
 if (!isExecute$31 || parseInt(allVue.version) < 3) {
@@ -2147,16 +3050,47 @@ if (!isExecute$31 || parseInt(allVue.version) < 3) {
 else {
     vueImport$26 = Vue$1;
 }
-let StockChartIndicatorsDirective = class StockChartIndicatorsDirective extends vueImport$26 {
-    render() {
+let StockChartIndicatorsDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class StockChartIndicatorsDirective extends vueImport$26 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-stockchart-indicators';
     }
 };
 StockChartIndicatorsDirective = __decorate$31([
     EJComponentDecorator({}, isExecute$31)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], StockChartIndicatorsDirective);
 const StockChartIndicatorsPlugin = {
     name: 'e-stockchart-indicators',
@@ -2210,7 +3144,12 @@ let StockChartComponent =
 /* Start Options({
     props: props,
     watch: watch,
-    emits: emitProbs
+    emits: emitProbs,
+    provide: function provide() {
+        return {
+            custom: this.custom
+        };
+    }
 }) End */
 class StockChartComponent extends ComponentBase {
     constructor() {
@@ -2229,6 +3168,7 @@ class StockChartComponent extends ComponentBase {
         this.ej2Instances._setProperties = this.ej2Instances.setProperties;
         this.ej2Instances.setProperties = this.setProperties;
         this.ej2Instances.clearTemplate = this.clearTemplate;
+        this.updated = this.updated;
     }
     clearTemplate(templateNames) {
         if (!templateNames) {
@@ -2321,6 +3261,9 @@ class StockChartComponent extends ComponentBase {
         }
         return h('div', slots);
     }
+    custom() {
+        this.updated();
+    }
     chartModuleInjection() {
         return this.ej2Instances.chartModuleInjection();
     }
@@ -2347,7 +3290,12 @@ StockChartComponent = __decorate$32([
     /* Start Options({
         props: props,
         watch: watch,
-        emits: emitProbs
+        emits: emitProbs,
+        provide: function provide() {
+            return {
+                custom: this.custom
+            };
+        }
     }) End */
 ], StockChartComponent);
 const StockChartPlugin = {
@@ -2381,6 +3329,7 @@ var __decorate$33 = (undefined && undefined.__decorate) || function (decorators,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+// {{VueImport}}
 const isExecute$33 = gh ? false : true;
 let vueImport$27;
 if (!isExecute$33 || parseInt(allVue.version) < 3) {
@@ -2389,16 +3338,47 @@ if (!isExecute$33 || parseInt(allVue.version) < 3) {
 else {
     vueImport$27 = Vue$1;
 }
-let BulletRangeCollectionDirective = class BulletRangeCollectionDirective extends vueImport$27 {
-    render() {
+let BulletRangeCollectionDirective = 
+/* Start Options({
+    inject: {
+        custom: {
+            default: null
+        }
+    }
+}) End */
+class BulletRangeCollectionDirective extends vueImport$27 {
+    constructor() {
+        super(arguments);
+    }
+    render(createElement) {
+        if (gh) {
+            let h = gh || createElement;
+            let slots = null;
+            if (!isNullOrUndefined(this.$slots.default)) {
+                slots = gh ? this.$slots.default() : this.$slots.default;
+            }
+            return h('div', { class: 'e-directive' }, slots);
+        }
         return;
     }
+    updated() {
+        if (gh && this.custom) {
+            this.custom();
+        }
+    }
     getTag() {
         return 'e-bullet-range-collection';
     }
 };
 BulletRangeCollectionDirective = __decorate$33([
     EJComponentDecorator({}, isExecute$33)
+    /* Start Options({
+        inject: {
+            custom: {
+                default: null
+            }
+        }
+    }) End */
 ], BulletRangeCollectionDirective);
 const BulletRangeCollectionPlugin = {
     name: 'e-bullet-range-collection',
@@ -2452,7 +3432,12 @@ let BulletChartComponent =
 /* Start Options({
     props: props,
     watch: watch,
-    emits: emitProbs
+    emits: emitProbs,
+    provide: function provide() {
+        return {
+            custom: this.custom
+        };
+    }
 }) End */
 class BulletChartComponent extends ComponentBase {
     constructor() {
@@ -2471,6 +3456,7 @@ class BulletChartComponent extends ComponentBase {
         this.ej2Instances._setProperties = this.ej2Instances.setProperties;
         this.ej2Instances.setProperties = this.setProperties;
         this.ej2Instances.clearTemplate = this.clearTemplate;
+        this.updated = this.updated;
     }
     clearTemplate(templateNames) {
         if (!templateNames) {
@@ -2563,6 +3549,9 @@ class BulletChartComponent extends ComponentBase {
         }
         return h('div', slots);
     }
+    custom() {
+        this.updated();
+    }
     createSvg(chart) {
         return this.ej2Instances.createSvg(chart);
     }
@@ -2586,7 +3575,12 @@ BulletChartComponent = __decorate$34([
     /* Start Options({
         props: props,
         watch: watch,
-        emits: emitProbs
+        emits: emitProbs,
+        provide: function provide() {
+            return {
+                custom: this.custom
+            };
+        }
     }) End */
 ], BulletChartComponent);
 const BulletChartPlugin = {