diff --git a/components/lib/calendar/Calendar.vue b/components/lib/calendar/Calendar.vue index 544eacd97..70bf05f62 100755 --- a/components/lib/calendar/Calendar.vue +++ b/components/lib/calendar/Calendar.vue @@ -2031,31 +2031,37 @@ export default { case 'ArrowUp': { cellContent.tabIndex = '-1'; - let prevRow = cell.parentElement.previousElementSibling; - if (prevRow) { - let tableRowIndex = DomHandler.index(cell.parentElement); - const tableRows = Array.from(cell.parentElement.parentElement.children); - const prevTableRows = tableRows.slice(0, tableRowIndex).reverse(); + if (event.altKey) { + this.overlayVisible = false; + this.focused = true; + } else { + let prevRow = cell.parentElement.previousElementSibling; - let hasNextFocusableDate = prevTableRows.find((el) => { - let focusCell = el.children[cellIndex].children[0]; + if (prevRow) { + let tableRowIndex = DomHandler.index(cell.parentElement); + const tableRows = Array.from(cell.parentElement.parentElement.children); + const prevTableRows = tableRows.slice(0, tableRowIndex).reverse(); - return !DomHandler.getAttribute(focusCell, 'data-p-disabled'); - }); + let hasNextFocusableDate = prevTableRows.find((el) => { + let focusCell = el.children[cellIndex].children[0]; - if (hasNextFocusableDate) { - let focusCell = hasNextFocusableDate.children[cellIndex].children[0]; + return !DomHandler.getAttribute(focusCell, 'data-p-disabled'); + }); - focusCell.tabIndex = '0'; - focusCell.focus(); + if (hasNextFocusableDate) { + let focusCell = hasNextFocusableDate.children[cellIndex].children[0]; + + focusCell.tabIndex = '0'; + focusCell.focus(); + } else { + this.navigationState = { backward: true }; + this.navBackward(event); + } } else { this.navigationState = { backward: true }; this.navBackward(event); } - } else { - this.navigationState = { backward: true }; - this.navBackward(event); } event.preventDefault(); diff --git a/doc/calendar/AccessibilityDoc.vue b/doc/calendar/AccessibilityDoc.vue index 60115d4db..c253505c0 100644 --- a/doc/calendar/AccessibilityDoc.vue +++ b/doc/calendar/AccessibilityDoc.vue @@ -116,12 +116,16 @@ space - Selects the date, closes the popup and moves focus to the input element. + Closes the popup and moves focus to the input element. up arrow Moves focus to the same day of the previous week. + + alt + up arrow + Closes the popup and moves focus to the input element. + down arrow Moves focus to the same day of the next week. @@ -148,7 +152,7 @@ shift + page up - Changes the date to previous year in date picker mode. Has no effect in month or year picker + Changes the date to previous year in date picker mode. Has no effect in month or year picker. page down @@ -156,7 +160,7 @@ shift + page down - Changes the date to next year in date picker mode. Has no effect in month or year picker + Changes the date to next year in date picker mode. Has no effect in month or year picker.