fix: screenreader focus fix

Author: ypatadia-eightfold

src/components/Dropdown/Dropdown.tsx

@@ -28,6 +28,7 @@ import {
   DropdownRef,
 } from './Dropdown.types';
 import { Menu } from '../Menu';
+import { List } from '../List';
 import { useMergedState } from '../../hooks/useMergedState';
 import { useOnClickOutside } from '../../hooks/useOnClickOutside';
 import { usePreviousState } from '../../hooks/usePreviousState';
@@ -461,7 +462,9 @@ export const Dropdown: FC<DropdownProps> = React.memo(
               role={role}
               {...overlayProps}
             >
-              {overlay}
+              {React.cloneElement(overlay, {
+                ...(overlay.type === List ? { initialFocus } : {}),
+              })}
             </div>
           </FloatingFocusManager>
         );

src/components/List/List.tsx

@@ -19,6 +19,7 @@ export const List = <T extends any>({
   disableKeys = false,
   items,
   footer,
+  initialFocus = true,
   layout = 'vertical',
   renderAdditionalItem,
   renderItem,
@@ -221,7 +222,6 @@ export const List = <T extends any>({
       ref={itemRef}
       style={itemStyle}
       role="option"
-      aria-selected={focusIndex === index ? 'true' : 'false'}
       tabIndex={focusIndex === index ? 0 : -1}
     >
       {renderItem(item)}

src/components/List/List.types.ts

@@ -91,4 +91,8 @@ export interface ListProps<T> extends OcBaseProps<HTMLDivElement> {
    * @default false
    */
   applyCyclicNavigation?: boolean;
+  /**
+   * Initial focus for the list.
+   */
+  initialFocus?: boolean;
 }