diff --git a/components/lib/accordion/Accordion.js b/components/lib/accordion/Accordion.js index f8e524d9d9..796353deaa 100644 --- a/components/lib/accordion/Accordion.js +++ b/components/lib/accordion/Accordion.js @@ -5,7 +5,7 @@ import { DomHandler, classNames, IconUtils, mergeProps, ObjectUtils, UniqueCompo import { AccordionBase, AccordionTabBase } from './AccordionBase'; import { ChevronRightIcon } from '../icons/chevronright'; import { ChevronDownIcon } from '../icons/chevrondown'; -import { PrimeReactContext, ariaLabel } from '../api/Api'; +import { PrimeReactContext } from '../api/Api'; import { useHandleStyle } from '../componentbase/ComponentBase'; export const AccordionTab = () => {}; @@ -116,24 +116,28 @@ export const Accordion = React.forwardRef((inProps, ref) => { const onTabArrowDownKey = (event) => { const nextHeaderAction = findNextHeaderAction(event.target.parentElement.parentElement); + nextHeaderAction ? changeFocusedTab(nextHeaderAction) : onTabHomeKey(event); event.preventDefault(); }; const onTabArrowUpKey = (event) => { const prevHeaderAction = findPrevHeaderAction(event.target.parentElement.parentElement); + prevHeaderAction ? changeFocusedTab(prevHeaderAction) : onTabEndKey(event); event.preventDefault(); }; const onTabHomeKey = (event) => { const firstHeaderAction = findFirstHeaderAction(); + changeFocusedTab(firstHeaderAction); event.preventDefault(); }; const onTabEndKey = (event) => { const lastHeaderAction = findLastHeaderAction(); + changeFocusedTab(lastHeaderAction); event.preventDefault(); }; @@ -146,12 +150,14 @@ export const Accordion = React.forwardRef((inProps, ref) => { const findNextHeaderAction = (tabElement, selfCheck = false) => { const nextTabElement = selfCheck ? tabElement : tabElement.nextElementSibling; const headerElement = DomHandler.findSingle(nextTabElement, '[data-pc-section="header"]'); + return headerElement ? (DomHandler.getAttribute(headerElement, 'data-p-disabled') ? findNextHeaderAction(headerElement.parentElement) : DomHandler.findSingle(headerElement, '[data-pc-section="headeraction"]')) : null; }; const findPrevHeaderAction = (tabElement, selfCheck = false) => { const prevTabElement = selfCheck ? tabElement : tabElement.previousElementSibling; const headerElement = DomHandler.findSingle(prevTabElement, '[data-pc-section="header"]'); + return headerElement ? (DomHandler.getAttribute(headerElement, 'data-p-disabled') ? findPrevHeaderAction(headerElement.parentElement) : DomHandler.findSingle(headerElement, '[data-pc-section="headeraction"]')) : null; }; diff --git a/components/lib/scrollpanel/ScrollPanel.js b/components/lib/scrollpanel/ScrollPanel.js index 3270a1cd04..c5451021c1 100644 --- a/components/lib/scrollpanel/ScrollPanel.js +++ b/components/lib/scrollpanel/ScrollPanel.js @@ -172,7 +172,6 @@ export const ScrollPanel = React.forwardRef((inProps, ref) => { }; const onKeyDown = (event) => { - console.log('hey?'); if (orientationState === 'vertical') { switch (event.code) { case 'ArrowDown': { diff --git a/components/lib/tabview/TabView.js b/components/lib/tabview/TabView.js index b4b85f03c5..5e870f8371 100644 --- a/components/lib/tabview/TabView.js +++ b/components/lib/tabview/TabView.js @@ -159,24 +159,28 @@ export const TabView = React.forwardRef((inProps, ref) => { const onTabArrowRightKey = (event) => { const nextHeaderAction = findNextHeaderAction(event.target.parentElement); + nextHeaderAction ? changeFocusedTab(nextHeaderAction) : onTabHomeKey(event); event.preventDefault(); }; const onTabArrowLeftKey = (event) => { const prevHeaderAction = findPrevHeaderAction(event.target.parentElement); + prevHeaderAction ? changeFocusedTab(prevHeaderAction) : onTabEndKey(event); event.preventDefault(); }; const onTabHomeKey = (event) => { const firstHeaderAction = findFirstHeaderAction(); + changeFocusedTab(firstHeaderAction); event.preventDefault(); }; const onTabEndKey = (event) => { const lastHeaderAction = findLastHeaderAction(); + changeFocusedTab(lastHeaderAction); event.preventDefault(); }; @@ -198,6 +202,7 @@ export const TabView = React.forwardRef((inProps, ref) => { const findNextHeaderAction = (tabElement, selfCheck = false) => { const headerElement = selfCheck ? tabElement : tabElement.nextElementSibling; + return headerElement ? DomHandler.getAttribute(headerElement, 'data-p-disabled') || DomHandler.getAttribute(headerElement, 'data-pc-section') === 'inkbar' ? findNextHeaderAction(headerElement) @@ -207,6 +212,7 @@ export const TabView = React.forwardRef((inProps, ref) => { const findPrevHeaderAction = (tabElement, selfCheck = false) => { const headerElement = selfCheck ? tabElement : tabElement.previousElementSibling; + return headerElement ? DomHandler.getAttribute(headerElement, 'data-p-disabled') || DomHandler.getAttribute(headerElement, 'data-pc-section') === 'inkbar' ? findPrevHeaderAction(headerElement)