@syncfusion/ej2-layouts 19.2.60 → 19.3.43

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 19.2.60
+*  version : 19.3.43
 *  Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/helpers/e2e/dashboardHelper.d.ts

@@ -0,0 +1,63 @@
+import { TestHelper } from '@syncfusion/ej2-base/helpers/e2e';
+export declare class DashboardHelper extends TestHelper {
+    id: string;
+    wrapperFn: Function;
+    /**
+     * Initialize the Dashboard Layout E2E helpers.
+     * @param id element id of the Dashboard Layout component.
+     * @param wrapperFn pass the wrapper function.
+     */
+    constructor(id: string, wrapperFn: Function);
+    /**
+     * Gets the selector of the Dashboard Layout component.
+     */
+    selector(arg: any): any;
+    /**
+     * Gets root element of the Dashboard Layout component.
+     */
+    getElement(): any;
+    /**
+     * Gets the element of the Dashboard Layout component.
+     */
+    getDashboardLayout(): any;
+    /**
+     * Gets a panel container and its inner elements with the given id from dashboard layout component.
+     */
+    getPanelContainer(): any;
+    /**
+     * Gets the panel element of Dashboard Layout component which consists the panel container and its inner elements
+     */
+    getPanelElement(): any;
+    /**
+     * Used to get the panel header of Dashboard Layout component which contains the header details.
+     */
+    getPanelHeader(): any;
+    /**
+     * Gets the panel content of Dashboard Layout component which contains the panel content class.
+     */
+    getPanelContent(): any;
+    /**
+     * Gets the resize icon positioned on the South-East side in panel container.
+     */
+    getSouthEastResizeIcon(): any;
+    /**
+     * Gets the resize icon positioned on the North-East side in panel container.
+     */
+    getNorthEastResizeIcon(): any;
+    /**
+     * Gets the resize icon positioned on the North-West side in panel container.
+     */
+    getNorthWestResizeIcon(): any;
+    /**
+     * Gets the resize icon positioned on the South-West side in panel container.
+     */
+    getSouthWestResizeIcon(): any;
+    /**
+     * Gets the clear icon from the panel element.
+     */
+    getClearIcon(): any;
+    /**
+     * Gets the transition of panel in Dashboard Layout component which is used to achieve the resizing behavior.
+     */
+    getPanelTansition(): any;
+}

package/helpers/e2e/dashboardHelper.js

@@ -0,0 +1,97 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const e2e_1 = require("@syncfusion/ej2-base/helpers/e2e");
+class DashboardHelper extends e2e_1.TestHelper {
+    /**
+     * Initialize the Dashboard Layout E2E helpers.
+     * @param id element id of the Dashboard Layout component.
+     * @param wrapperFn pass the wrapper function.
+     */
+    constructor(id, wrapperFn) {
+        super();
+        this.id = id;
+        if (wrapperFn !== undefined) {
+            this.wrapperFn = wrapperFn;
+        }
+        return this;
+    }
+    /**
+     * Gets the selector of the Dashboard Layout component.
+     */
+    selector(arg) {
+        return (this.wrapperFn ? this.wrapperFn(arg) : arg);
+    }
+    /**
+     * Gets root element of the Dashboard Layout component.
+     */
+    getElement() {
+        return this.selector('#' + this.id);
+    }
+    /**
+     * Gets the element of the Dashboard Layout component.
+     */
+    getDashboardLayout() {
+        return this.selector('#' + this.id + '.e-dashboardlayout');
+    }
+    /**
+     * Gets a panel container and its inner elements with the given id from dashboard layout component.
+     */
+    getPanelContainer() {
+        return this.selector('#' + this.id + '.e-dashboardlayout .e-panel-container');
+    }
+    /**
+     * Gets the panel element of Dashboard Layout component which consists the panel container and its inner elements
+     */
+    getPanelElement() {
+        return this.selector('#' + this.id + '.e-dashboardlayout .e-panel');
+    }
+    /**
+     * Used to get the panel header of Dashboard Layout component which contains the header details.
+     */
+    getPanelHeader() {
+        return this.selector('#' + this.id + '.e-dashboardlayout  .e-panel-header');
+    }
+    /**
+     * Gets the panel content of Dashboard Layout component which contains the panel content class.
+     */
+    getPanelContent() {
+        return this.selector('#' + this.id + '.e-dashboardlayout .e-panel-content');
+    }
+    /**
+     * Gets the resize icon positioned on the South-East side in panel container.
+     */
+    getSouthEastResizeIcon() {
+        return this.selector('#' + this.id + '.e-dashboardlayout .e-south-east .e-resize');
+    }
+    /**
+     * Gets the resize icon positioned on the North-East side in panel container.
+     */
+    getNorthEastResizeIcon() {
+        return this.selector('#' + this.id + '.e-dashboardlayout .e-north-east .e-resize');
+    }
+    /**
+     * Gets the resize icon positioned on the North-West side in panel container.
+     */
+    getNorthWestResizeIcon() {
+        return this.selector('#' + this.id + '.e-dashboardlayout .e-north-west .e-resize');
+    }
+    /**
+     * Gets the resize icon positioned on the South-West side in panel container.
+     */
+    getSouthWestResizeIcon() {
+        return this.selector('#' + this.id + '.e-dashboardlayout .e-south-west .e-resize');
+    }
+    /**
+     * Gets the clear icon from the panel element.
+     */
+    getClearIcon() {
+        return this.selector('#' + this.id + '.e-dashboardlayout .e-clear-icon');
+    }
+    /**
+     * Gets the transition of panel in Dashboard Layout component which is used to achieve the resizing behavior.
+     */
+    getPanelTansition() {
+        return this.selector('#' + this.id + '.e-dashboardlayout .e-panel-transition');
+    }
+}
+exports.DashboardHelper = DashboardHelper;

package/helpers/e2e/index.d.ts

@@ -1 +1,2 @@
+export * from './dashboardHelper';
 export * from './splitter-helper';

package/helpers/e2e/index.js

@@ -3,4 +3,5 @@ function __export(m) {
     for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
 }
 Object.defineProperty(exports, "__esModule", { value: true });
+__export(require("./dashboardHelper"));
 __export(require("./splitter-helper"));

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-layouts@*",
-  "_id": "@syncfusion/ej2-layouts@19.2.48",
+  "_id": "@syncfusion/ej2-layouts@18.23.7",
   "_inBundle": false,
-  "_integrity": "sha512-NSlsLYKg/ydDyF1OcVDyVNYiBMraMUCJgZlLkJrB2mfXjm1sZyXLsrJd0BsTPQXR+BaXwd5UBdS02mZsS34c5w==",
+  "_integrity": "sha512-CMePvOOx9B17e0D/dLknB37+dJV7wpQa5RQBfNh8A8cPodX/ZWHIr8jElXeG43HQifMIFH4G8gDQN6r4ZZG3Ig==",
   "_location": "/@syncfusion/ej2-layouts",
   "_phantomChildren": {},
   "_requested": {
@@ -27,8 +27,8 @@
     "/@syncfusion/ej2-react-layouts",
     "/@syncfusion/ej2-vue-layouts"
   ],
-  "_resolved": "http://nexus.syncfusion.com/repository/ej2-hotfix/@syncfusion/ej2-layouts/-/ej2-layouts-19.2.48.tgz",
-  "_shasum": "3bd3c318f663d8250e0e948b8858aeaa1008ff2a",
+  "_resolved": "http://nexus.syncfusion.com/repository/ej2-release/@syncfusion/ej2-layouts/-/ej2-layouts-18.23.7.tgz",
+  "_shasum": "bd23f5277351df6a2d390c8a5a9b528fb7f4db2b",
   "_spec": "@syncfusion/ej2-layouts@*",
   "_where": "/jenkins/workspace/automation_release_19.1.0.1-ZPMUBNQ6AUYH6YGEFBPVYMEQLRRW2SLD4XCZ6GATNZJFYJ3RIAOA/packages/included",
   "author": {
@@ -36,7 +36,7 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~19.2.60"
+    "@syncfusion/ej2-base": "~19.3.43"
   },
   "deprecated": false,
   "description": "A package of Essential JS 2 layout pure CSS components such as card and avatar. The card is used as small container to show content in specific structure, whereas the avatars are icons, initials or figures representing particular person.",
@@ -76,6 +76,6 @@
     "url": "https://github.com/syncfusion/ej2-javascript-ui-controls/tree/master/controls/layouts"
   },
   "typings": "index.d.ts",
-  "version": "19.2.60",
+  "version": "19.3.43",
   "sideEffects": false
 }

package/src/dashboard-layout/dashboard-layout.js

@@ -2078,7 +2078,6 @@ var DashboardLayout = /** @class */ (function (_super) {
                         _this.onDragStart(args);
                     }
                 });
-                this.dragobj.enableScrollHandler = true;
                 if (this.dragCollection.indexOf(this.dragobj) === -1) {
                     this.dragCollection.push(this.dragobj);
                 }

package/src/splitter/splitter-model.d.ts

@@ -1,4 +1,4 @@
-import { Component, Property, setStyleAttribute, ChildProperty, compile, isBlazor } from '@syncfusion/ej2-base';import { NotifyPropertyChanges, addClass, Collection, isNullOrUndefined } from '@syncfusion/ej2-base';import { Event, EmitType, EventHandler, selectAll, removeClass, select, Browser, detach, formatUnit } from '@syncfusion/ej2-base';import { SanitizeHtmlHelper, extend } from '@syncfusion/ej2-base';
+import { Component, Property, setStyleAttribute, ChildProperty, compile } from '@syncfusion/ej2-base';import { NotifyPropertyChanges, addClass, Collection, isNullOrUndefined } from '@syncfusion/ej2-base';import { Event, EmitType, EventHandler, selectAll, removeClass, select, Browser, detach, formatUnit } from '@syncfusion/ej2-base';import { SanitizeHtmlHelper, extend } from '@syncfusion/ej2-base';
 import {Orientation,BeforeSanitizeHtmlArgs,ResizeEventArgs,ResizingEventArgs,BeforeExpandEventArgs,ExpandedEventArgs} from "./splitter";
 import {ComponentModel} from '@syncfusion/ej2-base';
 

package/src/splitter/splitter.d.ts

@@ -336,6 +336,7 @@ export declare class Splitter extends Component<HTMLElement> {
     private onDocumentClick;
     private checkPaneSize;
     private onMove;
+    private getMinInPixel;
     /**
      * @param {string} value - specifies the string value
      * @returns {string} returns the string
@@ -344,7 +345,6 @@ export declare class Splitter extends Component<HTMLElement> {
     sanitizeHelper(value: string): string;
     private checkDataAttributes;
     private destroyPaneSettings;
-    private checkBlazor;
     private setPaneSettings;
     private checkArrow;
     private removeDataPrefix;

package/src/splitter/splitter.js

@@ -17,7 +17,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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;
 };
-import { Component, Property, setStyleAttribute, ChildProperty, compile, isBlazor } from '@syncfusion/ej2-base';
+import { Component, Property, setStyleAttribute, ChildProperty, compile } from '@syncfusion/ej2-base';
 import { NotifyPropertyChanges, addClass, Collection, isNullOrUndefined } from '@syncfusion/ej2-base';
 import { Event, EventHandler, selectAll, removeClass, select, Browser, detach, formatUnit } from '@syncfusion/ej2-base';
 import { SanitizeHtmlHelper, extend } from '@syncfusion/ej2-base';
@@ -263,11 +263,9 @@ var Splitter = /** @class */ (function (_super) {
         this.onReportWindowSize = this.reportWindowSize.bind(this);
         this.wrapper = this.element.cloneNode(true);
         this.wrapperParent = this.element.parentElement;
-        if (!this.checkBlazor()) {
-            removeClass([this.wrapper], ['e-control', 'e-lib', ROOT]);
-            var orientation_1 = this.orientation === 'Horizontal' ? HORIZONTAL_PANE : VERTICAL_PANE;
-            addClass([this.element], orientation_1);
-        }
+        removeClass([this.wrapper], ['e-control', 'e-lib', ROOT]);
+        var orientation = this.orientation === 'Horizontal' ? HORIZONTAL_PANE : VERTICAL_PANE;
+        addClass([this.element], orientation);
         var name = Browser.info.name;
         var css = (name === 'msie') ? 'e-ie' : '';
         this.setCssClass(this.element, css);
@@ -294,19 +292,15 @@ var Splitter = /** @class */ (function (_super) {
      * @private
      */
     Splitter.prototype.render = function () {
-        if (!this.checkBlazor()) {
-            this.checkDataAttributes();
-            this.setCssClass(this.element, this.cssClass);
-            this.isEnabled(this.enabled);
-            this.setDimension(this.getHeight(this.element), this.getWidth(this.element));
-        }
+        this.checkDataAttributes();
+        this.setCssClass(this.element, this.cssClass);
+        this.isEnabled(this.enabled);
+        this.setDimension(this.getHeight(this.element), this.getWidth(this.element));
         this.createSplitPane(this.element);
         this.addSeparator(this.element);
         this.getPanesDimensions();
         this.setPaneSettings();
-        if (!this.checkBlazor()) {
-            this.setRTL(this.enableRtl);
-        }
+        this.setRTL(this.enableRtl);
         if (this.enableReversePanes) {
             this.setReversePane();
         }
@@ -334,11 +328,15 @@ var Splitter = /** @class */ (function (_super) {
             this.totalPercent = previousFlexBasis + nextFlexBasis;
             this.totalWidth = this.convertPercentageToPixel(this.totalPercent + '%');
             if (e.type === 'keydown' && (!isNullOrUndefined(e.keyCode))) {
-                if ((e.keyCode === 39 || (e.keyCode === 40)) && nextPaneSize > 0) {
+                if ((e.keyCode === 39 || (e.keyCode === 40)) && nextPaneSize > 0 &&
+                    (this.getMinInPixel(this.paneSettings[this.nextPaneIndex].min) <
+                        this.convertPercentageToPixel((nextFlexBasis - 1) + '%'))) {
                     this.previousPane.style.flexBasis = (previousFlexBasis + 1) + '%';
                     this.nextPane.style.flexBasis = (nextFlexBasis - 1) + '%';
                 }
-                else if ((e.keyCode === 37 || (e.keyCode === 38)) && prePaneSize > 0) {
+                else if ((e.keyCode === 37 || (e.keyCode === 38)) && prePaneSize > 0 &&
+                    (this.getMinInPixel(this.paneSettings[this.prevPaneIndex].min) <
+                        this.convertPercentageToPixel((previousFlexBasis - 1) + '%'))) {
                     this.previousPane.style.flexBasis = (previousFlexBasis - 1) + '%';
                     this.nextPane.style.flexBasis = (nextFlexBasis + 1) + '%';
                 }
@@ -348,13 +346,15 @@ var Splitter = /** @class */ (function (_super) {
             this.totalWidth = (this.orientation === 'Horizontal') ? this.previousPane.offsetWidth + this.nextPane.offsetWidth :
                 this.previousPane.offsetHeight + this.nextPane.offsetHeight;
             if (e.type === 'keydown' && (!isNullOrUndefined(e.keyCode))) {
-                if ((e.keyCode === 39 || (e.keyCode === 40)) && nextPaneSize > 0) {
+                if ((e.keyCode === 39 || (e.keyCode === 40)) && nextPaneSize > 0 &&
+                    (this.getMinInPixel(this.paneSettings[this.nextPaneIndex].min) < (nextPaneSize + splitBarSize))) {
                     this.addStaticPaneClass();
                     this.previousPane.style.flexBasis = (prePaneSize + splitBarSize) + 'px';
                     this.nextPane.style.flexBasis = (nextPaneSize < splitBarSize) ? '0px' :
                         (nextPaneSize - splitBarSize) + 'px';
                 }
-                else if ((e.keyCode === 37 || (e.keyCode === 38)) && prePaneSize > 0) {
+                else if ((e.keyCode === 37 || (e.keyCode === 38)) && prePaneSize > 0 &&
+                    (this.getMinInPixel(this.paneSettings[this.prevPaneIndex].min) < (prePaneSize - splitBarSize))) {
                     this.addStaticPaneClass();
                     this.previousPane.style.flexBasis = (prePaneSize < splitBarSize) ? '0px' :
                         (prePaneSize - splitBarSize) + 'px';
@@ -375,11 +375,12 @@ var Splitter = /** @class */ (function (_super) {
                 && (!isPrevpaneExpanded && !isNextpaneCollapsed && !isPrevpaneCollapsed || (isPrevpaneExpanded) && !isNextpaneCollapsed) &&
                 document.activeElement.classList.contains(SPLIT_BAR) && (this.paneSettings[index].resizable &&
                 this.paneSettings[index + 1].resizable)) {
+                event.preventDefault();
                 this.checkPaneSize(event);
                 this.triggerResizing(event);
             }
             else if (event.keyCode === 13 && this.paneSettings[index].collapsible &&
-                document.activeElement.classList.contains(SPLIT_BAR)) {
+                document.activeElement.classList.contains(SPLIT_BAR) && this.currentSeparator.classList.contains(SPLIT_BAR_ACTIVE)) {
                 if (!this.previousPane.classList.contains(COLLAPSE_PANE)) {
                     this.collapse(index);
                     addClass([this.currentSeparator], SPLIT_BAR_ACTIVE);
@@ -391,6 +392,18 @@ var Splitter = /** @class */ (function (_super) {
             }
         }
     };
+    Splitter.prototype.getMinInPixel = function (minValue) {
+        var min;
+        if (isNullOrUndefined(minValue)) {
+            return 0;
+        }
+        var paneMinRange = this.convertPixelToNumber(minValue.toString());
+        if (minValue.indexOf('%') > 0) {
+            paneMinRange = this.convertPercentageToPixel(minValue);
+        }
+        min = this.convertPixelToNumber((paneMinRange).toString());
+        return min;
+    };
     /**
      * @param {string} value - specifies the string value
      * @returns {string} returns the string
@@ -464,9 +477,6 @@ var Splitter = /** @class */ (function (_super) {
         });
         this.restoreElem();
     };
-    Splitter.prototype.checkBlazor = function () {
-        return isBlazor() && this.isServerRendered;
-    };
     Splitter.prototype.setPaneSettings = function () {
         var childCount = this.allPanes.length;
         var paneCollection = [];
@@ -866,52 +876,20 @@ var Splitter = /** @class */ (function (_super) {
         this.isResizable() ? this.allPanes[index].classList.add(RESIZABLE_PANE) : this.allPanes[index].classList.remove(RESIZABLE_PANE);
     };
     Splitter.prototype.addSeparator = function (target) {
-        var _this = this;
         var childCount = this.allPanes.length;
         var clonedEle = target.children;
         var separator;
         var proxy;
-        if (this.checkBlazor()) {
-            for (var j = 0; j < this.element.children.length; j++) {
-                if (this.element.children[j].classList.contains(SPLIT_BAR)) {
-                    this.allBars.push(this.element.children[j]);
-                }
-            }
-        }
         for (var i = 0; i < childCount; i++) {
             if (i < childCount - 1) {
-                if (!this.checkBlazor()) {
-                    separator = this.createSeparator(i);
-                    setStyleAttribute(separator, { 'order': (i * 2) + 1 });
-                    this.separatorOrder.push((i * 2) + 1);
-                    clonedEle[i].parentNode.appendChild(separator);
-                    this.currentSeparator = separator;
-                    separator.setAttribute('role', 'separator');
-                    separator.setAttribute('aria-orientation', this.orientation.toLowerCase());
-                }
-                if (this.checkBlazor()) {
-                    proxy = this;
-                    separator = this.allBars[i];
-                    this.updateIconClass();
-                }
-                if (!this.checkBlazor()) {
-                    this.wireClickEvents();
-                }
-                if (this.checkBlazor() && !isNullOrUndefined(separator)) {
-                    this.currentSeparator = separator;
-                    this.addMouseActions(separator);
-                    this.wireClickEvents();
-                    separator.addEventListener('focus', function () {
-                        if (document.activeElement.classList.contains('e-split-bar')) {
-                            proxy.currentSeparator = document.activeElement;
-                            proxy.currentSeparator.classList.add(SPLIT_BAR_ACTIVE);
-                        }
-                        _this.getPaneDetails();
-                    });
-                    separator.addEventListener('blur', function () {
-                        proxy.currentSeparator.classList.remove(SPLIT_BAR_ACTIVE);
-                    });
-                }
+                separator = this.createSeparator(i);
+                setStyleAttribute(separator, { 'order': (i * 2) + 1 });
+                this.separatorOrder.push((i * 2) + 1);
+                clonedEle[i].parentNode.appendChild(separator);
+                this.currentSeparator = separator;
+                separator.setAttribute('role', 'separator');
+                separator.setAttribute('aria-orientation', this.orientation.toLowerCase());
+                this.wireClickEvents();
                 if (!isNullOrUndefined(separator)) {
                     if (this.isResizable()) {
                         EventHandler.add(separator, 'mousedown', this.onMouseDown, this);
@@ -1370,13 +1348,7 @@ var Splitter = /** @class */ (function (_super) {
         }
     };
     Splitter.prototype.beforeAction = function (e) {
-        var eventArgs = isBlazor() ? {
-            element: this.element,
-            event: e,
-            index: [this.prevPaneIndex, this.nextPaneIndex],
-            separator: this.currentSeparator,
-            cancel: false
-        } : {
+        var eventArgs = {
             element: this.element,
             event: e,
             pane: [this.previousPane, this.nextPane],
@@ -1475,12 +1447,7 @@ var Splitter = /** @class */ (function (_super) {
         }
     };
     Splitter.prototype.afterAction = function (e) {
-        var eventArgs = isBlazor() ? {
-            element: this.element,
-            event: e,
-            index: [this.prevPaneIndex, this.nextPaneIndex],
-            separator: this.currentSeparator
-        } : {
+        var eventArgs = {
             element: this.element,
             event: e,
             pane: [this.previousPane, this.nextPane],
@@ -1493,10 +1460,6 @@ var Splitter = /** @class */ (function (_super) {
         this.currentBarIndex = this.getOrderIndex(parseInt(e.target.parentElement.style.order, 10), 'splitbar');
     };
     Splitter.prototype.getSeparatorIndex = function (target) {
-        var separator = this.orientation === 'Horizontal' ? SPLIT_H_BAR : SPLIT_V_BAR;
-        if (this.checkBlazor() && this.allBars.length < 1) {
-            this.allBars = selectAll('.' + separator, this.element);
-        }
         var array = [].slice.call(this.allBars);
         array = this.enableReversePanes ? array.reverse() : array;
         return array.indexOf(target);
@@ -1526,13 +1489,7 @@ var Splitter = /** @class */ (function (_super) {
         this.getPaneDetails();
     };
     Splitter.prototype.triggerResizing = function (e) {
-        var eventArgs = isBlazor() ? {
-            element: this.element,
-            event: e,
-            index: [this.prevPaneIndex, this.nextPaneIndex],
-            paneSize: [this.prePaneDimenson, this.nextPaneDimension],
-            separator: this.currentSeparator
-        } : {
+        var eventArgs = {
             element: this.element,
             event: e,
             pane: [this.previousPane, this.nextPane],
@@ -1553,13 +1510,7 @@ var Splitter = /** @class */ (function (_super) {
         addClass([this.currentSeparator], SPLIT_BAR_ACTIVE);
         this.updateCursorPosition(e, 'previous');
         this.getPaneDetails();
-        var eventArgs = isBlazor() ? {
-            element: this.element,
-            event: e,
-            index: [this.getPreviousPaneIndex(), this.getNextPaneIndex()],
-            separator: this.currentSeparator,
-            cancel: false
-        } : {
+        var eventArgs = {
             element: this.element,
             event: e,
             pane: [this.previousPane, this.nextPane],
@@ -1944,13 +1895,7 @@ var Splitter = /** @class */ (function (_super) {
     Splitter.prototype.onMouseUp = function (e) {
         removeClass([this.currentSeparator], SPLIT_BAR_ACTIVE);
         this.unwireResizeEvents();
-        var eventArgs = isBlazor() ? {
-            event: e,
-            element: this.element,
-            index: [this.prevPaneIndex, this.nextPaneIndex],
-            separator: this.currentSeparator,
-            paneSize: [this.prePaneDimenson, this.nextPaneDimension]
-        } : {
+        var eventArgs = {
             event: e,
             element: this.element,
             pane: [this.previousPane, this.nextPane],
@@ -2054,12 +1999,7 @@ var Splitter = /** @class */ (function (_super) {
         }
         var templateFUN;
         if (!isNullOrUndefined(templateFn)) {
-            if (isBlazor() && !this.isStringTemplate) {
-                templateFUN = templateFn({}, this, prop, this.element.id + 'content' + this.allPanes.length.toString(), this.isStringTemplate);
-            }
-            else {
-                templateFUN = templateFn({}, this, prop, this.element.id + 'content' + this.allPanes.length.toString(), true);
-            }
+            templateFUN = templateFn({}, this, prop, this.element.id + 'content' + this.allPanes.length.toString(), true);
         }
         if (!isNullOrUndefined(templateFn) && templateFUN && templateFUN.length > 0) {
             [].slice.call(templateFUN).forEach(function (el) {
@@ -2073,13 +2013,11 @@ var Splitter = /** @class */ (function (_super) {
     };
     Splitter.prototype.createSplitPane = function (target) {
         var childCount = target.children.length;
-        if (!this.checkBlazor()) {
-            for (var i = 0; i < this.paneSettings.length; i++) {
-                if (childCount < this.paneSettings.length) {
-                    var childElement = this.createElement('div');
-                    this.element.appendChild(childElement);
-                    childCount = childCount + 1;
-                }
+        for (var i = 0; i < this.paneSettings.length; i++) {
+            if (childCount < this.paneSettings.length) {
+                var childElement = this.createElement('div');
+                this.element.appendChild(childElement);
+                childCount = childCount + 1;
             }
         }
         childCount = target.children.length;
@@ -2089,30 +2027,23 @@ var Splitter = /** @class */ (function (_super) {
             for (var i = 0; i < childCount; i++) {
                 // To accept only div and span element as pane
                 if (child[i].nodeName === 'DIV' || child[i].nodeName === 'SPAN') {
-                    if (this.checkBlazor() && child[i].classList.contains(PANE)) {
-                        this.allPanes.push(child[i]);
+                    this.allPanes.push(child[i]);
+                    if (this.orientation === 'Horizontal') {
+                        addClass([child[i]], [PANE, SPLIT_H_PANE, SCROLL_PANE]);
+                        this.panesDimension(i, child);
                     }
-                    else if (!this.checkBlazor()) {
-                        this.allPanes.push(child[i]);
+                    else {
+                        addClass([child[i]], [PANE, SPLIT_V_PANE, SCROLL_PANE]);
+                        this.panesDimension(i, child);
                     }
-                    if (!this.checkBlazor()) {
-                        if (this.orientation === 'Horizontal') {
-                            addClass([child[i]], [PANE, SPLIT_H_PANE, SCROLL_PANE]);
-                            this.panesDimension(i, child);
-                        }
-                        else {
-                            addClass([child[i]], [PANE, SPLIT_V_PANE, SCROLL_PANE]);
-                            this.panesDimension(i, child);
-                        }
-                        if (!isNullOrUndefined(this.paneSettings[i]) && !isNullOrUndefined(this.paneSettings[i].content)) {
-                            this.setTemplate(this.paneSettings[i].content, child[i]);
-                        }
-                        if (!isNullOrUndefined(this.paneSettings[i]) && this.paneSettings[i].cssClass) {
-                            this.setCssClass(child[i], this.paneSettings[i].cssClass);
-                        }
-                        if (!isNullOrUndefined(this.paneSettings[i])) {
-                            this.paneCollapsible(child[i], i);
-                        }
+                    if (!isNullOrUndefined(this.paneSettings[i]) && !isNullOrUndefined(this.paneSettings[i].content)) {
+                        this.setTemplate(this.paneSettings[i].content, child[i]);
+                    }
+                    if (!isNullOrUndefined(this.paneSettings[i]) && this.paneSettings[i].cssClass) {
+                        this.setCssClass(child[i], this.paneSettings[i].cssClass);
+                    }
+                    if (!isNullOrUndefined(this.paneSettings[i])) {
+                        this.paneCollapsible(child[i], i);
                     }
                 }
             }
@@ -2145,24 +2076,15 @@ var Splitter = /** @class */ (function (_super) {
      */
     Splitter.prototype.destroy = function () {
         if (!this.isDestroyed) {
-            if (!this.checkBlazor()) {
-                _super.prototype.destroy.call(this);
-            }
+            _super.prototype.destroy.call(this);
             EventHandler.remove(document, 'touchstart click', this.onDocumentClick);
+            this.element.ownerDocument.defaultView.removeEventListener('resize', this.onReportWindowSize, true);
             while (this.element.attributes.length > 0) {
                 this.element.removeAttribute(this.element.attributes[0].name);
             }
-            if (this.checkBlazor()) {
-                var splitNodes = this.element.children;
-                for (var i = splitNodes.length - 1; i >= 0; i--) {
-                    detach(splitNodes[i]);
-                }
-            }
-            else {
-                this.element.innerHTML = this.wrapper.innerHTML;
-                for (var i = 0; i < this.wrapper.attributes.length; i++) {
-                    this.element.setAttribute(this.wrapper.attributes[i].name, this.wrapper.attributes[i].value);
-                }
+            this.element.innerHTML = this.wrapper.innerHTML;
+            for (var i = 0; i < this.wrapper.attributes.length; i++) {
+                this.element.setAttribute(this.wrapper.attributes[i].name, this.wrapper.attributes[i].value);
             }
             if (this.refreshing) {
                 addClass([this.element], ['e-control', 'e-lib', ROOT]);

package/styles/avatar/_bootstrap5-dark-definition.scss

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