@cdx-ui/primitives 0.0.1-beta.114 → 0.0.1-beta.116

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 (85) hide show
  1. package/README.md +32 -30
  2. package/lib/commonjs/index.js +35 -0
  3. package/lib/commonjs/index.js.map +1 -1
  4. package/lib/commonjs/overlay/useAnchorPosition.js +60 -11
  5. package/lib/commonjs/overlay/useAnchorPosition.js.map +1 -1
  6. package/lib/commonjs/slider/SliderRail.js +131 -0
  7. package/lib/commonjs/slider/SliderRail.js.map +1 -0
  8. package/lib/commonjs/slider/SliderRoot.js +186 -0
  9. package/lib/commonjs/slider/SliderRoot.js.map +1 -0
  10. package/lib/commonjs/slider/SliderThumb.js +228 -0
  11. package/lib/commonjs/slider/SliderThumb.js.map +1 -0
  12. package/lib/commonjs/slider/context.js +11 -0
  13. package/lib/commonjs/slider/context.js.map +1 -0
  14. package/lib/commonjs/slider/index.js +65 -0
  15. package/lib/commonjs/slider/index.js.map +1 -0
  16. package/lib/commonjs/slider/types.js +6 -0
  17. package/lib/commonjs/slider/types.js.map +1 -0
  18. package/lib/commonjs/slider/useSliderPointer.js +116 -0
  19. package/lib/commonjs/slider/useSliderPointer.js.map +1 -0
  20. package/lib/commonjs/slider/utils.js +155 -0
  21. package/lib/commonjs/slider/utils.js.map +1 -0
  22. package/lib/commonjs/utils/assignRef.js +16 -0
  23. package/lib/commonjs/utils/assignRef.js.map +1 -0
  24. package/lib/commonjs/utils/createPortal.js +3 -1
  25. package/lib/commonjs/utils/createPortal.js.map +1 -1
  26. package/lib/module/index.js +4 -0
  27. package/lib/module/index.js.map +1 -1
  28. package/lib/module/overlay/useAnchorPosition.js +60 -11
  29. package/lib/module/overlay/useAnchorPosition.js.map +1 -1
  30. package/lib/module/slider/SliderRail.js +127 -0
  31. package/lib/module/slider/SliderRail.js.map +1 -0
  32. package/lib/module/slider/SliderRoot.js +182 -0
  33. package/lib/module/slider/SliderRoot.js.map +1 -0
  34. package/lib/module/slider/SliderThumb.js +224 -0
  35. package/lib/module/slider/SliderThumb.js.map +1 -0
  36. package/lib/module/slider/context.js +5 -0
  37. package/lib/module/slider/context.js.map +1 -0
  38. package/lib/module/slider/index.js +8 -0
  39. package/lib/module/slider/index.js.map +1 -0
  40. package/lib/module/slider/types.js +4 -0
  41. package/lib/module/slider/types.js.map +1 -0
  42. package/lib/module/slider/useSliderPointer.js +110 -0
  43. package/lib/module/slider/useSliderPointer.js.map +1 -0
  44. package/lib/module/slider/utils.js +138 -0
  45. package/lib/module/slider/utils.js.map +1 -0
  46. package/lib/module/utils/assignRef.js +12 -0
  47. package/lib/module/utils/assignRef.js.map +1 -0
  48. package/lib/module/utils/createPortal.js +3 -1
  49. package/lib/module/utils/createPortal.js.map +1 -1
  50. package/lib/typescript/index.d.ts +4 -0
  51. package/lib/typescript/index.d.ts.map +1 -1
  52. package/lib/typescript/overlay/useAnchorPosition.d.ts +7 -1
  53. package/lib/typescript/overlay/useAnchorPosition.d.ts.map +1 -1
  54. package/lib/typescript/slider/SliderRail.d.ts +6 -0
  55. package/lib/typescript/slider/SliderRail.d.ts.map +1 -0
  56. package/lib/typescript/slider/SliderRoot.d.ts +7 -0
  57. package/lib/typescript/slider/SliderRoot.d.ts.map +1 -0
  58. package/lib/typescript/slider/SliderThumb.d.ts +6 -0
  59. package/lib/typescript/slider/SliderThumb.d.ts.map +1 -0
  60. package/lib/typescript/slider/context.d.ts +37 -0
  61. package/lib/typescript/slider/context.d.ts.map +1 -0
  62. package/lib/typescript/slider/index.d.ts +8 -0
  63. package/lib/typescript/slider/index.d.ts.map +1 -0
  64. package/lib/typescript/slider/types.d.ts +37 -0
  65. package/lib/typescript/slider/types.d.ts.map +1 -0
  66. package/lib/typescript/slider/useSliderPointer.d.ts +23 -0
  67. package/lib/typescript/slider/useSliderPointer.d.ts.map +1 -0
  68. package/lib/typescript/slider/utils.d.ts +23 -0
  69. package/lib/typescript/slider/utils.d.ts.map +1 -0
  70. package/lib/typescript/utils/assignRef.d.ts +3 -0
  71. package/lib/typescript/utils/assignRef.d.ts.map +1 -0
  72. package/lib/typescript/utils/createPortal.d.ts.map +1 -1
  73. package/package.json +2 -2
  74. package/src/index.ts +4 -0
  75. package/src/overlay/useAnchorPosition.ts +79 -11
  76. package/src/slider/SliderRail.tsx +143 -0
  77. package/src/slider/SliderRoot.tsx +266 -0
  78. package/src/slider/SliderThumb.tsx +268 -0
  79. package/src/slider/context.tsx +38 -0
  80. package/src/slider/index.ts +19 -0
  81. package/src/slider/types.ts +44 -0
  82. package/src/slider/useSliderPointer.ts +157 -0
  83. package/src/slider/utils.ts +181 -0
  84. package/src/utils/assignRef.ts +11 -0
  85. package/src/utils/createPortal.ts +3 -1
@@ -0,0 +1,186 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.SliderRoot = void 0;
7
+ var _react = require("react");
8
+ var _reactNative = require("react-native");
9
+ var _utils = require("@cdx-ui/utils");
10
+ var _focus = require("@react-native-aria/focus");
11
+ var _slot = require("../slot");
12
+ var _dataAttributes = require("../utils/dataAttributes");
13
+ var _context = require("./context");
14
+ var _utils2 = require("./utils");
15
+ var _jsxRuntime = require("react/jsx-runtime");
16
+ const STEP_KEYS = new Set(['ArrowUp', 'ArrowRight', 'ArrowDown', 'ArrowLeft', 'Home', 'End']);
17
+ const SliderRoot = exports.SliderRoot = /*#__PURE__*/(0, _react.forwardRef)(({
18
+ asChild,
19
+ value: valueProp,
20
+ defaultValue,
21
+ onChange,
22
+ onChangeComplete,
23
+ min = 0,
24
+ max = 100,
25
+ step = 1,
26
+ isDisabled = false,
27
+ orientation = 'horizontal',
28
+ accessibilityLabel,
29
+ accessibilityValue: accessibilityValueProp,
30
+ accessibilityRole = 'adjustable',
31
+ role = 'slider',
32
+ children,
33
+ onLayout,
34
+ ...props
35
+ }, ref) => {
36
+ const [trackLayout, setTrackLayoutState] = (0, _react.useState)(null);
37
+ const [thumbSize, setThumbSizeState] = (0, _react.useState)(20);
38
+ const [isDragging, setIsDragging] = (0, _react.useState)(false);
39
+ const [isHovered, setIsHovered] = (0, _react.useState)(false);
40
+ const [isFocusedState, setIsFocusedState] = (0, _react.useState)(false);
41
+ const thumbRef = (0, _react.useRef)(null);
42
+ const {
43
+ focusProps,
44
+ isFocused
45
+ } = (0, _focus.useFocus)();
46
+ const resolvedDefault = defaultValue ?? min;
47
+ const [value, setValueState] = (0, _utils.useControllableState)({
48
+ prop: valueProp,
49
+ defaultProp: resolvedDefault,
50
+ onChange
51
+ });
52
+ const currentValue = (0, _utils2.snapToStep)(value ?? resolvedDefault, min, max, step);
53
+ const percent = (0, _utils2.valueToPercent)(currentValue, min, max);
54
+ const setValue = (0, _react.useCallback)((next, complete = false) => {
55
+ if (isDisabled) {
56
+ return;
57
+ }
58
+ const snapped = (0, _utils2.snapToStep)(next, min, max, step);
59
+ setValueState(snapped);
60
+ if (complete) {
61
+ onChangeComplete?.(snapped);
62
+ }
63
+ }, [isDisabled, max, min, onChangeComplete, setValueState, step]);
64
+ const setValueFromRatio = (0, _react.useCallback)((ratio, complete = false) => {
65
+ const next = min + (0, _utils2.clamp)(ratio, 0, 1) * (max - min);
66
+ setValue(next, complete);
67
+ }, [max, min, setValue]);
68
+ const setTrackLayout = (0, _react.useCallback)(layout => {
69
+ setTrackLayoutState(prev => {
70
+ if (prev !== null && prev.width === layout.width && prev.height === layout.height && prev.x === layout.x && prev.y === layout.y) {
71
+ return prev;
72
+ }
73
+ return layout;
74
+ });
75
+ }, []);
76
+ const setThumbSize = (0, _react.useCallback)(size => {
77
+ setThumbSizeState(prev => prev === size ? prev : size);
78
+ }, []);
79
+ const accessibilityValue = (0, _react.useMemo)(() => {
80
+ const defaults = {
81
+ min,
82
+ max,
83
+ now: currentValue,
84
+ text: (0, _utils2.formatSliderValue)(currentValue)
85
+ };
86
+ if (accessibilityValueProp === undefined) {
87
+ return defaults;
88
+ }
89
+ return {
90
+ ...defaults,
91
+ ...accessibilityValueProp
92
+ };
93
+ }, [accessibilityValueProp, currentValue, max, min]);
94
+ const getValueLabel = (0, _react.useCallback)(() => accessibilityValue.text, [accessibilityValue.text]);
95
+ const handleKeyDown = (0, _react.useCallback)(event => {
96
+ if (isDisabled) {
97
+ return;
98
+ }
99
+ const key = event.nativeEvent.key;
100
+ if (!key || !STEP_KEYS.has(key)) {
101
+ return;
102
+ }
103
+ if (_reactNative.Platform.OS === 'web') {
104
+ event.preventDefault();
105
+ }
106
+ let next = currentValue;
107
+ if (key === 'ArrowUp' || key === 'ArrowRight') {
108
+ next = currentValue + step;
109
+ } else if (key === 'ArrowDown' || key === 'ArrowLeft') {
110
+ next = currentValue - step;
111
+ } else if (key === 'Home') {
112
+ next = min;
113
+ } else if (key === 'End') {
114
+ next = max;
115
+ }
116
+ setValue(next, true);
117
+ }, [currentValue, isDisabled, max, min, setValue, step]);
118
+ const contextValue = (0, _react.useMemo)(() => ({
119
+ value: currentValue,
120
+ min,
121
+ max,
122
+ step,
123
+ percent,
124
+ orientation,
125
+ isDisabled,
126
+ isDragging,
127
+ isHovered,
128
+ isFocused: isFocused || isFocusedState,
129
+ trackLayout,
130
+ thumbSize,
131
+ setValue,
132
+ setValueFromRatio,
133
+ setTrackLayout,
134
+ setThumbSize,
135
+ setIsDragging,
136
+ setIsHovered,
137
+ setIsFocused: setIsFocusedState,
138
+ getValueLabel,
139
+ thumbRef
140
+ }), [currentValue, getValueLabel, isDisabled, isDragging, isFocused, isFocusedState, isHovered, max, min, orientation, percent, setTrackLayout, setThumbSize, setValue, setValueFromRatio, step, thumbSize, trackLayout, thumbRef]);
141
+ const dataAttrs = (0, _dataAttributes.dataAttributes)({
142
+ slot: 'slider',
143
+ orientation,
144
+ disabled: isDisabled,
145
+ dragging: isDragging,
146
+ hover: isHovered,
147
+ focus: isFocused,
148
+ value: String(currentValue),
149
+ min: String(min),
150
+ max: String(max)
151
+ });
152
+ const Comp = asChild ? _slot.Slot : _reactNative.View;
153
+ const handleLayout = (0, _utils.composeEventHandlers)(onLayout, () => undefined);
154
+ const webKeyProps = _reactNative.Platform.OS === 'web' ? {
155
+ tabIndex: isDisabled ? -1 : 0,
156
+ onKeyDown: (0, _utils.composeEventHandlers)(props.onKeyDown, handleKeyDown)
157
+ } : {};
158
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_context.SliderProvider, {
159
+ value: contextValue,
160
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
161
+ ref: ref,
162
+ ...props,
163
+ ...focusProps,
164
+ ...webKeyProps,
165
+ onLayout: handleLayout,
166
+ onFocus: (0, _utils.composeEventHandlers)((0, _utils.composeEventHandlers)(props.onFocus, focusProps.onFocus), () => setIsFocusedState(true)),
167
+ onBlur: (0, _utils.composeEventHandlers)((0, _utils.composeEventHandlers)(props.onBlur, focusProps.onBlur), () => setIsFocusedState(false)),
168
+ accessibilityRole: accessibilityRole,
169
+ accessibilityLabel: accessibilityLabel,
170
+ accessibilityValue: accessibilityValue,
171
+ accessibilityState: {
172
+ disabled: isDisabled
173
+ },
174
+ "aria-valuemin": min,
175
+ "aria-valuemax": max,
176
+ "aria-valuenow": currentValue,
177
+ "aria-orientation": orientation,
178
+ "aria-disabled": isDisabled,
179
+ role: role,
180
+ ...dataAttrs,
181
+ children: children
182
+ })
183
+ });
184
+ });
185
+ SliderRoot.displayName = 'SliderRoot';
186
+ //# sourceMappingURL=SliderRoot.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","require","_reactNative","_utils","_focus","_slot","_dataAttributes","_context","_utils2","_jsxRuntime","STEP_KEYS","Set","SliderRoot","exports","forwardRef","asChild","value","valueProp","defaultValue","onChange","onChangeComplete","min","max","step","isDisabled","orientation","accessibilityLabel","accessibilityValue","accessibilityValueProp","accessibilityRole","role","children","onLayout","props","ref","trackLayout","setTrackLayoutState","useState","thumbSize","setThumbSizeState","isDragging","setIsDragging","isHovered","setIsHovered","isFocusedState","setIsFocusedState","thumbRef","useRef","focusProps","isFocused","useFocus","resolvedDefault","setValueState","useControllableState","prop","defaultProp","currentValue","snapToStep","percent","valueToPercent","setValue","useCallback","next","complete","snapped","setValueFromRatio","ratio","clamp","setTrackLayout","layout","prev","width","height","x","y","setThumbSize","size","useMemo","defaults","now","text","formatSliderValue","undefined","getValueLabel","handleKeyDown","event","key","nativeEvent","has","Platform","OS","preventDefault","contextValue","setIsFocused","dataAttrs","dataAttributes","slot","disabled","dragging","hover","focus","String","Comp","Slot","View","handleLayout","composeEventHandlers","webKeyProps","tabIndex","onKeyDown","jsx","SliderProvider","onFocus","onBlur","accessibilityState","displayName"],"sourceRoot":"../../../src","sources":["slider/SliderRoot.tsx"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,228 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.SliderThumb = void 0;
7
+ var _react = require("react");
8
+ var _reactNative = require("react-native");
9
+ var _utils = require("@cdx-ui/utils");
10
+ var _focus = require("@react-native-aria/focus");
11
+ var _interactions = require("@react-native-aria/interactions");
12
+ var _slot = require("../slot");
13
+ var _assignRef = require("../utils/assignRef");
14
+ var _dataAttributes = require("../utils/dataAttributes");
15
+ var _context = require("./context");
16
+ var _useSliderPointer = require("./useSliderPointer");
17
+ var _utils2 = require("./utils");
18
+ var _jsxRuntime = require("react/jsx-runtime");
19
+ const SliderThumb = exports.SliderThumb = /*#__PURE__*/(0, _react.forwardRef)(({
20
+ asChild,
21
+ style,
22
+ onLayout,
23
+ onHoverIn,
24
+ onHoverOut,
25
+ onFocus,
26
+ onBlur,
27
+ onPressIn,
28
+ onPressOut,
29
+ children,
30
+ ...props
31
+ }, ref) => {
32
+ const {
33
+ percent,
34
+ orientation,
35
+ isDisabled,
36
+ isDragging,
37
+ trackLayout,
38
+ thumbSize,
39
+ setValueFromRatio,
40
+ setIsDragging,
41
+ setIsHovered,
42
+ setIsFocused,
43
+ setThumbSize,
44
+ thumbRef
45
+ } = (0, _context.useSliderContext)();
46
+ const percentRef = (0, _react.useRef)(percent);
47
+ percentRef.current = percent;
48
+ const dragStartRatio = (0, _react.useRef)(0);
49
+ const lastRatioRef = (0, _react.useRef)(percent / 100);
50
+
51
+ // The native PanResponder is created once (stable across renders) so an
52
+ // in-flight gesture is never handed a fresh internal `gestureState`
53
+ // mid-drag. In controlled mode `setValueFromRatio`/`trackLayout` change
54
+ // identity on every value update, so the handlers read the current values
55
+ // through refs instead of closing over them (which would force the
56
+ // `useMemo` to re-create the responder on every move and reset `dx`).
57
+ const orientationRef = (0, _react.useRef)(orientation);
58
+ orientationRef.current = orientation;
59
+ const trackLayoutRef = (0, _react.useRef)(trackLayout);
60
+ trackLayoutRef.current = trackLayout;
61
+ const thumbSizeRef = (0, _react.useRef)(thumbSize);
62
+ thumbSizeRef.current = thumbSize;
63
+ const isDisabledRef = (0, _react.useRef)(isDisabled);
64
+ isDisabledRef.current = isDisabled;
65
+ const setValueFromRatioRef = (0, _react.useRef)(setValueFromRatio);
66
+ setValueFromRatioRef.current = setValueFromRatio;
67
+ const setIsDraggingRef = (0, _react.useRef)(setIsDragging);
68
+ setIsDraggingRef.current = setIsDragging;
69
+ const {
70
+ hoverProps,
71
+ isHovered
72
+ } = (0, _interactions.useHover)();
73
+ const {
74
+ focusProps,
75
+ isFocused
76
+ } = (0, _focus.useFocus)();
77
+ const {
78
+ isFocusVisible,
79
+ focusProps: focusRingProps
80
+ } = (0, _focus.useFocusRing)();
81
+ const {
82
+ pressProps: pressableProps,
83
+ isPressed
84
+ } = (0, _interactions.usePress)({
85
+ isDisabled
86
+ });
87
+ const {
88
+ startDrag
89
+ } = (0, _useSliderPointer.useWebSliderDrag)({
90
+ isDisabled,
91
+ setIsDragging,
92
+ setValueFromRatio,
93
+ trackLayout,
94
+ orientation,
95
+ thumbSize
96
+ });
97
+ const panResponder = (0, _react.useMemo)(() => _reactNative.PanResponder.create({
98
+ onStartShouldSetPanResponder: () => !isDisabledRef.current,
99
+ onMoveShouldSetPanResponder: () => !isDisabledRef.current,
100
+ onPanResponderGrant: () => {
101
+ if (isDisabledRef.current) {
102
+ return;
103
+ }
104
+ setIsDraggingRef.current(true);
105
+ dragStartRatio.current = percentRef.current / 100;
106
+ lastRatioRef.current = dragStartRatio.current;
107
+ },
108
+ onPanResponderMove: (_event, gestureState) => {
109
+ const layout = trackLayoutRef.current;
110
+ if (!layout) {
111
+ return;
112
+ }
113
+ const isHorizontal = orientationRef.current === 'horizontal';
114
+ const trackSize = isHorizontal ? layout.width : layout.height;
115
+ const travel = (0, _utils2.getThumbTravel)(trackSize, thumbSizeRef.current);
116
+ if (travel <= 0) {
117
+ return;
118
+ }
119
+ const delta = isHorizontal ? gestureState.dx : -gestureState.dy;
120
+ const nextRatio = (0, _utils2.clamp)(dragStartRatio.current + delta / travel, 0, 1);
121
+ lastRatioRef.current = nextRatio;
122
+ setValueFromRatioRef.current(nextRatio);
123
+ },
124
+ onPanResponderRelease: () => {
125
+ setIsDraggingRef.current(false);
126
+ setValueFromRatioRef.current(lastRatioRef.current, true);
127
+ },
128
+ onPanResponderTerminate: () => {
129
+ setIsDraggingRef.current(false);
130
+ setValueFromRatioRef.current(lastRatioRef.current, true);
131
+ }
132
+ }), []);
133
+ const thumbStyle = (0, _react.useMemo)(() => {
134
+ const trackSize = trackLayout == null ? 0 : orientation === 'horizontal' ? trackLayout.width : trackLayout.height;
135
+ const offset = (0, _utils2.percentToThumbOffset)(percent, trackSize, thumbSize);
136
+ if (orientation === 'vertical') {
137
+ return {
138
+ position: 'absolute',
139
+ left: '50%',
140
+ bottom: offset,
141
+ marginLeft: -thumbSize / 2,
142
+ zIndex: 2
143
+ };
144
+ }
145
+ return {
146
+ position: 'absolute',
147
+ top: '50%',
148
+ left: offset,
149
+ transform: [{
150
+ translateY: -thumbSize / 2
151
+ }],
152
+ zIndex: 2
153
+ };
154
+ }, [orientation, percent, thumbSize, trackLayout]);
155
+ const handleLayout = (0, _react.useCallback)(event => {
156
+ const {
157
+ width,
158
+ height
159
+ } = event.nativeEvent.layout;
160
+ const measured = orientation === 'horizontal' ? width : height;
161
+ if (measured > 0) {
162
+ setThumbSize(measured);
163
+ }
164
+ if (onLayout) {
165
+ onLayout(event);
166
+ }
167
+ }, [onLayout, orientation, setThumbSize]);
168
+ const handlePointerDown = (0, _react.useCallback)(event => {
169
+ if (_reactNative.Platform.OS !== 'web' || isDisabled) {
170
+ return;
171
+ }
172
+ event.preventDefault();
173
+ event.stopPropagation();
174
+ const {
175
+ x,
176
+ y
177
+ } = (0, _useSliderPointer.getPointerCoords)(event.nativeEvent);
178
+ startDrag(x, y, percentRef.current / 100);
179
+ }, [isDisabled, startDrag]);
180
+ const isWeb = _reactNative.Platform.OS === 'web';
181
+
182
+ // Native drag is driven by PanResponder. Its `panHandlers` set the same
183
+ // responder props (`onResponderGrant/Move/Release`, etc.) that RN's
184
+ // `Pressable`/`Pressability` also set internally — and `Pressable` spreads
185
+ // its own handlers last, silently clobbering ours. So on native the thumb
186
+ // must be a plain `View` that carries `panHandlers` directly. Web keeps
187
+ // `Pressable` for its pointer-event, hover, and focus-ring behavior.
188
+ const Comp = asChild ? _slot.Slot : isWeb ? _reactNative.Pressable : _reactNative.View;
189
+ const setThumbRef = (0, _react.useCallback)(node => {
190
+ thumbRef.current = node;
191
+ (0, _assignRef.assignRef)(ref, node);
192
+ }, [ref, thumbRef]);
193
+ const webInteractionProps = {
194
+ onPointerDown: handlePointerDown,
195
+ onHoverIn: (0, _utils.composeEventHandlers)(onHoverIn, (0, _utils.composeEventHandlers)(hoverProps.onHoverIn, () => setIsHovered(true))),
196
+ onHoverOut: (0, _utils.composeEventHandlers)(onHoverOut, (0, _utils.composeEventHandlers)(hoverProps.onHoverOut, () => setIsHovered(false))),
197
+ onPressIn: (0, _utils.composeEventHandlers)(onPressIn, pressableProps.onPressIn),
198
+ onPressOut: (0, _utils.composeEventHandlers)(onPressOut, pressableProps.onPressOut),
199
+ disabled: isDisabled,
200
+ tabIndex: -1
201
+ };
202
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
203
+ ref: setThumbRef,
204
+ ...props,
205
+ ...(isWeb ? webInteractionProps : panResponder.panHandlers),
206
+ onLayout: handleLayout,
207
+ onFocus: (0, _utils.composeEventHandlers)((0, _utils.composeEventHandlers)(onFocus, focusProps.onFocus), (0, _utils.composeEventHandlers)(focusRingProps.onFocus, () => setIsFocused(true))),
208
+ onBlur: (0, _utils.composeEventHandlers)((0, _utils.composeEventHandlers)(onBlur, focusProps.onBlur), (0, _utils.composeEventHandlers)(focusRingProps.onBlur, () => setIsFocused(false))),
209
+ style: [thumbStyle, style],
210
+ accessibilityRole: "none",
211
+ importantForAccessibility: "no",
212
+ ...(0, _dataAttributes.dataAttributes)({
213
+ slot: 'slider-thumb',
214
+ hover: isHovered,
215
+ focus: isFocused,
216
+ focusVisible: isFocusVisible,
217
+ // On native there is no `Pressable`, so `usePress` never fires; the
218
+ // drag state stands in for "active" so the thumb still scales while
219
+ // the user is dragging (see `data-[active=true]:scale-105`).
220
+ active: isPressed || isDragging,
221
+ dragging: isDragging,
222
+ disabled: isDisabled
223
+ }),
224
+ children: children
225
+ });
226
+ });
227
+ SliderThumb.displayName = 'SliderThumb';
228
+ //# sourceMappingURL=SliderThumb.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","require","_reactNative","_utils","_focus","_interactions","_slot","_assignRef","_dataAttributes","_context","_useSliderPointer","_utils2","_jsxRuntime","SliderThumb","exports","forwardRef","asChild","style","onLayout","onHoverIn","onHoverOut","onFocus","onBlur","onPressIn","onPressOut","children","props","ref","percent","orientation","isDisabled","isDragging","trackLayout","thumbSize","setValueFromRatio","setIsDragging","setIsHovered","setIsFocused","setThumbSize","thumbRef","useSliderContext","percentRef","useRef","current","dragStartRatio","lastRatioRef","orientationRef","trackLayoutRef","thumbSizeRef","isDisabledRef","setValueFromRatioRef","setIsDraggingRef","hoverProps","isHovered","useHover","focusProps","isFocused","useFocus","isFocusVisible","focusRingProps","useFocusRing","pressProps","pressableProps","isPressed","usePress","startDrag","useWebSliderDrag","panResponder","useMemo","PanResponder","create","onStartShouldSetPanResponder","onMoveShouldSetPanResponder","onPanResponderGrant","onPanResponderMove","_event","gestureState","layout","isHorizontal","trackSize","width","height","travel","getThumbTravel","delta","dx","dy","nextRatio","clamp","onPanResponderRelease","onPanResponderTerminate","thumbStyle","offset","percentToThumbOffset","position","left","bottom","marginLeft","zIndex","top","transform","translateY","handleLayout","useCallback","event","nativeEvent","measured","handlePointerDown","Platform","OS","preventDefault","stopPropagation","x","y","getPointerCoords","isWeb","Comp","Slot","Pressable","View","setThumbRef","node","assignRef","webInteractionProps","onPointerDown","composeEventHandlers","disabled","tabIndex","jsx","panHandlers","accessibilityRole","importantForAccessibility","dataAttributes","slot","hover","focus","focusVisible","active","dragging","displayName"],"sourceRoot":"../../../src","sources":["slider/SliderThumb.tsx"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,11 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useSliderContext = exports.SliderProvider = void 0;
7
+ var _utils = require("@cdx-ui/utils");
8
+ const [SliderProvider, useSliderContext] = (0, _utils.createContext)('SliderContext');
9
+ exports.useSliderContext = useSliderContext;
10
+ exports.SliderProvider = SliderProvider;
11
+ //# sourceMappingURL=context.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_utils","require","SliderProvider","useSliderContext","createContext","exports"],"sourceRoot":"../../../src","sources":["slider/context.tsx"],"mappings":";;;;;;AAEA,IAAAA,MAAA,GAAAC,OAAA;AAkCO,MAAM,CAACC,cAAc,EAAEC,gBAAgB,CAAC,GAC7C,IAAAC,oBAAa,EAAqB,eAAe,CAAC;AAACC,OAAA,CAAAF,gBAAA,GAAAA,gBAAA;AAAAE,OAAA,CAAAH,cAAA,GAAAA,cAAA","ignoreList":[]}
@@ -0,0 +1,65 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "SLIDER_MARKER_SIZE", {
7
+ enumerable: true,
8
+ get: function () {
9
+ return _utils.SLIDER_MARKER_SIZE;
10
+ }
11
+ });
12
+ Object.defineProperty(exports, "SliderRail", {
13
+ enumerable: true,
14
+ get: function () {
15
+ return _SliderRail.SliderRail;
16
+ }
17
+ });
18
+ Object.defineProperty(exports, "SliderRoot", {
19
+ enumerable: true,
20
+ get: function () {
21
+ return _SliderRoot.SliderRoot;
22
+ }
23
+ });
24
+ Object.defineProperty(exports, "SliderThumb", {
25
+ enumerable: true,
26
+ get: function () {
27
+ return _SliderThumb.SliderThumb;
28
+ }
29
+ });
30
+ Object.defineProperty(exports, "getMarkerPositionStyle", {
31
+ enumerable: true,
32
+ get: function () {
33
+ return _utils.getMarkerPositionStyle;
34
+ }
35
+ });
36
+ Object.defineProperty(exports, "getMarkerStepValues", {
37
+ enumerable: true,
38
+ get: function () {
39
+ return _utils.getMarkerStepValues;
40
+ }
41
+ });
42
+ Object.defineProperty(exports, "percentToFillExtent", {
43
+ enumerable: true,
44
+ get: function () {
45
+ return _utils.percentToFillExtent;
46
+ }
47
+ });
48
+ Object.defineProperty(exports, "useSliderContext", {
49
+ enumerable: true,
50
+ get: function () {
51
+ return _context.useSliderContext;
52
+ }
53
+ });
54
+ Object.defineProperty(exports, "valueToPercent", {
55
+ enumerable: true,
56
+ get: function () {
57
+ return _utils.valueToPercent;
58
+ }
59
+ });
60
+ var _context = require("./context");
61
+ var _SliderRoot = require("./SliderRoot");
62
+ var _SliderRail = require("./SliderRail");
63
+ var _SliderThumb = require("./SliderThumb");
64
+ var _utils = require("./utils");
65
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_context","require","_SliderRoot","_SliderRail","_SliderThumb","_utils"],"sourceRoot":"../../../src","sources":["slider/index.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AACA,IAAAG,YAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA","ignoreList":[]}
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":[],"sourceRoot":"../../../src","sources":["slider/types.ts"],"mappings":"","ignoreList":[]}
@@ -0,0 +1,116 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.getPointerCoords = getPointerCoords;
7
+ exports.getRatioFromPagePoint = getRatioFromPagePoint;
8
+ exports.useWebSliderDrag = useWebSliderDrag;
9
+ var _react = require("react");
10
+ var _reactNative = require("react-native");
11
+ var _utils = require("./utils");
12
+ function getPointerCoords(nativeEvent) {
13
+ if (_reactNative.Platform.OS === 'web' && nativeEvent.clientX != null && nativeEvent.clientY != null) {
14
+ return {
15
+ x: nativeEvent.clientX,
16
+ y: nativeEvent.clientY
17
+ };
18
+ }
19
+ return {
20
+ x: nativeEvent.pageX ?? 0,
21
+ y: nativeEvent.pageY ?? 0
22
+ };
23
+ }
24
+ function getRatioFromPagePoint(pageX, pageY, trackLayout, orientation, thumbSize) {
25
+ if (!trackLayout) {
26
+ return 0;
27
+ }
28
+ if (orientation === 'horizontal') {
29
+ return (0, _utils.pointerCoordToRatio)(pageX, trackLayout.x, trackLayout.width, thumbSize);
30
+ }
31
+ return (0, _utils.pointerCoordToVerticalRatio)(pageY, trackLayout.y, trackLayout.height, thumbSize);
32
+ }
33
+ function useWebSliderDrag({
34
+ isDisabled,
35
+ setIsDragging,
36
+ setValueFromRatio,
37
+ trackLayout,
38
+ orientation,
39
+ thumbSize
40
+ }) {
41
+ const draggingRef = (0, _react.useRef)(false);
42
+ const lastRatioRef = (0, _react.useRef)(0);
43
+ const dragContextRef = (0, _react.useRef)(null);
44
+ const cleanupRef = (0, _react.useRef)(null);
45
+ (0, _react.useEffect)(() => {
46
+ return () => {
47
+ cleanupRef.current?.();
48
+ cleanupRef.current = null;
49
+ };
50
+ }, []);
51
+ const endDrag = (0, _react.useCallback)(() => {
52
+ if (!draggingRef.current) {
53
+ return;
54
+ }
55
+ draggingRef.current = false;
56
+ dragContextRef.current = null;
57
+ setIsDragging(false);
58
+ setValueFromRatio(lastRatioRef.current, true);
59
+ }, [setIsDragging, setValueFromRatio]);
60
+ const startDrag = (0, _react.useCallback)((pageX, pageY, anchorRatio, trackLayoutOverride) => {
61
+ if (isDisabled || _reactNative.Platform.OS !== 'web' || typeof window === 'undefined') {
62
+ return;
63
+ }
64
+ const layout = trackLayoutOverride ?? trackLayout;
65
+ if (!layout) {
66
+ return;
67
+ }
68
+ const trackSize = orientation === 'horizontal' ? layout.width : layout.height;
69
+ const travel = (0, _utils.getThumbTravel)(trackSize, thumbSize);
70
+ if (travel <= 0) {
71
+ return;
72
+ }
73
+ const startPointer = orientation === 'horizontal' ? pageX : pageY;
74
+ const startRatio = anchorRatio != null ? (0, _utils.clamp)(anchorRatio, 0, 1) : getRatioFromPagePoint(pageX, pageY, layout, orientation, thumbSize);
75
+ lastRatioRef.current = startRatio;
76
+ draggingRef.current = true;
77
+ dragContextRef.current = {
78
+ startPointer,
79
+ startRatio,
80
+ travel
81
+ };
82
+ setIsDragging(true);
83
+ setValueFromRatio(startRatio);
84
+ const onMove = event => {
85
+ if (!draggingRef.current || !dragContextRef.current) {
86
+ return;
87
+ }
88
+ event.preventDefault();
89
+ const pointer = orientation === 'horizontal' ? event.clientX : event.clientY;
90
+ const delta = pointer - dragContextRef.current.startPointer;
91
+ const deltaAlongTrack = orientation === 'horizontal' ? delta : -delta;
92
+ const nextRatio = (0, _utils.clamp)(dragContextRef.current.startRatio + deltaAlongTrack / dragContextRef.current.travel, 0, 1);
93
+ lastRatioRef.current = nextRatio;
94
+ setValueFromRatio(nextRatio);
95
+ };
96
+ const onUp = () => {
97
+ cleanupRef.current = null;
98
+ window.removeEventListener('pointermove', onMove);
99
+ window.removeEventListener('pointerup', onUp);
100
+ window.removeEventListener('pointercancel', onUp);
101
+ endDrag();
102
+ };
103
+ window.addEventListener('pointermove', onMove);
104
+ window.addEventListener('pointerup', onUp);
105
+ window.addEventListener('pointercancel', onUp);
106
+ cleanupRef.current = () => {
107
+ window.removeEventListener('pointermove', onMove);
108
+ window.removeEventListener('pointerup', onUp);
109
+ window.removeEventListener('pointercancel', onUp);
110
+ };
111
+ }, [endDrag, isDisabled, orientation, setIsDragging, setValueFromRatio, thumbSize, trackLayout]);
112
+ return {
113
+ startDrag
114
+ };
115
+ }
116
+ //# sourceMappingURL=useSliderPointer.js.map