@atlaskit/react-select 2.0.0 → 2.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/components/option.js +1 -6
  3. package/dist/cjs/select.js +4 -7
  4. package/dist/es2019/components/option.js +1 -6
  5. package/dist/es2019/select.js +3 -6
  6. package/dist/esm/components/option.js +1 -6
  7. package/dist/esm/select.js +4 -7
  8. package/package.json +4 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/react-select
2
2
 
3
+ ## 2.0.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#119843](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/119843)
8
+ [`7bd0d851d1c39`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7bd0d851d1c39) -
9
+ [ux] Clean up ARIA props that are no longer needed
10
+
3
11
  ## 2.0.0
4
12
 
5
13
  ### Major Changes
package/dist/cjs/components/option.js CHANGED
@@ -7,10 +7,7 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.optionCSS = exports.default = void 0;
8
8
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
9
  var _react = require("@emotion/react");
10
- var _deviceCheck = require("@atlaskit/ds-lib/device-check");
11
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
12
10
  var _utils = require("../utils");
13
- var _a11yText = _interopRequireDefault(require("./internal/a11y-text"));
14
11
  /**
15
12
  * @jsxRuntime classic
16
13
  * @jsx jsx
@@ -69,8 +66,6 @@ var Option = function Option(props) {
69
66
  isSelected = props.isSelected,
70
67
  innerRef = props.innerRef,
71
68
  innerProps = props.innerProps;
72
- // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
73
- var isVoiceOver = (0, _deviceCheck.isAppleDevice)() && (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement');
74
69
  return (0, _react.jsx)("div", (0, _extends2.default)({}, (0, _utils.getStyleProps)(props, 'option', {
75
70
  option: true,
76
71
  'option--is-disabled': isDisabled,
@@ -80,7 +75,7 @@ var Option = function Option(props) {
80
75
  ref: innerRef
81
76
  }, innerProps, {
82
77
  tabIndex: -1
83
- }), children, isVoiceOver && (isSelected || isDisabled) && (0, _react.jsx)(_a11yText.default, null, "".concat(isSelected ? ',selected' : '').concat(isDisabled ? ',dimmed' : '')));
78
+ }), children);
84
79
  };
85
80
 
86
81
  // eslint-disable-next-line @repo/internal/react/require-jsdoc
package/dist/cjs/select.js CHANGED
@@ -1261,9 +1261,7 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
1261
1261
  'aria-labelledby': this.props['aria-labelledby'] || labelId,
1262
1262
  'aria-required': required || isRequired,
1263
1263
  role: 'combobox',
1264
- 'aria-activedescendant': this.state.focusedOptionId || undefined,
1265
- // Safari needs aria-owns in order for aria-activedescendant to work properly
1266
- 'aria-owns': (0, _deviceCheck.isSafari)() && (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? this.getElementId('listbox') : undefined
1264
+ 'aria-activedescendant': this.state.focusedOptionId || undefined
1267
1265
  }, menuIsOpen && {
1268
1266
  'aria-controls': this.getElementId('listbox')
1269
1267
  }), !isSearchable && {
@@ -1528,10 +1526,9 @@ var Select = exports.default = /*#__PURE__*/function (_Component) {
1528
1526
  onMouseMove: onHover,
1529
1527
  onMouseOver: onHover,
1530
1528
  role: 'option',
1531
- // We don't want aria-selected on Apple devices or if it's false. It does nasty things.
1532
- 'aria-selected': (!commonProps.isMulti || _this4.isVoiceOver || !isSelected) && (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? undefined : isSelected,
1533
- // We don't want aria-disabled on Apple devices or if it's false. It's just noisy.
1534
- 'aria-disabled': ((0, _deviceCheck.isAppleDevice)() || !isDisabled) && (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? undefined : isDisabled,
1529
+ 'aria-selected': isSelected,
1530
+ // We don't want aria-disabled if it's false. It's just noisy.
1531
+ 'aria-disabled': !isDisabled && (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? undefined : isDisabled,
1535
1532
  'aria-describedby': (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? headingId : undefined
1536
1533
  }, testId && {
1537
1534
  'data-testid': "".concat(testId, "-select--option-").concat(id)
package/dist/es2019/components/option.js CHANGED
@@ -5,10 +5,7 @@ import _extends from "@babel/runtime/helpers/extends";
5
5
  */
6
6
 
7
7
  import { jsx } from '@emotion/react';
8
- import { isAppleDevice } from '@atlaskit/ds-lib/device-check';
9
- import { fg } from '@atlaskit/platform-feature-flags';
10
8
  import { getStyleProps } from '../utils';
11
- import A11yText from './internal/a11y-text';
12
9
  export const optionCSS = ({
13
10
  isDisabled,
14
11
  isFocused,
@@ -65,8 +62,6 @@ const Option = props => {
65
62
  innerRef,
66
63
  innerProps
67
64
  } = props;
68
- // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
69
- const isVoiceOver = isAppleDevice() && fg('design_system_select-a11y-improvement');
70
65
  return jsx("div", _extends({}, getStyleProps(props, 'option', {
71
66
  option: true,
72
67
  'option--is-disabled': isDisabled,
@@ -76,7 +71,7 @@ const Option = props => {
76
71
  ref: innerRef
77
72
  }, innerProps, {
78
73
  tabIndex: -1
79
- }), children, isVoiceOver && (isSelected || isDisabled) && jsx(A11yText, null, `${isSelected ? ',selected' : ''}${isDisabled ? ',dimmed' : ''}`));
74
+ }), children);
80
75
  };
81
76
 
82
77
  // eslint-disable-next-line @repo/internal/react/require-jsdoc
package/dist/es2019/select.js CHANGED
@@ -1272,8 +1272,6 @@ export default class Select extends Component {
1272
1272
  'aria-required': required || isRequired,
1273
1273
  role: 'combobox',
1274
1274
  'aria-activedescendant': this.state.focusedOptionId || undefined,
1275
- // Safari needs aria-owns in order for aria-activedescendant to work properly
1276
- 'aria-owns': isSafari() && fg('design_system_select-a11y-improvement') ? this.getElementId('listbox') : undefined,
1277
1275
  ...(menuIsOpen && {
1278
1276
  'aria-controls': this.getElementId('listbox')
1279
1277
  }),
@@ -1558,10 +1556,9 @@ export default class Select extends Component {
1558
1556
  onMouseMove: onHover,
1559
1557
  onMouseOver: onHover,
1560
1558
  role: 'option',
1561
- // We don't want aria-selected on Apple devices or if it's false. It does nasty things.
1562
- 'aria-selected': (!commonProps.isMulti || this.isVoiceOver || !isSelected) && fg('design_system_select-a11y-improvement') ? undefined : isSelected,
1563
- // We don't want aria-disabled on Apple devices or if it's false. It's just noisy.
1564
- 'aria-disabled': (isAppleDevice() || !isDisabled) && fg('design_system_select-a11y-improvement') ? undefined : isDisabled,
1559
+ 'aria-selected': isSelected,
1560
+ // We don't want aria-disabled if it's false. It's just noisy.
1561
+ 'aria-disabled': !isDisabled && fg('design_system_select-a11y-improvement') ? undefined : isDisabled,
1565
1562
  'aria-describedby': fg('design_system_select-a11y-improvement') ? headingId : undefined,
1566
1563
  ...(testId && {
1567
1564
  'data-testid': `${testId}-select--option-${id}`
package/dist/esm/components/option.js CHANGED
@@ -5,10 +5,7 @@ import _extends from "@babel/runtime/helpers/extends";
5
5
  */
6
6
 
7
7
  import { jsx } from '@emotion/react';
8
- import { isAppleDevice } from '@atlaskit/ds-lib/device-check';
9
- import { fg } from '@atlaskit/platform-feature-flags';
10
8
  import { getStyleProps } from '../utils';
11
- import A11yText from './internal/a11y-text';
12
9
  export var optionCSS = function optionCSS(_ref) {
13
10
  var isDisabled = _ref.isDisabled,
14
11
  isFocused = _ref.isFocused,
@@ -62,8 +59,6 @@ var Option = function Option(props) {
62
59
  isSelected = props.isSelected,
63
60
  innerRef = props.innerRef,
64
61
  innerProps = props.innerProps;
65
- // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
66
- var isVoiceOver = isAppleDevice() && fg('design_system_select-a11y-improvement');
67
62
  return jsx("div", _extends({}, getStyleProps(props, 'option', {
68
63
  option: true,
69
64
  'option--is-disabled': isDisabled,
@@ -73,7 +68,7 @@ var Option = function Option(props) {
73
68
  ref: innerRef
74
69
  }, innerProps, {
75
70
  tabIndex: -1
76
- }), children, isVoiceOver && (isSelected || isDisabled) && jsx(A11yText, null, "".concat(isSelected ? ',selected' : '').concat(isDisabled ? ',dimmed' : '')));
71
+ }), children);
77
72
  };
78
73
 
79
74
  // eslint-disable-next-line @repo/internal/react/require-jsdoc
package/dist/esm/select.js CHANGED
@@ -1252,9 +1252,7 @@ var Select = /*#__PURE__*/function (_Component) {
1252
1252
  'aria-labelledby': this.props['aria-labelledby'] || labelId,
1253
1253
  'aria-required': required || isRequired,
1254
1254
  role: 'combobox',
1255
- 'aria-activedescendant': this.state.focusedOptionId || undefined,
1256
- // Safari needs aria-owns in order for aria-activedescendant to work properly
1257
- 'aria-owns': isSafari() && fg('design_system_select-a11y-improvement') ? this.getElementId('listbox') : undefined
1255
+ 'aria-activedescendant': this.state.focusedOptionId || undefined
1258
1256
  }, menuIsOpen && {
1259
1257
  'aria-controls': this.getElementId('listbox')
1260
1258
  }), !isSearchable && {
@@ -1519,10 +1517,9 @@ var Select = /*#__PURE__*/function (_Component) {
1519
1517
  onMouseMove: onHover,
1520
1518
  onMouseOver: onHover,
1521
1519
  role: 'option',
1522
- // We don't want aria-selected on Apple devices or if it's false. It does nasty things.
1523
- 'aria-selected': (!commonProps.isMulti || _this4.isVoiceOver || !isSelected) && fg('design_system_select-a11y-improvement') ? undefined : isSelected,
1524
- // We don't want aria-disabled on Apple devices or if it's false. It's just noisy.
1525
- 'aria-disabled': (isAppleDevice() || !isDisabled) && fg('design_system_select-a11y-improvement') ? undefined : isDisabled,
1520
+ 'aria-selected': isSelected,
1521
+ // We don't want aria-disabled if it's false. It's just noisy.
1522
+ 'aria-disabled': !isDisabled && fg('design_system_select-a11y-improvement') ? undefined : isDisabled,
1526
1523
  'aria-describedby': fg('design_system_select-a11y-improvement') ? headingId : undefined
1527
1524
  }, testId && {
1528
1525
  'data-testid': "".concat(testId, "-select--option-").concat(id)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/react-select",
3
- "version": "2.0.0",
3
+ "version": "2.0.1",
4
4
  "description": "A forked version of react-select to only be used in atlaskit/select",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -30,11 +30,11 @@
30
30
  },
31
31
  "dependencies": {
32
32
  "@atlaskit/ds-lib": "^4.0.0",
33
- "@atlaskit/icon": "^24.0.0",
33
+ "@atlaskit/icon": "^24.1.0",
34
34
  "@atlaskit/platform-feature-flags": "^1.1.0",
35
- "@atlaskit/primitives": "^14.0.0",
35
+ "@atlaskit/primitives": "^14.1.0",
36
36
  "@atlaskit/spinner": "^18.0.0",
37
- "@atlaskit/tokens": "^4.0.0",
37
+ "@atlaskit/tokens": "^4.2.0",
38
38
  "@babel/runtime": "^7.0.0",
39
39
  "@emotion/react": "^11.7.1",
40
40
  "@floating-ui/dom": "^1.0.1",