@wavemaker/app-rn-runtime 11.5.2-rc.5416 → 11.5.2-rc.5461

app-rn-runtime/components/chart/basechart.styles.js

@@ -50,7 +50,19 @@ BASE_THEME.registerStyle((themeVariables, addStyle) => {
     },
     xTickLabels: {},
     yTickLabels: {},
-    barChart: {}
+    barChart: {},
+    tooltipContainer: {
+      backgroundColor: themeVariables.tooltipBgColor,
+      borderColor: themeVariables.tooltipBorderColor,
+      borderWidth: 1,
+      paddingTop: 10,
+      paddingBottom: 10,
+      paddingLeft: 6,
+      paddingRight: 6,
+      borderRadius: 5
+    },
+    tooltipXText: {},
+    tooltipYText: {}
   });
   addStyle(DEFAULT_CLASS, '', defaultStyles);
 });

app-rn-runtime/components/chart/basechart.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["Color","BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","text","icon","fontSize","line","color","chartLineColor","title","chartTitleColor","lineHeight","subHeading","chartSubTitleColor","legendText","legenedDot","axis","stroke","chartAxisColor","fade","rgb","toString","xAxis","yAxis","axisLabel","xAxisLabel","yAxisLabel","grid","strokeDasharray","xGrid","yGrid","ticks","xTicks","yTicks","tickLabels","xTickLabels","yTickLabels","barChart"],"sources":["basechart.styles.ts"],"sourcesContent":["import { TextStyle, ViewStyle } from 'react-native';\nimport Color  from \"color\";\nimport BASE_THEME from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { VictoryStyleObject } from \"victory-core\";\nimport { WmIconStyles } from '@wavemaker/app-rn-runtime/components/basic/icon/icon.styles';\n\n\nexport type BaseChartComponentStyles = BaseStyles & {\n  title: TextStyle,\n  icon: WmIconStyles,\n  subHeading: TextStyle,\n  axis: VictoryStyleObject,\n  xAxis: VictoryStyleObject,\n  yAxis: VictoryStyleObject,\n  axisLabel: VictoryStyleObject,\n  xAxisLabel: VictoryStyleObject,\n  yAxisLabel: VictoryStyleObject,\n  ticks: VictoryStyleObject,\n  xTicks: VictoryStyleObject,\n  yTicks: VictoryStyleObject,\n  tickLabels: VictoryStyleObject,\n  xTickLabels: VictoryStyleObject,\n  yTickLabels: VictoryStyleObject,\n  grid: VictoryStyleObject,\n  xGrid: VictoryStyleObject,\n  yGrid: VictoryStyleObject,\n  legendText: TextStyle,\n  legenedDot: ViewStyle \n};\n\nexport const DEFAULT_CLASS = 'app-chart';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n  const defaultStyles: BaseChartComponentStyles = defineStyles({\n    root: {},\n    text: {},\n    icon: {\n      icon: {\n        fontSize: 20\n      }\n    } as WmIconStyles,\n    line: {\n      color: themeVariables.chartLineColor\n    },\n    title: {\n      color: themeVariables.chartTitleColor,\n      fontSize: 20,\n      lineHeight: 24,\n    },\n    subHeading: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: themeVariables.chartSubTitleColor\n    },\n    legendText: {},\n    legenedDot: {},\n    axis: {\n      stroke: Color(themeVariables.chartAxisColor).fade(0.3).rgb().toString()\n    } as any,\n    xAxis: {} as any,\n    yAxis: {} as any,\n    axisLabel: {} as any,\n    xAxisLabel: {} as any,\n    yAxisLabel: {} as any,\n    grid: {\n      stroke: Color(themeVariables.chartAxisColor).fade(0.8).rgb().toString(),\n      strokeDasharray: '16 4'\n    } as any,\n    xGrid: {} as any,\n    yGrid: {} as any,\n    ticks: {\n      stroke: Color(themeVariables.chartAxisColor).fade(0.8).rgb().toString(),\n    } as any,\n    xTicks: {} as any,\n    yTicks: {} as any,\n    tickLabels: {\n      stroke: Color(themeVariables.chartAxisColor).fade(0.8).rgb().toString(),\n    } as any,\n    xTickLabels: {} as any,\n    yTickLabels: {} as any,\n    barChart: {}\n  });\n\n  addStyle(DEFAULT_CLASS, '', defaultStyles);\n});\n"],"mappings":"AACA,OAAOA,KAAK,MAAO,OAAO;AAC1B,OAAOC,UAAU,MAAM,wCAAwC;AAC/D,SAAqBC,YAAY,QAAQ,+CAA+C;AA4BxF,OAAO,MAAMC,aAAa,GAAG,WAAW;AACxCF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACrD,MAAMC,aAAuC,GAAGL,YAAY,CAAC;IAC3DM,IAAI,EAAE,CAAC,CAAC;IACRC,IAAI,EAAE,CAAC,CAAC;IACRC,IAAI,EAAE;MACJA,IAAI,EAAE;QACJC,QAAQ,EAAE;MACZ;IACF,CAAiB;IACjBC,IAAI,EAAE;MACJC,KAAK,EAAER,cAAc,CAACS;IACxB,CAAC;IACDC,KAAK,EAAE;MACLF,KAAK,EAAER,cAAc,CAACW,eAAe;MACrCL,QAAQ,EAAE,EAAE;MACZM,UAAU,EAAE;IACd,CAAC;IACDC,UAAU,EAAE;MACVP,QAAQ,EAAE,EAAE;MACZM,UAAU,EAAE,EAAE;MACdJ,KAAK,EAAER,cAAc,CAACc;IACxB,CAAC;IACDC,UAAU,EAAE,CAAC,CAAC;IACdC,UAAU,EAAE,CAAC,CAAC;IACdC,IAAI,EAAE;MACJC,MAAM,EAAEvB,KAAK,CAACK,cAAc,CAACmB,cAAc,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC,CAACC,QAAQ,CAAC;IACxE,CAAQ;IACRC,KAAK,EAAE,CAAC,CAAQ;IAChBC,KAAK,EAAE,CAAC,CAAQ;IAChBC,SAAS,EAAE,CAAC,CAAQ;IACpBC,UAAU,EAAE,CAAC,CAAQ;IACrBC,UAAU,EAAE,CAAC,CAAQ;IACrBC,IAAI,EAAE;MACJV,MAAM,EAAEvB,KAAK,CAACK,cAAc,CAACmB,cAAc,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC,CAACC,QAAQ,CAAC,CAAC;MACvEO,eAAe,EAAE;IACnB,CAAQ;IACRC,KAAK,EAAE,CAAC,CAAQ;IAChBC,KAAK,EAAE,CAAC,CAAQ;IAChBC,KAAK,EAAE;MACLd,MAAM,EAAEvB,KAAK,CAACK,cAAc,CAACmB,cAAc,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC,CAACC,QAAQ,CAAC;IACxE,CAAQ;IACRW,MAAM,EAAE,CAAC,CAAQ;IACjBC,MAAM,EAAE,CAAC,CAAQ;IACjBC,UAAU,EAAE;MACVjB,MAAM,EAAEvB,KAAK,CAACK,cAAc,CAACmB,cAAc,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC,CAACC,QAAQ,CAAC;IACxE,CAAQ;IACRc,WAAW,EAAE,CAAC,CAAQ;IACtBC,WAAW,EAAE,CAAC,CAAQ;IACtBC,QAAQ,EAAE,CAAC;EACb,CAAC,CAAC;EAEFrC,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;AAC5C,CAAC,CAAC"}
+{"version":3,"names":["Color","BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","text","icon","fontSize","line","color","chartLineColor","title","chartTitleColor","lineHeight","subHeading","chartSubTitleColor","legendText","legenedDot","axis","stroke","chartAxisColor","fade","rgb","toString","xAxis","yAxis","axisLabel","xAxisLabel","yAxisLabel","grid","strokeDasharray","xGrid","yGrid","ticks","xTicks","yTicks","tickLabels","xTickLabels","yTickLabels","barChart","tooltipContainer","backgroundColor","tooltipBgColor","borderColor","tooltipBorderColor","borderWidth","paddingTop","paddingBottom","paddingLeft","paddingRight","borderRadius","tooltipXText","tooltipYText"],"sources":["basechart.styles.ts"],"sourcesContent":["import { TextStyle, ViewStyle } from 'react-native';\nimport Color  from \"color\";\nimport BASE_THEME from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { VictoryStyleObject } from \"victory-core\";\nimport { WmIconStyles } from '@wavemaker/app-rn-runtime/components/basic/icon/icon.styles';\n\n\nexport type BaseChartComponentStyles = BaseStyles & {\n  title: TextStyle,\n  icon: WmIconStyles,\n  subHeading: TextStyle,\n  axis: VictoryStyleObject,\n  xAxis: VictoryStyleObject,\n  yAxis: VictoryStyleObject,\n  axisLabel: VictoryStyleObject,\n  xAxisLabel: VictoryStyleObject,\n  yAxisLabel: VictoryStyleObject,\n  ticks: VictoryStyleObject,\n  xTicks: VictoryStyleObject,\n  yTicks: VictoryStyleObject,\n  tickLabels: VictoryStyleObject,\n  xTickLabels: VictoryStyleObject,\n  yTickLabels: VictoryStyleObject,\n  grid: VictoryStyleObject,\n  xGrid: VictoryStyleObject,\n  yGrid: VictoryStyleObject,\n  legendText: TextStyle,\n  legenedDot: ViewStyle,\n  tooltipContainer: any,\n  tooltipXText: any,\n  tooltipYText: any,\n};\n\nexport const DEFAULT_CLASS = 'app-chart';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n  const defaultStyles: BaseChartComponentStyles = defineStyles({\n    root: {},\n    text: {},\n    icon: {\n      icon: {\n        fontSize: 20\n      }\n    } as WmIconStyles,\n    line: {\n      color: themeVariables.chartLineColor\n    },\n    title: {\n      color: themeVariables.chartTitleColor,\n      fontSize: 20,\n      lineHeight: 24,\n    },\n    subHeading: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: themeVariables.chartSubTitleColor\n    },\n    legendText: {},\n    legenedDot: {},\n    axis: {\n      stroke: Color(themeVariables.chartAxisColor).fade(0.3).rgb().toString()\n    } as any,\n    xAxis: {} as any,\n    yAxis: {} as any,\n    axisLabel: {} as any,\n    xAxisLabel: {} as any,\n    yAxisLabel: {} as any,\n    grid: {\n      stroke: Color(themeVariables.chartAxisColor).fade(0.8).rgb().toString(),\n      strokeDasharray: '16 4'\n    } as any,\n    xGrid: {} as any,\n    yGrid: {} as any,\n    ticks: {\n      stroke: Color(themeVariables.chartAxisColor).fade(0.8).rgb().toString(),\n    } as any,\n    xTicks: {} as any,\n    yTicks: {} as any,\n    tickLabels: {\n      stroke: Color(themeVariables.chartAxisColor).fade(0.8).rgb().toString(),\n    } as any,\n    xTickLabels: {} as any,\n    yTickLabels: {} as any,\n    barChart: {},\n    tooltipContainer:{\n      backgroundColor: themeVariables.tooltipBgColor,\n      borderColor: themeVariables.tooltipBorderColor,\n      borderWidth: 1,\n      paddingTop: 10,\n      paddingBottom: 10,\n      paddingLeft: 6,\n      paddingRight: 6,\n      borderRadius: 5,\n    },\n    tooltipXText:{},\n    tooltipYText:{}\n  });\n\n  addStyle(DEFAULT_CLASS, '', defaultStyles);\n});\n"],"mappings":"AACA,OAAOA,KAAK,MAAO,OAAO;AAC1B,OAAOC,UAAU,MAAM,wCAAwC;AAC/D,SAAqBC,YAAY,QAAQ,+CAA+C;AA+BxF,OAAO,MAAMC,aAAa,GAAG,WAAW;AACxCF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACrD,MAAMC,aAAuC,GAAGL,YAAY,CAAC;IAC3DM,IAAI,EAAE,CAAC,CAAC;IACRC,IAAI,EAAE,CAAC,CAAC;IACRC,IAAI,EAAE;MACJA,IAAI,EAAE;QACJC,QAAQ,EAAE;MACZ;IACF,CAAiB;IACjBC,IAAI,EAAE;MACJC,KAAK,EAAER,cAAc,CAACS;IACxB,CAAC;IACDC,KAAK,EAAE;MACLF,KAAK,EAAER,cAAc,CAACW,eAAe;MACrCL,QAAQ,EAAE,EAAE;MACZM,UAAU,EAAE;IACd,CAAC;IACDC,UAAU,EAAE;MACVP,QAAQ,EAAE,EAAE;MACZM,UAAU,EAAE,EAAE;MACdJ,KAAK,EAAER,cAAc,CAACc;IACxB,CAAC;IACDC,UAAU,EAAE,CAAC,CAAC;IACdC,UAAU,EAAE,CAAC,CAAC;IACdC,IAAI,EAAE;MACJC,MAAM,EAAEvB,KAAK,CAACK,cAAc,CAACmB,cAAc,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC,CAACC,QAAQ,CAAC;IACxE,CAAQ;IACRC,KAAK,EAAE,CAAC,CAAQ;IAChBC,KAAK,EAAE,CAAC,CAAQ;IAChBC,SAAS,EAAE,CAAC,CAAQ;IACpBC,UAAU,EAAE,CAAC,CAAQ;IACrBC,UAAU,EAAE,CAAC,CAAQ;IACrBC,IAAI,EAAE;MACJV,MAAM,EAAEvB,KAAK,CAACK,cAAc,CAACmB,cAAc,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC,CAACC,QAAQ,CAAC,CAAC;MACvEO,eAAe,EAAE;IACnB,CAAQ;IACRC,KAAK,EAAE,CAAC,CAAQ;IAChBC,KAAK,EAAE,CAAC,CAAQ;IAChBC,KAAK,EAAE;MACLd,MAAM,EAAEvB,KAAK,CAACK,cAAc,CAACmB,cAAc,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC,CAACC,QAAQ,CAAC;IACxE,CAAQ;IACRW,MAAM,EAAE,CAAC,CAAQ;IACjBC,MAAM,EAAE,CAAC,CAAQ;IACjBC,UAAU,EAAE;MACVjB,MAAM,EAAEvB,KAAK,CAACK,cAAc,CAACmB,cAAc,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC,CAACC,QAAQ,CAAC;IACxE,CAAQ;IACRc,WAAW,EAAE,CAAC,CAAQ;IACtBC,WAAW,EAAE,CAAC,CAAQ;IACtBC,QAAQ,EAAE,CAAC,CAAC;IACZC,gBAAgB,EAAC;MACfC,eAAe,EAAExC,cAAc,CAACyC,cAAc;MAC9CC,WAAW,EAAE1C,cAAc,CAAC2C,kBAAkB;MAC9CC,WAAW,EAAE,CAAC;MACdC,UAAU,EAAE,EAAE;MACdC,aAAa,EAAE,EAAE;MACjBC,WAAW,EAAE,CAAC;MACdC,YAAY,EAAE,CAAC;MACfC,YAAY,EAAE;IAChB,CAAC;IACDC,YAAY,EAAC,CAAC,CAAC;IACfC,YAAY,EAAC,CAAC;EAChB,CAAC,CAAC;EAEFlD,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;AAC5C,CAAC,CAAC"}

app-rn-runtime/components/chart/bubble-chart/bubble-chart.component.js

@@ -39,7 +39,8 @@ export default class WmBubbleChart extends BaseChartComponent {
         bottom: props.offsetbottom,
         left: props.offsetleft,
         right: props.offsetright
-      }
+      },
+      containerComponent: this.getTooltip(props)
     }, /*#__PURE__*/React.createElement(VictoryLegend, {
       name: 'legend',
       containerComponent: /*#__PURE__*/React.createElement(Svg, null),

app-rn-runtime/components/chart/bubble-chart/bubble-chart.component.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","View","Platform","WmBubbleChartProps","DEFAULT_CLASS","BaseChartComponent","BaseChartComponentState","VictoryChart","VictoryLegend","VictoryScatter","Svg","WmBubbleChartState","WmBubbleChart","constructor","props","onSelect","event","data","value","index","y","label","state","xaxisDatakeyArr","datum","x","selectedItem","dataset","selectedChartItem","series","_dataObj","invokeEventCallback","nativeEvent","proxy","renderWidget","_this$state$data","length","createElement","style","styles","root","theme","height","width","screenWidth","padding","top","offsettop","bottom","offsetbottom","left","offsetleft","right","offsetright","name","containerComponent","title","subheading","orientation","gutter","getLegendView","getXaxis","getYAxis","map","d","i","colorScale","colors","fill","opacity","_ref","key","size","events","target","eventHandlers","OS","onClick","bind","onPress"],"sources":["bubble-chart.component.tsx"],"sourcesContent":["import React from 'react';\nimport {Text, View, Platform} from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmBubbleChartProps from './bubble-chart.props';\nimport { DEFAULT_CLASS, WmBubbleChartStyles } from './bubble-chart.styles';\nimport {\n  BaseChartComponent,\n  BaseChartComponentState\n} from \"@wavemaker/app-rn-runtime/components/chart/basechart.component\";\nimport {VictoryAxis, VictoryChart, VictoryLegend, VictoryLine, VictoryScatter} from \"victory-native\";\nimport { ScatterSymbolType } from \"victory-core\";\nimport {Svg} from \"react-native-svg\";\nimport {get} from \"lodash-es\";\n\nexport class WmBubbleChartState extends BaseChartComponentState<WmBubbleChartProps> {}\n\nexport default class WmBubbleChart extends BaseChartComponent<WmBubbleChartProps, WmBubbleChartState, WmBubbleChartStyles> {\n\n  constructor(props: WmBubbleChartProps) {\n    super(props, DEFAULT_CLASS, new WmBubbleChartProps(), new WmBubbleChartState());\n  }\n\n  onSelect(event: any, data: any){\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    let selectedChartItem = [{series: 0, x: data.index, y: value,_dataObj: selectedItem},data.index];\n    this.invokeEventCallback('onSelect', [event.nativeEvent, this.proxy, selectedItem, selectedChartItem ]);\n  }\n\n  renderWidget(props: WmBubbleChartProps) {\n    this.invokeEventCallback('onBeforerender', [this.proxy, null]);\n    if (!this.state.data?.length) {\n      return null;\n    }\n    return (<View\n      style={this.styles.root}\n    >\n      <VictoryChart\n        theme={this.state.theme}\n        height={this.styles.root.height as number}\n        width={this.styles.root.width as number || this.screenWidth}\n        padding={{ top: props.offsettop, bottom: props.offsetbottom, left: props.offsetleft, right: props.offsetright }}\n      >\n        <VictoryLegend\n          name={'legend'}\n          containerComponent={<Svg />}\n          title={[props.title, props.subheading]}\n          orientation=\"horizontal\"\n          gutter={20}\n          data={[]}\n          theme={this.state.theme}\n        />\n        {this.getLegendView()}\n        {this.getXaxis()}\n        {this.getYAxis()}\n        {this.state.data.map((d: any, i: number) => {\n        return <VictoryScatter\n          colorScale={this.state.colors}\n          style={{\n            data: { fill: this.state.colors[i], opacity: ({ datum }) => datum.opacity }\n          }}\n          key={props.name + '_bubble_' + i}\n          name={props.name + '_bubble_' + i}\n          data={d}\n          size={5}\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        />\n      })}\n      </VictoryChart></View>);\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["React","View","Platform","WmBubbleChartProps","DEFAULT_CLASS","BaseChartComponent","BaseChartComponentState","VictoryChart","VictoryLegend","VictoryScatter","Svg","WmBubbleChartState","WmBubbleChart","constructor","props","onSelect","event","data","value","index","y","label","state","xaxisDatakeyArr","datum","x","selectedItem","dataset","selectedChartItem","series","_dataObj","invokeEventCallback","nativeEvent","proxy","renderWidget","_this$state$data","length","createElement","style","styles","root","theme","height","width","screenWidth","padding","top","offsettop","bottom","offsetbottom","left","offsetleft","right","offsetright","containerComponent","getTooltip","name","title","subheading","orientation","gutter","getLegendView","getXaxis","getYAxis","map","d","i","colorScale","colors","fill","opacity","_ref","key","size","events","target","eventHandlers","OS","onClick","bind","onPress"],"sources":["bubble-chart.component.tsx"],"sourcesContent":["import React from 'react';\nimport {Text, View, Platform} from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmBubbleChartProps from './bubble-chart.props';\nimport { DEFAULT_CLASS, WmBubbleChartStyles } from './bubble-chart.styles';\nimport {\n  BaseChartComponent,\n  BaseChartComponentState\n} from \"@wavemaker/app-rn-runtime/components/chart/basechart.component\";\nimport {VictoryAxis, VictoryChart, VictoryLegend, VictoryLine, VictoryScatter} from \"victory-native\";\nimport { ScatterSymbolType } from \"victory-core\";\nimport {Svg} from \"react-native-svg\";\nimport {get} from \"lodash-es\";\n\nexport class WmBubbleChartState extends BaseChartComponentState<WmBubbleChartProps> {}\n\nexport default class WmBubbleChart extends BaseChartComponent<WmBubbleChartProps, WmBubbleChartState, WmBubbleChartStyles> {\n\n  constructor(props: WmBubbleChartProps) {\n    super(props, DEFAULT_CLASS, new WmBubbleChartProps(), new WmBubbleChartState());\n  }\n\n  onSelect(event: any, data: any){\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    let selectedChartItem = [{series: 0, x: data.index, y: value,_dataObj: selectedItem},data.index];\n    this.invokeEventCallback('onSelect', [event.nativeEvent, this.proxy, selectedItem, selectedChartItem ]);\n  }\n\n  renderWidget(props: WmBubbleChartProps) {\n    this.invokeEventCallback('onBeforerender', [this.proxy, null]);\n    if (!this.state.data?.length) {\n      return null;\n    }\n    return (<View\n      style={this.styles.root}\n    >\n      <VictoryChart\n        theme={this.state.theme}\n        height={this.styles.root.height as number}\n        width={this.styles.root.width as number || this.screenWidth}\n        padding={{ top: props.offsettop, bottom: props.offsetbottom, left: props.offsetleft, right: props.offsetright }}\n        containerComponent={\n          this.getTooltip(props)\n        }\n      >\n        <VictoryLegend\n          name={'legend'}\n          containerComponent={<Svg />}\n          title={[props.title, props.subheading]}\n          orientation=\"horizontal\"\n          gutter={20}\n          data={[]}\n          theme={this.state.theme}\n        />\n        {this.getLegendView()}\n        {this.getXaxis()}\n        {this.getYAxis()}\n        {this.state.data.map((d: any, i: number) => {\n        return <VictoryScatter\n          colorScale={this.state.colors}\n          style={{\n            data: { fill: this.state.colors[i], opacity: ({ datum }) => datum.opacity }\n          }}\n          key={props.name + '_bubble_' + i}\n          name={props.name + '_bubble_' + i}\n          data={d}\n          size={5}\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        />\n      })}\n      </VictoryChart></View>);\n  }\n}\n"],"mappings":"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"}

app-rn-runtime/components/chart/line-chart/line-chart.component.js

@@ -40,7 +40,8 @@ export default class WmLineChart extends BaseChartComponent {
         bottom: props.offsetbottom,
         left: props.offsetleft,
         right: props.offsetright
-      }
+      },
+      containerComponent: this.getTooltip(props)
     }, /*#__PURE__*/React.createElement(VictoryLegend, {
       name: 'legend',
       containerComponent: /*#__PURE__*/React.createElement(Svg, null),
@@ -56,7 +57,7 @@ export default class WmLineChart extends BaseChartComponent {
       }, /*#__PURE__*/React.createElement(VictoryLine, {
         interpolation: props.interpolation,
         key: props.name + '_line_' + i,
-        name: props.name + '_line_' + i,
+        name: props.name + '_' + i,
         standalone: true,
         style: {
           data: {

app-rn-runtime/components/chart/line-chart/line-chart.component.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","View","Platform","Svg","VictoryChart","VictoryLine","VictoryLegend","VictoryScatter","VictoryGroup","WmLineChartProps","DEFAULT_CLASS","BaseChartComponent","BaseChartComponentState","ThemeVariables","WmLineChartState","WmLineChart","constructor","props","onSelect","event","data","value","index","y","label","state","xaxisDatakeyArr","datum","x","selectedItem","dataset","selectedChartItem","series","_dataObj","invokeEventCallback","nativeEvent","proxy","renderWidget","_this$state$data","length","createElement","style","styles","root","theme","height","width","screenWidth","padding","top","offsettop","bottom","offsetbottom","left","offsetleft","right","offsetright","name","containerComponent","title","subheading","orientation","gutter","getLegendView","getXaxis","getYAxis","map","d","i","key","interpolation","standalone","stroke","colors","INSTANCE","chartLineColor","strokeWidth","linethickness","highlightpoints","size","fill","opacity","events","target","eventHandlers","OS","onClick","bind","onPress"],"sources":["line-chart.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View, Platform } from 'react-native';\nimport { Svg } from 'react-native-svg';\n\nimport {\n  VictoryChart,\n  VictoryLine,\n  VictoryLegend,\n  VictoryScatter,\n  VictoryGroup,\n  } from 'victory-native';\n\nimport WmLineChartProps from './line-chart.props';\nimport { DEFAULT_CLASS, WmLineChartStyles } from './line-chart.styles';\nimport {\n  BaseChartComponent,\n  BaseChartComponentState\n} from \"@wavemaker/app-rn-runtime/components/chart/basechart.component\";\nimport ThemeVariables from '@wavemaker/app-rn-runtime/styles/theme.variables';\nimport {InterpolationPropType} from \"victory-core\";\n\nexport class WmLineChartState extends BaseChartComponentState<WmLineChartProps> {}\n\nexport default class WmLineChart extends BaseChartComponent<WmLineChartProps, WmLineChartState, WmLineChartStyles> {\n\n  constructor(props: WmLineChartProps) {\n    super(props, DEFAULT_CLASS, new WmLineChartProps(), new WmLineChartState());\n  }\n  \n  onSelect(event: any, data: any){\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    let selectedChartItem = [{series: 0, x: data.index, y: value,_dataObj: selectedItem},data.index];\n    this.invokeEventCallback('onSelect', [event.nativeEvent, this.proxy, selectedItem, selectedChartItem ]);\n  }\n\n  renderWidget(props: WmLineChartProps) {\n    this.invokeEventCallback('onBeforerender', [this.proxy, null]);\n    if (!this.state.data?.length) {\n      return null;\n    }\n    return (\n    <View style={this.styles.root}>\n      <VictoryChart\n        theme={this.state.theme}\n        height={this.styles.root.height as number}\n        width={this.styles.root.width as number || this.screenWidth}\n        padding={{ top: props.offsettop, bottom: props.offsetbottom, left: props.offsetleft, right: props.offsetright }}\n      >\n        <VictoryLegend\n          name={'legend'}\n          containerComponent={<Svg />}\n          title={[props.title, props.subheading]}\n          orientation=\"horizontal\"\n          gutter={20}\n          data={[]}\n          theme={this.state.theme}\n          y={0}\n        />\n        {this.getLegendView()}\n        {this.getXaxis()}\n        {this.getYAxis()}\n        {this.state.data.map((d: any, i: number) => {\n          return <VictoryGroup key={props.name + '_line_group_' + i}>\n            <VictoryLine interpolation={props.interpolation as InterpolationPropType}  key={props.name + '_line_' + i}\n              name={props.name + '_line_' + i}\n              standalone={true}\n              style={{\n                data: {\n                  stroke: (this.state.colors[i] || ThemeVariables.INSTANCE.chartLineColor),\n                  strokeWidth: props.linethickness,\n                }\n              }}       \n              data={d}\n            />\n          {(props.highlightpoints || this.state.data.length === 1) ?\n              <VictoryScatter size={5} key={props.name + '_scatter' + i}\n                  style={{\n                    data: { fill: this.state.colors[i], opacity: 0.8,}\n                  }}\n                  data={d}\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              />: null}\n            </VictoryGroup>\n        })}\n      </VictoryChart>\n    </View>);\n  }\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,QAAQ,QAAQ,cAAc;AAC7C,SAASC,GAAG,QAAQ,kBAAkB;AAEtC,SACEC,YAAY,EACZC,WAAW,EACXC,aAAa,EACbC,cAAc,EACdC,YAAY,QACL,gBAAgB;AAEzB,OAAOC,gBAAgB,MAAM,oBAAoB;AACjD,SAASC,aAAa,QAA2B,qBAAqB;AACtE,SACEC,kBAAkB,EAClBC,uBAAuB,QAClB,gEAAgE;AACvE,OAAOC,cAAc,MAAM,kDAAkD;AAG7E,OAAO,MAAMC,gBAAgB,SAASF,uBAAuB,CAAmB;AAEhF,eAAe,MAAMG,WAAW,SAASJ,kBAAkB,CAAwD;EAEjHK,WAAWA,CAACC,KAAuB,EAAE;IACnC,KAAK,CAACA,KAAK,EAAEP,aAAa,EAAE,IAAID,gBAAgB,CAAC,CAAC,EAAE,IAAIK,gBAAgB,CAAC,CAAC,CAAC;EAC7E;EAEAI,QAAQA,CAACC,KAAU,EAAEC,IAAS,EAAC;IAC7B,IAAIC,KAAK,GAAGD,IAAI,CAACA,IAAI,CAACA,IAAI,CAACE,KAAK,CAAC,CAACC,CAAC;IACnC,IAAIC,KAAK,GAAG,IAAI,CAACC,KAAK,CAACC,eAAe,CAACN,IAAI,CAACO,KAAK,CAACC,CAAC,CAAC;IACpD,IAAIC,YAAY,GAAG,IAAI,CAACZ,KAAK,CAACa,OAAO,CAACV,IAAI,CAACE,KAAK,CAAC;IACjD,IAAIS,iBAAiB,GAAG,CAAC;MAACC,MAAM,EAAE,CAAC;MAAEJ,CAAC,EAAER,IAAI,CAACE,KAAK;MAAEC,CAAC,EAAEF,KAAK;MAACY,QAAQ,EAAEJ;IAAY,CAAC,EAACT,IAAI,CAACE,KAAK,CAAC;IAChG,IAAI,CAACY,mBAAmB,CAAC,UAAU,EAAE,CAACf,KAAK,CAACgB,WAAW,EAAE,IAAI,CAACC,KAAK,EAAEP,YAAY,EAAEE,iBAAiB,CAAE,CAAC;EACzG;EAEAM,YAAYA,CAACpB,KAAuB,EAAE;IAAA,IAAAqB,gBAAA;IACpC,IAAI,CAACJ,mBAAmB,CAAC,gBAAgB,EAAE,CAAC,IAAI,CAACE,KAAK,EAAE,IAAI,CAAC,CAAC;IAC9D,IAAI,GAAAE,gBAAA,GAAC,IAAI,CAACb,KAAK,CAACL,IAAI,cAAAkB,gBAAA,eAAfA,gBAAA,CAAiBC,MAAM,GAAE;MAC5B,OAAO,IAAI;IACb;IACA,oBACAvC,KAAA,CAAAwC,aAAA,CAACvC,IAAI;MAACwC,KAAK,EAAE,IAAI,CAACC,MAAM,CAACC;IAAK,gBAC5B3C,KAAA,CAAAwC,aAAA,CAACpC,YAAY;MACXwC,KAAK,EAAE,IAAI,CAACnB,KAAK,CAACmB,KAAM;MACxBC,MAAM,EAAE,IAAI,CAACH,MAAM,CAACC,IAAI,CAACE,MAAiB;MAC1CC,KAAK,EAAE,IAAI,CAACJ,MAAM,CAACC,IAAI,CAACG,KAAK,IAAc,IAAI,CAACC,WAAY;MAC5DC,OAAO,EAAE;QAAEC,GAAG,EAAEhC,KAAK,CAACiC,SAAS;QAAEC,MAAM,EAAElC,KAAK,CAACmC,YAAY;QAAEC,IAAI,EAAEpC,KAAK,CAACqC,UAAU;QAAEC,KAAK,EAAEtC,KAAK,CAACuC;MAAY;IAAE,gBAEhHxD,KAAA,CAAAwC,aAAA,CAAClC,aAAa;MACZmD,IAAI,EAAE,QAAS;MACfC,kBAAkB,eAAE1D,KAAA,CAAAwC,aAAA,CAACrC,GAAG,MAAE,CAAE;MAC5BwD,KAAK,EAAE,CAAC1C,KAAK,CAAC0C,KAAK,EAAE1C,KAAK,CAAC2C,UAAU,CAAE;MACvCC,WAAW,EAAC,YAAY;MACxBC,MAAM,EAAE,EAAG;MACX1C,IAAI,EAAE,EAAG;MACTwB,KAAK,EAAE,IAAI,CAACnB,KAAK,CAACmB,KAAM;MACxBrB,CAAC,EAAE;IAAE,CACN,CAAC,EACD,IAAI,CAACwC,aAAa,CAAC,CAAC,EACpB,IAAI,CAACC,QAAQ,CAAC,CAAC,EACf,IAAI,CAACC,QAAQ,CAAC,CAAC,EACf,IAAI,CAACxC,KAAK,CAACL,IAAI,CAAC8C,GAAG,CAAC,CAACC,CAAM,EAAEC,CAAS,KAAK;MAC1C,oBAAOpE,KAAA,CAAAwC,aAAA,CAAChC,YAAY;QAAC6D,GAAG,EAAEpD,KAAK,CAACwC,IAAI,GAAG,cAAc,GAAGW;MAAE,gBACxDpE,KAAA,CAAAwC,aAAA,CAACnC,WAAW;QAACiE,aAAa,EAAErD,KAAK,CAACqD,aAAuC;QAAED,GAAG,EAAEpD,KAAK,CAACwC,IAAI,GAAG,QAAQ,GAAGW,CAAE;QACxGX,IAAI,EAAExC,KAAK,CAACwC,IAAI,GAAG,QAAQ,GAAGW,CAAE;QAChCG,UAAU,EAAE,IAAK;QACjB9B,KAAK,EAAE;UACLrB,IAAI,EAAE;YACJoD,MAAM,EAAG,IAAI,CAAC/C,KAAK,CAACgD,MAAM,CAACL,CAAC,CAAC,IAAIvD,cAAc,CAAC6D,QAAQ,CAACC,cAAe;YACxEC,WAAW,EAAE3D,KAAK,CAAC4D;UACrB;QACF,CAAE;QACFzD,IAAI,EAAE+C;MAAE,CACT,CAAC,EACFlD,KAAK,CAAC6D,eAAe,IAAI,IAAI,CAACrD,KAAK,CAACL,IAAI,CAACmB,MAAM,KAAK,CAAC,gBACnDvC,KAAA,CAAAwC,aAAA,CAACjC,cAAc;QAACwE,IAAI,EAAE,CAAE;QAACV,GAAG,EAAEpD,KAAK,CAACwC,IAAI,GAAG,UAAU,GAAGW,CAAE;QACtD3B,KAAK,EAAE;UACLrB,IAAI,EAAE;YAAE4D,IAAI,EAAE,IAAI,CAACvD,KAAK,CAACgD,MAAM,CAACL,CAAC,CAAC;YAAEa,OAAO,EAAE;UAAI;QACnD,CAAE;QACF7D,IAAI,EAAE+C,CAAE;QACRe,MAAM,EAAE,CAAC;UACPC,MAAM,EAAE,MAAM;UACdC,aAAa,EAAElF,QAAQ,CAACmF,EAAE,IAAI,KAAK,GAAG;YACpCC,OAAO,EAAE,IAAI,CAACpE,QAAQ,CAACqE,IAAI,CAAC,IAAI;UAClC,CAAC,GAAC;YACAC,OAAO,EAAE,IAAI,CAACtE,QAAQ,CAACqE,IAAI,CAAC,IAAI;UAClC;QACF,CAAC;MAAE,CACN,CAAC,GAAE,IACQ,CAAC;IACnB,CAAC,CACW,CACV,CAAC;EACT;AACF"}
+{"version":3,"names":["React","View","Platform","Svg","VictoryChart","VictoryLine","VictoryLegend","VictoryScatter","VictoryGroup","WmLineChartProps","DEFAULT_CLASS","BaseChartComponent","BaseChartComponentState","ThemeVariables","WmLineChartState","WmLineChart","constructor","props","onSelect","event","data","value","index","y","label","state","xaxisDatakeyArr","datum","x","selectedItem","dataset","selectedChartItem","series","_dataObj","invokeEventCallback","nativeEvent","proxy","renderWidget","_this$state$data","length","createElement","style","styles","root","theme","height","width","screenWidth","padding","top","offsettop","bottom","offsetbottom","left","offsetleft","right","offsetright","containerComponent","getTooltip","name","title","subheading","orientation","gutter","getLegendView","getXaxis","getYAxis","map","d","i","key","interpolation","standalone","stroke","colors","INSTANCE","chartLineColor","strokeWidth","linethickness","highlightpoints","size","fill","opacity","events","target","eventHandlers","OS","onClick","bind","onPress"],"sources":["line-chart.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View, Platform } from 'react-native';\nimport { Svg } from 'react-native-svg';\n\nimport {\n  VictoryChart,\n  VictoryLine,\n  VictoryLegend,\n  VictoryScatter,\n  VictoryGroup,\n  } from 'victory-native';\n\nimport WmLineChartProps from './line-chart.props';\nimport { DEFAULT_CLASS, WmLineChartStyles } from './line-chart.styles';\nimport {\n  BaseChartComponent,\n  BaseChartComponentState\n} from \"@wavemaker/app-rn-runtime/components/chart/basechart.component\";\nimport ThemeVariables from '@wavemaker/app-rn-runtime/styles/theme.variables';\nimport {InterpolationPropType} from \"victory-core\";\n\nexport class WmLineChartState extends BaseChartComponentState<WmLineChartProps> {}\n\nexport default class WmLineChart extends BaseChartComponent<WmLineChartProps, WmLineChartState, WmLineChartStyles> {\n\n  constructor(props: WmLineChartProps) {\n    super(props, DEFAULT_CLASS, new WmLineChartProps(), new WmLineChartState());\n  }\n  \n  onSelect(event: any, data: any){\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    let selectedChartItem = [{series: 0, x: data.index, y: value,_dataObj: selectedItem},data.index];\n    this.invokeEventCallback('onSelect', [event.nativeEvent, this.proxy, selectedItem, selectedChartItem ]);\n  }\n\n  renderWidget(props: WmLineChartProps) {\n    this.invokeEventCallback('onBeforerender', [this.proxy, null]);\n    if (!this.state.data?.length) {\n      return null;\n    }\n    return (\n    <View style={this.styles.root}>\n      <VictoryChart\n        theme={this.state.theme}\n        height={this.styles.root.height as number}\n        width={this.styles.root.width as number || this.screenWidth}\n        padding={{ top: props.offsettop, bottom: props.offsetbottom, left: props.offsetleft, right: props.offsetright }}\n        containerComponent={\n          this.getTooltip(props)\n        }\n      >\n        <VictoryLegend\n          name={'legend'}\n          containerComponent={<Svg />}\n          title={[props.title, props.subheading]}\n          orientation=\"horizontal\"\n          gutter={20}\n          data={[]}\n          theme={this.state.theme}\n          y={0}\n        />\n        {this.getLegendView()}\n        {this.getXaxis()}\n        {this.getYAxis()}\n        {this.state.data.map((d: any, i: number) => {\n          return <VictoryGroup key={props.name + '_line_group_' + i}>\n            <VictoryLine interpolation={props.interpolation as InterpolationPropType}  key={props.name + '_line_' + i}\n              name={props.name + '_' + i}\n              standalone={true}\n              style={{\n                data: {\n                  stroke: (this.state.colors[i] || ThemeVariables.INSTANCE.chartLineColor),\n                  strokeWidth: props.linethickness,\n                }\n              }}       \n              data={d}\n            />\n          {(props.highlightpoints || this.state.data.length === 1) ?\n              <VictoryScatter size={5} key={props.name + '_scatter' + i}\n                  style={{\n                    data: { fill: this.state.colors[i], opacity: 0.8,}\n                  }}\n                  data={d}\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              />: null}\n            </VictoryGroup>\n        })}\n      </VictoryChart>\n    </View>);\n  }\n}\n"],"mappings":"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"}

app-rn-runtime/components/chart/stack-chart/stack-chart.component.js

@@ -186,7 +186,8 @@ export default class WmStackChart extends BaseChartComponent {
         bottom: props.offsetbottom,
         left: props.offsetleft,
         right: props.offsetright
-      }
+      },
+      containerComponent: this.getTooltip(props)
     }, /*#__PURE__*/React.createElement(VictoryLegend, {
       name: 'legend',
       containerComponent: /*#__PURE__*/React.createElement(Svg, null),

app-rn-runtime/components/chart/stack-chart/stack-chart.component.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","View","Platform","Svg","VictoryStack","VictoryBar","VictoryChart","VictoryPie","VictoryLegend","VictoryAxis","Axis","Scale","orderBy","cloneDeep","WmStackChartProps","DEFAULT_CLASS","BaseChartComponent","BaseChartComponentState","WmStackChartState","constructor","arguments","_defineProperty","WmStackChart","props","e","viewWidth","nativeEvent","layout","width","updateState","chartWidth","componentDidMount","setHeightWidthOnChart","getNegativeValuesArray","negativeValuesArray","state","data","filter","d","y","getPositiveValuesArray","positiveValuesArray","getBarChart","length","negativeValues","concat","currentValue","map","i","d1","x","push","createElement","key","name","cornerRadius","bottomLeft","bottomRight","topLeft","topRight","getColorCodes","colors","reverse","getArcChart","colorScaleArray","maxValue","Math","max","o","radius","min","chartHeight","colorScale","startAngle","endAngle","standalone","origin","innerRadius","thickness","labels","getArcAxis","ticks","getTickValues","axisData","forEach","yunits","style","fontSize","paddingLeft","paddingRight","labelRadius","minValue","scale","getBaseScale","domain","getTicks","unshift","onSelect","event","value","index","label","xaxisDatakeyArr","datum","selectedItem","dataset","selectedChartItem","series","_dataObj","invokeEventCallback","proxy","renderWidget","mindomain","xdomain","chartMinX","undefined","ydomain","chartMinY","styles","root","onLayout","onViewLayoutChange","viewtype","theme","minDomain","height","screenWidth","padding","top","offsettop","bottom","offsetbottom","left","offsetleft","right","offsetright","containerComponent","title","fontFamily","subheading","orientation","gutter","getLegendView","crossAxis","tickLabels","fill","showyaxis","axisLabel","grid","stroke","tickValues","tickFormat","t","abbreviateNumber","dependentAxis","horizontal","strokeWidth","events","target","eventHandlers","OS","onClick","bind","onPress"],"sources":["stack-chart.component.tsx"],"sourcesContent":["import React from 'react';\nimport { LayoutChangeEvent, View, Platform } from 'react-native';\nimport { Svg } from 'react-native-svg';\nimport { VictoryStack, VictoryBar, VictoryChart, VictoryPie, VictoryLegend, VictoryAxis } from 'victory-native';\nimport { Axis, Scale } from 'victory-core';\nimport { orderBy, cloneDeep } from 'lodash';\n\nimport WmStackChartProps from './stack-chart.props';\nimport { DEFAULT_CLASS, WmStackChartStyles } from './stack-chart.styles';\nimport {\n  BaseChartComponent,\n  BaseChartComponentState\n} from '@wavemaker/app-rn-runtime/components/chart/basechart.component';\n\nexport class WmStackChartState extends BaseChartComponentState<WmStackChartProps> {\n  chartWidth = 0;\n}\n\nexport default class WmStackChart extends BaseChartComponent<WmStackChartProps, WmStackChartState, WmStackChartStyles> {\n  constructor(props: WmStackChartProps) {\n    super(props, DEFAULT_CLASS, new WmStackChartProps(), new WmStackChartState());\n  }\n\n  componentDidMount() {\n    super.componentDidMount();\n    this.setHeightWidthOnChart();\n  }\n\n  getNegativeValuesArray() {\n    let negativeValuesArray = cloneDeep(this.state.data[0]).filter((d: any) => d.y < 0);\n    negativeValuesArray = orderBy(negativeValuesArray, 'y', 'desc');\n    return negativeValuesArray;\n  }\n\n  getPositiveValuesArray() {\n    let positiveValuesArray = cloneDeep(this.state.data[0]).filter((d: any) => d.y > 0);\n    positiveValuesArray = orderBy(positiveValuesArray, 'y', 'asc');\n    return positiveValuesArray;\n  }\n\n  getBarChart(props: WmStackChartProps) {\n    if ( this.state.data.length > 0 ) {\n      const negativeValues = cloneDeep(this.getNegativeValuesArray());\n      const data = negativeValues.concat(cloneDeep(this.getPositiveValuesArray()));\n      let currentValue = 0;\n\n      return data.map((d: any, i: number) => {\n        let d1: any = [];\n        d.x = 0;\n        d.y = d.y - currentValue;\n        d1.push(d);\n        currentValue = d.y < 0 && i === negativeValues.length -1 ? 0 : d.y + currentValue;\n        return <VictoryBar key={props.name + '_' + i}\n                           cornerRadius={{bottomLeft:(1), bottomRight:(1), topLeft:(1), topRight:(1)}}\n                           data={d1}/>\n      });\n    }\n  }\n\n  private getColorCodes() {\n      const colors = cloneDeep(this.state.colors);\n      return colors.reverse();\n  }\n\n  getArcChart(props: WmStackChartProps) {\n    if ( this.state.data.length > 0 ) {\n      let data = cloneDeep(this.state.data[0]);\n      const colorScaleArray = this.getColorCodes();\n      const maxValue = Math.max(...data.map((o: any) => o.y));\n      data = orderBy(data, 'y', 'desc');\n      const radius = Math.min(this.state.chartWidth/2, this.state.chartHeight - 50);\n      return data.map((d: any, i: number) => {\n        let d1: any = [];\n        d1.push(d);\n        d1.push({x: d.x, y: maxValue - d.y})\n        return <VictoryPie key={props.name + '_' + i}\n                           radius={radius}\n                           colorScale={[colorScaleArray[i], '#fff0']}\n                           startAngle={-80}\n                           endAngle={80}\n                           cornerRadius={100}\n                           standalone={false}\n                           origin={{x: (this.state.chartWidth/2), y: (this.state.chartHeight - 50)}}\n                           innerRadius={radius - this.state.props.thickness}\n                           labels={[]}\n                           data={d1}/>\n      });\n    }\n  }\n\n  getArcAxis() {\n    const ticks = this.getTickValues();\n    const radius = Math.min(this.state.chartWidth/2, this.state.chartHeight-50);\n    const axisData: any = [];\n    ticks.forEach((d: any, i: any) => {\n      axisData.push({x:  `${this.state.props.yunits}${d}`, y: 1})\n    });\n    return <VictoryPie\n     style={{\n       labels: {\n         fontSize: 12, paddingLeft: 50, paddingRight: 80\n       }}\n     }\n      startAngle={-90}\n      endAngle={90}\n      standalone={false}\n      colorScale={['#fff0']}\n      origin={{x: (this.state.chartWidth/2 - 5), y: (this.state.chartHeight - 50)}}\n      labelRadius={radius - this.state.props.thickness - 20}\n      data={axisData}\n    />\n  }\n\n  onViewLayoutChange = (e: LayoutChangeEvent) => {\n    let viewWidth = e.nativeEvent.layout.width;\n    this.updateState({\n      chartWidth: viewWidth\n    } as WmStackChartState);\n  }\n\n  getTickValues() {\n    let ticks: any = [];\n    if (this.state.data[0].length) {\n      let data = cloneDeep(this.state.data[0]);\n      const maxValue = Math.max(...data.map((o: any) => o.y));\n      const minValue = Math.min(...data.map((o: any) => o.y));\n      const scale = Scale.getBaseScale({}, 'x');\n      scale.domain([minValue > 0 ? 0 : minValue, maxValue]);\n      ticks = Axis.getTicks({}, scale);\n      ticks[ticks.length -1] = maxValue;\n      if ( minValue < 0 ) {\n        if (ticks[0] === 0) {\n          ticks.unshift(minValue);\n        } else {\n          ticks[0] = minValue;\n        }\n      }\n    }\n    return ticks;\n  }\n\n  onSelect(event: any, data: any){\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    let selectedChartItem = [{series: 0, x: data.index, y: value,_dataObj: selectedItem},data.index];\n    this.invokeEventCallback('onSelect', [event.nativeEvent, this.proxy, selectedItem, selectedChartItem ]);\n  }\n\n  renderWidget(props: WmStackChartProps) {\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    const colorScale = this.state.colors.length === 1 ? this.state.colors[0] : this.state.colors;\n    return (\n      <View\n        style={this.styles.root} onLayout={this.onViewLayoutChange}\n      >{\n        props.viewtype === 'Bar' ?\n          <VictoryChart\n            theme={this.state.theme}\n            minDomain={mindomain}\n            height={this.styles.root.height as number}\n            width={this.styles.root.width as number || this.screenWidth}\n            padding={{\n              top: props.offsettop,\n              bottom: props.offsetbottom,\n              left: props.offsetleft,\n              right: props.offsetright\n            }}>\n            <VictoryLegend\n              name={'legend'}\n              containerComponent={<Svg />}\n              style={{title: {\n                fontFamily: \"'Helvetica Neue', 'Helvetica', sans-serif\",\n                fontSize: 18\n              }\n              }}\n              title={[props.title, props.subheading]}\n              orientation=\"horizontal\"\n              gutter={20}\n              data={[]}\n              theme={this.state.theme}\n            />\n            {this.getLegendView(colorScale)}\n            <VictoryAxis crossAxis\n                         style={{\n                           tickLabels: { fill: this.state.props.showyaxis === false ? 'transparent' : '#000000',  fontSize: 12, padding: this.state.props.thickness/2 + 5},\n                           axisLabel: { padding: (15 + this.state.props.thickness/2) },\n                           grid: {stroke: 'none'}\n                         }}\n                         theme={this.state.theme}\n                         tickValues={this.getTickValues()}\n                         tickFormat={(t) => this.state.props.yunits ? `${this.abbreviateNumber(t)}${this.state.props.yunits}` : `${this.abbreviateNumber(t)}`} dependentAxis />\n            <VictoryStack\n              colorScale={colorScale}\n              horizontal={true}\n              style={{\n                data: { strokeWidth: this.state.props.thickness }\n              }}\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            >\n              {\n                this.getBarChart(props)\n              }\n            </VictoryStack>\n          </VictoryChart> :\n          <Svg width={this.state.chartWidth} height={this.state.chartHeight}>\n            <VictoryLegend\n              name={'legend'}\n              containerComponent={<Svg />}\n              title={[props.title, props.subheading]}\n              orientation=\"horizontal\"\n              gutter={20}\n              data={[]}\n              theme={this.state.theme}\n            />\n            {this.getArcChart(props)}\n            {this.getArcAxis()}\n          </Svg>\n      }\n      </View>\n    );\n  }\n}\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAA4BC,IAAI,EAAEC,QAAQ,QAAQ,cAAc;AAChE,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SAASC,YAAY,EAAEC,UAAU,EAAEC,YAAY,EAAEC,UAAU,EAAEC,aAAa,EAAEC,WAAW,QAAQ,gBAAgB;AAC/G,SAASC,IAAI,EAAEC,KAAK,QAAQ,cAAc;AAC1C,SAASC,OAAO,EAAEC,SAAS,QAAQ,QAAQ;AAE3C,OAAOC,iBAAiB,MAAM,qBAAqB;AACnD,SAASC,aAAa,QAA4B,sBAAsB;AACxE,SACEC,kBAAkB,EAClBC,uBAAuB,QAClB,gEAAgE;AAEvE,OAAO,MAAMC,iBAAiB,SAASD,uBAAuB,CAAoB;EAAAE,YAAA;IAAA,SAAAC,SAAA;IAAAC,eAAA,qBACnE,CAAC;EAAA;AAChB;AAEA,eAAe,MAAMC,YAAY,SAASN,kBAAkB,CAA2D;EACrHG,WAAWA,CAACI,KAAwB,EAAE;IACpC,KAAK,CAACA,KAAK,EAAER,aAAa,EAAE,IAAID,iBAAiB,CAAC,CAAC,EAAE,IAAII,iBAAiB,CAAC,CAAC,CAAC;IAACG,eAAA,6BA6F1DG,CAAoB,IAAK;MAC7C,IAAIC,SAAS,GAAGD,CAAC,CAACE,WAAW,CAACC,MAAM,CAACC,KAAK;MAC1C,IAAI,CAACC,WAAW,CAAC;QACfC,UAAU,EAAEL;MACd,CAAsB,CAAC;IACzB,CAAC;EAjGD;EAEAM,iBAAiBA,CAAA,EAAG;IAClB,KAAK,CAACA,iBAAiB,CAAC,CAAC;IACzB,IAAI,CAACC,qBAAqB,CAAC,CAAC;EAC9B;EAEAC,sBAAsBA,CAAA,EAAG;IACvB,IAAIC,mBAAmB,GAAGrB,SAAS,CAAC,IAAI,CAACsB,KAAK,CAACC,IAAI,CAAC,CAAC,CAAC,CAAC,CAACC,MAAM,CAAEC,CAAM,IAAKA,CAAC,CAACC,CAAC,GAAG,CAAC,CAAC;IACnFL,mBAAmB,GAAGtB,OAAO,CAACsB,mBAAmB,EAAE,GAAG,EAAE,MAAM,CAAC;IAC/D,OAAOA,mBAAmB;EAC5B;EAEAM,sBAAsBA,CAAA,EAAG;IACvB,IAAIC,mBAAmB,GAAG5B,SAAS,CAAC,IAAI,CAACsB,KAAK,CAACC,IAAI,CAAC,CAAC,CAAC,CAAC,CAACC,MAAM,CAAEC,CAAM,IAAKA,CAAC,CAACC,CAAC,GAAG,CAAC,CAAC;IACnFE,mBAAmB,GAAG7B,OAAO,CAAC6B,mBAAmB,EAAE,GAAG,EAAE,KAAK,CAAC;IAC9D,OAAOA,mBAAmB;EAC5B;EAEAC,WAAWA,CAACnB,KAAwB,EAAE;IACpC,IAAK,IAAI,CAACY,KAAK,CAACC,IAAI,CAACO,MAAM,GAAG,CAAC,EAAG;MAChC,MAAMC,cAAc,GAAG/B,SAAS,CAAC,IAAI,CAACoB,sBAAsB,CAAC,CAAC,CAAC;MAC/D,MAAMG,IAAI,GAAGQ,cAAc,CAACC,MAAM,CAAChC,SAAS,CAAC,IAAI,CAAC2B,sBAAsB,CAAC,CAAC,CAAC,CAAC;MAC5E,IAAIM,YAAY,GAAG,CAAC;MAEpB,OAAOV,IAAI,CAACW,GAAG,CAAC,CAACT,CAAM,EAAEU,CAAS,KAAK;QACrC,IAAIC,EAAO,GAAG,EAAE;QAChBX,CAAC,CAACY,CAAC,GAAG,CAAC;QACPZ,CAAC,CAACC,CAAC,GAAGD,CAAC,CAACC,CAAC,GAAGO,YAAY;QACxBG,EAAE,CAACE,IAAI,CAACb,CAAC,CAAC;QACVQ,YAAY,GAAGR,CAAC,CAACC,CAAC,GAAG,CAAC,IAAIS,CAAC,KAAKJ,cAAc,CAACD,MAAM,GAAE,CAAC,GAAG,CAAC,GAAGL,CAAC,CAACC,CAAC,GAAGO,YAAY;QACjF,oBAAO9C,KAAA,CAAAoD,aAAA,CAAC/C,UAAU;UAACgD,GAAG,EAAE9B,KAAK,CAAC+B,IAAI,GAAG,GAAG,GAAGN,CAAE;UAC1BO,YAAY,EAAE;YAACC,UAAU,EAAE,CAAE;YAAEC,WAAW,EAAE,CAAE;YAAEC,OAAO,EAAE,CAAE;YAAEC,QAAQ,EAAE;UAAE,CAAE;UAC3EvB,IAAI,EAAEa;QAAG,CAAC,CAAC;MAChC,CAAC,CAAC;IACJ;EACF;EAEQW,aAAaA,CAAA,EAAG;IACpB,MAAMC,MAAM,GAAGhD,SAAS,CAAC,IAAI,CAACsB,KAAK,CAAC0B,MAAM,CAAC;IAC3C,OAAOA,MAAM,CAACC,OAAO,CAAC,CAAC;EAC3B;EAEAC,WAAWA,CAACxC,KAAwB,EAAE;IACpC,IAAK,IAAI,CAACY,KAAK,CAACC,IAAI,CAACO,MAAM,GAAG,CAAC,EAAG;MAChC,IAAIP,IAAI,GAAGvB,SAAS,CAAC,IAAI,CAACsB,KAAK,CAACC,IAAI,CAAC,CAAC,CAAC,CAAC;MACxC,MAAM4B,eAAe,GAAG,IAAI,CAACJ,aAAa,CAAC,CAAC;MAC5C,MAAMK,QAAQ,GAAGC,IAAI,CAACC,GAAG,CAAC,GAAG/B,IAAI,CAACW,GAAG,CAAEqB,CAAM,IAAKA,CAAC,CAAC7B,CAAC,CAAC,CAAC;MACvDH,IAAI,GAAGxB,OAAO,CAACwB,IAAI,EAAE,GAAG,EAAE,MAAM,CAAC;MACjC,MAAMiC,MAAM,GAAGH,IAAI,CAACI,GAAG,CAAC,IAAI,CAACnC,KAAK,CAACL,UAAU,GAAC,CAAC,EAAE,IAAI,CAACK,KAAK,CAACoC,WAAW,GAAG,EAAE,CAAC;MAC7E,OAAOnC,IAAI,CAACW,GAAG,CAAC,CAACT,CAAM,EAAEU,CAAS,KAAK;QACrC,IAAIC,EAAO,GAAG,EAAE;QAChBA,EAAE,CAACE,IAAI,CAACb,CAAC,CAAC;QACVW,EAAE,CAACE,IAAI,CAAC;UAACD,CAAC,EAAEZ,CAAC,CAACY,CAAC;UAAEX,CAAC,EAAE0B,QAAQ,GAAG3B,CAAC,CAACC;QAAC,CAAC,CAAC;QACpC,oBAAOvC,KAAA,CAAAoD,aAAA,CAAC7C,UAAU;UAAC8C,GAAG,EAAE9B,KAAK,CAAC+B,IAAI,GAAG,GAAG,GAAGN,CAAE;UAC1BqB,MAAM,EAAEA,MAAO;UACfG,UAAU,EAAE,CAACR,eAAe,CAAChB,CAAC,CAAC,EAAE,OAAO,CAAE;UAC1CyB,UAAU,EAAE,CAAC,EAAG;UAChBC,QAAQ,EAAE,EAAG;UACbnB,YAAY,EAAE,GAAI;UAClBoB,UAAU,EAAE,KAAM;UAClBC,MAAM,EAAE;YAAC1B,CAAC,EAAG,IAAI,CAACf,KAAK,CAACL,UAAU,GAAC,CAAE;YAAES,CAAC,EAAG,IAAI,CAACJ,KAAK,CAACoC,WAAW,GAAG;UAAG,CAAE;UACzEM,WAAW,EAAER,MAAM,GAAG,IAAI,CAAClC,KAAK,CAACZ,KAAK,CAACuD,SAAU;UACjDC,MAAM,EAAE,EAAG;UACX3C,IAAI,EAAEa;QAAG,CAAC,CAAC;MAChC,CAAC,CAAC;IACJ;EACF;EAEA+B,UAAUA,CAAA,EAAG;IACX,MAAMC,KAAK,GAAG,IAAI,CAACC,aAAa,CAAC,CAAC;IAClC,MAAMb,MAAM,GAAGH,IAAI,CAACI,GAAG,CAAC,IAAI,CAACnC,KAAK,CAACL,UAAU,GAAC,CAAC,EAAE,IAAI,CAACK,KAAK,CAACoC,WAAW,GAAC,EAAE,CAAC;IAC3E,MAAMY,QAAa,GAAG,EAAE;IACxBF,KAAK,CAACG,OAAO,CAAC,CAAC9C,CAAM,EAAEU,CAAM,KAAK;MAChCmC,QAAQ,CAAChC,IAAI,CAAC;QAACD,CAAC,EAAI,GAAE,IAAI,CAACf,KAAK,CAACZ,KAAK,CAAC8D,MAAO,GAAE/C,CAAE,EAAC;QAAEC,CAAC,EAAE;MAAC,CAAC,CAAC;IAC7D,CAAC,CAAC;IACF,oBAAOvC,KAAA,CAAAoD,aAAA,CAAC7C,UAAU;MACjB+E,KAAK,EAAE;QACLP,MAAM,EAAE;UACNQ,QAAQ,EAAE,EAAE;UAAEC,WAAW,EAAE,EAAE;UAAEC,YAAY,EAAE;QAC/C;MAAC,CACF;MACAhB,UAAU,EAAE,CAAC,EAAG;MAChBC,QAAQ,EAAE,EAAG;MACbC,UAAU,EAAE,KAAM;MAClBH,UAAU,EAAE,CAAC,OAAO,CAAE;MACtBI,MAAM,EAAE;QAAC1B,CAAC,EAAG,IAAI,CAACf,KAAK,CAACL,UAAU,GAAC,CAAC,GAAG,CAAE;QAAES,CAAC,EAAG,IAAI,CAACJ,KAAK,CAACoC,WAAW,GAAG;MAAG,CAAE;MAC7EmB,WAAW,EAAErB,MAAM,GAAG,IAAI,CAAClC,KAAK,CAACZ,KAAK,CAACuD,SAAS,GAAG,EAAG;MACtD1C,IAAI,EAAE+C;IAAS,CAChB,CAAC;EACJ;EASAD,aAAaA,CAAA,EAAG;IACd,IAAID,KAAU,GAAG,EAAE;IACnB,IAAI,IAAI,CAAC9C,KAAK,CAACC,IAAI,CAAC,CAAC,CAAC,CAACO,MAAM,EAAE;MAC7B,IAAIP,IAAI,GAAGvB,SAAS,CAAC,IAAI,CAACsB,KAAK,CAACC,IAAI,CAAC,CAAC,CAAC,CAAC;MACxC,MAAM6B,QAAQ,GAAGC,IAAI,CAACC,GAAG,CAAC,GAAG/B,IAAI,CAACW,GAAG,CAAEqB,CAAM,IAAKA,CAAC,CAAC7B,CAAC,CAAC,CAAC;MACvD,MAAMoD,QAAQ,GAAGzB,IAAI,CAACI,GAAG,CAAC,GAAGlC,IAAI,CAACW,GAAG,CAAEqB,CAAM,IAAKA,CAAC,CAAC7B,CAAC,CAAC,CAAC;MACvD,MAAMqD,KAAK,GAAGjF,KAAK,CAACkF,YAAY,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC;MACzCD,KAAK,CAACE,MAAM,CAAC,CAACH,QAAQ,GAAG,CAAC,GAAG,CAAC,GAAGA,QAAQ,EAAE1B,QAAQ,CAAC,CAAC;MACrDgB,KAAK,GAAGvE,IAAI,CAACqF,QAAQ,CAAC,CAAC,CAAC,EAAEH,KAAK,CAAC;MAChCX,KAAK,CAACA,KAAK,CAACtC,MAAM,GAAE,CAAC,CAAC,GAAGsB,QAAQ;MACjC,IAAK0B,QAAQ,GAAG,CAAC,EAAG;QAClB,IAAIV,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE;UAClBA,KAAK,CAACe,OAAO,CAACL,QAAQ,CAAC;QACzB,CAAC,MAAM;UACLV,KAAK,CAAC,CAAC,CAAC,GAAGU,QAAQ;QACrB;MACF;IACF;IACA,OAAOV,KAAK;EACd;EAEAgB,QAAQA,CAACC,KAAU,EAAE9D,IAAS,EAAC;IAC7B,IAAI+D,KAAK,GAAG/D,IAAI,CAACA,IAAI,CAACA,IAAI,CAACgE,KAAK,CAAC,CAAC7D,CAAC;IACnC,IAAI8D,KAAK,GAAG,IAAI,CAAClE,KAAK,CAACmE,eAAe,CAAClE,IAAI,CAACmE,KAAK,CAACrD,CAAC,CAAC;IACpD,IAAIsD,YAAY,GAAG,IAAI,CAACjF,KAAK,CAACkF,OAAO,CAACrE,IAAI,CAACgE,KAAK,CAAC;IACjD,IAAIM,iBAAiB,GAAG,CAAC;MAACC,MAAM,EAAE,CAAC;MAAEzD,CAAC,EAAEd,IAAI,CAACgE,KAAK;MAAE7D,CAAC,EAAE4D,KAAK;MAACS,QAAQ,EAAEJ;IAAY,CAAC,EAACpE,IAAI,CAACgE,KAAK,CAAC;IAChG,IAAI,CAACS,mBAAmB,CAAC,UAAU,EAAE,CAACX,KAAK,CAACxE,WAAW,EAAE,IAAI,CAACoF,KAAK,EAAEN,YAAY,EAAEE,iBAAiB,CAAE,CAAC;EACzG;EAEAK,YAAYA,CAACxF,KAAwB,EAAE;IACrC,IAAI,CAACsF,mBAAmB,CAAC,gBAAgB,EAAE,CAAC,IAAI,CAACC,KAAK,EAAE,IAAI,CAAC,CAAC;IAC9D,IAAI,CAAC,IAAI,CAAC3E,KAAK,CAACC,IAAI,CAACO,MAAM,EAAE;MAC3B,OAAO,IAAI;IACb;IACA,IAAIqE,SAAS,GAAC;MAAC9D,CAAC,EAAE,IAAI,CAAC3B,KAAK,CAAC0F,OAAO,KAAK,KAAK,GAAG,IAAI,CAAC9E,KAAK,CAAC+E,SAAS,GAAEC,SAAS;MAAE5E,CAAC,EAAE,IAAI,CAAChB,KAAK,CAAC6F,OAAO,KAAK,KAAK,GAAG,IAAI,CAACjF,KAAK,CAACkF,SAAS,GAAEF;IAAS,CAAC;IACpJ,MAAM3C,UAAU,GAAG,IAAI,CAACrC,KAAK,CAAC0B,MAAM,CAAClB,MAAM,KAAK,CAAC,GAAG,IAAI,CAACR,KAAK,CAAC0B,MAAM,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC1B,KAAK,CAAC0B,MAAM;IAC5F,oBACE7D,KAAA,CAAAoD,aAAA,CAACnD,IAAI;MACHqF,KAAK,EAAE,IAAI,CAACgC,MAAM,CAACC,IAAK;MAACC,QAAQ,EAAE,IAAI,CAACC;IAAmB,GAE3DlG,KAAK,CAACmG,QAAQ,KAAK,KAAK,gBACtB1H,KAAA,CAAAoD,aAAA,CAAC9C,YAAY;MACXqH,KAAK,EAAE,IAAI,CAACxF,KAAK,CAACwF,KAAM;MACxBC,SAAS,EAAEZ,SAAU;MACrBa,MAAM,EAAE,IAAI,CAACP,MAAM,CAACC,IAAI,CAACM,MAAiB;MAC1CjG,KAAK,EAAE,IAAI,CAAC0F,MAAM,CAACC,IAAI,CAAC3F,KAAK,IAAc,IAAI,CAACkG,WAAY;MAC5DC,OAAO,EAAE;QACPC,GAAG,EAAEzG,KAAK,CAAC0G,SAAS;QACpBC,MAAM,EAAE3G,KAAK,CAAC4G,YAAY;QAC1BC,IAAI,EAAE7G,KAAK,CAAC8G,UAAU;QACtBC,KAAK,EAAE/G,KAAK,CAACgH;MACf;IAAE,gBACFvI,KAAA,CAAAoD,aAAA,CAAC5C,aAAa;MACZ8C,IAAI,EAAE,QAAS;MACfkF,kBAAkB,eAAExI,KAAA,CAAAoD,aAAA,CAACjD,GAAG,MAAE,CAAE;MAC5BmF,KAAK,EAAE;QAACmD,KAAK,EAAE;UACbC,UAAU,EAAE,2CAA2C;UACvDnD,QAAQ,EAAE;QACZ;MACA,CAAE;MACFkD,KAAK,EAAE,CAAClH,KAAK,CAACkH,KAAK,EAAElH,KAAK,CAACoH,UAAU,CAAE;MACvCC,WAAW,EAAC,YAAY;MACxBC,MAAM,EAAE,EAAG;MACXzG,IAAI,EAAE,EAAG;MACTuF,KAAK,EAAE,IAAI,CAACxF,KAAK,CAACwF;IAAM,CACzB,CAAC,EACD,IAAI,CAACmB,aAAa,CAACtE,UAAU,CAAC,eAC/BxE,KAAA,CAAAoD,aAAA,CAAC3C,WAAW;MAACsI,SAAS;MACTzD,KAAK,EAAE;QACL0D,UAAU,EAAE;UAAEC,IAAI,EAAE,IAAI,CAAC9G,KAAK,CAACZ,KAAK,CAAC2H,SAAS,KAAK,KAAK,GAAG,aAAa,GAAG,SAAS;UAAG3D,QAAQ,EAAE,EAAE;UAAEwC,OAAO,EAAE,IAAI,CAAC5F,KAAK,CAACZ,KAAK,CAACuD,SAAS,GAAC,CAAC,GAAG;QAAC,CAAC;QAC/IqE,SAAS,EAAE;UAAEpB,OAAO,EAAG,EAAE,GAAG,IAAI,CAAC5F,KAAK,CAACZ,KAAK,CAACuD,SAAS,GAAC;QAAG,CAAC;QAC3DsE,IAAI,EAAE;UAACC,MAAM,EAAE;QAAM;MACvB,CAAE;MACF1B,KAAK,EAAE,IAAI,CAACxF,KAAK,CAACwF,KAAM;MACxB2B,UAAU,EAAE,IAAI,CAACpE,aAAa,CAAC,CAAE;MACjCqE,UAAU,EAAGC,CAAC,IAAK,IAAI,CAACrH,KAAK,CAACZ,KAAK,CAAC8D,MAAM,GAAI,GAAE,IAAI,CAACoE,gBAAgB,CAACD,CAAC,CAAE,GAAE,IAAI,CAACrH,KAAK,CAACZ,KAAK,CAAC8D,MAAO,EAAC,GAAI,GAAE,IAAI,CAACoE,gBAAgB,CAACD,CAAC,CAAE,EAAE;MAACE,aAAa;IAAA,CAAE,CAAC,eACnK1J,KAAA,CAAAoD,aAAA,CAAChD,YAAY;MACXoE,UAAU,EAAEA,UAAW;MACvBmF,UAAU,EAAE,IAAK;MACjBrE,KAAK,EAAE;QACLlD,IAAI,EAAE;UAAEwH,WAAW,EAAE,IAAI,CAACzH,KAAK,CAACZ,KAAK,CAACuD;QAAU;MAClD,CAAE;MACF+E,MAAM,EAAE,CAAC;QACPC,MAAM,EAAE,MAAM;QACdC,aAAa,EAAE7J,QAAQ,CAAC8J,EAAE,IAAI,KAAK,GAAG;UACpCC,OAAO,EAAE,IAAI,CAAChE,QAAQ,CAACiE,IAAI,CAAC,IAAI;QAClC,CAAC,GAAC;UACAC,OAAO,EAAE,IAAI,CAAClE,QAAQ,CAACiE,IAAI,CAAC,IAAI;QAClC;MACF,CAAC;IAAE,GAGD,IAAI,CAACxH,WAAW,CAACnB,KAAK,CAEZ,CACF,CAAC,gBACfvB,KAAA,CAAAoD,aAAA,CAACjD,GAAG;MAACyB,KAAK,EAAE,IAAI,CAACO,KAAK,CAACL,UAAW;MAAC+F,MAAM,EAAE,IAAI,CAAC1F,KAAK,CAACoC;IAAY,gBAChEvE,KAAA,CAAAoD,aAAA,CAAC5C,aAAa;MACZ8C,IAAI,EAAE,QAAS;MACfkF,kBAAkB,eAAExI,KAAA,CAAAoD,aAAA,CAACjD,GAAG,MAAE,CAAE;MAC5BsI,KAAK,EAAE,CAAClH,KAAK,CAACkH,KAAK,EAAElH,KAAK,CAACoH,UAAU,CAAE;MACvCC,WAAW,EAAC,YAAY;MACxBC,MAAM,EAAE,EAAG;MACXzG,IAAI,EAAE,EAAG;MACTuF,KAAK,EAAE,IAAI,CAACxF,KAAK,CAACwF;IAAM,CACzB,CAAC,EACD,IAAI,CAAC5D,WAAW,CAACxC,KAAK,CAAC,EACvB,IAAI,CAACyD,UAAU,CAAC,CACd,CAEH,CAAC;EAEX;AACF"}
+{"version":3,"names":["React","View","Platform","Svg","VictoryStack","VictoryBar","VictoryChart","VictoryPie","VictoryLegend","VictoryAxis","Axis","Scale","orderBy","cloneDeep","WmStackChartProps","DEFAULT_CLASS","BaseChartComponent","BaseChartComponentState","WmStackChartState","constructor","arguments","_defineProperty","WmStackChart","props","e","viewWidth","nativeEvent","layout","width","updateState","chartWidth","componentDidMount","setHeightWidthOnChart","getNegativeValuesArray","negativeValuesArray","state","data","filter","d","y","getPositiveValuesArray","positiveValuesArray","getBarChart","length","negativeValues","concat","currentValue","map","i","d1","x","push","createElement","key","name","cornerRadius","bottomLeft","bottomRight","topLeft","topRight","getColorCodes","colors","reverse","getArcChart","colorScaleArray","maxValue","Math","max","o","radius","min","chartHeight","colorScale","startAngle","endAngle","standalone","origin","innerRadius","thickness","labels","getArcAxis","ticks","getTickValues","axisData","forEach","yunits","style","fontSize","paddingLeft","paddingRight","labelRadius","minValue","scale","getBaseScale","domain","getTicks","unshift","onSelect","event","value","index","label","xaxisDatakeyArr","datum","selectedItem","dataset","selectedChartItem","series","_dataObj","invokeEventCallback","proxy","renderWidget","mindomain","xdomain","chartMinX","undefined","ydomain","chartMinY","styles","root","onLayout","onViewLayoutChange","viewtype","theme","minDomain","height","screenWidth","padding","top","offsettop","bottom","offsetbottom","left","offsetleft","right","offsetright","containerComponent","getTooltip","title","fontFamily","subheading","orientation","gutter","getLegendView","crossAxis","tickLabels","fill","showyaxis","axisLabel","grid","stroke","tickValues","tickFormat","t","abbreviateNumber","dependentAxis","horizontal","strokeWidth","events","target","eventHandlers","OS","onClick","bind","onPress"],"sources":["stack-chart.component.tsx"],"sourcesContent":["import React from 'react';\nimport { LayoutChangeEvent, View, Platform } from 'react-native';\nimport { Svg } from 'react-native-svg';\nimport { VictoryStack, VictoryBar, VictoryChart, VictoryPie, VictoryLegend, VictoryAxis } from 'victory-native';\nimport { Axis, Scale } from 'victory-core';\nimport { orderBy, cloneDeep } from 'lodash';\n\nimport WmStackChartProps from './stack-chart.props';\nimport { DEFAULT_CLASS, WmStackChartStyles } from './stack-chart.styles';\nimport {\n  BaseChartComponent,\n  BaseChartComponentState\n} from '@wavemaker/app-rn-runtime/components/chart/basechart.component';\n\nexport class WmStackChartState extends BaseChartComponentState<WmStackChartProps> {\n  chartWidth = 0;\n}\n\nexport default class WmStackChart extends BaseChartComponent<WmStackChartProps, WmStackChartState, WmStackChartStyles> {\n  constructor(props: WmStackChartProps) {\n    super(props, DEFAULT_CLASS, new WmStackChartProps(), new WmStackChartState());\n  }\n\n  componentDidMount() {\n    super.componentDidMount();\n    this.setHeightWidthOnChart();\n  }\n\n  getNegativeValuesArray() {\n    let negativeValuesArray = cloneDeep(this.state.data[0]).filter((d: any) => d.y < 0);\n    negativeValuesArray = orderBy(negativeValuesArray, 'y', 'desc');\n    return negativeValuesArray;\n  }\n\n  getPositiveValuesArray() {\n    let positiveValuesArray = cloneDeep(this.state.data[0]).filter((d: any) => d.y > 0);\n    positiveValuesArray = orderBy(positiveValuesArray, 'y', 'asc');\n    return positiveValuesArray;\n  }\n\n  getBarChart(props: WmStackChartProps) {\n    if ( this.state.data.length > 0 ) {\n      const negativeValues = cloneDeep(this.getNegativeValuesArray());\n      const data = negativeValues.concat(cloneDeep(this.getPositiveValuesArray()));\n      let currentValue = 0;\n\n      return data.map((d: any, i: number) => {\n        let d1: any = [];\n        d.x = 0;\n        d.y = d.y - currentValue;\n        d1.push(d);\n        currentValue = d.y < 0 && i === negativeValues.length -1 ? 0 : d.y + currentValue;\n        return <VictoryBar key={props.name + '_' + i}\n                           cornerRadius={{bottomLeft:(1), bottomRight:(1), topLeft:(1), topRight:(1)}}\n                           data={d1}/>\n      });\n    }\n  }\n\n  private getColorCodes() {\n      const colors = cloneDeep(this.state.colors);\n      return colors.reverse();\n  }\n\n  getArcChart(props: WmStackChartProps) {\n    if ( this.state.data.length > 0 ) {\n      let data = cloneDeep(this.state.data[0]);\n      const colorScaleArray = this.getColorCodes();\n      const maxValue = Math.max(...data.map((o: any) => o.y));\n      data = orderBy(data, 'y', 'desc');\n      const radius = Math.min(this.state.chartWidth/2, this.state.chartHeight - 50);\n      return data.map((d: any, i: number) => {\n        let d1: any = [];\n        d1.push(d);\n        d1.push({x: d.x, y: maxValue - d.y})\n        return <VictoryPie key={props.name + '_' + i}\n                           radius={radius}\n                           colorScale={[colorScaleArray[i], '#fff0']}\n                           startAngle={-80}\n                           endAngle={80}\n                           cornerRadius={100}\n                           standalone={false}\n                           origin={{x: (this.state.chartWidth/2), y: (this.state.chartHeight - 50)}}\n                           innerRadius={radius - this.state.props.thickness}\n                           labels={[]}\n                           data={d1}/>\n      });\n    }\n  }\n\n  getArcAxis() {\n    const ticks = this.getTickValues();\n    const radius = Math.min(this.state.chartWidth/2, this.state.chartHeight-50);\n    const axisData: any = [];\n    ticks.forEach((d: any, i: any) => {\n      axisData.push({x:  `${this.state.props.yunits}${d}`, y: 1})\n    });\n    return <VictoryPie\n     style={{\n       labels: {\n         fontSize: 12, paddingLeft: 50, paddingRight: 80\n       }}\n     }\n      startAngle={-90}\n      endAngle={90}\n      standalone={false}\n      colorScale={['#fff0']}\n      origin={{x: (this.state.chartWidth/2 - 5), y: (this.state.chartHeight - 50)}}\n      labelRadius={radius - this.state.props.thickness - 20}\n      data={axisData}\n    />\n  }\n\n  onViewLayoutChange = (e: LayoutChangeEvent) => {\n    let viewWidth = e.nativeEvent.layout.width;\n    this.updateState({\n      chartWidth: viewWidth\n    } as WmStackChartState);\n  }\n\n  getTickValues() {\n    let ticks: any = [];\n    if (this.state.data[0].length) {\n      let data = cloneDeep(this.state.data[0]);\n      const maxValue = Math.max(...data.map((o: any) => o.y));\n      const minValue = Math.min(...data.map((o: any) => o.y));\n      const scale = Scale.getBaseScale({}, 'x');\n      scale.domain([minValue > 0 ? 0 : minValue, maxValue]);\n      ticks = Axis.getTicks({}, scale);\n      ticks[ticks.length -1] = maxValue;\n      if ( minValue < 0 ) {\n        if (ticks[0] === 0) {\n          ticks.unshift(minValue);\n        } else {\n          ticks[0] = minValue;\n        }\n      }\n    }\n    return ticks;\n  }\n\n  onSelect(event: any, data: any){\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    let selectedChartItem = [{series: 0, x: data.index, y: value,_dataObj: selectedItem},data.index];\n    this.invokeEventCallback('onSelect', [event.nativeEvent, this.proxy, selectedItem, selectedChartItem ]);\n  }\n\n  renderWidget(props: WmStackChartProps) {\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    const colorScale = this.state.colors.length === 1 ? this.state.colors[0] : this.state.colors;\n    return (\n      <View\n        style={this.styles.root} onLayout={this.onViewLayoutChange}\n      >{\n        props.viewtype === 'Bar' ?\n          <VictoryChart\n            theme={this.state.theme}\n            minDomain={mindomain}\n            height={this.styles.root.height as number}\n            width={this.styles.root.width as number || this.screenWidth}\n            padding={{\n              top: props.offsettop,\n              bottom: props.offsetbottom,\n              left: props.offsetleft,\n              right: props.offsetright\n            }}\n            containerComponent={\n              this.getTooltip(props)\n            }\n            >\n            <VictoryLegend\n              name={'legend'}\n              containerComponent={<Svg />}\n              style={{title: {\n                fontFamily: \"'Helvetica Neue', 'Helvetica', sans-serif\",\n                fontSize: 18\n              }\n              }}\n              title={[props.title, props.subheading]}\n              orientation=\"horizontal\"\n              gutter={20}\n              data={[]}\n              theme={this.state.theme}\n            />\n            {this.getLegendView(colorScale)}\n            <VictoryAxis crossAxis\n                         style={{\n                           tickLabels: { fill: this.state.props.showyaxis === false ? 'transparent' : '#000000',  fontSize: 12, padding: this.state.props.thickness/2 + 5},\n                           axisLabel: { padding: (15 + this.state.props.thickness/2) },\n                           grid: {stroke: 'none'}\n                         }}\n                         theme={this.state.theme}\n                         tickValues={this.getTickValues()}\n                         tickFormat={(t) => this.state.props.yunits ? `${this.abbreviateNumber(t)}${this.state.props.yunits}` : `${this.abbreviateNumber(t)}`} dependentAxis />\n            <VictoryStack\n              colorScale={colorScale}\n              horizontal={true}\n              style={{\n                data: { strokeWidth: this.state.props.thickness }\n              }}\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            >\n              {\n                this.getBarChart(props)\n              }\n            </VictoryStack>\n          </VictoryChart> :\n          <Svg width={this.state.chartWidth} height={this.state.chartHeight}>\n            <VictoryLegend\n              name={'legend'}\n              containerComponent={<Svg />}\n              title={[props.title, props.subheading]}\n              orientation=\"horizontal\"\n              gutter={20}\n              data={[]}\n              theme={this.state.theme}\n            />\n            {this.getArcChart(props)}\n            {this.getArcAxis()}\n          </Svg>\n      }\n      </View>\n    );\n  }\n}\n"],"mappings":"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"}

app-rn-runtime/components/container/tabs/tabs.component.js

@@ -208,7 +208,8 @@ export default class WmTabs extends BaseComponent {
       enableGestures: props.enablegestures,
       style: {
         flexDirection: 'row',
-        flexWrap: 'nowrap'
+        flexWrap: 'nowrap',
+        alignItems: 'flex-start'
       },
       direction: "horizontal",
       ref: r => {
@@ -217,13 +218,13 @@ export default class WmTabs extends BaseComponent {
       handlers: this.animationHandlers
     }, tabPanes.map((p, i) => {
       return /*#__PURE__*/React.createElement(View, {
+        key: `tab-${p.props.title}-${i}`,
         style: {
           width: '100%',
           height: this.styles.root.height ? undefined : 1000000,
           alignSelf: 'flex-start'
         }
       }, /*#__PURE__*/React.createElement(View, {
-        key: `tab-${p.props.title}-${i}`,
         style: {
           width: '100%',
           alignSelf: 'flex-start'

app-rn-runtime/components/container/tabs/tabs.component.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","View","BaseComponent","BaseComponentState","SwipeAnimation","isWebPreviewMode","WmTabsProps","DEFAULT_CLASS","WmTabheader","WmTabsState","constructor","arguments","_defineProperty","WmTabs","props","bounds","e","_this$tabLayout","activeTabIndex","state","selectedTabIndex","w","tabLayout","width","noOfTabs","tabPanes","length","lower","center","upper","onLower","onChange","onUpper","setTabLayout","event","nativeEvent","layout","forceUpdate","goToTab","setTabPaneHeights","index","_nativeEvent$nativeEv","tabPaneHeights","height","setTabShown","tabIndex","callback","tabsShown","setTimeout","updateState","addTabPane","tabPane","i","findIndex","t","name","newIndex","selectTabPane","indexOf","_this$tabLayout2","_this$animationView","undefined","position","animationView","setPosition","then","prev","_this$animationView2","goToLower","next","_this$animationView3","oldIndex","deselectedTab","_onDeselect","selectedTab","_onSelect","invokeEventCallback","proxy","renderSkeleton","Children","toArray","children","filter","item","show","headerData","map","p","title","icon","key","createElement","style","styles","root","borderBottomWidth","onLayout","bind","tabHeader","data","showskeleton","overflow","flexDirection","flexWrap","alignSelf","onPropertyChange","$new","$old","selectedIndex","renderWidget","_background","id","getTestId","onIndexChange","flex","maxHeight","tabContent","enableGestures","enablegestures","direction","ref","r","handlers","animationHandlers"],"sources":["tabs.component.tsx"],"sourcesContent":["import React from 'react';\nimport { LayoutChangeEvent, LayoutRectangle, View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\nimport * as SwipeAnimation from '@wavemaker/app-rn-runtime/gestures/swipe.animation';\nimport { isWebPreviewMode } from '@wavemaker/app-rn-runtime/core/utils';\n\nimport WmTabsProps from './tabs.props';\nimport { DEFAULT_CLASS, WmTabsStyles } from './tabs.styles';\nimport WmTabpane from './tabpane/tabpane.component';\nimport WmTabheader from './tabheader/tabheader.component';\n\nexport class WmTabsState extends BaseComponentState<WmTabsProps> {\n  tabsShown: boolean[] = [];\n  selectedTabIndex: number = 0;\n}\n\nexport default class WmTabs extends BaseComponent<WmTabsProps, WmTabsState, WmTabsStyles> {\n  public tabPanes = [] as WmTabpane[];\n  private newIndex = 0;\n  private tabLayout: LayoutRectangle = null as any;\n  private tabPaneHeights: number[] = [];\n  private animationView: SwipeAnimation.View | null = null as any;\n  private animationHandlers = {\n    bounds: (e) => {\n      const activeTabIndex = this.state.selectedTabIndex,\n            w = this.tabLayout?.width || 0,\n            noOfTabs = this.tabPanes.length;\n      return {\n        lower: -1 * (activeTabIndex - (activeTabIndex === 0 ? 0 : 1)) * w,\n        center: -1 * activeTabIndex * w,\n        upper:  -1 * (activeTabIndex + (activeTabIndex === noOfTabs - 1 ? 0 : 1)) * w\n      };\n    },\n    onLower: (e) => {\n      this.onChange(this.state.selectedTabIndex - 1);\n    },\n    onUpper: (e) => {\n      this.onChange(this.state.selectedTabIndex + 1);\n    }\n  } as SwipeAnimation.Handlers;\n\n  constructor(props: WmTabsProps) {\n    super(props, DEFAULT_CLASS, new WmTabsProps(), new WmTabsState());\n  }\n  \n  setTabLayout(event: LayoutChangeEvent) {\n    this.tabLayout = event.nativeEvent.layout;\n    this.forceUpdate(() => {\n      this.goToTab();\n    });\n  }\n\n  setTabPaneHeights(index: number, nativeEvent: LayoutChangeEvent) {\n    this.tabPaneHeights[index] = nativeEvent.nativeEvent.layout?.height;\n    if (index === this.state.selectedTabIndex) {\n      this.forceUpdate();\n    }\n  }\n\n  setTabShown(tabIndex: number, callback: () => any) {\n    if (!this.state.tabsShown[tabIndex]) {\n      const tabsShown = [...this.state.tabsShown];\n      tabsShown[tabIndex] = true;\n      setTimeout(() => {\n        this.updateState({\n          tabsShown: tabsShown\n        } as WmTabsState, callback);\n      }, 300);\n    } else {\n      callback && callback();\n    }\n  }\n\n  addTabPane(tabPane: WmTabpane) {\n    const i = this.tabPanes.findIndex(t => t.props.name === tabPane.props.name);\n    if (i >= 0) {\n      this.tabPanes[i] = tabPane;\n    } else {\n      this.tabPanes[this.newIndex++] = tabPane;\n    }\n  }\n\n  selectTabPane(tabPane: WmTabpane) {\n    this.goToTab(this.tabPanes.indexOf(tabPane));\n  }\n\n  goToTab(index = this.state.selectedTabIndex) {\n    const position = -1 * index * (this.tabLayout?.width || 0);\n    this.animationView?.setPosition(position)\n      .then(() => this.onChange(index));\n  }\n\n  prev() {\n    this.animationView?.goToLower();\n  }\n\n  next() {\n    this.animationView?.goToLower();\n  }\n\n  onChange(newIndex: number) {\n    if (newIndex < 0 || newIndex >= this.tabPanes.length) {\n      return;\n    }\n    const oldIndex = this.state.selectedTabIndex;\n    const deselectedTab = this.tabPanes[this.state.selectedTabIndex];\n    this.newIndex = newIndex;\n    deselectedTab?._onDeselect();\n    this.updateState({\n      selectedTabIndex: newIndex\n    } as WmTabsState, () => {\n      this.setTabShown(newIndex, () => {\n        const selectedTab = this.tabPanes[newIndex];\n        selectedTab?._onSelect();\n        this.invokeEventCallback('onChange', [{}, this.proxy, newIndex, oldIndex]);\n      });\n    });\n  }\n\n  public renderSkeleton(props: WmTabsProps){\n    const tabPanes =  React.Children.toArray(this.props.children)\n    .filter((item: any, index: number) => item.props.show != false);\n    const headerData = tabPanes.map((p: any, i: number) => \n      ({title: p.props.title || 'Tab Title', icon: '', key:  `tab-${p.props.title}-${i}`}));\n    return(\n      <View style={[this.styles.root, { borderBottomWidth: 0}]}>\n      <View onLayout={this.setTabLayout.bind(this)} style={{width: '100%'}}></View>\n      <WmTabheader\n        styles={this.styles.tabHeader}\n        data={headerData}\n        showskeleton={this.props.showskeleton}\n        selectedTabIndex={this.state.selectedTabIndex}\n      ></WmTabheader>\n      <View \n        //{...this.panResponder.panHandlers}\n        style={{\n          width: '100%',\n          //height: this.tabPaneHeights[this.state.selectedTabIndex],\n          overflow: 'hidden'\n        }} >\n        <View style={{\n          flexDirection: 'row',\n          flexWrap: 'nowrap'\n        }}>\n          {tabPanes.map((p: any, i) => {\n            return (\n            <View\n              key={`tab-${p.props.title}-${i}`}\n              style={{width: '100%', alignSelf: 'flex-start'}}\n              onLayout={this.setTabPaneHeights.bind(this, i)}>\n              {/* {this.state.tabsShown[i] ? p : null} */}\n              {p}\n            </View>);\n          })}\n        </View>\n      </View>\n    </View>\n\n    )\n  }\n\n  public onPropertyChange(name: string, $new: any, $old: any): void {\n    super.onPropertyChange(name, $new, $old);\n    switch(name) {\n      case \"defaultpaneindex\":\n        const selectedIndex = $new || 0;\n        const tabsShown: boolean[] = [];\n        tabsShown[selectedIndex] = true;\n        this.updateState({\n          selectedTabIndex: selectedIndex,\n          tabsShown: tabsShown\n        } as WmTabsState);\n    }\n  }\n  \n  renderWidget(props: WmTabsProps) {\n    const tabPanes =  React.Children.toArray(props.children)\n      .filter((item: any, index: number) => item.props.show != false);\n    const headerData = tabPanes.map((p: any, i: number) => \n      ({title: p.props.title || 'Tab Title', icon: '', key:  `tab-${p.props.title}-${i}`}));\n    return (\n      <View style={this.styles.root}>\n        {this._background}\n        <View onLayout={this.setTabLayout.bind(this)} style={{width: '100%'}}></View>\n        <WmTabheader\n          id={this.getTestId('headers')}\n          styles={this.styles.tabHeader}\n          data={headerData}\n          selectedTabIndex={this.state.selectedTabIndex}\n          onIndexChange={this.goToTab.bind(this)}\n        ></WmTabheader>\n        <View\n          style={[{\n            width: '100%',\n            flex: 1\n          }, this.styles.root.height ? \n          (isWebPreviewMode() ? {'overflow-x': 'hidden','overflow-y': 'auto'} as any : {overflow: 'scroll'}) \n          : {\n            overflow: 'hidden',\n            maxHeight: this.tabPaneHeights[this.state.selectedTabIndex],\n          }, this.styles.tabContent]} >\n          <SwipeAnimation.View \n            enableGestures={props.enablegestures}\n            style={{\n              flexDirection: 'row',\n              flexWrap: 'nowrap'\n            }}\n            direction='horizontal'\n            ref={(r) => {this.animationView = r}}\n            handlers = {this.animationHandlers}\n          >\n            {tabPanes.map((p: any, i) => {\n              return (\n              <View \n                style={{\n                  width: '100%',\n                  height: this.styles.root.height  ? undefined : 1000000,\n                  alignSelf: 'flex-start'}}>\n                <View\n                  key={`tab-${p.props.title}-${i}`}\n                  style={{width: '100%', alignSelf: 'flex-start'}}\n                  onLayout={this.setTabPaneHeights.bind(this, i)}>\n                  {/* {this.state.tabsShown[i] ? p : null} */}\n                  {p}\n                </View>\n              </View>);\n            })}\n          </SwipeAnimation.View>\n        </View>\n      </View>\n    );\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["React","View","BaseComponent","BaseComponentState","SwipeAnimation","isWebPreviewMode","WmTabsProps","DEFAULT_CLASS","WmTabheader","WmTabsState","constructor","arguments","_defineProperty","WmTabs","props","bounds","e","_this$tabLayout","activeTabIndex","state","selectedTabIndex","w","tabLayout","width","noOfTabs","tabPanes","length","lower","center","upper","onLower","onChange","onUpper","setTabLayout","event","nativeEvent","layout","forceUpdate","goToTab","setTabPaneHeights","index","_nativeEvent$nativeEv","tabPaneHeights","height","setTabShown","tabIndex","callback","tabsShown","setTimeout","updateState","addTabPane","tabPane","i","findIndex","t","name","newIndex","selectTabPane","indexOf","_this$tabLayout2","_this$animationView","undefined","position","animationView","setPosition","then","prev","_this$animationView2","goToLower","next","_this$animationView3","oldIndex","deselectedTab","_onDeselect","selectedTab","_onSelect","invokeEventCallback","proxy","renderSkeleton","Children","toArray","children","filter","item","show","headerData","map","p","title","icon","key","createElement","style","styles","root","borderBottomWidth","onLayout","bind","tabHeader","data","showskeleton","overflow","flexDirection","flexWrap","alignSelf","onPropertyChange","$new","$old","selectedIndex","renderWidget","_background","id","getTestId","onIndexChange","flex","maxHeight","tabContent","enableGestures","enablegestures","alignItems","direction","ref","r","handlers","animationHandlers"],"sources":["tabs.component.tsx"],"sourcesContent":["import React from 'react';\nimport { LayoutChangeEvent, LayoutRectangle, View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\nimport * as SwipeAnimation from '@wavemaker/app-rn-runtime/gestures/swipe.animation';\nimport { isWebPreviewMode } from '@wavemaker/app-rn-runtime/core/utils';\n\nimport WmTabsProps from './tabs.props';\nimport { DEFAULT_CLASS, WmTabsStyles } from './tabs.styles';\nimport WmTabpane from './tabpane/tabpane.component';\nimport WmTabheader from './tabheader/tabheader.component';\n\nexport class WmTabsState extends BaseComponentState<WmTabsProps> {\n  tabsShown: boolean[] = [];\n  selectedTabIndex: number = 0;\n}\n\nexport default class WmTabs extends BaseComponent<WmTabsProps, WmTabsState, WmTabsStyles> {\n  public tabPanes = [] as WmTabpane[];\n  private newIndex = 0;\n  private tabLayout: LayoutRectangle = null as any;\n  private tabPaneHeights: number[] = [];\n  private animationView: SwipeAnimation.View | null = null as any;\n  private animationHandlers = {\n    bounds: (e) => {\n      const activeTabIndex = this.state.selectedTabIndex,\n            w = this.tabLayout?.width || 0,\n            noOfTabs = this.tabPanes.length;\n      return {\n        lower: -1 * (activeTabIndex - (activeTabIndex === 0 ? 0 : 1)) * w,\n        center: -1 * activeTabIndex * w,\n        upper:  -1 * (activeTabIndex + (activeTabIndex === noOfTabs - 1 ? 0 : 1)) * w\n      };\n    },\n    onLower: (e) => {\n      this.onChange(this.state.selectedTabIndex - 1);\n    },\n    onUpper: (e) => {\n      this.onChange(this.state.selectedTabIndex + 1);\n    }\n  } as SwipeAnimation.Handlers;\n\n  constructor(props: WmTabsProps) {\n    super(props, DEFAULT_CLASS, new WmTabsProps(), new WmTabsState());\n  }\n  \n  setTabLayout(event: LayoutChangeEvent) {\n    this.tabLayout = event.nativeEvent.layout;\n    this.forceUpdate(() => {\n      this.goToTab();\n    });\n  }\n\n  setTabPaneHeights(index: number, nativeEvent: LayoutChangeEvent) {\n    this.tabPaneHeights[index] = nativeEvent.nativeEvent.layout?.height;\n    if (index === this.state.selectedTabIndex) {\n      this.forceUpdate();\n    }\n  }\n\n  setTabShown(tabIndex: number, callback: () => any) {\n    if (!this.state.tabsShown[tabIndex]) {\n      const tabsShown = [...this.state.tabsShown];\n      tabsShown[tabIndex] = true;\n      setTimeout(() => {\n        this.updateState({\n          tabsShown: tabsShown\n        } as WmTabsState, callback);\n      }, 300);\n    } else {\n      callback && callback();\n    }\n  }\n\n  addTabPane(tabPane: WmTabpane) {\n    const i = this.tabPanes.findIndex(t => t.props.name === tabPane.props.name);\n    if (i >= 0) {\n      this.tabPanes[i] = tabPane;\n    } else {\n      this.tabPanes[this.newIndex++] = tabPane;\n    }\n  }\n\n  selectTabPane(tabPane: WmTabpane) {\n    this.goToTab(this.tabPanes.indexOf(tabPane));\n  }\n\n  goToTab(index = this.state.selectedTabIndex) {\n    const position = -1 * index * (this.tabLayout?.width || 0);\n    this.animationView?.setPosition(position)\n      .then(() => this.onChange(index));\n  }\n\n  prev() {\n    this.animationView?.goToLower();\n  }\n\n  next() {\n    this.animationView?.goToLower();\n  }\n\n  onChange(newIndex: number) {\n    if (newIndex < 0 || newIndex >= this.tabPanes.length) {\n      return;\n    }\n    const oldIndex = this.state.selectedTabIndex;\n    const deselectedTab = this.tabPanes[this.state.selectedTabIndex];\n    this.newIndex = newIndex;\n    deselectedTab?._onDeselect();\n    this.updateState({\n      selectedTabIndex: newIndex\n    } as WmTabsState, () => {\n      this.setTabShown(newIndex, () => {\n        const selectedTab = this.tabPanes[newIndex];\n        selectedTab?._onSelect();\n        this.invokeEventCallback('onChange', [{}, this.proxy, newIndex, oldIndex]);\n      });\n    });\n  }\n\n  public renderSkeleton(props: WmTabsProps){\n    const tabPanes =  React.Children.toArray(this.props.children)\n    .filter((item: any, index: number) => item.props.show != false);\n    const headerData = tabPanes.map((p: any, i: number) => \n      ({title: p.props.title || 'Tab Title', icon: '', key:  `tab-${p.props.title}-${i}`}));\n    return(\n      <View style={[this.styles.root, { borderBottomWidth: 0}]}>\n      <View onLayout={this.setTabLayout.bind(this)} style={{width: '100%'}}></View>\n      <WmTabheader\n        styles={this.styles.tabHeader}\n        data={headerData}\n        showskeleton={this.props.showskeleton}\n        selectedTabIndex={this.state.selectedTabIndex}\n      ></WmTabheader>\n      <View \n        //{...this.panResponder.panHandlers}\n        style={{\n          width: '100%',\n          //height: this.tabPaneHeights[this.state.selectedTabIndex],\n          overflow: 'hidden'\n        }} >\n        <View style={{\n          flexDirection: 'row',\n          flexWrap: 'nowrap'\n        }}>\n          {tabPanes.map((p: any, i) => {\n            return (\n            <View\n              key={`tab-${p.props.title}-${i}`}\n              style={{width: '100%', alignSelf: 'flex-start'}}\n              onLayout={this.setTabPaneHeights.bind(this, i)}>\n              {/* {this.state.tabsShown[i] ? p : null} */}\n              {p}\n            </View>);\n          })}\n        </View>\n      </View>\n    </View>\n\n    )\n  }\n\n  public onPropertyChange(name: string, $new: any, $old: any): void {\n    super.onPropertyChange(name, $new, $old);\n    switch(name) {\n      case \"defaultpaneindex\":\n        const selectedIndex = $new || 0;\n        const tabsShown: boolean[] = [];\n        tabsShown[selectedIndex] = true;\n        this.updateState({\n          selectedTabIndex: selectedIndex,\n          tabsShown: tabsShown\n        } as WmTabsState);\n    }\n  }\n  \n  renderWidget(props: WmTabsProps) {\n    const tabPanes =  React.Children.toArray(props.children)\n      .filter((item: any, index: number) => item.props.show != false);\n    const headerData = tabPanes.map((p: any, i: number) => \n      ({title: p.props.title || 'Tab Title', icon: '', key:  `tab-${p.props.title}-${i}`}));\n    return (\n      <View style={this.styles.root}>\n        {this._background}\n        <View onLayout={this.setTabLayout.bind(this)} style={{width: '100%'}}></View>\n        <WmTabheader\n          id={this.getTestId('headers')}\n          styles={this.styles.tabHeader}\n          data={headerData}\n          selectedTabIndex={this.state.selectedTabIndex}\n          onIndexChange={this.goToTab.bind(this)}\n        ></WmTabheader>\n        <View\n          style={[{\n            width: '100%',\n            flex: 1\n          }, this.styles.root.height ? \n          (isWebPreviewMode() ? {'overflow-x': 'hidden','overflow-y': 'auto'} as any : {overflow: 'scroll'}) \n          : {\n            overflow: 'hidden',\n            maxHeight: this.tabPaneHeights[this.state.selectedTabIndex],\n          }, this.styles.tabContent]} >\n          <SwipeAnimation.View \n            enableGestures={props.enablegestures}\n            style={{\n              flexDirection: 'row',\n              flexWrap: 'nowrap',\n              alignItems: 'flex-start'\n            }}\n            direction='horizontal'\n            ref={(r) => {this.animationView = r}}\n            handlers = {this.animationHandlers}\n          >\n            {tabPanes.map((p: any, i) => {\n              return (\n              <View \n                key={`tab-${p.props.title}-${i}`}\n                style={{\n                  width: '100%',\n                  height: this.styles.root.height  ? undefined : 1000000,\n                  alignSelf: 'flex-start'}}>\n                <View\n                  style={{width: '100%', alignSelf: 'flex-start'}}\n                  onLayout={this.setTabPaneHeights.bind(this, i)}>\n                  {/* {this.state.tabsShown[i] ? p : null} */}\n                  {p}\n                </View>\n              </View>);\n            })}\n          </SwipeAnimation.View>\n        </View>\n      </View>\n    );\n  }\n}\n"],"mappings":"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"}

app-rn-runtime/components/container/wizard/wizard.component.js

@@ -198,14 +198,20 @@ export default class WmWizard extends BaseComponent {
       }]
     })) : null;
   }
-  onPrev(steps) {
+  prev() {
     const index = this.state.currentStep;
+    if (index <= 0) {
+      return;
+    }
     const currentStep = this.steps[index];
     currentStep.invokePrevCB(index);
     this.updateCurrentStep(index - 1);
   }
-  onNext(steps, eventName) {
+  next(eventName) {
     const index = this.state.currentStep;
+    if (index >= this.steps.length - 1) {
+      return;
+    }
     const currentStep = this.steps[index];
     if (eventName === 'skip') {
       currentStep.invokeSkipCB(index);
@@ -214,17 +220,22 @@ export default class WmWizard extends BaseComponent {
     }
     this.updateCurrentStep(index + 1);
   }
-  onDone($event) {
+  done($event) {
+    if (this.state.currentStep !== this.steps.length - 1) {
+      return;
+    }
     this.updateState({
       isDone: true
     });
     this.invokeEventCallback('onDone', [$event, this.proxy]);
   }
-  onCancel() {
+  cancel() {
     this.invokeEventCallback('onCancel', [null, this.proxy]);
   }
-  onSkip(steps) {
-    this.onNext(steps, 'skip');
+  skip() {
+    if (this.steps[this.state.currentStep] && this.steps[this.state.currentStep].props.enableskip) {
+      this.next('skip');
+    }
   }
   renderWidget(props) {
     var _this$state$props$cla;
@@ -247,32 +258,32 @@ export default class WmWizard extends BaseComponent {
       styles: merge({}, this.styles.wizardActions, this.theme.getStyle('btn-default'), this.styles.doneButton),
       id: this.getTestId('donebtn'),
       caption: props.donebtnlabel,
-      onTap: this.onDone.bind(this)
+      onTap: this.done.bind(this)
     }), this.state.currentStep + 1 < this.numberOfSteps && /*#__PURE__*/React.createElement(WmButton, {
       iconclass: 'wi wi-chevron-right',
       styles: merge({}, this.styles.wizardActions, this.theme.getStyle('btn-default'), this.styles.nextButton),
       id: this.getTestId('nextbtn'),
       iconposition: 'right',
       caption: props.nextbtnlabel,
-      onTap: this.onNext.bind(this, this.steps)
+      onTap: this.next.bind(this)
     }), this.state.currentStep > 0 && /*#__PURE__*/React.createElement(WmButton, {
       iconclass: 'wi wi-chevron-left',
       styles: merge({}, this.theme.getStyle('btn-default'), this.styles.wizardActions, this.styles.prevButton),
       caption: props.previousbtnlabel,
       id: this.getTestId('prevbtn'),
-      onTap: this.onPrev.bind(this, this.steps)
+      onTap: this.prev.bind(this)
     }), props.cancelable ? /*#__PURE__*/React.createElement(WmButton, {
       id: this.getTestId('cancelbtn'),
       caption: props.cancelbtnlabel,
       styles: merge({}, this.theme.getStyle('btn-default'), this.styles.wizardActions, this.styles.cancelButton),
-      onTap: this.onCancel.bind(this)
+      onTap: this.cancel.bind(this)
     }) : null, isSkippable && /*#__PURE__*/React.createElement(WmAnchor, {
       iconclass: 'wi wi-chevron-right',
       iconposition: 'right',
       caption: 'Skip',
       id: this.getTestId('skip'),
       styles: merge({}, this.styles.wizardActions, this.styles.skipLink),
-      onTap: this.onSkip.bind(this, this.steps)
+      onTap: this.skip.bind(this)
     })));
   }
 }