@atlaskit/react-select 0.0.2

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 (197) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/LICENSE.md +11 -0
  3. package/README.md +10 -0
  4. package/async/package.json +15 -0
  5. package/base/package.json +15 -0
  6. package/creatable/package.json +15 -0
  7. package/dist/cjs/accessibility/helpers.js +34 -0
  8. package/dist/cjs/accessibility/index.js +74 -0
  9. package/dist/cjs/async-creatable.js +27 -0
  10. package/dist/cjs/async.js +30 -0
  11. package/dist/cjs/builtins.js +18 -0
  12. package/dist/cjs/components/containers.js +100 -0
  13. package/dist/cjs/components/control.js +67 -0
  14. package/dist/cjs/components/group.js +79 -0
  15. package/dist/cjs/components/index.js +53 -0
  16. package/dist/cjs/components/indicators.js +214 -0
  17. package/dist/cjs/components/input.js +93 -0
  18. package/dist/cjs/components/internal/a11y-text.js +34 -0
  19. package/dist/cjs/components/internal/dummy-input.js +43 -0
  20. package/dist/cjs/components/internal/index.js +34 -0
  21. package/dist/cjs/components/internal/required-input.js +43 -0
  22. package/dist/cjs/components/internal/scroll-manager.js +57 -0
  23. package/dist/cjs/components/internal/use-scroll-capture.js +132 -0
  24. package/dist/cjs/components/internal/use-scroll-lock.js +149 -0
  25. package/dist/cjs/components/live-region.js +153 -0
  26. package/dist/cjs/components/menu.js +464 -0
  27. package/dist/cjs/components/multi-value.js +129 -0
  28. package/dist/cjs/components/option.js +62 -0
  29. package/dist/cjs/components/placeholder.js +39 -0
  30. package/dist/cjs/components/single-value.js +46 -0
  31. package/dist/cjs/creatable.js +30 -0
  32. package/dist/cjs/diacritics.js +274 -0
  33. package/dist/cjs/filters.js +50 -0
  34. package/dist/cjs/index.js +55 -0
  35. package/dist/cjs/nonce-provider.js +30 -0
  36. package/dist/cjs/select.js +1803 -0
  37. package/dist/cjs/state-manager.js +31 -0
  38. package/dist/cjs/styles.js +66 -0
  39. package/dist/cjs/theme.js +42 -0
  40. package/dist/cjs/types.js +5 -0
  41. package/dist/cjs/use-async.js +156 -0
  42. package/dist/cjs/use-creatable.js +114 -0
  43. package/dist/cjs/use-state-manager.js +83 -0
  44. package/dist/cjs/utils.js +357 -0
  45. package/dist/es2019/accessibility/helpers.js +24 -0
  46. package/dist/es2019/accessibility/index.js +72 -0
  47. package/dist/es2019/async-creatable.js +17 -0
  48. package/dist/es2019/async.js +16 -0
  49. package/dist/es2019/builtins.js +4 -0
  50. package/dist/es2019/components/containers.js +100 -0
  51. package/dist/es2019/components/control.js +62 -0
  52. package/dist/es2019/components/group.js +74 -0
  53. package/dist/es2019/components/index.js +41 -0
  54. package/dist/es2019/components/indicators.js +211 -0
  55. package/dist/es2019/components/input.js +88 -0
  56. package/dist/es2019/components/internal/a11y-text.js +25 -0
  57. package/dist/es2019/components/internal/dummy-input.js +36 -0
  58. package/dist/es2019/components/internal/index.js +4 -0
  59. package/dist/es2019/components/internal/required-input.js +35 -0
  60. package/dist/es2019/components/internal/scroll-manager.js +49 -0
  61. package/dist/es2019/components/internal/use-scroll-capture.js +128 -0
  62. package/dist/es2019/components/internal/use-scroll-lock.js +143 -0
  63. package/dist/es2019/components/live-region.js +151 -0
  64. package/dist/es2019/components/menu.js +466 -0
  65. package/dist/es2019/components/multi-value.js +134 -0
  66. package/dist/es2019/components/option.js +57 -0
  67. package/dist/es2019/components/placeholder.js +34 -0
  68. package/dist/es2019/components/single-value.js +41 -0
  69. package/dist/es2019/creatable.js +15 -0
  70. package/dist/es2019/diacritics.js +264 -0
  71. package/dist/es2019/filters.js +36 -0
  72. package/dist/es2019/index.js +8 -0
  73. package/dist/es2019/nonce-provider.js +19 -0
  74. package/dist/es2019/select.js +1766 -0
  75. package/dist/es2019/state-manager.js +22 -0
  76. package/dist/es2019/styles.js +56 -0
  77. package/dist/es2019/theme.js +36 -0
  78. package/dist/es2019/types.js +1 -0
  79. package/dist/es2019/use-async.js +117 -0
  80. package/dist/es2019/use-creatable.js +81 -0
  81. package/dist/es2019/use-state-manager.js +60 -0
  82. package/dist/es2019/utils.js +309 -0
  83. package/dist/esm/accessibility/helpers.js +24 -0
  84. package/dist/esm/accessibility/index.js +68 -0
  85. package/dist/esm/async-creatable.js +17 -0
  86. package/dist/esm/async.js +16 -0
  87. package/dist/esm/builtins.js +12 -0
  88. package/dist/esm/components/containers.js +96 -0
  89. package/dist/esm/components/control.js +62 -0
  90. package/dist/esm/components/group.js +74 -0
  91. package/dist/esm/components/index.js +43 -0
  92. package/dist/esm/components/indicators.js +209 -0
  93. package/dist/esm/components/input.js +88 -0
  94. package/dist/esm/components/internal/a11y-text.js +27 -0
  95. package/dist/esm/components/internal/dummy-input.js +37 -0
  96. package/dist/esm/components/internal/index.js +4 -0
  97. package/dist/esm/components/internal/required-input.js +36 -0
  98. package/dist/esm/components/internal/scroll-manager.js +49 -0
  99. package/dist/esm/components/internal/use-scroll-capture.js +126 -0
  100. package/dist/esm/components/internal/use-scroll-lock.js +143 -0
  101. package/dist/esm/components/live-region.js +148 -0
  102. package/dist/esm/components/menu.js +460 -0
  103. package/dist/esm/components/multi-value.js +122 -0
  104. package/dist/esm/components/option.js +57 -0
  105. package/dist/esm/components/placeholder.js +34 -0
  106. package/dist/esm/components/single-value.js +41 -0
  107. package/dist/esm/creatable.js +15 -0
  108. package/dist/esm/diacritics.js +268 -0
  109. package/dist/esm/filters.js +43 -0
  110. package/dist/esm/index.js +8 -0
  111. package/dist/esm/nonce-provider.js +20 -0
  112. package/dist/esm/select.js +1794 -0
  113. package/dist/esm/state-manager.js +22 -0
  114. package/dist/esm/styles.js +58 -0
  115. package/dist/esm/theme.js +36 -0
  116. package/dist/esm/types.js +1 -0
  117. package/dist/esm/use-async.js +149 -0
  118. package/dist/esm/use-creatable.js +107 -0
  119. package/dist/esm/use-state-manager.js +76 -0
  120. package/dist/esm/utils.js +328 -0
  121. package/dist/types/accessibility/helpers.d.ts +5 -0
  122. package/dist/types/accessibility/index.d.ts +125 -0
  123. package/dist/types/async-creatable.d.ts +10 -0
  124. package/dist/types/async.d.ts +9 -0
  125. package/dist/types/builtins.d.ts +5 -0
  126. package/dist/types/components/containers.d.ts +50 -0
  127. package/dist/types/components/control.d.ts +33 -0
  128. package/dist/types/components/group.d.ts +53 -0
  129. package/dist/types/components/index.d.ts +73 -0
  130. package/dist/types/components/indicators.d.ts +72 -0
  131. package/dist/types/components/input.d.ts +33 -0
  132. package/dist/types/components/internal/a11y-text.d.ts +8 -0
  133. package/dist/types/components/internal/dummy-input.d.ts +9 -0
  134. package/dist/types/components/internal/index.d.ts +4 -0
  135. package/dist/types/components/internal/required-input.d.ts +10 -0
  136. package/dist/types/components/internal/scroll-manager.d.ts +17 -0
  137. package/dist/types/components/internal/use-scroll-capture.d.ts +12 -0
  138. package/dist/types/components/internal/use-scroll-lock.d.ts +9 -0
  139. package/dist/types/components/live-region.d.ts +24 -0
  140. package/dist/types/components/menu.d.ts +130 -0
  141. package/dist/types/components/multi-value.d.ts +47 -0
  142. package/dist/types/components/option.d.ts +49 -0
  143. package/dist/types/components/placeholder.d.ts +22 -0
  144. package/dist/types/components/single-value.d.ts +28 -0
  145. package/dist/types/creatable.d.ts +10 -0
  146. package/dist/types/diacritics.d.ts +1 -0
  147. package/dist/types/filters.d.ts +15 -0
  148. package/dist/types/index.d.ts +28 -0
  149. package/dist/types/nonce-provider.d.ts +8 -0
  150. package/dist/types/select.d.ts +616 -0
  151. package/dist/types/state-manager.d.ts +17 -0
  152. package/dist/types/styles.d.ts +68 -0
  153. package/dist/types/theme.d.ts +27 -0
  154. package/dist/types/types.d.ts +134 -0
  155. package/dist/types/use-async.d.ts +31 -0
  156. package/dist/types/use-creatable.d.ts +46 -0
  157. package/dist/types/use-state-manager.d.ts +15 -0
  158. package/dist/types/utils.d.ts +44 -0
  159. package/dist/types-ts4.5/accessibility/helpers.d.ts +5 -0
  160. package/dist/types-ts4.5/accessibility/index.d.ts +125 -0
  161. package/dist/types-ts4.5/async-creatable.d.ts +10 -0
  162. package/dist/types-ts4.5/async.d.ts +9 -0
  163. package/dist/types-ts4.5/builtins.d.ts +5 -0
  164. package/dist/types-ts4.5/components/containers.d.ts +50 -0
  165. package/dist/types-ts4.5/components/control.d.ts +33 -0
  166. package/dist/types-ts4.5/components/group.d.ts +53 -0
  167. package/dist/types-ts4.5/components/index.d.ts +73 -0
  168. package/dist/types-ts4.5/components/indicators.d.ts +72 -0
  169. package/dist/types-ts4.5/components/input.d.ts +33 -0
  170. package/dist/types-ts4.5/components/internal/a11y-text.d.ts +8 -0
  171. package/dist/types-ts4.5/components/internal/dummy-input.d.ts +9 -0
  172. package/dist/types-ts4.5/components/internal/index.d.ts +4 -0
  173. package/dist/types-ts4.5/components/internal/required-input.d.ts +10 -0
  174. package/dist/types-ts4.5/components/internal/scroll-manager.d.ts +17 -0
  175. package/dist/types-ts4.5/components/internal/use-scroll-capture.d.ts +12 -0
  176. package/dist/types-ts4.5/components/internal/use-scroll-lock.d.ts +9 -0
  177. package/dist/types-ts4.5/components/live-region.d.ts +24 -0
  178. package/dist/types-ts4.5/components/menu.d.ts +130 -0
  179. package/dist/types-ts4.5/components/multi-value.d.ts +47 -0
  180. package/dist/types-ts4.5/components/option.d.ts +49 -0
  181. package/dist/types-ts4.5/components/placeholder.d.ts +22 -0
  182. package/dist/types-ts4.5/components/single-value.d.ts +28 -0
  183. package/dist/types-ts4.5/creatable.d.ts +10 -0
  184. package/dist/types-ts4.5/diacritics.d.ts +1 -0
  185. package/dist/types-ts4.5/filters.d.ts +15 -0
  186. package/dist/types-ts4.5/index.d.ts +28 -0
  187. package/dist/types-ts4.5/nonce-provider.d.ts +8 -0
  188. package/dist/types-ts4.5/select.d.ts +616 -0
  189. package/dist/types-ts4.5/state-manager.d.ts +17 -0
  190. package/dist/types-ts4.5/styles.d.ts +68 -0
  191. package/dist/types-ts4.5/theme.d.ts +27 -0
  192. package/dist/types-ts4.5/types.d.ts +134 -0
  193. package/dist/types-ts4.5/use-async.d.ts +31 -0
  194. package/dist/types-ts4.5/use-creatable.d.ts +46 -0
  195. package/dist/types-ts4.5/use-state-manager.d.ts +15 -0
  196. package/dist/types-ts4.5/utils.d.ts +44 -0
  197. package/package.json +83 -0
@@ -0,0 +1,88 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
+ import _defineProperty from "@babel/runtime/helpers/defineProperty";
4
+ var _excluded = ["innerRef", "isDisabled", "isHidden", "inputClassName"];
5
+ 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; }
6
+ 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; }
7
+ /**
8
+ * @jsxRuntime classic
9
+ * @jsx jsx
10
+ */
11
+
12
+ import { jsx } from '@emotion/react';
13
+ import { cleanCommonProps, getStyleProps } from '../utils';
14
+ export var inputCSS = function inputCSS(_ref, unstyled) {
15
+ var isDisabled = _ref.isDisabled,
16
+ value = _ref.value,
17
+ _ref$theme = _ref.theme,
18
+ spacing = _ref$theme.spacing,
19
+ colors = _ref$theme.colors;
20
+ return _objectSpread(_objectSpread({
21
+ visibility: isDisabled ? 'hidden' : 'visible',
22
+ // force css to recompute when value change due to @emotion bug.
23
+ // We can remove it whenever the bug is fixed.
24
+ transform: value ? 'translateZ(0)' : ''
25
+ }, containerStyle), unstyled ? {} : {
26
+ margin: spacing.baseUnit / 2,
27
+ paddingBottom: spacing.baseUnit / 2,
28
+ paddingTop: spacing.baseUnit / 2,
29
+ color: colors.neutral80
30
+ });
31
+ };
32
+ var spacingStyle = {
33
+ gridArea: '1 / 2',
34
+ font: 'inherit',
35
+ minWidth: '2px',
36
+ border: 0,
37
+ margin: 0,
38
+ outline: 0,
39
+ padding: 0
40
+ };
41
+ var containerStyle = {
42
+ flex: '1 1 auto',
43
+ display: 'inline-grid',
44
+ gridArea: '1 / 1 / 2 / 3',
45
+ gridTemplateColumns: '0 min-content',
46
+ '&:after': _objectSpread({
47
+ content: 'attr(data-value) " "',
48
+ visibility: 'hidden',
49
+ whiteSpace: 'pre'
50
+ }, spacingStyle)
51
+ };
52
+ var inputStyle = function inputStyle(isHidden) {
53
+ return _objectSpread({
54
+ label: 'input',
55
+ color: 'inherit',
56
+ background: 0,
57
+ opacity: isHidden ? 0 : 1,
58
+ width: '100%'
59
+ }, spacingStyle);
60
+ };
61
+ var Input = function Input(props) {
62
+ var cx = props.cx,
63
+ value = props.value;
64
+ var _cleanCommonProps = cleanCommonProps(props),
65
+ innerRef = _cleanCommonProps.innerRef,
66
+ isDisabled = _cleanCommonProps.isDisabled,
67
+ isHidden = _cleanCommonProps.isHidden,
68
+ inputClassName = _cleanCommonProps.inputClassName,
69
+ innerProps = _objectWithoutProperties(_cleanCommonProps, _excluded);
70
+ return jsx("div", _extends({}, getStyleProps(props, 'input', {
71
+ 'input-container': true
72
+ }), {
73
+ "data-value": value || ''
74
+ }), jsx("input", _extends({
75
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
76
+ className: cx({
77
+ input: true
78
+ }, inputClassName),
79
+ ref: innerRef
80
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
81
+ ,
82
+ style: inputStyle(isHidden),
83
+ disabled: isDisabled
84
+ }, innerProps)));
85
+ };
86
+
87
+ // eslint-disable-next-line @repo/internal/react/require-jsdoc
88
+ export default Input;
@@ -0,0 +1,27 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ /**
3
+ * @jsxRuntime classic
4
+ * @jsx jsx
5
+ */
6
+ import { css, jsx } from '@emotion/react';
7
+
8
+ // Assistive text to describe visual elements. Hidden for sighted users.
9
+ var styles = css({
10
+ width: 1,
11
+ height: 1,
12
+ padding: 0,
13
+ position: 'absolute',
14
+ zIndex: 9999,
15
+ border: 0,
16
+ clip: 'rect(1px, 1px, 1px, 1px)',
17
+ label: 'a11yText',
18
+ overflow: 'hidden',
19
+ whiteSpace: 'nowrap'
20
+ });
21
+ var A11yText = function A11yText(props) {
22
+ return jsx("span", _extends({
23
+ css: styles
24
+ // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
25
+ }, props));
26
+ };
27
+ export default A11yText;
@@ -0,0 +1,37 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
+ var _excluded = ["innerRef"];
4
+ /**
5
+ * @jsxRuntime classic
6
+ * @jsx jsx
7
+ */
8
+
9
+ import { css, jsx } from '@emotion/react';
10
+ import { removeProps } from '../../utils';
11
+ var dummyInputStyles = css({
12
+ width: 1,
13
+ padding: 0,
14
+ position: 'relative',
15
+ background: 0,
16
+ border: 0,
17
+ caretColor: 'transparent',
18
+ color: 'transparent',
19
+ fontSize: 'inherit',
20
+ gridArea: '1 / 1 / 2 / 3',
21
+ insetInlineStart: -100,
22
+ label: 'dummyInput',
23
+ opacity: 0,
24
+ outline: 0,
25
+ transform: 'scale(.01)'
26
+ });
27
+ export default function DummyInput(_ref) {
28
+ var innerRef = _ref.innerRef,
29
+ props = _objectWithoutProperties(_ref, _excluded);
30
+ // Remove animation props not meant for HTML elements
31
+ var filteredProps = removeProps(props, 'onExited', 'in', 'enter', 'exit', 'appear');
32
+ return jsx("input", _extends({
33
+ ref: innerRef
34
+ }, filteredProps, {
35
+ css: dummyInputStyles
36
+ }));
37
+ }
@@ -0,0 +1,4 @@
1
+ export { default as A11yText } from './a11y-text';
2
+ export { default as DummyInput } from './dummy-input';
3
+ export { default as ScrollManager } from './scroll-manager';
4
+ export { default as RequiredInput } from './required-input';
@@ -0,0 +1,36 @@
1
+ /**
2
+ * @jsxRuntime classic
3
+ * @jsx jsx
4
+ */
5
+
6
+ import { css, jsx } from '@emotion/react';
7
+ import __noop from '@atlaskit/ds-lib/noop';
8
+ var styles = css({
9
+ width: '100%',
10
+ position: 'absolute',
11
+ insetBlockEnd: 0,
12
+ insetInlineEnd: 0,
13
+ insetInlineStart: 0,
14
+ label: 'requiredInput',
15
+ opacity: 0,
16
+ pointerEvents: 'none'
17
+ });
18
+ var RequiredInput = function RequiredInput(_ref) {
19
+ var name = _ref.name,
20
+ onFocus = _ref.onFocus;
21
+ return jsx("input", {
22
+ required: true,
23
+ name: name,
24
+ tabIndex: -1,
25
+ "aria-hidden": "true",
26
+ onFocus: onFocus,
27
+ css: styles
28
+ // Prevent `Switching from uncontrolled to controlled` error
29
+ ,
30
+ value: "",
31
+ onChange: __noop
32
+ });
33
+ };
34
+
35
+ // eslint-disable-next-line @repo/internal/react/require-jsdoc
36
+ export default RequiredInput;
@@ -0,0 +1,49 @@
1
+ /**
2
+ * @jsxRuntime classic
3
+ * @jsx jsx
4
+ */
5
+ import { Fragment } from 'react';
6
+ import { css, jsx } from '@emotion/react';
7
+ import useScrollCapture from './use-scroll-capture';
8
+ import useScrollLock from './use-scroll-lock';
9
+ var styles = css({
10
+ position: 'fixed',
11
+ insetBlockEnd: 0,
12
+ insetBlockStart: 0,
13
+ insetInlineEnd: 0,
14
+ insetInlineStart: 0
15
+ });
16
+ var blurSelectInput = function blurSelectInput(event) {
17
+ var element = event.target;
18
+ return element.ownerDocument.activeElement && element.ownerDocument.activeElement.blur();
19
+ };
20
+ export default function ScrollManager(_ref) {
21
+ var children = _ref.children,
22
+ lockEnabled = _ref.lockEnabled,
23
+ _ref$captureEnabled = _ref.captureEnabled,
24
+ captureEnabled = _ref$captureEnabled === void 0 ? true : _ref$captureEnabled,
25
+ onBottomArrive = _ref.onBottomArrive,
26
+ onBottomLeave = _ref.onBottomLeave,
27
+ onTopArrive = _ref.onTopArrive,
28
+ onTopLeave = _ref.onTopLeave;
29
+ var setScrollCaptureTarget = useScrollCapture({
30
+ isEnabled: captureEnabled,
31
+ onBottomArrive: onBottomArrive,
32
+ onBottomLeave: onBottomLeave,
33
+ onTopArrive: onTopArrive,
34
+ onTopLeave: onTopLeave
35
+ });
36
+ var setScrollLockTarget = useScrollLock({
37
+ isEnabled: lockEnabled
38
+ });
39
+ var targetRef = function targetRef(element) {
40
+ setScrollCaptureTarget(element);
41
+ setScrollLockTarget(element);
42
+ };
43
+ return jsx(Fragment, null, lockEnabled &&
44
+ // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
45
+ jsx("div", {
46
+ onClick: blurSelectInput,
47
+ css: styles
48
+ }), children(targetRef));
49
+ }
@@ -0,0 +1,126 @@
1
+ import { useCallback, useEffect, useRef } from 'react';
2
+ import { supportsPassiveEvents } from '../../utils';
3
+ var cancelScroll = function cancelScroll(event) {
4
+ if (event.cancelable) {
5
+ event.preventDefault();
6
+ }
7
+ event.stopPropagation();
8
+ };
9
+ // TODO: Fill in the hook {description}.
10
+ /**
11
+ * {description}.
12
+ */
13
+ export default function useScrollCapture(_ref) {
14
+ var isEnabled = _ref.isEnabled,
15
+ onBottomArrive = _ref.onBottomArrive,
16
+ onBottomLeave = _ref.onBottomLeave,
17
+ onTopArrive = _ref.onTopArrive,
18
+ onTopLeave = _ref.onTopLeave;
19
+ var isBottom = useRef(false);
20
+ var isTop = useRef(false);
21
+ var touchStart = useRef(0);
22
+ var scrollTarget = useRef(null);
23
+ var handleEventDelta = useCallback(function (event, delta) {
24
+ if (scrollTarget.current === null) {
25
+ return;
26
+ }
27
+ var _scrollTarget$current = scrollTarget.current,
28
+ scrollTop = _scrollTarget$current.scrollTop,
29
+ scrollHeight = _scrollTarget$current.scrollHeight,
30
+ clientHeight = _scrollTarget$current.clientHeight;
31
+ var target = scrollTarget.current;
32
+ var isDeltaPositive = delta > 0;
33
+ var availableScroll = scrollHeight - clientHeight - scrollTop;
34
+ var shouldCancelScroll = false;
35
+
36
+ // reset bottom/top flags
37
+ if (availableScroll > delta && isBottom.current) {
38
+ if (onBottomLeave) {
39
+ onBottomLeave(event);
40
+ }
41
+ isBottom.current = false;
42
+ }
43
+ if (isDeltaPositive && isTop.current) {
44
+ if (onTopLeave) {
45
+ onTopLeave(event);
46
+ }
47
+ isTop.current = false;
48
+ }
49
+
50
+ // bottom limit
51
+ if (isDeltaPositive && delta > availableScroll) {
52
+ if (onBottomArrive && !isBottom.current) {
53
+ onBottomArrive(event);
54
+ }
55
+ target.scrollTop = scrollHeight;
56
+ shouldCancelScroll = true;
57
+ isBottom.current = true;
58
+
59
+ // top limit
60
+ } else if (!isDeltaPositive && -delta > scrollTop) {
61
+ if (onTopArrive && !isTop.current) {
62
+ onTopArrive(event);
63
+ }
64
+ target.scrollTop = 0;
65
+ shouldCancelScroll = true;
66
+ isTop.current = true;
67
+ }
68
+
69
+ // cancel scroll
70
+ if (shouldCancelScroll) {
71
+ cancelScroll(event);
72
+ }
73
+ }, [onBottomArrive, onBottomLeave, onTopArrive, onTopLeave]);
74
+ var onWheel = useCallback(function (event) {
75
+ handleEventDelta(event, event.deltaY);
76
+ }, [handleEventDelta]);
77
+ var onTouchStart = useCallback(function (event) {
78
+ // set touch start so we can calculate touchmove delta
79
+ touchStart.current = event.changedTouches[0].clientY;
80
+ }, []);
81
+ var onTouchMove = useCallback(function (event) {
82
+ var deltaY = touchStart.current - event.changedTouches[0].clientY;
83
+ handleEventDelta(event, deltaY);
84
+ }, [handleEventDelta]);
85
+ var startListening = useCallback(function (el) {
86
+ // bail early if no element is available to attach to
87
+ if (!el) {
88
+ return;
89
+ }
90
+ var notPassive = supportsPassiveEvents ? {
91
+ passive: false
92
+ } : false;
93
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
94
+ el.addEventListener('wheel', onWheel, notPassive);
95
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
96
+ el.addEventListener('touchstart', onTouchStart, notPassive);
97
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
98
+ el.addEventListener('touchmove', onTouchMove, notPassive);
99
+ }, [onTouchMove, onTouchStart, onWheel]);
100
+ var stopListening = useCallback(function (el) {
101
+ // bail early if no element is available to detach from
102
+ if (!el) {
103
+ return;
104
+ }
105
+
106
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
107
+ el.removeEventListener('wheel', onWheel, false);
108
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
109
+ el.removeEventListener('touchstart', onTouchStart, false);
110
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
111
+ el.removeEventListener('touchmove', onTouchMove, false);
112
+ }, [onTouchMove, onTouchStart, onWheel]);
113
+ useEffect(function () {
114
+ if (!isEnabled) {
115
+ return;
116
+ }
117
+ var element = scrollTarget.current;
118
+ startListening(element);
119
+ return function () {
120
+ stopListening(element);
121
+ };
122
+ }, [isEnabled, startListening, stopListening]);
123
+ return function (element) {
124
+ scrollTarget.current = element;
125
+ };
126
+ }
@@ -0,0 +1,143 @@
1
+ import { useCallback, useEffect, useRef } from 'react';
2
+ var STYLE_KEYS = ['boxSizing', 'height', 'overflow', 'paddingRight', 'position'];
3
+ var LOCK_STYLES = {
4
+ boxSizing: 'border-box',
5
+ // account for possible declaration `width: 100%;` on body
6
+ overflow: 'hidden',
7
+ position: 'relative',
8
+ height: '100%'
9
+ };
10
+ function preventTouchMove(e) {
11
+ e.preventDefault();
12
+ }
13
+ function allowTouchMove(e) {
14
+ e.stopPropagation();
15
+ }
16
+ function preventInertiaScroll() {
17
+ var top = this.scrollTop;
18
+ var totalScroll = this.scrollHeight;
19
+ var currentScroll = top + this.offsetHeight;
20
+ if (top === 0) {
21
+ this.scrollTop = 1;
22
+ } else if (currentScroll === totalScroll) {
23
+ this.scrollTop = top - 1;
24
+ }
25
+ }
26
+
27
+ // `ontouchstart` check works on most browsers
28
+ // `maxTouchPoints` works on IE10/11 and Surface
29
+ function isTouchDevice() {
30
+ // eslint-disable-next-line compat/compat
31
+ return 'ontouchstart' in window || navigator.maxTouchPoints;
32
+ }
33
+ var canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
34
+ var activeScrollLocks = 0;
35
+ var listenerOptions = {
36
+ capture: false,
37
+ passive: false
38
+ };
39
+
40
+ // TODO: Fill in the hook {description}.
41
+ /**
42
+ * {description}.
43
+ */
44
+ export default function useScrollLock(_ref) {
45
+ var isEnabled = _ref.isEnabled,
46
+ _ref$accountForScroll = _ref.accountForScrollbars,
47
+ accountForScrollbars = _ref$accountForScroll === void 0 ? true : _ref$accountForScroll;
48
+ var originalStyles = useRef({});
49
+ var scrollTarget = useRef(null);
50
+ var addScrollLock = useCallback(function (touchScrollTarget) {
51
+ if (!canUseDOM) {
52
+ return;
53
+ }
54
+ var target = document.body;
55
+ var targetStyle = target && target.style;
56
+ if (accountForScrollbars) {
57
+ // store any styles already applied to the body
58
+ STYLE_KEYS.forEach(function (key) {
59
+ var val = targetStyle && targetStyle[key];
60
+ originalStyles.current[key] = val;
61
+ });
62
+ }
63
+
64
+ // apply the lock styles and padding if this is the first scroll lock
65
+ if (accountForScrollbars && activeScrollLocks < 1) {
66
+ var currentPadding = parseInt(originalStyles.current.paddingRight, 10) || 0;
67
+ var clientWidth = document.body ? document.body.clientWidth : 0;
68
+ var adjustedPadding = window.innerWidth - clientWidth + currentPadding || 0;
69
+ Object.keys(LOCK_STYLES).forEach(function (key) {
70
+ var val = LOCK_STYLES[key];
71
+ if (targetStyle) {
72
+ targetStyle[key] = val;
73
+ }
74
+ });
75
+ if (targetStyle) {
76
+ targetStyle.paddingRight = "".concat(adjustedPadding, "px");
77
+ }
78
+ }
79
+
80
+ // account for touch devices
81
+ if (target && isTouchDevice()) {
82
+ // Mobile Safari ignores { overflow: hidden } declaration on the body.
83
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
84
+ target.addEventListener('touchmove', preventTouchMove, listenerOptions);
85
+
86
+ // Allow scroll on provided target
87
+ if (touchScrollTarget) {
88
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
89
+ touchScrollTarget.addEventListener('touchstart', preventInertiaScroll, listenerOptions);
90
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
91
+ touchScrollTarget.addEventListener('touchmove', allowTouchMove, listenerOptions);
92
+ }
93
+ }
94
+
95
+ // increment active scroll locks
96
+ activeScrollLocks += 1;
97
+ }, [accountForScrollbars]);
98
+ var removeScrollLock = useCallback(function (touchScrollTarget) {
99
+ if (!canUseDOM) {
100
+ return;
101
+ }
102
+ var target = document.body;
103
+ var targetStyle = target && target.style;
104
+
105
+ // safely decrement active scroll locks
106
+ activeScrollLocks = Math.max(activeScrollLocks - 1, 0);
107
+
108
+ // reapply original body styles, if any
109
+ if (accountForScrollbars && activeScrollLocks < 1) {
110
+ STYLE_KEYS.forEach(function (key) {
111
+ var val = originalStyles.current[key];
112
+ if (targetStyle) {
113
+ targetStyle[key] = val;
114
+ }
115
+ });
116
+ }
117
+
118
+ // remove touch listeners
119
+ if (target && isTouchDevice()) {
120
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
121
+ target.removeEventListener('touchmove', preventTouchMove, listenerOptions);
122
+ if (touchScrollTarget) {
123
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
124
+ touchScrollTarget.removeEventListener('touchstart', preventInertiaScroll, listenerOptions);
125
+ // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
126
+ touchScrollTarget.removeEventListener('touchmove', allowTouchMove, listenerOptions);
127
+ }
128
+ }
129
+ }, [accountForScrollbars]);
130
+ useEffect(function () {
131
+ if (!isEnabled) {
132
+ return;
133
+ }
134
+ var element = scrollTarget.current;
135
+ addScrollLock(element);
136
+ return function () {
137
+ removeScrollLock(element);
138
+ };
139
+ }, [isEnabled, addScrollLock, removeScrollLock]);
140
+ return function (element) {
141
+ scrollTarget.current = element;
142
+ };
143
+ }
@@ -0,0 +1,148 @@
1
+ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
+ 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; }
3
+ 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; }
4
+ /**
5
+ * @jsxRuntime classic
6
+ * @jsx jsx
7
+ */
8
+ import { Fragment, useMemo } from 'react';
9
+ import { jsx } from '@emotion/react';
10
+ import { defaultAriaLiveMessages } from '../accessibility';
11
+ import A11yText from './internal/a11y-text';
12
+
13
+ // ==============================
14
+ // Root Container
15
+ // ==============================
16
+
17
+ // eslint-disable-next-line @repo/internal/react/require-jsdoc
18
+ var LiveRegion = function LiveRegion(props) {
19
+ var ariaSelection = props.ariaSelection,
20
+ focusedOption = props.focusedOption,
21
+ focusedValue = props.focusedValue,
22
+ focusableOptions = props.focusableOptions,
23
+ isFocused = props.isFocused,
24
+ selectValue = props.selectValue,
25
+ selectProps = props.selectProps,
26
+ id = props.id,
27
+ isAppleDevice = props.isAppleDevice;
28
+ var ariaLiveMessages = selectProps.ariaLiveMessages,
29
+ getOptionLabel = selectProps.getOptionLabel,
30
+ inputValue = selectProps.inputValue,
31
+ isMulti = selectProps.isMulti,
32
+ isOptionDisabled = selectProps.isOptionDisabled,
33
+ isSearchable = selectProps.isSearchable,
34
+ menuIsOpen = selectProps.menuIsOpen,
35
+ options = selectProps.options,
36
+ screenReaderStatus = selectProps.screenReaderStatus,
37
+ tabSelectsValue = selectProps.tabSelectsValue,
38
+ isLoading = selectProps.isLoading;
39
+ var ariaLabel = selectProps['aria-label'];
40
+ var ariaLive = selectProps['aria-live'];
41
+
42
+ // Update aria live message configuration when prop changes
43
+ var messages = useMemo(function () {
44
+ return _objectSpread(_objectSpread({}, defaultAriaLiveMessages), ariaLiveMessages || {});
45
+ }, [ariaLiveMessages]);
46
+
47
+ // Update aria live selected option when prop changes
48
+ var ariaSelected = useMemo(function () {
49
+ var message = '';
50
+ if (ariaSelection && messages.onChange) {
51
+ var option = ariaSelection.option,
52
+ selectedOptions = ariaSelection.options,
53
+ removedValue = ariaSelection.removedValue,
54
+ removedValues = ariaSelection.removedValues,
55
+ value = ariaSelection.value;
56
+ // select-option when !isMulti does not return option so we assume selected option is value
57
+ var asOption = function asOption(val) {
58
+ return !Array.isArray(val) ? val : null;
59
+ };
60
+
61
+ // If there is just one item from the action then get its label
62
+ var selected = removedValue || option || asOption(value);
63
+ var label = selected ? getOptionLabel(selected) : '';
64
+
65
+ // If there are multiple items from the action then return an array of labels
66
+ var multiSelected = selectedOptions || removedValues || undefined;
67
+ var labels = multiSelected ? multiSelected.map(getOptionLabel) : [];
68
+ var onChangeProps = _objectSpread({
69
+ // multiSelected items are usually items that have already been selected
70
+ // or set by the user as a default value so we assume they are not disabled
71
+ isDisabled: selected && isOptionDisabled(selected, selectValue),
72
+ label: label,
73
+ labels: labels
74
+ }, ariaSelection);
75
+ message = messages.onChange(onChangeProps);
76
+ }
77
+ return message;
78
+ }, [ariaSelection, messages, isOptionDisabled, selectValue, getOptionLabel]);
79
+ var ariaFocused = useMemo(function () {
80
+ var focusMsg = '';
81
+ var focused = focusedOption || focusedValue;
82
+ var isSelected = !!(focusedOption && selectValue && selectValue.includes(focusedOption));
83
+ if (focused && messages.onFocus) {
84
+ var onFocusProps = {
85
+ focused: focused,
86
+ label: getOptionLabel(focused),
87
+ isDisabled: isOptionDisabled(focused, selectValue),
88
+ isSelected: isSelected,
89
+ options: focusableOptions,
90
+ context: focused === focusedOption ? 'menu' : 'value',
91
+ selectValue: selectValue,
92
+ isAppleDevice: isAppleDevice
93
+ };
94
+ focusMsg = messages.onFocus(onFocusProps);
95
+ }
96
+ return focusMsg;
97
+ }, [focusedOption, focusedValue, getOptionLabel, isOptionDisabled, messages, focusableOptions, selectValue, isAppleDevice]);
98
+ var ariaResults = useMemo(function () {
99
+ var resultsMsg = '';
100
+ if (menuIsOpen && options.length && !isLoading && messages.onFilter) {
101
+ var resultsMessage = screenReaderStatus({
102
+ count: focusableOptions.length
103
+ });
104
+ resultsMsg = messages.onFilter({
105
+ inputValue: inputValue,
106
+ resultsMessage: resultsMessage
107
+ });
108
+ }
109
+ return resultsMsg;
110
+ }, [focusableOptions, inputValue, menuIsOpen, messages, options, screenReaderStatus, isLoading]);
111
+ var isInitialFocus = (ariaSelection === null || ariaSelection === void 0 ? void 0 : ariaSelection.action) === 'initial-input-focus';
112
+ var ariaGuidance = useMemo(function () {
113
+ var guidanceMsg = '';
114
+ if (messages.guidance) {
115
+ var context = focusedValue ? 'value' : menuIsOpen ? 'menu' : 'input';
116
+ guidanceMsg = messages.guidance({
117
+ 'aria-label': ariaLabel,
118
+ context: context,
119
+ isDisabled: focusedOption && isOptionDisabled(focusedOption, selectValue),
120
+ isMulti: isMulti,
121
+ isSearchable: isSearchable,
122
+ tabSelectsValue: tabSelectsValue,
123
+ isInitialFocus: isInitialFocus
124
+ });
125
+ }
126
+ return guidanceMsg;
127
+ }, [ariaLabel, focusedOption, focusedValue, isMulti, isOptionDisabled, isSearchable, menuIsOpen, messages, selectValue, tabSelectsValue, isInitialFocus]);
128
+ var ScreenReaderText = jsx(Fragment, null, jsx("span", {
129
+ id: "aria-selection"
130
+ }, ariaSelected), jsx("span", {
131
+ id: "aria-focused"
132
+ }, ariaFocused), jsx("span", {
133
+ id: "aria-results"
134
+ }, ariaResults), jsx("span", {
135
+ id: "aria-guidance"
136
+ }, ariaGuidance));
137
+ return jsx(Fragment, null, jsx(A11yText, {
138
+ id: id
139
+ }, isInitialFocus && ScreenReaderText), jsx(A11yText, {
140
+ "aria-live": ariaLive,
141
+ "aria-atomic": "false",
142
+ "aria-relevant": "additions text",
143
+ role: "log"
144
+ }, isFocused && !isInitialFocus && ScreenReaderText));
145
+ };
146
+
147
+ // eslint-disable-next-line @repo/internal/react/require-jsdoc
148
+ export default LiveRegion;