@jamadd/react-native-template-ui 0.6.2 → 0.7.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/module/components/slider/ThemedSlider.js +45 -19
- package/lib/module/components/slider/ThemedSlider.js.map +1 -1
- package/lib/module/components/slider/ThemedSliderStepIndicator.js +22 -0
- package/lib/module/components/slider/ThemedSliderStepIndicator.js.map +1 -0
- package/lib/module/utils/slider/const.js +7 -5
- package/lib/module/utils/slider/const.js.map +1 -1
- package/lib/typescript/src/components/slider/ThemedSlider.d.ts.map +1 -1
- package/lib/typescript/src/components/slider/ThemedSliderStepIndicator.d.ts +4 -0
- package/lib/typescript/src/components/slider/ThemedSliderStepIndicator.d.ts.map +1 -0
- package/lib/typescript/src/types/slider.d.ts +15 -5
- package/lib/typescript/src/types/slider.d.ts.map +1 -1
- package/lib/typescript/src/utils/slider/const.d.ts +3 -1
- package/lib/typescript/src/utils/slider/const.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -1,20 +1,24 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
import { useMappingHelper } from '@shopify/flash-list';
|
|
3
4
|
import { useDeferredValue, useLayoutEffect, useState } from 'react';
|
|
4
5
|
import { Gesture, GestureDetector } from 'react-native-gesture-handler';
|
|
5
6
|
import { useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
|
|
6
7
|
import { scheduleOnRN } from 'react-native-worklets';
|
|
7
8
|
import { useViewRef } from "../../hooks/view.js";
|
|
8
|
-
import {
|
|
9
|
+
import { sliderStepIndicatorDefaultWidth, SliderThumbSize, SliderTrackSize, SliderValueDisplayMode } from "../../utils/slider/const.js";
|
|
9
10
|
import AnimatedThemedView from "../view/AnimatedThemedView.js";
|
|
10
11
|
import ThemedView from "../view/ThemedView.js";
|
|
11
12
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
13
|
const ThemedText = require('../text/ThemedText').default;
|
|
14
|
+
const ThemedSliderStepIndicator = require('./ThemedSliderStepIndicator').default;
|
|
13
15
|
const ThemedSlider = ({
|
|
14
16
|
range,
|
|
15
17
|
steps = 1,
|
|
16
|
-
|
|
17
|
-
|
|
18
|
+
defaultValue,
|
|
19
|
+
stepIndicator,
|
|
20
|
+
stepIndicatorProps,
|
|
21
|
+
snapToStepAnimated = true,
|
|
18
22
|
onValueChange,
|
|
19
23
|
trackSize = SliderTrackSize.M,
|
|
20
24
|
trackActiveColor = 'themePri',
|
|
@@ -24,19 +28,26 @@ const ThemedSlider = ({
|
|
|
24
28
|
thumbSize = SliderThumbSize.M,
|
|
25
29
|
thumbColor = 'themePri',
|
|
26
30
|
thumbProps,
|
|
27
|
-
|
|
28
|
-
|
|
31
|
+
valueDisplayMode = SliderValueDisplayMode.None,
|
|
32
|
+
valueDisplayWrapProps,
|
|
33
|
+
valueTextProps,
|
|
34
|
+
valueDescription,
|
|
35
|
+
valueDescriptionTextProps,
|
|
36
|
+
wrapProps
|
|
29
37
|
}) => {
|
|
30
38
|
const isNumRange = typeof range[0] === 'number';
|
|
31
39
|
const processedRange = isNumRange ? range.sort() : range;
|
|
32
40
|
const totalSteps = isNumRange ? Math.abs(processedRange[1] - processedRange[0]) / steps : processedRange.length - 1;
|
|
33
41
|
const thumbSizeHalf = thumbSize / 2;
|
|
42
|
+
const {
|
|
43
|
+
getMappingKey
|
|
44
|
+
} = useMappingHelper();
|
|
34
45
|
const sliderViewRef = useViewRef();
|
|
35
46
|
const trackViewRef = useViewRef();
|
|
36
47
|
const [sliderWidth, setSliderWidth] = useState();
|
|
37
48
|
const [trackWidth, setTrackWidth] = useState();
|
|
38
49
|
const [stepWidth, setStepWidth] = useState();
|
|
39
|
-
const [selectedVal, setSelectedVal] = useState(
|
|
50
|
+
const [selectedVal, setSelectedVal] = useState(defaultValue);
|
|
40
51
|
const deferredSelectedValue = useDeferredValue(selectedVal);
|
|
41
52
|
const xSharedVal = useSharedValue(-(trackWidth ?? 0));
|
|
42
53
|
const trackAnimatedStyle = useAnimatedStyle(() => ({
|
|
@@ -60,20 +71,19 @@ const ThemedSlider = ({
|
|
|
60
71
|
const tempStepWidth = tempWidth / totalSteps;
|
|
61
72
|
setTrackWidth(tempWidth);
|
|
62
73
|
setStepWidth(tempStepWidth);
|
|
63
|
-
setSelectedVal(currentValue);
|
|
64
74
|
let index = 0;
|
|
65
75
|
if (isNumRange) {
|
|
66
76
|
const numRange = processedRange;
|
|
67
|
-
const numCurrentValue =
|
|
77
|
+
const numCurrentValue = selectedVal;
|
|
68
78
|
index = numCurrentValue ? (numCurrentValue - numRange[0]) / steps : 0;
|
|
69
79
|
} else {
|
|
70
80
|
const strRange = processedRange;
|
|
71
|
-
const strCurrentValue =
|
|
81
|
+
const strCurrentValue = selectedVal;
|
|
72
82
|
index = strCurrentValue ? strRange.indexOf(strCurrentValue) : 0;
|
|
73
83
|
}
|
|
74
84
|
xSharedVal.set(-(totalSteps - index) * tempStepWidth);
|
|
75
85
|
});
|
|
76
|
-
}, [
|
|
86
|
+
}, [thumbSize, isNumRange, processedRange, totalSteps]);
|
|
77
87
|
const wrapStyle = {
|
|
78
88
|
marginHorizontal: thumbSizeHalf
|
|
79
89
|
};
|
|
@@ -115,7 +125,7 @@ const ThemedSlider = ({
|
|
|
115
125
|
const touch = allTouches[0];
|
|
116
126
|
if (touch && sliderWidth && stepWidth) {
|
|
117
127
|
const nearestStep = Math.round(-(sliderWidth - (touch.x + thumbSize + thumbSizeHalf)) / stepWidth);
|
|
118
|
-
updateXSharedVal(nearestStep * stepWidth,
|
|
128
|
+
updateXSharedVal(nearestStep * stepWidth, snapToStepAnimated);
|
|
119
129
|
}
|
|
120
130
|
}), Gesture.Pan().onChange(({
|
|
121
131
|
changeX
|
|
@@ -124,18 +134,31 @@ const ThemedSlider = ({
|
|
|
124
134
|
}).onEnd(() => {
|
|
125
135
|
if (stepWidth) {
|
|
126
136
|
const nearestStep = Math.round(xSharedVal.get() / stepWidth);
|
|
127
|
-
updateXSharedVal(nearestStep * stepWidth,
|
|
137
|
+
updateXSharedVal(nearestStep * stepWidth, snapToStepAnimated);
|
|
128
138
|
}
|
|
129
139
|
}));
|
|
130
|
-
const
|
|
140
|
+
const valueDisplayComponent = valueDisplayMode !== SliderValueDisplayMode.None && /*#__PURE__*/_jsxs(ThemedView, {
|
|
141
|
+
flexDirection: 'row',
|
|
142
|
+
alignItems: 'center',
|
|
143
|
+
alignSelf: 'stretch',
|
|
131
144
|
marginTop: 's',
|
|
132
|
-
...
|
|
133
|
-
children:
|
|
145
|
+
...valueDisplayWrapProps,
|
|
146
|
+
children: [!!valueDescription && /*#__PURE__*/_jsx(ThemedText, {
|
|
147
|
+
flex: 1,
|
|
148
|
+
textAlign: 'center',
|
|
149
|
+
...valueDescriptionTextProps,
|
|
150
|
+
children: valueDescription
|
|
151
|
+
}), /*#__PURE__*/_jsx(ThemedText, {
|
|
152
|
+
flex: 1,
|
|
153
|
+
textAlign: 'center',
|
|
154
|
+
...valueTextProps,
|
|
155
|
+
children: deferredSelectedValue
|
|
156
|
+
})]
|
|
134
157
|
});
|
|
135
158
|
return /*#__PURE__*/_jsxs(ThemedView, {
|
|
136
159
|
ref: sliderViewRef,
|
|
137
160
|
alignItems: 'center',
|
|
138
|
-
children: [
|
|
161
|
+
children: [valueDisplayMode === SliderValueDisplayMode.Top && valueDisplayComponent, /*#__PURE__*/_jsx(GestureDetector, {
|
|
139
162
|
gesture: gesture,
|
|
140
163
|
children: /*#__PURE__*/_jsxs(ThemedView, {
|
|
141
164
|
ref: trackViewRef,
|
|
@@ -144,7 +167,6 @@ const ThemedSlider = ({
|
|
|
144
167
|
alignSelf: 'stretch',
|
|
145
168
|
height: thumbSize,
|
|
146
169
|
style: wrapStyle,
|
|
147
|
-
backgroundColor: 'themeSec',
|
|
148
170
|
...wrapProps,
|
|
149
171
|
children: [/*#__PURE__*/_jsx(ThemedView, {
|
|
150
172
|
position: 'absolute',
|
|
@@ -159,7 +181,11 @@ const ThemedSlider = ({
|
|
|
159
181
|
style: trackAnimatedStyle,
|
|
160
182
|
...trackInactiveProps
|
|
161
183
|
})
|
|
162
|
-
}), /*#__PURE__*/_jsx(
|
|
184
|
+
}), !!stepIndicator && processedRange.map((value, index) => /*#__PURE__*/_jsx(ThemedSliderStepIndicator, {
|
|
185
|
+
left: index * (stepWidth ?? 0) + thumbSizeHalf - sliderStepIndicatorDefaultWidth / 2,
|
|
186
|
+
height: thumbSize,
|
|
187
|
+
...stepIndicatorProps
|
|
188
|
+
}, getMappingKey(value, index))), /*#__PURE__*/_jsx(AnimatedThemedView, {
|
|
163
189
|
position: 'absolute',
|
|
164
190
|
right: -thumbSizeHalf,
|
|
165
191
|
width: thumbSize,
|
|
@@ -170,7 +196,7 @@ const ThemedSlider = ({
|
|
|
170
196
|
...thumbProps
|
|
171
197
|
})]
|
|
172
198
|
})
|
|
173
|
-
}),
|
|
199
|
+
}), valueDisplayMode === SliderValueDisplayMode.Bottom && valueDisplayComponent]
|
|
174
200
|
});
|
|
175
201
|
};
|
|
176
202
|
export default ThemedSlider;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useDeferredValue","useLayoutEffect","useState","Gesture","GestureDetector","useAnimatedStyle","useSharedValue","withTiming","scheduleOnRN","useViewRef","
|
|
1
|
+
{"version":3,"names":["useMappingHelper","useDeferredValue","useLayoutEffect","useState","Gesture","GestureDetector","useAnimatedStyle","useSharedValue","withTiming","scheduleOnRN","useViewRef","sliderStepIndicatorDefaultWidth","SliderThumbSize","SliderTrackSize","SliderValueDisplayMode","AnimatedThemedView","ThemedView","jsx","_jsx","jsxs","_jsxs","ThemedText","require","default","ThemedSliderStepIndicator","ThemedSlider","range","steps","defaultValue","stepIndicator","stepIndicatorProps","snapToStepAnimated","onValueChange","trackSize","M","trackActiveColor","trackActiveProps","trackInactiveColor","trackInactiveProps","thumbSize","thumbColor","thumbProps","valueDisplayMode","None","valueDisplayWrapProps","valueTextProps","valueDescription","valueDescriptionTextProps","wrapProps","isNumRange","processedRange","sort","totalSteps","Math","abs","length","thumbSizeHalf","getMappingKey","sliderViewRef","trackViewRef","sliderWidth","setSliderWidth","trackWidth","setTrackWidth","stepWidth","setStepWidth","selectedVal","setSelectedVal","deferredSelectedValue","xSharedVal","trackAnimatedStyle","transform","translateX","get","thumbAnimatedStyle","current","measure","_x","_y","w","tempWidth","tempStepWidth","index","numRange","numCurrentValue","strRange","strCurrentValue","indexOf","set","wrapStyle","marginHorizontal","updateSelectedVal","x","numIndex","round","tempSelectedVal","strIndex","updateXSharedVal","animated","tempX","min","max","gesture","Simultaneous","Tap","onTouchesDown","allTouches","touch","onTouchesUp","nearestStep","Pan","onChange","changeX","onEnd","valueDisplayComponent","flexDirection","alignItems","alignSelf","marginTop","children","flex","textAlign","ref","Top","justifyContent","height","style","position","width","overflow","backgroundColor","map","value","left","right","aspectRatio","opacity","Bottom"],"sourceRoot":"../../../../src","sources":["components/slider/ThemedSlider.tsx"],"mappings":";;AAAA,SAASA,gBAAgB,QAAQ,qBAAqB;AACtD,SAASC,gBAAgB,EAAEC,eAAe,EAAEC,QAAQ,QAAiB,OAAO;AAC5E,SAASC,OAAO,EAAEC,eAAe,QAAQ,8BAA8B;AACvE,SACEC,gBAAgB,EAChBC,cAAc,EACdC,UAAU,QACL,yBAAyB;AAChC,SAASC,YAAY,QAAQ,uBAAuB;AACpD,SAASC,UAAU,QAAQ,qBAAkB;AAS7C,SACEC,+BAA+B,EAC/BC,eAAe,EACfC,eAAe,EACfC,sBAAsB,QACjB,6BAA0B;AACjC,OAAOC,kBAAkB,MAAM,+BAA4B;AAC3D,OAAOC,UAAU,MAAM,uBAAoB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE5C,MAAMC,UAA+B,GAAGC,OAAO,CAAC,oBAAoB,CAAC,CAACC,OAAO;AAC7E,MAAMC,yBAA6D,GACjEF,OAAO,CAAC,6BAA6B,CAAC,CAACC,OAAO;AAEhD,MAAME,YAAmC,GAAGA,CAAC;EAC3CC,KAAK;EACLC,KAAK,GAAG,CAAC;EACTC,YAAY;EACZC,aAAa;EACbC,kBAAkB;EAClBC,kBAAkB,GAAG,IAAI;EAEzBC,aAAa;EACbC,SAAS,GAAGpB,eAAe,CAACqB,CAAC;EAC7BC,gBAAgB,GAAG,UAAU;EAC7BC,gBAAgB;EAChBC,kBAAkB,GAAG,WAAW;EAChCC,kBAAkB;EAClBC,SAAS,GAAG3B,eAAe,CAACsB,CAAC;EAC7BM,UAAU,GAAG,UAAU;EACvBC,UAAU;EACVC,gBAAgB,GAAG5B,sBAAsB,CAAC6B,IAAI;EAC9CC,qBAAqB;EACrBC,cAAc;EACdC,gBAAgB;EAChBC,yBAAyB;EACzBC;AACF,CAAC,KAAK;EACJ,MAAMC,UAAU,GAAG,OAAOvB,KAAK,CAAC,CAAC,CAAC,KAAK,QAAQ;EAC/C,MAAMwB,cAAc,GAAGD,UAAU,GAAGvB,KAAK,CAACyB,IAAI,CAAC,CAAC,GAAGzB,KAAK;EACxD,MAAM0B,UAAU,GAAGH,UAAU,GACzBI,IAAI,CAACC,GAAG,CACLJ,cAAc,CAA2B,CAAC,CAAC,GACzCA,cAAc,CAA2B,CAAC,CAC/C,CAAC,GAAGvB,KAAK,GACTuB,cAAc,CAACK,MAAM,GAAG,CAAC;EAC7B,MAAMC,aAAa,GAAGjB,SAAS,GAAG,CAAC;EACnC,MAAM;IAAEkB;EAAc,CAAC,GAAGzD,gBAAgB,CAAC,CAAC;EAC5C,MAAM0D,aAAa,GAAGhD,UAAU,CAAC,CAAC;EAClC,MAAMiD,YAAY,GAAGjD,UAAU,CAAC,CAAC;EACjC,MAAM,CAACkD,WAAW,EAAEC,cAAc,CAAC,GAAG1D,QAAQ,CAAS,CAAC;EACxD,MAAM,CAAC2D,UAAU,EAAEC,aAAa,CAAC,GAAG5D,QAAQ,CAAS,CAAC;EACtD,MAAM,CAAC6D,SAAS,EAAEC,YAAY,CAAC,GAAG9D,QAAQ,CAAS,CAAC;EACpD,MAAM,CAAC+D,WAAW,EAAEC,cAAc,CAAC,GAAGhE,QAAQ,CAC5CyB,YACF,CAAC;EACD,MAAMwC,qBAAqB,GAAGnE,gBAAgB,CAACiE,WAAW,CAAC;EAC3D,MAAMG,UAAU,GAAG9D,cAAc,CAAC,EAAEuD,UAAU,IAAI,CAAC,CAAC,CAAC;EACrD,MAAMQ,kBAAkB,GAAGhE,gBAAgB,CACzC,OAAO;IAAEiE,SAAS,EAAE,CAAC;MAAEC,UAAU,EAAEH,UAAU,CAACI,GAAG,CAAC;IAAE,CAAC;EAAE,CAAC,CAAC,EACzD,CAACX,UAAU,CACb,CAAC;EACD,MAAMY,kBAAkB,GAAGpE,gBAAgB,CACzC,OAAO;IAAEiE,SAAS,EAAE,CAAC;MAAEC,UAAU,EAAEH,UAAU,CAACI,GAAG,CAAC,CAAC,GAAGjB;IAAc,CAAC;EAAE,CAAC,CAAC,EACzE,CAACA,aAAa,CAChB,CAAC;EACDtD,eAAe,CAAC,MAAM;IACpBwD,aAAa,CAACiB,OAAO,EAAEC,OAAO,CAAC,CAACC,EAAE,EAAEC,EAAE,EAAEC,CAAC,KAAK;MAC5ClB,cAAc,CAACkB,CAAC,CAAC;IACnB,CAAC,CAAC;EACJ,CAAC,EAAE,EAAE,CAAC;EACN7E,eAAe,CAAC,MAAM;IACpByD,YAAY,CAACgB,OAAO,EAAEC,OAAO,CAAC,CAACC,EAAE,EAAEC,EAAE,EAAEC,CAAC,KAAK;MAC3C,MAAMC,SAAS,GAAGD,CAAC,GAAGxC,SAAS;MAC/B,MAAM0C,aAAa,GAAGD,SAAS,GAAG5B,UAAU;MAC5CW,aAAa,CAACiB,SAAS,CAAC;MACxBf,YAAY,CAACgB,aAAa,CAAC;MAC3B,IAAIC,KAAK,GAAG,CAAC;MACb,IAAIjC,UAAU,EAAE;QACd,MAAMkC,QAAQ,GAAGjC,cAAuC;QACxD,MAAMkC,eAAe,GAAGlB,WAA2C;QACnEgB,KAAK,GAAGE,eAAe,GAAG,CAACA,eAAe,GAAGD,QAAQ,CAAC,CAAC,CAAC,IAAIxD,KAAK,GAAG,CAAC;MACvE,CAAC,MAAM;QACL,MAAM0D,QAAQ,GAAGnC,cAAuC;QACxD,MAAMoC,eAAe,GAAGpB,WAA2C;QACnEgB,KAAK,GAAGI,eAAe,GAAGD,QAAQ,CAACE,OAAO,CAACD,eAAe,CAAC,GAAG,CAAC;MACjE;MACAjB,UAAU,CAACmB,GAAG,CAAC,EAAEpC,UAAU,GAAG8B,KAAK,CAAC,GAAGD,aAAa,CAAC;IACvD,CAAC,CAAC;EACJ,CAAC,EAAE,CAAC1C,SAAS,EAAEU,UAAU,EAAEC,cAAc,EAAEE,UAAU,CAAC,CAAC;EAEvD,MAAMqC,SAAmC,GAAG;IAC1CC,gBAAgB,EAAElC;EACpB,CAAC;EACD,MAAMmC,iBAAiB,GAAIC,CAAS,IAAK;IACvC,IAAI,CAAC5B,SAAS,EAAE;MACd;IACF;IAEA,IAAIf,UAAU,EAAE;MACd,MAAMkC,QAAQ,GAAGjC,cAAuC;MACxD,MAAM2C,QAAQ,GAAGxC,IAAI,CAACyC,KAAK,CAACF,CAAC,GAAG5B,SAAS,CAAC;MAC1C,MAAM+B,eAAe,GAAGZ,QAAQ,CAAC,CAAC,CAAC,GAAGU,QAAQ,GAAGlE,KAAK;MACtDwC,cAAc,CAAC4B,eAAe,CAAC;MAC/B/D,aAAa,CAAC+D,eAAe,CAAC;IAChC,CAAC,MAAM;MACL,MAAMV,QAAQ,GAAGnC,cAAuC;MACxD,MAAM8C,QAAQ,GAAG3C,IAAI,CAACyC,KAAK,CAACF,CAAC,GAAG5B,SAAS,CAAC;MAC1C,MAAM+B,eAAe,GAAGV,QAAQ,CAACjC,UAAU,GAAG4C,QAAQ,CAAC;MACvD7B,cAAc,CAAC4B,eAAe,CAAC;MAC/B/D,aAAa,CAAC+D,eAAgB,CAAC;IACjC;EACF,CAAC;EACD,MAAME,gBAAgB,GAAGA,CAACL,CAAS,EAAEM,QAAQ,GAAG,KAAK,KAAK;IACxD,SAAS;;IACT,MAAMC,KAAK,GAAG9C,IAAI,CAAC+C,GAAG,CAAC,CAAC,EAAE/C,IAAI,CAACgD,GAAG,CAACT,CAAC,EAAE,EAAE9B,UAAU,IAAI,CAAC,CAAC,CAAC,CAAC;IAC1DO,UAAU,CAACmB,GAAG,CAACU,QAAQ,GAAG1F,UAAU,CAAC2F,KAAK,CAAC,GAAGA,KAAK,CAAC;IACpD1F,YAAY,CAACkF,iBAAiB,EAAEtC,IAAI,CAACC,GAAG,CAAC6C,KAAK,CAAC,CAAC;EAClD,CAAC;EACD,MAAMG,OAAO,GAAGlG,OAAO,CAACmG,YAAY,CAClCnG,OAAO,CAACoG,GAAG,CAAC,CAAC,CACVC,aAAa,CAAC,CAAC;IAAEC;EAAW,CAAC,KAAK;IACjC,MAAMC,KAAK,GAAGD,UAAU,CAAC,CAAC,CAAC;IAC3B,IAAIC,KAAK,IAAI/C,WAAW,EAAE;MACxBqC,gBAAgB,CACd,EAAErC,WAAW,IAAI+C,KAAK,CAACf,CAAC,GAAGrD,SAAS,GAAGiB,aAAa,CAAC,CACvD,CAAC;IACH;EACF,CAAC,CAAC,CACDoD,WAAW,CAAC,CAAC;IAAEF;EAAW,CAAC,KAAK;IAC/B,MAAMC,KAAK,GAAGD,UAAU,CAAC,CAAC,CAAC;IAC3B,IAAIC,KAAK,IAAI/C,WAAW,IAAII,SAAS,EAAE;MACrC,MAAM6C,WAAW,GAAGxD,IAAI,CAACyC,KAAK,CAC5B,EAAElC,WAAW,IAAI+C,KAAK,CAACf,CAAC,GAAGrD,SAAS,GAAGiB,aAAa,CAAC,CAAC,GAAGQ,SAC3D,CAAC;MACDiC,gBAAgB,CAACY,WAAW,GAAG7C,SAAS,EAAEjC,kBAAkB,CAAC;IAC/D;EACF,CAAC,CAAC,EACJ3B,OAAO,CAAC0G,GAAG,CAAC,CAAC,CACVC,QAAQ,CAAC,CAAC;IAAEC;EAAQ,CAAC,KAAK;IACzBf,gBAAgB,CAAC5B,UAAU,CAACI,GAAG,CAAC,CAAC,GAAGuC,OAAO,CAAC;EAC9C,CAAC,CAAC,CACDC,KAAK,CAAC,MAAM;IACX,IAAIjD,SAAS,EAAE;MACb,MAAM6C,WAAW,GAAGxD,IAAI,CAACyC,KAAK,CAACzB,UAAU,CAACI,GAAG,CAAC,CAAC,GAAGT,SAAS,CAAC;MAC5DiC,gBAAgB,CAACY,WAAW,GAAG7C,SAAS,EAAEjC,kBAAkB,CAAC;IAC/D;EACF,CAAC,CACL,CAAC;EACD,MAAMmF,qBAAqB,GAAGxE,gBAAgB,KAC5C5B,sBAAsB,CAAC6B,IAAI,iBAC3BvB,KAAA,CAACJ,UAAU;IACTmG,aAAa,EAAE,KAAM;IACrBC,UAAU,EAAE,QAAS;IACrBC,SAAS,EAAE,SAAU;IACrBC,SAAS,EAAE,GAAI;IAAA,GACX1E,qBAAqB;IAAA2E,QAAA,GAExB,CAAC,CAACzE,gBAAgB,iBACjB5B,IAAA,CAACG,UAAU;MACTmG,IAAI,EAAE,CAAE;MACRC,SAAS,EAAE,QAAS;MAAA,GAChB1E,yBAAyB;MAAAwE,QAAA,EAE5BzE;IAAgB,CACP,CACb,eACD5B,IAAA,CAACG,UAAU;MAACmG,IAAI,EAAE,CAAE;MAACC,SAAS,EAAE,QAAS;MAAA,GAAK5E,cAAc;MAAA0E,QAAA,EACzDnD;IAAqB,CACZ,CAAC;EAAA,CACH,CACb;EAED,oBACEhD,KAAA,CAACJ,UAAU;IAAC0G,GAAG,EAAEhE,aAAc;IAAC0D,UAAU,EAAE,QAAS;IAAAG,QAAA,GAClD7E,gBAAgB,KAAK5B,sBAAsB,CAAC6G,GAAG,IAAIT,qBAAqB,eACzEhG,IAAA,CAACb,eAAe;MAACiG,OAAO,EAAEA,OAAQ;MAAAiB,QAAA,eAChCnG,KAAA,CAACJ,UAAU;QACT0G,GAAG,EAAE/D,YAAa;QAClByD,UAAU,EAAE,QAAS;QACrBQ,cAAc,EAAE,QAAS;QACzBP,SAAS,EAAE,SAAU;QACrBQ,MAAM,EAAEtF,SAAU;QAClBuF,KAAK,EAAErC,SAAU;QAAA,GACbzC,SAAS;QAAAuE,QAAA,gBAEbrG,IAAA,CAACF,UAAU;UACT+G,QAAQ,EAAE,UAAW;UACrBC,KAAK,EAAElE,UAAW;UAClB+D,MAAM,EAAE5F,SAAU;UAClBgG,QAAQ,EAAE,QAAS;UACnBC,eAAe,EAAE7F,kBAAmB;UAAA,GAChCD,gBAAgB;UAAAmF,QAAA,eAEpBrG,IAAA,CAACH,kBAAkB;YACjB8G,MAAM,EAAE5F,SAAU;YAClBiG,eAAe,EAAE/F,gBAAiB;YAClC2F,KAAK,EAAExD,kBAAmB;YAAA,GACtBhC;UAAkB,CACvB;QAAC,CACQ,CAAC,EACZ,CAAC,CAACT,aAAa,IACdqB,cAAc,CAACiF,GAAG,CAAC,CAACC,KAAK,EAAElD,KAAK,kBAC9BhE,IAAA,CAACM,yBAAyB;UAExB6G,IAAI,EACFnD,KAAK,IAAIlB,SAAS,IAAI,CAAC,CAAC,GACxBR,aAAa,GACb7C,+BAA+B,GAAG,CACnC;UACDkH,MAAM,EAAEtF,SAAU;UAAA,GACdT;QAAkB,GAPjB2B,aAAa,CAAC2E,KAAK,EAAElD,KAAK,CAQhC,CACF,CAAC,eACJhE,IAAA,CAACH,kBAAkB;UACjBgH,QAAQ,EAAE,UAAW;UACrBO,KAAK,EAAE,CAAC9E,aAAc;UACtBwE,KAAK,EAAEzF,SAAU;UACjBgG,WAAW,EAAE,CAAE;UACfC,OAAO,EAAE,GAAI;UACbN,eAAe,EAAE1F,UAAW;UAC5BsF,KAAK,EAAEpD,kBAAmB;UAAA,GACtBjC;QAAU,CACf,CAAC;MAAA,CACQ;IAAC,CACE,CAAC,EACjBC,gBAAgB,KAAK5B,sBAAsB,CAAC2H,MAAM,IACjDvB,qBAAqB;EAAA,CACb,CAAC;AAEjB,CAAC;AAED,eAAezF,YAAY","ignoreList":[]}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
/** @internal */
|
|
4
|
+
|
|
5
|
+
import { sliderStepIndicatorDefaultWidth } from "../../utils/slider/const.js";
|
|
6
|
+
import ThemedView from "../view/ThemedView.js";
|
|
7
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
+
const ThemedSliderStepIndicator = ({
|
|
9
|
+
width = sliderStepIndicatorDefaultWidth,
|
|
10
|
+
height,
|
|
11
|
+
...props
|
|
12
|
+
}) => {
|
|
13
|
+
return /*#__PURE__*/_jsx(ThemedView, {
|
|
14
|
+
position: 'absolute',
|
|
15
|
+
width: width,
|
|
16
|
+
height: height,
|
|
17
|
+
backgroundColor: 'themePri',
|
|
18
|
+
...props
|
|
19
|
+
});
|
|
20
|
+
};
|
|
21
|
+
export default ThemedSliderStepIndicator;
|
|
22
|
+
//# sourceMappingURL=ThemedSliderStepIndicator.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["sliderStepIndicatorDefaultWidth","ThemedView","jsx","_jsx","ThemedSliderStepIndicator","width","height","props","position","backgroundColor"],"sourceRoot":"../../../../src","sources":["components/slider/ThemedSliderStepIndicator.tsx"],"mappings":";;AAAA;;AAGA,SAASA,+BAA+B,QAAQ,6BAA0B;AAC1E,OAAOC,UAAU,MAAM,uBAAoB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE5C,MAAMC,yBAA6D,GAAGA,CAAC;EACrEC,KAAK,GAAGL,+BAA+B;EACvCM,MAAM;EACN,GAAGC;AACL,CAAC,KAAK;EACJ,oBACEJ,IAAA,CAACF,UAAU;IACTO,QAAQ,EAAE,UAAW;IACrBH,KAAK,EAAEA,KAAM;IACbC,MAAM,EAAEA,MAAO;IACfG,eAAe,EAAE,UAAW;IAAA,GACxBF;EAAK,CACV,CAAC;AAEN,CAAC;AAED,eAAeH,yBAAyB","ignoreList":[]}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
3
|
+
import { BorderSize } from "../theme/const.js";
|
|
4
|
+
export let SliderValueDisplayMode = /*#__PURE__*/function (SliderValueDisplayMode) {
|
|
5
|
+
SliderValueDisplayMode["None"] = "none";
|
|
6
|
+
SliderValueDisplayMode["Top"] = "top";
|
|
7
|
+
SliderValueDisplayMode["Bottom"] = "bottom";
|
|
8
|
+
return SliderValueDisplayMode;
|
|
8
9
|
}({});
|
|
9
10
|
export let SliderTrackSize = /*#__PURE__*/function (SliderTrackSize) {
|
|
10
11
|
SliderTrackSize[SliderTrackSize["S"] = 8] = "S";
|
|
@@ -18,4 +19,5 @@ export let SliderThumbSize = /*#__PURE__*/function (SliderThumbSize) {
|
|
|
18
19
|
SliderThumbSize[SliderThumbSize["L"] = 28] = "L";
|
|
19
20
|
return SliderThumbSize;
|
|
20
21
|
}({});
|
|
22
|
+
export const sliderStepIndicatorDefaultWidth = BorderSize.M;
|
|
21
23
|
//# sourceMappingURL=const.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["
|
|
1
|
+
{"version":3,"names":["BorderSize","SliderValueDisplayMode","SliderTrackSize","SliderThumbSize","sliderStepIndicatorDefaultWidth","M"],"sourceRoot":"../../../../src","sources":["utils/slider/const.ts"],"mappings":";;AAAA,SAASA,UAAU,QAAQ,mBAAgB;AAE3C,WAAYC,sBAAsB,0BAAtBA,sBAAsB;EAAtBA,sBAAsB;EAAtBA,sBAAsB;EAAtBA,sBAAsB;EAAA,OAAtBA,sBAAsB;AAAA;AAMlC,WAAYC,eAAe,0BAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAA,OAAfA,eAAe;AAAA;AAM3B,WAAYC,eAAe,0BAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAA,OAAfA,eAAe;AAAA;AAM3B,OAAO,MAAMC,+BAA+B,GAAGJ,UAAU,CAACK,CAAC","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemedSlider.d.ts","sourceRoot":"","sources":["../../../../../src/components/slider/ThemedSlider.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ThemedSlider.d.ts","sourceRoot":"","sources":["../../../../../src/components/slider/ThemedSlider.tsx"],"names":[],"mappings":"AACA,OAAO,EAA+C,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAS7E,OAAO,KAAK,EAGV,iBAAiB,EAElB,MAAM,oBAAoB,CAAC;AAgB5B,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAwNvC,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ThemedSliderStepIndicator.d.ts","sourceRoot":"","sources":["../../../../../src/components/slider/ThemedSliderStepIndicator.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,8BAA8B,EAAE,MAAM,oBAAoB,CAAC;AAIzE,QAAA,MAAM,yBAAyB,EAAE,EAAE,CAAC,8BAA8B,CAcjE,CAAC;AAEF,eAAe,yBAAyB,CAAC"}
|
|
@@ -1,19 +1,23 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { SliderThumbSize, SliderTrackSize, SliderValueDisplayMode } from '../utils/slider/const';
|
|
2
2
|
import type { CustomThemedTextProps } from './text';
|
|
3
3
|
import type { ThemeColors } from './theme';
|
|
4
4
|
import type { AnimatedThemedViewProps, ThemedViewProps } from './view';
|
|
5
5
|
export type NumberSlider = {
|
|
6
6
|
range: [number, number];
|
|
7
7
|
steps: number;
|
|
8
|
-
|
|
8
|
+
defaultValue?: number;
|
|
9
|
+
stepIndicator?: never;
|
|
10
|
+
stepIndicatorProps?: never;
|
|
9
11
|
};
|
|
10
12
|
export type StringSlider = {
|
|
11
13
|
range: string[];
|
|
12
14
|
steps?: never;
|
|
13
|
-
|
|
15
|
+
defaultValue?: string;
|
|
16
|
+
stepIndicator?: boolean;
|
|
17
|
+
stepIndicatorProps?: ThemedSliderStepIndicatorProps;
|
|
14
18
|
};
|
|
15
|
-
export type ThemedSliderProps = (NumberSlider | StringSlider) &
|
|
16
|
-
|
|
19
|
+
export type ThemedSliderProps = (NumberSlider | StringSlider) & {
|
|
20
|
+
snapToStepAnimated?: boolean;
|
|
17
21
|
onValueChange: (value: number | string) => void;
|
|
18
22
|
trackSize?: SliderTrackSize | number;
|
|
19
23
|
trackActiveColor?: ThemeColors;
|
|
@@ -23,6 +27,12 @@ export type ThemedSliderProps = (NumberSlider | StringSlider) & Omit<CustomTheme
|
|
|
23
27
|
thumbSize?: SliderThumbSize | number;
|
|
24
28
|
thumbColor?: ThemeColors;
|
|
25
29
|
thumbProps?: AnimatedThemedViewProps;
|
|
30
|
+
valueDisplayMode?: SliderValueDisplayMode;
|
|
31
|
+
valueDisplayWrapProps?: ThemedViewProps;
|
|
32
|
+
valueTextProps?: Omit<CustomThemedTextProps, 'text'>;
|
|
33
|
+
valueDescription?: string;
|
|
34
|
+
valueDescriptionTextProps?: Omit<CustomThemedTextProps, 'text'>;
|
|
26
35
|
wrapProps?: ThemedViewProps;
|
|
27
36
|
};
|
|
37
|
+
export type ThemedSliderStepIndicatorProps = ThemedViewProps;
|
|
28
38
|
//# sourceMappingURL=slider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../../src/types/slider.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,
|
|
1
|
+
{"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../../src/types/slider.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,eAAe,EACf,eAAe,EACf,sBAAsB,EACvB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,QAAQ,CAAC;AACpD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,KAAK,EAAE,uBAAuB,EAAE,eAAe,EAAE,MAAM,QAAQ,CAAC;AAEvE,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,kBAAkB,CAAC,EAAE,KAAK,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kBAAkB,CAAC,EAAE,8BAA8B,CAAC;CACrD,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,CAAC,YAAY,GAAG,YAAY,CAAC,GAAG;IAC9D,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAChD,SAAS,CAAC,EAAE,eAAe,GAAG,MAAM,CAAC;IACrC,gBAAgB,CAAC,EAAE,WAAW,CAAC;IAC/B,gBAAgB,CAAC,EAAE,eAAe,CAAC;IACnC,kBAAkB,CAAC,EAAE,WAAW,CAAC;IACjC,kBAAkB,CAAC,EAAE,uBAAuB,CAAC;IAC7C,SAAS,CAAC,EAAE,eAAe,GAAG,MAAM,CAAC;IACrC,UAAU,CAAC,EAAE,WAAW,CAAC;IACzB,UAAU,CAAC,EAAE,uBAAuB,CAAC;IACrC,gBAAgB,CAAC,EAAE,sBAAsB,CAAC;IAC1C,qBAAqB,CAAC,EAAE,eAAe,CAAC;IACxC,cAAc,CAAC,EAAE,IAAI,CAAC,qBAAqB,EAAE,MAAM,CAAC,CAAC;IACrD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yBAAyB,CAAC,EAAE,IAAI,CAAC,qBAAqB,EAAE,MAAM,CAAC,CAAC;IAChE,SAAS,CAAC,EAAE,eAAe,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,8BAA8B,GAAG,eAAe,CAAC"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
import { BorderSize } from '../theme/const';
|
|
2
|
+
export declare enum SliderValueDisplayMode {
|
|
2
3
|
None = "none",
|
|
3
4
|
Top = "top",
|
|
4
5
|
Bottom = "bottom"
|
|
@@ -13,4 +14,5 @@ export declare enum SliderThumbSize {
|
|
|
13
14
|
M = 24,
|
|
14
15
|
L = 28
|
|
15
16
|
}
|
|
17
|
+
export declare const sliderStepIndicatorDefaultWidth = BorderSize.M;
|
|
16
18
|
//# sourceMappingURL=const.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"const.d.ts","sourceRoot":"","sources":["../../../../../src/utils/slider/const.ts"],"names":[],"mappings":"AAAA,oBAAY,
|
|
1
|
+
{"version":3,"file":"const.d.ts","sourceRoot":"","sources":["../../../../../src/utils/slider/const.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,oBAAY,sBAAsB;IAChC,IAAI,SAAS;IACb,GAAG,QAAQ;IACX,MAAM,WAAW;CAClB;AAED,oBAAY,eAAe;IACzB,CAAC,IAAI;IACL,CAAC,KAAK;IACN,CAAC,KAAK;CACP;AAED,oBAAY,eAAe;IACzB,CAAC,KAAK;IACN,CAAC,KAAK;IACN,CAAC,KAAK;CACP;AAED,eAAO,MAAM,+BAA+B,eAAe,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jamadd/react-native-template-ui",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.7.1",
|
|
4
4
|
"description": "React Native Template UI is a collection of UI components designed by JaMa D&D.",
|
|
5
5
|
"main": "./lib/module/index.js",
|
|
6
6
|
"types": "./lib/typescript/src/index.d.ts",
|