[EuiSelectableListItem] fix duplicated announcement for checked options

packages/eui/changelogs/upcoming/9028.md

@@ -0,0 +1,3 @@
+**Accessibility**
+
+- Fixed duplicated announcements for checked options in `EuiSelectableListItem`.

packages/eui/src/components/accessibility/screen_reader_only/screen_reader_only.tsx

@@ -22,22 +22,34 @@ export interface EuiScreenReaderOnlyProps {
    * For keyboard navigation, force content to display visually upon focus/focus-within.
    */
   showOnFocus?: boolean;
+
+  /**
+   * Optional CSS class(es) to apply to the outermost element of the component.
+   * This allows for custom styling or theming.
+   */
   className?: string;
+
+  /**
+   * Optional HTML id attribute for the outermost element.
+   * Can be used for linking with labels, aria attributes, or targeting the element.
+   */
+  id?: string;
 }
 
 export const EuiScreenReaderOnly: FunctionComponent<
   EuiScreenReaderOnlyProps
-> = ({ children, className, showOnFocus }) => {
+> = ({ children, className, showOnFocus, id }) => {
   const classes = classNames(className, children.props.className);
 
   const props = useMemo(
     () => ({
+      id: id || children.props.id,
       className: classes.length ? classes : undefined,
       css: showOnFocus
         ? styles['euiScreenReaderOnly-showOnFocus']
         : styles.euiScreenReaderOnly,
     }),
-    [classes, showOnFocus]
+    [id, children.props.id, classes, showOnFocus]
   );
 
   return cloneElementWithCss(children, props);

packages/eui/src/components/filter_group/filter_group.a11y.tsx

@@ -253,20 +253,24 @@ describe('EuiFilterGroup multiselect example', () => {
       cy.realPress('Tab');
       cy.repeatRealPress('ArrowDown', 3);
       cy.realPress('Enter');
+
       cy.get('li[aria-selected="true"]')
         .find('span.euiSelectableListItem__text')
-        .should(
-          'have.text',
-          'Dmitri Shostakovich. Checked option. To exclude this option, press Enter.'
-        );
+        .should('have.text', 'Dmitri Shostakovich');
+      cy.get('li[aria-selected="true"]')
+        .find('.css-gb1zbv-euiScreenReaderOnly')
+        .should('have.text', '- To exclude this option, press Enter.');
+
       cy.realPress('ArrowDown');
       cy.repeatRealPress('Enter');
+
       cy.get('li[aria-selected="true"]')
         .find('span.euiSelectableListItem__text')
-        .should(
-          'have.text',
-          'Felix Mendelssohn-Bartholdy. Excluded option. To uncheck this option, press Enter.'
-        );
+        .should('have.text', 'Felix Mendelssohn-Bartholdy');
+      cy.get('li[aria-selected="true"]')
+        .find('.css-gb1zbv-euiScreenReaderOnly')
+        .should('have.text', '- To uncheck this option, press Enter.');
+
       cy.checkAxe();
     });