in packages/web-components/fast-foundation/src/data-grid/data-grid.ts [383:490]
public handleKeydown(e: KeyboardEvent): void {
if (e.defaultPrevented) {
return;
}
let newFocusRowIndex: number;
const maxIndex = this.rowElements.length - 1;
const currentGridBottom: number = this.offsetHeight + this.scrollTop;
const lastRow: HTMLElement = this.rowElements[maxIndex] as HTMLElement;
switch (e.key) {
case keyArrowUp:
e.preventDefault();
// focus up one row
this.focusOnCell(this.focusRowIndex - 1, this.focusColumnIndex, true);
break;
case keyArrowDown:
e.preventDefault();
// focus down one row
this.focusOnCell(this.focusRowIndex + 1, this.focusColumnIndex, true);
break;
case keyPageUp:
e.preventDefault();
if (this.rowElements.length === 0) {
this.focusOnCell(0, 0, false);
break;
}
if (this.focusRowIndex === 0) {
this.focusOnCell(0, this.focusColumnIndex, false);
return;
}
newFocusRowIndex = this.focusRowIndex - 1;
for (newFocusRowIndex; newFocusRowIndex >= 0; newFocusRowIndex--) {
const thisRow: HTMLElement = this.rowElements[newFocusRowIndex];
if (thisRow.offsetTop < this.scrollTop) {
this.scrollTop =
thisRow.offsetTop + thisRow.clientHeight - this.clientHeight;
break;
}
}
this.focusOnCell(newFocusRowIndex, this.focusColumnIndex, false);
break;
case keyPageDown:
e.preventDefault();
if (this.rowElements.length === 0) {
this.focusOnCell(0, 0, false);
break;
}
// focus down one "page"
if (
this.focusRowIndex >= maxIndex ||
lastRow.offsetTop + lastRow.offsetHeight <= currentGridBottom
) {
this.focusOnCell(maxIndex, this.focusColumnIndex, false);
return;
}
newFocusRowIndex = this.focusRowIndex + 1;
for (newFocusRowIndex; newFocusRowIndex <= maxIndex; newFocusRowIndex++) {
const thisRow: HTMLElement = this.rowElements[
newFocusRowIndex
] as HTMLElement;
if (thisRow.offsetTop + thisRow.offsetHeight > currentGridBottom) {
let stickyHeaderOffset: number = 0;
if (
this.generateHeader === GenerateHeaderOptions.sticky &&
this.generatedHeader !== null
) {
stickyHeaderOffset = this.generatedHeader.clientHeight;
}
this.scrollTop = thisRow.offsetTop - stickyHeaderOffset;
break;
}
}
this.focusOnCell(newFocusRowIndex, this.focusColumnIndex, false);
break;
case keyHome:
if (e.ctrlKey) {
e.preventDefault();
// focus first cell of first row
this.focusOnCell(0, 0, true);
}
break;
case keyEnd:
if (e.ctrlKey && this.columnDefinitions !== null) {
e.preventDefault();
// focus last cell of last row
this.focusOnCell(
this.rowElements.length - 1,
this.columnDefinitions.length - 1,
true
);
}
break;
}
}