@syncfusion/ej2-grids
Version:
Feature-rich JavaScript datagrid (datatable) control with built-in support for editing, filtering, grouping, paging, sorting, and exporting to Excel.
894 lines • 109 kB
JavaScript
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
import { EventHandler, getValue, closest, isNullOrUndefined } from '@syncfusion/ej2-base';
import { addClass, removeClass, extend, Browser } from '@syncfusion/ej2-base';
import { CellType } from '../base/enum';
import * as event from '../base/constant';
import { Row } from '../models/row';
import { RowModelGenerator } from './row-model-generator';
import { parentsUntil, addRemoveEventListener, findCellIndex } from '../base/util';
import * as literals from '../base/string-literals';
/**
* FocusStrategy class
*
* @hidden
*/
var FocusStrategy = /** @class */ (function () {
function FocusStrategy(parent) {
this.currentInfo = {};
this.oneTime = true;
this.swap = {};
/** @hidden */
this.isInfiniteScroll = false;
/** @hidden */
this.virtualSelectionInfo = {};
this.forget = false;
this.skipFocus = true;
this.focusByClick = false;
this.firstHeaderCellClick = false;
/** @hidden */
this.prevIndexes = {};
this.refMatrix = this.refreshMatrix(true);
this.actions = ['downArrow', 'upArrow'];
this.isVirtualScroll = false;
this.groupedFrozenRow = 0;
this.parent = parent;
this.rowModelGen = new RowModelGenerator(this.parent);
this.addEventListener();
}
FocusStrategy.prototype.focusCheck = function (e) {
var target = e.target;
this.focusByClick = true;
this.firstHeaderCellClick = true;
this.skipFocus = target.classList.contains('e-grid');
};
FocusStrategy.prototype.onFocus = function (e) {
if (this.parent.isDestroyed || Browser.isDevice || this.parent.enableVirtualization
|| this.parent.element.querySelector('.e-masked-table') || (!this.parent.isInitialLoad && e
&& e.target === this.parent.element && this.parent.element.querySelector('.e-spin-show'))) {
return;
}
this.setActive(!this.parent.enableHeaderFocus && this.parent.frozenRows === 0);
if (!this.parent.enableHeaderFocus && !this.parent.getCurrentViewRecords().length && ((this.parent.editSettings.mode !== 'Batch')
|| (this.parent.editSettings.mode === 'Batch' && this.parent.editModule && !this.parent.editModule.getBatchChanges()[literals.addedRecords].length))) {
this.getContent().matrix.
generate(this.rowModelGen.generateRows({ rows: [new Row({ isDataRow: true })] }), this.getContent().selector, false);
}
var current = this.getContent().matrix.get(0, -1, [0, 1], null, this.getContent().validator(), this.active);
this.getContent().matrix.select(current[0], current[1]);
if (this.skipFocus && !(e && e.target === this.parent.element)) {
this.focus(e);
this.skipFocus = false;
}
};
FocusStrategy.prototype.passiveFocus = function (e) {
if (this.parent.isDestroyed) {
return;
}
var firstHeaderCell = this.parent.getHeaderContent().querySelector('.e-headercell:not(.e-hide)');
if (e.target === firstHeaderCell && e.relatedTarget && !parentsUntil(e.relatedTarget, 'e-grid')
&& !this.firstHeaderCellClick) {
var firstHeaderCellIndex = [0, 0];
if (this.active.matrix.matrix[firstHeaderCellIndex[0]][firstHeaderCellIndex[1]] === 0) {
firstHeaderCellIndex = findCellIndex(this.active.matrix.matrix, firstHeaderCellIndex, true);
}
this.active.matrix.current = firstHeaderCellIndex;
this.currentInfo.element = e.target;
this.currentInfo.elementToFocus = e.target;
if (this.currentInfo.element.querySelector('.e-checkselectall')) {
this.removeFocus();
this.addFocus(this.getContent().getFocusInfo(), e);
}
else {
addClass([this.currentInfo.element], ['e-focused', 'e-focus']);
}
}
this.firstHeaderCellClick = false;
if (e.target && e.target.classList.contains('e-detailcell')) {
this.currentInfo.skipAction = false;
addClass([this.currentInfo.element], ['e-focused', 'e-focus']);
}
};
FocusStrategy.prototype.onBlur = function (e) {
if (this.parent.allowPaging && this.parent.pagerModule.pagerObj.element.querySelector('.e-pagercontainer')) {
this.parent.pagerModule.pagerObj.element.querySelector('.e-pagercontainer').removeAttribute('aria-hidden');
}
// The below boolean condition for gantt team focus fix.
var isGantt = parentsUntil(e.target, 'e-gantt') && e.target.classList.contains('e-rowcell')
&& (!isNullOrUndefined(e.target.nextElementSibling)
&& e.target.nextElementSibling.classList.contains('e-rowcell')) ? true : false;
if ((this.parent.isEdit || e && (!e.relatedTarget || closest(e.relatedTarget, '.e-grid') || closest(e.relatedTarget, '.e-grid-popup'))
&& !(this.parent.element.classList.contains('e-childgrid') && !this.parent.element.matches(':focus-within')))
&& !(!isGantt && isNullOrUndefined(e.relatedTarget) && parseInt(e.target.getAttribute('aria-colindex'), 10) - 1 === 0
&& parseInt(e.target.getAttribute('data-index'), 10) === 0) && !(!isGantt && isNullOrUndefined(e.relatedTarget)
&& !closest(document.activeElement, '.e-grid') && !isNullOrUndefined(e['sourceCapabilities']))) {
return;
}
this.removeFocus();
this.skipFocus = true;
this.currentInfo.skipAction = false;
this.setLastContentCellTabIndex();
this.setFirstFocusableTabIndex();
this.firstHeaderCellClick = false;
};
/**
* @returns {void}
* @hidden */
FocusStrategy.prototype.setFirstFocusableTabIndex = function () {
var gObj = this.parent;
gObj.element.tabIndex = -1;
if (gObj.allowGrouping && gObj.groupSettings.showDropArea) {
var groupModule = gObj.groupModule;
var focusableGroupedItems = groupModule.getFocusableGroupedItems();
if (focusableGroupedItems.length > 0) {
groupModule.element.tabIndex = -1;
focusableGroupedItems[0].tabIndex = 0;
}
else {
groupModule.element.tabIndex = 0;
}
return;
}
if (gObj.toolbar || gObj.toolbarTemplate) {
var toolbarElement = gObj.toolbarModule.element;
var focusableToolbarItems = this.parent.toolbarModule.getFocusableToolbarItems();
if (focusableToolbarItems.length > 0 && focusableToolbarItems[0].querySelector('.e-toolbar-item-focus,.e-btn,.e-input')) {
toolbarElement.tabIndex = -1;
focusableToolbarItems[0].querySelector('.e-toolbar-item-focus,.e-btn,.e-input').tabIndex = 0;
return;
}
else if (gObj.toolbarTemplate) {
toolbarElement.tabIndex = 0;
return;
}
}
if (gObj.getColumns().length) {
var firstHeaderCell = gObj.getHeaderContent().querySelector('.e-headercell:not(.e-hide)');
firstHeaderCell.tabIndex = 0;
this.setActive(false);
if (!isNullOrUndefined(this.active) && (isNullOrUndefined(this.active.target) || !this.active.target.classList.contains('e-columnmenu'))) {
var firstHeaderCellIndex = [0, 0];
if (this.active.matrix.matrix[firstHeaderCellIndex[0]][firstHeaderCellIndex[1]] === 0) {
firstHeaderCellIndex = findCellIndex(this.active.matrix.matrix, firstHeaderCellIndex, true);
}
this.active.matrix.current = firstHeaderCellIndex;
}
return;
}
};
FocusStrategy.prototype.setLastContentCellTabIndex = function () {
var contentTable = this.parent.getContentTable();
if (contentTable.rows[contentTable.rows.length - 1]) {
var lastCell = contentTable.rows[contentTable.rows.length - 1].lastElementChild;
lastCell.tabIndex = 0;
}
};
FocusStrategy.prototype.onClick = function (e, force, isFocusFirstCell) {
if (parentsUntil(e.target, 'e-filterbarcell') && (parentsUntil(e.target, 'e-multiselect') ||
e.target.classList.contains('e-input-group-icon'))) {
return;
}
var isContent = !isNullOrUndefined(closest(e.target, '.' + literals.gridContent));
var isHeader = !isNullOrUndefined(closest(e.target, '.' + literals.gridHeader));
isContent = isContent && isHeader ? !isContent : isContent;
if (!isContent && isNullOrUndefined(closest(e.target, '.' + literals.gridHeader)) ||
e.target.classList.contains(literals.content) || e.target.classList.contains(literals.headerContent) ||
(!isNullOrUndefined(closest(e.target, '.e-unboundcell')) && !force)) {
return;
}
this.setActive(isContent);
var beforeArgs = { cancel: false, byKey: false, byClick: !isNullOrUndefined(e.target), clickArgs: e };
this.parent.notify(event.beforeCellFocused, beforeArgs);
if (beforeArgs.cancel || (closest(e.target, '.e-inline-edit') && (!this.parent.editSettings.showAddNewRow &&
(this.parent.editSettings.showAddNewRow && !this.parent.element.querySelector('.e-editedrow'))))) {
return;
}
this.setActive(isContent);
if (this.getContent()) {
var returnVal = this.getContent().onClick(e, force);
if (returnVal === false) {
return;
}
this.focus();
if (this.currentInfo.element.classList.contains('e-rowcell') && e.type && e.type === 'click' && !isFocusFirstCell) {
addClass([this.currentInfo.element], ['e-focused', 'e-focus']);
}
if (isFocusFirstCell && e && e.target) {
addClass([e.target], ['e-focused', 'e-focus']);
}
}
};
FocusStrategy.prototype.handleFilterNavigation = function (e, inputSelector, buttonSelector) {
if (e.target === document.querySelector(inputSelector) && e.key === 'Tab' && e.shiftKey) {
e.preventDefault();
document.querySelector(buttonSelector).focus();
}
else if (e.target === document.querySelector(buttonSelector) && e.key === 'Tab' && !e.shiftKey &&
document.activeElement === document.querySelector(buttonSelector)) {
e.preventDefault();
document.querySelector(inputSelector).focus();
}
};
FocusStrategy.prototype.onKeyPress = function (e) {
if (this.content && this.content.target) {
this.content.target = null;
}
if (this.parent.allowPaging) {
var pagerElement = this.parent.pagerModule.pagerObj.element;
var focusablePagerElements = this.parent.pagerModule.pagerObj.getFocusablePagerElements(pagerElement, []);
if (this.parent.childGrid && !parentsUntil(e.target, 'e-gridpager') && this.allowToPaging(e) && focusablePagerElements.length) {
focusablePagerElements[0].tabIndex = 0;
}
if (this.parent.pagerModule.pagerObj.checkPagerHasFocus()) {
if (e.action === 'shiftTab' && focusablePagerElements.length && focusablePagerElements[0] === e.target) {
this.setActive(true);
var lastHeaderCellIndex = [this.active.matrix.matrix.length - 1,
this.active.matrix.matrix[this.active.matrix.matrix.length - 1].length - 1];
if (this.active.matrix.matrix[lastHeaderCellIndex[0]][lastHeaderCellIndex[1]] === 0) {
lastHeaderCellIndex = findCellIndex(this.active.matrix.matrix, lastHeaderCellIndex, false);
}
this.active.matrix.current = this.parent.editSettings.mode === 'Batch' ?
this.isValidBatchEditCell(lastHeaderCellIndex) ? lastHeaderCellIndex :
this.findBatchEditCell(lastHeaderCellIndex, false) : lastHeaderCellIndex;
e.preventDefault();
this.focus(e);
return;
}
if (!(e.action === 'tab' && this.parent.element.classList.contains('e-childgrid')
&& ((!this.parent.pageSettings.pageSizes && focusablePagerElements.length
&& focusablePagerElements[focusablePagerElements.length - 1] === e.target)
|| (this.parent.pagerModule.pagerObj.getDropDownPage() === e.target)))) {
this.parent.pagerModule.pagerObj.changePagerFocus(e);
return;
}
else {
var parentCell = parentsUntil(this.parent.element, 'e-detailcell');
removeClass([this.parent.element], ['e-focus']);
removeClass([parentCell], ['e-focused']);
parentCell.tabIndex = -1;
}
}
if (this.parent.pagerModule.pagerObj.element.tabIndex === 0 && (e.keyCode === 38 || (e.shiftKey && e.keyCode === 9))) {
e.preventDefault();
this.focus(e);
return;
}
else if (this.parent.pagerModule.pagerObj.element.tabIndex === 0 && e.keyCode === 9) {
e.preventDefault();
this.parent.pagerModule.pagerObj.setPagerFocus();
return;
}
if (this.parent.pagerModule.pagerObj.checkFirstPagerFocus()) {
var lastRow = this.getContent().matrix.rows;
var lastColumn = this.getContent().matrix.columns;
this.getContent().matrix.current = [lastRow, lastColumn];
}
}
if (this.parent.filterSettings.type === 'Excel') {
this.handleFilterNavigation(e, '.e-excelfilter .e-menu-item:not(.e-disabled)', '.e-excelfilter .e-footer-content button:nth-child(2)');
}
if (this.parent.filterSettings.type === 'CheckBox') {
var focusedColumn = this.parent.getColumnByUid(this.focusedColumnUid);
var focusTarget = focusedColumn && focusedColumn.filter && focusedColumn.filter.hideSearchbox ? '.e-chk-hidden' : '.e-searchinput.e-input';
this.handleFilterNavigation(e, focusTarget, '.e-checkboxfilter .e-footer-content button:nth-child(2)');
}
if (this.parent.filterSettings.type === 'Menu') {
this.handleFilterNavigation(e, '.e-flmenu .e-input-group.e-popup-flmenu', '.e-flmenu .e-footer-content button:nth-child(2)');
}
if (this.parent.showColumnChooser) {
this.handleFilterNavigation(e, '.e-ccdlg .e-ccsearch.e-cc.e-input', '.e-ccdlg .e-footer-content button:nth-child(2)');
}
if (this.skipOn(e)) {
return;
}
if (e.target && parentsUntil(e.target, 'e-gridcontent')) {
var rows = [].slice.call(this.parent.getContentTable().rows);
var lastCell = rows[rows.length - 1].lastElementChild;
if (e.target === lastCell) {
this.setActive(true);
this.setLastContentCellActive();
}
}
if (e.action === 'shiftTab' && e.target && (e.target === this.parent.element || parentsUntil(e.target, 'e-toolbar')
|| parentsUntil(e.target, 'e-groupdroparea'))) {
if (e.target === this.parent.element) {
if (this.parent.element.classList.contains('e-childgrid')) {
this.focusOutFromChildGrid(e);
}
return;
}
if (parentsUntil(e.target, 'e-groupdroparea')) {
if (this.parent.element.classList.contains('e-childgrid')) {
e.preventDefault();
this.parent.element.focus();
}
return;
}
if (parentsUntil(e.target, 'e-toolbar')) {
if (this.parent.allowGrouping && this.parent.groupSettings.showDropArea) {
var groupModule = this.parent.groupModule;
var focusableGroupedItems = groupModule.getFocusableGroupedItems();
e.preventDefault();
if (focusableGroupedItems.length > 0) {
focusableGroupedItems[focusableGroupedItems.length - 1].focus();
}
else {
groupModule.element.focus();
}
}
else if (this.parent.element.classList.contains('e-childgrid')) {
e.preventDefault();
this.parent.element.focus();
}
return;
}
}
var focusFirstHeaderCell = false;
if (e.action === 'tab' && e.target && (e.target === this.parent.element || parentsUntil(e.target, 'e-toolbar')
|| parentsUntil(e.target, 'e-groupdroparea'))) {
if (this.parent.allowGrouping && this.parent.groupSettings.showDropArea
&& (e.target === this.parent.element || e.target.classList.contains('e-groupdroparea'))) {
var groupModule = this.parent.groupModule;
var focusableGroupedItems = groupModule.getFocusableGroupedItems();
if (focusableGroupedItems.length > 0) {
e.preventDefault();
focusableGroupedItems[0].focus();
return;
}
if (!e.target.classList.contains('e-groupdroparea')) {
e.preventDefault();
groupModule.element.focus();
return;
}
}
if ((this.parent.toolbar || this.parent.toolbarTemplate) && (e.target === this.parent.element
|| parentsUntil(e.target, 'e-groupdroparea')
|| e.target.classList.contains('e-toolbar'))) {
var toolbarElement = this.parent.toolbarModule.element;
var focusableToolbarItems = this.parent.toolbarModule.getFocusableToolbarItems();
if (focusableToolbarItems.length > 0) {
e.preventDefault();
focusableToolbarItems[0].querySelector('.e-toolbar-item-focus,.e-btn,.e-input').focus();
return;
}
if (!e.target.classList.contains('e-toolbar') && this.parent.toolbarTemplate) {
e.preventDefault();
toolbarElement.focus();
return;
}
}
if (e.target === this.parent.element || parentsUntil(e.target, 'e-toolbar')
|| parentsUntil(e.target, 'e-groupdroparea')) {
focusFirstHeaderCell = true;
}
}
if (focusFirstHeaderCell) {
if (this.parent.allowGrouping && !isNullOrUndefined(this.parent.groupSettings.columns)
&& this.parent.groupSettings.columns.length === this.parent.columns.length) {
this.setActive(true);
}
else {
this.setActive(false);
}
this.active.matrix.current = [0, -1];
}
this.activeKey = e.action;
var beforeArgs = { cancel: false, byKey: true, byClick: false, keyArgs: e };
this.parent.notify(event.beforeCellFocused, beforeArgs);
if (beforeArgs.cancel) {
return;
}
var bValue = this.getContent().matrix.current;
var prevBatchValue = this.active && this.active.matrix.current ?
[this.active.matrix.current[0], this.active.matrix.current[1]] : undefined;
this.currentInfo.outline = true;
var swapInfo = this.getContent().jump(e.action, bValue);
this.swap = swapInfo;
if (swapInfo.swap && !(this.parent.editSettings.mode === 'Batch'
&& (e.action === 'tab' || e.action === 'shiftTab'))) {
this.setActive(!swapInfo.toHeader);
this.getContent().matrix.current = this.getContent().getNextCurrent(bValue, swapInfo, this.active, e.action);
this.prevIndexes = {};
}
this.setActiveByKey(e.action, this.getContent());
var returnVal = this.content.lastIdxCell ? false : this.getContent().onKeyPress(e);
if (e.target && parentsUntil(e.target, 'e-gridheader')) {
if (!isNullOrUndefined(this.active) && e.action === 'tab' && bValue.toString() === this.active.matrix.current.toString()) {
var nextHeaderCellIndex = findCellIndex(this.active.matrix.matrix, this.active.matrix.current, true);
var lastHeaderCellIndex = [this.active.matrix.matrix.length - 1,
this.active.matrix.matrix[this.active.matrix.matrix.length - 1].length - 1];
if (this.active.matrix.matrix[lastHeaderCellIndex[0]][lastHeaderCellIndex[1]] === 0) {
lastHeaderCellIndex = findCellIndex(this.active.matrix.matrix, lastHeaderCellIndex, false);
}
var nextCell = getValue(nextHeaderCellIndex[0] + ".cells." + nextHeaderCellIndex[1], this.active.matrix.getRowsFromIndex(nextHeaderCellIndex[0], this.active));
if (nextCell && nextCell.getBoundingClientRect().width === 0
&& this.active.matrix.matrix.length - 1 === nextHeaderCellIndex[0]) {
lastHeaderCellIndex = this.active.matrix.nextVisibleCellFocus(nextHeaderCellIndex[0], nextHeaderCellIndex[1], e.action, this.active.keyActions[e.action], this.active, this.active.matrix.current[1]);
}
if (this.active.matrix.current.toString() === lastHeaderCellIndex.toString() && this.content.matrix.matrix.length) {
returnVal = true;
this.setActive(true);
var firstContentCellIndex = [0, 0];
if (this.parent.allowPaging && this.parent.pagerModule.pagerObj.element.querySelector('.e-pagercontainer')) {
this.parent.pagerModule.pagerObj.element.querySelector('.e-pagercontainer').setAttribute('aria-hidden', 'true');
}
if (this.active.matrix.matrix[firstContentCellIndex[0]][firstContentCellIndex[1]] === 0) {
firstContentCellIndex = findCellIndex(this.active.matrix.matrix, [0, 0], true);
}
var firstCell = getValue(firstContentCellIndex[0] + ".cells." + firstContentCellIndex[1], this.active.matrix.getRowsFromIndex(firstContentCellIndex[0], this.active));
if (firstCell && firstCell.getBoundingClientRect().width === 0) {
firstContentCellIndex = this.active.matrix.nextVisibleCellFocus(firstContentCellIndex[0], firstContentCellIndex[1], e.action, this.active.keyActions[e.action], this.active, this.active.matrix.current[1]);
}
this.active.matrix.current = this.parent.editSettings.mode === 'Batch' ?
this.isValidBatchEditCell(firstContentCellIndex) ? firstContentCellIndex :
this.findBatchEditCell(firstContentCellIndex, true) : firstContentCellIndex;
if (this.parent.enableVirtualization && !this.parent.enableColumnVirtualization
&& this.parent.contentModule.prevInfo.blockIndexes[0] !== 1) {
e.preventDefault();
this.removeFocus();
var virtual = this.parent.contentModule;
virtual.firstCellFocus = true;
virtual.content.scrollTop = 0;
return;
}
}
else if (this.active.matrix.current.toString() !== nextHeaderCellIndex.toString()) {
this.active.matrix.current = nextHeaderCellIndex;
}
}
if (!isNullOrUndefined(this.active) && e.action === 'shiftTab' && bValue.toString() === this.active.matrix.current.toString()) {
var previousCellIndex = findCellIndex(this.active.matrix.matrix, this.active.matrix.current, false);
var prevCell = getValue(previousCellIndex[0] + ".cells." + previousCellIndex[1], this.active.matrix.getRowsFromIndex(previousCellIndex[0], this.active));
if (prevCell && prevCell.getBoundingClientRect().width === 0 && previousCellIndex[0] === 0) {
previousCellIndex = this.active.matrix.nextVisibleCellFocus(previousCellIndex[0], previousCellIndex[1], e.action, this.active.keyActions[e.action], this.active, this.active.matrix.current[1]);
}
if (previousCellIndex.toString() === this.active.matrix.current.toString()) {
this.focusOutFromHeader(e);
return;
}
if (this.active.matrix.current.toString() !== previousCellIndex.toString() && !returnVal) {
returnVal = true;
var prevCell_1 = getValue(previousCellIndex[0] + ".cells." + previousCellIndex[1], this.active.matrix.getRowsFromIndex(previousCellIndex[0], this.active));
if (prevCell_1 && prevCell_1.getBoundingClientRect().width === 0 && previousCellIndex[0] === 0) {
previousCellIndex = this.active.matrix.nextVisibleCellFocus(previousCellIndex[0], previousCellIndex[1], e.action, this.active.keyActions[e.action], this.active, this.active.matrix.current[1]);
}
this.active.matrix.current = previousCellIndex;
}
}
}
if (e.target && parentsUntil(e.target, 'e-gridcontent')) {
if (this.parent.allowPaging && this.parent.pagerModule.pagerObj.element.querySelector('.e-pagercontainer')) {
this.parent.pagerModule.pagerObj.element.querySelector('.e-pagercontainer').removeAttribute('aria-hidden');
}
if (this.parent.editSettings.mode === 'Batch' && (e.action === 'tab' || e.action === 'shiftTab')) {
this.active.matrix.current = this.findBatchEditCell(prevBatchValue, e.action === 'tab' ? true : false);
if (e.action === 'tab' && prevBatchValue.toString() === this.active.matrix.current.toString()) {
this.parent.editModule.editModule.addBatchRow = true;
}
}
if (e.action === 'shiftTab' && bValue.toString() === this.active.matrix.current.toString()) {
if (this.parent.allowGrouping && !isNullOrUndefined(this.parent.groupSettings.columns)
&& this.parent.groupSettings.columns.length === this.parent.columns.length) {
this.focusOutFromHeader(e);
return;
}
var firstContentCellIndex = [0, 0];
if (this.active.matrix.matrix[firstContentCellIndex[0]][firstContentCellIndex[1]] === 0) {
firstContentCellIndex = findCellIndex(this.active.matrix.matrix, [0, 0], true);
}
var firstCell = getValue(firstContentCellIndex[0] + ".cells." + firstContentCellIndex[1], this.active.matrix.getRowsFromIndex(firstContentCellIndex[0], this.active));
if (firstCell && firstCell.getBoundingClientRect().width === 0) {
firstContentCellIndex = this.active.matrix.nextVisibleCellFocus(firstContentCellIndex[0], firstContentCellIndex[1], e.action, this.active.keyActions[e.action], this.active, this.active.matrix.current[1]);
}
if (!returnVal && (firstContentCellIndex.toString() === this.active.matrix.current.toString()
|| (this.parent.editSettings.mode === 'Batch'
&& prevBatchValue.toString() === this.active.matrix.current.toString()))) {
returnVal = true;
this.setActive(false);
this.setLastContentCellActive();
}
}
}
if (returnVal === false) {
this.clearIndicator();
if (e.action === 'shiftTab' && bValue.toString() === [0, 0].toString()) {
this.parent.element.tabIndex = -1;
}
if (this.parent.allowPaging && !this.parent.pagerModule.pagerObj.checkPagerHasFocus() && this.allowToPaging(e)
&& bValue.toString() !== [0, 0].toString()) {
e.preventDefault();
if (e.keyCode === 40) {
this.parent.pagerModule.pagerObj.setPagerContainerFocus();
return;
}
else if (e.keyCode === 9) {
this.parent.pagerModule.pagerObj.setPagerFocus();
return;
}
}
if (this.parent.element.classList.contains('e-childgrid')) {
this.focusOutFromChildGrid(e);
}
return;
}
this.header.action = e.action;
this.header.currentTarget = null;
this.header.focusType = 'key';
if (e.target && parentsUntil(e.target, 'e-fltrtemp') && (e.action === 'tab' || e.action === 'shiftTab')) {
var target = e.target;
var focusElement = [].slice.call(closest(target, 'th').querySelectorAll('.e-fltrtemp-focus'));
if (focusElement.length) {
var elementIndex = focusElement.indexOf(target);
var resetActive = ((e.action === 'tab' && elementIndex < focusElement.length - 1)
|| (e.action === 'shiftTab' && elementIndex > 0)) ? true : false;
if (resetActive) {
this.setActive(false);
this.active.matrix.current = bValue;
this.active.currentTarget = target;
}
}
}
if (focusFirstHeaderCell && parentsUntil(this.active.getTable(), 'e-gridheader')
&& e.target && e.target.id === this.parent.element.id + '_searchbar') {
this.parent.searchModule.headerFocus = true;
}
e.preventDefault();
this.focus(e);
};
FocusStrategy.prototype.isValidBatchEditCell = function (cellIndex) {
var cell = this.active.getTable().rows[cellIndex[0]].cells[cellIndex[1]];
var tr = closest(cell, 'tr');
var cellColIndex = parseInt(cell.getAttribute('aria-colindex'), 10) - 1;
var cellCol = this.parent.getColumns()[parseInt(cellColIndex.toString(), 10)];
if (this.active.matrix.matrix[cellIndex[0]][cellIndex[1]] === 1
&& (!tr.classList.contains('e-row') || (tr.classList.contains('e-insertedrow') || !cellCol.isPrimaryKey) && cellCol.allowEditing)) {
return true;
}
return false;
};
FocusStrategy.prototype.findBatchEditCell = function (currentCellIndex, next, limitRow) {
var cellIndex = currentCellIndex;
var tempCellIndex = currentCellIndex;
var cellIndexObtain = false;
while (!cellIndexObtain) {
var prevTempCellIndex = tempCellIndex;
tempCellIndex = findCellIndex(this.active.matrix.matrix, tempCellIndex, next);
var tempCell = getValue(tempCellIndex[0] + ".cells." + tempCellIndex[1], this.active.getTable().rows);
if (tempCell && tempCell.getBoundingClientRect().width === 0) {
tempCellIndex = this.active.matrix.nextVisibleCellFocus(tempCellIndex[0], tempCellIndex[1], this.activeKey, this.active.keyActions[this.activeKey], this.active, this.active.matrix.current[1]);
}
if ((prevTempCellIndex.toString() === tempCellIndex.toString())
|| (limitRow && prevTempCellIndex[0] !== tempCellIndex[0])) {
cellIndexObtain = true;
continue;
}
if (this.isValidBatchEditCell(tempCellIndex)) {
cellIndex = tempCellIndex;
cellIndexObtain = true;
}
}
return cellIndex;
};
FocusStrategy.prototype.setLastContentCellActive = function () {
var lastContentCellIndex = [this.active.matrix.matrix.length - 1,
this.active.matrix.matrix[this.active.matrix.matrix.length - 1].length - 1];
if (this.active.matrix.matrix[lastContentCellIndex[0]][lastContentCellIndex[1]] === 0) {
lastContentCellIndex = findCellIndex(this.active.matrix.matrix, lastContentCellIndex, false);
}
var lastCell = getValue(lastContentCellIndex[0] + ".cells." + lastContentCellIndex[1], this.active.matrix.getRowsFromIndex(lastContentCellIndex[0], this.active));
if (lastCell && lastCell.getBoundingClientRect().width === 0) {
lastContentCellIndex = this.active.matrix.nextVisibleCellFocus(lastContentCellIndex[0], lastContentCellIndex[1], this.activeKey, this.active.keyActions[this.activeKey], this.active, this.active.matrix.current[1]);
}
this.active.matrix.current = lastContentCellIndex;
};
FocusStrategy.prototype.focusOutFromChildGrid = function (e) {
var parentTable = parentsUntil(this.parent.element, 'e-table');
var parentGrid = parentsUntil(parentTable, 'e-grid').ej2_instances[0];
var parentCell = parentsUntil(this.parent.element, 'e-detailcell');
var uid = parentsUntil(this.parent.element, 'e-detailrow').getAttribute('data-uid');
var parentRows = [].slice.call(parentGrid.getContentTable().rows);
var parentRowIndex = parentRows.map(function (m) { return m.getAttribute('data-uid'); }).indexOf(uid);
if (e.action === 'tab' && parentRowIndex >= parentRows.length - 1) {
return;
}
removeClass([this.parent.element], ['e-focus']);
removeClass([parentCell], ['e-focused']);
parentCell.tabIndex = -1;
e.preventDefault();
var nextFocusCell;
parentGrid.focusModule.removeFocus();
if (e.action === 'shiftTab') {
var previousRow = parentRows[parentRowIndex - 1];
var rowCells = previousRow.cells;
for (var i = rowCells.length - 1; i >= 0; i--) {
nextFocusCell = rowCells[parseInt(i.toString(), 10)];
if (!nextFocusCell.classList.contains('e-hide')) {
parentGrid.focusModule.active.matrix.current = [parentRowIndex - 1, i];
break;
}
}
}
else {
nextFocusCell = parentRows[parentRowIndex + 1].cells[0];
parentGrid.focusModule.active.matrix.current = [parentRowIndex + 1, 0];
}
parentGrid.focusModule.currentInfo.element = nextFocusCell;
parentGrid.focusModule.currentInfo.elementToFocus = nextFocusCell;
addClass([nextFocusCell], ['e-focused', 'e-focus']);
nextFocusCell.tabIndex = 0;
nextFocusCell.focus();
};
FocusStrategy.prototype.focusOutFromHeader = function (e) {
this.removeFocus();
if (this.parent.toolbar || this.parent.toolbarTemplate) {
var toolbarElement = this.parent.toolbarModule.element;
var focusableToolbarItems = this.parent.toolbarModule.getFocusableToolbarItems();
if (focusableToolbarItems.length > 0) {
e.preventDefault();
focusableToolbarItems[focusableToolbarItems.length - 1].querySelector('.e-toolbar-item-focus,.e-btn,.e-input').focus();
return;
}
else if (this.parent.toolbarTemplate) {
e.preventDefault();
toolbarElement.focus();
return;
}
}
if (this.parent.allowGrouping && this.parent.groupSettings.showDropArea) {
var groupModule = this.parent.groupModule;
var focusableGroupedItems = groupModule.getFocusableGroupedItems();
e.preventDefault();
if (focusableGroupedItems.length > 0) {
focusableGroupedItems[focusableGroupedItems.length - 1].focus();
}
else {
groupModule.element.focus();
}
return;
}
if (this.parent.element.classList.contains('e-childgrid')) {
e.preventDefault();
this.parent.element.focus();
}
};
FocusStrategy.prototype.allowToPaging = function (e) {
if (this.parent.editSettings.mode === 'Batch' && this.parent.editSettings.allowAdding && e.keyCode !== 40) {
return false;
}
return true;
};
FocusStrategy.prototype.skipOn = function (e) {
var target = e.target;
if (!target) {
return false;
}
if (!this.parent.isEdit && target && target.closest('.e-unboundcell') && this.currentInfo.skipAction && ((e.action === 'shiftTab' &&
this.commandColumnFocusElement(target.closest('.e-unboundcell'), false) === target) ||
(e.action === 'tab' &&
this.commandColumnFocusElement(target.closest('.e-unboundcell'), true) === target))) {
return this.currentInfo.skipAction = false;
}
if (this.currentInfo.skipAction) {
this.clearIndicator();
return true;
}
if (['pageUp', 'pageDown', 'altDownArrow'].indexOf(e.action) > -1) {
this.clearIndicator();
return true;
}
if (this.parent.allowGrouping) {
var focusableGroupedItems = this.parent.groupModule.getFocusableGroupedItems();
if (parentsUntil(e.target, 'e-groupheadercell')
&& !((e.target === focusableGroupedItems[0] && e.action === 'shiftTab')
|| (e.target === focusableGroupedItems[focusableGroupedItems.length - 1] && e.action === 'tab'))) {
return true;
}
}
if (this.parent.toolbar || this.parent.toolbarTemplate) {
var toolbarElement = this.parent.toolbarModule.element;
var focusableToolbarItems = toolbarElement
.querySelectorAll('.e-toolbar-item:not(.e-overlay):not(.e-hidden)');
if (parentsUntil(e.target, 'e-toolbar-item')
&& !(focusableToolbarItems.length > 0 && ((parentsUntil(e.target, 'e-toolbar-item') === focusableToolbarItems[0] && e.action === 'shiftTab')
|| (parentsUntil(e.target, 'e-toolbar-item') === focusableToolbarItems[focusableToolbarItems.length - 1] && e.action === 'tab')))) {
return true;
}
}
var th = closest(target, 'th') && !closest(target, 'th').tabIndex;
if (e.target.classList.contains('e-filterbaroperator') && (e.keyCode === 13 || e.keyCode === 27)) {
var inputTarget = closest(e.target, '.e-filterbarcell');
inputTarget.querySelector('input').focus();
}
var addNewRow = this.parent.editSettings.showAddNewRow && closest(document.activeElement, '.e-addedrow') !== null;
if ((th && closest(document.activeElement, '.e-filterbarcell') !== null) || addNewRow) {
this.removeFocus();
}
var filterCell = closest(document.activeElement, '.e-filterbarcell') !== null;
if (this.parent.enableHeaderFocus && filterCell) {
var matrix = this.active.matrix;
var current = matrix.current;
filterCell = matrix.matrix[current[0]].lastIndexOf(1) !== current[1];
}
if (this.parent.isEdit && (e.action === 'tab' || e.action === 'shiftTab') && this.parent.editSettings.mode === 'Normal'
&& !this.parent.editSettings.showAddNewRow && !isNullOrUndefined(parentsUntil(target, 'e-addedrow'))) {
var inputElements = this.parent.editModule.formObj.element.querySelectorAll('input:not([type="hidden"],.e-numeric-hidden,.e-disabled), select:not([aria-hidden="true"]), button:not(.e-hide), textarea:not(.e-hide,.e-disabled,[disabled])');
var inputTarget = target.classList.contains('e-ddl') ? target.querySelector('input') : target;
var firstEditCell = e.action === 'tab' && inputTarget === inputElements[inputElements.length - 1];
var lastEditCell = e.action === 'shiftTab' && inputTarget === inputElements[0];
if (firstEditCell || lastEditCell) {
e.preventDefault();
var focusElement = inputElements[firstEditCell ? 0 : inputElements.length - 1];
focusElement = focusElement.parentElement.classList.contains('e-ddl') ? focusElement.parentElement : focusElement;
focusElement.focus();
}
}
return (e.action === 'delete'
|| (this.parent.editSettings.mode !== 'Batch' && ((this.parent.isEdit && (!this.parent.editSettings.showAddNewRow ||
(this.parent.editSettings.showAddNewRow && ((!isNullOrUndefined(this.parent.element.querySelector('.e-editedrow')) ||
(!isNullOrUndefined(parentsUntil(target, 'e-addedrow')) && !isNullOrUndefined(closest(e.target, 'input')) && !isNullOrUndefined(document.querySelector('.e-popup-open'))) ||
(!isNullOrUndefined(parentsUntil(target, 'e-addedrow')) && (target && !target.querySelector('.e-cancel-icon')) &&
!isNullOrUndefined(parentsUntil(target, 'e-unboundcell')))))))) || ['insert', 'f2'].indexOf(e.action) > -1))
|| ((filterCell && this.parent.enableHeaderFocus) || ((filterCell || addNewRow) && e.action !== 'tab' && e.action !== 'shiftTab') ||
closest(document.activeElement, '#' + this.parent.element.id + '_searchbar') !== null
&& ['enter', 'leftArrow', 'rightArrow',
'shiftLeft', 'shiftRight', 'ctrlPlusA'].indexOf(e.action) > -1)
|| (closest(target, '.' + literals.gridContent) === null && closest(target, '.' + literals.gridHeader) === null
&& !(e.target === this.parent.element || parentsUntil(e.target, 'e-toolbar')
|| parentsUntil(e.target, 'e-groupdroparea')))
|| (e.action === 'space' && (!target.classList.contains(literals.gridChkBox) && closest(target, '.' + literals.gridChkBox) === null
&& closest(target, '.e-headerchkcelldiv') === null))) || closest(target, '.e-filter-popup') !== null;
};
FocusStrategy.prototype.focusVirtualElement = function (e) {
var _this = this;
if (this.parent.enableVirtualization || this.parent.enableInfiniteScrolling) {
var data = { virtualData: {}, isAdd: false, isCancel: false };
this.parent.notify(event.getVirtualData, data);
var isKeyFocus = this.actions.some(function (value) { return value === _this.activeKey; });
var isSelected = this.parent.contentModule ?
this.parent.contentModule.selectedRowIndex > -1 : false;
if (data.isAdd || Object.keys(data.virtualData).length || isKeyFocus || data.isCancel || isSelected) {
this.parent.notify(event.resetVirtualFocus, { isCancel: false });
data.isCancel = false;
if (((this.parent.enableVirtualization && !this.parent.selectVirtualRowOnAdd) && (!e || (e && e.action !== 'ctrlHome' && e.action !== 'ctrlEnd'))) ||
!this.parent.enableVirtualization) {
this.parent.contentModule.selectedRowIndex = -1;
}
this.parent.selectVirtualRowOnAdd = false;
if (isKeyFocus) {
this.activeKey = this.empty;
this.parent.notify('virtaul-key-handler', e);
}
// eslint-disable-next-line @typescript-eslint/no-explicit-any
this.currentInfo.elementToFocus.focus({ preventScroll: true });
}
else {
if (this.isVirtualScroll || this.isInfiniteScroll) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
this.currentInfo.elementToFocus.focus({ preventScroll: true });
}
else {
this.currentInfo.elementToFocus.focus();
}
}
}
this.isVirtualScroll = this.isInfiniteScroll = false;
};
FocusStrategy.prototype.getFocusedElement = function () {
return this.currentInfo.elementToFocus;
};
FocusStrategy.prototype.getContent = function () {
return this.active || this.content;
};
FocusStrategy.prototype.setActive = function (content) {
this.active = content ? this.content : this.header;
};
FocusStrategy.prototype.setFocusedElement = function (element, e) {
var _this = this;
this.currentInfo.elementToFocus = element;
setTimeout(function () {
if (!isNullOrUndefined(_this.currentInfo.elementToFocus)) {
var filterMenuElement = isNullOrUndefined(_this.parent.element.querySelector('.e-flmenu')) ?
document.querySelector('.e-grid-popup .e-flmenu') : _this.parent.element.querySelector('.e-flmenu');
if ((_this.parent.enableVirtualization || _this.parent.enableInfiniteScrolling) && isNullOrUndefined(filterMenuElement)) {
_this.focusVirtualElement(e);
}
else if (isNullOrUndefined(filterMenuElement) ||
parentsUntil(document.activeElement, 'e-flmenu-valuediv') !== filterMenuElement.querySelector('.e-flmenu-valuediv')) {
_this.currentInfo.elementToFocus.focus();
}
}
}, 0);
};
FocusStrategy.prototype.focus = function (e) {
this.parent.notify(event.virtaulCellFocus, e);
this.removeFocus();
this.addFocus(this.getContent().getFocusInfo(), e);
};
// eslint-disable-next-line @typescript-eslint/no-unused-vars
FocusStrategy.prototype.removeFocus = function (e) {
if (!this.currentInfo.element) {
return;
}
if (this.parent.isReact && !this.parent.isEdit && this.currentInfo.element.classList.contains('e-rowcell')
&& !this.currentInfo.element.parentElement && !(this.parent.allowGrouping
&& !isNullOrUndefined(this.parent.groupSettings.columns) && this.parent.groupSettings.columns.length) &&
this.parent.getRowByIndex(this.prevIndexes.rowIndex)) {
var cellElem = this.parent.getCellFromIndex(this.prevIndexes.rowIndex, this.prevIndexes
.cellIndex);
this.currentInfo.element = cellElem ? cellElem : this.currentInfo.element;
}
removeClass([this.currentInfo.element, this.currentInfo.elementToFocus], ['e-focused', 'e-focus']);
this.currentInfo.element.tabIndex = -1;
};
/**
* @returns {void}
* @hidden */
FocusStrategy.prototype.addOutline = function () {
var info = this.getContent().getFocusInfo();
if (info.element) {
addClass([info.element], ['e-focused']);
addClass([info.elementToFocus], ['e-focus']);
}
};
/**
* @returns {void}
* @hidden */
FocusStrategy.prototype.focusHeader = function () {
this.setActive(false);
this.resetFocus();
};
/**
* @returns {void}
* @hidden */
FocusStrategy.prototype.focusContent = function () {
this.setActive(true);
this.resetFocus();
};
FocusStrategy.prototype.resetFocus = function () {
var current = this.getContent().matrix.get(0, -1, [0, 1], null, this.getContent().validator());
this.getContent().matrix.select(current[0], current[1]);
this.focus();
};
FocusStrategy.prototype.addFocus = function (info, e) {
this.currentInfo = info;
this.currentInfo.outline = info.outline && (!isNullOrUndefined(e) || this.isVirtualScroll);
if (this.isInfiniteScroll) {
this.currentInfo.outline = true;
}
if (!info.element) {
return;
}
var isFocused = info.elementToFocus.classList.contains('e-focus');
if (isFocused) {
return;
}
if (this.currentInfo.outline) {
addClass([info.element], ['e-focused']);
}
addClass([info.elementToFocus], ['e-focus']);
info.element.tabIndex = 0;
if (!isFocused) {
this.setFocusedElement(info.elementToFocus, e);
}
this.parent.notify(event.cellFocused, {
element: info.elementToFocus,
parent: info.element,
indexes: this.getContent().matrix.current,
byKey: !isNullOrUndefined(e),
byClick: isNullOrUndefined(e),
keyArgs: e,
isJump: this.swap.swap,
container: this.getContent().getInfo(e),
outline: !isNullOrUndefined(e),
swa