From ec81f4072b2d637cebfc8284314fe66a34f917bf Mon Sep 17 00:00:00 2001
From: Melloware <mellowaredev@gmail.com>
Date: Tue, 28 Jan 2025 07:50:42 -0500
Subject: [PATCH] Fix #7643: Dropdown add aria label Option List (#7655)

---
 components/lib/api/Locale.js             |  1 +
 components/lib/api/api.d.ts              |  4 ++++
 components/lib/dropdown/DropdownPanel.js | 12 +++++++-----
 components/lib/hooks/useLocale.js        |  1 +
 4 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/components/lib/api/Locale.js b/components/lib/api/Locale.js
index 96dd4343af..b8fe28f24a 100644
--- a/components/lib/api/Locale.js
+++ b/components/lib/api/Locale.js
@@ -86,6 +86,7 @@ let locales = {
             jumpToPageDropdownLabel: 'Jump to Page Dropdown',
             jumpToPageInputLabel: 'Jump to Page Input',
             lastPageLabel: 'Last Page',
+            listLabel: 'Option List',
             listView: 'List View',
             moveAllToSource: 'Move All to Source',
             moveAllToTarget: 'Move All to Target',
diff --git a/components/lib/api/api.d.ts b/components/lib/api/api.d.ts
index 6afd46cea2..9586fa1d1d 100644
--- a/components/lib/api/api.d.ts
+++ b/components/lib/api/api.d.ts
@@ -1205,6 +1205,10 @@ export interface LocaleOptions {
          * Rotate Left
          */
         rotateLeft?: string;
+        /**
+         * Options List Label
+         */
+        listLabel?: string;
     };
 }
 
diff --git a/components/lib/dropdown/DropdownPanel.js b/components/lib/dropdown/DropdownPanel.js
index d506bf3a65..4ba9b3fca1 100644
--- a/components/lib/dropdown/DropdownPanel.js
+++ b/components/lib/dropdown/DropdownPanel.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { localeOption, PrimeReactContext } from '../api/Api';
+import { ariaLabel, localeOption, PrimeReactContext } from '../api/Api';
 import { CSSTransition } from '../csstransition/CSSTransition';
 import { useMergeProps } from '../hooks/Hooks';
 import { SearchIcon } from '../icons/search';
@@ -158,11 +158,11 @@ export const DropdownPanel = React.memo(
 
         const createFilterClearIcon = () => {
             if (props.showFilterClear && props.filterValue) {
-                const ariaLabel = localeOption('clear');
+                const ariaLabelFilterClear = localeOption('clear');
                 const clearIconProps = mergeProps(
                     {
                         className: cx('filterClearIcon'),
-                        'aria-label': ariaLabel,
+                        'aria-label': ariaLabelFilterClear,
                         onClick: () => props.onFilterClearIconClick(() => DomHandler.focus(filterInputRef.current))
                     },
                     getPTOptions('filterClearIcon')
@@ -261,7 +261,8 @@ export const DropdownPanel = React.memo(
                                     ref: options.contentRef,
                                     style: options.style,
                                     className: classNames(options.className, cx('list', { virtualScrollerProps: props.virtualScrollerOptions })),
-                                    role: 'listbox'
+                                    role: 'listbox',
+                                    'aria-label': ariaLabel('listLabel')
                                 },
                                 getPTOptions('list')
                             );
@@ -286,7 +287,8 @@ export const DropdownPanel = React.memo(
             const listProps = mergeProps(
                 {
                     className: cx('list'),
-                    role: 'listbox'
+                    role: 'listbox',
+                    'aria-label': ariaLabel('listLabel')
                 },
                 getPTOptions('list')
             );
diff --git a/components/lib/hooks/useLocale.js b/components/lib/hooks/useLocale.js
index d23e1ce198..aa6ec63682 100644
--- a/components/lib/hooks/useLocale.js
+++ b/components/lib/hooks/useLocale.js
@@ -89,6 +89,7 @@ let locales = {
             jumpToPageDropdownLabel: 'Jump to Page Dropdown',
             jumpToPageInputLabel: 'Jump to Page Input',
             lastPageLabel: 'Last Page',
+            listLabel: 'Option List',
             listView: 'List View',
             moveAllToSource: 'Move All to Source',
             moveAllToTarget: 'Move All to Target',