@atlaskit/select 20.6.2 → 20.7.0

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/select
 
+## 20.7.0
+
+### Minor Changes
+
+- [#155546](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/155546)
+  [`4133da7ce5d92`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4133da7ce5d92) -
+  This cleans up the feature flag references for assistive technology improvements, making them
+  fully available to all people.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 20.6.2
 
 ### Patch Changes

package/dist/cjs/CountrySelect.js

@@ -11,14 +11,10 @@ require("./CountrySelect.compiled.css");
 var React = _interopRequireWildcard(require("react"));
 var _runtime = require("@compiled/react/runtime");
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _countries = require("./data/countries");
 var _Select = _interopRequireDefault(require("./Select"));
-var _countryGroupsAnnouncement = require("./utils/country-groups-announcement");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /* eslint-disable @repo/internal/fs/filename-pattern-match */
+/* eslint-disable @repo/internal/fs/filename-pattern-match */
 // custom option renderer
 var labelStyles = null;
 var flagStyles = null;
@@ -75,8 +71,7 @@ var formatOptionLabel = function formatOptionLabel(opt, _ref4) {
 
 // put it all together
 var CountrySelect = function CountrySelect(props) {
-  var ariaLiveMessages = props.ariaLiveMessages,
-    options = props.options;
+  var options = props.options;
   var countryOptions = options || _countries.groupedCountries;
   return /*#__PURE__*/React.createElement(_Select.default, (0, _extends2.default)({
     isClearable: false,
@@ -84,14 +79,7 @@ var CountrySelect = function CountrySelect(props) {
     getOptionLabel: getOptionLabel,
     getOptionValue: getOptionValue,
     isMulti: false,
-    options: countryOptions,
-    ariaLiveMessages:
-    // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
-    (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? undefined : (0, _countryGroupsAnnouncement.isCountryOptionsGrouped)(countryOptions) ? _objectSpread({
-      onFocus: function onFocus(data) {
-        return (0, _countryGroupsAnnouncement.onCountryOptionFocus)(data, countryOptions);
-      }
-    }, ariaLiveMessages) : _objectSpread({}, ariaLiveMessages)
+    options: countryOptions
     // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
   }, props));
 };

package/dist/cjs/PopupSelect/PopupSelect.js

@@ -20,13 +20,10 @@ var _reactDom = require("react-dom");
 var _reactFocusLock = _interopRequireDefault(require("react-focus-lock"));
 var _reactPopper = require("react-popper");
 var _shallowEqual = require("shallow-equal");
-var _deviceCheck = require("@atlaskit/ds-lib/device-check");
 var _useId = require("@atlaskit/ds-lib/use-id");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _reactSelect = require("@atlaskit/react-select");
 var _colors = require("@atlaskit/theme/colors");
 var _Select = _interopRequireDefault(require("../Select"));
-var _groupedOptionsAnnouncement = require("../utils/grouped-options-announcement");
 var _components = require("./components");
 var _notifyOpenLayerObserver = require("./notify-open-layer-observer");
 var _excluded = ["footer", "label", "maxMenuWidth", "minMenuWidth", "placeholder", "target", "testId", "onMenuOpen", "onMenuClose"];
@@ -348,57 +345,6 @@ var PopupSelect = exports.default = /*#__PURE__*/function (_PureComponent) {
           return placeholder;
         }
       };
-      var providedAriaLabel = getLabel();
-      var updateInputAriaLabel = function updateInputAriaLabel(ariaLabelText) {
-        var _this$selectRef;
-        // Update aria-label to get first announcement when popup opened.
-        if ((_this$selectRef = _this.selectRef) !== null && _this$selectRef !== void 0 && (_this$selectRef = _this$selectRef.select) !== null && _this$selectRef !== void 0 && _this$selectRef.inputRef) {
-          var _this$selectRef2;
-          if (providedAriaLabel) {
-            // I might want to use a comma instead of a period here, when the feature flag is removed.
-            ariaLabelText = "".concat(providedAriaLabel, ". ").concat(ariaLabelText);
-          }
-          (_this$selectRef2 = _this.selectRef) === null || _this$selectRef2 === void 0 || (_this$selectRef2 = _this$selectRef2.select.inputRef) === null || _this$selectRef2 === void 0 || _this$selectRef2.setAttribute('aria-label', ariaLabelText);
-        }
-      };
-      var generateNoGroupsAriaText = function generateNoGroupsAriaText(onFocusProps, ariaLabelSuffix) {
-        var _options$findIndex;
-        var focused = onFocusProps.focused;
-        var options = (props === null || props === void 0 ? void 0 : props.options) || [];
-        var totalLength = options === null || options === void 0 ? void 0 : options.length;
-        var optionIndex = (_options$findIndex = options === null || options === void 0 ? void 0 : options.findIndex(function (option) {
-          return option === focused;
-        })) !== null && _options$findIndex !== void 0 ? _options$findIndex : 0;
-        var optionName = typeof (props === null || props === void 0 ? void 0 : props.getOptionLabel) === 'function' ? props.getOptionLabel(focused) : focused.label;
-        var ariaLabelText = (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? "".concat(optionName, ", (").concat(optionIndex + 1, " of ").concat(totalLength, ")") : "Option ".concat(optionName, " focused, ").concat(optionIndex + 1, " of ").concat(totalLength, ".\n\t\t\t").concat(totalLength, " results available.\n\t\t\t").concat(ariaLabelSuffix, "\n\t\t\t");
-        // Option LABEL focused, 1 of 8. 8 results available.
-        // Use Up and Down to choose options, press Enter to select the currently focused option,
-        // press Escape to exit the menu.
-        return ariaLabelText;
-      };
-      var onReactSelectFocus = function onReactSelectFocus(onFocusProps) {
-        var _props$options;
-        var ariaLabelSuffix = (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? '' : ' Use Up and Down to choose options, press Enter to select the currently focused option, press Escape to exit the menu.';
-        var ariaLabelText = '';
-        var ariaLiveMessage = '';
-        if ((_props$options = props.options) !== null && _props$options !== void 0 && _props$options.length) {
-          if ((0, _groupedOptionsAnnouncement.isOptionsGrouped)(props.options)) {
-            var totalLength = (0, _groupedOptionsAnnouncement.countAllOptions)(props.options);
-            ariaLiveMessage = (0, _groupedOptionsAnnouncement.onFocus)(onFocusProps, props.options);
-            ariaLabelText = "".concat(ariaLiveMessage, " ").concat(totalLength, " results available. ").concat(ariaLabelSuffix);
-          } else {
-            ariaLabelText = generateNoGroupsAriaText(onFocusProps, ariaLabelSuffix);
-            ariaLiveMessage = ariaLabelText;
-          }
-          // Safari still does not announce the first option when menu is opened, so forcing a change to the input label
-          // will include the first option in the initial announcement.
-          if (!(0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') || (0, _deviceCheck.isSafari)() && (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement')) {
-            updateInputAriaLabel(ariaLabelText);
-          }
-          return ariaLiveMessage;
-        }
-        return ariaLiveMessage;
-      };
       var popper = /*#__PURE__*/_react.default.createElement(_reactPopper.Popper, (0, _extends2.default)({}, mergedPopperProps, {
         onFirstUpdate: function onFirstUpdate(state) {
           var _mergedPopperProps$on;
@@ -425,11 +371,7 @@ var PopupSelect = exports.default = /*#__PURE__*/function (_PureComponent) {
           disabled: !focusLockEnabled,
           returnFocus: true
         }, /*#__PURE__*/_react.default.createElement(_Select.default, (0, _extends2.default)({
-          label: providedAriaLabel
-          // TODO: Popup Select does not work well with active-descendant
-          ,
-          "aria-live": (0, _deviceCheck.isAppleDevice)() && (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? 'assertive' // only needed on Apple products
-          : undefined,
+          label: getLabel(),
           backspaceRemovesValue: false,
           controlShouldRenderValue: false,
           isClearable: false,
@@ -443,11 +385,7 @@ var PopupSelect = exports.default = /*#__PURE__*/function (_PureComponent) {
           maxMenuHeight: _this.getMaxHeight(),
           components: selectComponents,
           onChange: _this.handleSelectChange,
-          testId: testId,
-          ariaLiveMessages: _objectSpread({
-            // Overwriting ariaLiveMessages builtin onFocus method to announce selected option when popup has been opened
-            onFocus: onReactSelectFocus
-          }, props.ariaLiveMessages)
+          testId: testId
           // Note: We are intentionally not using `onMenuClose={this.close}` here, due to state management conflicts
           // between PopupSelect's popup and the internal select menu. This can result in the PopupSelect closing
           // or opening unexpectedly.

package/dist/cjs/Select.js

@@ -11,7 +11,7 @@ var _createSelect = _interopRequireDefault(require("./createSelect"));
 /* eslint-disable @repo/internal/react/require-jsdoc */
 
 var packageName = "@atlaskit/select";
-var packageVersion = "20.6.2";
+var packageVersion = "20.7.0";
 var SelectWithoutAnalytics = exports.SelectWithoutAnalytics = (0, _createSelect.default)(_async.default);
 var createAndFireEventOnAtlaskit = (0, _analyticsNext.createAndFireEvent)('atlaskit');
 var Select = (0, _analyticsNext.withAnalyticsContext)({

package/dist/cjs/createSelect.js

@@ -7,17 +7,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = createSelect;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _groupedOptionsAnnouncement = require("./utils/grouped-options-announcement");
 var _excluded = ["ariaLiveMessages", "isInvalid", "onClickPreventDefault", "tabSelectsValue", "validationState"];
 /* eslint-disable @atlaskit/platform/ensure-feature-flag-prefix */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function createSelect(WrappedComponent) {
   var AtlaskitSelect = /*#__PURE__*/(0, _react.forwardRef)(function AtlaskitSelect(props, forwardedRef) {
     var ariaLiveMessages = props.ariaLiveMessages,
@@ -53,14 +48,7 @@ function createSelect(WrappedComponent) {
     }, []);
     return /*#__PURE__*/_react.default.createElement(WrappedComponent, (0, _extends2.default)({
       ref: internalSelectRef,
-      "aria-live": (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? undefined : 'assertive',
-      ariaLiveMessages:
-      //TO DO: Still need live region for PopupSelect because of the menu being open by default
-      (0, _groupedOptionsAnnouncement.isOptionsGrouped)(props.options) ? _objectSpread({
-        onFocus: function onFocus(data) {
-          return (0, _groupedOptionsAnnouncement.onFocus)(data, props.options);
-        }
-      }, ariaLiveMessages) : _objectSpread({}, ariaLiveMessages),
+      ariaLiveMessages: ariaLiveMessages,
       tabSelectsValue: tabSelectsValue,
       onClickPreventDefault: onClickPreventDefault,
       isInvalid: isInvalid || validationState === 'error'

package/dist/cjs/index.js

@@ -83,12 +83,6 @@ Object.defineProperty(exports, "default", {
     return _select.default;
   }
 });
-Object.defineProperty(exports, "isCountryOptionsGrouped", {
-  enumerable: true,
-  get: function get() {
-    return _countryGroupsAnnouncement.isCountryOptionsGrouped;
-  }
-});
 Object.defineProperty(exports, "isOptionsGrouped", {
   enumerable: true,
   get: function get() {
@@ -101,12 +95,6 @@ Object.defineProperty(exports, "mergeStyles", {
     return _reactSelect.mergeStyles;
   }
 });
-Object.defineProperty(exports, "onCountryOptionFocus", {
-  enumerable: true,
-  get: function get() {
-    return _countryGroupsAnnouncement.onCountryOptionFocus;
-  }
-});
 Object.defineProperty(exports, "useAsync", {
   enumerable: true,
   get: function get() {
@@ -128,7 +116,6 @@ var _asyncSelect = _interopRequireDefault(require("./entry-points/async-select")
 var _creatableSelect = _interopRequireDefault(require("./entry-points/creatable-select"));
 var _asyncCreatableSelect = _interopRequireDefault(require("./entry-points/async-creatable-select"));
 var _groupedOptionsAnnouncement = require("./utils/grouped-options-announcement");
-var _countryGroupsAnnouncement = require("./utils/country-groups-announcement");
 var _CheckboxSelect = _interopRequireDefault(require("./CheckboxSelect"));
 var _CountrySelect = _interopRequireDefault(require("./CountrySelect"));
 var _RadioSelect = _interopRequireDefault(require("./RadioSelect"));

package/dist/cjs/utils/grouped-options-announcement.js

@@ -3,12 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.isOptionsGrouped = exports.countAllOptions = void 0;
-exports.onFocus = onFocus;
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-// Used for overwriting ariaLiveMessages builtin onFocus method.
-// Returns custom built string while focusing each group option. This string is used for screen reader announcement.
-function onFocus(onFocusProps, defaultOptions) {
+exports.countAllOptions = void 0;
+exports.generateGroupLabel = generateGroupLabel;
+exports.isOptionsGrouped = void 0;
+function generateGroupLabel(onFocusProps, defaultOptions) {
   var _groupData$options$fi;
   var focused = onFocusProps.focused;
   var isOptionFocused = function isOptionFocused(option) {
@@ -19,10 +17,8 @@ function onFocus(onFocusProps, defaultOptions) {
     return (_option$options = option.options) === null || _option$options === void 0 ? void 0 : _option$options.some(isOptionFocused);
   });
   var groupOptionIndex = (_groupData$options$fi = groupData === null || groupData === void 0 ? void 0 : groupData.options.findIndex(isOptionFocused)) !== null && _groupData$options$fi !== void 0 ? _groupData$options$fi : 0;
-  if (focused.label && groupData !== null && groupData !== void 0 && groupData.label && (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement')) {
-    return "".concat(focused.label, ", ").concat(groupData === null || groupData === void 0 ? void 0 : groupData.label);
-  }
-  return "Option ".concat(focused.label, ", ").concat(groupData === null || groupData === void 0 ? void 0 : groupData.label, " group, item ").concat(groupOptionIndex + 1, " out of ").concat(groupData === null || groupData === void 0 ? void 0 : groupData.options.length, ". All in all ");
+  var totalLength = countAllOptions(defaultOptions);
+  return "".concat(focused.label, ", ").concat(groupData === null || groupData === void 0 ? void 0 : groupData.label, " (").concat(groupOptionIndex + 1, " of ").concat(totalLength, ")");
 }
 
 // Helper function which identifies if options are grouped.

package/dist/es2019/CountrySelect.js

@@ -5,10 +5,8 @@ import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 /* eslint-disable @repo/internal/fs/filename-pattern-match */
 
-import { fg } from '@atlaskit/platform-feature-flags';
 import { groupedCountries } from './data/countries';
 import Select from './Select';
-import { isCountryOptionsGrouped, onCountryOptionFocus } from './utils/country-groups-announcement';
 // custom option renderer
 const labelStyles = null;
 const flagStyles = null;
@@ -58,7 +56,6 @@ const formatOptionLabel = (opt, {
 // put it all together
 const CountrySelect = props => {
   const {
-    ariaLiveMessages,
     options
   } = props;
   const countryOptions = options || groupedCountries;
@@ -68,15 +65,7 @@ const CountrySelect = props => {
     getOptionLabel: getOptionLabel,
     getOptionValue: getOptionValue,
     isMulti: false,
-    options: countryOptions,
-    ariaLiveMessages:
-    // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
-    fg('design_system_select-a11y-improvement') ? undefined : isCountryOptionsGrouped(countryOptions) ? {
-      onFocus: data => onCountryOptionFocus(data, countryOptions),
-      ...ariaLiveMessages
-    } : {
-      ...ariaLiveMessages
-    }
+    options: countryOptions
     // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
   }, props));
 };

package/dist/es2019/PopupSelect/PopupSelect.js

@@ -8,13 +8,10 @@ import { createPortal } from 'react-dom';
 import FocusLock from 'react-focus-lock';
 import { Manager, Popper, Reference } from 'react-popper';
 import { shallowEqualObjects } from 'shallow-equal';
-import { isAppleDevice, isSafari } from '@atlaskit/ds-lib/device-check';
 import { IdProvider } from '@atlaskit/ds-lib/use-id';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { mergeStyles } from '@atlaskit/react-select';
 import { N80 } from '@atlaskit/theme/colors';
 import Select from '../Select';
-import { countAllOptions, isOptionsGrouped, onFocus } from '../utils/grouped-options-announcement';
 import { defaultComponents, DummyControl, MenuDialog } from './components';
 import { NotifyOpenLayerObserver } from './notify-open-layer-observer';
 /**
@@ -328,60 +325,6 @@ export default class PopupSelect extends PureComponent {
           return placeholder;
         }
       };
-      const providedAriaLabel = getLabel();
-      const updateInputAriaLabel = ariaLabelText => {
-        var _this$selectRef, _this$selectRef$selec3;
-        // Update aria-label to get first announcement when popup opened.
-        if ((_this$selectRef = this.selectRef) !== null && _this$selectRef !== void 0 && (_this$selectRef$selec3 = _this$selectRef.select) !== null && _this$selectRef$selec3 !== void 0 && _this$selectRef$selec3.inputRef) {
-          var _this$selectRef2, _this$selectRef2$sele;
-          if (providedAriaLabel) {
-            // I might want to use a comma instead of a period here, when the feature flag is removed.
-            ariaLabelText = `${providedAriaLabel}. ${ariaLabelText}`;
-          }
-          (_this$selectRef2 = this.selectRef) === null || _this$selectRef2 === void 0 ? void 0 : (_this$selectRef2$sele = _this$selectRef2.select.inputRef) === null || _this$selectRef2$sele === void 0 ? void 0 : _this$selectRef2$sele.setAttribute('aria-label', ariaLabelText);
-        }
-      };
-      const generateNoGroupsAriaText = (onFocusProps, ariaLabelSuffix) => {
-        var _options$findIndex;
-        const {
-          focused
-        } = onFocusProps;
-        const options = (props === null || props === void 0 ? void 0 : props.options) || [];
-        const totalLength = options === null || options === void 0 ? void 0 : options.length;
-        const optionIndex = (_options$findIndex = options === null || options === void 0 ? void 0 : options.findIndex(option => option === focused)) !== null && _options$findIndex !== void 0 ? _options$findIndex : 0;
-        const optionName = typeof (props === null || props === void 0 ? void 0 : props.getOptionLabel) === 'function' ? props.getOptionLabel(focused) : focused.label;
-        const ariaLabelText = fg('design_system_select-a11y-improvement') ? `${optionName}, (${optionIndex + 1} of ${totalLength})` : `Option ${optionName} focused, ${optionIndex + 1} of ${totalLength}.
-			${totalLength} results available.
-			${ariaLabelSuffix}
-			`;
-        // Option LABEL focused, 1 of 8. 8 results available.
-        // Use Up and Down to choose options, press Enter to select the currently focused option,
-        // press Escape to exit the menu.
-        return ariaLabelText;
-      };
-      const onReactSelectFocus = onFocusProps => {
-        var _props$options;
-        const ariaLabelSuffix = fg('design_system_select-a11y-improvement') ? '' : ' Use Up and Down to choose options, press Enter to select the currently focused option, press Escape to exit the menu.';
-        let ariaLabelText = '';
-        let ariaLiveMessage = '';
-        if ((_props$options = props.options) !== null && _props$options !== void 0 && _props$options.length) {
-          if (isOptionsGrouped(props.options)) {
-            const totalLength = countAllOptions(props.options);
-            ariaLiveMessage = onFocus(onFocusProps, props.options);
-            ariaLabelText = `${ariaLiveMessage} ${totalLength} results available. ${ariaLabelSuffix}`;
-          } else {
-            ariaLabelText = generateNoGroupsAriaText(onFocusProps, ariaLabelSuffix);
-            ariaLiveMessage = ariaLabelText;
-          }
-          // Safari still does not announce the first option when menu is opened, so forcing a change to the input label
-          // will include the first option in the initial announcement.
-          if (!fg('design_system_select-a11y-improvement') || isSafari() && fg('design_system_select-a11y-improvement')) {
-            updateInputAriaLabel(ariaLabelText);
-          }
-          return ariaLiveMessage;
-        }
-        return ariaLiveMessage;
-      };
       const popper = /*#__PURE__*/React.createElement(Popper, _extends({}, mergedPopperProps, {
         onFirstUpdate: state => {
           var _mergedPopperProps$on;
@@ -409,11 +352,7 @@ export default class PopupSelect extends PureComponent {
         disabled: !focusLockEnabled,
         returnFocus: true
       }, /*#__PURE__*/React.createElement(Select, _extends({
-        label: providedAriaLabel
-        // TODO: Popup Select does not work well with active-descendant
-        ,
-        "aria-live": isAppleDevice() && fg('design_system_select-a11y-improvement') ? 'assertive' // only needed on Apple products
-        : undefined,
+        label: getLabel(),
         backspaceRemovesValue: false,
         controlShouldRenderValue: false,
         isClearable: false,
@@ -427,12 +366,7 @@ export default class PopupSelect extends PureComponent {
         maxMenuHeight: this.getMaxHeight(),
         components: selectComponents,
         onChange: this.handleSelectChange,
-        testId: testId,
-        ariaLiveMessages: {
-          // Overwriting ariaLiveMessages builtin onFocus method to announce selected option when popup has been opened
-          onFocus: onReactSelectFocus,
-          ...props.ariaLiveMessages // priority to use user handlers if provided
-        }
+        testId: testId
         // Note: We are intentionally not using `onMenuClose={this.close}` here, due to state management conflicts
         // between PopupSelect's popup and the internal select menu. This can result in the PopupSelect closing
         // or opening unexpectedly.

package/dist/es2019/Select.js

@@ -3,7 +3,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
 import AsyncSelect from '@atlaskit/react-select/async';
 import createSelect from './createSelect';
 const packageName = "@atlaskit/select";
-const packageVersion = "20.6.2";
+const packageVersion = "20.7.0";
 export const SelectWithoutAnalytics = createSelect(AsyncSelect);
 const createAndFireEventOnAtlaskit = createAndFireEvent('atlaskit');
 const Select = withAnalyticsContext({

package/dist/es2019/createSelect.js

@@ -2,8 +2,6 @@ import _extends from "@babel/runtime/helpers/extends";
 /* eslint-disable @atlaskit/platform/ensure-feature-flag-prefix */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import React, { forwardRef, useImperativeHandle, useRef } from 'react';
-import { fg } from '@atlaskit/platform-feature-flags';
-import { isOptionsGrouped, onFocus } from './utils/grouped-options-announcement';
 export default function createSelect(WrappedComponent) {
   const AtlaskitSelect = /*#__PURE__*/forwardRef(function AtlaskitSelect(props, forwardedRef) {
     const {
@@ -37,15 +35,7 @@ export default function createSelect(WrappedComponent) {
     }), []);
     return /*#__PURE__*/React.createElement(WrappedComponent, _extends({
       ref: internalSelectRef,
-      "aria-live": fg('design_system_select-a11y-improvement') ? undefined : 'assertive',
-      ariaLiveMessages:
-      //TO DO: Still need live region for PopupSelect because of the menu being open by default
-      isOptionsGrouped(props.options) ? {
-        onFocus: data => onFocus(data, props.options),
-        ...ariaLiveMessages
-      } : {
-        ...ariaLiveMessages
-      },
+      ariaLiveMessages: ariaLiveMessages,
       tabSelectsValue: tabSelectsValue,
       onClickPreventDefault: onClickPreventDefault,
       isInvalid: isInvalid || validationState === 'error'

package/dist/es2019/index.js

@@ -7,7 +7,6 @@ export { default as AsyncSelect } from './entry-points/async-select';
 export { default as CreatableSelect } from './entry-points/creatable-select';
 export { default as AsyncCreatableSelect } from './entry-points/async-creatable-select';
 export { isOptionsGrouped } from './utils/grouped-options-announcement';
-export { isCountryOptionsGrouped, onCountryOptionFocus } from './utils/country-groups-announcement';
 export { default as CheckboxSelect } from './CheckboxSelect';
 export { default as CountrySelect } from './CountrySelect';
 export { default as RadioSelect } from './RadioSelect';

package/dist/es2019/utils/grouped-options-announcement.js

@@ -1,7 +1,4 @@
-import { fg } from '@atlaskit/platform-feature-flags';
-// Used for overwriting ariaLiveMessages builtin onFocus method.
-// Returns custom built string while focusing each group option. This string is used for screen reader announcement.
-export function onFocus(onFocusProps, defaultOptions) {
+export function generateGroupLabel(onFocusProps, defaultOptions) {
   var _groupData$options$fi;
   const {
     focused
@@ -14,10 +11,8 @@ export function onFocus(onFocusProps, defaultOptions) {
     return (_option$options = option.options) === null || _option$options === void 0 ? void 0 : _option$options.some(isOptionFocused);
   });
   const groupOptionIndex = (_groupData$options$fi = groupData === null || groupData === void 0 ? void 0 : groupData.options.findIndex(isOptionFocused)) !== null && _groupData$options$fi !== void 0 ? _groupData$options$fi : 0;
-  if (focused.label && groupData !== null && groupData !== void 0 && groupData.label && fg('design_system_select-a11y-improvement')) {
-    return `${focused.label}, ${groupData === null || groupData === void 0 ? void 0 : groupData.label}`;
-  }
-  return `Option ${focused.label}, ${groupData === null || groupData === void 0 ? void 0 : groupData.label} group, item ${groupOptionIndex + 1} out of ${groupData === null || groupData === void 0 ? void 0 : groupData.options.length}. All in all `;
+  const totalLength = countAllOptions(defaultOptions);
+  return `${focused.label}, ${groupData === null || groupData === void 0 ? void 0 : groupData.label} (${groupOptionIndex + 1} of ${totalLength})`;
 }
 
 // Helper function which identifies if options are grouped.

package/dist/esm/CountrySelect.js

@@ -1,17 +1,12 @@
 /* CountrySelect.tsx generated by @compiled/babel-plugin v0.36.1 */
 import _extends from "@babel/runtime/helpers/extends";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import "./CountrySelect.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /* eslint-disable @repo/internal/fs/filename-pattern-match */
 
-import { fg } from '@atlaskit/platform-feature-flags';
 import { groupedCountries } from './data/countries';
 import Select from './Select';
-import { isCountryOptionsGrouped, onCountryOptionFocus } from './utils/country-groups-announcement';
 // custom option renderer
 var labelStyles = null;
 var flagStyles = null;
@@ -68,8 +63,7 @@ var formatOptionLabel = function formatOptionLabel(opt, _ref4) {
 
 // put it all together
 var CountrySelect = function CountrySelect(props) {
-  var ariaLiveMessages = props.ariaLiveMessages,
-    options = props.options;
+  var options = props.options;
   var countryOptions = options || groupedCountries;
   return /*#__PURE__*/React.createElement(Select, _extends({
     isClearable: false,
@@ -77,14 +71,7 @@ var CountrySelect = function CountrySelect(props) {
     getOptionLabel: getOptionLabel,
     getOptionValue: getOptionValue,
     isMulti: false,
-    options: countryOptions,
-    ariaLiveMessages:
-    // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
-    fg('design_system_select-a11y-improvement') ? undefined : isCountryOptionsGrouped(countryOptions) ? _objectSpread({
-      onFocus: function onFocus(data) {
-        return onCountryOptionFocus(data, countryOptions);
-      }
-    }, ariaLiveMessages) : _objectSpread({}, ariaLiveMessages)
+    options: countryOptions
     // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
   }, props));
 };

package/dist/esm/PopupSelect/PopupSelect.js

@@ -19,13 +19,10 @@ import { createPortal } from 'react-dom';
 import FocusLock from 'react-focus-lock';
 import { Manager, Popper, Reference } from 'react-popper';
 import { shallowEqualObjects } from 'shallow-equal';
-import { isAppleDevice, isSafari } from '@atlaskit/ds-lib/device-check';
 import { IdProvider } from '@atlaskit/ds-lib/use-id';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { mergeStyles } from '@atlaskit/react-select';
 import { N80 } from '@atlaskit/theme/colors';
 import Select from '../Select';
-import { countAllOptions, isOptionsGrouped, onFocus } from '../utils/grouped-options-announcement';
 import { defaultComponents, DummyControl, MenuDialog } from './components';
 import { NotifyOpenLayerObserver } from './notify-open-layer-observer';
 /**
@@ -341,57 +338,6 @@ var PopupSelect = /*#__PURE__*/function (_PureComponent) {
           return placeholder;
         }
       };
-      var providedAriaLabel = getLabel();
-      var updateInputAriaLabel = function updateInputAriaLabel(ariaLabelText) {
-        var _this$selectRef;
-        // Update aria-label to get first announcement when popup opened.
-        if ((_this$selectRef = _this.selectRef) !== null && _this$selectRef !== void 0 && (_this$selectRef = _this$selectRef.select) !== null && _this$selectRef !== void 0 && _this$selectRef.inputRef) {
-          var _this$selectRef2;
-          if (providedAriaLabel) {
-            // I might want to use a comma instead of a period here, when the feature flag is removed.
-            ariaLabelText = "".concat(providedAriaLabel, ". ").concat(ariaLabelText);
-          }
-          (_this$selectRef2 = _this.selectRef) === null || _this$selectRef2 === void 0 || (_this$selectRef2 = _this$selectRef2.select.inputRef) === null || _this$selectRef2 === void 0 || _this$selectRef2.setAttribute('aria-label', ariaLabelText);
-        }
-      };
-      var generateNoGroupsAriaText = function generateNoGroupsAriaText(onFocusProps, ariaLabelSuffix) {
-        var _options$findIndex;
-        var focused = onFocusProps.focused;
-        var options = (props === null || props === void 0 ? void 0 : props.options) || [];
-        var totalLength = options === null || options === void 0 ? void 0 : options.length;
-        var optionIndex = (_options$findIndex = options === null || options === void 0 ? void 0 : options.findIndex(function (option) {
-          return option === focused;
-        })) !== null && _options$findIndex !== void 0 ? _options$findIndex : 0;
-        var optionName = typeof (props === null || props === void 0 ? void 0 : props.getOptionLabel) === 'function' ? props.getOptionLabel(focused) : focused.label;
-        var ariaLabelText = fg('design_system_select-a11y-improvement') ? "".concat(optionName, ", (").concat(optionIndex + 1, " of ").concat(totalLength, ")") : "Option ".concat(optionName, " focused, ").concat(optionIndex + 1, " of ").concat(totalLength, ".\n\t\t\t").concat(totalLength, " results available.\n\t\t\t").concat(ariaLabelSuffix, "\n\t\t\t");
-        // Option LABEL focused, 1 of 8. 8 results available.
-        // Use Up and Down to choose options, press Enter to select the currently focused option,
-        // press Escape to exit the menu.
-        return ariaLabelText;
-      };
-      var onReactSelectFocus = function onReactSelectFocus(onFocusProps) {
-        var _props$options;
-        var ariaLabelSuffix = fg('design_system_select-a11y-improvement') ? '' : ' Use Up and Down to choose options, press Enter to select the currently focused option, press Escape to exit the menu.';
-        var ariaLabelText = '';
-        var ariaLiveMessage = '';
-        if ((_props$options = props.options) !== null && _props$options !== void 0 && _props$options.length) {
-          if (isOptionsGrouped(props.options)) {
-            var totalLength = countAllOptions(props.options);
-            ariaLiveMessage = onFocus(onFocusProps, props.options);
-            ariaLabelText = "".concat(ariaLiveMessage, " ").concat(totalLength, " results available. ").concat(ariaLabelSuffix);
-          } else {
-            ariaLabelText = generateNoGroupsAriaText(onFocusProps, ariaLabelSuffix);
-            ariaLiveMessage = ariaLabelText;
-          }
-          // Safari still does not announce the first option when menu is opened, so forcing a change to the input label
-          // will include the first option in the initial announcement.
-          if (!fg('design_system_select-a11y-improvement') || isSafari() && fg('design_system_select-a11y-improvement')) {
-            updateInputAriaLabel(ariaLabelText);
-          }
-          return ariaLiveMessage;
-        }
-        return ariaLiveMessage;
-      };
       var popper = /*#__PURE__*/React.createElement(Popper, _extends({}, mergedPopperProps, {
         onFirstUpdate: function onFirstUpdate(state) {
           var _mergedPopperProps$on;
@@ -418,11 +364,7 @@ var PopupSelect = /*#__PURE__*/function (_PureComponent) {
           disabled: !focusLockEnabled,
           returnFocus: true
         }, /*#__PURE__*/React.createElement(Select, _extends({
-          label: providedAriaLabel
-          // TODO: Popup Select does not work well with active-descendant
-          ,
-          "aria-live": isAppleDevice() && fg('design_system_select-a11y-improvement') ? 'assertive' // only needed on Apple products
-          : undefined,
+          label: getLabel(),
           backspaceRemovesValue: false,
           controlShouldRenderValue: false,
           isClearable: false,
@@ -436,11 +378,7 @@ var PopupSelect = /*#__PURE__*/function (_PureComponent) {
           maxMenuHeight: _this.getMaxHeight(),
           components: selectComponents,
           onChange: _this.handleSelectChange,
-          testId: testId,
-          ariaLiveMessages: _objectSpread({
-            // Overwriting ariaLiveMessages builtin onFocus method to announce selected option when popup has been opened
-            onFocus: onReactSelectFocus
-          }, props.ariaLiveMessages)
+          testId: testId
           // Note: We are intentionally not using `onMenuClose={this.close}` here, due to state management conflicts
           // between PopupSelect's popup and the internal select menu. This can result in the PopupSelect closing
           // or opening unexpectedly.

package/dist/esm/Select.js

@@ -3,7 +3,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
 import AsyncSelect from '@atlaskit/react-select/async';
 import createSelect from './createSelect';
 var packageName = "@atlaskit/select";
-var packageVersion = "20.6.2";
+var packageVersion = "20.7.0";
 export var SelectWithoutAnalytics = createSelect(AsyncSelect);
 var createAndFireEventOnAtlaskit = createAndFireEvent('atlaskit');
 var Select = withAnalyticsContext({

package/dist/esm/createSelect.js

@@ -1,14 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["ariaLiveMessages", "isInvalid", "onClickPreventDefault", "tabSelectsValue", "validationState"];
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /* eslint-disable @atlaskit/platform/ensure-feature-flag-prefix */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 import React, { forwardRef, useImperativeHandle, useRef } from 'react';
-import { fg } from '@atlaskit/platform-feature-flags';
-import { isOptionsGrouped, onFocus as _onFocus } from './utils/grouped-options-announcement';
 export default function createSelect(WrappedComponent) {
   var AtlaskitSelect = /*#__PURE__*/forwardRef(function AtlaskitSelect(props, forwardedRef) {
     var ariaLiveMessages = props.ariaLiveMessages,
@@ -44,14 +39,7 @@ export default function createSelect(WrappedComponent) {
     }, []);
     return /*#__PURE__*/React.createElement(WrappedComponent, _extends({
       ref: internalSelectRef,
-      "aria-live": fg('design_system_select-a11y-improvement') ? undefined : 'assertive',
-      ariaLiveMessages:
-      //TO DO: Still need live region for PopupSelect because of the menu being open by default
-      isOptionsGrouped(props.options) ? _objectSpread({
-        onFocus: function onFocus(data) {
-          return _onFocus(data, props.options);
-        }
-      }, ariaLiveMessages) : _objectSpread({}, ariaLiveMessages),
+      ariaLiveMessages: ariaLiveMessages,
       tabSelectsValue: tabSelectsValue,
       onClickPreventDefault: onClickPreventDefault,
       isInvalid: isInvalid || validationState === 'error'

package/dist/esm/index.js

@@ -7,7 +7,6 @@ export { default as AsyncSelect } from './entry-points/async-select';
 export { default as CreatableSelect } from './entry-points/creatable-select';
 export { default as AsyncCreatableSelect } from './entry-points/async-creatable-select';
 export { isOptionsGrouped } from './utils/grouped-options-announcement';
-export { isCountryOptionsGrouped, onCountryOptionFocus } from './utils/country-groups-announcement';
 export { default as CheckboxSelect } from './CheckboxSelect';
 export { default as CountrySelect } from './CountrySelect';
 export { default as RadioSelect } from './RadioSelect';

package/dist/esm/utils/grouped-options-announcement.js

@@ -1,7 +1,4 @@
-import { fg } from '@atlaskit/platform-feature-flags';
-// Used for overwriting ariaLiveMessages builtin onFocus method.
-// Returns custom built string while focusing each group option. This string is used for screen reader announcement.
-export function onFocus(onFocusProps, defaultOptions) {
+export function generateGroupLabel(onFocusProps, defaultOptions) {
   var _groupData$options$fi;
   var focused = onFocusProps.focused;
   var isOptionFocused = function isOptionFocused(option) {
@@ -12,10 +9,8 @@ export function onFocus(onFocusProps, defaultOptions) {
     return (_option$options = option.options) === null || _option$options === void 0 ? void 0 : _option$options.some(isOptionFocused);
   });
   var groupOptionIndex = (_groupData$options$fi = groupData === null || groupData === void 0 ? void 0 : groupData.options.findIndex(isOptionFocused)) !== null && _groupData$options$fi !== void 0 ? _groupData$options$fi : 0;
-  if (focused.label && groupData !== null && groupData !== void 0 && groupData.label && fg('design_system_select-a11y-improvement')) {
-    return "".concat(focused.label, ", ").concat(groupData === null || groupData === void 0 ? void 0 : groupData.label);
-  }
-  return "Option ".concat(focused.label, ", ").concat(groupData === null || groupData === void 0 ? void 0 : groupData.label, " group, item ").concat(groupOptionIndex + 1, " out of ").concat(groupData === null || groupData === void 0 ? void 0 : groupData.options.length, ". All in all ");
+  var totalLength = countAllOptions(defaultOptions);
+  return "".concat(focused.label, ", ").concat(groupData === null || groupData === void 0 ? void 0 : groupData.label, " (").concat(groupOptionIndex + 1, " of ").concat(totalLength, ")");
 }
 
 // Helper function which identifies if options are grouped.

package/dist/types/index.d.ts

@@ -7,7 +7,6 @@ export { default as AsyncSelect } from './entry-points/async-select';
 export { default as CreatableSelect } from './entry-points/creatable-select';
 export { default as AsyncCreatableSelect } from './entry-points/async-creatable-select';
 export { isOptionsGrouped } from './utils/grouped-options-announcement';
-export { isCountryOptionsGrouped, onCountryOptionFocus, type CountyGroupOptions, } from './utils/country-groups-announcement';
 export { default as CheckboxSelect } from './CheckboxSelect';
 export { default as CountrySelect } from './CountrySelect';
 export { default as RadioSelect } from './RadioSelect';

package/dist/types/utils/grouped-options-announcement.d.ts

@@ -1,5 +1,5 @@
 import { type AriaOnFocusProps, type GroupBase, type OptionsOrGroups } from '@atlaskit/react-select';
 import { type GroupType, type OptionType } from '../types';
-export declare function onFocus(onFocusProps: AriaOnFocusProps<OptionType, GroupBase<OptionType>>, defaultOptions?: OptionsOrGroups<OptionType, GroupType<OptionType>>): string;
+export declare function generateGroupLabel(onFocusProps: AriaOnFocusProps<OptionType, GroupBase<OptionType>>, defaultOptions?: OptionsOrGroups<OptionType, GroupType<OptionType>>): string;
 export declare const isOptionsGrouped: (arr: OptionsOrGroups<OptionType, GroupType<OptionType>> | undefined) => boolean | undefined;
 export declare const countAllOptions: (groupsArray: readonly GroupType<OptionType>[]) => number;

package/dist/types-ts4.5/index.d.ts

@@ -7,7 +7,6 @@ export { default as AsyncSelect } from './entry-points/async-select';
 export { default as CreatableSelect } from './entry-points/creatable-select';
 export { default as AsyncCreatableSelect } from './entry-points/async-creatable-select';
 export { isOptionsGrouped } from './utils/grouped-options-announcement';
-export { isCountryOptionsGrouped, onCountryOptionFocus, type CountyGroupOptions, } from './utils/country-groups-announcement';
 export { default as CheckboxSelect } from './CheckboxSelect';
 export { default as CountrySelect } from './CountrySelect';
 export { default as RadioSelect } from './RadioSelect';

package/dist/types-ts4.5/utils/grouped-options-announcement.d.ts

@@ -1,5 +1,5 @@
 import { type AriaOnFocusProps, type GroupBase, type OptionsOrGroups } from '@atlaskit/react-select';
 import { type GroupType, type OptionType } from '../types';
-export declare function onFocus(onFocusProps: AriaOnFocusProps<OptionType, GroupBase<OptionType>>, defaultOptions?: OptionsOrGroups<OptionType, GroupType<OptionType>>): string;
+export declare function generateGroupLabel(onFocusProps: AriaOnFocusProps<OptionType, GroupBase<OptionType>>, defaultOptions?: OptionsOrGroups<OptionType, GroupType<OptionType>>): string;
 export declare const isOptionsGrouped: (arr: OptionsOrGroups<OptionType, GroupType<OptionType>> | undefined) => boolean | undefined;
 export declare const countAllOptions: (groupsArray: readonly GroupType<OptionType>[]) => number;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/select",
-	"version": "20.6.2",
+	"version": "20.7.0",
 	"description": "Select allows users to make a single selection or multiple selections from a list of options.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -46,10 +46,10 @@
 		"@atlaskit/icon": "^26.4.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/primitives": "^14.8.0",
-		"@atlaskit/react-select": "^2.6.0",
+		"@atlaskit/react-select": "^2.7.0",
 		"@atlaskit/spinner": "^18.0.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tokens": "^5.0.0",
+		"@atlaskit/tokens": "^5.1.0",
 		"@atlaskit/visually-hidden": "^3.0.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.18.3",
@@ -70,7 +70,7 @@
 		"@atlaskit/button": "^23.2.0",
 		"@atlaskit/checkbox": "^17.1.0",
 		"@atlaskit/docs": "^10.0.0",
-		"@atlaskit/drawer": "^10.1.0",
+		"@atlaskit/drawer": "^11.0.0",
 		"@atlaskit/form": "^12.0.0",
 		"@atlaskit/link": "^3.2.0",
 		"@atlaskit/logo": "^19.0.0",
@@ -108,10 +108,6 @@
 		"platform-visual-refresh-icons-legacy-facade": {
 			"type": "boolean"
 		},
-		"design_system_select-a11y-improvement": {
-			"type": "boolean",
-			"referenceOnly": true
-		},
 		"platform-visual-refresh-icons": {
 			"type": "boolean"
 		},

package/dist/cjs/utils/country-groups-announcement.js

@@ -1,29 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.isCountryOptionsGrouped = void 0;
-exports.onCountryOptionFocus = onCountryOptionFocus;
-// Used for overwriting ariaLiveMessages builtin onFocus method.
-// Returns custom built string while focusing each group option. This string is used for screen reader announcement.
-function onCountryOptionFocus(onFocusProps, defaultOptions) {
-  var _groupData$options$fi;
-  var focused = onFocusProps.focused;
-  var isOptionFocused = function isOptionFocused(option) {
-    return option.name === focused.name;
-  };
-  var groupData = defaultOptions === null || defaultOptions === void 0 ? void 0 : defaultOptions.find(function (option) {
-    var _option$options;
-    return (_option$options = option.options) === null || _option$options === void 0 ? void 0 : _option$options.some(isOptionFocused);
-  });
-  var groupOptionIndex = (_groupData$options$fi = groupData === null || groupData === void 0 ? void 0 : groupData.options.findIndex(isOptionFocused)) !== null && _groupData$options$fi !== void 0 ? _groupData$options$fi : 0;
-  return "Option ".concat(focused.name, " (").concat(focused.abbr.toUpperCase(), ") +").concat(focused.code, ", ").concat(groupData === null || groupData === void 0 ? void 0 : groupData.label, " group, item ").concat(groupOptionIndex + 1, " out of ").concat(groupData === null || groupData === void 0 ? void 0 : groupData.options.length, ". All in all ");
-}
-
-// Helper function which identifies if options are grouped.
-var isCountryOptionsGrouped = exports.isCountryOptionsGrouped = function isCountryOptionsGrouped(arr) {
-  return arr === null || arr === void 0 ? void 0 : arr.every(function (obj) {
-    return obj.hasOwnProperty('options');
-  });
-};

package/dist/es2019/utils/country-groups-announcement.js

@@ -1,22 +0,0 @@
-// Used for overwriting ariaLiveMessages builtin onFocus method.
-// Returns custom built string while focusing each group option. This string is used for screen reader announcement.
-export function onCountryOptionFocus(onFocusProps, defaultOptions) {
-  var _groupData$options$fi;
-  const {
-    focused
-  } = onFocusProps;
-  const isOptionFocused = option => {
-    return option.name === focused.name;
-  };
-  const groupData = defaultOptions === null || defaultOptions === void 0 ? void 0 : defaultOptions.find(option => {
-    var _option$options;
-    return (_option$options = option.options) === null || _option$options === void 0 ? void 0 : _option$options.some(isOptionFocused);
-  });
-  const groupOptionIndex = (_groupData$options$fi = groupData === null || groupData === void 0 ? void 0 : groupData.options.findIndex(isOptionFocused)) !== null && _groupData$options$fi !== void 0 ? _groupData$options$fi : 0;
-  return `Option ${focused.name} (${focused.abbr.toUpperCase()}) +${focused.code}, ${groupData === null || groupData === void 0 ? void 0 : groupData.label} group, item ${groupOptionIndex + 1} out of ${groupData === null || groupData === void 0 ? void 0 : groupData.options.length}. All in all `;
-}
-
-// Helper function which identifies if options are grouped.
-export const isCountryOptionsGrouped = arr => {
-  return arr === null || arr === void 0 ? void 0 : arr.every(obj => obj.hasOwnProperty('options'));
-};

package/dist/esm/utils/country-groups-announcement.js

@@ -1,22 +0,0 @@
-// Used for overwriting ariaLiveMessages builtin onFocus method.
-// Returns custom built string while focusing each group option. This string is used for screen reader announcement.
-export function onCountryOptionFocus(onFocusProps, defaultOptions) {
-  var _groupData$options$fi;
-  var focused = onFocusProps.focused;
-  var isOptionFocused = function isOptionFocused(option) {
-    return option.name === focused.name;
-  };
-  var groupData = defaultOptions === null || defaultOptions === void 0 ? void 0 : defaultOptions.find(function (option) {
-    var _option$options;
-    return (_option$options = option.options) === null || _option$options === void 0 ? void 0 : _option$options.some(isOptionFocused);
-  });
-  var groupOptionIndex = (_groupData$options$fi = groupData === null || groupData === void 0 ? void 0 : groupData.options.findIndex(isOptionFocused)) !== null && _groupData$options$fi !== void 0 ? _groupData$options$fi : 0;
-  return "Option ".concat(focused.name, " (").concat(focused.abbr.toUpperCase(), ") +").concat(focused.code, ", ").concat(groupData === null || groupData === void 0 ? void 0 : groupData.label, " group, item ").concat(groupOptionIndex + 1, " out of ").concat(groupData === null || groupData === void 0 ? void 0 : groupData.options.length, ". All in all ");
-}
-
-// Helper function which identifies if options are grouped.
-export var isCountryOptionsGrouped = function isCountryOptionsGrouped(arr) {
-  return arr === null || arr === void 0 ? void 0 : arr.every(function (obj) {
-    return obj.hasOwnProperty('options');
-  });
-};

package/dist/types/utils/country-groups-announcement.d.ts

@@ -1,15 +0,0 @@
-import { type AriaOnFocusProps, type OptionsOrGroups } from '@atlaskit/react-select';
-import { type GroupType } from '../types';
-type Country = {
-    icon: string;
-    name: string;
-    abbr: string;
-    code: string | number;
-};
-export type CountyGroupOptions = {
-    label: string;
-    options: Country[];
-};
-export declare function onCountryOptionFocus(onFocusProps: AriaOnFocusProps<Country, GroupType<Country>>, defaultOptions?: CountyGroupOptions[]): string;
-export declare const isCountryOptionsGrouped: (arr?: OptionsOrGroups<Country, GroupType<Country>>) => boolean | undefined;
-export {};

package/dist/types-ts4.5/utils/country-groups-announcement.d.ts

@@ -1,15 +0,0 @@
-import { type AriaOnFocusProps, type OptionsOrGroups } from '@atlaskit/react-select';
-import { type GroupType } from '../types';
-type Country = {
-    icon: string;
-    name: string;
-    abbr: string;
-    code: string | number;
-};
-export type CountyGroupOptions = {
-    label: string;
-    options: Country[];
-};
-export declare function onCountryOptionFocus(onFocusProps: AriaOnFocusProps<Country, GroupType<Country>>, defaultOptions?: CountyGroupOptions[]): string;
-export declare const isCountryOptionsGrouped: (arr?: OptionsOrGroups<Country, GroupType<Country>>) => boolean | undefined;
-export {};