@atlaskit/react-select 2.2.0 → 2.2.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 (102) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/emotion/components/containers.js +111 -0
  3. package/dist/cjs/emotion/components/control.js +110 -0
  4. package/dist/cjs/emotion/components/group.js +71 -0
  5. package/dist/cjs/emotion/components/index.js +52 -0
  6. package/dist/cjs/emotion/components/indicators.js +137 -0
  7. package/dist/cjs/emotion/components/input.js +94 -0
  8. package/dist/cjs/emotion/components/internal/a11y-text.js +36 -0
  9. package/dist/cjs/emotion/components/internal/dummy-input.js +44 -0
  10. package/dist/cjs/emotion/components/internal/index.js +34 -0
  11. package/dist/cjs/emotion/components/internal/notify-open-layer-observer.js +21 -0
  12. package/dist/cjs/emotion/components/internal/required-input.js +43 -0
  13. package/dist/cjs/emotion/components/internal/scroll-manager.js +57 -0
  14. package/dist/cjs/emotion/components/internal/use-scroll-capture.js +132 -0
  15. package/dist/cjs/emotion/components/internal/use-scroll-lock.js +149 -0
  16. package/dist/cjs/emotion/components/live-region.js +182 -0
  17. package/dist/cjs/emotion/components/menu.js +456 -0
  18. package/dist/cjs/emotion/components/multi-value.js +224 -0
  19. package/dist/cjs/emotion/components/option.js +82 -0
  20. package/dist/cjs/emotion/components/placeholder.js +34 -0
  21. package/dist/cjs/emotion/components/single-value.js +40 -0
  22. package/dist/es2019/emotion/components/containers.js +109 -0
  23. package/dist/es2019/emotion/components/control.js +107 -0
  24. package/dist/es2019/emotion/components/group.js +59 -0
  25. package/dist/es2019/emotion/components/index.js +41 -0
  26. package/dist/es2019/emotion/components/indicators.js +128 -0
  27. package/dist/es2019/emotion/components/input.js +86 -0
  28. package/dist/es2019/emotion/components/internal/a11y-text.js +27 -0
  29. package/dist/es2019/emotion/components/internal/dummy-input.js +37 -0
  30. package/dist/es2019/emotion/components/internal/index.js +4 -0
  31. package/dist/es2019/emotion/components/internal/notify-open-layer-observer.js +16 -0
  32. package/dist/es2019/emotion/components/internal/required-input.js +35 -0
  33. package/dist/es2019/emotion/components/internal/scroll-manager.js +49 -0
  34. package/dist/es2019/emotion/components/internal/use-scroll-capture.js +128 -0
  35. package/dist/es2019/emotion/components/internal/use-scroll-lock.js +143 -0
  36. package/dist/es2019/emotion/components/live-region.js +178 -0
  37. package/dist/es2019/emotion/components/menu.js +450 -0
  38. package/dist/es2019/emotion/components/multi-value.js +227 -0
  39. package/dist/es2019/emotion/components/option.js +78 -0
  40. package/dist/es2019/emotion/components/placeholder.js +28 -0
  41. package/dist/es2019/emotion/components/single-value.js +34 -0
  42. package/dist/esm/emotion/components/containers.js +105 -0
  43. package/dist/esm/emotion/components/control.js +103 -0
  44. package/dist/esm/emotion/components/group.js +65 -0
  45. package/dist/esm/emotion/components/index.js +43 -0
  46. package/dist/esm/emotion/components/indicators.js +132 -0
  47. package/dist/esm/emotion/components/input.js +89 -0
  48. package/dist/esm/emotion/components/internal/a11y-text.js +29 -0
  49. package/dist/esm/emotion/components/internal/dummy-input.js +38 -0
  50. package/dist/esm/emotion/components/internal/index.js +4 -0
  51. package/dist/esm/emotion/components/internal/notify-open-layer-observer.js +15 -0
  52. package/dist/esm/emotion/components/internal/required-input.js +36 -0
  53. package/dist/esm/emotion/components/internal/scroll-manager.js +49 -0
  54. package/dist/esm/emotion/components/internal/use-scroll-capture.js +126 -0
  55. package/dist/esm/emotion/components/internal/use-scroll-lock.js +143 -0
  56. package/dist/esm/emotion/components/live-region.js +175 -0
  57. package/dist/esm/emotion/components/menu.js +454 -0
  58. package/dist/esm/emotion/components/multi-value.js +217 -0
  59. package/dist/esm/emotion/components/option.js +75 -0
  60. package/dist/esm/emotion/components/placeholder.js +27 -0
  61. package/dist/esm/emotion/components/single-value.js +33 -0
  62. package/dist/types/emotion/components/containers.d.ts +54 -0
  63. package/dist/types/emotion/components/control.d.ts +42 -0
  64. package/dist/types/emotion/components/group.d.ts +52 -0
  65. package/dist/types/emotion/components/index.d.ts +67 -0
  66. package/dist/types/emotion/components/indicators.d.ts +73 -0
  67. package/dist/types/emotion/components/input.d.ts +37 -0
  68. package/dist/types/emotion/components/internal/a11y-text.d.ts +8 -0
  69. package/dist/types/emotion/components/internal/dummy-input.d.ts +9 -0
  70. package/dist/types/emotion/components/internal/index.d.ts +4 -0
  71. package/dist/types/emotion/components/internal/notify-open-layer-observer.d.ts +11 -0
  72. package/dist/types/emotion/components/internal/required-input.d.ts +10 -0
  73. package/dist/types/emotion/components/internal/scroll-manager.d.ts +17 -0
  74. package/dist/types/emotion/components/internal/use-scroll-capture.d.ts +12 -0
  75. package/dist/types/emotion/components/internal/use-scroll-lock.d.ts +9 -0
  76. package/dist/types/emotion/components/live-region.d.ts +25 -0
  77. package/dist/types/emotion/components/menu.d.ts +116 -0
  78. package/dist/types/emotion/components/multi-value.d.ts +47 -0
  79. package/dist/types/emotion/components/option.d.ts +49 -0
  80. package/dist/types/emotion/components/placeholder.d.ts +22 -0
  81. package/dist/types/emotion/components/single-value.d.ts +28 -0
  82. package/dist/types-ts4.5/emotion/components/containers.d.ts +54 -0
  83. package/dist/types-ts4.5/emotion/components/control.d.ts +42 -0
  84. package/dist/types-ts4.5/emotion/components/group.d.ts +52 -0
  85. package/dist/types-ts4.5/emotion/components/index.d.ts +67 -0
  86. package/dist/types-ts4.5/emotion/components/indicators.d.ts +73 -0
  87. package/dist/types-ts4.5/emotion/components/input.d.ts +37 -0
  88. package/dist/types-ts4.5/emotion/components/internal/a11y-text.d.ts +8 -0
  89. package/dist/types-ts4.5/emotion/components/internal/dummy-input.d.ts +9 -0
  90. package/dist/types-ts4.5/emotion/components/internal/index.d.ts +4 -0
  91. package/dist/types-ts4.5/emotion/components/internal/notify-open-layer-observer.d.ts +11 -0
  92. package/dist/types-ts4.5/emotion/components/internal/required-input.d.ts +10 -0
  93. package/dist/types-ts4.5/emotion/components/internal/scroll-manager.d.ts +17 -0
  94. package/dist/types-ts4.5/emotion/components/internal/use-scroll-capture.d.ts +12 -0
  95. package/dist/types-ts4.5/emotion/components/internal/use-scroll-lock.d.ts +9 -0
  96. package/dist/types-ts4.5/emotion/components/live-region.d.ts +25 -0
  97. package/dist/types-ts4.5/emotion/components/menu.d.ts +116 -0
  98. package/dist/types-ts4.5/emotion/components/multi-value.d.ts +47 -0
  99. package/dist/types-ts4.5/emotion/components/option.d.ts +49 -0
  100. package/dist/types-ts4.5/emotion/components/placeholder.d.ts +22 -0
  101. package/dist/types-ts4.5/emotion/components/single-value.d.ts +28 -0
  102. package/package.json +1 -1
@@ -0,0 +1,34 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ Object.defineProperty(exports, "A11yText", {
8
+ enumerable: true,
9
+ get: function get() {
10
+ return _a11yText.default;
11
+ }
12
+ });
13
+ Object.defineProperty(exports, "DummyInput", {
14
+ enumerable: true,
15
+ get: function get() {
16
+ return _dummyInput.default;
17
+ }
18
+ });
19
+ Object.defineProperty(exports, "RequiredInput", {
20
+ enumerable: true,
21
+ get: function get() {
22
+ return _requiredInput.default;
23
+ }
24
+ });
25
+ Object.defineProperty(exports, "ScrollManager", {
26
+ enumerable: true,
27
+ get: function get() {
28
+ return _scrollManager.default;
29
+ }
30
+ });
31
+ var _a11yText = _interopRequireDefault(require("./a11y-text"));
32
+ var _dummyInput = _interopRequireDefault(require("./dummy-input"));
33
+ var _scrollManager = _interopRequireDefault(require("./scroll-manager"));
34
+ var _requiredInput = _interopRequireDefault(require("./required-input"));
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.NotifyOpenLayerObserver = NotifyOpenLayerObserver;
7
+ var _openLayerObserver = require("@atlaskit/layering/experimental/open-layer-observer");
8
+ /**
9
+ * Functional component wrapper around `useNotifyOpenLayerObserver`.
10
+ *
11
+ * This is needed as Select is a class component, which cannot use hooks directly.
12
+ */
13
+ function NotifyOpenLayerObserver(_ref) {
14
+ var isOpen = _ref.isOpen,
15
+ onClose = _ref.onClose;
16
+ (0, _openLayerObserver.useNotifyOpenLayerObserver)({
17
+ isOpen: isOpen,
18
+ onClose: onClose
19
+ });
20
+ return null;
21
+ }
@@ -0,0 +1,43 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = void 0;
8
+ var _react = require("@emotion/react");
9
+ var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
10
+ /**
11
+ * @jsxRuntime classic
12
+ * @jsx jsx
13
+ */
14
+
15
+ var styles = (0, _react.css)({
16
+ width: '100%',
17
+ position: 'absolute',
18
+ insetBlockEnd: 0,
19
+ insetInlineEnd: 0,
20
+ insetInlineStart: 0,
21
+ label: 'requiredInput',
22
+ opacity: 0,
23
+ pointerEvents: 'none'
24
+ });
25
+ var RequiredInput = function RequiredInput(_ref) {
26
+ var name = _ref.name,
27
+ onFocus = _ref.onFocus;
28
+ return (0, _react.jsx)("input", {
29
+ required: true,
30
+ name: name,
31
+ tabIndex: -1,
32
+ "aria-hidden": "true",
33
+ onFocus: onFocus,
34
+ css: styles
35
+ // Prevent `Switching from uncontrolled to controlled` error
36
+ ,
37
+ value: "",
38
+ onChange: _noop.default
39
+ });
40
+ };
41
+
42
+ // eslint-disable-next-line @repo/internal/react/require-jsdoc
43
+ var _default = exports.default = RequiredInput;
@@ -0,0 +1,57 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = ScrollManager;
8
+ var _react = require("react");
9
+ var _react2 = require("@emotion/react");
10
+ var _useScrollCapture = _interopRequireDefault(require("./use-scroll-capture"));
11
+ var _useScrollLock = _interopRequireDefault(require("./use-scroll-lock"));
12
+ /**
13
+ * @jsxRuntime classic
14
+ * @jsx jsx
15
+ */
16
+
17
+ var styles = (0, _react2.css)({
18
+ position: 'fixed',
19
+ insetBlockEnd: 0,
20
+ insetBlockStart: 0,
21
+ insetInlineEnd: 0,
22
+ insetInlineStart: 0
23
+ });
24
+ var blurSelectInput = function blurSelectInput(event) {
25
+ var element = event.target;
26
+ return element.ownerDocument.activeElement && element.ownerDocument.activeElement.blur();
27
+ };
28
+ function ScrollManager(_ref) {
29
+ var children = _ref.children,
30
+ lockEnabled = _ref.lockEnabled,
31
+ _ref$captureEnabled = _ref.captureEnabled,
32
+ captureEnabled = _ref$captureEnabled === void 0 ? true : _ref$captureEnabled,
33
+ onBottomArrive = _ref.onBottomArrive,
34
+ onBottomLeave = _ref.onBottomLeave,
35
+ onTopArrive = _ref.onTopArrive,
36
+ onTopLeave = _ref.onTopLeave;
37
+ var setScrollCaptureTarget = (0, _useScrollCapture.default)({
38
+ isEnabled: captureEnabled,
39
+ onBottomArrive: onBottomArrive,
40
+ onBottomLeave: onBottomLeave,
41
+ onTopArrive: onTopArrive,
42
+ onTopLeave: onTopLeave
43
+ });
44
+ var setScrollLockTarget = (0, _useScrollLock.default)({
45
+ isEnabled: lockEnabled
46
+ });
47
+ var targetRef = function targetRef(element) {
48
+ setScrollCaptureTarget(element);
49
+ setScrollLockTarget(element);
50
+ };
51
+ return (0, _react2.jsx)(_react.Fragment, null, lockEnabled &&
52
+ // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
53
+ (0, _react2.jsx)("div", {
54
+ onClick: blurSelectInput,
55
+ css: styles
56
+ }), children(targetRef));
57
+ }
@@ -0,0 +1,132 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = useScrollCapture;
7
+ var _react = require("react");
8
+ var _utils = require("../../../utils");
9
+ var cancelScroll = function cancelScroll(event) {
10
+ if (event.cancelable) {
11
+ event.preventDefault();
12
+ }
13
+ event.stopPropagation();
14
+ };
15
+ // TODO: Fill in the hook {description}.
16
+ /**
17
+ * {description}.
18
+ */
19
+ function useScrollCapture(_ref) {
20
+ var isEnabled = _ref.isEnabled,
21
+ onBottomArrive = _ref.onBottomArrive,
22
+ onBottomLeave = _ref.onBottomLeave,
23
+ onTopArrive = _ref.onTopArrive,
24
+ onTopLeave = _ref.onTopLeave;
25
+ var isBottom = (0, _react.useRef)(false);
26
+ var isTop = (0, _react.useRef)(false);
27
+ var touchStart = (0, _react.useRef)(0);
28
+ var scrollTarget = (0, _react.useRef)(null);
29
+ var handleEventDelta = (0, _react.useCallback)(function (event, delta) {
30
+ if (scrollTarget.current === null) {
31
+ return;
32
+ }
33
+ var _scrollTarget$current = scrollTarget.current,
34
+ scrollTop = _scrollTarget$current.scrollTop,
35
+ scrollHeight = _scrollTarget$current.scrollHeight,
36
+ clientHeight = _scrollTarget$current.clientHeight;
37
+ var target = scrollTarget.current;
38
+ var isDeltaPositive = delta > 0;
39
+ var availableScroll = scrollHeight - clientHeight - scrollTop;
40
+ var shouldCancelScroll = false;
41
+
42
+ // reset bottom/top flags
43
+ if (availableScroll > delta && isBottom.current) {
44
+ if (onBottomLeave) {
45
+ onBottomLeave(event);
46
+ }
47
+ isBottom.current = false;
48
+ }
49
+ if (isDeltaPositive && isTop.current) {
50
+ if (onTopLeave) {
51
+ onTopLeave(event);
52
+ }
53
+ isTop.current = false;
54
+ }
55
+
56
+ // bottom limit
57
+ if (isDeltaPositive && delta > availableScroll) {
58
+ if (onBottomArrive && !isBottom.current) {
59
+ onBottomArrive(event);
60
+ }
61
+ target.scrollTop = scrollHeight;
62
+ shouldCancelScroll = true;
63
+ isBottom.current = true;
64
+
65
+ // top limit
66
+ } else if (!isDeltaPositive && -delta > scrollTop) {
67
+ if (onTopArrive && !isTop.current) {
68
+ onTopArrive(event);
69
+ }
70
+ target.scrollTop = 0;
71
+ shouldCancelScroll = true;
72
+ isTop.current = true;
73
+ }
74
+
75
+ // cancel scroll
76
+ if (shouldCancelScroll) {
77
+ cancelScroll(event);
78
+ }
79
+ }, [onBottomArrive, onBottomLeave, onTopArrive, onTopLeave]);
80
+ var onWheel = (0, _react.useCallback)(function (event) {
81
+ handleEventDelta(event, event.deltaY);
82
+ }, [handleEventDelta]);
83
+ var onTouchStart = (0, _react.useCallback)(function (event) {
84
+ // set touch start so we can calculate touchmove delta
85
+ touchStart.current = event.changedTouches[0].clientY;
86
+ }, []);
87
+ var onTouchMove = (0, _react.useCallback)(function (event) {
88
+ var deltaY = touchStart.current - event.changedTouches[0].clientY;
89
+ handleEventDelta(event, deltaY);
90
+ }, [handleEventDelta]);
91
+ var startListening = (0, _react.useCallback)(function (el) {
92
+ // bail early if no element is available to attach to
93
+ if (!el) {
94
+ return;
95
+ }
96
+ var notPassive = _utils.supportsPassiveEvents ? {
97
+ passive: false
98
+ } : false;
99
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
100
+ el.addEventListener('wheel', onWheel, notPassive);
101
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
102
+ el.addEventListener('touchstart', onTouchStart, notPassive);
103
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
104
+ el.addEventListener('touchmove', onTouchMove, notPassive);
105
+ }, [onTouchMove, onTouchStart, onWheel]);
106
+ var stopListening = (0, _react.useCallback)(function (el) {
107
+ // bail early if no element is available to detach from
108
+ if (!el) {
109
+ return;
110
+ }
111
+
112
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
113
+ el.removeEventListener('wheel', onWheel, false);
114
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
115
+ el.removeEventListener('touchstart', onTouchStart, false);
116
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
117
+ el.removeEventListener('touchmove', onTouchMove, false);
118
+ }, [onTouchMove, onTouchStart, onWheel]);
119
+ (0, _react.useEffect)(function () {
120
+ if (!isEnabled) {
121
+ return;
122
+ }
123
+ var element = scrollTarget.current;
124
+ startListening(element);
125
+ return function () {
126
+ stopListening(element);
127
+ };
128
+ }, [isEnabled, startListening, stopListening]);
129
+ return function (element) {
130
+ scrollTarget.current = element;
131
+ };
132
+ }
@@ -0,0 +1,149 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = useScrollLock;
7
+ var _react = require("react");
8
+ var STYLE_KEYS = ['boxSizing', 'height', 'overflow', 'paddingRight', 'position'];
9
+ var LOCK_STYLES = {
10
+ boxSizing: 'border-box',
11
+ // account for possible declaration `width: 100%;` on body
12
+ overflow: 'hidden',
13
+ position: 'relative',
14
+ height: '100%'
15
+ };
16
+ function preventTouchMove(e) {
17
+ e.preventDefault();
18
+ }
19
+ function allowTouchMove(e) {
20
+ e.stopPropagation();
21
+ }
22
+ function preventInertiaScroll() {
23
+ var top = this.scrollTop;
24
+ var totalScroll = this.scrollHeight;
25
+ var currentScroll = top + this.offsetHeight;
26
+ if (top === 0) {
27
+ this.scrollTop = 1;
28
+ } else if (currentScroll === totalScroll) {
29
+ this.scrollTop = top - 1;
30
+ }
31
+ }
32
+
33
+ // `ontouchstart` check works on most browsers
34
+ // `maxTouchPoints` works on IE10/11 and Surface
35
+ function isTouchDevice() {
36
+ // eslint-disable-next-line compat/compat
37
+ return 'ontouchstart' in window || navigator.maxTouchPoints;
38
+ }
39
+ var canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
40
+ var activeScrollLocks = 0;
41
+ var listenerOptions = {
42
+ capture: false,
43
+ passive: false
44
+ };
45
+
46
+ // TODO: Fill in the hook {description}.
47
+ /**
48
+ * {description}.
49
+ */
50
+ function useScrollLock(_ref) {
51
+ var isEnabled = _ref.isEnabled,
52
+ _ref$accountForScroll = _ref.accountForScrollbars,
53
+ accountForScrollbars = _ref$accountForScroll === void 0 ? true : _ref$accountForScroll;
54
+ var originalStyles = (0, _react.useRef)({});
55
+ var scrollTarget = (0, _react.useRef)(null);
56
+ var addScrollLock = (0, _react.useCallback)(function (touchScrollTarget) {
57
+ if (!canUseDOM) {
58
+ return;
59
+ }
60
+ var target = document.body;
61
+ var targetStyle = target && target.style;
62
+ if (accountForScrollbars) {
63
+ // store any styles already applied to the body
64
+ STYLE_KEYS.forEach(function (key) {
65
+ var val = targetStyle && targetStyle[key];
66
+ originalStyles.current[key] = val;
67
+ });
68
+ }
69
+
70
+ // apply the lock styles and padding if this is the first scroll lock
71
+ if (accountForScrollbars && activeScrollLocks < 1) {
72
+ var currentPadding = parseInt(originalStyles.current.paddingRight, 10) || 0;
73
+ var clientWidth = document.body ? document.body.clientWidth : 0;
74
+ var adjustedPadding = window.innerWidth - clientWidth + currentPadding || 0;
75
+ Object.keys(LOCK_STYLES).forEach(function (key) {
76
+ var val = LOCK_STYLES[key];
77
+ if (targetStyle) {
78
+ targetStyle[key] = val;
79
+ }
80
+ });
81
+ if (targetStyle) {
82
+ targetStyle.paddingRight = "".concat(adjustedPadding, "px");
83
+ }
84
+ }
85
+
86
+ // account for touch devices
87
+ if (target && isTouchDevice()) {
88
+ // Mobile Safari ignores { overflow: hidden } declaration on the body.
89
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
90
+ target.addEventListener('touchmove', preventTouchMove, listenerOptions);
91
+
92
+ // Allow scroll on provided target
93
+ if (touchScrollTarget) {
94
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
95
+ touchScrollTarget.addEventListener('touchstart', preventInertiaScroll, listenerOptions);
96
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
97
+ touchScrollTarget.addEventListener('touchmove', allowTouchMove, listenerOptions);
98
+ }
99
+ }
100
+
101
+ // increment active scroll locks
102
+ activeScrollLocks += 1;
103
+ }, [accountForScrollbars]);
104
+ var removeScrollLock = (0, _react.useCallback)(function (touchScrollTarget) {
105
+ if (!canUseDOM) {
106
+ return;
107
+ }
108
+ var target = document.body;
109
+ var targetStyle = target && target.style;
110
+
111
+ // safely decrement active scroll locks
112
+ activeScrollLocks = Math.max(activeScrollLocks - 1, 0);
113
+
114
+ // reapply original body styles, if any
115
+ if (accountForScrollbars && activeScrollLocks < 1) {
116
+ STYLE_KEYS.forEach(function (key) {
117
+ var val = originalStyles.current[key];
118
+ if (targetStyle) {
119
+ targetStyle[key] = val;
120
+ }
121
+ });
122
+ }
123
+
124
+ // remove touch listeners
125
+ if (target && isTouchDevice()) {
126
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
127
+ target.removeEventListener('touchmove', preventTouchMove, listenerOptions);
128
+ if (touchScrollTarget) {
129
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
130
+ touchScrollTarget.removeEventListener('touchstart', preventInertiaScroll, listenerOptions);
131
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
132
+ touchScrollTarget.removeEventListener('touchmove', allowTouchMove, listenerOptions);
133
+ }
134
+ }
135
+ }, [accountForScrollbars]);
136
+ (0, _react.useEffect)(function () {
137
+ if (!isEnabled) {
138
+ return;
139
+ }
140
+ var element = scrollTarget.current;
141
+ addScrollLock(element);
142
+ return function () {
143
+ removeScrollLock(element);
144
+ };
145
+ }, [isEnabled, addScrollLock, removeScrollLock]);
146
+ return function (element) {
147
+ scrollTarget.current = element;
148
+ };
149
+ }
@@ -0,0 +1,182 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ var _typeof = require("@babel/runtime/helpers/typeof");
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = void 0;
9
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
10
+ var _react = _interopRequireWildcard(require("react"));
11
+ var _react2 = require("@emotion/react");
12
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
13
+ var _accessibility = require("../../accessibility");
14
+ var _a11yText = _interopRequireDefault(require("./internal/a11y-text"));
15
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
16
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
17
+ 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; }
18
+ 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 @atlaskit/platform/ensure-feature-flag-prefix */ /**
19
+ * @jsxRuntime classic
20
+ * @jsx jsx
21
+ * @jsxFrag React.Fragment
22
+ */
23
+ // ==============================
24
+ // Root Container
25
+ // ==============================
26
+
27
+ // eslint-disable-next-line @repo/internal/react/require-jsdoc
28
+ var LiveRegion = function LiveRegion(props) {
29
+ var ariaSelection = props.ariaSelection,
30
+ focusedOption = props.focusedOption,
31
+ focusedValue = props.focusedValue,
32
+ focusableOptions = props.focusableOptions,
33
+ isFocused = props.isFocused,
34
+ selectValue = props.selectValue,
35
+ selectProps = props.selectProps,
36
+ id = props.id,
37
+ isAppleDevice = props.isAppleDevice;
38
+ var ariaLiveMessages = selectProps.ariaLiveMessages,
39
+ getOptionLabel = selectProps.getOptionLabel,
40
+ inputValue = selectProps.inputValue,
41
+ isMulti = selectProps.isMulti,
42
+ isOptionDisabled = selectProps.isOptionDisabled,
43
+ isSearchable = selectProps.isSearchable,
44
+ label = selectProps.label,
45
+ menuIsOpen = selectProps.menuIsOpen,
46
+ options = selectProps.options,
47
+ screenReaderStatus = selectProps.screenReaderStatus,
48
+ tabSelectsValue = selectProps.tabSelectsValue,
49
+ isLoading = selectProps.isLoading;
50
+ var ariaLabel = selectProps['aria-label'] || label;
51
+ var ariaLive = selectProps['aria-live'];
52
+
53
+ // for safari, we will use minimum support from aria-live region
54
+ var isA11yImprovementEnabled = (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') && !isAppleDevice;
55
+
56
+ // Update aria live message configuration when prop changes
57
+ var messages = (0, _react.useMemo)(function () {
58
+ return _objectSpread(_objectSpread({}, _accessibility.defaultAriaLiveMessages), ariaLiveMessages || {});
59
+ }, [ariaLiveMessages]);
60
+
61
+ // Update aria live selected option when prop changes
62
+ var ariaSelected = (0, _react.useMemo)(function () {
63
+ var message = '';
64
+ if (isA11yImprovementEnabled && menuIsOpen) {
65
+ // we don't need to have selected message when the menu is open
66
+ return '';
67
+ }
68
+ if (ariaSelection && messages.onChange) {
69
+ var option = ariaSelection.option,
70
+ selectedOptions = ariaSelection.options,
71
+ removedValue = ariaSelection.removedValue,
72
+ removedValues = ariaSelection.removedValues,
73
+ value = ariaSelection.value;
74
+ // select-option when !isMulti does not return option so we assume selected option is value
75
+ var asOption = function asOption(val) {
76
+ return !Array.isArray(val) ? val : null;
77
+ };
78
+
79
+ // If there is just one item from the action then get its label
80
+ var selected = removedValue || option || asOption(value);
81
+ var _label = selected ? getOptionLabel(selected) : '';
82
+
83
+ // If there are multiple items from the action then return an array of labels
84
+ var multiSelected = selectedOptions || removedValues || undefined;
85
+ var labels = multiSelected ? multiSelected.map(getOptionLabel) : [];
86
+ if (isA11yImprovementEnabled && !_label && !labels.length) {
87
+ // return empty string if no labels provided
88
+ return '';
89
+ }
90
+ var onChangeProps = _objectSpread({
91
+ // multiSelected items are usually items that have already been selected
92
+ // or set by the user as a default value so we assume they are not disabled
93
+ isDisabled: selected && isOptionDisabled(selected, selectValue),
94
+ label: _label,
95
+ labels: labels
96
+ }, ariaSelection);
97
+ message = messages.onChange(onChangeProps);
98
+ }
99
+ return message;
100
+ }, [ariaSelection, messages, isOptionDisabled, selectValue, getOptionLabel, isA11yImprovementEnabled, menuIsOpen]);
101
+ var prevInputValue = (0, _react.useRef)('');
102
+ var ariaFocused = (0, _react.useMemo)(function () {
103
+ var focusMsg = '';
104
+ var focused = focusedOption || focusedValue;
105
+ var isSelected = !!(focusedOption && selectValue && selectValue.includes(focusedOption));
106
+ if (inputValue === prevInputValue.current && isA11yImprovementEnabled) {
107
+ // only announce focus option when searching when ff is on and the input value changed
108
+ // for safari, we will announce for all
109
+ return '';
110
+ }
111
+ if (focused && messages.onFocus) {
112
+ var onFocusProps = {
113
+ focused: focused,
114
+ label: getOptionLabel(focused),
115
+ isDisabled: isOptionDisabled(focused, selectValue),
116
+ isSelected: isSelected,
117
+ options: focusableOptions,
118
+ context: focused === focusedOption ? 'menu' : 'value',
119
+ selectValue: selectValue,
120
+ isMulti: isMulti
121
+ };
122
+ focusMsg = messages.onFocus(onFocusProps);
123
+ }
124
+ prevInputValue.current = inputValue;
125
+ return focusMsg;
126
+ }, [inputValue, focusedOption, focusedValue, getOptionLabel, isOptionDisabled, messages, focusableOptions, selectValue, isA11yImprovementEnabled, isMulti]);
127
+ var ariaResults = (0, _react.useMemo)(function () {
128
+ var resultsMsg = '';
129
+ if (menuIsOpen && options.length && !isLoading && messages.onFilter) {
130
+ var resultsMessage = screenReaderStatus({
131
+ count: focusableOptions.length
132
+ });
133
+ resultsMsg = messages.onFilter({
134
+ inputValue: inputValue,
135
+ resultsMessage: resultsMessage
136
+ });
137
+ }
138
+ return resultsMsg;
139
+ }, [focusableOptions, inputValue, menuIsOpen, messages, options, screenReaderStatus, isLoading]);
140
+ var isInitialFocus = (ariaSelection === null || ariaSelection === void 0 ? void 0 : ariaSelection.action) === 'initial-input-focus';
141
+ var ariaGuidance = (0, _react.useMemo)(function () {
142
+ if ((0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement')) {
143
+ // don't announce guidance at all when ff is on
144
+ return '';
145
+ }
146
+ var guidanceMsg = '';
147
+ if (messages.guidance) {
148
+ var context = focusedValue ? 'value' : menuIsOpen ? 'menu' : 'input';
149
+ guidanceMsg = messages.guidance({
150
+ 'aria-label': ariaLabel,
151
+ context: context,
152
+ isDisabled: focusedOption && isOptionDisabled(focusedOption, selectValue),
153
+ isMulti: isMulti,
154
+ isSearchable: isSearchable,
155
+ tabSelectsValue: tabSelectsValue,
156
+ isInitialFocus: isInitialFocus
157
+ });
158
+ }
159
+ return guidanceMsg;
160
+ }, [ariaLabel, focusedOption, focusedValue, isMulti, isOptionDisabled, isSearchable, menuIsOpen, messages, selectValue, tabSelectsValue, isInitialFocus]);
161
+ var ScreenReaderText = (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)("span", {
162
+ id: "aria-selection"
163
+ }, ariaSelected), (0, _react2.jsx)("span", {
164
+ id: "aria-results"
165
+ }, ariaResults), !(0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') && (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)("span", {
166
+ id: "aria-focused"
167
+ }, ariaFocused), (0, _react2.jsx)("span", {
168
+ id: "aria-guidance"
169
+ }, ariaGuidance)));
170
+ return (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_a11yText.default, {
171
+ id: id
172
+ }, isInitialFocus && ScreenReaderText), (0, _react2.jsx)(_a11yText.default, {
173
+ "aria-live": ariaLive // Should be undefined by default unless a specific use case requires it
174
+ ,
175
+ "aria-atomic": (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? undefined : 'false',
176
+ "aria-relevant": (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? undefined : 'additions text',
177
+ role: (0, _platformFeatureFlags.fg)('design_system_select-a11y-improvement') ? 'status' : 'log'
178
+ }, isFocused && !isInitialFocus && ScreenReaderText));
179
+ };
180
+
181
+ // eslint-disable-next-line @repo/internal/react/require-jsdoc
182
+ var _default = exports.default = LiveRegion;