Component: Carousel accessibility issue

[Nostrs]

Describe the bug

Hello,

I’ve encountered an accessibility problem when using the p-carousel component. Specifically, when I include interactive elements inside the carousel items, the axe DevTools extension reports the following warning:

Aria-hidden element must not be focusable or contain focusable elements.

Please let me know if you need further information or assistance in reproducing the issue.

Thank you for your attention to this matter.

Environment

All environments

Reproducer

https://stackblitz.com/edit/stackblitz-starters-q6ccoe?embed=1&file=src%2Fmain.ts

Angular version

17.3.11

PrimeNG version

17.18.11

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

20.1.0

Browser(s)

No response

Steps to reproduce the behavior

1. Integrate the p-carousel component into your project.
2. Add interactive elements (e.g., buttons, links) inside the carousel slides.
3. Run an accessibility audit using the axe DevTools browser extension.
   Stackblitz: https://stackblitz.com/edit/stackblitz-starters-q6ccoe?embed=1&file=src%2Fmain.ts

Expected behavior

Expected Behavior:

•	The carousel should handle interactive elements without causing accessibility violations.
•	No warnings or errors should be reported by accessibility testing tools.

Actual Behavior:

•	The axe DevTools reports that focusable elements are nested within elements that have aria-hidden="true".
•	This creates accessibility issues, as hidden elements should not be focusable.