gifted-charts-core 0.0.13 → 0.0.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gifted-charts-core",
-  "version": "0.0.13",
+  "version": "0.0.15",
   "description": "Mathematical and logical utilities used by react-gifted-charts and react-native-gifted-charts",
   "main": "index.ts",
   "files": [

package/src/BarChart/Animated2DWithGradient.ts

@@ -13,7 +13,7 @@ export const getPropsForAnimated2DWithGradient = (props) => {
     barBorderBottomLeftRadius,
     barBorderBottomRightRadius,
     barWidth,
-    localBarInnerComponent,
+    barInnerComponent,
     barStyle,
     index,
     opacity,
@@ -54,7 +54,7 @@ export const getPropsForAnimated2DWithGradient = (props) => {
     focusedBarConfig,
     item.frontColor,
     frontColor,
-    isThreeD,
+    isThreeD
   );
   const localGradientColor = item.gradientColor || gradientColor;
   const localOpacity = opacity || 1;
@@ -118,8 +118,8 @@ export const getPropsForAnimated2DWithGradient = (props) => {
   const commonPropsFor2Dand3Dbars: CommonPropsFor2Dand3DbarsType = {
     barBackgroundPattern: item.barBackgroundPattern || barBackgroundPattern,
     barInnerComponent: isFocused
-      ? focusedBarConfig?.barInnerComponent ?? localBarInnerComponent
-      : localBarInnerComponent,
+      ? focusedBarConfig?.barInnerComponent ?? barInnerComponent
+      : barInnerComponent,
     patternId: item.patternId || patternId,
     barWidth: localBarWidth,
     barStyle: barStyle,

package/src/BarChart/index.ts

@@ -602,6 +602,7 @@ export const useBarChart = (props: extendedBarChartPropsType) => {
       patternId: props.patternId,
       onPress: props.onPress,
       onLongPress: props.onLongPress,
+      onPressOut: props.onPressOut,
       focusBarOnPress: props.focusBarOnPress,
       focusedBarConfig: props.focusedBarConfig,
       xAxisTextNumberOfLines: xAxisTextNumberOfLines,
@@ -613,6 +614,7 @@ export const useBarChart = (props: extendedBarChartPropsType) => {
       selectedIndex: selectedIndex,
       setSelectedIndex: setSelectedIndex,
       activeOpacity: props.activeOpacity || 0.2,
+      noOfSectionsBelowXAxis,
 
       leftShiftForLastIndexTooltip: props.leftShiftForLastIndexTooltip || 0,
       label:

package/src/BarChart/types.ts

@@ -13,6 +13,7 @@ import { Component, ReactNode } from "react";
 export type stackDataItem = {
   onPress?: any;
   onLongPress?: any;
+  onPressOut?: any;
   label?: String;
   barWidth?: number;
   spacing?: number;
@@ -77,6 +78,7 @@ export type StackedBarChartPropsType = {
   barWidth?: number;
   onPress?: Function;
   onLongPress?: Function;
+  onPressOut?: Function;
 
   rotateLabel?: boolean;
   showXAxisIndices: boolean;
@@ -280,6 +282,7 @@ export type BarChartPropsType = {
   barMarginBottom?: number;
   onPress?: Function;
   onLongPress?: Function;
+  onPressOut?: Function;
   renderTooltip?: Function;
   leftShiftForTooltip?: number;
   leftShiftForLastIndexTooltip?: number;
@@ -298,6 +301,7 @@ export type BarChartPropsType = {
   onEndReached?: () => void;
   onStartReached?: () => void;
   endReachedOffset?: number;
+  onScroll?: Function;
 
   focusBarOnPress?: boolean;
   focusedBarConfig?: FocusedBarConfig;
@@ -392,6 +396,7 @@ export type barDataItem = {
   value: number;
   onPress?: any;
   onLongPress?: any;
+  onPressOut?: any;
   frontColor?: ColorValue;
   sideColor?: ColorValue;
   topColor?: ColorValue;
@@ -532,6 +537,7 @@ export type RenderBarsPropsType = {
   barMarginBottom?: number;
   onPress?: Function;
   onLongPress?: Function;
+  onPressOut?: Function;
   xAxisTextNumberOfLines: number;
   xAxisLabelsHeight?: number;
   xAxisLabelsVerticalShift: number;
@@ -545,6 +551,7 @@ export type RenderBarsPropsType = {
   xAxisThickness?: number;
   pointerConfig?: Pointer;
   focusBarOnPress?: boolean;
+  noOfSectionsBelowXAxis?: number;
 };
 
 export type trianglePropTypes = {

package/src/LineChart/index.ts

@@ -1571,7 +1571,7 @@ export const useLineChart = (props: extendedLineChartPropsType) => {
   const stepHeight = props.stepHeight || containerHeight / noOfSections;
   const stepValue = props.stepValue || maxValue / noOfSections;
   const noOfSectionsBelowXAxis =
-    props.noOfSectionsBelowXAxis || -mostNegativeValue / (stepValue || 1);
+    props.noOfSectionsBelowXAxis ?? -mostNegativeValue / (stepValue || 1);
 
   const showXAxisIndices =
     props.showXAxisIndices ?? AxesAndRulesDefaults.showXAxisIndices;

package/src/LineChart/types.ts

@@ -319,6 +319,7 @@ export type LineChartPropsType = {
   onEndReached?: () => void;
   onStartReached?: () => void;
   endReachedOffset?: number;
+  onScroll?: Function;
 
   showDataPointsForMissingValues?: boolean;
   interpolateMissingValues?: boolean;
@@ -580,4 +581,5 @@ export type LineChartBicolorPropsType = {
   adjustToWidth?: boolean;
   getPointerProps?: Function;
   formatYLabel?: (label: string) => string;
+  onScroll?: Function;
 };

package/src/PieChart/index.ts

@@ -1,5 +1,6 @@
 import { useEffect, useState } from "react";
 import { PieChartPropsType } from "./types";
+import { getTextSizeForPieLabels } from "../utils";
 
 export const usePieChart = (props: PieChartPropsType) => {
   const radius = props.radius || 120;
@@ -88,6 +89,16 @@ export const usePieChart = (props: PieChartPropsType) => {
       isDataShifted = true;
     }
   });
+  const textSize = getTextSizeForPieLabels(props.textSize ?? 0, radius);
+
+  const paddingHorizontal =
+    props.paddingHorizontal ?? props.labelsPosition === "onBorder"
+      ? (props.textBackgroundRadius ?? textSize) * 2 + 6
+      : 0;
+  const paddingVertical =
+    props.paddingVertical ?? props.labelsPosition === "onBorder"
+      ? (props.textBackgroundRadius ?? textSize) * 2 + 6
+      : 0;
 
   return {
     radius,
@@ -115,5 +126,7 @@ export const usePieChart = (props: PieChartPropsType) => {
     shiftInnerCenterY,
     tiltAngle,
     isDataShifted,
+    paddingHorizontal,
+    paddingVertical,
   };
 };

package/src/PieChart/main.ts

@@ -1,7 +1,14 @@
+import { getTextSizeForPieLabels } from "../utils";
 import { PieChartMainProps, pieDataItem } from "./types";
 
 export const getPieChartMainProps = (props: PieChartMainProps) => {
-  const { isThreeD, isBiggerPie } = props;
+  const {
+    isThreeD,
+    isBiggerPie,
+    paddingHorizontal,
+    paddingVertical,
+    extraRadiusForFocused,
+  } = props;
   const propData = props.data;
   const data: Array<pieDataItem> = [];
   let itemHasInnerComponent = false;
@@ -41,8 +48,7 @@ export const getPieChartMainProps = (props: PieChartMainProps) => {
 
   const showText = props.showText || false;
   const textColor = props.textColor || "";
-  const textSize = props.textSize ? Math.min(props.textSize, radius / 5) : 16;
-
+  const textSize = getTextSizeForPieLabels(props.textSize ?? 0, radius);
   let tiltAngle = props.tiltAngle || "55deg";
   if (
     tiltAngle &&
@@ -160,5 +166,8 @@ export const getPieChartMainProps = (props: PieChartMainProps) => {
     pData,
     mData,
     acc,
+    paddingHorizontal,
+    paddingVertical,
+    extraRadiusForFocused,
   };
 };

package/src/PieChart/types.ts

@@ -49,6 +49,8 @@ export type PieChartPropsType = {
   pieInnerComponent?: (item?: pieDataItem, index?: number) => any;
   pieInnerComponentHeight?: number;
   pieInnerComponentWidth?: number;
+  paddingHorizontal?: number;
+  paddingVertical?: number;
 };
 export type pieDataItem = {
   value: number;
@@ -79,4 +81,7 @@ export type pieDataItem = {
 export interface PieChartMainProps extends PieChartPropsType {
   setSelectedIndex: Function;
   isBiggerPie?: boolean;
+  paddingHorizontal: number;
+  paddingVertical: number;
+  extraRadiusForFocused: number;
 }

package/src/utils/index.tsx

@@ -1373,3 +1373,8 @@ export const getLineSegmentsForMissingValues = (
   }
   return segments;
 };
+
+export const getTextSizeForPieLabels = (
+  textSize: number,
+  radius: number
+): number => (textSize ? Math.min(textSize, radius / 5) : 16);