Skip to content

Commit

Permalink
[react-interaction] Tweak Focus Table component (#16862)
Browse files Browse the repository at this point in the history
  • Loading branch information
trueadm authored Sep 23, 2019
1 parent d7f6dd5 commit 70754f1
Show file tree
Hide file tree
Showing 2 changed files with 21 additions and 16 deletions.
36 changes: 20 additions & 16 deletions packages/react-interactions/accessibility/src/FocusTable.js
Original file line number Diff line number Diff line change
Expand Up @@ -62,10 +62,10 @@ function focusCell(cell: ReactScopeMethods): void {
}
}

function focusCellByRowIndex(row: ReactScopeMethods, rowIndex: number): void {
function focusCellByIndex(row: ReactScopeMethods, cellIndex: number): void {
const cells = row.getChildren();
if (cells !== null) {
const cell = cells[rowIndex];
const cell = cells[cellIndex];
if (cell) {
focusCell(cell);
}
Expand Down Expand Up @@ -150,31 +150,33 @@ export function createFocusTable(): Array<React.Component> {
const currentCell = scopeRef.current;
switch (event.key) {
case 'ArrowUp': {
const [cells, rowIndex] = getRowCells(currentCell);
const [cells, cellIndex] = getRowCells(currentCell);
if (cells !== null) {
const [columns, columnIndex] = getRows(currentCell);
if (columns !== null) {
if (columnIndex > 0) {
const column = columns[columnIndex - 1];
focusCellByRowIndex(column, rowIndex);
} else if (columnIndex === 0) {
const [rows, rowIndex] = getRows(currentCell);
if (rows !== null) {
if (rowIndex > 0) {
const row = rows[rowIndex - 1];
focusCellByIndex(row, cellIndex);
event.preventDefault();
} else if (rowIndex === 0) {
triggerNavigateOut(currentCell, 'up');
}
}
}
return;
}
case 'ArrowDown': {
const [cells, rowIndex] = getRowCells(currentCell);
const [cells, cellIndex] = getRowCells(currentCell);
if (cells !== null) {
const [columns, columnIndex] = getRows(currentCell);
if (columns !== null) {
if (columnIndex !== -1) {
if (columnIndex === columns.length - 1) {
const [rows, rowIndex] = getRows(currentCell);
if (rows !== null) {
if (rowIndex !== -1) {
if (rowIndex === rows.length - 1) {
triggerNavigateOut(currentCell, 'down');
} else {
const column = columns[columnIndex + 1];
focusCellByRowIndex(column, rowIndex);
const row = rows[rowIndex + 1];
focusCellByIndex(row, cellIndex);
event.preventDefault();
}
}
}
Expand All @@ -186,6 +188,7 @@ export function createFocusTable(): Array<React.Component> {
if (cells !== null) {
if (rowIndex > 0) {
focusCell(cells[rowIndex - 1]);
event.preventDefault();
} else if (rowIndex === 0) {
triggerNavigateOut(currentCell, 'left');
}
Expand All @@ -200,6 +203,7 @@ export function createFocusTable(): Array<React.Component> {
triggerNavigateOut(currentCell, 'right');
} else {
focusCell(cells[rowIndex + 1]);
event.preventDefault();
}
}
}
Expand Down
1 change: 1 addition & 0 deletions packages/react-reconciler/src/ReactFiber.js
Original file line number Diff line number Diff line change
Expand Up @@ -789,6 +789,7 @@ function createFiberFromScope(
) {
const fiber = createFiber(ScopeComponent, pendingProps, key, mode);
fiber.type = scope;
fiber.elementType = scope;
fiber.expirationTime = expirationTime;
return fiber;
}
Expand Down

0 comments on commit 70754f1

Please sign in to comment.