react-native-gifted-charts 1.4.21 → 1.4.23

package/dist/BarChart/Animated2DWithGradient.d.ts

@@ -0,0 +1,3 @@
+import { Animated2DWithGradientPropsType } from 'gifted-charts-core';
+declare const Animated2DWithGradient: (props: Animated2DWithGradientPropsType) => import("react/jsx-runtime").JSX.Element;
+export default Animated2DWithGradient;

package/dist/BarChart/Animated2DWithGradient.js

@@ -1 +1,113 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _reactNativeSvg=_interopRequireWildcard(require("react-native-svg"));var _cap=_interopRequireDefault(require("../Components/BarSpecificComponents/cap"));var _LinearGradient=_interopRequireDefault(require("../Components/common/LinearGradient"));var _jsxRuntime=require("react/jsx-runtime");var _this=this,_jsxFileName="/Users/abhinandankushwaha/sites/projects/react-native-gifted-charts/src/BarChart/Animated2DWithGradient.tsx";function _getRequireWildcardCache(e){if("function"!=typeof WeakMap)return null;var r=new WeakMap(),t=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(e){return e?t:r;})(e);}function _interopRequireWildcard(e,r){if(!r&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=_getRequireWildcardCache(r);if(t&&t.has(e))return t.get(e);var n={__proto__:null},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var u in e)if("default"!==u&&{}.hasOwnProperty.call(e,u)){var i=a?Object.getOwnPropertyDescriptor(e,u):null;i&&(i.get||i.set)?Object.defineProperty(n,u,i):n[u]=e[u];}return n.default=e,t&&t.set(e,n),n;}if(_reactNative.Platform.OS==='android'){_reactNative.UIManager.setLayoutAnimationEnabledExperimental&&_reactNative.UIManager.setLayoutAnimationEnabledExperimental(true);}var Animated2DWithGradient=function Animated2DWithGradient(props){var barBackgroundPattern=props.barBackgroundPattern,patternId=props.patternId,barWidth=props.barWidth,barStyle=props.barStyle,item=props.item,index=props.index,opacity=props.opacity,animationDuration=props.animationDuration,noGradient=props.noGradient,noAnimation=props.noAnimation,barMarginBottom=props.barMarginBottom,barInnerComponent=props.barInnerComponent,intactTopLabel=props.intactTopLabel,showValuesAsTopLabel=props.showValuesAsTopLabel,topLabelContainerStyle=props.topLabelContainerStyle,topLabelTextStyle=props.topLabelTextStyle,commonStyleForBar=props.commonStyleForBar,barStyleWithBackground=props.barStyleWithBackground,yAxisOffset=props.yAxisOffset;var _useState=(0,_react.useState)(noAnimation?props.height:0.2),_useState2=(0,_slicedToArray2.default)(_useState,2),height=_useState2[0],setHeight=_useState2[1];var _useState3=(0,_react.useState)(noAnimation?false:true),_useState4=(0,_slicedToArray2.default)(_useState3,2),initialRender=_useState4[0],setInitialRender=_useState4[1];(0,_react.useEffect)(function(){if(!noAnimation){if(initialRender){setTimeout(function(){return layoutAppear();},20);}else{elevate();}}else{setHeight(props.height);}},[props.height]);var elevate=function elevate(){_reactNative.LayoutAnimation.configureNext({duration:animationDuration,update:{type:'linear',property:'scaleXY'}});setHeight(props.height);};var layoutAppear=function layoutAppear(){_reactNative.LayoutAnimation.configureNext({duration:_reactNative.Platform.OS=='ios'?animationDuration:20,create:{type:'linear',property:'opacity'},update:{type:'linear',property:'scaleXY'}});setInitialRender(false);setTimeout(function(){return elevate();},_reactNative.Platform.OS=='ios'?10:100);};return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[!initialRender&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:{position:'absolute',bottom:0,width:'100%',overflow:'hidden',height:(noAnimation?Math.max(props.minHeight,Math.abs(height)):height)-(barMarginBottom||0)},children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[{width:'100%',height:(noAnimation?Math.max(props.minHeight,Math.abs(height)):height)-(barMarginBottom||0)},item.barStyle||barStyle],children:[noGradient?(0,_jsxRuntime.jsx)(_reactNative.View,{style:barStyleWithBackground,children:props.cappedBars&&item.value?(0,_jsxRuntime.jsx)(_cap.default,{capThicknessFromItem:item.capThickness,capThicknessFromProps:props.capThickness,capColorFromItem:item.capColor,capColorFromProps:props.capColor,capRadiusFromItem:item.capRadius,capRadiusFromProps:props.capRadius}):null}):(0,_jsxRuntime.jsx)(_LinearGradient.default,{style:commonStyleForBar,start:{x:0,y:0},end:{x:1,y:1},colors:[item.gradientColor||props.gradientColor||'white',item.frontColor||props.frontColor||'black'],children:props.cappedBars&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:{position:'absolute',width:'100%',height:item.capThickness===0?0:item.capThickness||props.capThickness||6,backgroundColor:item.capColor||props.capColor||'black',borderTopLeftRadius:item.capRadius===0?0:item.capRadius||props.capRadius||0,borderTopRightRadius:item.capRadius===0?0:item.capRadius||props.capRadius||0}})}),(item.barBackgroundPattern||barBackgroundPattern)&&(0,_jsxRuntime.jsxs)(_reactNativeSvg.default,{children:[(0,_jsxRuntime.jsx)(_reactNativeSvg.Defs,{children:item.barBackgroundPattern?item.barBackgroundPattern():barBackgroundPattern==null?void 0:barBackgroundPattern()}),(0,_jsxRuntime.jsx)(_reactNativeSvg.Rect,{stroke:"transparent",x:"1",y:"1",width:item.barWidth||props.barWidth||30,height:noAnimation?Math.abs(height):height,fill:`url(#${item.patternId||patternId})`})]}),barInnerComponent?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{height:'100%',width:'100%'},children:barInnerComponent(item,index)}):null]})}),item.topLabelComponent||showValuesAsTopLabel?(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{position:'absolute',top:(item.barWidth||barWidth||30)*-1,height:item.barWidth||barWidth||30,width:item.barWidth||barWidth||30,justifyContent:props.horizontal&&!intactTopLabel||item.value<0?'center':'flex-end',alignItems:'center',opacity:opacity},item.value<0&&{transform:[{rotate:'180deg'}]},props.horizontal&&!intactTopLabel&&{transform:[{rotate:'270deg'}]},topLabelContainerStyle!=null?topLabelContainerStyle:item.topLabelContainerStyle],children:showValuesAsTopLabel?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:topLabelTextStyle,children:item.value+yAxisOffset}):item.topLabelComponent==null?void 0:item.topLabelComponent()}):null]});};var _default=exports.default=Animated2DWithGradient;
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { View, LayoutAnimation, Platform, UIManager, Text } from 'react-native';
+import Svg, { Defs, Rect } from 'react-native-svg';
+import Cap from '../Components/BarSpecificComponents/cap';
+import LinearGradient from '../Components/common/LinearGradient';
+if (Platform.OS === 'android') {
+    UIManager.setLayoutAnimationEnabledExperimental &&
+        UIManager.setLayoutAnimationEnabledExperimental(true);
+}
+var Animated2DWithGradient = function (props) {
+    var _a;
+    var barBackgroundPattern = props.barBackgroundPattern, patternId = props.patternId, barWidth = props.barWidth, barStyle = props.barStyle, item = props.item, index = props.index, opacity = props.opacity, animationDuration = props.animationDuration, noGradient = props.noGradient, noAnimation = props.noAnimation, barMarginBottom = props.barMarginBottom, barInnerComponent = props.barInnerComponent, intactTopLabel = props.intactTopLabel, showValuesAsTopLabel = props.showValuesAsTopLabel, topLabelContainerStyle = props.topLabelContainerStyle, topLabelTextStyle = props.topLabelTextStyle, commonStyleForBar = props.commonStyleForBar, barStyleWithBackground = props.barStyleWithBackground, yAxisOffset = props.yAxisOffset;
+    var _b = __read(useState(noAnimation ? props.height : 0.2), 2), height = _b[0], setHeight = _b[1];
+    var _c = __read(useState(!noAnimation), 2), initialRender = _c[0], setInitialRender = _c[1];
+    useEffect(function () {
+        if (!noAnimation) {
+            if (initialRender) {
+                setTimeout(function () { return layoutAppear(); }, 20);
+            }
+            else {
+                elevate();
+            }
+        }
+        else {
+            setHeight(props.height);
+        }
+    }, [props.height]);
+    var elevate = function () {
+        LayoutAnimation.configureNext({
+            duration: animationDuration,
+            update: { type: 'linear', property: 'scaleXY' },
+        });
+        setHeight(props.height);
+    };
+    var layoutAppear = function () {
+        LayoutAnimation.configureNext({
+            duration: Platform.OS == 'ios' ? animationDuration : 20,
+            create: { type: 'linear', property: 'opacity' },
+            update: { type: 'linear', property: 'scaleXY' },
+        });
+        setInitialRender(false);
+        setTimeout(function () { return elevate(); }, Platform.OS == 'ios' ? 10 : 100);
+    };
+    return (_jsxs(_Fragment, { children: [!initialRender && (_jsx(View, { style: {
+                    position: 'absolute',
+                    bottom: 0,
+                    width: '100%',
+                    overflow: 'hidden',
+                    height: (noAnimation
+                        ? Math.max(props.minHeight, Math.abs(height))
+                        : height) - (barMarginBottom || 0),
+                }, children: _jsxs(View, { style: [
+                        {
+                            width: '100%',
+                            height: (noAnimation
+                                ? Math.max(props.minHeight, Math.abs(height))
+                                : height) - (barMarginBottom || 0),
+                        },
+                        item.barStyle || barStyle,
+                    ], children: [noGradient ? (_jsx(View, { style: barStyleWithBackground, children: props.cappedBars && item.value ? (_jsx(Cap, { capThicknessFromItem: item.capThickness, capThicknessFromProps: props.capThickness, capColorFromItem: item.capColor, capColorFromProps: props.capColor, capRadiusFromItem: item.capRadius, capRadiusFromProps: props.capRadius })) : null })) : (_jsx(LinearGradient, { style: commonStyleForBar, start: { x: 0, y: 0 }, end: { x: 1, y: 1 }, colors: [
+                                item.gradientColor || props.gradientColor || 'white',
+                                item.frontColor || props.frontColor || 'black',
+                            ], children: props.cappedBars && (_jsx(View, { style: {
+                                    position: 'absolute',
+                                    width: '100%',
+                                    height: item.capThickness === 0
+                                        ? 0
+                                        : item.capThickness || props.capThickness || 6,
+                                    backgroundColor: item.capColor || props.capColor || 'black',
+                                    borderTopLeftRadius: item.capRadius === 0
+                                        ? 0
+                                        : item.capRadius || props.capRadius || 0,
+                                    borderTopRightRadius: item.capRadius === 0
+                                        ? 0
+                                        : item.capRadius || props.capRadius || 0,
+                                } })) })), (item.barBackgroundPattern || barBackgroundPattern) && (_jsxs(Svg, { children: [_jsx(Defs, { children: item.barBackgroundPattern
+                                        ? item.barBackgroundPattern()
+                                        : barBackgroundPattern === null || barBackgroundPattern === void 0 ? void 0 : barBackgroundPattern() }), _jsx(Rect, { stroke: "transparent", x: "1", y: "1", width: item.barWidth || props.barWidth || 30, height: noAnimation ? Math.abs(height) : height, fill: "url(#".concat(item.patternId || patternId, ")") })] })), barInnerComponent ? (_jsx(View, { style: { height: '100%', width: '100%' }, children: barInnerComponent(item, index) })) : null] }) })), item.topLabelComponent || showValuesAsTopLabel ? (_jsx(View, { style: [
+                    {
+                        position: 'absolute',
+                        top: (item.barWidth || barWidth || 30) * -1,
+                        height: item.barWidth || barWidth || 30,
+                        width: item.barWidth || barWidth || 30,
+                        justifyContent: (props.horizontal && !intactTopLabel) || item.value < 0
+                            ? 'center'
+                            : 'flex-end',
+                        alignItems: 'center',
+                        opacity: opacity,
+                    },
+                    item.value < 0 && { transform: [{ rotate: '180deg' }] },
+                    props.horizontal &&
+                        !intactTopLabel && { transform: [{ rotate: '270deg' }] },
+                    topLabelContainerStyle !== null && topLabelContainerStyle !== void 0 ? topLabelContainerStyle : item.topLabelContainerStyle,
+                ], children: showValuesAsTopLabel ? (_jsx(Text, { style: topLabelTextStyle, children: item.value + yAxisOffset })) : ((_a = item.topLabelComponent) === null || _a === void 0 ? void 0 : _a.call(item)) })) : null] }));
+};
+export default Animated2DWithGradient;

package/dist/BarChart/RenderBars.d.ts

@@ -0,0 +1,3 @@
+import { RenderBarsPropsType } from 'gifted-charts-core';
+declare const RenderBars: (props: RenderBarsPropsType) => import("react/jsx-runtime").JSX.Element;
+export default RenderBars;

package/dist/BarChart/RenderBars.js

@@ -1 +1,264 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _AnimatedThreeDBar=_interopRequireDefault(require("../Components/AnimatedThreeDBar"));var _Animated2DWithGradient=_interopRequireDefault(require("./Animated2DWithGradient"));var _cap=_interopRequireDefault(require("../Components/BarSpecificComponents/cap"));var _barBackgroundPattern=_interopRequireDefault(require("../Components/BarSpecificComponents/barBackgroundPattern"));var _LinearGradient=_interopRequireDefault(require("../Components/common/LinearGradient"));var _giftedChartsCore=require("gifted-charts-core");var _tooltip=_interopRequireDefault(require("../Components/BarSpecificComponents/tooltip"));var _jsxRuntime=require("react/jsx-runtime");var _this=this,_jsxFileName="/Users/abhinandankushwaha/sites/projects/react-native-gifted-charts/src/BarChart/RenderBars.tsx";var RenderBars=function RenderBars(props){var _item$barInnerCompone,_focusedBarConfig$bar,_ref,_item$leftShiftForToo;var item=props.item,index=props.index,containerHeight=props.containerHeight,maxValue=props.maxValue,minHeight=props.minHeight,spacing=props.spacing,propSpacing=props.propSpacing,side=props.side,data=props.data,barBorderWidth=props.barBorderWidth,barBorderColor=props.barBorderColor,isThreeD=props.isThreeD,isAnimated=props.isAnimated,rotateLabel=props.rotateLabel,appearingOpacity=props.appearingOpacity,animationDuration=props.animationDuration,autoShiftLabels=props.autoShiftLabels,label=props.label,secondaryLabel=props.secondaryLabel,labelTextStyle=props.labelTextStyle,secondaryLabelTextStyle=props.secondaryLabelTextStyle,xAxisTextNumberOfLines=props.xAxisTextNumberOfLines,xAxisLabelsVerticalShift=props.xAxisLabelsVerticalShift,renderTooltip=props.renderTooltip,leftShiftForTooltip=props.leftShiftForTooltip,leftShiftForLastIndexTooltip=props.leftShiftForLastIndexTooltip,initialSpacing=props.initialSpacing,selectedIndex=props.selectedIndex,setSelectedIndex=props.setSelectedIndex,_props$xAxisThickness=props.xAxisThickness,xAxisThickness=_props$xAxisThickness===void 0?_giftedChartsCore.AxesAndRulesDefaults.xAxisThickness:_props$xAxisThickness,horizontal=props.horizontal,rtl=props.rtl,intactTopLabel=props.intactTopLabel,showValuesAsTopLabel=props.showValuesAsTopLabel,topLabelContainerStyle=props.topLabelContainerStyle,topLabelTextStyle=props.topLabelTextStyle,pointerConfig=props.pointerConfig,noOfSectionsBelowXAxis=props.noOfSectionsBelowXAxis,yAxisOffset=props.yAxisOffset,barWidth=props.barWidth,_props$labelsDistance=props.labelsDistanceFromXaxis,labelsDistanceFromXaxis=_props$labelsDistance===void 0?0:_props$labelsDistance,stepHeight=props.stepHeight,stepValue=props.stepValue,negativeStepHeight=props.negativeStepHeight,negativeStepValue=props.negativeStepValue,autoCenterTooltip=props.autoCenterTooltip,secondaryXAxis=props.secondaryXAxis;var heightFactor=item.value<0?negativeStepHeight/negativeStepValue:stepHeight/stepValue;var barHeight=Math.max(minHeight,Math.abs(item.value)*heightFactor-xAxisThickness);var _getPropsForAnimated=(0,_giftedChartsCore.getPropsForAnimated2DWithGradient)(Object.assign({},props,{barHeight:barHeight})),commonStyleForBar=_getPropsForAnimated.commonStyleForBar,barStyleWithBackground=_getPropsForAnimated.barStyleWithBackground,commonPropsFor2Dand3Dbars=_getPropsForAnimated.commonPropsFor2Dand3Dbars,isFocused=_getPropsForAnimated.isFocused,focusedBarConfig=_getPropsForAnimated.focusedBarConfig,localFrontColor=_getPropsForAnimated.localFrontColor;var itemOrPropsBarInnerComponent=(_item$barInnerCompone=item.barInnerComponent)!=null?_item$barInnerCompone:props.barInnerComponent;var localBarInnerComponent=isFocused?(_focusedBarConfig$bar=focusedBarConfig==null?void 0:focusedBarConfig.barInnerComponent)!=null?_focusedBarConfig$bar:itemOrPropsBarInnerComponent:itemOrPropsBarInnerComponent;var barMarginBottom=item.barMarginBottom===0?0:item.barMarginBottom||props.barMarginBottom||0;var renderLabel=function renderLabel(top,label,labelTextStyle,value){var _props$xAxisLabelsHei,_secondaryXAxis$label;return(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{width:(item.labelWidth||props.labelWidth||item.barWidth||barWidth)+spacing,left:spacing/-2,position:'absolute',height:(_props$xAxisLabelsHei=props.xAxisLabelsHeight)!=null?_props$xAxisLabelsHei:xAxisTextNumberOfLines*18,bottom:top?(containerHeight||200)+((_secondaryXAxis$label=secondaryXAxis==null?void 0:secondaryXAxis.labelsDistanceFromXaxis)!=null?_secondaryXAxis$label:15):(rotateLabel?-40:-6-xAxisTextNumberOfLines*18-xAxisLabelsVerticalShift)-barMarginBottom-labelsDistanceFromXaxis},rotateLabel?horizontal?{transform:[{rotate:'330deg'}]}:{transform:[{rotate:value<0?'240deg':'60deg'},{translateX:value<0?56:0},{translateY:value<0?32:0}]}:horizontal?{transform:[{rotate:'-90deg'}]}:value<0?{transform:[{rotate:'180deg'},{translateY:autoShiftLabels?0:16.5*xAxisTextNumberOfLines+14}]}:{}],children:top?item.secondaryLabelComponent?item.secondaryLabelComponent():(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[{textAlign:'center'},rtl&&horizontal&&{transform:[{rotate:'180deg'}]},labelTextStyle],numberOfLines:xAxisTextNumberOfLines,children:label}):item.labelComponent?item.labelComponent():(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[{textAlign:'center'},rtl&&horizontal&&{transform:[{rotate:'180deg'}]},labelTextStyle],numberOfLines:xAxisTextNumberOfLines,children:label})});};var renderAnimatedLabel=function renderAnimatedLabel(top,label,labelTextStyle,value){var _props$xAxisLabelsHei2,_secondaryXAxis$label2;return(0,_jsxRuntime.jsx)(_reactNative.Animated.View,{style:[{width:(item.labelWidth||props.labelWidth||item.barWidth||barWidth)+spacing,left:spacing/-2,position:'absolute',height:(_props$xAxisLabelsHei2=props.xAxisLabelsHeight)!=null?_props$xAxisLabelsHei2:xAxisTextNumberOfLines*18,bottom:top?(containerHeight||200)+((_secondaryXAxis$label2=secondaryXAxis==null?void 0:secondaryXAxis.labelsDistanceFromXaxis)!=null?_secondaryXAxis$label2:15):(rotateLabel?-40:-6-xAxisTextNumberOfLines*18-xAxisLabelsVerticalShift)-barMarginBottom,opacity:appearingOpacity},value<0&&{transform:[{rotate:'180deg'}]},rotateLabel?horizontal?{transform:[{rotate:'330deg'}]}:{transform:[{rotate:'60deg'}]}:horizontal?{transform:[{rotate:'-90deg'}]}:value<0?{transform:[{rotate:'180deg'},{translateY:autoShiftLabels?0:16.5*xAxisTextNumberOfLines+14}]}:{}],children:top?item.secondaryLabelComponent?item.secondaryLabelComponent():(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[{textAlign:'center'},rtl&&horizontal&&{transform:[{rotate:'180deg'}]},labelTextStyle],numberOfLines:xAxisTextNumberOfLines,children:label}):item.labelComponent?item.labelComponent():(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[{textAlign:'center'},rtl&&horizontal&&{transform:[{rotate:'180deg'}]},labelTextStyle],numberOfLines:xAxisTextNumberOfLines,children:label})});};var leftSpacing=initialSpacing;for(var i=0;i<index;i++){var _data$i$spacing;leftSpacing+=((_data$i$spacing=data[i].spacing)!=null?_data$i$spacing:propSpacing)+(data[i].barWidth||barWidth);}var static2DWithGradient=function static2DWithGradient(item){var _focusedBarConfig$gra;var localGradientColor=item.gradientColor||props.gradientColor||'white';return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_LinearGradient.default,{style:commonStyleForBar,start:{x:0,y:0},end:{x:0,y:1},colors:[isFocused?(_focusedBarConfig$gra=focusedBarConfig==null?void 0:focusedBarConfig.gradientColor)!=null?_focusedBarConfig$gra:localGradientColor:localGradientColor,localFrontColor],children:props.cappedBars&&item.value?(0,_jsxRuntime.jsx)(_cap.default,{capThicknessFromItem:item.capThickness,capThicknessFromProps:props.capThickness,capColorFromItem:item.capColor,capColorFromProps:props.capColor,capRadiusFromItem:item.capRadius,capRadiusFromProps:props.capRadius}):null}),(item.barBackgroundPattern||props.barBackgroundPattern)&&(0,_jsxRuntime.jsx)(_barBackgroundPattern.default,{barBackgroundPatternFromItem:item.barBackgroundPattern,barBackgroundPatternFromProps:props.barBackgroundPattern,patternIdFromItem:item.patternId,patternIdFromProps:props.patternId}),(item.topLabelComponent||showValuesAsTopLabel)&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:[{position:'absolute',top:(item.barWidth||barWidth)*-1,height:item.barWidth||barWidth,width:item.barWidth||barWidth,justifyContent:horizontal&&!intactTopLabel||item.value<0?'center':'flex-end',alignItems:'center'},item.value<0&&{transform:[{rotate:'180deg'}]},horizontal&&!intactTopLabel&&{transform:[{rotate:'270deg'}]},topLabelContainerStyle!=null?topLabelContainerStyle:item.topLabelContainerStyle],children:showValuesAsTopLabel?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:topLabelTextStyle,children:item.value+yAxisOffset}):item.topLabelComponent==null?void 0:item.topLabelComponent()}),localBarInnerComponent?(0,_jsxRuntime.jsx)(_reactNative.View,{style:{height:'100%',width:'100%'},children:localBarInnerComponent(item,index)}):null]});};var barWrapperStyle=[{marginBottom:60+barMarginBottom+xAxisLabelsVerticalShift-0.5,width:commonPropsFor2Dand3Dbars.barWidth,height:barHeight,marginRight:spacing},pointerConfig?{transform:[{translateY:(containerHeight||200)-(barHeight-10+xAxisLabelsVerticalShift)+(item.value<0?Math.abs(item.value)*heightFactor:0)}]}:item.value<0?{transform:[{translateY:Math.abs(item.value)*heightFactor},{rotateZ:'180deg'}]}:null,side!=='right'&&{zIndex:data.length-index}];var pressDisabled=item.disablePress||props.disablePress||pointerConfig&&pointerConfig.barTouchable!==true;var barContent=function barContent(){var isBarBelowXaxisAndInvisible=item.value<0&&!noOfSectionsBelowXAxis;var animated2DWithGradient=function animated2DWithGradient(noGradient,noAnimation){return(0,_jsxRuntime.jsx)(_Animated2DWithGradient.default,Object.assign({},commonPropsFor2Dand3Dbars,{animationDuration:animationDuration||800,roundedBottom:props.roundedBottom||false,roundedTop:props.roundedTop||false,noGradient:noGradient,noAnimation:noAnimation,containerHeight:containerHeight,maxValue:maxValue,minHeight:minHeight!=null?minHeight:0,barMarginBottom:barMarginBottom,cappedBars:props.cappedBars,capThickness:props.capThickness,capColor:props.capColor,capRadius:props.capRadius,horizontal:horizontal,barBorderWidth:barBorderWidth,barBorderColor:barBorderColor,commonStyleForBar:commonStyleForBar,barStyleWithBackground:barStyleWithBackground}));};return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(props.showXAxisIndices||item.showXAxisIndex)&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:{zIndex:2,position:'absolute',height:props.xAxisIndicesHeight,width:props.xAxisIndicesWidth,bottom:props.xAxisIndicesHeight/-2,left:((item.barWidth||barWidth)-props.xAxisIndicesWidth)/2,backgroundColor:props.xAxisIndicesColor}}),isBarBelowXaxisAndInvisible?null:isThreeD?(0,_jsxRuntime.jsx)(_AnimatedThreeDBar.default,Object.assign({},commonPropsFor2Dand3Dbars,{sideWidth:item.sideWidth||props.sideWidth||(item.barWidth||barWidth)/2,side:side||'left',sideColor:item.sideColor||props.sideColor||'',topColor:item.topColor||props.topColor||'',horizontal:horizontal,isAnimated:isAnimated,animationDuration:animationDuration||800,selectedIndex:selectedIndex})):item.showGradient||props.showGradient?isAnimated?animated2DWithGradient(false,false):static2DWithGradient(item):isAnimated?animated2DWithGradient(true,false):animated2DWithGradient(true,true),isAnimated?renderAnimatedLabel(false,label,labelTextStyle,item.value):renderLabel(false,label,labelTextStyle,item.value),secondaryXAxis?isAnimated?renderAnimatedLabel(true,secondaryLabel,secondaryLabelTextStyle,item.value):renderLabel(true,secondaryLabel,secondaryLabelTextStyle,item.value):null]});};var tooltipProps={barHeight:barHeight,barWidth:item.barWidth||barWidth,item:item,index:index,isLast:index===data.length-1,leftSpacing:leftSpacing,leftShiftForLastIndexTooltip:leftShiftForLastIndexTooltip,leftShiftForTooltip:(_ref=(_item$leftShiftForToo=item.leftShiftForTooltip)!=null?_item$leftShiftForToo:leftShiftForTooltip)!=null?_ref:0,renderTooltip:renderTooltip,autoCenterTooltip:autoCenterTooltip,horizontal:horizontal};return(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[pressDisabled?(0,_jsxRuntime.jsx)(_reactNative.View,{pointerEvents:"none",style:barWrapperStyle,children:barContent()}):(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{activeOpacity:props.activeOpacity||0.2,onPress:function onPress(){if(renderTooltip||props.focusBarOnPress){if(props.focusedBarIndex===undefined||!props.onPress){setSelectedIndex(index);}}item.onPress?item.onPress():props.onPress?props.onPress(item,index):null;},onLongPress:function onLongPress(){item.onLongPress?item.onLongPress():props.onLongPress?props.onLongPress(item,index):null;},onPressOut:function onPressOut(){item.onPressOut?item.onPressOut():props.onPressOut?props.onPressOut(item,index):null;},style:barWrapperStyle,children:barContent()}),renderTooltip&&selectedIndex===index&&(0,_jsxRuntime.jsx)(_tooltip.default,Object.assign({},tooltipProps))]});};var _default=exports.default=RenderBars;
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { View, TouchableOpacity, Animated, Text } from 'react-native';
+import AnimatedThreeDBar from '../Components/AnimatedThreeDBar';
+import Animated2DWithGradient from './Animated2DWithGradient';
+import Cap from '../Components/BarSpecificComponents/cap';
+import BarBackgroundPattern from '../Components/BarSpecificComponents/barBackgroundPattern';
+import LinearGradient from '../Components/common/LinearGradient';
+import { getPropsForAnimated2DWithGradient, AxesAndRulesDefaults, } from 'gifted-charts-core';
+import Tooltip from '../Components/BarSpecificComponents/tooltip';
+var RenderBars = function (props) {
+    var _a, _b, _c, _d, _e;
+    var item = props.item, index = props.index, containerHeight = props.containerHeight, maxValue = props.maxValue, minHeight = props.minHeight, spacing = props.spacing, propSpacing = props.propSpacing, side = props.side, data = props.data, barBorderWidth = props.barBorderWidth, barBorderColor = props.barBorderColor, isThreeD = props.isThreeD, isAnimated = props.isAnimated, rotateLabel = props.rotateLabel, appearingOpacity = props.appearingOpacity, animationDuration = props.animationDuration, autoShiftLabels = props.autoShiftLabels, label = props.label, secondaryLabel = props.secondaryLabel, labelTextStyle = props.labelTextStyle, secondaryLabelTextStyle = props.secondaryLabelTextStyle, xAxisTextNumberOfLines = props.xAxisTextNumberOfLines, xAxisLabelsVerticalShift = props.xAxisLabelsVerticalShift, renderTooltip = props.renderTooltip, leftShiftForTooltip = props.leftShiftForTooltip, leftShiftForLastIndexTooltip = props.leftShiftForLastIndexTooltip, initialSpacing = props.initialSpacing, selectedIndex = props.selectedIndex, setSelectedIndex = props.setSelectedIndex, _f = props.xAxisThickness, xAxisThickness = _f === void 0 ? AxesAndRulesDefaults.xAxisThickness : _f, horizontal = props.horizontal, rtl = props.rtl, intactTopLabel = props.intactTopLabel, showValuesAsTopLabel = props.showValuesAsTopLabel, topLabelContainerStyle = props.topLabelContainerStyle, topLabelTextStyle = props.topLabelTextStyle, pointerConfig = props.pointerConfig, noOfSectionsBelowXAxis = props.noOfSectionsBelowXAxis, yAxisOffset = props.yAxisOffset, barWidth = props.barWidth, _g = props.labelsDistanceFromXaxis, labelsDistanceFromXaxis = _g === void 0 ? 0 : _g, stepHeight = props.stepHeight, stepValue = props.stepValue, negativeStepHeight = props.negativeStepHeight, negativeStepValue = props.negativeStepValue, autoCenterTooltip = props.autoCenterTooltip, secondaryXAxis = props.secondaryXAxis;
+    var heightFactor = item.value < 0
+        ? negativeStepHeight / negativeStepValue
+        : stepHeight / stepValue;
+    var barHeight = Math.max(minHeight, Math.abs(item.value) * heightFactor - xAxisThickness);
+    var _h = getPropsForAnimated2DWithGradient(__assign(__assign({}, props), { barHeight: barHeight })), commonStyleForBar = _h.commonStyleForBar, barStyleWithBackground = _h.barStyleWithBackground, commonPropsFor2dAnd3dBars = _h.commonPropsFor2dAnd3dBars, isFocused = _h.isFocused, focusedBarConfig = _h.focusedBarConfig, localFrontColor = _h.localFrontColor;
+    var itemOrPropsBarInnerComponent = (_a = item.barInnerComponent) !== null && _a !== void 0 ? _a : props.barInnerComponent;
+    var localBarInnerComponent = isFocused
+        ? ((_b = focusedBarConfig === null || focusedBarConfig === void 0 ? void 0 : focusedBarConfig.barInnerComponent) !== null && _b !== void 0 ? _b : itemOrPropsBarInnerComponent)
+        : itemOrPropsBarInnerComponent;
+    var barMarginBottom = item.barMarginBottom === 0
+        ? 0
+        : item.barMarginBottom || props.barMarginBottom || 0;
+    var renderLabel = function (top, label, labelTextStyle, value) {
+        var _a, _b;
+        return (_jsx(View, { style: [
+                {
+                    width: (item.labelWidth ||
+                        props.labelWidth ||
+                        item.barWidth ||
+                        barWidth) + spacing,
+                    left: spacing / -2,
+                    position: 'absolute',
+                    height: (_a = props.xAxisLabelsHeight) !== null && _a !== void 0 ? _a : xAxisTextNumberOfLines * 18,
+                    bottom: top
+                        ? (containerHeight || 200) +
+                            ((_b = secondaryXAxis === null || secondaryXAxis === void 0 ? void 0 : secondaryXAxis.labelsDistanceFromXaxis) !== null && _b !== void 0 ? _b : 15)
+                        : (rotateLabel
+                            ? -40
+                            : -6 -
+                                xAxisTextNumberOfLines * 18 -
+                                xAxisLabelsVerticalShift) -
+                            barMarginBottom -
+                            labelsDistanceFromXaxis,
+                },
+                rotateLabel
+                    ? horizontal
+                        ? { transform: [{ rotate: '330deg' }] }
+                        : {
+                            transform: [
+                                { rotate: value < 0 ? '240deg' : '60deg' },
+                                { translateX: value < 0 ? 56 : 0 },
+                                { translateY: value < 0 ? 32 : 0 },
+                            ],
+                        }
+                    : horizontal
+                        ? { transform: [{ rotate: '-90deg' }] }
+                        : value < 0
+                            ? {
+                                transform: [
+                                    { rotate: '180deg' },
+                                    {
+                                        translateY: autoShiftLabels
+                                            ? 0
+                                            : 16.5 * xAxisTextNumberOfLines + 14,
+                                    },
+                                ],
+                            }
+                            : {},
+            ], children: top ? (item.secondaryLabelComponent ? (item.secondaryLabelComponent()) : (_jsx(Text, { style: [
+                    { textAlign: 'center' },
+                    rtl && horizontal && { transform: [{ rotate: '180deg' }] },
+                    labelTextStyle,
+                ], numberOfLines: xAxisTextNumberOfLines, children: label }))) : item.labelComponent ? (item.labelComponent()) : (_jsx(Text, { style: [
+                    { textAlign: 'center' },
+                    rtl && horizontal && { transform: [{ rotate: '180deg' }] },
+                    labelTextStyle,
+                ], numberOfLines: xAxisTextNumberOfLines, children: label })) }));
+    };
+    var renderAnimatedLabel = function (top, label, labelTextStyle, value) {
+        var _a, _b;
+        return (_jsx(Animated.View, { style: [
+                {
+                    width: (item.labelWidth ||
+                        props.labelWidth ||
+                        item.barWidth ||
+                        barWidth) + spacing,
+                    left: spacing / -2,
+                    position: 'absolute',
+                    height: (_a = props.xAxisLabelsHeight) !== null && _a !== void 0 ? _a : xAxisTextNumberOfLines * 18,
+                    bottom: top
+                        ? (containerHeight || 200) +
+                            ((_b = secondaryXAxis === null || secondaryXAxis === void 0 ? void 0 : secondaryXAxis.labelsDistanceFromXaxis) !== null && _b !== void 0 ? _b : 15)
+                        : (rotateLabel
+                            ? -40
+                            : -6 -
+                                xAxisTextNumberOfLines * 18 -
+                                xAxisLabelsVerticalShift) - barMarginBottom,
+                    opacity: appearingOpacity,
+                },
+                value < 0 && { transform: [{ rotate: '180deg' }] },
+                rotateLabel
+                    ? horizontal
+                        ? { transform: [{ rotate: '330deg' }] }
+                        : { transform: [{ rotate: '60deg' }] }
+                    : horizontal
+                        ? { transform: [{ rotate: '-90deg' }] }
+                        : value < 0
+                            ? {
+                                transform: [
+                                    { rotate: '180deg' },
+                                    {
+                                        translateY: autoShiftLabels
+                                            ? 0
+                                            : 16.5 * xAxisTextNumberOfLines + 14,
+                                    },
+                                ],
+                            }
+                            : {},
+            ], children: top ? (item.secondaryLabelComponent ? (item.secondaryLabelComponent()) : (_jsx(Text, { style: [
+                    { textAlign: 'center' },
+                    rtl && horizontal && { transform: [{ rotate: '180deg' }] },
+                    labelTextStyle,
+                ], numberOfLines: xAxisTextNumberOfLines, children: label }))) : item.labelComponent ? (item.labelComponent()) : (_jsx(Text, { style: [
+                    { textAlign: 'center' },
+                    rtl && horizontal && { transform: [{ rotate: '180deg' }] },
+                    labelTextStyle,
+                ], numberOfLines: xAxisTextNumberOfLines, children: label })) }));
+    };
+    var leftSpacing = initialSpacing;
+    for (var i = 0; i < index; i++) {
+        leftSpacing +=
+            ((_c = data[i].spacing) !== null && _c !== void 0 ? _c : propSpacing) + (data[i].barWidth || barWidth);
+    }
+    var static2DWithGradient = function (item) {
+        var _a, _b;
+        var localGradientColor = item.gradientColor || props.gradientColor || 'white';
+        return (_jsxs(_Fragment, { children: [_jsx(LinearGradient, { style: commonStyleForBar, start: { x: 0, y: 0 }, end: { x: 0, y: 1 }, colors: [
+                        isFocused
+                            ? ((_a = focusedBarConfig === null || focusedBarConfig === void 0 ? void 0 : focusedBarConfig.gradientColor) !== null && _a !== void 0 ? _a : localGradientColor)
+                            : localGradientColor,
+                        localFrontColor,
+                    ], children: props.cappedBars && item.value ? (_jsx(Cap, { capThicknessFromItem: item.capThickness, capThicknessFromProps: props.capThickness, capColorFromItem: item.capColor, capColorFromProps: props.capColor, capRadiusFromItem: item.capRadius, capRadiusFromProps: props.capRadius })) : null }), (item.barBackgroundPattern || props.barBackgroundPattern) && (_jsx(BarBackgroundPattern, { barBackgroundPatternFromItem: item.barBackgroundPattern, barBackgroundPatternFromProps: props.barBackgroundPattern, patternIdFromItem: item.patternId, patternIdFromProps: props.patternId })), (item.topLabelComponent || showValuesAsTopLabel) && (_jsx(View, { style: [
+                        {
+                            position: 'absolute',
+                            top: (item.barWidth || barWidth) * -1,
+                            height: item.barWidth || barWidth,
+                            width: item.barWidth || barWidth,
+                            justifyContent: (horizontal && !intactTopLabel) || item.value < 0
+                                ? 'center'
+                                : 'flex-end',
+                            alignItems: 'center',
+                        },
+                        item.value < 0 && { transform: [{ rotate: '180deg' }] },
+                        horizontal &&
+                            !intactTopLabel && { transform: [{ rotate: '270deg' }] },
+                        topLabelContainerStyle !== null && topLabelContainerStyle !== void 0 ? topLabelContainerStyle : item.topLabelContainerStyle,
+                    ], children: showValuesAsTopLabel ? (_jsx(Text, { style: topLabelTextStyle, children: item.value + yAxisOffset })) : ((_b = item.topLabelComponent) === null || _b === void 0 ? void 0 : _b.call(item)) })), localBarInnerComponent ? (_jsx(View, { style: { height: '100%', width: '100%' }, children: localBarInnerComponent(item, index) })) : null] }));
+    };
+    var barWrapperStyle = [
+        {
+            // overflow: 'visible',
+            marginBottom: 60 + barMarginBottom + xAxisLabelsVerticalShift - 0.5,
+            width: commonPropsFor2dAnd3dBars.barWidth,
+            height: barHeight,
+            marginRight: spacing,
+        },
+        pointerConfig
+            ? {
+                transform: [
+                    {
+                        translateY: (containerHeight || 200) -
+                            (barHeight - 10 + xAxisLabelsVerticalShift) +
+                            (item.value < 0 ? Math.abs(item.value) * heightFactor : 0),
+                    },
+                ],
+            }
+            : item.value < 0
+                ? {
+                    transform: [
+                        {
+                            translateY: Math.abs(item.value) * heightFactor,
+                        },
+                        { rotateZ: '180deg' },
+                    ],
+                }
+                : null,
+        side !== 'right' && { zIndex: data.length - index },
+    ];
+    var pressDisabled = item.disablePress ||
+        props.disablePress ||
+        (pointerConfig && pointerConfig.barTouchable !== true);
+    var barContent = function () {
+        var isBarBelowXaxisAndInvisible = item.value < 0 && !noOfSectionsBelowXAxis;
+        var animated2DWithGradient = function (noGradient, noAnimation) { return (_jsx(Animated2DWithGradient, __assign({}, commonPropsFor2dAnd3dBars, { animationDuration: animationDuration || 800, roundedBottom: props.roundedBottom || false, roundedTop: props.roundedTop || false, noGradient: noGradient, noAnimation: noAnimation, containerHeight: containerHeight, maxValue: maxValue, minHeight: minHeight !== null && minHeight !== void 0 ? minHeight : 0, barMarginBottom: barMarginBottom, cappedBars: props.cappedBars, capThickness: props.capThickness, capColor: props.capColor, capRadius: props.capRadius, horizontal: horizontal, barBorderWidth: barBorderWidth, barBorderColor: barBorderColor, commonStyleForBar: commonStyleForBar, barStyleWithBackground: barStyleWithBackground }))); };
+        return (_jsxs(_Fragment, { children: [(props.showXAxisIndices || item.showXAxisIndex) && (_jsx(View, { style: {
+                        zIndex: 2,
+                        position: 'absolute',
+                        height: props.xAxisIndicesHeight,
+                        width: props.xAxisIndicesWidth,
+                        bottom: props.xAxisIndicesHeight / -2,
+                        left: ((item.barWidth || barWidth) - props.xAxisIndicesWidth) / 2,
+                        backgroundColor: props.xAxisIndicesColor,
+                    } })), isBarBelowXaxisAndInvisible ? null : isThreeD ? (_jsx(AnimatedThreeDBar, __assign({}, commonPropsFor2dAnd3dBars, { sideWidth: item.sideWidth ||
+                        props.sideWidth ||
+                        (item.barWidth || barWidth) / 2, side: side || 'left', sideColor: item.sideColor || props.sideColor || '', topColor: item.topColor || props.topColor || '', horizontal: horizontal, isAnimated: isAnimated, animationDuration: animationDuration || 800, selectedIndex: selectedIndex }))) : item.showGradient || props.showGradient ? (isAnimated ? (animated2DWithGradient(false, false)) : (static2DWithGradient(item))) : isAnimated ? (animated2DWithGradient(true, false)) : (animated2DWithGradient(true, true)), isAnimated
+                    ? renderAnimatedLabel(false, label, labelTextStyle, item.value)
+                    : renderLabel(false, label, labelTextStyle, item.value), secondaryXAxis
+                    ? isAnimated
+                        ? renderAnimatedLabel(true, secondaryLabel, secondaryLabelTextStyle, item.value)
+                        : renderLabel(true, secondaryLabel, secondaryLabelTextStyle, item.value)
+                    : null] }));
+    };
+    var tooltipProps = {
+        barHeight: barHeight,
+        barWidth: item.barWidth || barWidth,
+        item: item,
+        index: index,
+        isLast: index === data.length - 1,
+        leftSpacing: leftSpacing,
+        leftShiftForLastIndexTooltip: leftShiftForLastIndexTooltip,
+        leftShiftForTooltip: (_e = (_d = item.leftShiftForTooltip) !== null && _d !== void 0 ? _d : leftShiftForTooltip) !== null && _e !== void 0 ? _e : 0,
+        renderTooltip: renderTooltip,
+        autoCenterTooltip: autoCenterTooltip,
+        horizontal: horizontal,
+    };
+    return (_jsxs(_Fragment, { children: [pressDisabled ? (_jsx(View, { pointerEvents: "none", style: barWrapperStyle, children: barContent() })) : (_jsx(TouchableOpacity, { activeOpacity: props.activeOpacity || 0.2, onPress: function () {
+                    if (renderTooltip || props.focusBarOnPress) {
+                        if (props.focusedBarIndex === undefined || !props.onPress) {
+                            setSelectedIndex(index);
+                        }
+                    }
+                    item.onPress
+                        ? item.onPress()
+                        : props.onPress
+                            ? props.onPress(item, index)
+                            : null;
+                }, onLongPress: function () {
+                    item.onLongPress
+                        ? item.onLongPress()
+                        : props.onLongPress
+                            ? props.onLongPress(item, index)
+                            : null;
+                }, onPressOut: function () {
+                    item.onPressOut
+                        ? item.onPressOut()
+                        : props.onPressOut
+                            ? props.onPressOut(item, index)
+                            : null;
+                }, style: barWrapperStyle, children: barContent() })), renderTooltip && selectedIndex === index && (_jsx(Tooltip, __assign({}, tooltipProps)))] }));
+};
+export default RenderBars;

package/dist/BarChart/RenderStackBars.d.ts

@@ -0,0 +1,3 @@
+import { StackedBarChartPropsType } from 'gifted-charts-core';
+declare const RenderStackBars: (props: StackedBarChartPropsType) => import("react/jsx-runtime").JSX.Element;
+export default RenderStackBars;