@mui/material 5.16.1 → 5.16.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 (252) hide show
  1. package/Autocomplete/Autocomplete.d.ts +6 -7
  2. package/Autocomplete/Autocomplete.js +1 -1
  3. package/Badge/Badge.d.ts +1 -1
  4. package/Badge/Badge.js +2 -2
  5. package/Badge/useBadge.d.ts +13 -0
  6. package/Badge/useBadge.js +41 -0
  7. package/Badge/useBadge.types.d.ts +40 -0
  8. package/Badge/useBadge.types.js +1 -0
  9. package/Breadcrumbs/Breadcrumbs.d.ts +1 -1
  10. package/Breadcrumbs/Breadcrumbs.js +1 -1
  11. package/CHANGELOG.md +18 -0
  12. package/ClickAwayListener/ClickAwayListener.d.ts +47 -0
  13. package/ClickAwayListener/ClickAwayListener.js +178 -0
  14. package/ClickAwayListener/index.d.ts +2 -2
  15. package/ClickAwayListener/index.js +1 -1
  16. package/InputBase/InputBase.js +2 -2
  17. package/ListItem/ListItem.js +1 -1
  18. package/Menu/Menu.js +1 -1
  19. package/Modal/Modal.d.ts +1 -1
  20. package/Modal/Modal.js +2 -2
  21. package/Modal/ModalManager.d.ts +25 -0
  22. package/Modal/ModalManager.js +213 -0
  23. package/Modal/index.d.ts +1 -1
  24. package/Modal/index.js +1 -1
  25. package/Modal/useModal.d.ts +13 -0
  26. package/Modal/useModal.js +195 -0
  27. package/Modal/useModal.types.d.ts +115 -0
  28. package/Modal/useModal.types.js +1 -0
  29. package/NoSsr/NoSsr.d.ts +25 -0
  30. package/NoSsr/NoSsr.js +73 -0
  31. package/NoSsr/NoSsr.types.d.ts +18 -0
  32. package/NoSsr/NoSsr.types.js +1 -0
  33. package/NoSsr/index.d.ts +3 -2
  34. package/NoSsr/index.js +1 -1
  35. package/Popover/Popover.js +2 -1
  36. package/Popper/BasePopper.d.ts +7 -0
  37. package/Popper/BasePopper.js +372 -0
  38. package/Popper/BasePopper.types.d.ts +130 -0
  39. package/Popper/BasePopper.types.js +1 -0
  40. package/Popper/Popper.d.ts +1 -1
  41. package/Popper/Popper.js +1 -1
  42. package/Popper/index.d.ts +2 -1
  43. package/Popper/index.js +2 -1
  44. package/Popper/popperClasses.d.ts +8 -0
  45. package/Popper/popperClasses.js +7 -0
  46. package/Portal/Portal.d.ts +16 -0
  47. package/Portal/Portal.js +92 -0
  48. package/Portal/Portal.types.d.ts +23 -0
  49. package/Portal/Portal.types.js +1 -0
  50. package/Portal/index.d.ts +3 -2
  51. package/Portal/index.js +1 -1
  52. package/Slider/Slider.d.ts +2 -2
  53. package/Slider/Slider.js +3 -2
  54. package/Slider/useSlider.d.ts +14 -0
  55. package/Slider/useSlider.js +655 -0
  56. package/Slider/useSlider.types.d.ts +228 -0
  57. package/Slider/useSlider.types.js +1 -0
  58. package/Snackbar/Snackbar.d.ts +1 -1
  59. package/Snackbar/Snackbar.js +4 -5
  60. package/Snackbar/useSnackbar.d.ts +14 -0
  61. package/Snackbar/useSnackbar.js +131 -0
  62. package/Snackbar/useSnackbar.types.d.ts +60 -0
  63. package/Snackbar/useSnackbar.types.js +1 -0
  64. package/SwipeableDrawer/SwipeableDrawer.js +1 -1
  65. package/TabScrollButton/TabScrollButton.d.ts +1 -1
  66. package/TabScrollButton/TabScrollButton.js +1 -1
  67. package/TablePagination/TablePagination.js +1 -1
  68. package/Tabs/Tabs.d.ts +1 -1
  69. package/Tabs/Tabs.js +1 -1
  70. package/TextareaAutosize/TextareaAutosize.d.ts +14 -0
  71. package/TextareaAutosize/TextareaAutosize.js +223 -0
  72. package/TextareaAutosize/TextareaAutosize.types.d.ts +13 -0
  73. package/TextareaAutosize/TextareaAutosize.types.js +1 -0
  74. package/TextareaAutosize/index.d.ts +3 -2
  75. package/TextareaAutosize/index.js +1 -1
  76. package/Tooltip/Tooltip.js +2 -3
  77. package/Unstable_TrapFocus/FocusTrap.d.ts +10 -0
  78. package/Unstable_TrapFocus/FocusTrap.js +332 -0
  79. package/Unstable_TrapFocus/FocusTrap.types.d.ts +51 -0
  80. package/Unstable_TrapFocus/FocusTrap.types.js +1 -0
  81. package/Unstable_TrapFocus/index.d.ts +2 -2
  82. package/Unstable_TrapFocus/index.js +1 -1
  83. package/index.d.ts +1 -1
  84. package/index.js +2 -2
  85. package/legacy/Autocomplete/Autocomplete.js +1 -1
  86. package/legacy/Badge/Badge.js +2 -2
  87. package/legacy/Badge/useBadge.js +42 -0
  88. package/legacy/Badge/useBadge.types.js +1 -0
  89. package/legacy/Breadcrumbs/Breadcrumbs.js +1 -1
  90. package/legacy/ClickAwayListener/ClickAwayListener.js +181 -0
  91. package/legacy/ClickAwayListener/index.js +1 -1
  92. package/legacy/InputBase/InputBase.js +2 -2
  93. package/legacy/ListItem/ListItem.js +1 -1
  94. package/legacy/Menu/Menu.js +1 -1
  95. package/legacy/Modal/Modal.js +2 -2
  96. package/legacy/Modal/ModalManager.js +233 -0
  97. package/legacy/Modal/index.js +1 -1
  98. package/legacy/Modal/useModal.js +206 -0
  99. package/legacy/Modal/useModal.types.js +1 -0
  100. package/legacy/NoSsr/NoSsr.js +75 -0
  101. package/legacy/NoSsr/NoSsr.types.js +1 -0
  102. package/legacy/NoSsr/index.js +1 -1
  103. package/legacy/Popover/Popover.js +2 -1
  104. package/legacy/Popper/BasePopper.js +380 -0
  105. package/legacy/Popper/BasePopper.types.js +1 -0
  106. package/legacy/Popper/Popper.js +1 -1
  107. package/legacy/Popper/index.js +2 -1
  108. package/legacy/Popper/popperClasses.js +7 -0
  109. package/legacy/Portal/Portal.js +92 -0
  110. package/legacy/Portal/Portal.types.js +1 -0
  111. package/legacy/Portal/index.js +1 -1
  112. package/legacy/Slider/Slider.js +3 -2
  113. package/legacy/Slider/useSlider.js +701 -0
  114. package/legacy/Slider/useSlider.types.js +1 -0
  115. package/legacy/Snackbar/Snackbar.js +4 -5
  116. package/legacy/Snackbar/useSnackbar.js +141 -0
  117. package/legacy/Snackbar/useSnackbar.types.js +1 -0
  118. package/legacy/SwipeableDrawer/SwipeableDrawer.js +1 -1
  119. package/legacy/TabScrollButton/TabScrollButton.js +1 -1
  120. package/legacy/TablePagination/TablePagination.js +1 -1
  121. package/legacy/Tabs/Tabs.js +1 -1
  122. package/legacy/TextareaAutosize/TextareaAutosize.js +220 -0
  123. package/legacy/TextareaAutosize/TextareaAutosize.types.js +1 -0
  124. package/legacy/TextareaAutosize/index.js +1 -1
  125. package/legacy/Tooltip/Tooltip.js +2 -3
  126. package/legacy/Unstable_TrapFocus/FocusTrap.js +341 -0
  127. package/legacy/Unstable_TrapFocus/FocusTrap.types.js +1 -0
  128. package/legacy/Unstable_TrapFocus/index.js +1 -1
  129. package/legacy/index.js +2 -2
  130. package/legacy/useAutocomplete/useAutocomplete.js +1078 -2
  131. package/legacy/utils/PolymorphicComponent.js +1 -0
  132. package/legacy/utils/areArraysEqual.js +9 -0
  133. package/legacy/utils/index.js +1 -1
  134. package/legacy/utils/shouldSpreadAdditionalProps.js +1 -1
  135. package/legacy/utils/useSlot.js +3 -1
  136. package/modern/Autocomplete/Autocomplete.js +1 -1
  137. package/modern/Badge/Badge.js +2 -2
  138. package/modern/Badge/useBadge.js +41 -0
  139. package/modern/Badge/useBadge.types.js +1 -0
  140. package/modern/Breadcrumbs/Breadcrumbs.js +1 -1
  141. package/modern/ClickAwayListener/ClickAwayListener.js +178 -0
  142. package/modern/ClickAwayListener/index.js +1 -1
  143. package/modern/InputBase/InputBase.js +2 -2
  144. package/modern/ListItem/ListItem.js +1 -1
  145. package/modern/Menu/Menu.js +1 -1
  146. package/modern/Modal/Modal.js +2 -2
  147. package/modern/Modal/ModalManager.js +213 -0
  148. package/modern/Modal/index.js +1 -1
  149. package/modern/Modal/useModal.js +193 -0
  150. package/modern/Modal/useModal.types.js +1 -0
  151. package/modern/NoSsr/NoSsr.js +73 -0
  152. package/modern/NoSsr/NoSsr.types.js +1 -0
  153. package/modern/NoSsr/index.js +1 -1
  154. package/modern/Popover/Popover.js +2 -1
  155. package/modern/Popper/BasePopper.js +371 -0
  156. package/modern/Popper/BasePopper.types.js +1 -0
  157. package/modern/Popper/Popper.js +1 -1
  158. package/modern/Popper/index.js +2 -1
  159. package/modern/Popper/popperClasses.js +7 -0
  160. package/modern/Portal/Portal.js +92 -0
  161. package/modern/Portal/Portal.types.js +1 -0
  162. package/modern/Portal/index.js +1 -1
  163. package/modern/Slider/Slider.js +3 -2
  164. package/modern/Slider/useSlider.js +643 -0
  165. package/modern/Slider/useSlider.types.js +1 -0
  166. package/modern/Snackbar/Snackbar.js +4 -5
  167. package/modern/Snackbar/useSnackbar.js +131 -0
  168. package/modern/Snackbar/useSnackbar.types.js +1 -0
  169. package/modern/SwipeableDrawer/SwipeableDrawer.js +1 -1
  170. package/modern/TabScrollButton/TabScrollButton.js +1 -1
  171. package/modern/TablePagination/TablePagination.js +1 -1
  172. package/modern/Tabs/Tabs.js +1 -1
  173. package/modern/TextareaAutosize/TextareaAutosize.js +223 -0
  174. package/modern/TextareaAutosize/TextareaAutosize.types.js +1 -0
  175. package/modern/TextareaAutosize/index.js +1 -1
  176. package/modern/Tooltip/Tooltip.js +2 -3
  177. package/modern/Unstable_TrapFocus/FocusTrap.js +331 -0
  178. package/modern/Unstable_TrapFocus/FocusTrap.types.js +1 -0
  179. package/modern/Unstable_TrapFocus/index.js +1 -1
  180. package/modern/index.js +2 -2
  181. package/modern/useAutocomplete/useAutocomplete.js +987 -2
  182. package/modern/utils/PolymorphicComponent.js +1 -0
  183. package/modern/utils/areArraysEqual.js +4 -0
  184. package/modern/utils/index.js +1 -1
  185. package/modern/utils/shouldSpreadAdditionalProps.js +1 -1
  186. package/modern/utils/useSlot.js +3 -1
  187. package/node/Autocomplete/Autocomplete.js +3 -3
  188. package/node/Badge/Badge.js +5 -5
  189. package/node/Badge/useBadge.js +46 -0
  190. package/node/Badge/useBadge.types.js +5 -0
  191. package/node/Breadcrumbs/Breadcrumbs.js +2 -2
  192. package/node/ClickAwayListener/ClickAwayListener.js +184 -0
  193. package/node/ClickAwayListener/index.js +1 -1
  194. package/node/InputBase/InputBase.js +7 -7
  195. package/node/ListItem/ListItem.js +3 -3
  196. package/node/Menu/Menu.js +3 -3
  197. package/node/Modal/Modal.js +5 -5
  198. package/node/Modal/ModalManager.js +221 -0
  199. package/node/Modal/index.js +2 -2
  200. package/node/Modal/useModal.js +203 -0
  201. package/node/Modal/useModal.types.js +5 -0
  202. package/node/NoSsr/NoSsr.js +81 -0
  203. package/node/NoSsr/NoSsr.types.js +5 -0
  204. package/node/NoSsr/index.js +3 -2
  205. package/node/Popover/Popover.js +5 -4
  206. package/node/Popper/BasePopper.js +380 -0
  207. package/node/Popper/BasePopper.types.js +5 -0
  208. package/node/Popper/Popper.js +2 -2
  209. package/node/Popper/index.js +14 -1
  210. package/node/Popper/popperClasses.js +15 -0
  211. package/node/Portal/Portal.js +100 -0
  212. package/node/Portal/Portal.types.js +5 -0
  213. package/node/Portal/index.js +3 -2
  214. package/node/Slider/Slider.js +14 -13
  215. package/node/Slider/useSlider.js +666 -0
  216. package/node/Slider/useSlider.types.js +5 -0
  217. package/node/Snackbar/Snackbar.js +9 -10
  218. package/node/Snackbar/useSnackbar.js +139 -0
  219. package/node/Snackbar/useSnackbar.types.js +5 -0
  220. package/node/SwipeableDrawer/SwipeableDrawer.js +2 -2
  221. package/node/TabScrollButton/TabScrollButton.js +3 -3
  222. package/node/TablePagination/TablePagination.js +2 -2
  223. package/node/Tabs/Tabs.js +3 -3
  224. package/node/TextareaAutosize/TextareaAutosize.js +230 -0
  225. package/node/TextareaAutosize/TextareaAutosize.types.js +5 -0
  226. package/node/TextareaAutosize/index.js +3 -2
  227. package/node/Tooltip/Tooltip.js +10 -11
  228. package/node/Unstable_TrapFocus/FocusTrap.js +339 -0
  229. package/node/Unstable_TrapFocus/FocusTrap.types.js +5 -0
  230. package/node/Unstable_TrapFocus/index.js +3 -2
  231. package/node/index.js +3 -3
  232. package/node/useAutocomplete/useAutocomplete.js +997 -18
  233. package/node/utils/PolymorphicComponent.js +5 -0
  234. package/node/utils/areArraysEqual.js +10 -0
  235. package/node/utils/index.js +2 -2
  236. package/node/utils/shouldSpreadAdditionalProps.js +3 -2
  237. package/node/utils/useSlot.js +6 -4
  238. package/package.json +4 -5
  239. package/styles/overrides.d.ts +1 -1
  240. package/umd/material-ui.development.js +9190 -9248
  241. package/umd/material-ui.production.min.js +3 -3
  242. package/useAutocomplete/useAutocomplete.d.ts +460 -2
  243. package/useAutocomplete/useAutocomplete.js +994 -2
  244. package/utils/PolymorphicComponent.d.ts +17 -0
  245. package/utils/PolymorphicComponent.js +1 -0
  246. package/utils/areArraysEqual.d.ts +3 -0
  247. package/utils/areArraysEqual.js +4 -0
  248. package/utils/index.d.ts +2 -1
  249. package/utils/index.js +1 -1
  250. package/utils/shouldSpreadAdditionalProps.js +1 -1
  251. package/utils/types.d.ts +2 -1
  252. package/utils/useSlot.js +3 -1
@@ -0,0 +1,666 @@
1
+ "use strict";
2
+ 'use client';
3
+
4
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.Identity = void 0;
9
+ exports.useSlider = useSlider;
10
+ exports.valueToPercent = valueToPercent;
11
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
12
+ var React = _interopRequireWildcard(require("react"));
13
+ var _utils = require("@mui/utils");
14
+ var _extractEventHandlers = _interopRequireDefault(require("@mui/utils/extractEventHandlers"));
15
+ var _areArraysEqual = _interopRequireDefault(require("../utils/areArraysEqual"));
16
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
17
+ 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 && Object.prototype.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; }
18
+ const INTENTIONAL_DRAG_COUNT_THRESHOLD = 2;
19
+ function asc(a, b) {
20
+ return a - b;
21
+ }
22
+ function findClosest(values, currentValue) {
23
+ var _values$reduce;
24
+ const {
25
+ index: closestIndex
26
+ } = (_values$reduce = values.reduce((acc, value, index) => {
27
+ const distance = Math.abs(currentValue - value);
28
+ if (acc === null || distance < acc.distance || distance === acc.distance) {
29
+ return {
30
+ distance,
31
+ index
32
+ };
33
+ }
34
+ return acc;
35
+ }, null)) != null ? _values$reduce : {};
36
+ return closestIndex;
37
+ }
38
+ function trackFinger(event, touchId) {
39
+ // The event is TouchEvent
40
+ if (touchId.current !== undefined && event.changedTouches) {
41
+ const touchEvent = event;
42
+ for (let i = 0; i < touchEvent.changedTouches.length; i += 1) {
43
+ const touch = touchEvent.changedTouches[i];
44
+ if (touch.identifier === touchId.current) {
45
+ return {
46
+ x: touch.clientX,
47
+ y: touch.clientY
48
+ };
49
+ }
50
+ }
51
+ return false;
52
+ }
53
+
54
+ // The event is MouseEvent
55
+ return {
56
+ x: event.clientX,
57
+ y: event.clientY
58
+ };
59
+ }
60
+ function valueToPercent(value, min, max) {
61
+ return (value - min) * 100 / (max - min);
62
+ }
63
+ function percentToValue(percent, min, max) {
64
+ return (max - min) * percent + min;
65
+ }
66
+ function getDecimalPrecision(num) {
67
+ // This handles the case when num is very small (0.00000001), js will turn this into 1e-8.
68
+ // When num is bigger than 1 or less than -1 it won't get converted to this notation so it's fine.
69
+ if (Math.abs(num) < 1) {
70
+ const parts = num.toExponential().split('e-');
71
+ const matissaDecimalPart = parts[0].split('.')[1];
72
+ return (matissaDecimalPart ? matissaDecimalPart.length : 0) + parseInt(parts[1], 10);
73
+ }
74
+ const decimalPart = num.toString().split('.')[1];
75
+ return decimalPart ? decimalPart.length : 0;
76
+ }
77
+ function roundValueToStep(value, step, min) {
78
+ const nearest = Math.round((value - min) / step) * step + min;
79
+ return Number(nearest.toFixed(getDecimalPrecision(step)));
80
+ }
81
+ function setValueIndex({
82
+ values,
83
+ newValue,
84
+ index
85
+ }) {
86
+ const output = values.slice();
87
+ output[index] = newValue;
88
+ return output.sort(asc);
89
+ }
90
+ function focusThumb({
91
+ sliderRef,
92
+ activeIndex,
93
+ setActive
94
+ }) {
95
+ var _sliderRef$current, _doc$activeElement;
96
+ const doc = (0, _utils.unstable_ownerDocument)(sliderRef.current);
97
+ if (!((_sliderRef$current = sliderRef.current) != null && _sliderRef$current.contains(doc.activeElement)) || Number(doc == null || (_doc$activeElement = doc.activeElement) == null ? void 0 : _doc$activeElement.getAttribute('data-index')) !== activeIndex) {
98
+ var _sliderRef$current2;
99
+ (_sliderRef$current2 = sliderRef.current) == null || _sliderRef$current2.querySelector(`[type="range"][data-index="${activeIndex}"]`).focus();
100
+ }
101
+ if (setActive) {
102
+ setActive(activeIndex);
103
+ }
104
+ }
105
+ function areValuesEqual(newValue, oldValue) {
106
+ if (typeof newValue === 'number' && typeof oldValue === 'number') {
107
+ return newValue === oldValue;
108
+ }
109
+ if (typeof newValue === 'object' && typeof oldValue === 'object') {
110
+ return (0, _areArraysEqual.default)(newValue, oldValue);
111
+ }
112
+ return false;
113
+ }
114
+ const axisProps = {
115
+ horizontal: {
116
+ offset: percent => ({
117
+ left: `${percent}%`
118
+ }),
119
+ leap: percent => ({
120
+ width: `${percent}%`
121
+ })
122
+ },
123
+ 'horizontal-reverse': {
124
+ offset: percent => ({
125
+ right: `${percent}%`
126
+ }),
127
+ leap: percent => ({
128
+ width: `${percent}%`
129
+ })
130
+ },
131
+ vertical: {
132
+ offset: percent => ({
133
+ bottom: `${percent}%`
134
+ }),
135
+ leap: percent => ({
136
+ height: `${percent}%`
137
+ })
138
+ }
139
+ };
140
+ const Identity = x => x;
141
+
142
+ // TODO: remove support for Safari < 13.
143
+ // https://caniuse.com/#search=touch-action
144
+ //
145
+ // Safari, on iOS, supports touch action since v13.
146
+ // Over 80% of the iOS phones are compatible
147
+ // in August 2020.
148
+ // Utilizing the CSS.supports method to check if touch-action is supported.
149
+ // Since CSS.supports is supported on all but Edge@12 and IE and touch-action
150
+ // is supported on both Edge@12 and IE if CSS.supports is not available that means that
151
+ // touch-action will be supported
152
+ exports.Identity = Identity;
153
+ let cachedSupportsTouchActionNone;
154
+ function doesSupportTouchActionNone() {
155
+ if (cachedSupportsTouchActionNone === undefined) {
156
+ if (typeof CSS !== 'undefined' && typeof CSS.supports === 'function') {
157
+ cachedSupportsTouchActionNone = CSS.supports('touch-action', 'none');
158
+ } else {
159
+ cachedSupportsTouchActionNone = true;
160
+ }
161
+ }
162
+ return cachedSupportsTouchActionNone;
163
+ }
164
+ /**
165
+ *
166
+ * Demos:
167
+ *
168
+ * - [Slider](https://mui.com/base-ui/react-slider/#hook)
169
+ *
170
+ * API:
171
+ *
172
+ * - [useSlider API](https://mui.com/base-ui/react-slider/hooks-api/#use-slider)
173
+ */
174
+ function useSlider(parameters) {
175
+ const {
176
+ 'aria-labelledby': ariaLabelledby,
177
+ defaultValue,
178
+ disabled = false,
179
+ disableSwap = false,
180
+ isRtl = false,
181
+ marks: marksProp = false,
182
+ max = 100,
183
+ min = 0,
184
+ name,
185
+ onChange,
186
+ onChangeCommitted,
187
+ orientation = 'horizontal',
188
+ rootRef: ref,
189
+ scale = Identity,
190
+ step = 1,
191
+ shiftStep = 10,
192
+ tabIndex,
193
+ value: valueProp
194
+ } = parameters;
195
+ const touchId = React.useRef();
196
+ // We can't use the :active browser pseudo-classes.
197
+ // - The active state isn't triggered when clicking on the rail.
198
+ // - The active state isn't transferred when inversing a range slider.
199
+ const [active, setActive] = React.useState(-1);
200
+ const [open, setOpen] = React.useState(-1);
201
+ const [dragging, setDragging] = React.useState(false);
202
+ const moveCount = React.useRef(0);
203
+ const [valueDerived, setValueState] = (0, _utils.unstable_useControlled)({
204
+ controlled: valueProp,
205
+ default: defaultValue != null ? defaultValue : min,
206
+ name: 'Slider'
207
+ });
208
+ const handleChange = onChange && ((event, value, thumbIndex) => {
209
+ // Redefine target to allow name and value to be read.
210
+ // This allows seamless integration with the most popular form libraries.
211
+ // https://github.com/mui/material-ui/issues/13485#issuecomment-676048492
212
+ // Clone the event to not override `target` of the original event.
213
+ const nativeEvent = event.nativeEvent || event;
214
+ // @ts-ignore The nativeEvent is function, not object
215
+ const clonedEvent = new nativeEvent.constructor(nativeEvent.type, nativeEvent);
216
+ Object.defineProperty(clonedEvent, 'target', {
217
+ writable: true,
218
+ value: {
219
+ value,
220
+ name
221
+ }
222
+ });
223
+ onChange(clonedEvent, value, thumbIndex);
224
+ });
225
+ const range = Array.isArray(valueDerived);
226
+ let values = range ? valueDerived.slice().sort(asc) : [valueDerived];
227
+ values = values.map(value => value == null ? min : (0, _utils.clamp)(value, min, max));
228
+ const marks = marksProp === true && step !== null ? [...Array(Math.floor((max - min) / step) + 1)].map((_, index) => ({
229
+ value: min + step * index
230
+ })) : marksProp || [];
231
+ const marksValues = marks.map(mark => mark.value);
232
+ const {
233
+ isFocusVisibleRef,
234
+ onBlur: handleBlurVisible,
235
+ onFocus: handleFocusVisible,
236
+ ref: focusVisibleRef
237
+ } = (0, _utils.unstable_useIsFocusVisible)();
238
+ const [focusedThumbIndex, setFocusedThumbIndex] = React.useState(-1);
239
+ const sliderRef = React.useRef();
240
+ const handleFocusRef = (0, _utils.unstable_useForkRef)(focusVisibleRef, sliderRef);
241
+ const handleRef = (0, _utils.unstable_useForkRef)(ref, handleFocusRef);
242
+ const createHandleHiddenInputFocus = otherHandlers => event => {
243
+ var _otherHandlers$onFocu;
244
+ const index = Number(event.currentTarget.getAttribute('data-index'));
245
+ handleFocusVisible(event);
246
+ if (isFocusVisibleRef.current === true) {
247
+ setFocusedThumbIndex(index);
248
+ }
249
+ setOpen(index);
250
+ otherHandlers == null || (_otherHandlers$onFocu = otherHandlers.onFocus) == null || _otherHandlers$onFocu.call(otherHandlers, event);
251
+ };
252
+ const createHandleHiddenInputBlur = otherHandlers => event => {
253
+ var _otherHandlers$onBlur;
254
+ handleBlurVisible(event);
255
+ if (isFocusVisibleRef.current === false) {
256
+ setFocusedThumbIndex(-1);
257
+ }
258
+ setOpen(-1);
259
+ otherHandlers == null || (_otherHandlers$onBlur = otherHandlers.onBlur) == null || _otherHandlers$onBlur.call(otherHandlers, event);
260
+ };
261
+ const changeValue = (event, valueInput) => {
262
+ const index = Number(event.currentTarget.getAttribute('data-index'));
263
+ const value = values[index];
264
+ const marksIndex = marksValues.indexOf(value);
265
+ let newValue = valueInput;
266
+ if (marks && step == null) {
267
+ const maxMarksValue = marksValues[marksValues.length - 1];
268
+ if (newValue > maxMarksValue) {
269
+ newValue = maxMarksValue;
270
+ } else if (newValue < marksValues[0]) {
271
+ newValue = marksValues[0];
272
+ } else {
273
+ newValue = newValue < value ? marksValues[marksIndex - 1] : marksValues[marksIndex + 1];
274
+ }
275
+ }
276
+ newValue = (0, _utils.clamp)(newValue, min, max);
277
+ if (range) {
278
+ // Bound the new value to the thumb's neighbours.
279
+ if (disableSwap) {
280
+ newValue = (0, _utils.clamp)(newValue, values[index - 1] || -Infinity, values[index + 1] || Infinity);
281
+ }
282
+ const previousValue = newValue;
283
+ newValue = setValueIndex({
284
+ values,
285
+ newValue,
286
+ index
287
+ });
288
+ let activeIndex = index;
289
+
290
+ // Potentially swap the index if needed.
291
+ if (!disableSwap) {
292
+ activeIndex = newValue.indexOf(previousValue);
293
+ }
294
+ focusThumb({
295
+ sliderRef,
296
+ activeIndex
297
+ });
298
+ }
299
+ setValueState(newValue);
300
+ setFocusedThumbIndex(index);
301
+ if (handleChange && !areValuesEqual(newValue, valueDerived)) {
302
+ handleChange(event, newValue, index);
303
+ }
304
+ if (onChangeCommitted) {
305
+ onChangeCommitted(event, newValue);
306
+ }
307
+ };
308
+ const createHandleHiddenInputKeyDown = otherHandlers => event => {
309
+ var _otherHandlers$onKeyD;
310
+ // The Shift + Up/Down keyboard shortcuts for moving the slider makes sense to be supported
311
+ // only if the step is defined. If the step is null, this means tha the marks are used for specifying the valid values.
312
+ if (step !== null) {
313
+ const index = Number(event.currentTarget.getAttribute('data-index'));
314
+ const value = values[index];
315
+ let newValue = null;
316
+ if ((event.key === 'ArrowLeft' || event.key === 'ArrowDown') && event.shiftKey || event.key === 'PageDown') {
317
+ newValue = Math.max(value - shiftStep, min);
318
+ } else if ((event.key === 'ArrowRight' || event.key === 'ArrowUp') && event.shiftKey || event.key === 'PageUp') {
319
+ newValue = Math.min(value + shiftStep, max);
320
+ }
321
+ if (newValue !== null) {
322
+ changeValue(event, newValue);
323
+ event.preventDefault();
324
+ }
325
+ }
326
+ otherHandlers == null || (_otherHandlers$onKeyD = otherHandlers.onKeyDown) == null || _otherHandlers$onKeyD.call(otherHandlers, event);
327
+ };
328
+ (0, _utils.unstable_useEnhancedEffect)(() => {
329
+ if (disabled && sliderRef.current.contains(document.activeElement)) {
330
+ var _document$activeEleme;
331
+ // This is necessary because Firefox and Safari will keep focus
332
+ // on a disabled element:
333
+ // https://codesandbox.io/p/sandbox/mui-pr-22247-forked-h151h?file=/src/App.js
334
+ // @ts-ignore
335
+ (_document$activeEleme = document.activeElement) == null || _document$activeEleme.blur();
336
+ }
337
+ }, [disabled]);
338
+ if (disabled && active !== -1) {
339
+ setActive(-1);
340
+ }
341
+ if (disabled && focusedThumbIndex !== -1) {
342
+ setFocusedThumbIndex(-1);
343
+ }
344
+ const createHandleHiddenInputChange = otherHandlers => event => {
345
+ var _otherHandlers$onChan;
346
+ (_otherHandlers$onChan = otherHandlers.onChange) == null || _otherHandlers$onChan.call(otherHandlers, event);
347
+ // @ts-ignore
348
+ changeValue(event, event.target.valueAsNumber);
349
+ };
350
+ const previousIndex = React.useRef();
351
+ let axis = orientation;
352
+ if (isRtl && orientation === 'horizontal') {
353
+ axis += '-reverse';
354
+ }
355
+ const getFingerNewValue = ({
356
+ finger,
357
+ move = false
358
+ }) => {
359
+ const {
360
+ current: slider
361
+ } = sliderRef;
362
+ const {
363
+ width,
364
+ height,
365
+ bottom,
366
+ left
367
+ } = slider.getBoundingClientRect();
368
+ let percent;
369
+ if (axis.indexOf('vertical') === 0) {
370
+ percent = (bottom - finger.y) / height;
371
+ } else {
372
+ percent = (finger.x - left) / width;
373
+ }
374
+ if (axis.indexOf('-reverse') !== -1) {
375
+ percent = 1 - percent;
376
+ }
377
+ let newValue;
378
+ newValue = percentToValue(percent, min, max);
379
+ if (step) {
380
+ newValue = roundValueToStep(newValue, step, min);
381
+ } else {
382
+ const closestIndex = findClosest(marksValues, newValue);
383
+ newValue = marksValues[closestIndex];
384
+ }
385
+ newValue = (0, _utils.clamp)(newValue, min, max);
386
+ let activeIndex = 0;
387
+ if (range) {
388
+ if (!move) {
389
+ activeIndex = findClosest(values, newValue);
390
+ } else {
391
+ activeIndex = previousIndex.current;
392
+ }
393
+
394
+ // Bound the new value to the thumb's neighbours.
395
+ if (disableSwap) {
396
+ newValue = (0, _utils.clamp)(newValue, values[activeIndex - 1] || -Infinity, values[activeIndex + 1] || Infinity);
397
+ }
398
+ const previousValue = newValue;
399
+ newValue = setValueIndex({
400
+ values,
401
+ newValue,
402
+ index: activeIndex
403
+ });
404
+
405
+ // Potentially swap the index if needed.
406
+ if (!(disableSwap && move)) {
407
+ activeIndex = newValue.indexOf(previousValue);
408
+ previousIndex.current = activeIndex;
409
+ }
410
+ }
411
+ return {
412
+ newValue,
413
+ activeIndex
414
+ };
415
+ };
416
+ const handleTouchMove = (0, _utils.unstable_useEventCallback)(nativeEvent => {
417
+ const finger = trackFinger(nativeEvent, touchId);
418
+ if (!finger) {
419
+ return;
420
+ }
421
+ moveCount.current += 1;
422
+
423
+ // Cancel move in case some other element consumed a mouseup event and it was not fired.
424
+ // @ts-ignore buttons doesn't not exists on touch event
425
+ if (nativeEvent.type === 'mousemove' && nativeEvent.buttons === 0) {
426
+ // eslint-disable-next-line @typescript-eslint/no-use-before-define
427
+ handleTouchEnd(nativeEvent);
428
+ return;
429
+ }
430
+ const {
431
+ newValue,
432
+ activeIndex
433
+ } = getFingerNewValue({
434
+ finger,
435
+ move: true
436
+ });
437
+ focusThumb({
438
+ sliderRef,
439
+ activeIndex,
440
+ setActive
441
+ });
442
+ setValueState(newValue);
443
+ if (!dragging && moveCount.current > INTENTIONAL_DRAG_COUNT_THRESHOLD) {
444
+ setDragging(true);
445
+ }
446
+ if (handleChange && !areValuesEqual(newValue, valueDerived)) {
447
+ handleChange(nativeEvent, newValue, activeIndex);
448
+ }
449
+ });
450
+ const handleTouchEnd = (0, _utils.unstable_useEventCallback)(nativeEvent => {
451
+ const finger = trackFinger(nativeEvent, touchId);
452
+ setDragging(false);
453
+ if (!finger) {
454
+ return;
455
+ }
456
+ const {
457
+ newValue
458
+ } = getFingerNewValue({
459
+ finger,
460
+ move: true
461
+ });
462
+ setActive(-1);
463
+ if (nativeEvent.type === 'touchend') {
464
+ setOpen(-1);
465
+ }
466
+ if (onChangeCommitted) {
467
+ onChangeCommitted(nativeEvent, newValue);
468
+ }
469
+ touchId.current = undefined;
470
+
471
+ // eslint-disable-next-line @typescript-eslint/no-use-before-define
472
+ stopListening();
473
+ });
474
+ const handleTouchStart = (0, _utils.unstable_useEventCallback)(nativeEvent => {
475
+ if (disabled) {
476
+ return;
477
+ }
478
+ // If touch-action: none; is not supported we need to prevent the scroll manually.
479
+ if (!doesSupportTouchActionNone()) {
480
+ nativeEvent.preventDefault();
481
+ }
482
+ const touch = nativeEvent.changedTouches[0];
483
+ if (touch != null) {
484
+ // A number that uniquely identifies the current finger in the touch session.
485
+ touchId.current = touch.identifier;
486
+ }
487
+ const finger = trackFinger(nativeEvent, touchId);
488
+ if (finger !== false) {
489
+ const {
490
+ newValue,
491
+ activeIndex
492
+ } = getFingerNewValue({
493
+ finger
494
+ });
495
+ focusThumb({
496
+ sliderRef,
497
+ activeIndex,
498
+ setActive
499
+ });
500
+ setValueState(newValue);
501
+ if (handleChange && !areValuesEqual(newValue, valueDerived)) {
502
+ handleChange(nativeEvent, newValue, activeIndex);
503
+ }
504
+ }
505
+ moveCount.current = 0;
506
+ const doc = (0, _utils.unstable_ownerDocument)(sliderRef.current);
507
+ doc.addEventListener('touchmove', handleTouchMove, {
508
+ passive: true
509
+ });
510
+ doc.addEventListener('touchend', handleTouchEnd, {
511
+ passive: true
512
+ });
513
+ });
514
+ const stopListening = React.useCallback(() => {
515
+ const doc = (0, _utils.unstable_ownerDocument)(sliderRef.current);
516
+ doc.removeEventListener('mousemove', handleTouchMove);
517
+ doc.removeEventListener('mouseup', handleTouchEnd);
518
+ doc.removeEventListener('touchmove', handleTouchMove);
519
+ doc.removeEventListener('touchend', handleTouchEnd);
520
+ }, [handleTouchEnd, handleTouchMove]);
521
+ React.useEffect(() => {
522
+ const {
523
+ current: slider
524
+ } = sliderRef;
525
+ slider.addEventListener('touchstart', handleTouchStart, {
526
+ passive: doesSupportTouchActionNone()
527
+ });
528
+ return () => {
529
+ slider.removeEventListener('touchstart', handleTouchStart);
530
+ stopListening();
531
+ };
532
+ }, [stopListening, handleTouchStart]);
533
+ React.useEffect(() => {
534
+ if (disabled) {
535
+ stopListening();
536
+ }
537
+ }, [disabled, stopListening]);
538
+ const createHandleMouseDown = otherHandlers => event => {
539
+ var _otherHandlers$onMous;
540
+ (_otherHandlers$onMous = otherHandlers.onMouseDown) == null || _otherHandlers$onMous.call(otherHandlers, event);
541
+ if (disabled) {
542
+ return;
543
+ }
544
+ if (event.defaultPrevented) {
545
+ return;
546
+ }
547
+
548
+ // Only handle left clicks
549
+ if (event.button !== 0) {
550
+ return;
551
+ }
552
+
553
+ // Avoid text selection
554
+ event.preventDefault();
555
+ const finger = trackFinger(event, touchId);
556
+ if (finger !== false) {
557
+ const {
558
+ newValue,
559
+ activeIndex
560
+ } = getFingerNewValue({
561
+ finger
562
+ });
563
+ focusThumb({
564
+ sliderRef,
565
+ activeIndex,
566
+ setActive
567
+ });
568
+ setValueState(newValue);
569
+ if (handleChange && !areValuesEqual(newValue, valueDerived)) {
570
+ handleChange(event, newValue, activeIndex);
571
+ }
572
+ }
573
+ moveCount.current = 0;
574
+ const doc = (0, _utils.unstable_ownerDocument)(sliderRef.current);
575
+ doc.addEventListener('mousemove', handleTouchMove, {
576
+ passive: true
577
+ });
578
+ doc.addEventListener('mouseup', handleTouchEnd);
579
+ };
580
+ const trackOffset = valueToPercent(range ? values[0] : min, min, max);
581
+ const trackLeap = valueToPercent(values[values.length - 1], min, max) - trackOffset;
582
+ const getRootProps = (externalProps = {}) => {
583
+ const externalHandlers = (0, _extractEventHandlers.default)(externalProps);
584
+ const ownEventHandlers = {
585
+ onMouseDown: createHandleMouseDown(externalHandlers || {})
586
+ };
587
+ const mergedEventHandlers = (0, _extends2.default)({}, externalHandlers, ownEventHandlers);
588
+ return (0, _extends2.default)({}, externalProps, {
589
+ ref: handleRef
590
+ }, mergedEventHandlers);
591
+ };
592
+ const createHandleMouseOver = otherHandlers => event => {
593
+ var _otherHandlers$onMous2;
594
+ (_otherHandlers$onMous2 = otherHandlers.onMouseOver) == null || _otherHandlers$onMous2.call(otherHandlers, event);
595
+ const index = Number(event.currentTarget.getAttribute('data-index'));
596
+ setOpen(index);
597
+ };
598
+ const createHandleMouseLeave = otherHandlers => event => {
599
+ var _otherHandlers$onMous3;
600
+ (_otherHandlers$onMous3 = otherHandlers.onMouseLeave) == null || _otherHandlers$onMous3.call(otherHandlers, event);
601
+ setOpen(-1);
602
+ };
603
+ const getThumbProps = (externalProps = {}) => {
604
+ const externalHandlers = (0, _extractEventHandlers.default)(externalProps);
605
+ const ownEventHandlers = {
606
+ onMouseOver: createHandleMouseOver(externalHandlers || {}),
607
+ onMouseLeave: createHandleMouseLeave(externalHandlers || {})
608
+ };
609
+ return (0, _extends2.default)({}, externalProps, externalHandlers, ownEventHandlers);
610
+ };
611
+ const getThumbStyle = index => {
612
+ return {
613
+ // So the non active thumb doesn't show its label on hover.
614
+ pointerEvents: active !== -1 && active !== index ? 'none' : undefined
615
+ };
616
+ };
617
+ const getHiddenInputProps = (externalProps = {}) => {
618
+ var _parameters$step;
619
+ const externalHandlers = (0, _extractEventHandlers.default)(externalProps);
620
+ const ownEventHandlers = {
621
+ onChange: createHandleHiddenInputChange(externalHandlers || {}),
622
+ onFocus: createHandleHiddenInputFocus(externalHandlers || {}),
623
+ onBlur: createHandleHiddenInputBlur(externalHandlers || {}),
624
+ onKeyDown: createHandleHiddenInputKeyDown(externalHandlers || {})
625
+ };
626
+ const mergedEventHandlers = (0, _extends2.default)({}, externalHandlers, ownEventHandlers);
627
+ return (0, _extends2.default)({
628
+ tabIndex,
629
+ 'aria-labelledby': ariaLabelledby,
630
+ 'aria-orientation': orientation,
631
+ 'aria-valuemax': scale(max),
632
+ 'aria-valuemin': scale(min),
633
+ name,
634
+ type: 'range',
635
+ min: parameters.min,
636
+ max: parameters.max,
637
+ step: parameters.step === null && parameters.marks ? 'any' : (_parameters$step = parameters.step) != null ? _parameters$step : undefined,
638
+ disabled
639
+ }, externalProps, mergedEventHandlers, {
640
+ style: (0, _extends2.default)({}, _utils.visuallyHidden, {
641
+ direction: isRtl ? 'rtl' : 'ltr',
642
+ // So that VoiceOver's focus indicator matches the thumb's dimensions
643
+ width: '100%',
644
+ height: '100%'
645
+ })
646
+ });
647
+ };
648
+ return {
649
+ active,
650
+ axis: axis,
651
+ axisProps,
652
+ dragging,
653
+ focusedThumbIndex,
654
+ getHiddenInputProps,
655
+ getRootProps,
656
+ getThumbProps,
657
+ marks: marks,
658
+ open,
659
+ range,
660
+ rootRef: handleRef,
661
+ trackLeap,
662
+ trackOffset,
663
+ values,
664
+ getThumbStyle
665
+ };
666
+ }
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });