@syncfusion/ej2-layouts 23.1.36 → 24.1.41

package/dist/es6/ej2-layouts.es5.js

@@ -873,7 +873,8 @@ var Splitter = /** @__PURE__ @class */ (function (_super) {
         this.addResizeHandler(separator);
         separator.appendChild(arrow1);
         this.updateCollapseIcons(i, arrow1, arrow2);
-        separator.setAttribute('tabindex', '0');
+        separator.setAttribute('tabindex', '-1');
+        separator.setAttribute('aria-hidden', 'true');
         if (this.enableReversePanes) {
             separator.setAttribute('dir', 'ltr');
         }
@@ -907,6 +908,7 @@ var Splitter = /** @__PURE__ @class */ (function (_super) {
                 clonedEle[i].parentNode.appendChild(separator);
                 this.currentSeparator = separator;
                 separator.setAttribute('role', 'separator');
+                separator.setAttribute('aria-valuenow', i.toString());
                 separator.setAttribute('aria-orientation', this.orientation.toLowerCase());
                 this.wireClickEvents();
                 if (!isNullOrUndefined(separator)) {
@@ -2549,6 +2551,7 @@ var DashboardLayout = /** @__PURE__ @class */ (function (_super) {
      * @private
      */
     DashboardLayout.prototype.render = function () {
+        this.element.setAttribute('role', 'list');
         this.initialize();
         this.isRenderComplete = true;
         if (this.showGridLines && !this.checkMediaQuery()) {
@@ -2562,6 +2565,7 @@ var DashboardLayout = /** @__PURE__ @class */ (function (_super) {
         this.table = document.createElement('table');
         var tbody = document.createElement('tbody');
         this.table.classList.add('e-dashboard-gridline-table');
+        this.table.setAttribute('role', 'presentation');
         for (var i = 0; i < this.maxRow(); i++) {
             var tr = document.createElement('tr');
             for (var j = 0; j < this.columns; j++) {
@@ -2681,9 +2685,9 @@ var DashboardLayout = /** @__PURE__ @class */ (function (_super) {
     DashboardLayout.prototype.updateOldRowColumn = function () {
         for (var i = 0; i < this.panels.length; i++) {
             var id = this.panels[i].id;
-            if (document.getElementById(id)) {
-                var row = parseInt(document.getElementById(id).getAttribute('data-row'), 10);
-                var col = parseInt(document.getElementById(id).getAttribute('data-col'), 10);
+            if (this.element.querySelector("[id='" + id + "']")) {
+                var row = parseInt(this.element.querySelector("[id='" + id + "']").getAttribute('data-row'), 10);
+                var col = parseInt(this.element.querySelector("[id='" + id + "']").getAttribute('data-col'), 10);
                 this.oldRowCol[this.panels[i].id] = { row: row, col: col };
             }
             else {
@@ -2755,6 +2759,10 @@ var DashboardLayout = /** @__PURE__ @class */ (function (_super) {
     };
     DashboardLayout.prototype.renderPanels = function (cellElement, panelModel, panelId, isStringTemplate) {
         addClass([cellElement], [panel, panelTransition]);
+        cellElement.setAttribute('role', 'listitem');
+        if (this.allowDragging) {
+            cellElement.setAttribute('aria-grabbed', 'false');
+        }
         var cssClass = panelModel.cssClass ? panelModel.cssClass.split(' ') : null;
         this.panelContent = cellElement.querySelector('.e-panel-container') ?
             cellElement.querySelector('.e-panel-container') :
@@ -3528,9 +3536,9 @@ var DashboardLayout = /** @__PURE__ @class */ (function (_super) {
         for (var h = 0; h < sizeY; ++h) {
             for (var w = 0; w < sizeX; ++w) {
                 item = this.getPanel(row + h, col + w, ignore);
-                if (item && (!ignore || ignore.indexOf(document.getElementById(item.id)) === -1) &&
-                    items.indexOf(document.getElementById(item.id)) === -1) {
-                    items.push(document.getElementById(item.id));
+                if (item && (!ignore || ignore.indexOf(this.element.querySelector("[id='" + item.id + "']")) === -1) &&
+                    items.indexOf(this.element.querySelector("[id='" + item.id + "']")) === -1) {
+                    items.push(this.element.querySelector("[id='" + item.id + "']"));
                 }
             }
         }
@@ -3898,7 +3906,7 @@ var DashboardLayout = /** @__PURE__ @class */ (function (_super) {
         }
         if (this.mainElement && this.oldRowCol !== this.cloneObject) {
             for (var i = 0; i < this.panels.length; i++) {
-                var element = document.getElementById(this.panels[i].id);
+                var element = this.element.querySelector("[id='" + this.panels[i].id + "']");
                 if (element === this.mainElement) {
                     continue;
                 }