react-native-wagmi-charts 2.0.0 → 2.0.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/README.md +8 -0
- package/example/.expo/packager-info.json +1 -1
- package/example/src/LineChart.tsx +3 -1
- package/lib/commonjs/charts/line/CursorCrosshair.js +3 -1
- package/lib/commonjs/charts/line/CursorCrosshair.js.map +1 -1
- package/lib/module/charts/line/CursorCrosshair.js +3 -1
- package/lib/module/charts/line/CursorCrosshair.js.map +1 -1
- package/package.json +1 -1
- package/src/charts/line/CursorCrosshair.tsx +3 -1
package/README.md
CHANGED
|
@@ -418,6 +418,8 @@ You can render dots on your line chart with `LineChart.Dot`.
|
|
|
418
418
|
</LineChart.Provider>
|
|
419
419
|
```
|
|
420
420
|
|
|
421
|
+
<img width="153" alt="Screen Shot 2021-11-23 at 11 15 23 am" src="https://user-images.githubusercontent.com/7336481/143009734-04aa3be6-8737-4dae-8202-98ac738f127b.png">
|
|
422
|
+
|
|
421
423
|
Your dot can also have an animated pulse by passing the `hasPulse` prop.
|
|
422
424
|
|
|
423
425
|
```jsx
|
|
@@ -430,6 +432,8 @@ Your dot can also have an animated pulse by passing the `hasPulse` prop.
|
|
|
430
432
|
</LineChart.Provider>
|
|
431
433
|
```
|
|
432
434
|
|
|
435
|
+
|
|
436
|
+
|
|
433
437
|
### Path highlighting
|
|
434
438
|
|
|
435
439
|
You can highlight a section of your path with `LineChart.Highlight`.
|
|
@@ -444,6 +448,8 @@ You can highlight a section of your path with `LineChart.Highlight`.
|
|
|
444
448
|
</LineChart.Provider>
|
|
445
449
|
```
|
|
446
450
|
|
|
451
|
+
<img width="345" alt="Screen Shot 2021-11-23 at 11 54 02 am" src="https://user-images.githubusercontent.com/7336481/143009637-03b227e4-c36b-43d8-bdc0-8b73a15b126b.png">
|
|
452
|
+
|
|
447
453
|
### Horizontal lines
|
|
448
454
|
|
|
449
455
|
You can render a static horizontal line on your line chart which moves whenever your data change. It's located on height of point which is on `at` position of provided data.
|
|
@@ -458,6 +464,8 @@ You can render a static horizontal line on your line chart which moves whenever
|
|
|
458
464
|
</LineChart.Provider>
|
|
459
465
|
```
|
|
460
466
|
|
|
467
|
+
<img width="345" alt="Screen Shot 2021-11-23 at 11 51 45 am" src="https://user-images.githubusercontent.com/7336481/143009672-54dac2c7-7de1-4299-a96f-7cc380e82b46.png">
|
|
468
|
+
|
|
461
469
|
You can also pass a (y) value to `HorizontalLine` with the `value` attribute:
|
|
462
470
|
|
|
463
471
|
```jsx
|
|
@@ -48,7 +48,8 @@ export default function App() {
|
|
|
48
48
|
|
|
49
49
|
let chart = (
|
|
50
50
|
<LineChart>
|
|
51
|
-
<LineChart.Path color="black"
|
|
51
|
+
<LineChart.Path color="black" />
|
|
52
|
+
{/* <LineChart.Path color="black">
|
|
52
53
|
<LineChart.Gradient color="black" />
|
|
53
54
|
<LineChart.HorizontalLine at={{ index: 0 }} />
|
|
54
55
|
<LineChart.Highlight color="red" from={10} to={15} />
|
|
@@ -58,6 +59,7 @@ export default function App() {
|
|
|
58
59
|
<LineChart.Dot at={data.length - 1} color="red" hasPulse />
|
|
59
60
|
)}
|
|
60
61
|
</LineChart.Path>
|
|
62
|
+
*/}
|
|
61
63
|
<LineChart.CursorCrosshair
|
|
62
64
|
onActivated={invokeHaptic}
|
|
63
65
|
onEnded={invokeHaptic}
|
|
@@ -41,7 +41,9 @@ function LineChartCursorCrosshair({
|
|
|
41
41
|
|
|
42
42
|
const [enableSpringAnimation, setEnableSpringAnimation] = React.useState(_reactNative.Platform.OS === 'ios');
|
|
43
43
|
React.useEffect(() => {
|
|
44
|
-
|
|
44
|
+
setTimeout(() => {
|
|
45
|
+
setEnableSpringAnimation(true);
|
|
46
|
+
}, 100);
|
|
45
47
|
}, []);
|
|
46
48
|
const animatedCursorStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
|
|
47
49
|
transform: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["CursorCrosshair.tsx"],"names":["LineChartCursorCrosshair","displayName","children","color","size","outerSize","crosshairWrapperProps","crosshairProps","crosshairOuterProps","props","currentX","currentY","isActive","enableSpringAnimation","setEnableSpringAnimation","React","useState","Platform","OS","useEffect","animatedCursorStyle","transform","translateX","value","translateY","scale","damping","width","height","alignItems","justifyContent","style","backgroundColor","borderRadius","opacity","position"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAKA;;AACA;;;;;;;;AAeAA,wBAAwB,CAACC,WAAzB,GAAuC,0BAAvC;;AAEO,SAASD,wBAAT,CAAkC;AACvCE,EAAAA,QADuC;AAEvCC,EAAAA,KAAK,GAAG,OAF+B;AAGvCC,EAAAA,IAAI,GAAG,CAHgC;AAIvCC,EAAAA,SAAS,GAAG,EAJ2B;AAKvCC,EAAAA,qBAAqB,GAAG,EALe;AAMvCC,EAAAA,cAAc,GAAG,EANsB;AAOvCC,EAAAA,mBAAmB,GAAG,EAPiB;AAQvC,KAAGC;AARoC,CAAlC,EAS2B;AAChC,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,QAAZ;AAAsBC,IAAAA;AAAtB,MAAmC,iCAAzC,CADgC,CAGhC;;AACA,QAAM,CAACC,qBAAD,EAAwBC,wBAAxB,IAAoDC,KAAK,CAACC,QAAN,CACxDC,sBAASC,EAAT,KAAgB,KADwC,CAA1D;AAGAH,EAAAA,KAAK,CAACI,SAAN,CAAgB,MAAM;
|
|
1
|
+
{"version":3,"sources":["CursorCrosshair.tsx"],"names":["LineChartCursorCrosshair","displayName","children","color","size","outerSize","crosshairWrapperProps","crosshairProps","crosshairOuterProps","props","currentX","currentY","isActive","enableSpringAnimation","setEnableSpringAnimation","React","useState","Platform","OS","useEffect","setTimeout","animatedCursorStyle","transform","translateX","value","translateY","scale","damping","width","height","alignItems","justifyContent","style","backgroundColor","borderRadius","opacity","position"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAKA;;AACA;;;;;;;;AAeAA,wBAAwB,CAACC,WAAzB,GAAuC,0BAAvC;;AAEO,SAASD,wBAAT,CAAkC;AACvCE,EAAAA,QADuC;AAEvCC,EAAAA,KAAK,GAAG,OAF+B;AAGvCC,EAAAA,IAAI,GAAG,CAHgC;AAIvCC,EAAAA,SAAS,GAAG,EAJ2B;AAKvCC,EAAAA,qBAAqB,GAAG,EALe;AAMvCC,EAAAA,cAAc,GAAG,EANsB;AAOvCC,EAAAA,mBAAmB,GAAG,EAPiB;AAQvC,KAAGC;AARoC,CAAlC,EAS2B;AAChC,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,QAAZ;AAAsBC,IAAAA;AAAtB,MAAmC,iCAAzC,CADgC,CAGhC;;AACA,QAAM,CAACC,qBAAD,EAAwBC,wBAAxB,IAAoDC,KAAK,CAACC,QAAN,CACxDC,sBAASC,EAAT,KAAgB,KADwC,CAA1D;AAGAH,EAAAA,KAAK,CAACI,SAAN,CAAgB,MAAM;AACpBC,IAAAA,UAAU,CAAC,MAAM;AACfN,MAAAA,wBAAwB,CAAC,IAAD,CAAxB;AACD,KAFS,EAEP,GAFO,CAAV;AAGD,GAJD,EAIG,EAJH;AAMA,QAAMO,mBAAmB,GAAG,6CAAiB,OAAO;AAClDC,IAAAA,SAAS,EAAE,CACT;AAAEC,MAAAA,UAAU,EAAEb,QAAQ,CAACc,KAAT,GAAiBnB,SAAS,GAAG;AAA3C,KADS,EAET;AAAEoB,MAAAA,UAAU,EAAEd,QAAQ,CAACa,KAAT,GAAiBnB,SAAS,GAAG;AAA3C,KAFS,EAGT;AACEqB,MAAAA,KAAK,EAAEb,qBAAqB,GACxB,uCAAWD,QAAQ,CAACY,KAAT,GAAiB,CAAjB,GAAqB,CAAhC,EAAmC;AACjCG,QAAAA,OAAO,EAAE;AADwB,OAAnC,CADwB,GAIxB;AALN,KAHS;AADuC,GAAP,CAAjB,CAA5B;AAcA,sBACE,oBAAC,uBAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KAAsClB,KAAtC,gBACE,oBAAC,8BAAD,CAAU,IAAV,eACMH,qBADN;AAEE,IAAA,KAAK,EAAE,CACL;AACEsB,MAAAA,KAAK,EAAEvB,SADT;AAEEwB,MAAAA,MAAM,EAAExB,SAFV;AAGEyB,MAAAA,UAAU,EAAE,QAHd;AAIEC,MAAAA,cAAc,EAAE;AAJlB,KADK,EAOLV,mBAPK,EAQLf,qBAAqB,CAAC0B,KARjB;AAFT,mBAaE,oBAAC,iBAAD,eACMxB,mBADN;AAEE,IAAA,KAAK,EAAE,CACL;AACEyB,MAAAA,eAAe,EAAE9B,KADnB;AAEEyB,MAAAA,KAAK,EAAEvB,SAFT;AAGEwB,MAAAA,MAAM,EAAExB,SAHV;AAIE6B,MAAAA,YAAY,EAAE7B,SAJhB;AAKE8B,MAAAA,OAAO,EAAE,GALX;AAMEC,MAAAA,QAAQ,EAAE;AANZ,KADK,EASL5B,mBAAmB,CAACwB,KATf;AAFT,KAbF,eA2BE,oBAAC,iBAAD,eACMzB,cADN;AAEE,IAAA,KAAK,EAAE,CACL;AACE0B,MAAAA,eAAe,EAAE9B,KADnB;AAEEyB,MAAAA,KAAK,EAAExB,IAFT;AAGEyB,MAAAA,MAAM,EAAEzB,IAHV;AAIE8B,MAAAA,YAAY,EAAE9B;AAJhB,KADK,EAOLG,cAAc,CAACyB,KAPV;AAFT,KA3BF,CADF,EAyCG9B,QAzCH,CADF;AA6CD","sourcesContent":["import * as React from 'react';\nimport { Platform, View, ViewProps } from 'react-native';\nimport Animated, {\n useAnimatedStyle,\n withSpring,\n} from 'react-native-reanimated';\n\nimport { LineChartCursor, LineChartCursorProps } from './Cursor';\nimport { useLineChart } from './useLineChart';\n\ntype LineChartCursorCrosshairProps = Omit<\n LineChartCursorProps,\n 'children' | 'type'\n> & {\n children?: React.ReactNode;\n color?: string;\n size?: number;\n outerSize?: number;\n crosshairWrapperProps?: Animated.AnimateProps<ViewProps>;\n crosshairProps?: ViewProps;\n crosshairOuterProps?: ViewProps;\n};\n\nLineChartCursorCrosshair.displayName = 'LineChartCursorCrosshair';\n\nexport function LineChartCursorCrosshair({\n children,\n color = 'black',\n size = 8,\n outerSize = 32,\n crosshairWrapperProps = {},\n crosshairProps = {},\n crosshairOuterProps = {},\n ...props\n}: LineChartCursorCrosshairProps) {\n const { currentX, currentY, isActive } = useLineChart();\n\n // It seems that enabling spring animation on initial render on Android causes a crash.\n const [enableSpringAnimation, setEnableSpringAnimation] = React.useState(\n Platform.OS === 'ios'\n );\n React.useEffect(() => {\n setTimeout(() => {\n setEnableSpringAnimation(true);\n }, 100);\n }, []);\n\n const animatedCursorStyle = useAnimatedStyle(() => ({\n transform: [\n { translateX: currentX.value - outerSize / 2 },\n { translateY: currentY.value - outerSize / 2 },\n {\n scale: enableSpringAnimation\n ? withSpring(isActive.value ? 1 : 0, {\n damping: 10,\n })\n : 0,\n },\n ],\n }));\n\n return (\n <LineChartCursor type=\"crosshair\" {...props}>\n <Animated.View\n {...crosshairWrapperProps}\n style={[\n {\n width: outerSize,\n height: outerSize,\n alignItems: 'center',\n justifyContent: 'center',\n },\n animatedCursorStyle,\n crosshairWrapperProps.style,\n ]}\n >\n <View\n {...crosshairOuterProps}\n style={[\n {\n backgroundColor: color,\n width: outerSize,\n height: outerSize,\n borderRadius: outerSize,\n opacity: 0.1,\n position: 'absolute',\n },\n crosshairOuterProps.style,\n ]}\n />\n <View\n {...crosshairProps}\n style={[\n {\n backgroundColor: color,\n width: size,\n height: size,\n borderRadius: size,\n },\n crosshairProps.style,\n ]}\n />\n </Animated.View>\n {children}\n </LineChartCursor>\n );\n}\n"]}
|
|
@@ -24,7 +24,9 @@ export function LineChartCursorCrosshair({
|
|
|
24
24
|
|
|
25
25
|
const [enableSpringAnimation, setEnableSpringAnimation] = React.useState(Platform.OS === 'ios');
|
|
26
26
|
React.useEffect(() => {
|
|
27
|
-
|
|
27
|
+
setTimeout(() => {
|
|
28
|
+
setEnableSpringAnimation(true);
|
|
29
|
+
}, 100);
|
|
28
30
|
}, []);
|
|
29
31
|
const animatedCursorStyle = useAnimatedStyle(() => ({
|
|
30
32
|
transform: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["CursorCrosshair.tsx"],"names":["React","Platform","View","Animated","useAnimatedStyle","withSpring","LineChartCursor","useLineChart","LineChartCursorCrosshair","displayName","children","color","size","outerSize","crosshairWrapperProps","crosshairProps","crosshairOuterProps","props","currentX","currentY","isActive","enableSpringAnimation","setEnableSpringAnimation","useState","OS","useEffect","animatedCursorStyle","transform","translateX","value","translateY","scale","damping","width","height","alignItems","justifyContent","style","backgroundColor","borderRadius","opacity","position"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,QAAT,EAAmBC,IAAnB,QAA0C,cAA1C;AACA,OAAOC,QAAP,IACEC,gBADF,EAEEC,UAFF,QAGO,yBAHP;AAKA,SAASC,eAAT,QAAsD,UAAtD;AACA,SAASC,YAAT,QAA6B,gBAA7B;AAeAC,wBAAwB,CAACC,WAAzB,GAAuC,0BAAvC;AAEA,OAAO,SAASD,wBAAT,CAAkC;AACvCE,EAAAA,QADuC;AAEvCC,EAAAA,KAAK,GAAG,OAF+B;AAGvCC,EAAAA,IAAI,GAAG,CAHgC;AAIvCC,EAAAA,SAAS,GAAG,EAJ2B;AAKvCC,EAAAA,qBAAqB,GAAG,EALe;AAMvCC,EAAAA,cAAc,GAAG,EANsB;AAOvCC,EAAAA,mBAAmB,GAAG,EAPiB;AAQvC,KAAGC;AARoC,CAAlC,EAS2B;AAChC,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,QAAZ;AAAsBC,IAAAA;AAAtB,MAAmCb,YAAY,EAArD,CADgC,CAGhC;;AACA,QAAM,CAACc,qBAAD,EAAwBC,wBAAxB,IAAoDtB,KAAK,CAACuB,QAAN,CACxDtB,QAAQ,CAACuB,EAAT,KAAgB,KADwC,CAA1D;AAGAxB,EAAAA,KAAK,CAACyB,SAAN,CAAgB,MAAM;
|
|
1
|
+
{"version":3,"sources":["CursorCrosshair.tsx"],"names":["React","Platform","View","Animated","useAnimatedStyle","withSpring","LineChartCursor","useLineChart","LineChartCursorCrosshair","displayName","children","color","size","outerSize","crosshairWrapperProps","crosshairProps","crosshairOuterProps","props","currentX","currentY","isActive","enableSpringAnimation","setEnableSpringAnimation","useState","OS","useEffect","setTimeout","animatedCursorStyle","transform","translateX","value","translateY","scale","damping","width","height","alignItems","justifyContent","style","backgroundColor","borderRadius","opacity","position"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Platform, View, ViewProps } from 'react-native';\nimport Animated, {\n useAnimatedStyle,\n withSpring,\n} from 'react-native-reanimated';\n\nimport { LineChartCursor, LineChartCursorProps } from './Cursor';\nimport { useLineChart } from './useLineChart';\n\ntype LineChartCursorCrosshairProps = Omit<\n LineChartCursorProps,\n 'children' | 'type'\n> & {\n children?: React.ReactNode;\n color?: string;\n size?: number;\n outerSize?: number;\n crosshairWrapperProps?: Animated.AnimateProps<ViewProps>;\n crosshairProps?: ViewProps;\n crosshairOuterProps?: ViewProps;\n};\n\nLineChartCursorCrosshair.displayName = 'LineChartCursorCrosshair';\n\nexport function LineChartCursorCrosshair({\n children,\n color = 'black',\n size = 8,\n outerSize = 32,\n crosshairWrapperProps = {},\n crosshairProps = {},\n crosshairOuterProps = {},\n ...props\n}: LineChartCursorCrosshairProps) {\n const { currentX, currentY, isActive } = useLineChart();\n\n // It seems that enabling spring animation on initial render on Android causes a crash.\n const [enableSpringAnimation, setEnableSpringAnimation] = React.useState(\n Platform.OS === 'ios'\n );\n React.useEffect(() => {\n setTimeout(() => {\n setEnableSpringAnimation(true);\n }, 100);\n }, []);\n\n const animatedCursorStyle = useAnimatedStyle(() => ({\n transform: [\n { translateX: currentX.value - outerSize / 2 },\n { translateY: currentY.value - outerSize / 2 },\n {\n scale: enableSpringAnimation\n ? withSpring(isActive.value ? 1 : 0, {\n damping: 10,\n })\n : 0,\n },\n ],\n }));\n\n return (\n <LineChartCursor type=\"crosshair\" {...props}>\n <Animated.View\n {...crosshairWrapperProps}\n style={[\n {\n width: outerSize,\n height: outerSize,\n alignItems: 'center',\n justifyContent: 'center',\n },\n animatedCursorStyle,\n crosshairWrapperProps.style,\n ]}\n >\n <View\n {...crosshairOuterProps}\n style={[\n {\n backgroundColor: color,\n width: outerSize,\n height: outerSize,\n borderRadius: outerSize,\n opacity: 0.1,\n position: 'absolute',\n },\n crosshairOuterProps.style,\n ]}\n />\n <View\n {...crosshairProps}\n style={[\n {\n backgroundColor: color,\n width: size,\n height: size,\n borderRadius: size,\n },\n crosshairProps.style,\n ]}\n />\n </Animated.View>\n {children}\n </LineChartCursor>\n );\n}\n"]}
|
package/package.json
CHANGED
|
@@ -40,7 +40,9 @@ export function LineChartCursorCrosshair({
|
|
|
40
40
|
Platform.OS === 'ios'
|
|
41
41
|
);
|
|
42
42
|
React.useEffect(() => {
|
|
43
|
-
|
|
43
|
+
setTimeout(() => {
|
|
44
|
+
setEnableSpringAnimation(true);
|
|
45
|
+
}, 100);
|
|
44
46
|
}, []);
|
|
45
47
|
|
|
46
48
|
const animatedCursorStyle = useAnimatedStyle(() => ({
|