gifted-charts-core 0.1.17 → 0.1.19

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gifted-charts-core",
-  "version": "0.1.17",
+  "version": "0.1.19",
   "description": "Mathematical and logical utilities used by react-gifted-charts and react-native-gifted-charts",
   "main": "./src/index.js",
   "files": [

package/src/BarChart/Animated2DWithGradient.js

@@ -25,7 +25,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 };
 import { getBarFrontColor, getBarWidth } from '../utils';
 export var getPropsForAnimated2DWithGradient = function (props) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3;
     var barBorderWidth = props.barBorderWidth, barBorderColor = props.barBorderColor, barBorderRadius = props.barBorderRadius, item = props.item, barBorderTopLeftRadius = props.barBorderTopLeftRadius, barBorderTopRightRadius = props.barBorderTopRightRadius, barBorderBottomLeftRadius = props.barBorderBottomLeftRadius, barBorderBottomRightRadius = props.barBorderBottomRightRadius, barWidth = props.barWidth, barInnerComponent = props.barInnerComponent, barStyle = props.barStyle, index = props.index, opacity = props.opacity, barHeight = props.barHeight, intactTopLabel = props.intactTopLabel, showValuesAsTopLabel = props.showValuesAsTopLabel, topLabelContainerStyle = props.topLabelContainerStyle, topLabelTextStyle = props.topLabelTextStyle, roundedBottom = props.roundedBottom, cappedBars = props.cappedBars, capRadius = props.capRadius, roundedTop = props.roundedTop, barBackgroundPattern = props.barBackgroundPattern, patternId = props.patternId, frontColor = props.frontColor, showGradient = props.showGradient, gradientColor = props.gradientColor, selectedIndex = props.selectedIndex, focusBarOnPress = props.focusBarOnPress, focusedBarConfig = props.focusedBarConfig, isThreeD = props.isThreeD, yAxisOffset = props.yAxisOffset;
     var isFocused = (focusBarOnPress !== null && focusBarOnPress !== void 0 ? focusBarOnPress : false) && selectedIndex === index;
     var itemOrPropsBarBorderRadius = (_b = (_a = item.barBorderRadius) !== null && _a !== void 0 ? _a : barBorderRadius) !== null && _b !== void 0 ? _b : 0;
@@ -41,16 +41,16 @@ export var getPropsForAnimated2DWithGradient = function (props) {
             position: 'absolute',
             width: '100%',
             height: '100%',
-            borderWidth: barBorderWidth !== null && barBorderWidth !== void 0 ? barBorderWidth : 0,
-            borderColor: barBorderColor,
+            borderWidth: (_f = (_e = item.barBorderWidth) !== null && _e !== void 0 ? _e : barBorderWidth) !== null && _f !== void 0 ? _f : 0,
+            borderColor: (_g = item.barBorderColor) !== null && _g !== void 0 ? _g : barBorderColor,
             borderRadius: localBarBorderRadius,
-            borderTopLeftRadius: (_f = (_e = item.barBorderTopLeftRadius) !== null && _e !== void 0 ? _e : barBorderTopLeftRadius) !== null && _f !== void 0 ? _f : localBarBorderRadius,
-            borderTopRightRadius: (_h = (_g = item.barBorderTopRightRadius) !== null && _g !== void 0 ? _g : barBorderTopRightRadius) !== null && _h !== void 0 ? _h : localBarBorderRadius,
-            borderBottomLeftRadius: (_k = (_j = item.barBorderBottomLeftRadius) !== null && _j !== void 0 ? _j : barBorderBottomLeftRadius) !== null && _k !== void 0 ? _k : localBarBorderRadius,
-            borderBottomRightRadius: (_m = (_l = item.barBorderBottomRightRadius) !== null && _l !== void 0 ? _l : barBorderBottomRightRadius) !== null && _m !== void 0 ? _m : localBarBorderRadius
+            borderTopLeftRadius: (_j = (_h = item.barBorderTopLeftRadius) !== null && _h !== void 0 ? _h : barBorderTopLeftRadius) !== null && _j !== void 0 ? _j : localBarBorderRadius,
+            borderTopRightRadius: (_l = (_k = item.barBorderTopRightRadius) !== null && _k !== void 0 ? _k : barBorderTopRightRadius) !== null && _l !== void 0 ? _l : localBarBorderRadius,
+            borderBottomLeftRadius: (_o = (_m = item.barBorderBottomLeftRadius) !== null && _m !== void 0 ? _m : barBorderBottomLeftRadius) !== null && _o !== void 0 ? _o : localBarBorderRadius,
+            borderBottomRightRadius: (_q = (_p = item.barBorderBottomRightRadius) !== null && _p !== void 0 ? _p : barBorderBottomRightRadius) !== null && _q !== void 0 ? _q : localBarBorderRadius
         }
     ];
-    if ((_o = roundedBottom !== null && roundedBottom !== void 0 ? roundedBottom : (isFocused && (focusedBarConfig === null || focusedBarConfig === void 0 ? void 0 : focusedBarConfig.roundedBottom))) !== null && _o !== void 0 ? _o : false) {
+    if ((_r = roundedBottom !== null && roundedBottom !== void 0 ? roundedBottom : (isFocused && (focusedBarConfig === null || focusedBarConfig === void 0 ? void 0 : focusedBarConfig.roundedBottom))) !== null && _r !== void 0 ? _r : false) {
         commonStyleForBar.push({
             borderBottomLeftRadius: localBarWidth / 2,
             borderBottomRightRadius: localBarWidth / 2
@@ -58,11 +58,11 @@ export var getPropsForAnimated2DWithGradient = function (props) {
     }
     if (cappedBars !== null && cappedBars !== void 0 ? cappedBars : false) {
         commonStyleForBar.push({
-            borderTopLeftRadius: item.capRadius === 0 ? 0 : (_q = (_p = item.capRadius) !== null && _p !== void 0 ? _p : capRadius) !== null && _q !== void 0 ? _q : 0,
-            borderTopRightRadius: item.capRadius === 0 ? 0 : (_s = (_r = item.capRadius) !== null && _r !== void 0 ? _r : capRadius) !== null && _s !== void 0 ? _s : 0
+            borderTopLeftRadius: item.capRadius === 0 ? 0 : (_t = (_s = item.capRadius) !== null && _s !== void 0 ? _s : capRadius) !== null && _t !== void 0 ? _t : 0,
+            borderTopRightRadius: item.capRadius === 0 ? 0 : (_v = (_u = item.capRadius) !== null && _u !== void 0 ? _u : capRadius) !== null && _v !== void 0 ? _v : 0
         });
     }
-    if ((_t = roundedTop !== null && roundedTop !== void 0 ? roundedTop : (isFocused && (focusedBarConfig === null || focusedBarConfig === void 0 ? void 0 : focusedBarConfig.roundedTop))) !== null && _t !== void 0 ? _t : false) {
+    if ((_w = roundedTop !== null && roundedTop !== void 0 ? roundedTop : (isFocused && (focusedBarConfig === null || focusedBarConfig === void 0 ? void 0 : focusedBarConfig.roundedTop))) !== null && _w !== void 0 ? _w : false) {
         commonStyleForBar.push({
             borderTopLeftRadius: localBarWidth / 2,
             borderTopRightRadius: localBarWidth / 2
@@ -74,22 +74,22 @@ export var getPropsForAnimated2DWithGradient = function (props) {
         }
     ], false);
     var commonPropsFor2Dand3Dbars = {
-        barBackgroundPattern: (_u = item.barBackgroundPattern) !== null && _u !== void 0 ? _u : barBackgroundPattern,
+        barBackgroundPattern: (_x = item.barBackgroundPattern) !== null && _x !== void 0 ? _x : barBackgroundPattern,
         barInnerComponent: isFocused
-            ? (_v = focusedBarConfig === null || focusedBarConfig === void 0 ? void 0 : focusedBarConfig.barInnerComponent) !== null && _v !== void 0 ? _v : barInnerComponent
+            ? (_y = focusedBarConfig === null || focusedBarConfig === void 0 ? void 0 : focusedBarConfig.barInnerComponent) !== null && _y !== void 0 ? _y : barInnerComponent
             : barInnerComponent,
-        patternId: (_w = item.patternId) !== null && _w !== void 0 ? _w : patternId,
+        patternId: (_z = item.patternId) !== null && _z !== void 0 ? _z : patternId,
         barWidth: localBarWidth,
         barStyle: barStyle,
         item: item,
         index: index,
         frontColor: localFrontColor,
-        showGradient: (_y = (_x = item.showGradient) !== null && _x !== void 0 ? _x : showGradient) !== null && _y !== void 0 ? _y : false,
+        showGradient: (_1 = (_0 = item.showGradient) !== null && _0 !== void 0 ? _0 : showGradient) !== null && _1 !== void 0 ? _1 : false,
         gradientColor: isFocused
-            ? (_z = focusedBarConfig === null || focusedBarConfig === void 0 ? void 0 : focusedBarConfig.gradientColor) !== null && _z !== void 0 ? _z : localGradientColor
+            ? (_2 = focusedBarConfig === null || focusedBarConfig === void 0 ? void 0 : focusedBarConfig.gradientColor) !== null && _2 !== void 0 ? _2 : localGradientColor
             : localGradientColor,
         opacity: isFocused
-            ? (_0 = focusedBarConfig === null || focusedBarConfig === void 0 ? void 0 : focusedBarConfig.opacity) !== null && _0 !== void 0 ? _0 : localOpacity
+            ? (_3 = focusedBarConfig === null || focusedBarConfig === void 0 ? void 0 : focusedBarConfig.opacity) !== null && _3 !== void 0 ? _3 : localOpacity
             : localOpacity,
         height: barHeight,
         intactTopLabel: intactTopLabel,

package/src/BarChart/Animated2DWithGradient.ts

@@ -99,8 +99,8 @@ export const getPropsForAnimated2DWithGradient = (
       position: 'absolute',
       width: '100%',
       height: '100%',
-      borderWidth: barBorderWidth ?? 0,
-      borderColor: barBorderColor,
+      borderWidth: item.barBorderWidth ?? barBorderWidth ?? 0,
+      borderColor: item.barBorderColor ?? barBorderColor,
       borderRadius: localBarBorderRadius,
       borderTopLeftRadius:
         item.barBorderTopLeftRadius ??

package/src/BarChart/index.js

@@ -490,6 +490,7 @@ export var useBarChart = function (props) {
         scrollAnimation: scrollAnimation,
         scrollEventThrottle: scrollEventThrottle,
         indicatorColor: props.indicatorColor,
+        selectedIndex: selectedIndex,
         setSelectedIndex: setSelectedIndex,
         spacing: spacing,
         showLine: showLine,

package/src/BarChart/index.ts

@@ -742,6 +742,7 @@ export const useBarChart = (props: extendedBarChartPropsType) => {
     scrollAnimation,
     scrollEventThrottle,
     indicatorColor: props.indicatorColor,
+    selectedIndex,
     setSelectedIndex,
     spacing,
     showLine,

package/src/BarChart/types.d.ts

@@ -335,6 +335,10 @@ export interface lineConfigType {
     arrowConfig?: arrowType;
     customDataPoint?: Function;
     isSecondary?: boolean;
+    focusEnabled?: boolean;
+    focusedDataPointColor?: ColorValue;
+    focusedDataPointRadius?: number;
+    focusedDataPointIndex?: number;
 }
 export interface defaultLineConfigType {
     initialSpacing: number;
@@ -364,6 +368,9 @@ export interface defaultLineConfigType {
     arrowConfig: arrowType;
     customDataPoint?: Function;
     isSecondary: boolean;
+    focusEnabled: boolean;
+    focusedDataPointColor: ColorValue;
+    focusedDataPointRadius: number;
 }
 interface arrowType {
     length?: number;
@@ -390,6 +397,8 @@ export interface barDataItem {
     labelsDistanceFromXaxis?: number;
     barWidth?: number;
     sideWidth?: number;
+    barBorderWidth?: number;
+    barBorderColor?: ColorValue;
     labelTextStyle?: any;
     topLabelComponent?: Function;
     topLabelContainerStyle?: any;

package/src/BarChart/types.ts

@@ -374,6 +374,10 @@ export interface lineConfigType {
   arrowConfig?: arrowType
   customDataPoint?: Function
   isSecondary?: boolean
+  focusEnabled?: boolean
+  focusedDataPointColor?: ColorValue
+  focusedDataPointRadius?: number
+  focusedDataPointIndex?: number
 }
 export interface defaultLineConfigType {
   initialSpacing: number
@@ -403,6 +407,9 @@ export interface defaultLineConfigType {
   arrowConfig: arrowType
   customDataPoint?: Function
   isSecondary: boolean
+  focusEnabled: boolean
+  focusedDataPointColor: ColorValue
+  focusedDataPointRadius: number
 }
 interface arrowType {
   length?: number
@@ -431,6 +438,8 @@ export interface barDataItem {
   labelsDistanceFromXaxis?: number
   barWidth?: number
   sideWidth?: number
+  barBorderWidth?: number
+  barBorderColor?: ColorValue
   labelTextStyle?: any
   topLabelComponent?: Function
   topLabelContainerStyle?: any

package/src/LineChart/LineChartBiColor.js

@@ -398,6 +398,7 @@ export var useLineChartBiColor = function (props) {
         scrollAnimation: scrollAnimation,
         scrollEventThrottle: scrollEventThrottle,
         indicatorColor: props.indicatorColor,
+        selectedIndex: selectedIndex,
         setSelectedIndex: setSelectedIndex,
         spacing: spacing,
         showLine: false,

package/src/LineChart/LineChartBiColor.ts

@@ -477,6 +477,7 @@ export const useLineChartBiColor = (
     scrollAnimation,
     scrollEventThrottle,
     indicatorColor: props.indicatorColor,
+    selectedIndex,
     setSelectedIndex,
     spacing,
     showLine: false,

package/src/LineChart/index.js

@@ -1081,6 +1081,7 @@ export var useLineChart = function (props) {
         scrollAnimation: scrollAnimation,
         scrollEventThrottle: scrollEventThrottle,
         indicatorColor: props.indicatorColor,
+        selectedIndex: selectedIndex,
         setSelectedIndex: setSelectedIndex,
         spacing: spacing,
         showLine: false,

package/src/LineChart/index.ts

@@ -1807,6 +1807,7 @@ export const useLineChart = (props: extendedLineChartPropsType) => {
     scrollAnimation,
     scrollEventThrottle,
     indicatorColor: props.indicatorColor,
+    selectedIndex,
     setSelectedIndex,
     spacing,
     showLine: false,

package/src/components/BarAndLineChartsWrapper/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { type BarAndLineChartsWrapperTypes, type horizSectionPropTypes } from '../../utils/types';
+import { LineInBarChartPropsType, type BarAndLineChartsWrapperTypes, type horizSectionPropTypes } from '../../utils/types';
 import { type NativeScrollEvent } from 'react-native';
 export declare const useBarAndLineChartsWrapper: (props: BarAndLineChartsWrapperTypes) => {
     containerHeightIncludingBelowXAxis: any;
@@ -59,40 +59,6 @@ export declare const useBarAndLineChartsWrapper: (props: BarAndLineChartsWrapper
         totalWidth: number;
         xAxisLabelsVerticalShift: any;
     };
-    lineInBarChartProps: {
-        yAxisLabelWidth: number;
-        initialSpacing: number;
-        spacing: number;
-        containerHeight: number;
-        lineConfig: any;
-        maxValue: any;
-        animatedWidth: any;
-        lineBehindBars: boolean;
-        points: string | any[];
-        arrowPoints: any;
-        data: any[];
-        totalWidth: number;
-        barWidth: number | undefined;
-        labelsExtraHeight: number;
-        scrollEventThrottle: number;
-        xAxisLabelsVerticalShift: any;
-    };
-    lineInBarChartProps2: {
-        lineConfig: any;
-        points: string | any[];
-        data: (import("../..").lineDataItem | import("../..").barDataItem | import("../..").stackDataItem)[] | undefined;
-        yAxisLabelWidth: number;
-        initialSpacing: number;
-        spacing: number;
-        containerHeight: number;
-        maxValue: any;
-        animatedWidth: any;
-        lineBehindBars: boolean;
-        arrowPoints: any;
-        totalWidth: number;
-        barWidth: number | undefined;
-        labelsExtraHeight: number;
-        scrollEventThrottle: number;
-        xAxisLabelsVerticalShift: any;
-    };
+    lineInBarChartProps: LineInBarChartPropsType;
+    lineInBarChartProps2: LineInBarChartPropsType;
 };

package/src/components/BarAndLineChartsWrapper/index.js

@@ -38,7 +38,7 @@ import { useEffect, useState } from 'react';
 import { AxesAndRulesDefaults, BarDefaults } from '../../utils/constants';
 export var useBarAndLineChartsWrapper = function (props) {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11;
-    var chartType = props.chartType, containerHeight = props.containerHeight, noOfSectionsBelowXAxis = props.noOfSectionsBelowXAxis, sectionColors = props.sectionColors, stepHeight = props.stepHeight, negativeStepHeight = props.negativeStepHeight, labelsExtraHeight = props.labelsExtraHeight, yAxisLabelWidth = props.yAxisLabelWidth, horizontal = props.horizontal, rtl = props.rtl, shiftX = props.shiftX, shiftY = props.shiftY, initialSpacing = props.initialSpacing, data = props.data, stackData = props.stackData, secondaryData = props.secondaryData, barWidth = props.barWidth, xAxisThickness = props.xAxisThickness, totalWidth = props.totalWidth, spacing = props.spacing, lineConfig = props.lineConfig, lineConfig2 = props.lineConfig2, maxValue = props.maxValue, lineData = props.lineData, lineData2 = props.lineData2, animatedWidth = props.animatedWidth, lineBehindBars = props.lineBehindBars, points = props.points, points2 = props.points2, arrowPoints = props.arrowPoints, width = props.width, horizSections = props.horizSections, endSpacing = props.endSpacing, horizontalRulesStyle = props.horizontalRulesStyle, noOfSections = props.noOfSections, showFractionalValues = props.showFractionalValues, axesAndRulesProps = props.axesAndRulesProps, yAxisLabelTexts = props.yAxisLabelTexts, yAxisOffset = props.yAxisOffset, rotateYAxisTexts = props.rotateYAxisTexts, pointerConfig = props.pointerConfig, getPointerProps = props.getPointerProps, pointerIndex = props.pointerIndex, pointerX = props.pointerX, pointerY = props.pointerY, scrollEventThrottle = props.scrollEventThrottle, endReachedOffset = props.endReachedOffset, isRTL = props.isRTL;
+    var chartType = props.chartType, containerHeight = props.containerHeight, noOfSectionsBelowXAxis = props.noOfSectionsBelowXAxis, sectionColors = props.sectionColors, stepHeight = props.stepHeight, negativeStepHeight = props.negativeStepHeight, labelsExtraHeight = props.labelsExtraHeight, yAxisLabelWidth = props.yAxisLabelWidth, horizontal = props.horizontal, rtl = props.rtl, shiftX = props.shiftX, shiftY = props.shiftY, initialSpacing = props.initialSpacing, data = props.data, stackData = props.stackData, secondaryData = props.secondaryData, barWidth = props.barWidth, xAxisThickness = props.xAxisThickness, totalWidth = props.totalWidth, spacing = props.spacing, lineConfig = props.lineConfig, lineConfig2 = props.lineConfig2, maxValue = props.maxValue, lineData = props.lineData, lineData2 = props.lineData2, animatedWidth = props.animatedWidth, lineBehindBars = props.lineBehindBars, points = props.points, points2 = props.points2, arrowPoints = props.arrowPoints, width = props.width, horizSections = props.horizSections, endSpacing = props.endSpacing, horizontalRulesStyle = props.horizontalRulesStyle, noOfSections = props.noOfSections, showFractionalValues = props.showFractionalValues, axesAndRulesProps = props.axesAndRulesProps, yAxisLabelTexts = props.yAxisLabelTexts, yAxisOffset = props.yAxisOffset, rotateYAxisTexts = props.rotateYAxisTexts, pointerConfig = props.pointerConfig, getPointerProps = props.getPointerProps, pointerIndex = props.pointerIndex, pointerX = props.pointerX, pointerY = props.pointerY, scrollEventThrottle = props.scrollEventThrottle, endReachedOffset = props.endReachedOffset, isRTL = props.isRTL, selectedIndex = props.selectedIndex;
     var yAxisAtTop = rtl ? !props.yAxisAtTop : props.yAxisAtTop;
     var hideOrigin = (_a = axesAndRulesProps.hideOrigin) !== null && _a !== void 0 ? _a : AxesAndRulesDefaults.hideOrigin;
     var yAxisSide = (_b = axesAndRulesProps.yAxisSide) !== null && _b !== void 0 ? _b : AxesAndRulesDefaults.yAxisSide;
@@ -169,9 +169,10 @@ export var useBarAndLineChartsWrapper = function (props) {
         barWidth: barWidth,
         labelsExtraHeight: labelsExtraHeight,
         scrollEventThrottle: scrollEventThrottle,
-        xAxisLabelsVerticalShift: xAxisLabelsVerticalShift
+        xAxisLabelsVerticalShift: xAxisLabelsVerticalShift,
+        selectedIndex: selectedIndex
     };
-    var lineInBarChartProps2 = __assign(__assign({}, lineInBarChartProps), { lineConfig: lineConfig2, points: points2, data: lineData2 });
+    var lineInBarChartProps2 = __assign(__assign({}, lineInBarChartProps), { lineConfig: lineConfig2, points: points2, data: lineData2 !== null && lineData2 !== void 0 ? lineData2 : [] });
     var extendedContainerHeight = containerHeight + overflowTop + 10;
     var containerHeightIncludingBelowXAxis = extendedContainerHeight + noOfSectionsBelowXAxis * stepHeight;
     var verticalLinesProps = {

package/src/components/BarAndLineChartsWrapper/index.ts

@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react'
 import { AxesAndRulesDefaults, BarDefaults } from '../../utils/constants'
 import {
+  LineInBarChartPropsType,
   type BarAndLineChartsWrapperTypes,
   type horizSectionPropTypes
 } from '../../utils/types'
@@ -61,7 +62,8 @@ export const useBarAndLineChartsWrapper = (
 
     scrollEventThrottle,
     endReachedOffset,
-    isRTL
+    isRTL,
+    selectedIndex
   } = props
 
   const yAxisAtTop = rtl ? !props.yAxisAtTop : props.yAxisAtTop
@@ -237,7 +239,7 @@ export const useBarAndLineChartsWrapper = (
     secondaryXAxis
   }
 
-  const lineInBarChartProps = {
+  const lineInBarChartProps: LineInBarChartPropsType = {
     yAxisLabelWidth,
     initialSpacing,
     spacing,
@@ -253,13 +255,14 @@ export const useBarAndLineChartsWrapper = (
     barWidth,
     labelsExtraHeight,
     scrollEventThrottle,
-    xAxisLabelsVerticalShift
+    xAxisLabelsVerticalShift,
+    selectedIndex
   }
-  const lineInBarChartProps2 = {
+  const lineInBarChartProps2: LineInBarChartPropsType = {
     ...lineInBarChartProps,
     lineConfig: lineConfig2,
     points: points2,
-    data: lineData2
+    data: lineData2 ?? []
   }
   const extendedContainerHeight = containerHeight + overflowTop + 10
   const containerHeightIncludingBelowXAxis =

package/src/index.d.ts

@@ -35,4 +35,4 @@ export { getTopAndLeftForStripAndLabel } from './components/common/StripAndLabel
 /***********************************************************************************************************************/
 export { getCumulativeWidth, getLighterColor, svgQuadraticCurvePath, svgPath, bezierCommand, getSegmentString, getCurvePathWithSegments, getPreviousSegmentsLastPoint, getPathWithHighlight, getRegionPathObjects, getSegmentedPathObjects, getArrowPoints, getAxesAndRulesProps, getExtendedContainerHeightWithPadding, getSecondaryDataWithOffsetIncluded, getArrowProperty, getAllArrowProperties, maxAndMinUtil, computeMaxAndMinItems, getLabelTextUtil, getXForLineInBar, getYForLineInBar, clone, getLineConfigForBarChart, adjustToOffset } from './utils';
 export { chartTypes, yAxisSides, loc, SEGMENT_START, SEGMENT_END, RANGE_ENTER, RANGE_EXIT, STOP, ruleTypes, AxesAndRulesDefaults, defaultArrowConfig, BarDefaults, defaultLineConfig, LineDefaults, defaultPointerConfig, pieColors, populationDefaults, defaultAnimationDuration } from './utils/constants';
-export { type RuleType, type RuleTypes, type RulesConfig, CurveType, EdgePosition, type LabelsPosition, type PointerEvents, type secondaryYAxisType, type secondaryLineConfigType, type referenceConfigType, type arrowConfigType, type horizSectionPropTypes, type HorizSectionsType, type BarAndLineChartsWrapperTypes, type Pointer, type HighlightedRange, type LineSegment, type LineSvgProps, type LineProperties, type DataSet, Framework, type XAxisConfig } from './utils/types';
+export { type RuleType, type RuleTypes, type RulesConfig, CurveType, EdgePosition, type LabelsPosition, type PointerEvents, type secondaryYAxisType, type secondaryLineConfigType, type referenceConfigType, type arrowConfigType, type horizSectionPropTypes, type HorizSectionsType, type BarAndLineChartsWrapperTypes, type Pointer, type HighlightedRange, type LineSegment, type LineSvgProps, type LineProperties, type DataSet, Framework, type XAxisConfig, type LineInBarChartPropsType, type DataPointProps } from './utils/types';

package/src/index.ts

@@ -146,5 +146,7 @@ export {
   type LineProperties,
   type DataSet,
   Framework,
-  type XAxisConfig
+  type XAxisConfig,
+  type LineInBarChartPropsType,
+  type DataPointProps
 } from './utils/types'

package/src/utils/constants.d.ts

@@ -119,7 +119,6 @@ export declare const BarDefaults: {
     focusedBarSideColor: string;
     focusedBarTopColor: string;
 };
-export declare const defaultLineConfig: defaultLineConfigType;
 export declare const LineDefaults: {
     color: string;
     curvature: number;
@@ -145,6 +144,7 @@ export declare const LineDefaults: {
     dataPointsColor2: string;
     dataPointsColor3: string;
     dataPointsShape: string;
+    focusedDataPointColor: string;
     textFontSize: number;
     textColor: string;
     startFillColor: string;
@@ -165,6 +165,7 @@ export declare const LineDefaults: {
     edgePosition: EdgePosition;
     endReachedOffset: number;
 };
+export declare const defaultLineConfig: defaultLineConfigType;
 export declare const defaultPointerConfig: {
     height: number;
     width: number;

package/src/utils/constants.js

@@ -130,34 +130,6 @@ export var BarDefaults = {
     focusedBarSideColor: '#776913',
     focusedBarTopColor: '#C8D565'
 };
-export var defaultLineConfig = {
-    initialSpacing: BarDefaults.spacing, // gets updated to spacing before being used
-    curved: false,
-    curvature: defaultCurvature,
-    curveType: defaultCurveType,
-    isAnimated: false,
-    animationDuration: defaultAnimationDuration,
-    thickness: 1,
-    color: 'black',
-    hideDataPoints: false,
-    dataPointsShape: 'circular',
-    dataPointsWidth: 4,
-    dataPointsHeight: 4,
-    dataPointsColor: 'black',
-    dataPointsRadius: 3,
-    textColor: 'gray',
-    textFontSize: 10,
-    textShiftX: 0,
-    textShiftY: 0,
-    shiftX: 0,
-    shiftY: 0,
-    delay: 0,
-    startIndex: 0,
-    endIndex: 0, // gets updated to lineData.length - 1
-    showArrow: false,
-    arrowConfig: defaultArrowConfig,
-    isSecondary: false
-};
 // Line chart specific
 export var LineDefaults = {
     color: 'black',
@@ -184,6 +156,7 @@ export var LineDefaults = {
     dataPointsColor2: 'blue',
     dataPointsColor3: 'red',
     dataPointsShape: 'circular',
+    focusedDataPointColor: 'orange',
     textFontSize: 10,
     textColor: 'gray',
     startFillColor: 'gray',
@@ -204,6 +177,37 @@ export var LineDefaults = {
     edgePosition: EdgePosition.AFTER_DATA_POINT,
     endReachedOffset: defaultEndReachedOffset
 };
+export var defaultLineConfig = {
+    initialSpacing: BarDefaults.spacing, // gets updated to spacing before being used
+    curved: false,
+    curvature: defaultCurvature,
+    curveType: defaultCurveType,
+    isAnimated: false,
+    animationDuration: defaultAnimationDuration,
+    thickness: 1,
+    color: 'black',
+    hideDataPoints: false,
+    dataPointsShape: 'circular',
+    dataPointsWidth: 4,
+    dataPointsHeight: 4,
+    dataPointsColor: 'black',
+    dataPointsRadius: 3,
+    textColor: 'gray',
+    textFontSize: 10,
+    textShiftX: 0,
+    textShiftY: 0,
+    shiftX: 0,
+    shiftY: 0,
+    delay: 0,
+    startIndex: 0,
+    endIndex: 0, // gets updated to lineData.length - 1
+    showArrow: false,
+    arrowConfig: defaultArrowConfig,
+    isSecondary: false,
+    focusEnabled: false,
+    focusedDataPointColor: LineDefaults.focusedDataPointColor,
+    focusedDataPointRadius: LineDefaults.dataPointsRadius,
+};
 export var defaultPointerConfig = {
     height: 0,
     width: 0,

package/src/utils/constants.ts

@@ -156,35 +156,6 @@ export const BarDefaults = {
   focusedBarTopColor: '#C8D565'
 }
 
-export const defaultLineConfig: defaultLineConfigType = {
-  initialSpacing: BarDefaults.spacing, // gets updated to spacing before being used
-  curved: false,
-  curvature: defaultCurvature,
-  curveType: defaultCurveType,
-  isAnimated: false,
-  animationDuration: defaultAnimationDuration,
-  thickness: 1,
-  color: 'black',
-  hideDataPoints: false,
-  dataPointsShape: 'circular',
-  dataPointsWidth: 4,
-  dataPointsHeight: 4,
-  dataPointsColor: 'black',
-  dataPointsRadius: 3,
-  textColor: 'gray',
-  textFontSize: 10,
-  textShiftX: 0,
-  textShiftY: 0,
-  shiftX: 0,
-  shiftY: 0,
-  delay: 0,
-  startIndex: 0,
-  endIndex: 0, // gets updated to lineData.length - 1
-  showArrow: false,
-  arrowConfig: defaultArrowConfig,
-  isSecondary: false
-}
-
 // Line chart specific
 
 export const LineDefaults = {
@@ -213,6 +184,7 @@ export const LineDefaults = {
   dataPointsColor2: 'blue',
   dataPointsColor3: 'red',
   dataPointsShape: 'circular',
+  focusedDataPointColor: 'orange',
 
   textFontSize: 10,
   textColor: 'gray',
@@ -237,6 +209,38 @@ export const LineDefaults = {
   endReachedOffset: defaultEndReachedOffset
 }
 
+export const defaultLineConfig: defaultLineConfigType = {
+  initialSpacing: BarDefaults.spacing, // gets updated to spacing before being used
+  curved: false,
+  curvature: defaultCurvature,
+  curveType: defaultCurveType,
+  isAnimated: false,
+  animationDuration: defaultAnimationDuration,
+  thickness: 1,
+  color: 'black',
+  hideDataPoints: false,
+  dataPointsShape: 'circular',
+  dataPointsWidth: 4,
+  dataPointsHeight: 4,
+  dataPointsColor: 'black',
+  dataPointsRadius: 3,
+  textColor: 'gray',
+  textFontSize: 10,
+  textShiftX: 0,
+  textShiftY: 0,
+  shiftX: 0,
+  shiftY: 0,
+  delay: 0,
+  startIndex: 0,
+  endIndex: 0, // gets updated to lineData.length - 1
+  showArrow: false,
+  arrowConfig: defaultArrowConfig,
+  isSecondary: false,
+  focusEnabled: false,
+  focusedDataPointColor: LineDefaults.focusedDataPointColor,
+  focusedDataPointRadius: LineDefaults.dataPointsRadius,
+}
+
 export const defaultPointerConfig = {
   height: 0,
   width: 0,

package/src/utils/index.js

@@ -749,7 +749,7 @@ export var clone = function (obj) {
     return temp;
 };
 export var getLineConfigForBarChart = function (lineConfig, barInitialSpacing) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22;
     return {
         initialSpacing: (_b = (_a = lineConfig.initialSpacing) !== null && _a !== void 0 ? _a : barInitialSpacing) !== null && _b !== void 0 ? _b : defaultLineConfig.initialSpacing,
         spacing: lineConfig.spacing,
@@ -787,7 +787,11 @@ export var getLineConfigForBarChart = function (lineConfig, barInitialSpacing) {
             showArrowBase: (_17 = (_16 = lineConfig.arrowConfig) === null || _16 === void 0 ? void 0 : _16.showArrowBase) !== null && _17 !== void 0 ? _17 : (_18 = defaultLineConfig.arrowConfig) === null || _18 === void 0 ? void 0 : _18.showArrowBase
         },
         customDataPoint: lineConfig.customDataPoint,
-        isSecondary: (_19 = lineConfig.isSecondary) !== null && _19 !== void 0 ? _19 : defaultLineConfig.isSecondary
+        isSecondary: (_19 = lineConfig.isSecondary) !== null && _19 !== void 0 ? _19 : defaultLineConfig.isSecondary,
+        focusEnabled: (_20 = lineConfig.focusEnabled) !== null && _20 !== void 0 ? _20 : defaultLineConfig.focusEnabled,
+        focusedDataPointColor: (_21 = lineConfig.focusedDataPointColor) !== null && _21 !== void 0 ? _21 : defaultLineConfig.focusedDataPointColor,
+        focusedDataPointRadius: (_22 = lineConfig.focusedDataPointRadius) !== null && _22 !== void 0 ? _22 : defaultLineConfig.focusedDataPointRadius,
+        focusedDataPointIndex: lineConfig.focusedDataPointIndex
     };
 };
 export var getNoOfSections = function (noOfSections, maxValue, stepValue) {

package/src/utils/index.ts

@@ -1241,7 +1241,15 @@ export const getLineConfigForBarChart = (
         defaultLineConfig.arrowConfig?.showArrowBase
     },
     customDataPoint: lineConfig.customDataPoint,
-    isSecondary: lineConfig.isSecondary ?? defaultLineConfig.isSecondary
+    isSecondary: lineConfig.isSecondary ?? defaultLineConfig.isSecondary,
+    focusEnabled: lineConfig.focusEnabled ?? defaultLineConfig.focusEnabled,
+    focusedDataPointColor:
+      lineConfig.focusedDataPointColor ??
+      defaultLineConfig.focusedDataPointColor,
+    focusedDataPointRadius:
+      lineConfig.focusedDataPointRadius ??
+      defaultLineConfig.focusedDataPointRadius,
+    focusedDataPointIndex: lineConfig.focusedDataPointIndex
   }
 }
 

package/src/utils/types.d.ts

@@ -1,7 +1,7 @@
 import { type ColorValue } from 'react-native';
 import { type chartTypes, type yAxisSides } from './constants';
 import { type lineDataItem } from '../LineChart/types';
-import { type barDataItem, type stackDataItem } from '../BarChart/types';
+import { lineConfigType, type barDataItem, type stackDataItem } from '../BarChart/types';
 export declare enum Framework {
     reactJS = 0,
     reactNative = 1
@@ -98,6 +98,41 @@ export interface secondaryLineConfigType {
     arrowConfig?: arrowConfigType;
     isSecondary?: boolean;
 }
+export interface ExtendedLineConfigType extends lineConfigType {
+    startIndex: number;
+    endIndex: number;
+    dataPointsHeight: number;
+}
+export interface LineInBarChartPropsType {
+    yAxisLabelWidth: number;
+    initialSpacing: number;
+    spacing: number;
+    containerHeight: number;
+    lineConfig: ExtendedLineConfigType;
+    maxValue: number;
+    animatedWidth: number;
+    lineBehindBars: boolean;
+    points: any;
+    arrowPoints: any;
+    data: any[];
+    totalWidth: number;
+    barWidth?: number;
+    labelsExtraHeight: number;
+    scrollEventThrottle: number;
+    xAxisLabelsVerticalShift: number;
+    selectedIndex: number;
+}
+export interface DataPointProps {
+    data: any[];
+    lineConfig: ExtendedLineConfigType;
+    barWidth?: number;
+    containerHeight: number;
+    maxValue: number;
+    firstBarWidth: number;
+    yAxisLabelWidth: number;
+    spacing: number;
+    selectedIndex: number;
+}
 export interface referenceConfigType {
     thickness?: number;
     width?: number;
@@ -213,6 +248,7 @@ export interface BarAndLineChartsWrapperTypes {
     scrollToIndex: number | undefined;
     scrollAnimation: boolean;
     indicatorColor: 'black' | 'default' | 'white' | undefined;
+    selectedIndex: number;
     setSelectedIndex: any;
     spacing: number;
     showLine: boolean;

package/src/utils/types.ts

@@ -1,7 +1,7 @@
 import { type ColorValue } from 'react-native'
 import { type chartTypes, type yAxisSides } from './constants'
 import { type lineDataItem } from '../LineChart/types'
-import { type barDataItem, type stackDataItem } from '../BarChart/types'
+import { lineConfigType, type barDataItem, type stackDataItem } from '../BarChart/types'
 
 export enum Framework {
   reactJS,
@@ -112,6 +112,44 @@ export interface secondaryLineConfigType {
   isSecondary?: boolean
 }
 
+export interface ExtendedLineConfigType extends lineConfigType {
+  startIndex: number
+  endIndex: number
+  dataPointsHeight: number
+}
+
+export interface LineInBarChartPropsType {
+  yAxisLabelWidth: number
+  initialSpacing: number
+  spacing: number
+  containerHeight: number
+  lineConfig: ExtendedLineConfigType
+  maxValue: number
+  animatedWidth: number
+  lineBehindBars: boolean
+  points: any
+  arrowPoints: any
+  data: any[]
+  totalWidth: number
+  barWidth?: number
+  labelsExtraHeight: number
+  scrollEventThrottle: number
+  xAxisLabelsVerticalShift: number
+  selectedIndex: number
+}
+
+export interface DataPointProps {
+  data: any[];
+  lineConfig: ExtendedLineConfigType;
+  barWidth?: number;
+  containerHeight: number;
+  maxValue: number;
+  firstBarWidth: number;
+  yAxisLabelWidth: number;
+  spacing: number;
+  selectedIndex: number;
+}
+
 export interface referenceConfigType {
   thickness?: number
   width?: number
@@ -239,6 +277,7 @@ export interface BarAndLineChartsWrapperTypes {
   scrollToIndex: number | undefined
   scrollAnimation: boolean
   indicatorColor: 'black' | 'default' | 'white' | undefined
+  selectedIndex: number
   setSelectedIndex: any
   spacing: number
   showLine: boolean