@wavemaker/app-rn-runtime 11.5.1-next.40402 → 11.5.1-rc.5400

app-rn-runtime/components/basic/buttongroup/buttongroup.styles.js

@@ -11,8 +11,7 @@ BASE_THEME.registerStyle((themeVariables, addStyle) => {
       borderWidth: 1,
       borderStyle: 'solid',
       borderColor: themeVariables.buttonGrpBorderColor,
-      backgroundColor: themeVariables.buttonGrpBgColor,
-      overflow: 'hidden'
+      backgroundColor: themeVariables.buttonGrpBgColor
     },
     text: {},
     skeleton: {
@@ -34,6 +33,9 @@ BASE_THEME.registerStyle((themeVariables, addStyle) => {
       backgroundColor: 'transparent',
       flex: 1,
       borderColor: themeVariables.buttonGrpBorderColor
+    },
+    text: {
+      color: themeVariables.defaultColor9
     }
   });
   addStyle('btn-group-first-child', '', {

app-rn-runtime/components/basic/buttongroup/buttongroup.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","flexDirection","alignSelf","alignItems","borderRadius","borderWidth","borderStyle","borderColor","buttonGrpBorderColor","backgroundColor","buttonGrpBgColor","overflow","text","skeleton","width","height","borderTopWidth","borderBottomWidth","borderLeftWidth","borderRightWidth","flex"],"sources":["buttongroup.styles.ts"],"sourcesContent":["import BASE_THEME from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { WmButtonStyles } from '../button/button.styles';\nimport { WmSkeletonStyles } from '../skeleton/skeleton.styles';\n\nexport type WmButtongroupStyles = BaseStyles & {\n  skeleton: WmSkeletonStyles\n};\n\nexport const DEFAULT_CLASS = 'app-buttongroup';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n  const defaultStyles: WmButtongroupStyles = defineStyles({\n      root: {\n        flexDirection: 'row',\n        alignSelf: 'flex-start',\n        alignItems: 'center',\n        borderRadius: 100,\n        borderWidth: 1,\n        borderStyle: 'solid',\n        borderColor: themeVariables.buttonGrpBorderColor,\n        backgroundColor: themeVariables.buttonGrpBgColor,\n        overflow: 'hidden'\n      }, \n      text: {},\n      skeleton: {\n        root : {\n          width: '100%',\n          height: 48,\n          borderRadius: 4,\n          borderColor: themeVariables.buttonGrpBorderColor\n        }\n      } as any as WmSkeletonStyles\n  });\n\n\n  addStyle('btn-group-child', '', {\n    root: {\n      borderTopWidth: 0,\n      borderBottomWidth: 0,\n      borderLeftWidth: 1,\n      borderRightWidth: 0,\n      borderRadius: 0,\n      backgroundColor: 'transparent',\n      flex: 1,\n      borderColor: themeVariables.buttonGrpBorderColor,\n    },\n  } as WmButtonStyles);\n  addStyle('btn-group-first-child', '', {\n    root: {\n      borderLeftWidth: 0,\n      borderRadius: 0,\n      backgroundColor: 'transparent',\n      borderColor: themeVariables.buttonGrpBorderColor\n    }\n  } as WmButtonStyles);\n  addStyle(DEFAULT_CLASS, '', defaultStyles);\n});\n"],"mappings":"AAAA,OAAOA,UAAU,MAAM,wCAAwC;AAC/D,SAAqBC,YAAY,QAAQ,+CAA+C;AAQxF,OAAO,MAAMC,aAAa,GAAG,iBAAiB;AAC9CF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACrD,MAAMC,aAAkC,GAAGL,YAAY,CAAC;IACpDM,IAAI,EAAE;MACJC,aAAa,EAAE,KAAK;MACpBC,SAAS,EAAE,YAAY;MACvBC,UAAU,EAAE,QAAQ;MACpBC,YAAY,EAAE,GAAG;MACjBC,WAAW,EAAE,CAAC;MACdC,WAAW,EAAE,OAAO;MACpBC,WAAW,EAAEV,cAAc,CAACW,oBAAoB;MAChDC,eAAe,EAAEZ,cAAc,CAACa,gBAAgB;MAChDC,QAAQ,EAAE;IACZ,CAAC;IACDC,IAAI,EAAE,CAAC,CAAC;IACRC,QAAQ,EAAE;MACRb,IAAI,EAAG;QACLc,KAAK,EAAE,MAAM;QACbC,MAAM,EAAE,EAAE;QACVX,YAAY,EAAE,CAAC;QACfG,WAAW,EAAEV,cAAc,CAACW;MAC9B;IACF;EACJ,CAAC,CAAC;EAGFV,QAAQ,CAAC,iBAAiB,EAAE,EAAE,EAAE;IAC9BE,IAAI,EAAE;MACJgB,cAAc,EAAE,CAAC;MACjBC,iBAAiB,EAAE,CAAC;MACpBC,eAAe,EAAE,CAAC;MAClBC,gBAAgB,EAAE,CAAC;MACnBf,YAAY,EAAE,CAAC;MACfK,eAAe,EAAE,aAAa;MAC9BW,IAAI,EAAE,CAAC;MACPb,WAAW,EAAEV,cAAc,CAACW;IAC9B;EACF,CAAmB,CAAC;EACpBV,QAAQ,CAAC,uBAAuB,EAAE,EAAE,EAAE;IACpCE,IAAI,EAAE;MACJkB,eAAe,EAAE,CAAC;MAClBd,YAAY,EAAE,CAAC;MACfK,eAAe,EAAE,aAAa;MAC9BF,WAAW,EAAEV,cAAc,CAACW;IAC9B;EACF,CAAmB,CAAC;EACpBV,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;AAC5C,CAAC,CAAC"}
+{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","flexDirection","alignSelf","alignItems","borderRadius","borderWidth","borderStyle","borderColor","buttonGrpBorderColor","backgroundColor","buttonGrpBgColor","text","skeleton","width","height","borderTopWidth","borderBottomWidth","borderLeftWidth","borderRightWidth","flex","color","defaultColor9"],"sources":["buttongroup.styles.ts"],"sourcesContent":["import BASE_THEME from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { WmButtonStyles } from '../button/button.styles';\nimport { WmSkeletonStyles } from '../skeleton/skeleton.styles';\n\nexport type WmButtongroupStyles = BaseStyles & {\n  skeleton: WmSkeletonStyles\n};\n\nexport const DEFAULT_CLASS = 'app-buttongroup';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n  const defaultStyles: WmButtongroupStyles = defineStyles({\n      root: {\n        flexDirection: 'row',\n        alignSelf: 'flex-start',\n        alignItems: 'center',\n        borderRadius: 100,\n        borderWidth: 1,\n        borderStyle: 'solid',\n        borderColor: themeVariables.buttonGrpBorderColor,\n        backgroundColor: themeVariables.buttonGrpBgColor\n      }, \n      text: {},\n      skeleton: {\n        root : {\n          width: '100%',\n          height: 48,\n          borderRadius: 4,\n          borderColor: themeVariables.buttonGrpBorderColor\n        }\n      } as any as WmSkeletonStyles\n  });\n\n\n  addStyle('btn-group-child', '', {\n    root: {\n      borderTopWidth: 0,\n      borderBottomWidth: 0,\n      borderLeftWidth: 1,\n      borderRightWidth: 0,\n      borderRadius: 0,\n      backgroundColor: 'transparent',\n      flex: 1,\n      borderColor: themeVariables.buttonGrpBorderColor,\n    },\n    text: {\n      color: themeVariables.defaultColor9,\n    }\n  } as WmButtonStyles);\n  addStyle('btn-group-first-child', '', {\n    root: {\n      borderLeftWidth: 0,\n      borderRadius: 0,\n      backgroundColor: 'transparent',\n      borderColor: themeVariables.buttonGrpBorderColor\n    }\n  } as WmButtonStyles);\n  addStyle(DEFAULT_CLASS, '', defaultStyles);\n});\n"],"mappings":"AAAA,OAAOA,UAAU,MAAM,wCAAwC;AAC/D,SAAqBC,YAAY,QAAQ,+CAA+C;AAQxF,OAAO,MAAMC,aAAa,GAAG,iBAAiB;AAC9CF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACrD,MAAMC,aAAkC,GAAGL,YAAY,CAAC;IACpDM,IAAI,EAAE;MACJC,aAAa,EAAE,KAAK;MACpBC,SAAS,EAAE,YAAY;MACvBC,UAAU,EAAE,QAAQ;MACpBC,YAAY,EAAE,GAAG;MACjBC,WAAW,EAAE,CAAC;MACdC,WAAW,EAAE,OAAO;MACpBC,WAAW,EAAEV,cAAc,CAACW,oBAAoB;MAChDC,eAAe,EAAEZ,cAAc,CAACa;IAClC,CAAC;IACDC,IAAI,EAAE,CAAC,CAAC;IACRC,QAAQ,EAAE;MACRZ,IAAI,EAAG;QACLa,KAAK,EAAE,MAAM;QACbC,MAAM,EAAE,EAAE;QACVV,YAAY,EAAE,CAAC;QACfG,WAAW,EAAEV,cAAc,CAACW;MAC9B;IACF;EACJ,CAAC,CAAC;EAGFV,QAAQ,CAAC,iBAAiB,EAAE,EAAE,EAAE;IAC9BE,IAAI,EAAE;MACJe,cAAc,EAAE,CAAC;MACjBC,iBAAiB,EAAE,CAAC;MACpBC,eAAe,EAAE,CAAC;MAClBC,gBAAgB,EAAE,CAAC;MACnBd,YAAY,EAAE,CAAC;MACfK,eAAe,EAAE,aAAa;MAC9BU,IAAI,EAAE,CAAC;MACPZ,WAAW,EAAEV,cAAc,CAACW;IAC9B,CAAC;IACDG,IAAI,EAAE;MACJS,KAAK,EAAEvB,cAAc,CAACwB;IACxB;EACF,CAAmB,CAAC;EACpBvB,QAAQ,CAAC,uBAAuB,EAAE,EAAE,EAAE;IACpCE,IAAI,EAAE;MACJiB,eAAe,EAAE,CAAC;MAClBb,YAAY,EAAE,CAAC;MACfK,eAAe,EAAE,aAAa;MAC9BF,WAAW,EAAEV,cAAc,CAACW;IAC9B;EACF,CAAmB,CAAC;EACpBV,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;AAC5C,CAAC,CAAC"}

app-rn-runtime/components/basic/label/label.component.js

@@ -115,8 +115,7 @@ export default class WmLabel extends BaseComponent {
         color: props.isValid === false ? 'red' : this.styles.text.color
       }],
       numberOfLines: props.wrap ? undefined : 1,
-      selectable: this.styles.text.userSelect === 'text',
-      ellipsizeMode: "tail"
+      selectable: this.styles.text.userSelect === 'text'
     }, toString(part.text), props.required && this.getAsterisk())))))) : null;
   }
 }

app-rn-runtime/components/basic/label/label.component.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Text","View","BaseComponent","BaseComponentState","Tappable","WmLabelProps","DEFAULT_CLASS","isNil","toString","Animatedview","createSkeleton","WmAnchor","WmLabelState","constructor","arguments","_defineProperty","WmLabel","props","getAsterisk","createElement","style","styles","asterisk","onPropertyChange","name","$new","$old","updateState","parts","parseCaption","getMultilineSkeleton","width","height","borderRadius","marginBottom","theme","skeleton","caption","pattern","linkRegex","captionSplit","split","i","length","isLink","test","part","isNextTextALink","text","link","push","renderSkeleton","_this$styles$root","_this$styles$root2","skeletonWidth","skeletonwidth","root","skeletonHeight","skeletonheight","fontSize","multilineskeleton","renderWidget","_this$state$parts","entryanimation","animation","_background","target","flex","flexWrap","state","map","index","Fragment","key","hyperlink","color","isValid","numberOfLines","wrap","undefined","selectable","userSelect","ellipsizeMode","required"],"sources":["label.component.tsx"],"sourcesContent":["import React from 'react';\nimport { DimensionValue, Text, View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';\n\nimport WmLabelProps from './label.props';\nimport { DEFAULT_CLASS, WmLabelStyles } from './label.styles';\nimport { isNil, toString } from 'lodash-es';\nimport { Animatedview } from '@wavemaker/app-rn-runtime/components/basic/animatedview.component';\nimport WmSkeleton, { createSkeleton } from '../skeleton/skeleton.component';\nimport { totalMonths } from 'react-native-paper-dates/lib/typescript/Date/dateUtils';\nimport WmAnchor from '../anchor/anchor.component';\n\ntype PartType = {\n  text?: string,\n  link?: string,\n};\n\nexport class WmLabelState extends BaseComponentState<WmLabelProps> {\n  parts: PartType[] = []\n}\n\nexport default class WmLabel extends BaseComponent<WmLabelProps, WmLabelState, WmLabelStyles> {\n\n  constructor(props: WmLabelProps) {\n    super(props, DEFAULT_CLASS, new WmLabelProps(), new WmLabelState());\n  }\n\n  private getAsterisk () {\n    return <Text style={this.styles.asterisk}>*</Text>;\n  }\n\n  public onPropertyChange(name: string, $new: any, $old: any): void {\n    super.onPropertyChange(name, $new, $old);\n\n    switch(name) {\n      case \"caption\":\n        this.updateState({\n          parts: this.parseCaption($new)\n        } as WmLabelState);\n        break;\n    }\n  }\n  private getMultilineSkeleton(width: any, height: any) {\n    const styles = {\n      borderRadius:4,\n      marginBottom: 10,\n      height: height\n    };\n    return createSkeleton(this.theme, this.styles.skeleton, {\n      ...styles,\n      width: width,\n      height: height\n    });\n  }\n\n  parseCaption(caption: string) {\n    if (!caption) {\n      return [];\n    }\n    caption += '';\n    const pattern = /\\[([^\\]]+)\\]\\((http.*?[^)])\\)/g;\n    const linkRegex = /^(http|https):\\/\\/[^ \"]+$/;\n    const captionSplit = caption.split(pattern);\n\n    let parts = [];\n\n    for (let i = 0; i < captionSplit.length; i++) {\n      const isLink = linkRegex.test(captionSplit[i]);\n      let part: PartType = {};\n      \n      const isNextTextALink = linkRegex.test(captionSplit[i + 1]) || false;\n      if (isLink) {\n        part.text = captionSplit[i - 1] ?? '';\n        part.link = captionSplit[i];\n      } else {\n        part.text = isNextTextALink ? \"\" : captionSplit[i];\n      };\n\n      if (part.text) {\n        parts.push(part);\n      }\n    }\n\n    return parts;\n  }\n\n  public renderSkeleton(props: WmLabelProps){\n    const skeletonWidth = this.props.skeletonwidth || this.styles.root?.width;\n    const skeletonHeight = this.props.skeletonheight || this.styles.root?.height || this.styles.text.fontSize;\n    if(this.props.multilineskeleton) {\n      return (<View style={{\n        width: skeletonWidth as DimensionValue\n      }}>\n        {this.getMultilineSkeleton('100%', skeletonHeight)}\n        {this.getMultilineSkeleton('70%', skeletonHeight)}\n        {this.getMultilineSkeleton('40%', skeletonHeight)}\n      </View>)\n    }\n    else{\n      return createSkeleton(this.theme, this.styles.skeleton, {\n        ...this.styles.root,\n        width: skeletonWidth as DimensionValue,\n        height: skeletonHeight as DimensionValue\n      });  \n    }\n  }\n\n  renderWidget(props: WmLabelProps) {\n    return !isNil(props.caption) ? (\n      <Animatedview entryanimation={props.animation} style={this.styles.root}>\n        {this._background}\n        <Tappable target={this}>\n          <Text style={{flex: 1, flexWrap: \"wrap\"}}>\n            {this.state.parts?.map((part, index) => (\n              <React.Fragment key={`part_${index}`}>\n                {part.link ? (\n                  <WmAnchor styles={this.styles.link} caption={part.text} hyperlink={part.link} />\n                ) : (\n                  <Text\n                    style={[\n                      this.styles.text,\n                      {\n                        color:\n                          props.isValid === false\n                            ? 'red'\n                            : this.styles.text.color,\n                      },\n                    ]}\n                    numberOfLines={props.wrap ? undefined : 1}\n                    selectable={this.styles.text.userSelect === 'text'}\n                    ellipsizeMode=\"tail\"\n                  >\n                    {toString(part.text)}\n                    {props.required && this.getAsterisk()}\n                  </Text>\n                )}\n              </React.Fragment>\n            ))}\n          </Text>\n        </Tappable>\n      </Animatedview>\n    ) : null;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["React","Text","View","BaseComponent","BaseComponentState","Tappable","WmLabelProps","DEFAULT_CLASS","isNil","toString","Animatedview","createSkeleton","WmAnchor","WmLabelState","constructor","arguments","_defineProperty","WmLabel","props","getAsterisk","createElement","style","styles","asterisk","onPropertyChange","name","$new","$old","updateState","parts","parseCaption","getMultilineSkeleton","width","height","borderRadius","marginBottom","theme","skeleton","caption","pattern","linkRegex","captionSplit","split","i","length","isLink","test","part","isNextTextALink","text","link","push","renderSkeleton","_this$styles$root","_this$styles$root2","skeletonWidth","skeletonwidth","root","skeletonHeight","skeletonheight","fontSize","multilineskeleton","renderWidget","_this$state$parts","entryanimation","animation","_background","target","flex","flexWrap","state","map","index","Fragment","key","hyperlink","color","isValid","numberOfLines","wrap","undefined","selectable","userSelect","required"],"sources":["label.component.tsx"],"sourcesContent":["import React from 'react';\nimport { DimensionValue, Text, View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';\n\nimport WmLabelProps from './label.props';\nimport { DEFAULT_CLASS, WmLabelStyles } from './label.styles';\nimport { isNil, toString } from 'lodash-es';\nimport { Animatedview } from '@wavemaker/app-rn-runtime/components/basic/animatedview.component';\nimport WmSkeleton, { createSkeleton } from '../skeleton/skeleton.component';\nimport { totalMonths } from 'react-native-paper-dates/lib/typescript/Date/dateUtils';\nimport WmAnchor from '../anchor/anchor.component';\n\ntype PartType = {\n  text?: string,\n  link?: string,\n};\n\nexport class WmLabelState extends BaseComponentState<WmLabelProps> {\n  parts: PartType[] = []\n}\n\nexport default class WmLabel extends BaseComponent<WmLabelProps, WmLabelState, WmLabelStyles> {\n\n  constructor(props: WmLabelProps) {\n    super(props, DEFAULT_CLASS, new WmLabelProps(), new WmLabelState());\n  }\n\n  private getAsterisk () {\n    return <Text style={this.styles.asterisk}>*</Text>;\n  }\n\n  public onPropertyChange(name: string, $new: any, $old: any): void {\n    super.onPropertyChange(name, $new, $old);\n\n    switch(name) {\n      case \"caption\":\n        this.updateState({\n          parts: this.parseCaption($new)\n        } as WmLabelState);\n        break;\n    }\n  }\n  private getMultilineSkeleton(width: any, height: any) {\n    const styles = {\n      borderRadius:4,\n      marginBottom: 10,\n      height: height\n    };\n    return createSkeleton(this.theme, this.styles.skeleton, {\n      ...styles,\n      width: width,\n      height: height\n    });\n  }\n\n  parseCaption(caption: string) {\n    if (!caption) {\n      return [];\n    }\n    caption += '';\n    const pattern = /\\[([^\\]]+)\\]\\((http.*?[^)])\\)/g;\n    const linkRegex = /^(http|https):\\/\\/[^ \"]+$/;\n    const captionSplit = caption.split(pattern);\n\n    let parts = [];\n\n    for (let i = 0; i < captionSplit.length; i++) {\n      const isLink = linkRegex.test(captionSplit[i]);\n      let part: PartType = {};\n      \n      const isNextTextALink = linkRegex.test(captionSplit[i + 1]) || false;\n      if (isLink) {\n        part.text = captionSplit[i - 1] ?? '';\n        part.link = captionSplit[i];\n      } else {\n        part.text = isNextTextALink ? \"\" : captionSplit[i];\n      };\n\n      if (part.text) {\n        parts.push(part);\n      }\n    }\n\n    return parts;\n  }\n\n  public renderSkeleton(props: WmLabelProps){\n    const skeletonWidth = this.props.skeletonwidth || this.styles.root?.width;\n    const skeletonHeight = this.props.skeletonheight || this.styles.root?.height || this.styles.text.fontSize;\n    if(this.props.multilineskeleton) {\n      return (<View style={{\n        width: skeletonWidth as DimensionValue\n      }}>\n        {this.getMultilineSkeleton('100%', skeletonHeight)}\n        {this.getMultilineSkeleton('70%', skeletonHeight)}\n        {this.getMultilineSkeleton('40%', skeletonHeight)}\n      </View>)\n    }\n    else{\n      return createSkeleton(this.theme, this.styles.skeleton, {\n        ...this.styles.root,\n        width: skeletonWidth as DimensionValue,\n        height: skeletonHeight as DimensionValue\n      });  \n    }\n  }\n\n  renderWidget(props: WmLabelProps) {\n    return !isNil(props.caption) ? (\n      <Animatedview entryanimation={props.animation} style={this.styles.root}>\n        {this._background}\n        <Tappable target={this}>\n          <Text style={{flex: 1, flexWrap: \"wrap\"}}>\n            {this.state.parts?.map((part, index) => (\n              <React.Fragment key={`part_${index}`}>\n                {part.link ? (\n                  <WmAnchor styles={this.styles.link} caption={part.text} hyperlink={part.link} />\n                ) : (\n                  <Text\n                    style={[\n                      this.styles.text,\n                      {\n                        color:\n                          props.isValid === false\n                            ? 'red'\n                            : this.styles.text.color,\n                      },\n                    ]}\n                    numberOfLines={props.wrap ? undefined : 1}\n                    selectable={this.styles.text.userSelect === 'text'}\n                  >\n                    {toString(part.text)}\n                    {props.required && this.getAsterisk()}\n                  </Text>\n                )}\n              </React.Fragment>\n            ))}\n          </Text>\n        </Tappable>\n      </Animatedview>\n    ) : null;\n  }\n}\n"],"mappings":"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"}

app-rn-runtime/components/basic/label/label.props.js

@@ -10,7 +10,6 @@ export default class WmLabelProps extends BaseProps {
     _defineProperty(this, "required", null);
     _defineProperty(this, "isValid", true);
     _defineProperty(this, "wrap", true);
-    _defineProperty(this, "noOfLines", 1);
     _defineProperty(this, "skeletonheight", null);
     _defineProperty(this, "skeletonwidth", null);
     _defineProperty(this, "multilineskeleton", false);

app-rn-runtime/components/basic/label/label.props.js.map

@@ -1 +1 @@
-{"version":3,"names":["BaseProps","WmLabelProps","constructor","arguments","_defineProperty"],"sources":["label.props.ts"],"sourcesContent":["import { BaseProps } from '@wavemaker/app-rn-runtime/core/base.component';\n\nexport default class WmLabelProps extends BaseProps {\n    animation?: string = null as any;\n    caption?: string = 'Label';\n    required?: boolean = null as any;\n    isValid?: boolean = true;\n    wrap?: boolean = true;\n    noOfLines?: any = 1;\n    skeletonheight?: string = null as any;\n    skeletonwidth?: string = null as any;\n    multilineskeleton?: boolean = false;\n}\n"],"mappings":";;;AAAA,SAASA,SAAS,QAAQ,+CAA+C;AAEzE,eAAe,MAAMC,YAAY,SAASD,SAAS,CAAC;EAAAE,YAAA;IAAA,SAAAC,SAAA;IAAAC,eAAA,oBAC3B,IAAI;IAAAA,eAAA,kBACN,OAAO;IAAAA,eAAA,mBACL,IAAI;IAAAA,eAAA,kBACL,IAAI;IAAAA,eAAA,eACP,IAAI;IAAAA,eAAA,oBACH,CAAC;IAAAA,eAAA,yBACO,IAAI;IAAAA,eAAA,wBACL,IAAI;IAAAA,eAAA,4BACC,KAAK;EAAA;AACvC"}
+{"version":3,"names":["BaseProps","WmLabelProps","constructor","arguments","_defineProperty"],"sources":["label.props.ts"],"sourcesContent":["import { BaseProps } from '@wavemaker/app-rn-runtime/core/base.component';\n\nexport default class WmLabelProps extends BaseProps {\n    animation?: string = null as any;\n    caption?: string = 'Label';\n    required?: boolean = null as any;\n    isValid?: boolean = true;\n    wrap?: boolean = true;\n    skeletonheight?: string = null as any;\n    skeletonwidth?: string = null as any;\n    multilineskeleton?: boolean = false;\n}\n"],"mappings":";;;AAAA,SAASA,SAAS,QAAQ,+CAA+C;AAEzE,eAAe,MAAMC,YAAY,SAASD,SAAS,CAAC;EAAAE,YAAA;IAAA,SAAAC,SAAA;IAAAC,eAAA,oBAC3B,IAAI;IAAAA,eAAA,kBACN,OAAO;IAAAA,eAAA,mBACL,IAAI;IAAAA,eAAA,kBACL,IAAI;IAAAA,eAAA,eACP,IAAI;IAAAA,eAAA,yBACK,IAAI;IAAAA,eAAA,wBACL,IAAI;IAAAA,eAAA,4BACC,KAAK;EAAA;AACvC"}

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

@@ -2,13 +2,14 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 import React from 'react';
-import { Text, View } from 'react-native';
-import { Defs, LinearGradient, Stop } from 'react-native-svg';
-import { VictoryArea, VictoryChart, VictoryStack, VictoryScatter, VictoryGroup } from "victory-native";
+import Color from "color";
+import { View } from 'react-native';
+import { Defs, LinearGradient, Stop, Svg } from 'react-native-svg';
+import { VictoryArea, VictoryChart, VictoryLegend, VictoryStack, VictoryScatter, VictoryGroup } from "victory-native";
 import WmAreaChartProps from './area-chart.props';
 import { DEFAULT_CLASS } from './area-chart.styles';
 import { BaseChartComponent, BaseChartComponentState } from "@wavemaker/app-rn-runtime/components/chart/basechart.component";
-import WmIcon from "@wavemaker/app-rn-runtime/components/basic/icon/icon.component";
+import { isNumber } from 'lodash-es';
 export class WmAreaChartState extends BaseChartComponentState {
   constructor() {
     super(...arguments);
@@ -31,26 +32,18 @@ export default class WmAreaChart extends BaseChartComponent {
       return null;
     }
     let mindomain = {
-      x: this.props.xdomain === 'Min' ? this.state.chartMinX : undefined,
-      y: this.props.ydomain === 'Min' ? this.state.chartMinY : undefined
+      x: props.xdomain === 'Min' ? this.state.chartMinX : undefined,
+      y: props.ydomain === 'Min' ? this.state.chartMinY : undefined
     };
     const chartName = this.props.name ?? 'nonameAreachart';
+    let gradientStop = '100%';
+    if (isNumber(this.state.chartMaxY) && isNumber(this.state.chartMinY) && this.state.chartMaxY > 0) {
+      gradientStop = (this.state.chartMaxY - this.state.chartMinY) * 100 / this.state.chartMaxY + '%';
+    }
     return /*#__PURE__*/React.createElement(View, {
       style: this.styles.root,
       onLayout: this.onViewLayoutChange.bind(this)
-    }, /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, {
-      style: {
-        flexDirection: 'row',
-        alignItems: 'center'
-      }
-    }, props.iconclass ? /*#__PURE__*/React.createElement(WmIcon, {
-      iconclass: props.iconclass,
-      styles: this.styles.icon
-    }) : null, /*#__PURE__*/React.createElement(Text, {
-      style: this.styles.title
-    }, props.title)), /*#__PURE__*/React.createElement(Text, {
-      style: this.styles.subHeading
-    }, props.subheading)), this.state.chartWidth ? /*#__PURE__*/React.createElement(VictoryChart, {
+    }, this.state.chartWidth ? /*#__PURE__*/React.createElement(VictoryChart, {
       theme: this.state.theme,
       height: this.styles.root.height,
       width: this.state.chartWidth || 120,
@@ -58,10 +51,18 @@ export default class WmAreaChart extends BaseChartComponent {
         top: 70,
         bottom: 50,
         left: 50,
-        right: 50
+        right: 30
       },
       minDomain: mindomain
-    }, this.getLegendView(), this.getXaxis(), this.getYAxis(), /*#__PURE__*/React.createElement(VictoryStack, null, this.state.data.map((d, i) => {
+    }, /*#__PURE__*/React.createElement(VictoryLegend, {
+      name: 'legend',
+      containerComponent: /*#__PURE__*/React.createElement(Svg, null),
+      title: [props.title, props.subheading],
+      orientation: "horizontal",
+      gutter: 20,
+      data: [],
+      theme: this.state.theme
+    }), this.getLegendView(), this.getXaxis(), this.getYAxis(), /*#__PURE__*/React.createElement(VictoryStack, null, this.state.data.map((d, i) => {
       return /*#__PURE__*/React.createElement(VictoryGroup, {
         key: props.name + '_area_group_' + i
       }, /*#__PURE__*/React.createElement(Defs, null, /*#__PURE__*/React.createElement(LinearGradient, {
@@ -72,18 +73,18 @@ export default class WmAreaChart extends BaseChartComponent {
         y2: "100%"
       }, /*#__PURE__*/React.createElement(Stop, {
         offset: "0%",
-        stopColor: this.state.colors[i]
+        stopColor: Color(this.state.colors[i]).lighten(0.2).rgb().toString()
       }), /*#__PURE__*/React.createElement(Stop, {
-        offset: "100%",
-        stopColor: '#ffffff00',
-        stopOpacity: "0"
+        offset: gradientStop,
+        stopColor: Color(this.state.colors[i]).lighten(0.6).rgb().toString()
       }))), /*#__PURE__*/React.createElement(VictoryArea, {
         interpolation: props.interpolation,
         key: props.name + '_' + i,
         style: {
           data: {
             fill: `url(#${chartName}Gradient${i})`,
-            stroke: this.state.colors[i]
+            stroke: this.state.colors[i],
+            strokeWidth: props.linethickness
           }
         },
         data: d
@@ -92,8 +93,7 @@ export default class WmAreaChart extends BaseChartComponent {
         key: props.name + '_scatter' + i,
         style: {
           data: {
-            fill: this.state.colors[i],
-            opacity: 0.8
+            fill: Color(this.state.colors[i]).darken(0.2).rgb().toString()
           }
         },
         data: d

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

@@ -1 +1 @@
-{"version":3,"names":["React","Text","View","Defs","LinearGradient","Stop","VictoryArea","VictoryChart","VictoryStack","VictoryScatter","VictoryGroup","WmAreaChartProps","DEFAULT_CLASS","BaseChartComponent","BaseChartComponentState","WmIcon","WmAreaChartState","constructor","arguments","_defineProperty","WmAreaChart","props","e","viewWidth","nativeEvent","layout","width","updateState","chartWidth","renderWidget","_this$state$data","state","data","length","mindomain","x","xdomain","chartMinX","undefined","y","ydomain","chartMinY","chartName","name","createElement","style","styles","root","onLayout","onViewLayoutChange","bind","flexDirection","alignItems","iconclass","icon","title","subHeading","subheading","theme","height","padding","top","bottom","left","right","minDomain","getLegendView","getXaxis","getYAxis","map","d","i","key","id","x1","y1","x2","y2","offset","stopColor","colors","stopOpacity","interpolation","fill","stroke","highlightpoints","size","opacity"],"sources":["area-chart.component.tsx"],"sourcesContent":["import React from 'react';\nimport { LayoutChangeEvent, Text, View } from 'react-native';\nimport { Defs, LinearGradient, Stop, Svg } from 'react-native-svg';\nimport { VictoryArea, VictoryChart, VictoryLegend, VictoryStack, VictoryScatter, VictoryGroup } from \"victory-native\";\nimport { InterpolationPropType } from 'victory-core';\nimport WmAreaChartProps from './area-chart.props';\nimport { DEFAULT_CLASS, WmAreaChartStyles } from './area-chart.styles';\nimport {\n  BaseChartComponent,\n  BaseChartComponentState\n} from \"@wavemaker/app-rn-runtime/components/chart/basechart.component\";\nimport WmIcon from \"@wavemaker/app-rn-runtime/components/basic/icon/icon.component\";\n\n\nexport class WmAreaChartState extends BaseChartComponentState<WmAreaChartProps> {\n  chartWidth = 0;\n}\n\nexport default class WmAreaChart extends BaseChartComponent<WmAreaChartProps, WmAreaChartState, WmAreaChartStyles> {\n\n  constructor(props: WmAreaChartProps) {\n    super(props, DEFAULT_CLASS, new WmAreaChartProps(), new WmAreaChartState());\n  }\n\n  onViewLayoutChange = (e: LayoutChangeEvent) => {\n    let viewWidth = e.nativeEvent.layout.width;\n    this.updateState({\n      chartWidth: viewWidth\n    } as WmAreaChartState)\n  }\n\n  renderWidget(props: WmAreaChartProps) {\n    if (!this.state.data?.length) {\n      return null;\n    }\n    let mindomain={\n      x: this.props.xdomain === 'Min' ? this.state.chartMinX: undefined,\n      y: this.props.ydomain === 'Min' ? this.state.chartMinY: undefined\n    };\n    const chartName = this.props.name ?? 'nonameAreachart';\n    return (\n      <View\n        style={this.styles.root}\n        onLayout={this.onViewLayoutChange.bind(this)}\n      >\n        <View>\n          <View style={{flexDirection: 'row', alignItems: 'center'}}>\n            {props.iconclass ? (<WmIcon iconclass={props.iconclass} styles={this.styles.icon}></WmIcon>) : null }\n            <Text style={this.styles.title}>{props.title}</Text>\n          </View>\n          <Text style={this.styles.subHeading}>{props.subheading}</Text>\n        </View>\n        {this.state.chartWidth ? \n        (\n          <VictoryChart\n            theme={this.state.theme}\n            height={this.styles.root.height as number}\n            width={this.state.chartWidth || 120}\n            padding={{ top: 70, bottom: 50, left: 50, right: 50 }}\n            minDomain={mindomain}\n          > \n            {this.getLegendView()}\n            {this.getXaxis()}\n            {this.getYAxis()}\n            <VictoryStack>\n            {\n              this.state.data.map((d: any, i: number) => {\n                return <VictoryGroup key={props.name + '_area_group_' + i}>\n                  <Defs>\n                    <LinearGradient id={`${chartName}Gradient${i}`} x1=\"0%\" y1=\"0%\" x2=\"0%\" y2=\"100%\">\n                      <Stop offset=\"0%\" stopColor={this.state.colors[i]}/>\n                      <Stop offset=\"100%\" stopColor={'#ffffff00'} stopOpacity=\"0\"/>\n                    </LinearGradient>\n                  </Defs>\n                  <VictoryArea\n                    interpolation={props.interpolation as InterpolationPropType}\n                    key={props.name + '_' + i}\n                    style={{\n                      data: {\n                        fill: `url(#${chartName}Gradient${i})`,\n                        stroke: this.state.colors[i]\n                      }\n                    }}\n                    data={d}\n                  />\n                  {props.highlightpoints ?\n                    <VictoryScatter\n                      size={5}\n                      key={props.name + '_scatter' + i}\n                      style={{\n                        data: { fill: this.state.colors[i], opacity: 0.8}\n                      }}\n                      data={d}/>\n                  : null}\n                </VictoryGroup>\n              })\n            }\n            </VictoryStack>\n          </VictoryChart>\n        )\n      : null}\n    </View>);\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["React","Color","View","Defs","LinearGradient","Stop","Svg","VictoryArea","VictoryChart","VictoryLegend","VictoryStack","VictoryScatter","VictoryGroup","WmAreaChartProps","DEFAULT_CLASS","BaseChartComponent","BaseChartComponentState","isNumber","WmAreaChartState","constructor","arguments","_defineProperty","WmAreaChart","props","e","viewWidth","nativeEvent","layout","width","updateState","chartWidth","renderWidget","_this$state$data","state","data","length","mindomain","x","xdomain","chartMinX","undefined","y","ydomain","chartMinY","chartName","name","gradientStop","chartMaxY","createElement","style","styles","root","onLayout","onViewLayoutChange","bind","theme","height","padding","top","bottom","left","right","minDomain","containerComponent","title","subheading","orientation","gutter","getLegendView","getXaxis","getYAxis","map","d","i","key","id","x1","y1","x2","y2","offset","stopColor","colors","lighten","rgb","toString","interpolation","fill","stroke","strokeWidth","linethickness","highlightpoints","size","darken"],"sources":["area-chart.component.tsx"],"sourcesContent":["import React from 'react';\nimport Color from \"color\";\nimport { LayoutChangeEvent, View, Text } from 'react-native';\nimport { Defs, LinearGradient, Stop, Svg } from 'react-native-svg';\nimport { VictoryArea, VictoryLine, VictoryChart, VictoryLegend, VictoryStack, VictoryScatter, VictoryGroup } from \"victory-native\";\nimport { InterpolationPropType } from 'victory-core';\nimport WmAreaChartProps from './area-chart.props';\nimport { DEFAULT_CLASS, WmAreaChartStyles } from './area-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 { isNil, isNumber } from 'lodash-es';\n\nexport class WmAreaChartState extends BaseChartComponentState<WmAreaChartProps> {\n  chartWidth = 0;\n}\n\nexport default class WmAreaChart extends BaseChartComponent<WmAreaChartProps, WmAreaChartState, WmAreaChartStyles> {\n\n  constructor(props: WmAreaChartProps) {\n    super(props, DEFAULT_CLASS, new WmAreaChartProps(), new WmAreaChartState());\n  }\n\n  onViewLayoutChange = (e: LayoutChangeEvent) => {\n    let viewWidth = e.nativeEvent.layout.width;\n    this.updateState({\n      chartWidth: viewWidth\n    } as WmAreaChartState)\n  }\n\n  renderWidget(props: WmAreaChartProps) {\n    if (!this.state.data?.length) {\n      return null;\n    }\n    let mindomain={\n      x: props.xdomain === 'Min' ? this.state.chartMinX: undefined,\n      y: props.ydomain === 'Min' ? this.state.chartMinY: undefined\n    };\n    const chartName = this.props.name ?? 'nonameAreachart';\n    let gradientStop = '100%';\n    if (isNumber(this.state.chartMaxY) && isNumber(this.state.chartMinY) && this.state.chartMaxY > 0) {\n      gradientStop = (this.state.chartMaxY - this.state.chartMinY) * 100 / this.state.chartMaxY + '%';\n    }\n    return (\n      <View\n        style={this.styles.root}\n        onLayout={this.onViewLayoutChange.bind(this)}\n      >\n        {this.state.chartWidth ? \n        (\n          <VictoryChart\n            theme={this.state.theme}\n            height={this.styles.root.height as number}\n            width={this.state.chartWidth || 120}\n            padding={{ top: 70, bottom: 50, left: 50, right: 30 }}\n            minDomain={mindomain}\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            <VictoryStack>\n            {\n              this.state.data.map((d: any, i: number) => {\n                return <VictoryGroup key={props.name + '_area_group_' + i}>\n                  <Defs>\n                    <LinearGradient id={`${chartName}Gradient${i}`} x1=\"0%\" y1=\"0%\" x2=\"0%\" y2=\"100%\">\n                      <Stop offset=\"0%\" stopColor={Color(this.state.colors[i]).lighten(0.2).rgb().toString()}/>\n                      <Stop offset={gradientStop} stopColor={Color(this.state.colors[i]).lighten(0.6).rgb().toString()}/>\n                    </LinearGradient>\n                  </Defs>\n                  <VictoryArea\n                    interpolation={props.interpolation as InterpolationPropType}\n                    key={props.name + '_' + i}\n                    style={{\n                      data: {\n                        fill: `url(#${chartName}Gradient${i})`,\n                        stroke: this.state.colors[i],\n                        strokeWidth: props.linethickness,\n                      }\n                    }}\n                    data={d}\n                  />\n                  {props.highlightpoints ?\n                    <VictoryScatter\n                      size={5}\n                      key={props.name + '_scatter' + i}\n                      style={{\n                        data: { \n                          fill: Color(this.state.colors[i]).darken(0.2).rgb().toString()}\n                      }}        \n                      data={d}\n                      />\n                  : null}\n                </VictoryGroup>\n              })\n            }\n            </VictoryStack>\n          </VictoryChart>\n        )\n      : null}\n    </View>);\n  }\n}\n"],"mappings":"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"}

app-rn-runtime/components/chart/area-chart/area-chart.props.js

@@ -1,3 +1,11 @@
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 import BaseChartComponentProps from "@wavemaker/app-rn-runtime/components/chart/basechart.props";
-export default class WmAreaChartProps extends BaseChartComponentProps {}
+export default class WmAreaChartProps extends BaseChartComponentProps {
+  constructor() {
+    super(...arguments);
+    _defineProperty(this, "linethickness", 2);
+  }
+}
 //# sourceMappingURL=area-chart.props.js.map

app-rn-runtime/components/chart/area-chart/area-chart.props.js.map

@@ -1 +1 @@
-{"version":3,"names":["BaseChartComponentProps","WmAreaChartProps"],"sources":["area-chart.props.ts"],"sourcesContent":["import BaseChartComponentProps from \"@wavemaker/app-rn-runtime/components/chart/basechart.props\";\n\nexport default class WmAreaChartProps extends BaseChartComponentProps {\n\n}\n"],"mappings":"AAAA,OAAOA,uBAAuB,MAAM,4DAA4D;AAEhG,eAAe,MAAMC,gBAAgB,SAASD,uBAAuB,CAAC"}
+{"version":3,"names":["BaseChartComponentProps","WmAreaChartProps","constructor","arguments","_defineProperty"],"sources":["area-chart.props.ts"],"sourcesContent":["import BaseChartComponentProps from \"@wavemaker/app-rn-runtime/components/chart/basechart.props\";\n\nexport default class WmAreaChartProps extends BaseChartComponentProps {\n    linethickness: number = 2;\n}\n"],"mappings":";;;AAAA,OAAOA,uBAAuB,MAAM,4DAA4D;AAEhG,eAAe,MAAMC,gBAAgB,SAASD,uBAAuB,CAAC;EAAAE,YAAA;IAAA,SAAAC,SAAA;IAAAC,eAAA,wBAC1C,CAAC;EAAA;AAC7B"}

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

@@ -1,10 +1,10 @@
 import React from 'react';
-import { Text, View } from 'react-native';
-import { VictoryChart, VictoryBar, VictoryStack, VictoryGroup } from "victory-native";
+import { View } from 'react-native';
+import { VictoryChart, VictoryBar, VictoryLegend, VictoryStack, VictoryGroup } from "victory-native";
 import { BaseChartComponent, BaseChartComponentState } from "@wavemaker/app-rn-runtime/components/chart/basechart.component";
 import WmBarChartProps from './bar-chart.props';
 import { DEFAULT_CLASS } from './bar-chart.styles';
-import WmIcon from "@wavemaker/app-rn-runtime/components/basic/icon/icon.component";
+import { Svg } from "react-native-svg";
 export class WmBarChartState extends BaseChartComponentState {}
 export default class WmBarChart extends BaseChartComponent {
   constructor(props) {
@@ -20,8 +20,7 @@ export default class WmBarChart extends BaseChartComponent {
         horizontal: props.horizontal,
         labels: props.showvalues ? this.labelFn.bind(this) : undefined,
         data: d,
-        height: 100,
-        alignment: "start"
+        height: 100
       });
     });
   }
@@ -35,19 +34,7 @@ export default class WmBarChart extends BaseChartComponent {
     };
     return /*#__PURE__*/React.createElement(View, {
       style: this.styles.root
-    }, /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, {
-      style: {
-        flexDirection: 'row',
-        alignItems: 'center'
-      }
-    }, props.iconclass ? /*#__PURE__*/React.createElement(WmIcon, {
-      iconclass: props.iconclass,
-      styles: this.styles.icon
-    }) : null, /*#__PURE__*/React.createElement(Text, {
-      style: this.styles.title
-    }, props.title)), /*#__PURE__*/React.createElement(Text, {
-      style: this.styles.subHeading
-    }, props.subheading)), /*#__PURE__*/React.createElement(VictoryChart, {
+    }, /*#__PURE__*/React.createElement(VictoryChart, {
       theme: this.state.theme,
       height: this.styles.root.height,
       width: this.styles.root.width || this.screenWidth,
@@ -58,11 +45,19 @@ export default class WmBarChart extends BaseChartComponent {
         left: props.offsetleft,
         right: props.offsetright
       }
-    }, this.getLegendView(), this.getXaxis(), this.getYAxis(), props.viewtype === 'Stacked' ? /*#__PURE__*/React.createElement(VictoryStack, {
+    }, /*#__PURE__*/React.createElement(VictoryLegend, {
+      name: 'legend',
+      containerComponent: /*#__PURE__*/React.createElement(Svg, null),
+      title: [props.title, props.subheading],
+      orientation: "horizontal",
+      gutter: 20,
+      data: [],
+      theme: this.state.theme
+    }), this.getLegendView(), this.getXaxis(), this.getYAxis(), props.viewtype === 'Stacked' ? /*#__PURE__*/React.createElement(VictoryStack, {
       colorScale: this.state.colors
     }, this.getBarChart(props)) : /*#__PURE__*/React.createElement(VictoryGroup, {
       colorScale: this.state.colors,
-      offset: 10
+      offset: 5
     }, this.getBarChart(props))));
   }
 }

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

@@ -1 +1 @@
-{"version":3,"names":["React","Text","View","VictoryChart","VictoryBar","VictoryStack","VictoryGroup","BaseChartComponent","BaseChartComponentState","WmBarChartProps","DEFAULT_CLASS","WmIcon","WmBarChartState","WmBarChart","constructor","props","labelFn","data","abbreviateNumber","datum","y","getBarChart","state","map","d","i","createElement","key","name","horizontal","labels","showvalues","bind","undefined","height","alignment","renderWidget","length","mindomain","x","xdomain","chartMinX","ydomain","chartMinY","style","styles","root","flexDirection","alignItems","iconclass","icon","title","subHeading","subheading","theme","width","screenWidth","minDomain","padding","top","offsettop","bottom","offsetbottom","left","offsetleft","right","offsetright","getLegendView","getXaxis","getYAxis","viewtype","colorScale","colors","offset"],"sources":["bar-chart.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\n\nimport {\n  VictoryChart,\n  VictoryBar,\n  VictoryLegend,\n  VictoryStack,\n  VictoryGroup\n} from \"victory-native\";\n\nimport {\n  BaseChartComponent,\n  BaseChartComponentState\n} from \"@wavemaker/app-rn-runtime/components/chart/basechart.component\";\nimport WmBarChartProps from './bar-chart.props';\nimport { DEFAULT_CLASS, WmBarChartStyles } from './bar-chart.styles';\nimport { Svg } from \"react-native-svg\";\nimport { Icon } from 'react-native-paper/lib/typescript/components/Avatar/Avatar';\nimport WmIcon from \"@wavemaker/app-rn-runtime/components/basic/icon/icon.component\";\nimport { min } from 'moment';\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  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={d}\n        height={100}\n        alignment='start'\n        />\n    });\n}\n\n  renderWidget(props: WmBarChartProps) {\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      style={this.styles.root}\n    >\n      <View>\n          <View style={{flexDirection: 'row', alignItems: 'center'}}>\n            {props.iconclass ? (<WmIcon iconclass={props.iconclass} styles={this.styles.icon}></WmIcon>) : null }\n            <Text style={this.styles.title}>{props.title}</Text>\n          </View>\n          <Text style={this.styles.subHeading}>{props.subheading}</Text>\n        </View>\n      <VictoryChart theme={this.state.theme}\n                          height={this.styles.root.height as number}\n                          width={this.styles.root.width as number || this.screenWidth}               \n                          minDomain={mindomain}\n                          padding={{ top: props.offsettop, bottom: props.offsetbottom, left: props.offsetleft, right: props.offsetright }}\n                          >\n      {this.getLegendView()}\n      {this.getXaxis()}\n      {this.getYAxis()}\n      {\n        props.viewtype === 'Stacked' ? <VictoryStack colorScale={this.state.colors}>\n          {\n            this.getBarChart(props)\n          }\n        </VictoryStack> : <VictoryGroup colorScale={this.state.colors}  offset={10} >\n          {\n            this.getBarChart(props)   \n          }\n        </VictoryGroup>\n      }\n    </VictoryChart></View>);\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["React","View","VictoryChart","VictoryBar","VictoryLegend","VictoryStack","VictoryGroup","BaseChartComponent","BaseChartComponentState","WmBarChartProps","DEFAULT_CLASS","Svg","WmBarChartState","WmBarChart","constructor","props","labelFn","data","abbreviateNumber","datum","y","getBarChart","state","map","d","i","createElement","key","name","horizontal","labels","showvalues","bind","undefined","height","renderWidget","length","mindomain","x","xdomain","chartMinX","ydomain","chartMinY","style","styles","root","theme","width","screenWidth","minDomain","padding","top","offsettop","bottom","offsetbottom","left","offsetleft","right","offsetright","containerComponent","title","subheading","orientation","gutter","getLegendView","getXaxis","getYAxis","viewtype","colorScale","colors","offset"],"sources":["bar-chart.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport {\n  VictoryChart,\n  VictoryBar,\n  VictoryLegend,\n  VictoryStack,\n  VictoryGroup\n} from \"victory-native\";\n\nimport {\n  BaseChartComponent,\n  BaseChartComponentState\n} from \"@wavemaker/app-rn-runtime/components/chart/basechart.component\";\nimport WmBarChartProps from './bar-chart.props';\nimport { DEFAULT_CLASS, WmBarChartStyles } from './bar-chart.styles';\nimport { Svg } from \"react-native-svg\";\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  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={d}\n        height={100}\n        />\n    });\n}\n\n  renderWidget(props: WmBarChartProps) {\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      style={this.styles.root}\n    ><VictoryChart theme={this.state.theme}\n                          height={this.styles.root.height as number}\n                          width={this.styles.root.width as number || this.screenWidth}\n                          minDomain={mindomain}\n                          padding={{ top: props.offsettop, bottom: props.offsetbottom, left: props.offsetleft, right: props.offsetright }}>\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      {\n        props.viewtype === 'Stacked' ? <VictoryStack colorScale={this.state.colors}>\n          {\n            this.getBarChart(props)\n          }\n        </VictoryStack> : <VictoryGroup colorScale={this.state.colors} offset={5}>\n          {\n            this.getBarChart(props)\n          }\n        </VictoryGroup>\n      }\n    </VictoryChart></View>);\n  }\n}\n"],"mappings":"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"}