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