@wavemaker-ai/app-rn-runtime 1.0.0-rc.326 → 1.0.0-rc.330

package/components/chart/area-chart/area-chart.props.js

@@ -7,6 +7,8 @@ export default class WmAreaChartProps extends BaseChartComponentProps {
     super(...args);
     _defineProperty(this, "linethickness", 2);
     _defineProperty(this, "onSelect", void 0);
+    _defineProperty(this, "areafill", 'gradient');
+    _defineProperty(this, "areaopacity", 0.6);
   }
 }
 //# sourceMappingURL=area-chart.props.js.map

package/components/chart/area-chart/area-chart.props.js.map

@@ -1 +1 @@
-{"version":3,"names":["BaseChartComponentProps","WmAreaChartProps","constructor","args","_defineProperty"],"sources":["area-chart.props.ts"],"sourcesContent":["import BaseChartComponentProps from \"@wavemaker-ai/app-rn-runtime/components/chart/basechart.props\";\n\nexport default class WmAreaChartProps extends BaseChartComponentProps {\n    linethickness: number = 2;\n    onSelect?: any;\n}\n"],"mappings":";;;AAAA,OAAOA,uBAAuB,MAAM,+DAA+D;AAEnG,eAAe,MAAMC,gBAAgB,SAASD,uBAAuB,CAAC;EAAAE,YAAA,GAAAC,IAAA;IAAA,SAAAA,IAAA;IAAAC,eAAA,wBAC1C,CAAC;IAAAA,eAAA;EAAA;AAE7B","ignoreList":[]}
+{"version":3,"names":["BaseChartComponentProps","WmAreaChartProps","constructor","args","_defineProperty"],"sources":["area-chart.props.ts"],"sourcesContent":["import BaseChartComponentProps from \"@wavemaker-ai/app-rn-runtime/components/chart/basechart.props\";\n\nexport default class WmAreaChartProps extends BaseChartComponentProps {\n  linethickness: number = 2;\n  onSelect?: any;\n  areafill?: 'gradient' | 'transparent' | 'solid' = 'gradient';\n  areaopacity?: number = 0.6;\n}\n"],"mappings":";;;AAAA,OAAOA,uBAAuB,MAAM,+DAA+D;AAEnG,eAAe,MAAMC,gBAAgB,SAASD,uBAAuB,CAAC;EAAAE,YAAA,GAAAC,IAAA;IAAA,SAAAA,IAAA;IAAAC,eAAA,wBAC5C,CAAC;IAAAA,eAAA;IAAAA,eAAA,mBAEyB,UAAU;IAAAA,eAAA,sBACrC,GAAG;EAAA;AAC5B","ignoreList":[]}

package/components/chart/bar-chart/bar-chart.component.js

@@ -1,8 +1,11 @@
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import React from 'react';
-import { View, Text, Platform } from 'react-native';
+import { View, Text } from 'react-native';
+import { ColumnChart } from '@wavemaker/react-native-echarts';
 import { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker-ai/app-rn-runtime/core/accessibility';
-import { VictoryChart, VictoryBar, VictoryStack, VictoryGroup } from "victory-native";
 import { BaseChartComponent, BaseChartComponentState } from "@wavemaker-ai/app-rn-runtime/components/chart/basechart.component";
 import WmBarChartProps from './bar-chart.props';
 import { DEFAULT_CLASS } from './bar-chart.styles';
@@ -11,99 +14,55 @@ export class WmBarChartState extends BaseChartComponentState {}
 export default class WmBarChart extends BaseChartComponent {
   constructor(props) {
     super(props, DEFAULT_CLASS, new WmBarChartProps(), new WmBarChartState());
-  }
-  labelFn(data) {
-    return this.abbreviateNumber(data.datum.y);
-  }
-  getBarChart(props) {
-    const isNested = Array.isArray(this.state.data[0]) && this.state.data.length > 1;
-    return this.state.data.map((d, i) => {
-      return /*#__PURE__*/React.createElement(VictoryBar, _extends({
-        key: props.name + '_' + i,
-        horizontal: props.horizontal,
-        labels: props.showvalues ? this.labelFn.bind(this) : undefined,
-        data: this.isRTL ? d.toReversed() : d,
-        height: 100,
-        alignment: this.isRTL ? 'end' : 'start',
-        style: props.customcolors ? {
-          data: {
-            fill: isNested ? this.state.colors[i % this.state.colors.length] : ({
-              datum
-            }) => {
-              var _this$state$colors$da;
-              return (_this$state$colors$da = this.state.colors[datum.x]) !== null && _this$state$colors$da !== void 0 ? _this$state$colors$da : this.state.colors[datum.x % this.state.colors.length];
-            },
-            stroke: isNested ? this.state.colors[i % this.state.colors.length] : ({
-              datum
-            }) => {
-              var _this$state$colors$da2;
-              return (_this$state$colors$da2 = this.state.colors[datum.x]) !== null && _this$state$colors$da2 !== void 0 ? _this$state$colors$da2 : this.state.colors[datum.x % this.state.colors.length];
-            },
-            strokeWidth: props.showzerothvalue ? 3 : 0
-          }
-        } : {
-          data: {
-            strokeWidth: props.showzerothvalue ? 3 : 0
-          }
-        },
-        cornerRadius: {
-          topLeft: this.styles.bar.borderTopLeftRadius,
-          topRight: this.styles.bar.borderTopRightRadius,
-          bottomLeft: this.styles.bar.borderBottomLeftRadius,
-          bottomRight: this.styles.bar.borderBottomRightRadius
-        },
-        events: [{
-          target: 'data',
-          eventHandlers: Platform.OS == "web" ? {
-            onClick: this.onSelect.bind(this)
-          } : {
-            onPress: this.onSelect.bind(this)
-          }
-        }]
-      }, props.barwidth ? {
-        barWidth: props.barwidth
-      } : {}));
-    });
-  }
-  onSelect(event, data) {
-    if (!this.viewRef.current) return;
-    if (!this.state.props.dataset) return;
-    this.viewRef.current.measureInWindow((chartX, chartY) => {
-      let value = data.data[data.index].y;
-      let label = this.state.xaxisDatakeyArr[data.datum.x];
-      let selectedItem = this.props.dataset[data.index];
-      const nativeEvent = event.nativeEvent;
-      let tooltipX = nativeEvent.pageX - chartX;
-      let tooltipY = nativeEvent.pageY - chartY;
-      let selectedChartItem = [{
-        series: 0,
-        x: data.index,
-        y: value,
+    _defineProperty(this, "onSelect", event => {
+      if (!this.viewRef.current) return;
+      if (!this.state.props.dataset) return;
+      const {
+        dataIndex,
+        y,
+        seriesIndex
+      } = event;
+      const selectedItem = this.props.dataset[dataIndex];
+      const selectedChartItem = [{
+        series: seriesIndex,
+        x: dataIndex,
+        y,
         _dataObj: selectedItem
-      }, data.index];
+      }, dataIndex];
       this.updateState({
-        tooltipXaxis: label,
-        tooltipYaxis: value,
-        isTooltipOpen: true,
         selectedItem: {
           ...selectedItem,
-          index: data.index
-        },
-        tooltipXPosition: tooltipX - this.state.tooltipoffsetx,
-        tooltipYPosition: tooltipY - this.state.tooltipoffsety
+          index: dataIndex
+        }
       });
-      this.invokeEventCallback('onSelect', [event.nativeEvent, this.proxy, selectedItem, selectedChartItem]);
+      this.invokeEventCallback('onSelect', [null, this.proxy, selectedItem, selectedChartItem]);
     });
   }
+  labelFn(data) {
+    return this.abbreviateNumber(data.datum.y);
+  }
   renderWidget(props) {
+    var _this$state$data, _this$state$colors, _props$tooltip;
     this.invokeEventCallback('onBeforerender', [this.proxy, null]);
-    if (!this.state.data.length) {
+    if (!((_this$state$data = this.state.data) !== null && _this$state$data !== void 0 && _this$state$data.length)) {
       return null;
     }
-    let mindomain = {
-      x: this.props.xdomain === 'Min' ? this.state.chartMinX : undefined,
-      y: this.props.ydomain === 'Min' ? this.state.chartMinY : undefined
-    };
+    const chartData = this.state.data.map((series, i) => ({
+      name: this.state.yAxis[i],
+      data: series.map(pt => pt.y)
+    }));
+    const showLegend = props.showlegend !== 'hide';
+    const legendPosition = ['top', 'bottom', 'left', 'right'].includes(props.showlegend) ? props.showlegend : 'bottom';
+    const minDomain = this.getMinDomain();
+
+    // ColumnChart swaps category/value axes when horizontal=true. WaveMaker x-axis props
+    // refer to categories (xaxisdatakey) and y-axis props refer to values (yaxisdatakey).
+    const isHorizontal = !!props.horizontal;
+    const series = ((_this$state$colors = this.state.colors) !== null && _this$state$colors !== void 0 && _this$state$colors.length ? this.state.colors : ['#000']).map(color => ({
+      color
+    }));
+    const xAxisTickLabelFormatter = isHorizontal ? this.getYAxisTickLabelFormatter() : this.getXAxisTickLabelFormatter();
+    const yAxisTickLabelFormatter = isHorizontal ? this.getXAxisTickLabelFormatter() : this.getYAxisTickLabelFormatter();
     return /*#__PURE__*/React.createElement(View, _extends({}, getAccessibilityProps(AccessibilityWidgetType.LINECHART, props), {
       style: this.styles.root,
       onLayout: this.onViewLayoutChange.bind(this)
@@ -120,25 +79,48 @@ export default class WmBarChart extends BaseChartComponent {
       style: this.styles.title
     }, props.title) : null) : null, props.subheading ? /*#__PURE__*/React.createElement(Text, {
       style: this.styles.subHeading
-    }, props.subheading) : null), /*#__PURE__*/React.createElement(View, {
+    }, props.subheading) : null), this.state.chartWidth ? /*#__PURE__*/React.createElement(View, {
       ref: this.viewRef
-    }, this.getTooltip(), /*#__PURE__*/React.createElement(VictoryChart, {
-      theme: this.state.theme,
-      height: this.styles.root.height,
+    }, /*#__PURE__*/React.createElement(ColumnChart, {
+      data: chartData,
       width: this.state.chartWidth || this.screenWidth,
-      minDomain: mindomain,
-      padding: {
+      height: this.styles.root.height,
+      colors: this.state.colors,
+      theme: this.getChartTheme(isHorizontal, series),
+      horizontal: props.horizontal,
+      stack: props.viewtype === 'Stacked' ? 'total' : false,
+      stackNormalize: props.stacknormalize,
+      cornerRadius: [this.styles.bar.borderTopLeftRadius, this.styles.bar.borderTopRightRadius, this.styles.bar.borderBottomRightRadius, this.styles.bar.borderBottomLeftRadius],
+      barOutsideLabelFormatter: props.showvalues ? value => String(this.abbreviateNumber(value)) : undefined,
+      minY: minDomain.y,
+      maxY: this.state.chartMaxY,
+      minX: minDomain.x,
+      maxX: this.state.chartMaxX,
+      grid: {
         top: props.offsettop,
         bottom: props.offsetbottom,
         left: this.isRTL ? props.offsetright : props.offsetleft,
         right: this.isRTL ? props.offsetleft : props.offsetright
-      }
-    }, this.getLegendView(), this.getXaxis(), this.getYAxis(), props.viewtype === 'Stacked' ? /*#__PURE__*/React.createElement(VictoryStack, {
-      colorScale: !this.theme ? this.state.colors : undefined
-    }, this.getBarChart(props)) : /*#__PURE__*/React.createElement(VictoryGroup, {
-      colorScale: !this.theme ? this.state.colors : undefined,
-      offset: 10
-    }, this.getBarChart(props)))));
+      },
+      showXAxis: isHorizontal ? props.showyaxis : props.showxaxis,
+      showXAxisTicks: isHorizontal ? props.showyaxisticks : props.showxaxisticks,
+      showYAxis: isHorizontal ? props.showxaxis : props.showyaxis,
+      showYAxisTicks: isHorizontal ? props.showxaxisticks : props.showyaxisticks,
+      showXAxisSplitLines: isHorizontal ? !props.hidegridyaxis : !props.hidegridxaxis,
+      showYAxisSplitLines: isHorizontal ? !props.hidegridxaxis : !props.hidegridyaxis,
+      xAxisLabel: isHorizontal ? this.state.yLabel || '' : this.state.xLabel || '',
+      yAxisLabel: isHorizontal ? this.state.xLabel || '' : this.state.yLabel || '',
+      xAxisTickLabelFormatter: xAxisTickLabelFormatter,
+      yAxisTickLabelFormatter: yAxisTickLabelFormatter,
+      showLegend: showLegend,
+      legendPosition: legendPosition,
+      tooltip: props.tooltips ? this.hasCustomTooltip ? 'none' : (_props$tooltip = props.tooltip) !== null && _props$tooltip !== void 0 ? _props$tooltip : 'card' : 'none',
+      renderTooltip: this.getRenderTooltip(),
+      showHighlighter: props.showhighlighter,
+      onSelect: this.onSelect,
+      intervalX: isHorizontal ? props.intervaly : props.intervalx,
+      intervalY: isHorizontal ? props.intervalx : props.intervaly
+    })) : null);
   }
 }
 //# sourceMappingURL=bar-chart.component.js.map

package/components/chart/bar-chart/bar-chart.component.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","View","Text","Platform","AccessibilityWidgetType","getAccessibilityProps","VictoryChart","VictoryBar","VictoryStack","VictoryGroup","BaseChartComponent","BaseChartComponentState","WmBarChartProps","DEFAULT_CLASS","WmIcon","WmBarChartState","WmBarChart","constructor","props","labelFn","data","abbreviateNumber","datum","y","getBarChart","isNested","Array","isArray","state","length","map","d","i","createElement","_extends","key","name","horizontal","labels","showvalues","bind","undefined","isRTL","toReversed","height","alignment","style","customcolors","fill","colors","_this$state$colors$da","x","stroke","_this$state$colors$da2","strokeWidth","showzerothvalue","cornerRadius","topLeft","styles","bar","borderTopLeftRadius","topRight","borderTopRightRadius","bottomLeft","borderBottomLeftRadius","bottomRight","borderBottomRightRadius","events","target","eventHandlers","OS","onClick","onSelect","onPress","barwidth","barWidth","event","viewRef","current","dataset","measureInWindow","chartX","chartY","value","index","label","xaxisDatakeyArr","selectedItem","nativeEvent","tooltipX","pageX","tooltipY","pageY","selectedChartItem","series","_dataObj","updateState","tooltipXaxis","tooltipYaxis","isTooltipOpen","tooltipXPosition","tooltipoffsetx","tooltipYPosition","tooltipoffsety","invokeEventCallback","proxy","renderWidget","mindomain","xdomain","chartMinX","ydomain","chartMinY","LINECHART","root","onLayout","onViewLayoutChange","title","iconclass","testID","flexDirection","alignItems","icon","subheading","subHeading","ref","getTooltip","theme","width","chartWidth","screenWidth","minDomain","padding","top","offsettop","bottom","offsetbottom","left","offsetright","offsetleft","right","getLegendView","getXaxis","getYAxis","viewtype","colorScale","offset"],"sources":["bar-chart.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View, Text, Platform, LayoutChangeEvent } from 'react-native';\nimport { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker-ai/app-rn-runtime/core/accessibility';\nimport {\n  VictoryChart,\n  VictoryBar,\n  VictoryLegend,\n  VictoryStack,\n  VictoryGroup\n} from \"victory-native\";\n\nimport {\n  BaseChartComponent,\n  BaseChartComponentState\n} from \"@wavemaker-ai/app-rn-runtime/components/chart/basechart.component\";\nimport WmBarChartProps from './bar-chart.props';\nimport { DEFAULT_CLASS, WmBarChartStyles } from './bar-chart.styles';\nimport WmIcon from \"@wavemaker-ai/app-rn-runtime/components/basic/icon/icon.component\";\nimport { min } from 'moment';\nimport { isWebPreviewMode } from '@wavemaker-ai/app-rn-runtime/core/utils';\n\nexport class WmBarChartState extends BaseChartComponentState<WmBarChartProps> {}\n\nexport default class WmBarChart extends BaseChartComponent<WmBarChartProps, WmBarChartState, WmBarChartStyles> {\n\n  constructor(props: WmBarChartProps) {\n    super(props, DEFAULT_CLASS, new WmBarChartProps(), new WmBarChartState());\n  }\n\n  labelFn(data: any): string | number | string[] | number[] | null {\n    return this.abbreviateNumber(data.datum.y);\n  }\n\n  getBarChart(props: WmBarChartProps) {\n    const isNested = Array.isArray(this.state.data[0]) && this.state.data.length > 1;\n    return this.state.data.map((d: any, i: number) => {\n      return <VictoryBar key={props.name + '_' + i}\n        horizontal={props.horizontal} labels={props.showvalues ? this.labelFn.bind(this) : undefined}\n        data={this.isRTL?d.toReversed():d}\n        height={100}\n        alignment={this.isRTL ? 'end' : 'start'}\n        style={props.customcolors?{\n          data: {\n            fill:isNested ? this.state.colors[i % this.state.colors.length] : ({ datum }) => this.state.colors[datum.x] ?? this.state.colors[datum.x % this.state.colors.length],\n            stroke: isNested ? this.state.colors[i % this.state.colors.length] : ({ datum }) => this.state.colors[datum.x] ?? this.state.colors[datum.x % this.state.colors.length],\n            strokeWidth: props.showzerothvalue ? 3 : 0\n          }\n        }:{\n          data: {\n            strokeWidth: props.showzerothvalue ? 3 : 0\n          }\n        }}\n        cornerRadius={{topLeft: this.styles.bar.borderTopLeftRadius, topRight: this.styles.bar.borderTopRightRadius, bottomLeft: this.styles.bar.borderBottomLeftRadius, bottomRight: this.styles.bar.borderBottomRightRadius}}\n        events={[{\n          target: 'data',\n          eventHandlers: Platform.OS == \"web\" ? {\n            onClick: this.onSelect.bind(this)\n          }:{\n            onPress: this.onSelect.bind(this)\n          }\n        }]}\n        {...(props.barwidth ? { barWidth: props.barwidth } : {})} />\n    });\n  }\n\nonSelect(event: any, data: any){\n  if (!this.viewRef.current) return;\n  if (!this.state.props.dataset) return;\n  this.viewRef.current.measureInWindow((chartX: number, chartY: number) => {\n  let value = data.data[data.index].y;\n  let label = this.state.xaxisDatakeyArr[data.datum.x];\n  let selectedItem = this.props.dataset[data.index];\n  const nativeEvent = event.nativeEvent;\n  let tooltipX = nativeEvent.pageX - chartX;\n  let tooltipY = nativeEvent.pageY - chartY;\n    let selectedChartItem = [{series: 0, x: data.index, y: value,_dataObj: selectedItem},data.index];\n    this.updateState({\n      tooltipXaxis: label,\n      tooltipYaxis: value,\n      isTooltipOpen: true,\n      selectedItem: {...selectedItem, index: data.index},\n      tooltipXPosition: tooltipX - this.state.tooltipoffsetx,\n      tooltipYPosition: tooltipY - this.state.tooltipoffsety\n    } as WmBarChartState)\n  this.invokeEventCallback('onSelect', [event.nativeEvent, this.proxy, selectedItem, selectedChartItem ]);\n  });\n}\n\n  renderWidget(props: WmBarChartProps) {\n    this.invokeEventCallback('onBeforerender', [this.proxy, null]);\n    if (!this.state.data.length) {\n      return null;\n    }\n    let mindomain={x: this.props.xdomain === 'Min' ? this.state.chartMinX: undefined, y: this.props.ydomain === 'Min' ? this.state.chartMinY: undefined};\n    return (<View\n      {...getAccessibilityProps(AccessibilityWidgetType.LINECHART, props)}\n      style={this.styles.root}\n      onLayout={this.onViewLayoutChange.bind(this)}\n    >\n      <View>\n      { (props.title || props.iconclass) ? (\n        <View testID=\"title-icon-container\" style={{flexDirection: 'row', alignItems: 'center'}}>\n          {props.iconclass ? (<WmIcon iconclass={props.iconclass} styles={this.styles.icon}></WmIcon>) : null }\n          {props.title ? (<Text style={this.styles.title}>{props.title}</Text>) : null }\n        </View>\n      ) : null }\n        { props.subheading ? (\n          <Text style={this.styles.subHeading}>{props.subheading}</Text> ) : null }\n        </View>\n      <View ref={this.viewRef}>\n      {this.getTooltip()}\n      <VictoryChart theme={this.state.theme}\n                      height={(this.styles.root.height) as number}\n                      width={this.state.chartWidth || this.screenWidth}\n                      minDomain={mindomain}\n                      padding={{ top: props.offsettop, bottom: props.offsetbottom, left: this.isRTL ? props.offsetright : props.offsetleft, right: this.isRTL ? props.offsetleft : props.offsetright }}>\n          {this.getLegendView()}\n          {this.getXaxis()}\n          {this.getYAxis()}\n          {\n            props.viewtype === 'Stacked' ? <VictoryStack\n              colorScale={!this.theme ? this.state.colors : undefined}>\n              {\n                this.getBarChart(props)\n              }\n            </VictoryStack> : <VictoryGroup colorScale={!this.theme ? this.state.colors : undefined}  offset={10} >\n              {\n                this.getBarChart(props)\n              }\n            </VictoryGroup>\n          }\n        </VictoryChart></View></View>);\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","View","Text","ColumnChart","AccessibilityWidgetType","getAccessibilityProps","BaseChartComponent","BaseChartComponentState","WmBarChartProps","DEFAULT_CLASS","WmIcon","WmBarChartState","WmBarChart","constructor","props","_defineProperty","event","viewRef","current","state","dataset","dataIndex","y","seriesIndex","selectedItem","selectedChartItem","series","x","_dataObj","updateState","index","invokeEventCallback","proxy","labelFn","data","abbreviateNumber","datum","renderWidget","_this$state$data","_this$state$colors","_props$tooltip","length","chartData","map","i","name","yAxis","pt","showLegend","showlegend","legendPosition","includes","minDomain","getMinDomain","isHorizontal","horizontal","colors","color","xAxisTickLabelFormatter","getYAxisTickLabelFormatter","getXAxisTickLabelFormatter","yAxisTickLabelFormatter","createElement","_extends","LINECHART","style","styles","root","onLayout","onViewLayoutChange","bind","title","iconclass","testID","flexDirection","alignItems","icon","subheading","subHeading","chartWidth","ref","width","screenWidth","height","theme","getChartTheme","stack","viewtype","stackNormalize","stacknormalize","cornerRadius","bar","borderTopLeftRadius","borderTopRightRadius","borderBottomRightRadius","borderBottomLeftRadius","barOutsideLabelFormatter","showvalues","value","String","undefined","minY","maxY","chartMaxY","minX","maxX","chartMaxX","grid","top","offsettop","bottom","offsetbottom","left","isRTL","offsetright","offsetleft","right","showXAxis","showyaxis","showxaxis","showXAxisTicks","showyaxisticks","showxaxisticks","showYAxis","showYAxisTicks","showXAxisSplitLines","hidegridyaxis","hidegridxaxis","showYAxisSplitLines","xAxisLabel","yLabel","xLabel","yAxisLabel","tooltip","tooltips","hasCustomTooltip","renderTooltip","getRenderTooltip","showHighlighter","showhighlighter","onSelect","intervalX","intervaly","intervalx","intervalY"],"sources":["bar-chart.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View, Text } from 'react-native';\nimport { ColumnChart, CartesianChartSelectEvent, AreaChartAxisTooltipParams } from '@wavemaker/react-native-echarts';\nimport { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker-ai/app-rn-runtime/core/accessibility';\nimport {\n  BaseChartComponent,\n  BaseChartComponentState\n} from \"@wavemaker-ai/app-rn-runtime/components/chart/basechart.component\";\nimport WmBarChartProps from './bar-chart.props';\nimport { DEFAULT_CLASS, WmBarChartStyles } from './bar-chart.styles';\nimport WmIcon from \"@wavemaker-ai/app-rn-runtime/components/basic/icon/icon.component\";\nimport isEmpty from 'lodash-es/isEmpty';\n\nexport class WmBarChartState extends BaseChartComponentState<WmBarChartProps> {}\n\nexport default class WmBarChart extends BaseChartComponent<WmBarChartProps, WmBarChartState, WmBarChartStyles> {\n\n  constructor(props: WmBarChartProps) {\n    super(props, DEFAULT_CLASS, new WmBarChartProps(), new WmBarChartState());\n  }\n\n  labelFn(data: any): string | number | string[] | number[] | null {\n    return this.abbreviateNumber(data.datum.y);\n  }\n\n\n  onSelect = (event: CartesianChartSelectEvent): void => {\n  if (!this.viewRef.current) return;\n  if (!this.state.props.dataset) return;\n  const { dataIndex, y, seriesIndex } = event;\n  const selectedItem = this.props.dataset[dataIndex];\n  const selectedChartItem = [\n    { series: seriesIndex, x: dataIndex, y, _dataObj: selectedItem },\n    dataIndex,\n  ];\n  this.updateState({\n    selectedItem: { ...selectedItem, index: dataIndex },\n  } as WmBarChartState);\n  this.invokeEventCallback('onSelect', [null, this.proxy, selectedItem, selectedChartItem]);\n}\n\n  renderWidget(props: WmBarChartProps) {\n    this.invokeEventCallback('onBeforerender', [this.proxy, null]);\n    if (!this.state.data?.length) {\n      return null;\n    }\n\n    const chartData = this.state.data.map((series: any[], i: number) => ({\n      name: this.state.yAxis[i],\n      data: series.map((pt: { x: number; y: number }) => pt.y),\n    }));\n\n    const showLegend = props.showlegend !== 'hide';\n    const legendPosition = (['top', 'bottom', 'left', 'right'].includes(props.showlegend)\n      ? props.showlegend : 'bottom') as 'top' | 'bottom' | 'left' | 'right';\n    const minDomain = this.getMinDomain();\n\n    // ColumnChart swaps category/value axes when horizontal=true. WaveMaker x-axis props\n    // refer to categories (xaxisdatakey) and y-axis props refer to values (yaxisdatakey).\n    const isHorizontal = !!props.horizontal;\n    const series = (this.state.colors?.length ? this.state.colors : ['#000']).map((color: string) => ({\n      color,\n    }));\n    const xAxisTickLabelFormatter = isHorizontal\n      ? this.getYAxisTickLabelFormatter()\n      : this.getXAxisTickLabelFormatter();\n    const yAxisTickLabelFormatter = isHorizontal\n      ? this.getXAxisTickLabelFormatter()\n      : this.getYAxisTickLabelFormatter();\n\n    return (\n      <View\n        {...getAccessibilityProps(AccessibilityWidgetType.LINECHART, props)}\n        style={this.styles.root}\n        onLayout={this.onViewLayoutChange.bind(this)}\n      >\n        <View>\n          {(props.title || props.iconclass) ? (\n            <View testID=\"title-icon-container\" style={{ flexDirection: 'row', alignItems: 'center' }}>\n              {props.iconclass ? (<WmIcon iconclass={props.iconclass} styles={this.styles.icon} />) : null}\n              {props.title ? (<Text style={this.styles.title}>{props.title}</Text>) : null}\n            </View>\n          ) : null}\n          {props.subheading ? (\n            <Text style={this.styles.subHeading}>{props.subheading}</Text>\n          ) : null}\n        </View>\n        {this.state.chartWidth ? (\n          <View ref={this.viewRef}>\n            <ColumnChart\n              data={chartData}\n              width={this.state.chartWidth || this.screenWidth}\n              height={this.styles.root.height as number}\n              colors={this.state.colors}\n              theme={this.getChartTheme(isHorizontal, series)}\n              horizontal={props.horizontal}\n              stack={props.viewtype === 'Stacked' ? 'total' : false}\n              stackNormalize={props.stacknormalize}\n              cornerRadius={[\n                this.styles.bar.borderTopLeftRadius,\n                this.styles.bar.borderTopRightRadius,\n                this.styles.bar.borderBottomRightRadius,\n                this.styles.bar.borderBottomLeftRadius,\n              ]}\n              barOutsideLabelFormatter={props.showvalues\n                ? (value: number) => String(this.abbreviateNumber(value))\n                : undefined}\n              minY={minDomain.y}\n              maxY={this.state.chartMaxY}\n              minX={minDomain.x}\n              maxX={this.state.chartMaxX}\n              grid={{\n                top: props.offsettop,\n                bottom: props.offsetbottom,\n                left: this.isRTL ? props.offsetright : props.offsetleft,\n                right: this.isRTL ? props.offsetleft : props.offsetright,\n              }}\n              showXAxis={isHorizontal ? props.showyaxis : props.showxaxis}\n              showXAxisTicks={isHorizontal ? props.showyaxisticks : props.showxaxisticks}\n              showYAxis={isHorizontal ? props.showxaxis : props.showyaxis}\n              showYAxisTicks={isHorizontal ? props.showxaxisticks : props.showyaxisticks}\n              showXAxisSplitLines={isHorizontal ? !props.hidegridyaxis : !props.hidegridxaxis}\n              showYAxisSplitLines={isHorizontal ? !props.hidegridxaxis : !props.hidegridyaxis}\n              xAxisLabel={isHorizontal ? (this.state.yLabel || '') : (this.state.xLabel || '')}\n              yAxisLabel={isHorizontal ? (this.state.xLabel || '') : (this.state.yLabel || '')}\n              xAxisTickLabelFormatter={xAxisTickLabelFormatter}\n              yAxisTickLabelFormatter={yAxisTickLabelFormatter}\n              showLegend={showLegend}\n              legendPosition={legendPosition}\n              tooltip={props.tooltips ? (this.hasCustomTooltip ? 'none' : (props.tooltip ?? 'card')) : 'none'}\n              renderTooltip={this.getRenderTooltip()}\n              showHighlighter={props.showhighlighter}\n              onSelect={this.onSelect}\n              intervalX={isHorizontal ? props.intervaly : props.intervalx}\n              intervalY={isHorizontal ? props.intervalx : props.intervaly}\n            />\n          </View>\n        ) : null}\n      </View>\n    );\n  }\n}\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AACzC,SAASC,WAAW,QAA+D,iCAAiC;AACpH,SAASC,uBAAuB,EAAEC,qBAAqB,QAAQ,iDAAiD;AAChH,SACEC,kBAAkB,EAClBC,uBAAuB,QAClB,mEAAmE;AAC1E,OAAOC,eAAe,MAAM,mBAAmB;AAC/C,SAASC,aAAa,QAA0B,oBAAoB;AACpE,OAAOC,MAAM,MAAM,mEAAmE;AAGtF,OAAO,MAAMC,eAAe,SAASJ,uBAAuB,CAAkB;AAE9E,eAAe,MAAMK,UAAU,SAASN,kBAAkB,CAAqD;EAE7GO,WAAWA,CAACC,KAAsB,EAAE;IAClC,KAAK,CAACA,KAAK,EAAEL,aAAa,EAAE,IAAID,eAAe,CAAC,CAAC,EAAE,IAAIG,eAAe,CAAC,CAAC,CAAC;IAACI,eAAA,mBAQhEC,KAAgC,IAAW;MACvD,IAAI,CAAC,IAAI,CAACC,OAAO,CAACC,OAAO,EAAE;MAC3B,IAAI,CAAC,IAAI,CAACC,KAAK,CAACL,KAAK,CAACM,OAAO,EAAE;MAC/B,MAAM;QAAEC,SAAS;QAAEC,CAAC;QAAEC;MAAY,CAAC,GAAGP,KAAK;MAC3C,MAAMQ,YAAY,GAAG,IAAI,CAACV,KAAK,CAACM,OAAO,CAACC,SAAS,CAAC;MAClD,MAAMI,iBAAiB,GAAG,CACxB;QAAEC,MAAM,EAAEH,WAAW;QAAEI,CAAC,EAAEN,SAAS;QAAEC,CAAC;QAAEM,QAAQ,EAAEJ;MAAa,CAAC,EAChEH,SAAS,CACV;MACD,IAAI,CAACQ,WAAW,CAAC;QACfL,YAAY,EAAE;UAAE,GAAGA,YAAY;UAAEM,KAAK,EAAET;QAAU;MACpD,CAAoB,CAAC;MACrB,IAAI,CAACU,mBAAmB,CAAC,UAAU,EAAE,CAAC,IAAI,EAAE,IAAI,CAACC,KAAK,EAAER,YAAY,EAAEC,iBAAiB,CAAC,CAAC;IAC3F,CAAC;EApBC;EAEAQ,OAAOA,CAACC,IAAS,EAAgD;IAC/D,OAAO,IAAI,CAACC,gBAAgB,CAACD,IAAI,CAACE,KAAK,CAACd,CAAC,CAAC;EAC5C;EAkBAe,YAAYA,CAACvB,KAAsB,EAAE;IAAA,IAAAwB,gBAAA,EAAAC,kBAAA,EAAAC,cAAA;IACnC,IAAI,CAACT,mBAAmB,CAAC,gBAAgB,EAAE,CAAC,IAAI,CAACC,KAAK,EAAE,IAAI,CAAC,CAAC;IAC9D,IAAI,GAAAM,gBAAA,GAAC,IAAI,CAACnB,KAAK,CAACe,IAAI,cAAAI,gBAAA,eAAfA,gBAAA,CAAiBG,MAAM,GAAE;MAC5B,OAAO,IAAI;IACb;IAEA,MAAMC,SAAS,GAAG,IAAI,CAACvB,KAAK,CAACe,IAAI,CAACS,GAAG,CAAC,CAACjB,MAAa,EAAEkB,CAAS,MAAM;MACnEC,IAAI,EAAE,IAAI,CAAC1B,KAAK,CAAC2B,KAAK,CAACF,CAAC,CAAC;MACzBV,IAAI,EAAER,MAAM,CAACiB,GAAG,CAAEI,EAA4B,IAAKA,EAAE,CAACzB,CAAC;IACzD,CAAC,CAAC,CAAC;IAEH,MAAM0B,UAAU,GAAGlC,KAAK,CAACmC,UAAU,KAAK,MAAM;IAC9C,MAAMC,cAAc,GAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,CAAC,CAACC,QAAQ,CAACrC,KAAK,CAACmC,UAAU,CAAC,GACjFnC,KAAK,CAACmC,UAAU,GAAG,QAAgD;IACvE,MAAMG,SAAS,GAAG,IAAI,CAACC,YAAY,CAAC,CAAC;;IAErC;IACA;IACA,MAAMC,YAAY,GAAG,CAAC,CAACxC,KAAK,CAACyC,UAAU;IACvC,MAAM7B,MAAM,GAAG,CAAC,CAAAa,kBAAA,OAAI,CAACpB,KAAK,CAACqC,MAAM,cAAAjB,kBAAA,eAAjBA,kBAAA,CAAmBE,MAAM,GAAG,IAAI,CAACtB,KAAK,CAACqC,MAAM,GAAG,CAAC,MAAM,CAAC,EAAEb,GAAG,CAAEc,KAAa,KAAM;MAChGA;IACF,CAAC,CAAC,CAAC;IACH,MAAMC,uBAAuB,GAAGJ,YAAY,GACxC,IAAI,CAACK,0BAA0B,CAAC,CAAC,GACjC,IAAI,CAACC,0BAA0B,CAAC,CAAC;IACrC,MAAMC,uBAAuB,GAAGP,YAAY,GACxC,IAAI,CAACM,0BAA0B,CAAC,CAAC,GACjC,IAAI,CAACD,0BAA0B,CAAC,CAAC;IAErC,oBACE3D,KAAA,CAAA8D,aAAA,CAAC7D,IAAI,EAAA8D,QAAA,KACC1D,qBAAqB,CAACD,uBAAuB,CAAC4D,SAAS,EAAElD,KAAK,CAAC;MACnEmD,KAAK,EAAE,IAAI,CAACC,MAAM,CAACC,IAAK;MACxBC,QAAQ,EAAE,IAAI,CAACC,kBAAkB,CAACC,IAAI,CAAC,IAAI;IAAE,iBAE7CtE,KAAA,CAAA8D,aAAA,CAAC7D,IAAI,QACDa,KAAK,CAACyD,KAAK,IAAIzD,KAAK,CAAC0D,SAAS,gBAC9BxE,KAAA,CAAA8D,aAAA,CAAC7D,IAAI;MAACwE,MAAM,EAAC,sBAAsB;MAACR,KAAK,EAAE;QAAES,aAAa,EAAE,KAAK;QAAEC,UAAU,EAAE;MAAS;IAAE,GACvF7D,KAAK,CAAC0D,SAAS,gBAAIxE,KAAA,CAAA8D,aAAA,CAACpD,MAAM;MAAC8D,SAAS,EAAE1D,KAAK,CAAC0D,SAAU;MAACN,MAAM,EAAE,IAAI,CAACA,MAAM,CAACU;IAAK,CAAE,CAAC,GAAI,IAAI,EAC3F9D,KAAK,CAACyD,KAAK,gBAAIvE,KAAA,CAAA8D,aAAA,CAAC5D,IAAI;MAAC+D,KAAK,EAAE,IAAI,CAACC,MAAM,CAACK;IAAM,GAAEzD,KAAK,CAACyD,KAAY,CAAC,GAAI,IACpE,CAAC,GACL,IAAI,EACPzD,KAAK,CAAC+D,UAAU,gBACf7E,KAAA,CAAA8D,aAAA,CAAC5D,IAAI;MAAC+D,KAAK,EAAE,IAAI,CAACC,MAAM,CAACY;IAAW,GAAEhE,KAAK,CAAC+D,UAAiB,CAAC,GAC5D,IACA,CAAC,EACN,IAAI,CAAC1D,KAAK,CAAC4D,UAAU,gBACpB/E,KAAA,CAAA8D,aAAA,CAAC7D,IAAI;MAAC+E,GAAG,EAAE,IAAI,CAAC/D;IAAQ,gBACtBjB,KAAA,CAAA8D,aAAA,CAAC3D,WAAW;MACV+B,IAAI,EAAEQ,SAAU;MAChBuC,KAAK,EAAE,IAAI,CAAC9D,KAAK,CAAC4D,UAAU,IAAI,IAAI,CAACG,WAAY;MACjDC,MAAM,EAAE,IAAI,CAACjB,MAAM,CAACC,IAAI,CAACgB,MAAiB;MAC1C3B,MAAM,EAAE,IAAI,CAACrC,KAAK,CAACqC,MAAO;MAC1B4B,KAAK,EAAE,IAAI,CAACC,aAAa,CAAC/B,YAAY,EAAE5B,MAAM,CAAE;MAChD6B,UAAU,EAAEzC,KAAK,CAACyC,UAAW;MAC7B+B,KAAK,EAAExE,KAAK,CAACyE,QAAQ,KAAK,SAAS,GAAG,OAAO,GAAG,KAAM;MACtDC,cAAc,EAAE1E,KAAK,CAAC2E,cAAe;MACrCC,YAAY,EAAE,CACZ,IAAI,CAACxB,MAAM,CAACyB,GAAG,CAACC,mBAAmB,EACnC,IAAI,CAAC1B,MAAM,CAACyB,GAAG,CAACE,oBAAoB,EACpC,IAAI,CAAC3B,MAAM,CAACyB,GAAG,CAACG,uBAAuB,EACvC,IAAI,CAAC5B,MAAM,CAACyB,GAAG,CAACI,sBAAsB,CACtC;MACFC,wBAAwB,EAAElF,KAAK,CAACmF,UAAU,GACrCC,KAAa,IAAKC,MAAM,CAAC,IAAI,CAAChE,gBAAgB,CAAC+D,KAAK,CAAC,CAAC,GACvDE,SAAU;MACdC,IAAI,EAAEjD,SAAS,CAAC9B,CAAE;MAClBgF,IAAI,EAAE,IAAI,CAACnF,KAAK,CAACoF,SAAU;MAC3BC,IAAI,EAAEpD,SAAS,CAACzB,CAAE;MAClB8E,IAAI,EAAE,IAAI,CAACtF,KAAK,CAACuF,SAAU;MAC3BC,IAAI,EAAE;QACJC,GAAG,EAAE9F,KAAK,CAAC+F,SAAS;QACpBC,MAAM,EAAEhG,KAAK,CAACiG,YAAY;QAC1BC,IAAI,EAAE,IAAI,CAACC,KAAK,GAAGnG,KAAK,CAACoG,WAAW,GAAGpG,KAAK,CAACqG,UAAU;QACvDC,KAAK,EAAE,IAAI,CAACH,KAAK,GAAGnG,KAAK,CAACqG,UAAU,GAAGrG,KAAK,CAACoG;MAC/C,CAAE;MACFG,SAAS,EAAE/D,YAAY,GAAGxC,KAAK,CAACwG,SAAS,GAAGxG,KAAK,CAACyG,SAAU;MAC5DC,cAAc,EAAElE,YAAY,GAAGxC,KAAK,CAAC2G,cAAc,GAAG3G,KAAK,CAAC4G,cAAe;MAC3EC,SAAS,EAAErE,YAAY,GAAGxC,KAAK,CAACyG,SAAS,GAAGzG,KAAK,CAACwG,SAAU;MAC5DM,cAAc,EAAEtE,YAAY,GAAGxC,KAAK,CAAC4G,cAAc,GAAG5G,KAAK,CAAC2G,cAAe;MAC3EI,mBAAmB,EAAEvE,YAAY,GAAG,CAACxC,KAAK,CAACgH,aAAa,GAAG,CAAChH,KAAK,CAACiH,aAAc;MAChFC,mBAAmB,EAAE1E,YAAY,GAAG,CAACxC,KAAK,CAACiH,aAAa,GAAG,CAACjH,KAAK,CAACgH,aAAc;MAChFG,UAAU,EAAE3E,YAAY,GAAI,IAAI,CAACnC,KAAK,CAAC+G,MAAM,IAAI,EAAE,GAAK,IAAI,CAAC/G,KAAK,CAACgH,MAAM,IAAI,EAAI;MACjFC,UAAU,EAAE9E,YAAY,GAAI,IAAI,CAACnC,KAAK,CAACgH,MAAM,IAAI,EAAE,GAAK,IAAI,CAAChH,KAAK,CAAC+G,MAAM,IAAI,EAAI;MACjFxE,uBAAuB,EAAEA,uBAAwB;MACjDG,uBAAuB,EAAEA,uBAAwB;MACjDb,UAAU,EAAEA,UAAW;MACvBE,cAAc,EAAEA,cAAe;MAC/BmF,OAAO,EAAEvH,KAAK,CAACwH,QAAQ,GAAI,IAAI,CAACC,gBAAgB,GAAG,MAAM,IAAA/F,cAAA,GAAI1B,KAAK,CAACuH,OAAO,cAAA7F,cAAA,cAAAA,cAAA,GAAI,MAAO,GAAI,MAAO;MAChGgG,aAAa,EAAE,IAAI,CAACC,gBAAgB,CAAC,CAAE;MACvCC,eAAe,EAAE5H,KAAK,CAAC6H,eAAgB;MACvCC,QAAQ,EAAE,IAAI,CAACA,QAAS;MACxBC,SAAS,EAAEvF,YAAY,GAAGxC,KAAK,CAACgI,SAAS,GAAGhI,KAAK,CAACiI,SAAU;MAC5DC,SAAS,EAAE1F,YAAY,GAAGxC,KAAK,CAACiI,SAAS,GAAGjI,KAAK,CAACgI;IAAU,CAC7D,CACG,CAAC,GACL,IACA,CAAC;EAEX;AACF","ignoreList":[]}

package/components/chart/basechart.component.js

@@ -5,7 +5,7 @@ import React from "react";
 import { Dimensions, View, Text } from 'react-native';
 import moment from "moment";
 import { forEach, get, isArray, isEmpty, isObject, maxBy, minBy, set, orderBy } from "lodash-es";
-import { VictoryAxis, VictoryLegend, VictoryLabel } from "victory-native";
+import { VictoryLegend } from "victory-native";
 import { BaseComponent, BaseComponentState } from '@wavemaker-ai/app-rn-runtime/core/base.component';
 import WmIcon from "@wavemaker-ai/app-rn-runtime/components/basic/icon/icon.component";
 import ThemeFactory from "@wavemaker-ai/app-rn-runtime/components/chart/theme/chart.theme";
@@ -161,101 +161,94 @@ export class BaseChartComponent extends BaseComponent {
         return yVal.toLocaleString();
     }
   }
-
-  // x axis with vertical lines having grid stroke colors
-  getXaxis() {
-    const minIndex = 0;
-    const maxIndex = this.state.xaxisDatakeyArr.length - 1;
-    const props = this.state.props;
-    const getTickValueLabel = props.xtickexpr;
-    let height = this.styles.root.height || 250;
-    let yaxislabeldistance = props.yaxislabeldistance ? props.yaxislabeldistance : height - 20;
-    if (height && typeof height === 'string') {
-      height = parseInt(height);
-    }
-    return /*#__PURE__*/React.createElement(VictoryAxis, {
-      crossAxis: false,
-      label: (props.xaxislabel || props.xaxisdatakey || "name") + (props.xunits ? `(${props.xunits})` : ''),
-      style: {
-        axisLabel: this.theme.mergeStyle(this.styles.axisLabel, this.styles.yAxisLabel),
-        grid: props.hidegridxaxis ? {
-          stroke: null
-        } : this.theme.mergeStyle(this.styles.grid, this.styles.xGrid),
-        axis: props.showxaxis === false ? {
-          stroke: 'none'
-        } : this.theme.mergeStyle(this.styles.axis, this.styles.xAxis),
-        ticks: this.theme.mergeStyle(this.styles.ticks, this.styles.xTicks),
-        tickLabels: props.showxaxislabels === false ? {
-          fill: 'none'
-        } : this.theme.mergeStyle(this.styles.tickLabels, this.styles.xTickLabels)
-      },
-      fixLabelOverlap: props.autoadjustlabels ? true : false,
-      axisLabelComponent: /*#__PURE__*/React.createElement(VictoryLabel, {
-        y: yaxislabeldistance
-      }),
-      tickLabelComponent: /*#__PURE__*/React.createElement(VictoryLabel, {
-        y: props.offsetyaxis ? props.offsetyaxis : height - 30,
-        angle: props.labelangle || 0
-      }),
-      theme: this.state.theme,
-      tickCount: this.state.xaxisDatakeyArr.length,
-      invertAxis: this.isRTL,
-      tickFormat: (d, i, ticks) => {
-        if (getTickValueLabel) {
-          return getTickValueLabel(this.state.xaxisDatakeyArr[d], i, (ticks || []).length);
-        } else if (this.state.xaxisDatakeyArr) {
-          return this.state.xaxisDatakeyArr[d];
-        }
+  getXAxisTickLabelFormatter() {
+    return (val, idx) => {
+      const i = idx !== null && idx !== void 0 ? idx : Number(val);
+      if (i < 0 || i >= this.state.xaxisDatakeyArr.length) {
         return '';
       }
-    });
+      const label = this.state.xaxisDatakeyArr[i];
+      if (this.state.props.xtickexpr) {
+        return String(this.state.props.xtickexpr(label, i, this.state.xaxisDatakeyArr.length));
+      }
+      return String(label !== null && label !== void 0 ? label : val);
+    };
   }
-
-  /* y axis with horizontal lines having grid stroke colors*/
-  getYAxis() {
-    const props = this.state.props;
-    if (props.showyaxis === false) {
-      return null;
-    }
-    const getTickValueLabel = props.ytickexpr;
-    const ynumberformat = props.ynumberformat;
-    let xaxislabeldistance = props.xaxislabeldistance ? props.xaxislabeldistance : 20;
-    return /*#__PURE__*/React.createElement(VictoryAxis, {
-      crossAxis: false,
-      label: (props.yaxislabel || props.yaxisdatakey) + (props.yunits ? `(${props.yunits})` : ''),
-      style: {
-        axisLabel: this.theme.mergeStyle(this.styles.axisLabel, this.styles.yAxisLabel),
-        grid: props.hidegridyaxis ? {
-          stroke: null
-        } : this.theme.mergeStyle(this.styles.grid, this.styles.yGrid),
-        axis: props.showxaxis === false ? {
-          stroke: 'none'
-        } : this.theme.mergeStyle(this.styles.axis, this.styles.yAxis),
-        ticks: this.theme.mergeStyle(this.styles.ticks, this.styles.yTicks),
-        tickLabels: props.showyaxislabels === false ? {
-          fill: 'none'
-        } : this.theme.mergeStyle(this.styles.tickLabels, this.styles.yTickLabels)
+  getYAxisTickLabelFormatter() {
+    return (val, idx) => {
+      const props = this.state.props;
+      if (props.ytickexpr) {
+        return String(props.ytickexpr(val, idx !== null && idx !== void 0 ? idx : 0, this.state.xaxisDatakeyArr.length));
+      }
+      if (props.ynumberformat) {
+        return String(this.setYAxisFormat(val, props.ynumberformat));
+      }
+      return String(this.abbreviateNumber(val));
+    };
+  }
+  getAxisTheme(axis) {
+    var _axisStyle$stroke, _s$axis, _axisStyle$strokeWidt, _s$axis2, _axisLabelStyle$fill, _s$axisLabel, _tickStyle$stroke, _s$ticks, _tickStyle$strokeWidt, _s$ticks2, _tickLabelStyle$fill, _s$tickLabels, _gridStyle$stroke, _s$grid, _gridStyle$strokeWidt, _s$grid2;
+    const s = this.styles;
+    const axisStyle = axis === 'x' ? s.xAxis : s.yAxis;
+    const axisLabelStyle = axis === 'x' ? s.xAxisLabel : s.yAxisLabel;
+    const tickStyle = axis === 'x' ? s.xTicks : s.yTicks;
+    const tickLabelStyle = axis === 'x' ? s.xTickLabels : s.yTickLabels;
+    const gridStyle = axis === 'x' ? s.xGrid : s.yGrid;
+    return {
+      lineColor: (_axisStyle$stroke = axisStyle === null || axisStyle === void 0 ? void 0 : axisStyle.stroke) !== null && _axisStyle$stroke !== void 0 ? _axisStyle$stroke : (_s$axis = s.axis) === null || _s$axis === void 0 ? void 0 : _s$axis.stroke,
+      lineWidth: (_axisStyle$strokeWidt = axisStyle === null || axisStyle === void 0 ? void 0 : axisStyle.strokeWidth) !== null && _axisStyle$strokeWidt !== void 0 ? _axisStyle$strokeWidt : (_s$axis2 = s.axis) === null || _s$axis2 === void 0 ? void 0 : _s$axis2.strokeWidth,
+      labelColor: (_axisLabelStyle$fill = axisLabelStyle === null || axisLabelStyle === void 0 ? void 0 : axisLabelStyle.fill) !== null && _axisLabelStyle$fill !== void 0 ? _axisLabelStyle$fill : (_s$axisLabel = s.axisLabel) === null || _s$axisLabel === void 0 ? void 0 : _s$axisLabel.fill,
+      tickColor: (_tickStyle$stroke = tickStyle === null || tickStyle === void 0 ? void 0 : tickStyle.stroke) !== null && _tickStyle$stroke !== void 0 ? _tickStyle$stroke : (_s$ticks = s.ticks) === null || _s$ticks === void 0 ? void 0 : _s$ticks.stroke,
+      tickWidth: (_tickStyle$strokeWidt = tickStyle === null || tickStyle === void 0 ? void 0 : tickStyle.strokeWidth) !== null && _tickStyle$strokeWidt !== void 0 ? _tickStyle$strokeWidt : (_s$ticks2 = s.ticks) === null || _s$ticks2 === void 0 ? void 0 : _s$ticks2.strokeWidth,
+      tickLabelColor: (_tickLabelStyle$fill = tickLabelStyle === null || tickLabelStyle === void 0 ? void 0 : tickLabelStyle.fill) !== null && _tickLabelStyle$fill !== void 0 ? _tickLabelStyle$fill : (_s$tickLabels = s.tickLabels) === null || _s$tickLabels === void 0 ? void 0 : _s$tickLabels.fill,
+      splitLineColor: (_gridStyle$stroke = gridStyle === null || gridStyle === void 0 ? void 0 : gridStyle.stroke) !== null && _gridStyle$stroke !== void 0 ? _gridStyle$stroke : (_s$grid = s.grid) === null || _s$grid === void 0 ? void 0 : _s$grid.stroke,
+      splitLineWidth: (_gridStyle$strokeWidt = gridStyle === null || gridStyle === void 0 ? void 0 : gridStyle.strokeWidth) !== null && _gridStyle$strokeWidt !== void 0 ? _gridStyle$strokeWidt : (_s$grid2 = s.grid) === null || _s$grid2 === void 0 ? void 0 : _s$grid2.strokeWidth
+    };
+  }
+  getGridLineTheme(axis) {
+    var _gridStyle$stroke2, _s$grid3, _gridStyle$strokeWidt2, _s$grid4;
+    const s = this.styles;
+    const gridStyle = axis === 'x' ? s.xGrid : s.yGrid;
+    return {
+      lineColor: (_gridStyle$stroke2 = gridStyle === null || gridStyle === void 0 ? void 0 : gridStyle.stroke) !== null && _gridStyle$stroke2 !== void 0 ? _gridStyle$stroke2 : (_s$grid3 = s.grid) === null || _s$grid3 === void 0 ? void 0 : _s$grid3.stroke,
+      lineWidth: (_gridStyle$strokeWidt2 = gridStyle === null || gridStyle === void 0 ? void 0 : gridStyle.strokeWidth) !== null && _gridStyle$strokeWidt2 !== void 0 ? _gridStyle$strokeWidt2 : (_s$grid4 = s.grid) === null || _s$grid4 === void 0 ? void 0 : _s$grid4.strokeWidth
+    };
+  }
+  getTooltipTheme() {
+    const container = this.styles.tooltipContainer || {};
+    const xText = this.styles.tooltipXText || {};
+    const yText = this.styles.tooltipYText || {};
+    return {
+      backgroundColor: container.backgroundColor,
+      labelColor: xText.fill,
+      valueColor: yText.fill,
+      borderColor: container.borderColor,
+      borderWidth: container.borderWidth,
+      borderRadius: container.borderRadius,
+      padding: container.padding
+    };
+  }
+  getChartTheme(swapAxes = false, series) {
+    var _this$styles$legendTe, _this$styles$legendTe2, _this$styles$legenedD;
+    return {
+      axis: {
+        x: swapAxes ? this.getAxisTheme('y') : this.getAxisTheme('x'),
+        y: swapAxes ? this.getAxisTheme('x') : this.getAxisTheme('y')
       },
-      fixLabelOverlap: props.autoadjustlabels ? true : false,
-      axisLabelComponent: /*#__PURE__*/React.createElement(VictoryLabel, {
-        x: this.isRTL ? screenWidth - xaxislabeldistance - 30 : xaxislabeldistance
-      }),
-      tickLabelComponent: /*#__PURE__*/React.createElement(VictoryLabel, {
-        x: this.isRTL ? props.offsetxaxis ? screenWidth - props.offsetxaxis - 30 : screenWidth - 80 : props.offsetxaxis || 50
-      }),
-      theme: this.state.theme,
-      tickFormat: (d, i, ticks) => {
-        if (getTickValueLabel) {
-          return getTickValueLabel(d, i, (ticks || []).length);
-        }
-        if (ynumberformat) {
-          return this.setYAxisFormat(d, ynumberformat);
-        }
-        return this.abbreviateNumber(d);
+      grid: {
+        x: swapAxes ? this.getGridLineTheme('y') : this.getGridLineTheme('x'),
+        y: swapAxes ? this.getGridLineTheme('x') : this.getGridLineTheme('y')
       },
-      orientation: this.isRTL ? "right" : "left",
-      dependentAxis: true
-    });
+      legend: {
+        textColor: (_this$styles$legendTe = this.styles.legendText) === null || _this$styles$legendTe === void 0 ? void 0 : _this$styles$legendTe.fill,
+        fontSize: (_this$styles$legendTe2 = this.styles.legendText) === null || _this$styles$legendTe2 === void 0 ? void 0 : _this$styles$legendTe2.fontSize,
+        backgroundColor: (_this$styles$legenedD = this.styles.legenedDot) === null || _this$styles$legenedD === void 0 ? void 0 : _this$styles$legenedD.backgroundColor
+      },
+      tooltip: this.getTooltipTheme(),
+      ...(series ? {
+        series
+      } : {})
+    };
   }
   setTooltipTemplate(partialName) {
     this.updateState({
@@ -312,10 +305,38 @@ export class BaseChartComponent extends BaseComponent {
       style: this.styles.tooltipXText
     }, yAxisData), this.renderPointer()) : null;
   }
+  get hasCustomTooltip() {
+    return !!this.state.template && !!this.props.renderitempartial;
+  }
+  getRenderTooltip() {
+    if (!this.hasCustomTooltip) return undefined;
+    return params => {
+      var _this$props$renderite, _this$props$renderite2, _this$props;
+      const selectedItem = this.props.dataset[params.dataIndex];
+      return (_this$props$renderite = (_this$props$renderite2 = (_this$props = this.props).renderitempartial) === null || _this$props$renderite2 === void 0 ? void 0 : _this$props$renderite2.call(_this$props, {
+        ...selectedItem,
+        index: params.dataIndex
+      }, params.dataIndex, this.state.template)) !== null && _this$props$renderite !== void 0 ? _this$props$renderite : null;
+    };
+  }
 
   // X/Y Domain properties are supported only for Column and Area charts
   isAxisDomainSupported(type) {
-    return type === 'Column' || type === 'Area';
+    // return type === 'Column'|| type === 'Area';
+    return type === 'Area';
+  }
+  getMinDomain() {
+    const props = this.state.props;
+    return {
+      x: props.xdomain === 'Min' ? this.state.chartMinX : 0,
+      y: props.ydomain === 'Min' ? this.state.chartMinY : 0
+    };
+  }
+  getSeriesSymbol(highlightpoints, ticksymbol) {
+    if (!highlightpoints || ticksymbol === 'none') {
+      return 'none';
+    }
+    return ticksymbol !== null && ticksymbol !== void 0 ? ticksymbol : 'circle';
   }
 
   // Check whether X/Y Domain was set to Min and is supported for the present chart
@@ -662,16 +683,16 @@ export class BaseChartComponent extends BaseComponent {
         $new && this.prepareDataItems($new);
         break;
       case 'xaxislabel':
-        if (props.xunits) {
-          units = ' (' + props.xunits + ')';
+        if (this.props.xunits) {
+          units = ' (' + this.props.xunits + ')';
         }
         this.updateState({
           xLabel: $new + units
         });
         break;
       case 'yaxislabel':
-        if (props.yunits) {
-          units = ' (' + props.yunits + ')';
+        if (this.props.yunits) {
+          units = ' (' + this.props.yunits + ')';
         }
         this.updateState({
           yLabel: $new + units