react-native-gifted-charts 1.4.69 → 1.4.70

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.
@@ -22,7 +22,7 @@ var RenderStackBars = function (props) {
22
22
  var _e = useRenderStackBars(__assign(__assign({}, props), { secondaryStepHeight: secondaryStepHeight, secondaryStepValue: secondaryStepValue, secondaryNegativeStepHeight: secondaryNegativeStepHeight, secondaryNegativeStepValue: secondaryNegativeStepValue })), containsNegativeValue = _e.containsNegativeValue, noAnimation = _e.noAnimation, localBarInnerComponent = _e.localBarInnerComponent, borderRadius = _e.borderRadius, borderTopLeftRadius = _e.borderTopLeftRadius, borderTopRightRadius = _e.borderTopRightRadius, borderBottomLeftRadius = _e.borderBottomLeftRadius, borderBottomRightRadius = _e.borderBottomRightRadius, disablePress = _e.disablePress, totalHeight = _e.totalHeight, height = _e.height, setHeight = _e.setHeight, getBarHeight = _e.getBarHeight, getPosition = _e.getPosition, lowestBarPosition = _e.lowestBarPosition, getStackBorderRadii = _e.getStackBorderRadii, tooltipProps = _e.tooltipProps;
23
23
  var renderLabel = function (label, labelTextStyle) {
24
24
  return (_jsx(TouchableOpacity, { disabled: disablePress || (stackHighlightEnabled && !highlightEnabled), activeOpacity: activeOpacity, onPress: function () {
25
- setSelectedIndex(index);
25
+ setSelectedIndex([index]);
26
26
  if (item.onPress) {
27
27
  item.onPress();
28
28
  }
@@ -84,7 +84,7 @@ var RenderStackBars = function (props) {
84
84
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
85
85
  var remainingBarMarginBottom = barMarginBottom;
86
86
  return (_jsxs(_Fragment, { children: [_jsxs(TouchableOpacity, { disabled: disablePress || (stackHighlightEnabled && !highlightEnabled), activeOpacity: activeOpacity, onPress: function () {
87
- setSelectedIndex(index);
87
+ setSelectedIndex([index]);
88
88
  if (item.onPress) {
89
89
  item.onPress();
90
90
  }
@@ -47,7 +47,7 @@ export var BarChart = function (props) {
47
47
  bounces: props.bounces,
48
48
  overScrollMode: (_b = props.overScrollMode) !== null && _b !== void 0 ? _b : 'auto',
49
49
  };
50
- var _d = useBarChart(__assign(__assign({}, props), { heightValue: heightValue, widthValue: widthValue, opacityValue: opacityValue, parentWidth: (_c = props.parentWidth) !== null && _c !== void 0 ? _c : screenWidth })), lineConfig = _d.lineConfig, hidePointer1 = _d.hidePointer1, pointerItem = _d.pointerItem, pointerY = _d.pointerY, pointerConfig = _d.pointerConfig, pointerColor = _d.pointerColor, pointerX = _d.pointerX, pointerComponent = _d.pointerComponent, pointerHeight = _d.pointerHeight, pointerRadius = _d.pointerRadius, pointerWidth = _d.pointerWidth, autoAdjustPointerLabelPosition = _d.autoAdjustPointerLabelPosition, pointerLabelWidth = _d.pointerLabelWidth, activatePointersOnLongPress = _d.activatePointersOnLongPress, yAxisLabelWidth = _d.yAxisLabelWidth, shiftPointerLabelX = _d.shiftPointerLabelX, pointerLabelHeight = _d.pointerLabelHeight, pointerStripUptoDataPoint = _d.pointerStripUptoDataPoint, pointerStripHeight = _d.pointerStripHeight, shiftPointerLabelY = _d.shiftPointerLabelY, showPointerStrip = _d.showPointerStrip, pointerStripWidth = _d.pointerStripWidth, containerHeight = _d.containerHeight, xAxisThickness = _d.xAxisThickness, pointerStripColor = _d.pointerStripColor, pointerEvents = _d.pointerEvents, setResponderStartTime = _d.setResponderStartTime, setPointerY = _d.setPointerY, setPointerItem = _d.setPointerItem, initialSpacing = _d.initialSpacing, spacing = _d.spacing, data = _d.data, barWidth = _d.barWidth, setPointerX = _d.setPointerX, pointerIndex = _d.pointerIndex, setPointerIndex = _d.setPointerIndex, maxValue = _d.maxValue, responderStartTime = _d.responderStartTime, setResponderActive = _d.setResponderActive, activatePointersDelay = _d.activatePointersDelay, persistPointer = _d.persistPointer, pointerVanishDelay = _d.pointerVanishDelay, containerHeightIncludingBelowXAxis = _d.containerHeightIncludingBelowXAxis, extendedContainerHeight = _d.extendedContainerHeight, totalWidth = _d.totalWidth, stripBehindBars = _d.stripBehindBars, noOfSectionsBelowXAxis = _d.noOfSectionsBelowXAxis, stepHeight = _d.stepHeight, xAxisLabelsVerticalShift = _d.xAxisLabelsVerticalShift, labelsExtraHeight = _d.labelsExtraHeight, stripOverPointer = _d.stripOverPointer, pointerLabelComponent = _d.pointerLabelComponent, selectedIndex = _d.selectedIndex, setSelectedIndex = _d.setSelectedIndex, selectedStackIndex = _d.selectedStackIndex, setSelectedStackIndex = _d.setSelectedStackIndex, isAnimated = _d.isAnimated, animationDuration = _d.animationDuration, side = _d.side, labelWidth = _d.labelWidth, isThreeD = _d.isThreeD, animatedHeight = _d.animatedHeight, appearingOpacity = _d.appearingOpacity, autoShiftLabels = _d.autoShiftLabels, getPropsCommonForBarAndStack = _d.getPropsCommonForBarAndStack, barAndLineChartsWrapperProps = _d.barAndLineChartsWrapperProps, autoShiftLabelsForNegativeStacks = _d.autoShiftLabelsForNegativeStacks, showLine = _d.showLine, points2 = _d.points2;
50
+ var _d = useBarChart(__assign(__assign({}, props), { heightValue: heightValue, widthValue: widthValue, opacityValue: opacityValue, parentWidth: (_c = props.parentWidth) !== null && _c !== void 0 ? _c : screenWidth })), lineConfig = _d.lineConfig, lineConfig2 = _d.lineConfig2, hidePointer1 = _d.hidePointer1, pointerItem = _d.pointerItem, pointerY = _d.pointerY, pointerConfig = _d.pointerConfig, pointerColor = _d.pointerColor, pointerX = _d.pointerX, pointerComponent = _d.pointerComponent, pointerHeight = _d.pointerHeight, pointerRadius = _d.pointerRadius, pointerWidth = _d.pointerWidth, autoAdjustPointerLabelPosition = _d.autoAdjustPointerLabelPosition, pointerLabelWidth = _d.pointerLabelWidth, activatePointersOnLongPress = _d.activatePointersOnLongPress, yAxisLabelWidth = _d.yAxisLabelWidth, shiftPointerLabelX = _d.shiftPointerLabelX, pointerLabelHeight = _d.pointerLabelHeight, pointerStripUptoDataPoint = _d.pointerStripUptoDataPoint, pointerStripHeight = _d.pointerStripHeight, shiftPointerLabelY = _d.shiftPointerLabelY, showPointerStrip = _d.showPointerStrip, pointerStripWidth = _d.pointerStripWidth, containerHeight = _d.containerHeight, xAxisThickness = _d.xAxisThickness, pointerStripColor = _d.pointerStripColor, pointerEvents = _d.pointerEvents, setResponderStartTime = _d.setResponderStartTime, setPointerY = _d.setPointerY, setPointerItem = _d.setPointerItem, initialSpacing = _d.initialSpacing, spacing = _d.spacing, data = _d.data, barWidth = _d.barWidth, setPointerX = _d.setPointerX, pointerIndex = _d.pointerIndex, setPointerIndex = _d.setPointerIndex, maxValue = _d.maxValue, responderStartTime = _d.responderStartTime, setResponderActive = _d.setResponderActive, activatePointersDelay = _d.activatePointersDelay, persistPointer = _d.persistPointer, pointerVanishDelay = _d.pointerVanishDelay, containerHeightIncludingBelowXAxis = _d.containerHeightIncludingBelowXAxis, extendedContainerHeight = _d.extendedContainerHeight, totalWidth = _d.totalWidth, stripBehindBars = _d.stripBehindBars, noOfSectionsBelowXAxis = _d.noOfSectionsBelowXAxis, stepHeight = _d.stepHeight, xAxisLabelsVerticalShift = _d.xAxisLabelsVerticalShift, labelsExtraHeight = _d.labelsExtraHeight, stripOverPointer = _d.stripOverPointer, pointerLabelComponent = _d.pointerLabelComponent, selectedIndex = _d.selectedIndex, setSelectedIndex = _d.setSelectedIndex, selectedStackIndex = _d.selectedStackIndex, setSelectedStackIndex = _d.setSelectedStackIndex, isAnimated = _d.isAnimated, animationDuration = _d.animationDuration, side = _d.side, labelWidth = _d.labelWidth, isThreeD = _d.isThreeD, animatedHeight = _d.animatedHeight, appearingOpacity = _d.appearingOpacity, autoShiftLabels = _d.autoShiftLabels, getPropsCommonForBarAndStack = _d.getPropsCommonForBarAndStack, barAndLineChartsWrapperProps = _d.barAndLineChartsWrapperProps, autoShiftLabelsForNegativeStacks = _d.autoShiftLabelsForNegativeStacks, showLine = _d.showLine, points2 = _d.points2;
51
51
  var _e = useBarAndLineChartsWrapper(__assign(__assign({}, barAndLineChartsWrapperProps), { isRTL: I18nManager.isRTL })), lineInBarChartProps = _e.lineInBarChartProps, lineInBarChartProps2 = _e.lineInBarChartProps2;
52
52
  var stackData = barAndLineChartsWrapperProps.stackData;
53
53
  var labelsAppear = useCallback(function () {
@@ -228,6 +228,12 @@ export var BarChart = function (props) {
228
228
  setSelectedStackIndex(-1);
229
229
  // props.setHighlightedStackIndex?.(-1)
230
230
  }
231
+ if (lineConfig.focusEnabled) {
232
+ lineConfig.setFocusedDataPointIndex(-1);
233
+ }
234
+ if (lineConfig2.focusEnabled) {
235
+ lineConfig2.setFocusedDataPointIndex(-1);
236
+ }
231
237
  (_b = props.onBackgroundPress) === null || _b === void 0 ? void 0 : _b.call(props);
232
238
  }, children: [renderChart(),
233
239
  // Only For Bar Charts-
@@ -1,21 +1,5 @@
1
- var __read = (this && this.__read) || function (o, n) {
2
- var m = typeof Symbol === "function" && o[Symbol.iterator];
3
- if (!m) return o;
4
- var i = m.call(o), r, ar = [], e;
5
- try {
6
- while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
7
- }
8
- catch (error) { e = { error: error }; }
9
- finally {
10
- try {
11
- if (r && !r.done && (m = i["return"])) m.call(i);
12
- }
13
- finally { if (e) throw e.error; }
14
- }
15
- return ar;
16
- };
17
1
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
18
- import { Fragment, useState } from 'react';
2
+ import { Fragment } from 'react';
19
3
  import { styles } from '../../../BarChart/styles';
20
4
  import { TouchableOpacity, View } from 'react-native';
21
5
  import { getXForLineInBar, getYForLineInBar } from 'gifted-charts-core';
@@ -23,8 +7,7 @@ import { Rect, Text as CanvasText, Circle, ForeignObject, } from 'react-native-s
23
7
  import { isWebApp } from '../../../utils';
24
8
  export var renderDataPoints = function (props) {
25
9
  var data = props.data, lineConfig = props.lineConfig, barWidth = props.barWidth, containerHeight = props.containerHeight, maxValue = props.maxValue, firstBarWidth = props.firstBarWidth, yAxisLabelWidth = props.yAxisLabelWidth, spacing = props.spacing, selectedIndex = props.selectedIndex, yAxisOffset = props.yAxisOffset, opacity = props.opacity, svgHeight = props.svgHeight, totalWidth = props.totalWidth;
26
- var focusEnabled = lineConfig.focusEnabled, dataPointLabelComponent = lineConfig.dataPointLabelComponent, showDataPointLabelOnFocus = lineConfig.showDataPointLabelOnFocus, focusedDataPointIndex = lineConfig.focusedDataPointIndex;
27
- var _a = __read(useState(focusedDataPointIndex !== null && focusedDataPointIndex !== void 0 ? focusedDataPointIndex : -1), 2), selectedDataPointIndex = _a[0], setSelectedDataPointIndex = _a[1];
10
+ var focusEnabled = lineConfig.focusEnabled, dataPointLabelComponent = lineConfig.dataPointLabelComponent, showDataPointLabelOnFocus = lineConfig.showDataPointLabelOnFocus, focusedDataPointIndex = lineConfig.focusedDataPointIndex, setFocusedDataPointIndex = lineConfig.setFocusedDataPointIndex;
28
11
  return (_jsxs(_Fragment, { children: [data.map(function (item, index) {
29
12
  var _a, _b, _c;
30
13
  if (index < lineConfig.startIndex ||
@@ -34,10 +17,10 @@ export var renderDataPoints = function (props) {
34
17
  }
35
18
  var currentBarWidth = item.barWidth || barWidth || 30;
36
19
  var customDataPoint = item.customDataPoint || lineConfig.customDataPoint;
37
- var dataPointColor = lineConfig.focusEnabled && index === selectedDataPointIndex
20
+ var dataPointColor = lineConfig.focusEnabled && index === focusedDataPointIndex
38
21
  ? lineConfig.focusedDataPointColor
39
22
  : lineConfig.dataPointsColor;
40
- var dataPointRadius = lineConfig.focusEnabled && index === selectedDataPointIndex
23
+ var dataPointRadius = lineConfig.focusEnabled && index === focusedDataPointIndex
41
24
  ? lineConfig.focusedDataPointRadius
42
25
  : lineConfig.dataPointsRadius;
43
26
  var value = (_a = item.value) !== null && _a !== void 0 ? _a : item.stacks.reduce(function (total, item) { return total + item.value; }, 0);
@@ -57,20 +40,20 @@ export var renderDataPoints = function (props) {
57
40
  },
58
41
  ], onPress: function () {
59
42
  if (focusEnabled)
60
- setSelectedDataPointIndex(index);
43
+ setFocusedDataPointIndex(index);
61
44
  }, children: customDataPoint(item, index) }, index + '.' + value + 'custom'));
62
45
  }
63
46
  if (lineConfig.dataPointsShape === 'rectangular') {
64
47
  return (_jsxs(Fragment, { children: [_jsx(Rect, { x: x, y: y - lineConfig.dataPointsHeight / 2, width: lineConfig.dataPointsWidth, height: lineConfig.dataPointsHeight, fill: dataPointColor, opacity: opacity, onPress: function () {
65
48
  if (focusEnabled)
66
- setSelectedDataPointIndex(index);
49
+ setFocusedDataPointIndex(index);
67
50
  } }), item.dataPointText && (_jsx(CanvasText, { fill: item.textColor || lineConfig.textColor, opacity: opacity, fontSize: item.textFontSize || lineConfig.textFontSize, x: x + (item.textShiftX || lineConfig.textShiftX || 0), y: y -
68
51
  lineConfig.dataPointsHeight / 2 +
69
52
  (item.textShiftY || lineConfig.textShiftY || 0), children: item.dataPointText }))] }, index + '.' + value + 'rect'));
70
53
  }
71
54
  return (_jsxs(Fragment, { children: [_jsx(Circle, { cx: x, cy: y, r: dataPointRadius, fill: dataPointColor, opacity: opacity, onPress: function () {
72
55
  if (focusEnabled)
73
- setSelectedDataPointIndex(index);
56
+ setFocusedDataPointIndex(index);
74
57
  } }), item.dataPointText && (_jsx(CanvasText, { fill: item.textColor || lineConfig.textColor, opacity: opacity, fontSize: item.textFontSize || lineConfig.textFontSize, x: x + (item.textShiftX || lineConfig.textShiftX || 0), y: y -
75
58
  lineConfig.dataPointsHeight / 2 +
76
59
  (item.textShiftY || lineConfig.textShiftY || 0), children: item.dataPointText }))] }, index + '.' + value + 'circ'));
@@ -88,12 +71,12 @@ export var renderDataPoints = function (props) {
88
71
  var y = getYForLineInBar(value, lineConfig.shiftY, containerHeight, maxValue, yAxisOffset);
89
72
  if (isWebApp)
90
73
  return (_jsx(ForeignObject, { height: svgHeight, width: totalWidth, x: x - 12, y: y - 24, children: showDataPointLabelOnFocus
91
- ? selectedDataPointIndex === index
74
+ ? focusedDataPointIndex === index
92
75
  ? dataPointLabelComponent === null || dataPointLabelComponent === void 0 ? void 0 : dataPointLabelComponent(item, index)
93
76
  : null
94
77
  : dataPointLabelComponent === null || dataPointLabelComponent === void 0 ? void 0 : dataPointLabelComponent(item, index) }, index + '.' + value + 'label'));
95
78
  return (_jsx(View, { style: { top: y - 24, left: x - 12, position: 'absolute' }, children: showDataPointLabelOnFocus
96
- ? selectedDataPointIndex === index
79
+ ? focusedDataPointIndex === index
97
80
  ? dataPointLabelComponent === null || dataPointLabelComponent === void 0 ? void 0 : dataPointLabelComponent(item, index)
98
81
  : null
99
82
  : dataPointLabelComponent === null || dataPointLabelComponent === void 0 ? void 0 : dataPointLabelComponent(item, index) }, index + '.' + value + 'label'));
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ type RotatablePieProps = {
3
+ initialAngle: number;
4
+ size: number;
5
+ children: React.ReactNode;
6
+ onAngleChange?: (angle: number) => void;
7
+ };
8
+ export declare function RotatablePie({ initialAngle, size, children, onAngleChange, }: RotatablePieProps): import("react/jsx-runtime").JSX.Element;
9
+ export {};
@@ -0,0 +1,132 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ var __read = (this && this.__read) || function (o, n) {
13
+ var m = typeof Symbol === "function" && o[Symbol.iterator];
14
+ if (!m) return o;
15
+ var i = m.call(o), r, ar = [], e;
16
+ try {
17
+ while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
18
+ }
19
+ catch (error) { e = { error: error }; }
20
+ finally {
21
+ try {
22
+ if (r && !r.done && (m = i["return"])) m.call(i);
23
+ }
24
+ finally { if (e) throw e.error; }
25
+ }
26
+ return ar;
27
+ };
28
+ import { jsx as _jsx } from "react/jsx-runtime";
29
+ import { useRef, useState, useEffect } from 'react';
30
+ import { View, PanResponder, Animated, StyleSheet, } from 'react-native';
31
+ // ----------------------------------------
32
+ // Ultra-smooth animation helper
33
+ // Throttles to ~60 FPS AND applies low-pass filtering
34
+ // ----------------------------------------
35
+ function createSmoothUpdater(animatedValue, smoothing, fps) {
36
+ if (smoothing === void 0) { smoothing = 0.15; }
37
+ if (fps === void 0) { fps = 60; }
38
+ var frameDelay = 1000 / fps;
39
+ var lastTime = 0;
40
+ var filtered = 0; // low-pass output
41
+ var timeout = null;
42
+ return function (target) {
43
+ var now = Date.now();
44
+ var diff = now - lastTime;
45
+ var update = function () {
46
+ // low-pass filter (natural smoothing)
47
+ filtered = filtered * (1 - smoothing) + target * smoothing;
48
+ animatedValue.setValue(filtered);
49
+ };
50
+ if (diff >= frameDelay) {
51
+ lastTime = now;
52
+ update();
53
+ }
54
+ else {
55
+ clearTimeout(timeout);
56
+ timeout = setTimeout(function () {
57
+ lastTime = Date.now();
58
+ update();
59
+ }, frameDelay - diff);
60
+ }
61
+ };
62
+ }
63
+ export function RotatablePie(_a) {
64
+ var initialAngle = _a.initialAngle, size = _a.size, children = _a.children, onAngleChange = _a.onAngleChange;
65
+ var angle = useRef(new Animated.Value(initialAngle)).current;
66
+ var _b = __read(useState({ x: size / 2, y: size / 2 }), 2), center = _b[0], setCenter = _b[1];
67
+ var gestureStartAngle = useRef(0);
68
+ var startAngle = useRef(initialAngle);
69
+ // Create smooth updater ONCE
70
+ var smoothSetAngle = useRef(createSmoothUpdater(angle, 0.15, 60)).current;
71
+ useEffect(function () {
72
+ angle.setValue(initialAngle);
73
+ startAngle.current = initialAngle;
74
+ }, [initialAngle, angle]);
75
+ useEffect(function () {
76
+ var id = angle.addListener(function (_a) {
77
+ var value = _a.value;
78
+ return onAngleChange === null || onAngleChange === void 0 ? void 0 : onAngleChange(value);
79
+ });
80
+ return function () { return angle.removeListener(id); };
81
+ }, [angle, onAngleChange]);
82
+ var onLayout = function (e) {
83
+ var _a = e.nativeEvent.layout, width = _a.width, height = _a.height;
84
+ setCenter({ x: width / 2, y: height / 2 });
85
+ };
86
+ var getTouchAngleDeg = function (x, y) {
87
+ var dx = x - center.x;
88
+ var dy = y - center.y;
89
+ var rad = Math.atan2(dy, dx);
90
+ return (rad * 180) / Math.PI;
91
+ };
92
+ var panResponder = useRef(PanResponder.create({
93
+ onStartShouldSetPanResponder: function () { return true; },
94
+ onMoveShouldSetPanResponder: function () { return true; },
95
+ onPanResponderGrant: function (evt) {
96
+ var _a = evt.nativeEvent, locationX = _a.locationX, locationY = _a.locationY;
97
+ gestureStartAngle.current = getTouchAngleDeg(locationX, locationY);
98
+ angle.stopAnimation(function (current) {
99
+ startAngle.current = current;
100
+ });
101
+ },
102
+ onPanResponderMove: function (evt) {
103
+ var _a = evt.nativeEvent, locationX = _a.locationX, locationY = _a.locationY;
104
+ var currentAngle = getTouchAngleDeg(locationX, locationY);
105
+ var delta = currentAngle - gestureStartAngle.current;
106
+ if (delta > 180)
107
+ delta -= 360;
108
+ if (delta < -180)
109
+ delta += 360;
110
+ var next = startAngle.current + delta;
111
+ // 🔥 SUPER SMOOTH UPDATE
112
+ smoothSetAngle(next);
113
+ },
114
+ })).current;
115
+ var rotateInterpolation = angle.interpolate({
116
+ inputRange: [-360, 360],
117
+ outputRange: ['-360deg', '360deg'],
118
+ });
119
+ return (_jsx(View, __assign({ onLayout: onLayout, style: [styles.container, { width: size, height: size }] }, panResponder.panHandlers, { children: _jsx(Animated.View, { style: {
120
+ width: size,
121
+ height: size,
122
+ justifyContent: 'center',
123
+ alignItems: 'center',
124
+ transform: [{ rotate: rotateInterpolation }],
125
+ }, children: children }) })));
126
+ }
127
+ var styles = StyleSheet.create({
128
+ container: {
129
+ alignItems: 'center',
130
+ justifyContent: 'center',
131
+ },
132
+ });
@@ -869,6 +869,8 @@ export var LineChart = function (props) {
869
869
  }
870
870
  };
871
871
  var renderLine = function (containerHeightIncludingBelowXAxis, zIndex, points, currentLineThickness, color, fillPoints, startFillColor, endFillColor, startOpacity, endOpacity, strokeDashArray, strokeLinecap, showArrow, arrowPoints, arrowStrokeWidth, arrowStrokeColor, arrowFillColor, hideDataPoints, paramData, propsData, dataPointsShape, dataPointsWidth, dataPointsHeight, dataPointsColor, dataPointsRadius, textColor, textFontSize, startIndex, endIndex, isSecondary, showValuesAsDataPointsText, spacingArray, key) {
872
+ if (!points)
873
+ return null;
872
874
  return (_jsx(View, { onPointerEnter: function () { var _a; return (_a = pointerConfig === null || pointerConfig === void 0 ? void 0 : pointerConfig.onPointerEnter) === null || _a === void 0 ? void 0 : _a.call(pointerConfig); }, onPointerLeave: function () { var _a; return (_a = pointerConfig === null || pointerConfig === void 0 ? void 0 : pointerConfig.onPointerLeave) === null || _a === void 0 ? void 0 : _a.call(pointerConfig); }, onTouchStart: function () { var _a; return (_a = pointerConfig === null || pointerConfig === void 0 ? void 0 : pointerConfig.onTouchStart) === null || _a === void 0 ? void 0 : _a.call(pointerConfig); }, onTouchEnd: function () { var _a; return (_a = pointerConfig === null || pointerConfig === void 0 ? void 0 : pointerConfig.onTouchEnd) === null || _a === void 0 ? void 0 : _a.call(pointerConfig); }, onMoveShouldSetResponder: function (evt) { return (pointerConfig ? true : false); }, onStartShouldSetResponder: function (evt) {
873
875
  return pointerConfig && activatePointersInstantlyOnTouch ? true : false;
874
876
  }, onResponderGrant: function (evt) {
@@ -934,6 +936,8 @@ export var LineChart = function (props) {
934
936
  ], children: lineSvgComponent(points, currentLineThickness, color, fillPoints, startFillColor, endFillColor, startOpacity, endOpacity, strokeDashArray, strokeLinecap, showArrow, arrowPoints, arrowStrokeWidth, arrowStrokeColor, arrowFillColor, key, hideDataPoints, paramData, propsData, dataPointsShape, dataPointsWidth, dataPointsHeight, dataPointsColor, dataPointsRadius, textColor, textFontSize, startIndex, endIndex, isSecondary, showValuesAsDataPointsText, spacingArray) }, key !== null && key !== void 0 ? key : 0));
935
937
  };
936
938
  var renderAnimatedLine = function (containerHeightIncludingBelowXAxis, zIndex, points, animatedWidth, currentLineThickness, color, fillPoints, startFillColor, endFillColor, startOpacity, endOpacity, strokeDashArray, strokeLinecap, showArrow, arrowPoints, arrowStrokeWidth, arrowStrokeColor, arrowFillColor, hideDataPoints, paramsData, propsData, dataPointsShape, dataPointsWidth, dataPointsHeight, dataPointsColor, dataPointsRadius, textColor, textFontSize, startIndex, endIndex, isSecondary, showValuesAsDataPointsText, spacingArray, key) {
939
+ if (!points)
940
+ return null;
937
941
  return (_jsx(Animated.View, { onPointerEnter: function () { var _a; return (_a = pointerConfig === null || pointerConfig === void 0 ? void 0 : pointerConfig.onPointerEnter) === null || _a === void 0 ? void 0 : _a.call(pointerConfig); }, onPointerLeave: function () { var _a; return (_a = pointerConfig === null || pointerConfig === void 0 ? void 0 : pointerConfig.onPointerLeave) === null || _a === void 0 ? void 0 : _a.call(pointerConfig); }, onMoveShouldSetResponder: function (evt) { return (pointerConfig ? true : false); }, onStartShouldSetResponder: function (evt) {
938
942
  return pointerConfig && activatePointersInstantlyOnTouch ? true : false;
939
943
  }, onResponderGrant: function (evt) {
@@ -31,10 +31,11 @@ import { PieChartMain } from './main';
31
31
  import { pieColors, usePieChart } from 'gifted-charts-core';
32
32
  import { isWebApp } from '../utils';
33
33
  import { useState } from 'react';
34
+ import { RotatablePie } from '../Components/Rotatable';
34
35
  export var PieChart = function (props) {
35
36
  if (!props.data)
36
37
  return null;
37
- var _a = usePieChart(props), radius = _a.radius, extraRadius = _a.extraRadius, selectedIndex = _a.selectedIndex, setSelectedIndex = _a.setSelectedIndex, startAngle = _a.startAngle, total = _a.total, donut = _a.donut, isThreeD = _a.isThreeD, semiCircle = _a.semiCircle, inwardExtraLengthForFocused = _a.inwardExtraLengthForFocused, canvasWidth = _a.canvasWidth, canvasHeight = _a.canvasHeight, innerRadius = _a.innerRadius, innerCircleColor = _a.innerCircleColor, innerCircleBorderWidth = _a.innerCircleBorderWidth, innerCircleBorderColor = _a.innerCircleBorderColor, shiftInnerCenterX = _a.shiftInnerCenterX, shiftInnerCenterY = _a.shiftInnerCenterY, tiltAngle = _a.tiltAngle, isDataShifted = _a.isDataShifted, paddingHorizontal = _a.paddingHorizontal, paddingVertical = _a.paddingVertical, data = _a.data, showTooltip = _a.showTooltip, tooltipHorizontalShift = _a.tooltipHorizontalShift, tooltipVerticalShift = _a.tooltipVerticalShift, tooltipComponent = _a.tooltipComponent, getTooltipText = _a.getTooltipText, tooltipBackgroundColor = _a.tooltipBackgroundColor, tooltipBorderRadius = _a.tooltipBorderRadius, tooltipWidth = _a.tooltipWidth, tooltipTextNoOfLines = _a.tooltipTextNoOfLines, textColor = _a.textColor, textSize = _a.textSize, font = _a.font, fontWeight = _a.fontWeight, fontStyle = _a.fontStyle, tooltipSelectedIndex = _a.tooltipSelectedIndex, setTooltipSelectedIndex = _a.setTooltipSelectedIndex;
38
+ var _a = usePieChart(props), radius = _a.radius, extraRadius = _a.extraRadius, selectedIndex = _a.selectedIndex, setSelectedIndex = _a.setSelectedIndex, startAngle = _a.startAngle, total = _a.total, donut = _a.donut, isThreeD = _a.isThreeD, semiCircle = _a.semiCircle, inwardExtraLengthForFocused = _a.inwardExtraLengthForFocused, canvasWidth = _a.canvasWidth, canvasHeight = _a.canvasHeight, innerRadius = _a.innerRadius, innerCircleColor = _a.innerCircleColor, innerCircleBorderWidth = _a.innerCircleBorderWidth, innerCircleBorderColor = _a.innerCircleBorderColor, shiftInnerCenterX = _a.shiftInnerCenterX, shiftInnerCenterY = _a.shiftInnerCenterY, tiltAngle = _a.tiltAngle, isDataShifted = _a.isDataShifted, paddingHorizontal = _a.paddingHorizontal, paddingVertical = _a.paddingVertical, data = _a.data, showTooltip = _a.showTooltip, tooltipHorizontalShift = _a.tooltipHorizontalShift, tooltipVerticalShift = _a.tooltipVerticalShift, tooltipComponent = _a.tooltipComponent, getTooltipText = _a.getTooltipText, tooltipBackgroundColor = _a.tooltipBackgroundColor, tooltipBorderRadius = _a.tooltipBorderRadius, tooltipWidth = _a.tooltipWidth, tooltipTextNoOfLines = _a.tooltipTextNoOfLines, textColor = _a.textColor, textSize = _a.textSize, font = _a.font, fontWeight = _a.fontWeight, fontStyle = _a.fontStyle, tooltipSelectedIndex = _a.tooltipSelectedIndex, setTooltipSelectedIndex = _a.setTooltipSelectedIndex, rotatable = _a.rotatable;
38
39
  var _b = __read(useState(0), 2), touchX = _b[0], setTouchX = _b[1];
39
40
  var _c = __read(useState(0), 2), touchY = _c[0], setTouchY = _c[1];
40
41
  var renderInnerCircle = function (innerRadius, innerCircleBorderWidth) {
@@ -119,28 +120,34 @@ export var PieChart = function (props) {
119
120
  fontStyle: fontStyle,
120
121
  }, children: getTooltipText(tooltipSelectedIndex) }) })) }));
121
122
  };
122
- return (_jsxs(View, { style: {
123
- height: (radius + extraRadius + paddingVertical / 2) *
124
- (props.semiCircle ? 1 : 2),
125
- width: (radius + extraRadius + paddingHorizontal / 2) * 2,
126
- overflow: 'hidden',
127
- }, children: [_jsx(View, { style: { position: 'absolute' }, children: _jsx(PieChartMain, __assign({}, props, { setTouchX: setTouchX, setTouchY: setTouchY, tooltipSelectedIndex: tooltipSelectedIndex, setTooltipSelectedIndex: setTooltipSelectedIndex, setSelectedIndex: setSelectedIndex, paddingHorizontal: paddingHorizontal, paddingVertical: paddingVertical, extraRadius: extraRadius })) }), renderInnerCircle(innerRadius, innerCircleBorderWidth), props.data.length > 1 &&
128
- props.data[selectedIndex] && // don't forget to add this one so there are no errors when the data is empty / updating
129
- (props.focusOnPress || props.sectionAutoFocus) &&
130
- selectedIndex !== -1 && (_jsx(View, { pointerEvents: "box-none", style: {
131
- position: 'absolute',
132
- top: -extraRadius,
133
- left: -extraRadius,
134
- zIndex: isWebApp ? -1 : 0, // was not getting displayed in web (using Expo)
135
- }, children: _jsx(PieChartMain, __assign({}, props, { setTouchX: setTouchX, setTouchY: setTouchY, tooltipSelectedIndex: tooltipSelectedIndex, setTooltipSelectedIndex: setTooltipSelectedIndex, data: [
136
- __assign(__assign({}, props.data[selectedIndex]), { color: props.showGradient
137
- ? "url(#grad".concat(selectedIndex, ")")
138
- : props.data[selectedIndex].color ||
139
- pieColors[selectedIndex % 9] }),
140
- {
141
- value: total - props.data[selectedIndex].value,
142
- peripheral: true,
143
- strokeWidth: 0,
144
- },
145
- ], radius: radius + extraRadius, initialAngle: startAngle, innerRadius: props.innerRadius || radius / 2.5, isBiggerPie: true, setSelectedIndex: setSelectedIndex, paddingHorizontal: paddingHorizontal, paddingVertical: paddingVertical, extraRadius: extraRadius })) })), renderInnerCircle(innerRadius - inwardExtraLengthForFocused, inwardExtraLengthForFocused ? 0 : innerCircleBorderWidth), showTooltip && tooltipSelectedIndex !== -1 ? renderTooltip() : null] }));
123
+ var PieChartBody = function () {
124
+ return (_jsxs(View, { style: {
125
+ height: (radius + extraRadius + paddingVertical / 2) *
126
+ (props.semiCircle ? 1 : 2),
127
+ width: (radius + extraRadius + paddingHorizontal / 2) * 2,
128
+ overflow: 'hidden',
129
+ }, children: [_jsx(View, { style: { position: 'absolute' }, children: _jsx(PieChartMain, __assign({}, props, { setTouchX: setTouchX, setTouchY: setTouchY, tooltipSelectedIndex: tooltipSelectedIndex, setTooltipSelectedIndex: setTooltipSelectedIndex, selectedIndex: selectedIndex, setSelectedIndex: setSelectedIndex, paddingHorizontal: paddingHorizontal, paddingVertical: paddingVertical, extraRadius: extraRadius })) }), renderInnerCircle(innerRadius, innerCircleBorderWidth), props.data.length > 1 &&
130
+ props.data[selectedIndex] && // don't forget to add this one so there are no errors when the data is empty / updating
131
+ (props.focusOnPress || props.sectionAutoFocus) &&
132
+ selectedIndex !== -1 && (_jsx(View, { pointerEvents: "box-none", style: {
133
+ position: 'absolute',
134
+ top: -extraRadius,
135
+ left: -extraRadius,
136
+ zIndex: isWebApp ? -1 : 0, // was not getting displayed in web (using Expo)
137
+ }, children: _jsx(PieChartMain, __assign({}, props, { setTouchX: setTouchX, setTouchY: setTouchY, tooltipSelectedIndex: tooltipSelectedIndex, setTooltipSelectedIndex: setTooltipSelectedIndex, data: [
138
+ __assign(__assign({}, props.data[selectedIndex]), { color: props.showGradient
139
+ ? "url(#grad".concat(selectedIndex, ")")
140
+ : props.data[selectedIndex].color ||
141
+ pieColors[selectedIndex % 9] }),
142
+ {
143
+ value: total - props.data[selectedIndex].value,
144
+ peripheral: true,
145
+ strokeWidth: 0,
146
+ },
147
+ ], radius: radius + extraRadius, initialAngle: startAngle, innerRadius: props.innerRadius || radius / 2.5, isBiggerPie: true, selectedIndex: selectedIndex, setSelectedIndex: setSelectedIndex, paddingHorizontal: paddingHorizontal, paddingVertical: paddingVertical, extraRadius: extraRadius })) })), renderInnerCircle(innerRadius - inwardExtraLengthForFocused, inwardExtraLengthForFocused ? 0 : innerCircleBorderWidth), showTooltip && tooltipSelectedIndex !== -1 ? renderTooltip() : null] }));
148
+ };
149
+ if (rotatable && !semiCircle) {
150
+ return (_jsx(RotatablePie, { children: [_jsx(PieChartBody, {}, "PieChartBody")], initialAngle: startAngle, size: radius * 2 }));
151
+ }
152
+ return _jsx(PieChartBody, {});
146
153
  };
@@ -92,18 +92,19 @@ export var PieChartMain = function (props) {
92
92
  }) }), data.length === 1 || !total ? (_jsx(_Fragment, { children: _jsx(Circle, { cx: cx, cy: cy, r: radius, fill: showGradient
93
93
  ? "url(#grad".concat(0, ")")
94
94
  : ((_a = data[0]) === null || _a === void 0 ? void 0 : _a.color) || pieColors[0 % 9] }) })) : (data.map(function (item, index) {
95
- var _a = coordinates[index], sx = _a.sx, sy = _a.sy, ax = _a.ax, ay = _a.ay;
95
+ var _a;
96
+ var _b = coordinates[index], sx = _b.sx, sy = _b.sy, ax = _b.ax, ay = _b.ay;
96
97
  if (isBiggerPie && index)
97
98
  return null;
98
99
  return (_jsx(Path, { d: "M ".concat(cx + (item.shiftX || 0), " ").concat(cy + (item.shiftY || 0), " L ").concat(sx, " ").concat(sy, " A ").concat(radius, " ").concat(radius, " 0 ").concat(semiCircle ? 0 : data[index].value > total / 2 ? 1 : 0, " 1 ").concat(ax, " ").concat(ay, " L ").concat(cx + (item.shiftX || 0), " ").concat(cy + (item.shiftY || 0)), stroke: item.strokeColor || strokeColor, strokeWidth: props.focusOnPress && props.selectedIndex === index
99
100
  ? 0
100
101
  : item.strokeWidth === 0
101
102
  ? 0
102
- : item.strokeWidth || strokeWidth, fill: props.selectedIndex === index || item.peripheral
103
+ : item.strokeWidth || strokeWidth, fill: item.peripheral
103
104
  ? 'none'
104
105
  : showGradient
105
106
  ? "url(#grad".concat(index, ")")
106
- : item.color || pieColors[index % 9] }, index + 'a'));
107
+ : item.color || pieColors[isBiggerPie ? (_a = props.selectedIndex) !== null && _a !== void 0 ? _a : 0 % 9 : index % 9] }, index + 'a'));
107
108
  })), (showText || showInnerComponent || showExternalLabels) &&
108
109
  data.map(function (item, index) {
109
110
  var _a, _b, _c, _d, _e, _f, _g, _h, _j;
@@ -162,7 +163,7 @@ export var PieChartMain = function (props) {
162
163
  item.textSize ||
163
164
  textSize, fill: item.textBackgroundColor || textBackgroundColor })) : null, showText && (_jsx(SvgText, { fill: item.textColor ||
164
165
  textColor ||
165
- pieColors[(index + 2) % 9], fontSize: item.textSize || textSize, fontFamily: item.font || font, fontWeight: item.fontWeight || fontWeight, fontStyle: item.fontStyle || fontStyle || 'normal', x: x +
166
+ 'black', fontSize: item.textSize || textSize, fontFamily: item.font || font, fontWeight: item.fontWeight || fontWeight, fontStyle: item.fontStyle || fontStyle || 'normal', x: x +
166
167
  (item.shiftTextX || 0) -
167
168
  (item.textSize || textSize) / 1.8, y: y + (item.shiftTextY || 0), children: item.text || (showValuesAsLabels ? item.value + '' : '') })), localPieInnerComponent ? (_jsx(G, { x: x - pieInnerComponentHeight / 2, y: y - pieInnerComponentWidth / 2, children: (_j = localPieInnerComponent === null || localPieInnerComponent === void 0 ? void 0 : localPieInnerComponent(item, index)) !== null && _j !== void 0 ? _j : null })) : null] }, index));
168
169
  })] }), isThreeD && shadow && !semiCircle ? (_jsx(View, { style: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-native-gifted-charts",
3
- "version": "1.4.69",
3
+ "version": "1.4.70",
4
4
  "description": "The most complete library for Bar, Line, Area, Pie, Donut, Stacked Bar, Population Pyramid and Radar charts in React Native. Allows 2D, 3D, gradient, animations and live data updates.",
5
5
  "main": "dist/index.js",
6
6
  "files": [
@@ -26,7 +26,7 @@
26
26
  "registry": "https://registry.npmjs.org/"
27
27
  },
28
28
  "dependencies": {
29
- "gifted-charts-core": "0.1.71"
29
+ "gifted-charts-core": "0.1.72"
30
30
  },
31
31
  "devDependencies": {
32
32
  "@babel/cli": "^7.24.8",