@elastic/eui 121.0.0 → 122.0.0

package/test-env/components/selectable/selectable_list/selectable_list_item.js

@@ -17,7 +17,7 @@ var _accessibility = require("../../accessibility");
 var _badge = require("../../badge");
 var _list_item_layout = require("../../list_item_layout/_list_item_layout");
 var _react2 = require("@emotion/react");
-var _excluded = ["children", "className", "disabled", "checked", "isFocused", "showIcons", "prepend", "append", "allowExclusions", "singleSelection", "onFocusBadge", "role", "searchable", "toolTipContent", "toolTipProps"],
+var _excluded = ["children", "className", "disabled", "checked", "isFocused", "showIcons", "prepend", "append", "allowExclusions", "singleSelection", "onFocusBadge", "role", "searchable", "toolTipContent", "toolTipProps", "title"],
   _excluded2 = ["children", "className"];
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
@@ -50,6 +50,7 @@ var EuiSelectableListItem = exports.EuiSelectableListItem = function EuiSelectab
     searchable = _ref.searchable,
     toolTipContent = _ref.toolTipContent,
     toolTipProps = _ref.toolTipProps,
+    title = _ref.title,
     rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var classes = (0, _classnames.default)('euiSelectableListItem', {
     'euiSelectableListItem-isFocused': isFocused
@@ -79,10 +80,6 @@ var EuiSelectableListItem = exports.EuiSelectableListItem = function EuiSelectab
     var instructions;
     var screenReaderStrings = {
       checked: {
-        state: (0, _react2.jsx)(_i18n.EuiI18n, {
-          token: "euiSelectableListItem.checkedOption",
-          default: "Checked option."
-        }),
         instructions: (0, _react2.jsx)(_i18n.EuiI18n, {
           token: "euiSelectableListItem.checkOptionInstructions",
           default: "To check this option, press Enter."
@@ -125,7 +122,8 @@ var EuiSelectableListItem = exports.EuiSelectableListItem = function EuiSelectab
     };
     switch (checked) {
       case 'on':
-        state = screenReaderStrings.checked.state;
+        // the checked state is already announced natively via `aria-checked`/
+        // `aria-selected`; additional state text would duplicate the announcement
         instructions = allowExclusions ? screenReaderStrings.excluded.instructions : searchable ? screenReaderStrings.unchecked.instructions : undefined;
         break;
       case 'off':
@@ -168,7 +166,11 @@ var EuiSelectableListItem = exports.EuiSelectableListItem = function EuiSelectab
       className: 'euiSelectableListItem__content'
     },
     textProps: {
-      className: 'euiSelectableListItem__text'
+      className: 'euiSelectableListItem__text',
+      // `title` must not be set on the option element itself - it would become
+      // the option's accessible description, causing screen readers to
+      // announce the option name twice
+      title: title
     },
     tooltipProps: hasToolTip ? _objectSpread({
       content: toolTipContent,