@wavemaker/app-rn-runtime 11.4.0-next.1417013 → 11.4.0-next.1417016

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

@@ -1 +1 @@
-{"version":3,"names":["React","Animated","Easing","Text","View","BaseComponent","BaseComponentState","WmTabheaderProps","DEFAULT_CLASS","Tappable","createSkeleton","WmTabheaderState","WmTabheader","constructor","props","Value","headerScrollPosition","addListener","value","headerScrollPositionValue","setHeaderPanelPositon","nativeEvent","headerPanelLayout","layout","setHeaderPositon","index","headersLayout","selectedTabIndex","forceUpdate","onTabSelection","state","onIndexChange","setPosition","toIndicatorPosition","toIndicatorWidth","width","toHeaderScrollPosition","totalWidth","forEach","p","i","minScrollPosition","maxScrollPosition","Math","max","min","parallel","timing","useNativeDriver","toValue","duration","easing","linear","indicatorWidth","indicatorPosition","start","renderSkeleton","transform","translateX","bind","styles","root","data","map","header","isSelected","key","activeHeader","theme","borderRadius","height","activeHeaderText","fontSize","activeIndicator","scaleX","renderWidget","headerText","title"],"sources":["tabheader.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Animated, Easing, LayoutChangeEvent, LayoutRectangle, Text, View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmTabheaderProps from './tabheader.props';\nimport { DEFAULT_CLASS, WmTabheaderStyles } from './tabheader.styles';\nimport { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';\nimport WmSkeleton, { createSkeleton } from '@wavemaker/app-rn-runtime/components/basic/skeleton/skeleton.component';\nimport { WmSkeletonStyles } from '@wavemaker/app-rn-runtime/components/basic/skeleton/skeleton.styles';\n\nexport class WmTabheaderState extends BaseComponentState<WmTabheaderProps> {\n}\n\nexport default class WmTabheader extends BaseComponent<WmTabheaderProps, WmTabheaderState, WmTabheaderStyles> {\n\n  private headerPanelLayout: LayoutRectangle = null as any;\n  private headersLayout: LayoutRectangle[] = [];\n  private headerScrollPosition = new Animated.Value(0);\n  private headerScrollPositionValue = 0;\n  private indicatorPosition = new Animated.Value(0);\n  private indicatorWidth = new Animated.Value(0);\n\n  constructor(props: WmTabheaderProps) {\n    super(props, DEFAULT_CLASS, new WmTabheaderProps(), new WmTabheaderState());\n    this.headerScrollPosition.addListener(({value}) => this.headerScrollPositionValue = value);\n  }\n\n  setHeaderPanelPositon(nativeEvent: LayoutChangeEvent) {\n    this.headerPanelLayout = nativeEvent.nativeEvent.layout;\n  }\n\n  setHeaderPositon(index: number, nativeEvent: LayoutChangeEvent) {\n    this.headersLayout[index] = nativeEvent.nativeEvent.layout;\n    if (index === this.props.selectedTabIndex) {\n      this.forceUpdate();\n    }\n  }\n\n  onTabSelection(index: number) {\n    if (this.state.props.selectedTabIndex != index) {\n      this.state.props.onIndexChange && this.state.props.onIndexChange(index);\n    }\n  }\n\n  setPosition() {\n    const selectedTabIndex = this.state.props.selectedTabIndex;\n    let toIndicatorPosition = 0;\n    let toIndicatorWidth = this.headersLayout[selectedTabIndex]?.width || 0;\n    let toHeaderScrollPosition = this.headerScrollPositionValue;\n    let totalWidth = 0;\n    this.headersLayout.forEach((p, i) => {\n      if (i < selectedTabIndex) {\n        toIndicatorPosition += p.width;\n      }\n      totalWidth += p.width;\n    });\n    toHeaderScrollPosition = -1 * (toIndicatorPosition - (this.headerPanelLayout?.width || 0) / 2 + toIndicatorWidth/ 2) ;\n    const minScrollPosition = -1 * (totalWidth - (this.headerPanelLayout?.width || 0));\n    const maxScrollPosition = 0;\n    toHeaderScrollPosition = Math.max(minScrollPosition, toHeaderScrollPosition);\n    toHeaderScrollPosition = Math.min(maxScrollPosition, toHeaderScrollPosition);\n    Animated.parallel([\n      Animated.timing(this.headerScrollPosition, {\n        useNativeDriver: true,\n        toValue:  toHeaderScrollPosition,\n        duration: 200,\n        easing: Easing.linear\n      }),\n      Animated.timing(this.indicatorWidth, {\n        useNativeDriver: true,\n        toValue:  toIndicatorWidth / 100,\n        duration: 200,\n        easing: Easing.linear\n      }),\n      Animated.timing(this.indicatorPosition, {\n        useNativeDriver: true,\n        toValue:  (toIndicatorPosition - (100 - toIndicatorWidth) / 2),\n        duration: 200,\n        easing: Easing.linear\n      })\n    ]).start();\n  }\n\n  public renderSkeleton(props: WmTabheaderProps){\n    return(\n      <Animated.View style={{\n        transform: [{\n          translateX: this.headerScrollPosition\n        }]\n      }}\n      onLayout={this.setHeaderPanelPositon.bind(this)}>\n        <View style={this.styles.root}>\n          {this.props.data.map((header ,i) => {\n            const isSelected = i === this.props.selectedTabIndex ;\n            return (\n              <Tappable onTap={this.onTabSelection.bind(this, i)} key={header.key}>\n                <View onLayout={this.setHeaderPositon.bind(this, i)} style={[\n                  this.styles.header, \n                  isSelected ? this.styles.activeHeader : null]}>\n                  {\n                    createSkeleton(this.theme, { root: { borderRadius: 4 }} as WmSkeletonStyles, {\n                      ...this.styles.root,\n                      width: this.styles.root?.width || \"100%\",\n                      height: this.styles.root?.height || this.styles.activeHeaderText?.fontSize || 16\n                    })\n                  }\n                </View>\n              </Tappable>\n            );\n          })}\n        </View>\n        <Animated.View style={[this.styles.activeIndicator, {\n          transform: [{\n            translateX: this.indicatorPosition\n          }, {\n            scaleX: this.indicatorWidth\n          }]\n        }]}></Animated.View>\n      </Animated.View>\n\n    )\n  }\n\n  renderWidget(props: WmTabheaderProps) {\n    this.setPosition();\n    return (\n      <Animated.View style={{\n        transform: [{\n          translateX: this.headerScrollPosition\n        }]\n      }}\n      onLayout={this.setHeaderPanelPositon.bind(this)}>\n        <View style={this.styles.root}>\n          {props.data.map((header ,i) => {\n            const isSelected = i === props.selectedTabIndex ;\n            return (\n              <Tappable onTap={this.onTabSelection.bind(this, i)} key={header.key}>\n                <View onLayout={this.setHeaderPositon.bind(this, i)} style={[\n                  this.styles.header, \n                  isSelected ? this.styles.activeHeader : null]}>\n                  <Text numberOfLines={1} style={[\n                    this.styles.headerText, \n                    isSelected ? this.styles.activeHeaderText : null]}>{header.title}</Text>\n                </View>\n              </Tappable>\n            );\n          })}\n        </View>\n        <Animated.View style={[this.styles.activeIndicator, {\n          transform: [{\n            translateX: this.indicatorPosition\n          }, {\n            scaleX: this.indicatorWidth\n          }]\n        }]}></Animated.View>\n      </Animated.View>\n    ); \n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["React","Animated","Easing","Text","View","BaseComponent","BaseComponentState","WmTabheaderProps","DEFAULT_CLASS","Tappable","createSkeleton","WmTabheaderState","WmTabheader","constructor","props","Value","headerScrollPosition","addListener","value","headerScrollPositionValue","setHeaderPanelPositon","nativeEvent","headerPanelLayout","layout","setHeaderPositon","index","headersLayout","selectedTabIndex","forceUpdate","onTabSelection","state","onIndexChange","setPosition","toIndicatorPosition","toIndicatorWidth","width","toHeaderScrollPosition","totalWidth","forEach","p","i","minScrollPosition","maxScrollPosition","Math","max","min","parallel","timing","useNativeDriver","toValue","duration","easing","linear","indicatorWidth","indicatorPosition","start","renderSkeleton","transform","translateX","bind","styles","root","data","map","header","isSelected","key","flex","activeHeader","theme","borderRadius","height","activeHeaderText","fontSize","activeIndicator","scaleX","renderWidget","_background","flexGrow","undefined","headerText","title"],"sources":["tabheader.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Animated, Easing, LayoutChangeEvent, LayoutRectangle, Text, View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmTabheaderProps from './tabheader.props';\nimport { DEFAULT_CLASS, WmTabheaderStyles } from './tabheader.styles';\nimport { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';\nimport WmSkeleton, { createSkeleton } from '@wavemaker/app-rn-runtime/components/basic/skeleton/skeleton.component';\nimport { WmSkeletonStyles } from '@wavemaker/app-rn-runtime/components/basic/skeleton/skeleton.styles';\n\nexport class WmTabheaderState extends BaseComponentState<WmTabheaderProps> {\n}\n\nexport default class WmTabheader extends BaseComponent<WmTabheaderProps, WmTabheaderState, WmTabheaderStyles> {\n\n  private headerPanelLayout: LayoutRectangle = null as any;\n  private headersLayout: LayoutRectangle[] = [];\n  private headerScrollPosition = new Animated.Value(0);\n  private headerScrollPositionValue = 0;\n  private indicatorPosition = new Animated.Value(0);\n  private indicatorWidth = new Animated.Value(0);\n\n  constructor(props: WmTabheaderProps) {\n    super(props, DEFAULT_CLASS, new WmTabheaderProps(), new WmTabheaderState());\n    this.headerScrollPosition.addListener(({value}) => this.headerScrollPositionValue = value);\n  }\n\n  setHeaderPanelPositon(nativeEvent: LayoutChangeEvent) {\n    this.headerPanelLayout = nativeEvent.nativeEvent.layout;\n  }\n\n  setHeaderPositon(index: number, nativeEvent: LayoutChangeEvent) {\n    this.headersLayout[index] = nativeEvent.nativeEvent.layout;\n    if (index === this.props.selectedTabIndex) {\n      this.forceUpdate();\n    }\n  }\n\n  onTabSelection(index: number) {\n    if (this.state.props.selectedTabIndex != index) {\n      this.state.props.onIndexChange && this.state.props.onIndexChange(index);\n    }\n  }\n\n  setPosition() {\n    const selectedTabIndex = this.state.props.selectedTabIndex;\n    let toIndicatorPosition = 0;\n    let toIndicatorWidth = this.headersLayout[selectedTabIndex]?.width || 0;\n    let toHeaderScrollPosition = this.headerScrollPositionValue;\n    let totalWidth = 0;\n    this.headersLayout.forEach((p, i) => {\n      if (i < selectedTabIndex) {\n        toIndicatorPosition += p.width;\n      }\n      totalWidth += p.width;\n    });\n    toHeaderScrollPosition = -1 * (toIndicatorPosition - (this.headerPanelLayout?.width || 0) / 2 + toIndicatorWidth/ 2) ;\n    const minScrollPosition = -1 * (totalWidth - (this.headerPanelLayout?.width || 0));\n    const maxScrollPosition = 0;\n    toHeaderScrollPosition = Math.max(minScrollPosition, toHeaderScrollPosition);\n    toHeaderScrollPosition = Math.min(maxScrollPosition, toHeaderScrollPosition);\n    Animated.parallel([\n      Animated.timing(this.headerScrollPosition, {\n        useNativeDriver: true,\n        toValue:  toHeaderScrollPosition,\n        duration: 200,\n        easing: Easing.linear\n      }),\n      Animated.timing(this.indicatorWidth, {\n        useNativeDriver: true,\n        toValue:  toIndicatorWidth / 100,\n        duration: 200,\n        easing: Easing.linear\n      }),\n      Animated.timing(this.indicatorPosition, {\n        useNativeDriver: true,\n        toValue:  (toIndicatorPosition - (100 - toIndicatorWidth) / 2),\n        duration: 200,\n        easing: Easing.linear\n      })\n    ]).start();\n  }\n\n  public renderSkeleton(props: WmTabheaderProps){\n    return(\n      <Animated.View style={{\n        transform: [{\n          translateX: this.headerScrollPosition\n        }]\n      }}\n      onLayout={this.setHeaderPanelPositon.bind(this)}>\n        <View style={this.styles.root}>\n          {this.props.data.map((header ,i) => {\n            const isSelected = i === this.props.selectedTabIndex;\n            return (\n              <Tappable onTap={this.onTabSelection.bind(this, i)} key={header.key} styles={{flex: 1}}>\n                <View onLayout={this.setHeaderPositon.bind(this, i)} style={[\n                  this.styles.header, \n                  isSelected ? this.styles.activeHeader : null]}>\n                  {\n                    createSkeleton(this.theme, { root: { borderRadius: 4 }} as WmSkeletonStyles, {\n                      ...this.styles.root,\n                      width: this.styles.root?.width || \"100%\",\n                      height: this.styles.root?.height || this.styles.activeHeaderText?.fontSize || 16\n                    })\n                  }\n                </View>\n              </Tappable>\n            );\n          })}\n        </View>\n        <Animated.View style={[this.styles.activeIndicator, {\n          transform: [{\n            translateX: this.indicatorPosition\n          }, {\n            scaleX: this.indicatorWidth\n          }]\n        }]}></Animated.View>\n      </Animated.View>\n\n    )\n  }\n\n  renderWidget(props: WmTabheaderProps) {\n    this.setPosition();\n    return (\n      <Animated.View style={{\n        transform: [{\n          translateX: this.headerScrollPosition\n        }]\n      }}\n      onLayout={this.setHeaderPanelPositon.bind(this)}>\n        <View style={this.styles.root}>\n          {this._background}\n          {props.data.map((header ,i) => {\n            const isSelected = i === props.selectedTabIndex ;\n            return (\n              <Tappable onTap={this.onTabSelection.bind(this, i)} key={header.key} \n                styles={this.styles.header.flexGrow ? {flexGrow: this.styles.header.flexGrow} : null}>\n                <View onLayout={this.setHeaderPositon.bind(this, i)} style={[\n                  this.styles.header,\n                  {flexGrow: undefined},\n                  isSelected ? this.styles.activeHeader : null]}>\n                  <Text numberOfLines={1} style={[\n                    this.styles.headerText, \n                    isSelected ? this.styles.activeHeaderText : null]}>{header.title}</Text>\n                </View>\n              </Tappable>\n            );\n          })}\n        </View>\n        <Animated.View style={[this.styles.activeIndicator, {\n          transform: [{\n            translateX: this.indicatorPosition\n          }, {\n            scaleX: this.indicatorWidth\n          }]\n        }]}></Animated.View>\n      </Animated.View>\n    ); \n  }\n}\n"],"mappings":"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"}

app-rn-runtime/components/container/tabs/tabheader/tabheader.styles.js

@@ -15,7 +15,8 @@ BASE_THEME.registerStyle((themeVariables, addStyle) => {
       paddingVertical: 12,
       minWidth: 80,
       flexDirection: 'row',
-      justifyContent: 'center'
+      justifyContent: 'center',
+      flexGrow: 1
     },
     headerIcon: {
       text: {

app-rn-runtime/components/container/tabs/tabheader/tabheader.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["BASE_THEME","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","flexDirection","minWidth","overflow","backgroundColor","tabHeaderBgColor","text","header","paddingHorizontal","paddingVertical","justifyContent","headerIcon","color","tabHeaderIconColor","headerText","tabHeaderTextColor","fontFamily","baseFont","fontWeight","fontSize","textTransform","activeHeader","tabActiveHeaderBgColor","activeIndicator","tabActiveIndicatorBgColor","width","height","marginTop","activeHeaderIcon","tabActiveHeaderIconColor","activeHeaderText","tabActiveHeaderTextColor","skeleton"],"sources":["tabheader.styles.ts"],"sourcesContent":["import BASE_THEME from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { TextStyle, ViewStyle } from 'react-native';\nimport { WmIconStyles } from '@wavemaker/app-rn-runtime/components/basic/icon/icon.styles';\nimport { WmSkeletonStyles } from '@wavemaker/app-rn-runtime/components/basic/skeleton/skeleton.styles';\n\nexport type WmTabheaderStyles = BaseStyles & {\n    activeIndicator: ViewStyle,\n    header: ViewStyle,\n    headerIcon: WmIconStyles,\n    headerText: TextStyle,\n    activeHeader: ViewStyle,\n    activeHeaderIcon: WmIconStyles,\n    activeHeaderText: TextStyle,\n    skeleton: WmSkeletonStyles \n};\n\nexport const DEFAULT_CLASS = 'app-tabheader';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n    const defaultStyles = {\n        root: {\n            flexDirection: 'row',\n            minWidth: '100%',\n            overflow: 'visible',\n            backgroundColor: themeVariables.tabHeaderBgColor,\n        },\n        text: {},\n        header: {\n            backgroundColor: themeVariables.tabHeaderBgColor,\n            paddingHorizontal: 12,\n            paddingVertical: 12,\n            minWidth: 80,\n            flexDirection: 'row',\n            justifyContent: 'center'\n        },\n        headerIcon: {\n            text: {\n                color: themeVariables.tabHeaderIconColor\n            }\n        } as WmIconStyles,\n        headerText: {\n            color: themeVariables.tabHeaderTextColor,\n            overflow: 'visible',\n            fontFamily: themeVariables.baseFont,\n            fontWeight: 'bold',\n            fontSize: 16,\n            textTransform: 'capitalize'\n        },\n        activeHeader: {\n            backgroundColor: themeVariables.tabActiveHeaderBgColor\n        },\n        activeIndicator: {\n            backgroundColor: themeVariables.tabActiveIndicatorBgColor,\n            width: 100,\n            height: 4,\n            marginTop: -4\n        },\n        activeHeaderIcon: {\n            text: {\n                color: themeVariables.tabActiveHeaderIconColor\n            }\n        } as WmIconStyles,\n        activeHeaderText: {\n            color: themeVariables.tabActiveHeaderTextColor \n        },\n        skeleton: {} as WmSkeletonStyles\n    } as WmTabheaderStyles;\n    addStyle(DEFAULT_CLASS, '', defaultStyles);\n});"],"mappings":"AAAA,OAAOA,UAAU,MAAM,wCAAwC;AAiB/D,OAAO,MAAMC,aAAa,GAAG,eAAe;AAC5CD,UAAU,CAACE,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACnD,MAAMC,aAAa,GAAG;IAClBC,IAAI,EAAE;MACFC,aAAa,EAAE,KAAK;MACpBC,QAAQ,EAAE,MAAM;MAChBC,QAAQ,EAAE,SAAS;MACnBC,eAAe,EAAEP,cAAc,CAACQ;IACpC,CAAC;IACDC,IAAI,EAAE,CAAC,CAAC;IACRC,MAAM,EAAE;MACJH,eAAe,EAAEP,cAAc,CAACQ,gBAAgB;MAChDG,iBAAiB,EAAE,EAAE;MACrBC,eAAe,EAAE,EAAE;MACnBP,QAAQ,EAAE,EAAE;MACZD,aAAa,EAAE,KAAK;MACpBS,cAAc,EAAE;IACpB,CAAC;IACDC,UAAU,EAAE;MACRL,IAAI,EAAE;QACFM,KAAK,EAAEf,cAAc,CAACgB;MAC1B;IACJ,CAAiB;IACjBC,UAAU,EAAE;MACRF,KAAK,EAAEf,cAAc,CAACkB,kBAAkB;MACxCZ,QAAQ,EAAE,SAAS;MACnBa,UAAU,EAAEnB,cAAc,CAACoB,QAAQ;MACnCC,UAAU,EAAE,MAAM;MAClBC,QAAQ,EAAE,EAAE;MACZC,aAAa,EAAE;IACnB,CAAC;IACDC,YAAY,EAAE;MACVjB,eAAe,EAAEP,cAAc,CAACyB;IACpC,CAAC;IACDC,eAAe,EAAE;MACbnB,eAAe,EAAEP,cAAc,CAAC2B,yBAAyB;MACzDC,KAAK,EAAE,GAAG;MACVC,MAAM,EAAE,CAAC;MACTC,SAAS,EAAE,CAAC;IAChB,CAAC;IACDC,gBAAgB,EAAE;MACdtB,IAAI,EAAE;QACFM,KAAK,EAAEf,cAAc,CAACgC;MAC1B;IACJ,CAAiB;IACjBC,gBAAgB,EAAE;MACdlB,KAAK,EAAEf,cAAc,CAACkC;IAC1B,CAAC;IACDC,QAAQ,EAAE,CAAC;EACf,CAAsB;EACtBlC,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;AAC9C,CAAC,CAAC"}
+{"version":3,"names":["BASE_THEME","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","flexDirection","minWidth","overflow","backgroundColor","tabHeaderBgColor","text","header","paddingHorizontal","paddingVertical","justifyContent","flexGrow","headerIcon","color","tabHeaderIconColor","headerText","tabHeaderTextColor","fontFamily","baseFont","fontWeight","fontSize","textTransform","activeHeader","tabActiveHeaderBgColor","activeIndicator","tabActiveIndicatorBgColor","width","height","marginTop","activeHeaderIcon","tabActiveHeaderIconColor","activeHeaderText","tabActiveHeaderTextColor","skeleton"],"sources":["tabheader.styles.ts"],"sourcesContent":["import BASE_THEME from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { TextStyle, ViewStyle } from 'react-native';\nimport { WmIconStyles } from '@wavemaker/app-rn-runtime/components/basic/icon/icon.styles';\nimport { WmSkeletonStyles } from '@wavemaker/app-rn-runtime/components/basic/skeleton/skeleton.styles';\n\nexport type WmTabheaderStyles = BaseStyles & {\n    activeIndicator: ViewStyle,\n    header: ViewStyle,\n    headerIcon: WmIconStyles,\n    headerText: TextStyle,\n    activeHeader: ViewStyle,\n    activeHeaderIcon: WmIconStyles,\n    activeHeaderText: TextStyle,\n    skeleton: WmSkeletonStyles \n};\n\nexport const DEFAULT_CLASS = 'app-tabheader';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n    const defaultStyles = {\n        root: {\n            flexDirection: 'row',\n            minWidth: '100%',\n            overflow: 'visible',\n            backgroundColor: themeVariables.tabHeaderBgColor,\n        },\n        text: {},\n        header: {\n            backgroundColor: themeVariables.tabHeaderBgColor,\n            paddingHorizontal: 12,\n            paddingVertical: 12,\n            minWidth: 80,\n            flexDirection: 'row',\n            justifyContent: 'center',\n            flexGrow: 1\n        },\n        headerIcon: {\n            text: {\n                color: themeVariables.tabHeaderIconColor\n            }\n        } as WmIconStyles,\n        headerText: {\n            color: themeVariables.tabHeaderTextColor,\n            overflow: 'visible',\n            fontFamily: themeVariables.baseFont,\n            fontWeight: 'bold',\n            fontSize: 16,\n            textTransform: 'capitalize'\n        },\n        activeHeader: {\n            backgroundColor: themeVariables.tabActiveHeaderBgColor\n        },\n        activeIndicator: {\n            backgroundColor: themeVariables.tabActiveIndicatorBgColor,\n            width: 100,\n            height: 4,\n            marginTop: -4\n        },\n        activeHeaderIcon: {\n            text: {\n                color: themeVariables.tabActiveHeaderIconColor\n            }\n        } as WmIconStyles,\n        activeHeaderText: {\n            color: themeVariables.tabActiveHeaderTextColor \n        },\n        skeleton: {} as WmSkeletonStyles\n    } as WmTabheaderStyles;\n    addStyle(DEFAULT_CLASS, '', defaultStyles);\n});"],"mappings":"AAAA,OAAOA,UAAU,MAAM,wCAAwC;AAiB/D,OAAO,MAAMC,aAAa,GAAG,eAAe;AAC5CD,UAAU,CAACE,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACnD,MAAMC,aAAa,GAAG;IAClBC,IAAI,EAAE;MACFC,aAAa,EAAE,KAAK;MACpBC,QAAQ,EAAE,MAAM;MAChBC,QAAQ,EAAE,SAAS;MACnBC,eAAe,EAAEP,cAAc,CAACQ;IACpC,CAAC;IACDC,IAAI,EAAE,CAAC,CAAC;IACRC,MAAM,EAAE;MACJH,eAAe,EAAEP,cAAc,CAACQ,gBAAgB;MAChDG,iBAAiB,EAAE,EAAE;MACrBC,eAAe,EAAE,EAAE;MACnBP,QAAQ,EAAE,EAAE;MACZD,aAAa,EAAE,KAAK;MACpBS,cAAc,EAAE,QAAQ;MACxBC,QAAQ,EAAE;IACd,CAAC;IACDC,UAAU,EAAE;MACRN,IAAI,EAAE;QACFO,KAAK,EAAEhB,cAAc,CAACiB;MAC1B;IACJ,CAAiB;IACjBC,UAAU,EAAE;MACRF,KAAK,EAAEhB,cAAc,CAACmB,kBAAkB;MACxCb,QAAQ,EAAE,SAAS;MACnBc,UAAU,EAAEpB,cAAc,CAACqB,QAAQ;MACnCC,UAAU,EAAE,MAAM;MAClBC,QAAQ,EAAE,EAAE;MACZC,aAAa,EAAE;IACnB,CAAC;IACDC,YAAY,EAAE;MACVlB,eAAe,EAAEP,cAAc,CAAC0B;IACpC,CAAC;IACDC,eAAe,EAAE;MACbpB,eAAe,EAAEP,cAAc,CAAC4B,yBAAyB;MACzDC,KAAK,EAAE,GAAG;MACVC,MAAM,EAAE,CAAC;MACTC,SAAS,EAAE,CAAC;IAChB,CAAC;IACDC,gBAAgB,EAAE;MACdvB,IAAI,EAAE;QACFO,KAAK,EAAEhB,cAAc,CAACiC;MAC1B;IACJ,CAAiB;IACjBC,gBAAgB,EAAE;MACdlB,KAAK,EAAEhB,cAAc,CAACmC;IAC1B,CAAC;IACDC,QAAQ,EAAE,CAAC;EACf,CAAsB;EACtBnC,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;AAC9C,CAAC,CAAC"}

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

@@ -34,7 +34,7 @@ export default class WmTabpane extends BaseComponent {
   }
   componentDidMount() {
     const tabs = this.parent;
-    tabs.addTabPane(this);
+    tabs.addTabPane(this.proxy);
     super.componentDidMount();
   }
   _onSelect() {
@@ -43,10 +43,13 @@ export default class WmTabpane extends BaseComponent {
   _onDeselect() {
     this.invokeEventCallback('onDeselect', [null, this.proxy]);
   }
+  select() {
+    this.parent.selectTabPane(this);
+  }
   renderWidget(props) {
     return /*#__PURE__*/React.createElement(View, {
       style: this.styles.root
-    }, this.renderContent(props));
+    }, this._background, this.renderContent(props));
   }
 }
 //# sourceMappingURL=tabpane.component.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","View","BaseComponent","BaseComponentState","WmTabpaneProps","DEFAULT_CLASS","WmTabpaneState","WmTabpane","constructor","props","onPartialLoad","invokeEventCallback","renderContent","renderPartial","state","isPartialLoaded","setTimeout","updateState","bind","children","componentDidMount","tabs","parent","addTabPane","_onSelect","proxy","_onDeselect","renderWidget","styles","root"],"sources":["tabpane.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmTabpaneProps from './tabpane.props';\nimport { DEFAULT_CLASS, WmTabpaneStyles } from './tabpane.styles';\nimport WmTabs from '../tabs.component';\n\nexport class WmTabpaneState extends BaseComponentState<WmTabpaneProps> {\n  isPartialLoaded = false;\n}\n\nexport default class WmTabpane extends BaseComponent<WmTabpaneProps, WmTabpaneState, WmTabpaneStyles> {\n\n  constructor(props: WmTabpaneProps) {\n    super(props, DEFAULT_CLASS, new WmTabpaneProps());\n  }\n\n  onPartialLoad() {\n    this.invokeEventCallback('onLoad', [null, this]);\n  }\n\n  renderContent(props: WmTabpaneProps) {\n    if (props.renderPartial) {\n      if (!this.state.isPartialLoaded) {\n        setTimeout(() => {\n          this.updateState({\n            isPartialLoaded: true\n          } as WmTabpaneState);\n        });\n      }\n      return props.renderPartial(this.onPartialLoad.bind(this));\n    }\n    return props.children;\n  }\n\n  componentDidMount() {\n    const tabs = (this.parent) as WmTabs;\n    tabs.addTabPane(this);\n    super.componentDidMount();\n  }\n\n  _onSelect() {\n    this.invokeEventCallback('onSelect', [null, this.proxy]);\n  }\n  _onDeselect() {\n    this.invokeEventCallback('onDeselect', [null, this.proxy]);\n  }\n\n  renderWidget(props: WmTabpaneProps) {\n    return (<View style={this.styles.root}>{this.renderContent(props)}</View>);\n  }\n}\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AACnC,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,+CAA+C;AAEjG,OAAOC,cAAc,MAAM,iBAAiB;AAC5C,SAASC,aAAa,QAAyB,kBAAkB;AAGjE,OAAO,MAAMC,cAAc,SAASH,kBAAkB,CAAiB;EAAA;IAAA;IAAA,yCACnD,KAAK;EAAA;AACzB;AAEA,eAAe,MAAMI,SAAS,SAASL,aAAa,CAAkD;EAEpGM,WAAW,CAACC,KAAqB,EAAE;IACjC,KAAK,CAACA,KAAK,EAAEJ,aAAa,EAAE,IAAID,cAAc,EAAE,CAAC;EACnD;EAEAM,aAAa,GAAG;IACd,IAAI,CAACC,mBAAmB,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;EAClD;EAEAC,aAAa,CAACH,KAAqB,EAAE;IACnC,IAAIA,KAAK,CAACI,aAAa,EAAE;MACvB,IAAI,CAAC,IAAI,CAACC,KAAK,CAACC,eAAe,EAAE;QAC/BC,UAAU,CAAC,MAAM;UACf,IAAI,CAACC,WAAW,CAAC;YACfF,eAAe,EAAE;UACnB,CAAC,CAAmB;QACtB,CAAC,CAAC;MACJ;MACA,OAAON,KAAK,CAACI,aAAa,CAAC,IAAI,CAACH,aAAa,CAACQ,IAAI,CAAC,IAAI,CAAC,CAAC;IAC3D;IACA,OAAOT,KAAK,CAACU,QAAQ;EACvB;EAEAC,iBAAiB,GAAG;IAClB,MAAMC,IAAI,GAAI,IAAI,CAACC,MAAiB;IACpCD,IAAI,CAACE,UAAU,CAAC,IAAI,CAAC;IACrB,KAAK,CAACH,iBAAiB,EAAE;EAC3B;EAEAI,SAAS,GAAG;IACV,IAAI,CAACb,mBAAmB,CAAC,UAAU,EAAE,CAAC,IAAI,EAAE,IAAI,CAACc,KAAK,CAAC,CAAC;EAC1D;EACAC,WAAW,GAAG;IACZ,IAAI,CAACf,mBAAmB,CAAC,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,CAACc,KAAK,CAAC,CAAC;EAC5D;EAEAE,YAAY,CAAClB,KAAqB,EAAE;IAClC,oBAAQ,oBAAC,IAAI;MAAC,KAAK,EAAE,IAAI,CAACmB,MAAM,CAACC;IAAK,GAAE,IAAI,CAACjB,aAAa,CAACH,KAAK,CAAC,CAAQ;EAC3E;AACF"}
+{"version":3,"names":["React","View","BaseComponent","BaseComponentState","WmTabpaneProps","DEFAULT_CLASS","WmTabpaneState","WmTabpane","constructor","props","onPartialLoad","invokeEventCallback","renderContent","renderPartial","state","isPartialLoaded","setTimeout","updateState","bind","children","componentDidMount","tabs","parent","addTabPane","proxy","_onSelect","_onDeselect","select","selectTabPane","renderWidget","styles","root","_background"],"sources":["tabpane.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmTabpaneProps from './tabpane.props';\nimport { DEFAULT_CLASS, WmTabpaneStyles } from './tabpane.styles';\nimport WmTabs from '../tabs.component';\n\nexport class WmTabpaneState extends BaseComponentState<WmTabpaneProps> {\n  isPartialLoaded = false;\n}\n\nexport default class WmTabpane extends BaseComponent<WmTabpaneProps, WmTabpaneState, WmTabpaneStyles> {\n\n  constructor(props: WmTabpaneProps) {\n    super(props, DEFAULT_CLASS, new WmTabpaneProps());\n  }\n\n  onPartialLoad() {\n    this.invokeEventCallback('onLoad', [null, this]);\n  }\n\n  renderContent(props: WmTabpaneProps) {\n    if (props.renderPartial) {\n      if (!this.state.isPartialLoaded) {\n        setTimeout(() => {\n          this.updateState({\n            isPartialLoaded: true\n          } as WmTabpaneState);\n        });\n      }\n      return props.renderPartial(this.onPartialLoad.bind(this));\n    }\n    return props.children;\n  }\n\n  componentDidMount() {\n    const tabs = (this.parent) as WmTabs;\n    tabs.addTabPane(this.proxy as WmTabpane);\n    super.componentDidMount();\n  }\n\n  _onSelect() {\n    this.invokeEventCallback('onSelect', [null, this.proxy]);\n  }\n  _onDeselect() {\n    this.invokeEventCallback('onDeselect', [null, this.proxy]);\n  }\n\n  select() {\n    (this.parent as WmTabs).selectTabPane(this);\n  }\n\n  renderWidget(props: WmTabpaneProps) {\n    return (<View style={this.styles.root}>{this._background}{this.renderContent(props)}</View>);\n  }\n}\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AACnC,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,+CAA+C;AAEjG,OAAOC,cAAc,MAAM,iBAAiB;AAC5C,SAASC,aAAa,QAAyB,kBAAkB;AAGjE,OAAO,MAAMC,cAAc,SAASH,kBAAkB,CAAiB;EAAA;IAAA;IAAA,yCACnD,KAAK;EAAA;AACzB;AAEA,eAAe,MAAMI,SAAS,SAASL,aAAa,CAAkD;EAEpGM,WAAW,CAACC,KAAqB,EAAE;IACjC,KAAK,CAACA,KAAK,EAAEJ,aAAa,EAAE,IAAID,cAAc,EAAE,CAAC;EACnD;EAEAM,aAAa,GAAG;IACd,IAAI,CAACC,mBAAmB,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;EAClD;EAEAC,aAAa,CAACH,KAAqB,EAAE;IACnC,IAAIA,KAAK,CAACI,aAAa,EAAE;MACvB,IAAI,CAAC,IAAI,CAACC,KAAK,CAACC,eAAe,EAAE;QAC/BC,UAAU,CAAC,MAAM;UACf,IAAI,CAACC,WAAW,CAAC;YACfF,eAAe,EAAE;UACnB,CAAC,CAAmB;QACtB,CAAC,CAAC;MACJ;MACA,OAAON,KAAK,CAACI,aAAa,CAAC,IAAI,CAACH,aAAa,CAACQ,IAAI,CAAC,IAAI,CAAC,CAAC;IAC3D;IACA,OAAOT,KAAK,CAACU,QAAQ;EACvB;EAEAC,iBAAiB,GAAG;IAClB,MAAMC,IAAI,GAAI,IAAI,CAACC,MAAiB;IACpCD,IAAI,CAACE,UAAU,CAAC,IAAI,CAACC,KAAK,CAAc;IACxC,KAAK,CAACJ,iBAAiB,EAAE;EAC3B;EAEAK,SAAS,GAAG;IACV,IAAI,CAACd,mBAAmB,CAAC,UAAU,EAAE,CAAC,IAAI,EAAE,IAAI,CAACa,KAAK,CAAC,CAAC;EAC1D;EACAE,WAAW,GAAG;IACZ,IAAI,CAACf,mBAAmB,CAAC,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,CAACa,KAAK,CAAC,CAAC;EAC5D;EAEAG,MAAM,GAAG;IACN,IAAI,CAACL,MAAM,CAAYM,aAAa,CAAC,IAAI,CAAC;EAC7C;EAEAC,YAAY,CAACpB,KAAqB,EAAE;IAClC,oBAAQ,oBAAC,IAAI;MAAC,KAAK,EAAE,IAAI,CAACqB,MAAM,CAACC;IAAK,GAAE,IAAI,CAACC,WAAW,EAAE,IAAI,CAACpB,aAAa,CAACH,KAAK,CAAC,CAAQ;EAC7F;AACF"}

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

@@ -2,8 +2,10 @@ 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 { Animated, Easing, PanResponder, View } from 'react-native';
+import { View } from 'react-native';
 import { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';
+import * as SwipeAnimation from '@wavemaker/app-rn-runtime/gestures/swipe.animation';
+import { isWebPreviewMode } from '@wavemaker/app-rn-runtime/core/utils';
 import WmTabsProps from './tabs.props';
 import { DEFAULT_CLASS } from './tabs.styles';
 import WmTabheader from './tabheader/tabheader.component';
@@ -20,35 +22,27 @@ export default class WmTabs extends BaseComponent {
     _defineProperty(this, "tabPanes", []);
     _defineProperty(this, "newIndex", 0);
     _defineProperty(this, "tabLayout", null);
-    _defineProperty(this, "tabPosition", new Animated.Value(0));
     _defineProperty(this, "tabPaneHeights", []);
-    _defineProperty(this, "panResponder", PanResponder.create({
-      onMoveShouldSetPanResponder: () => true,
-      onPanResponderGrant: () => {
-        this.tabPosition.setOffset(this.tabPosition._value);
+    _defineProperty(this, "animationView", null);
+    _defineProperty(this, "animationHandlers", {
+      bounds: e => {
+        var _this$tabLayout;
+        const activeTabIndex = this.state.selectedTabIndex,
+          w = ((_this$tabLayout = this.tabLayout) === null || _this$tabLayout === void 0 ? void 0 : _this$tabLayout.width) || 0,
+          noOfTabs = this.tabPanes.length;
+        return {
+          lower: -1 * (activeTabIndex - (activeTabIndex === 0 ? 0 : 1)) * w,
+          center: -1 * activeTabIndex * w,
+          upper: -1 * (activeTabIndex + (activeTabIndex === noOfTabs - 1 ? 0 : 1)) * w
+        };
       },
-      onPanResponderMove: Animated.event([null, {
-        dx: this.tabPosition
-      }]),
-      onPanResponderRelease: () => {
-        const dx = this.tabPosition._value;
-        this.tabPosition.flattenOffset();
-        let toIndex = this.state.selectedTabIndex;
-        if (Math.abs(dx) > 50) {
-          if (dx < 0) {
-            if (toIndex < this.tabPanes.length - 1) {
-              this.onChange(toIndex + 1);
-              return;
-            }
-          } else if (toIndex > 0) {
-            this.onChange(toIndex - 1);
-            return;
-          }
-        }
-        this.onChange(toIndex);
-        this.forceUpdate();
+      onLower: e => {
+        this.onChange(this.state.selectedTabIndex - 1);
+      },
+      onUpper: e => {
+        this.onChange(this.state.selectedTabIndex + 1);
       }
-    }));
+    });
     const selectedIndex = props.defaultpaneindex || 0;
     const tabsShown = [];
     tabsShown[selectedIndex] = true;
@@ -68,15 +62,6 @@ export default class WmTabs extends BaseComponent {
       this.forceUpdate();
     }
   }
-  setTabPosition() {
-    var _this$tabLayout;
-    Animated.timing(this.tabPosition, {
-      useNativeDriver: true,
-      toValue: -1 * this.state.selectedTabIndex * (((_this$tabLayout = this.tabLayout) === null || _this$tabLayout === void 0 ? void 0 : _this$tabLayout.width) || 0),
-      duration: 200,
-      easing: Easing.linear
-    }).start();
-  }
   setTabShown(tabIndex, callback) {
     if (!this.state.tabsShown[tabIndex]) {
       const tabsShown = [...this.state.tabsShown];
@@ -91,10 +76,33 @@ export default class WmTabs extends BaseComponent {
     }
   }
   addTabPane(tabPane) {
-    this.tabPanes[this.newIndex || this.state.selectedTabIndex] = tabPane;
-    this.newIndex++;
+    const i = this.tabPanes.findIndex(t => t.props.name === tabPane.props.name);
+    if (i >= 0) {
+      this.tabPanes[i] = tabPane;
+    } else {
+      this.tabPanes[this.newIndex++] = tabPane;
+    }
+  }
+  selectTabPane(tabPane) {
+    this.goToTab(this.tabPanes.indexOf(tabPane));
+  }
+  goToTab(index) {
+    var _this$tabLayout2, _this$animationView;
+    const position = -1 * index * (((_this$tabLayout2 = this.tabLayout) === null || _this$tabLayout2 === void 0 ? void 0 : _this$tabLayout2.width) || 0);
+    (_this$animationView = this.animationView) === null || _this$animationView === void 0 ? void 0 : _this$animationView.setPosition(position).then(() => this.onChange(index));
+  }
+  prev() {
+    var _this$animationView2;
+    (_this$animationView2 = this.animationView) === null || _this$animationView2 === void 0 ? void 0 : _this$animationView2.goToLower();
+  }
+  next() {
+    var _this$animationView3;
+    (_this$animationView3 = this.animationView) === null || _this$animationView3 === void 0 ? void 0 : _this$animationView3.goToLower();
   }
   onChange(newIndex) {
+    if (newIndex < 0 || newIndex >= this.tabPanes.length) {
+      return;
+    }
     const oldIndex = this.state.selectedTabIndex;
     const deselectedTab = this.tabPanes[this.state.selectedTabIndex];
     this.newIndex = newIndex;
@@ -116,7 +124,6 @@ export default class WmTabs extends BaseComponent {
       icon: '',
       key: `tab-${p.props.title}-${i}`
     }));
-    this.setTabPosition();
     return /*#__PURE__*/React.createElement(View, {
       style: [this.styles.root, {
         borderBottomWidth: 0
@@ -130,8 +137,7 @@ export default class WmTabs extends BaseComponent {
       styles: this.styles.tabHeader,
       data: headerData,
       showskeleton: this.props.showskeleton,
-      selectedTabIndex: this.state.selectedTabIndex,
-      onIndexChange: this.onChange.bind(this)
+      selectedTabIndex: this.state.selectedTabIndex
     }), /*#__PURE__*/React.createElement(View
     //{...this.panResponder.panHandlers}
     , {
@@ -140,13 +146,10 @@ export default class WmTabs extends BaseComponent {
         //height: this.tabPaneHeights[this.state.selectedTabIndex],
         overflow: 'hidden'
       }
-    }, /*#__PURE__*/React.createElement(Animated.View, {
+    }, /*#__PURE__*/React.createElement(View, {
       style: {
         flexDirection: 'row',
-        flexWrap: 'nowrap',
-        transform: [{
-          translateX: this.tabPosition
-        }]
+        flexWrap: 'nowrap'
       }
     }, tabPanes.map((p, i) => {
       return /*#__PURE__*/React.createElement(View, {
@@ -156,7 +159,7 @@ export default class WmTabs extends BaseComponent {
           alignSelf: 'flex-start'
         },
         onLayout: this.setTabPaneHeights.bind(this, i)
-      }, this.state.tabsShown[i] ? p : null);
+      }, p);
     }))));
   }
   renderWidget(props) {
@@ -166,10 +169,9 @@ export default class WmTabs extends BaseComponent {
       icon: '',
       key: `tab-${p.props.title}-${i}`
     }));
-    this.setTabPosition();
     return /*#__PURE__*/React.createElement(View, {
       style: this.styles.root
-    }, /*#__PURE__*/React.createElement(View, {
+    }, this._background, /*#__PURE__*/React.createElement(View, {
       onLayout: this.setTabLayout.bind(this),
       style: {
         width: '100%'
@@ -178,32 +180,46 @@ export default class WmTabs extends BaseComponent {
       styles: this.styles.tabHeader,
       data: headerData,
       selectedTabIndex: this.state.selectedTabIndex,
-      onIndexChange: this.onChange.bind(this)
-    }), /*#__PURE__*/React.createElement(View
-    //{...this.panResponder.panHandlers}
-    , {
-      style: {
+      onIndexChange: this.goToTab.bind(this)
+    }), /*#__PURE__*/React.createElement(View, {
+      style: [{
         width: '100%',
-        //height: this.tabPaneHeights[this.state.selectedTabIndex],
-        overflow: 'hidden'
-      }
-    }, /*#__PURE__*/React.createElement(Animated.View, {
+        flex: 1
+      }, this.styles.root.height ? isWebPreviewMode() ? {
+        'overflow-x': 'hidden',
+        'overflow-y': 'auto'
+      } : {
+        overflow: 'scroll'
+      } : {
+        overflow: 'hidden',
+        maxHeight: this.tabPaneHeights[this.state.selectedTabIndex]
+      }]
+    }, /*#__PURE__*/React.createElement(SwipeAnimation.View, {
+      enableGestures: props.enablegestures,
       style: {
         flexDirection: 'row',
-        flexWrap: 'nowrap',
-        transform: [{
-          translateX: this.tabPosition
-        }]
-      }
+        flexWrap: 'nowrap'
+      },
+      direction: "horizontal",
+      ref: r => {
+        this.animationView = r;
+      },
+      handlers: this.animationHandlers
     }, tabPanes.map((p, i) => {
       return /*#__PURE__*/React.createElement(View, {
+        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'
         },
         onLayout: this.setTabPaneHeights.bind(this, i)
-      }, this.state.tabsShown[i] ? p : null);
+      }, p));
     }))));
   }
 }

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

@@ -1 +1 @@
-{"version":3,"names":["React","Animated","Easing","PanResponder","View","BaseComponent","BaseComponentState","WmTabsProps","DEFAULT_CLASS","WmTabheader","WmTabsState","WmTabs","constructor","props","Value","create","onMoveShouldSetPanResponder","onPanResponderGrant","tabPosition","setOffset","_value","onPanResponderMove","event","dx","onPanResponderRelease","flattenOffset","toIndex","state","selectedTabIndex","Math","abs","tabPanes","length","onChange","forceUpdate","selectedIndex","defaultpaneindex","tabsShown","updateState","setTabLayout","tabLayout","nativeEvent","layout","setTabPaneHeights","index","tabPaneHeights","height","setTabPosition","timing","useNativeDriver","toValue","width","duration","easing","linear","start","setTabShown","tabIndex","callback","setTimeout","addTabPane","tabPane","newIndex","oldIndex","deselectedTab","_onDeselect","selectedTab","_onSelect","invokeEventCallback","proxy","renderSkeleton","Children","toArray","children","filter","item","show","headerData","map","p","i","title","icon","key","styles","root","borderBottomWidth","bind","tabHeader","showskeleton","overflow","flexDirection","flexWrap","transform","translateX","alignSelf","renderWidget"],"sources":["tabs.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Animated, Easing, LayoutChangeEvent, LayoutRectangle, PanResponder, View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\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 tabPosition = new Animated.Value(0);\n  private tabPaneHeights: number[] = [];\n  private panResponder = PanResponder.create({\n    onMoveShouldSetPanResponder: () => true,\n    onPanResponderGrant: () => {\n      this.tabPosition.setOffset((this.tabPosition as any)._value);\n    },\n    onPanResponderMove: Animated.event([\n      null,\n      { dx: this.tabPosition }\n    ]),\n    onPanResponderRelease: () => {\n      const dx = (this.tabPosition as any)._value;\n      this.tabPosition.flattenOffset();\n      let toIndex = this.state.selectedTabIndex;\n      if (Math.abs(dx) > 50) {\n        if (dx < 0) {\n          if (toIndex < this.tabPanes.length - 1) {\n            this.onChange(toIndex + 1);\n            return;\n          }\n        } else if (toIndex > 0) {\n          this.onChange(toIndex - 1);\n          return;\n        }\n      }\n      this.onChange(toIndex);\n      this.forceUpdate();\n    }\n  });\n\n  constructor(props: WmTabsProps) {\n    super(props, DEFAULT_CLASS, new WmTabsProps(), new WmTabsState());\n    const selectedIndex = props.defaultpaneindex || 0;\n    const tabsShown: boolean[] = [];\n    tabsShown[selectedIndex] = true;\n    this.updateState({\n      selectedTabIndex: selectedIndex,\n      tabsShown: tabsShown\n    }as WmTabsState);\n  }\n\n  setTabLayout(event: LayoutChangeEvent) {\n    this.tabLayout = event.nativeEvent.layout;\n    this.forceUpdate();\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  setTabPosition() {\n    Animated.timing(this.tabPosition, {\n      useNativeDriver: true,\n      toValue:  -1 * this.state.selectedTabIndex * (this.tabLayout?.width || 0),\n      duration: 200,\n      easing: Easing.linear\n    }).start();\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    this.tabPanes[this.newIndex || this.state.selectedTabIndex] = tabPane;\n    this.newIndex++;\n  }\n\n  onChange(newIndex: number) {\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    this.setTabPosition();\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        onIndexChange={this.onChange.bind(this)}\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        <Animated.View style={{\n          flexDirection: 'row',\n          flexWrap: 'nowrap',\n          transform: [{\n            translateX: this.tabPosition\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            </View>);\n          })}\n        </Animated.View>\n      </View>\n    </View>\n\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    this.setTabPosition();\n    return (\n      <View style={this.styles.root}>\n        <View onLayout={this.setTabLayout.bind(this)} style={{width: '100%'}}></View>\n        <WmTabheader\n          styles={this.styles.tabHeader}\n          data={headerData}\n          selectedTabIndex={this.state.selectedTabIndex}\n          onIndexChange={this.onChange.bind(this)}\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          <Animated.View style={{\n            flexDirection: 'row',\n            flexWrap: 'nowrap',\n            transform: [{\n              translateX: this.tabPosition\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              </View>);\n            })}\n          </Animated.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","WmTabs","constructor","props","bounds","e","activeTabIndex","state","selectedTabIndex","w","tabLayout","width","noOfTabs","tabPanes","length","lower","center","upper","onLower","onChange","onUpper","selectedIndex","defaultpaneindex","tabsShown","updateState","setTabLayout","event","nativeEvent","layout","forceUpdate","setTabPaneHeights","index","tabPaneHeights","height","setTabShown","tabIndex","callback","setTimeout","addTabPane","tabPane","i","findIndex","t","name","newIndex","selectTabPane","goToTab","indexOf","position","animationView","setPosition","then","prev","goToLower","next","oldIndex","deselectedTab","_onDeselect","selectedTab","_onSelect","invokeEventCallback","proxy","renderSkeleton","Children","toArray","children","filter","item","show","headerData","map","p","title","icon","key","styles","root","borderBottomWidth","bind","tabHeader","showskeleton","overflow","flexDirection","flexWrap","alignSelf","renderWidget","_background","flex","maxHeight","enablegestures","r","animationHandlers","undefined"],"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    const selectedIndex = props.defaultpaneindex || 0;\n    const tabsShown: boolean[] = [];\n    tabsShown[selectedIndex] = true;\n    this.updateState({\n      selectedTabIndex: selectedIndex,\n      tabsShown: tabsShown\n    }as WmTabsState);\n  }\n\n  setTabLayout(event: LayoutChangeEvent) {\n    this.tabLayout = event.nativeEvent.layout;\n    this.forceUpdate();\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: number) {\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  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          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          }]} >\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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"}

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

@@ -7,6 +7,7 @@ export default class WmTabsProps extends BaseProps {
     super(...arguments);
     _defineProperty(this, "children", void 0);
     _defineProperty(this, "defaultpaneindex", 0);
+    _defineProperty(this, "enablegestures", true);
   }
 }
 //# sourceMappingURL=tabs.props.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["BaseProps","WmTabsProps"],"sources":["tabs.props.ts"],"sourcesContent":["import { BaseProps } from '@wavemaker/app-rn-runtime/core/base.component';\n\nexport default class WmTabsProps extends BaseProps {\n  children: any;\n  defaultpaneindex: number = 0;\n}\n"],"mappings":";;;AAAA,SAASA,SAAS,QAAQ,+CAA+C;AAEzE,eAAe,MAAMC,WAAW,SAASD,SAAS,CAAC;EAAA;IAAA;IAAA;IAAA,0CAEtB,CAAC;EAAA;AAC9B"}
+{"version":3,"names":["BaseProps","WmTabsProps"],"sources":["tabs.props.ts"],"sourcesContent":["import { BaseProps } from '@wavemaker/app-rn-runtime/core/base.component';\n\nexport default class WmTabsProps extends BaseProps {\n  children: any;\n  defaultpaneindex: number = 0;\n  enablegestures = true;\n}\n"],"mappings":";;;AAAA,SAASA,SAAS,QAAQ,+CAA+C;AAEzE,eAAe,MAAMC,WAAW,SAASD,SAAS,CAAC;EAAA;IAAA;IAAA;IAAA,0CAEtB,CAAC;IAAA,wCACX,IAAI;EAAA;AACvB"}

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

@@ -4,7 +4,7 @@ export const DEFAULT_CLASS = 'app-tabs';
 BASE_THEME.registerStyle((themeVariables, addStyle) => {
   const defaultStyles = defineStyles({
     root: {
-      minHeight: 120,
+      minHeight: 240,
       elevation: 0,
       borderBottomWidth: 1,
       borderStyle: 'solid',

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

@@ -1 +1 @@
-{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","minHeight","elevation","borderBottomWidth","borderStyle","borderColor","tabBorderColor","text","tabHeader"],"sources":["tabs.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 { WmTabheaderStyles } from './tabheader/tabheader.styles';\n\nexport type WmTabsStyles = BaseStyles & {\n  tabHeader: WmTabheaderStyles\n};\n\nexport const DEFAULT_CLASS = 'app-tabs';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n  const defaultStyles: WmTabsStyles = defineStyles({\n      root: {\n        minHeight: 120,\n        elevation: 0,\n        borderBottomWidth: 1,\n        borderStyle: 'solid',\n        borderColor: themeVariables.tabBorderColor\n      },\n      text: {},\n      tabHeader: {} as WmTabheaderStyles\n  });\n  addStyle(DEFAULT_CLASS, '', defaultStyles);\n});\n"],"mappings":"AAAA,OAAOA,UAAU,MAAM,wCAAwC;AAC/D,SAAqBC,YAAY,QAAQ,+CAA+C;AAOxF,OAAO,MAAMC,aAAa,GAAG,UAAU;AACvCF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACrD,MAAMC,aAA2B,GAAGL,YAAY,CAAC;IAC7CM,IAAI,EAAE;MACJC,SAAS,EAAE,GAAG;MACdC,SAAS,EAAE,CAAC;MACZC,iBAAiB,EAAE,CAAC;MACpBC,WAAW,EAAE,OAAO;MACpBC,WAAW,EAAER,cAAc,CAACS;IAC9B,CAAC;IACDC,IAAI,EAAE,CAAC,CAAC;IACRC,SAAS,EAAE,CAAC;EAChB,CAAC,CAAC;EACFV,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;AAC5C,CAAC,CAAC"}
+{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","minHeight","elevation","borderBottomWidth","borderStyle","borderColor","tabBorderColor","text","tabHeader"],"sources":["tabs.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 { WmTabheaderStyles } from './tabheader/tabheader.styles';\n\nexport type WmTabsStyles = BaseStyles & {\n  tabHeader: WmTabheaderStyles\n};\n\nexport const DEFAULT_CLASS = 'app-tabs';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n  const defaultStyles: WmTabsStyles = defineStyles({\n      root: {\n        minHeight: 240,\n        elevation: 0,\n        borderBottomWidth: 1,\n        borderStyle: 'solid',\n        borderColor: themeVariables.tabBorderColor\n      },\n      text: {},\n      tabHeader: {} as WmTabheaderStyles\n  });\n  addStyle(DEFAULT_CLASS, '', defaultStyles);\n});\n"],"mappings":"AAAA,OAAOA,UAAU,MAAM,wCAAwC;AAC/D,SAAqBC,YAAY,QAAQ,+CAA+C;AAOxF,OAAO,MAAMC,aAAa,GAAG,UAAU;AACvCF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACrD,MAAMC,aAA2B,GAAGL,YAAY,CAAC;IAC7CM,IAAI,EAAE;MACJC,SAAS,EAAE,GAAG;MACdC,SAAS,EAAE,CAAC;MACZC,iBAAiB,EAAE,CAAC;MACpBC,WAAW,EAAE,OAAO;MACpBC,WAAW,EAAER,cAAc,CAACS;IAC9B,CAAC;IACDC,IAAI,EAAE,CAAC,CAAC;IACRC,SAAS,EAAE,CAAC;EAChB,CAAC,CAAC;EACFV,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;AAC5C,CAAC,CAAC"}

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

@@ -15,7 +15,7 @@ export default class WmTile extends BaseComponent {
     }, /*#__PURE__*/React.createElement(Animatedview, {
       entryanimation: props.animation,
       style: this.styles.root
-    }, props.children));
+    }, this._background, props.children));
   }
 }
 //# sourceMappingURL=tile.component.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","BaseComponent","BaseComponentState","WmTileProps","DEFAULT_CLASS","Tappable","Animatedview","WmTileState","WmTile","constructor","props","renderWidget","animation","styles","root","children"],"sources":["tile.component.tsx"],"sourcesContent":["import React from 'react';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmTileProps from './tile.props';\nimport { DEFAULT_CLASS, WmTileStyles } from './tile.styles';\nimport { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';\nimport { Animatedview } from '@wavemaker/app-rn-runtime/components/basic/animatedview.component';\n\nexport class WmTileState extends BaseComponentState<WmTileProps> {}\n\nexport default class WmTile extends BaseComponent<WmTileProps, WmTileState, WmTileStyles> {\n\n  constructor(props: WmTileProps) {\n    super(props, DEFAULT_CLASS, new WmTileProps());\n  }\n\n  renderWidget(props: WmTileProps) {\n    return (<Tappable target={this}>\n      <Animatedview entryanimation={props.animation} style={this.styles.root}>{props.children}</Animatedview>\n    </Tappable>);\n  }\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,+CAA+C;AAEjG,OAAOC,WAAW,MAAM,cAAc;AACtC,SAASC,aAAa,QAAsB,eAAe;AAC3D,SAASC,QAAQ,QAAQ,mDAAmD;AAC5E,SAASC,YAAY,QAAQ,mEAAmE;AAEhG,OAAO,MAAMC,WAAW,SAASL,kBAAkB,CAAc;AAEjE,eAAe,MAAMM,MAAM,SAASP,aAAa,CAAyC;EAExFQ,WAAW,CAACC,KAAkB,EAAE;IAC9B,KAAK,CAACA,KAAK,EAAEN,aAAa,EAAE,IAAID,WAAW,EAAE,CAAC;EAChD;EAEAQ,YAAY,CAACD,KAAkB,EAAE;IAC/B,oBAAQ,oBAAC,QAAQ;MAAC,MAAM,EAAE;IAAK,gBAC7B,oBAAC,YAAY;MAAC,cAAc,EAAEA,KAAK,CAACE,SAAU;MAAC,KAAK,EAAE,IAAI,CAACC,MAAM,CAACC;IAAK,GAAEJ,KAAK,CAACK,QAAQ,CAAgB,CAC9F;EACb;AACF"}
+{"version":3,"names":["React","BaseComponent","BaseComponentState","WmTileProps","DEFAULT_CLASS","Tappable","Animatedview","WmTileState","WmTile","constructor","props","renderWidget","animation","styles","root","_background","children"],"sources":["tile.component.tsx"],"sourcesContent":["import React from 'react';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmTileProps from './tile.props';\nimport { DEFAULT_CLASS, WmTileStyles } from './tile.styles';\nimport { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';\nimport { Animatedview } from '@wavemaker/app-rn-runtime/components/basic/animatedview.component';\n\nexport class WmTileState extends BaseComponentState<WmTileProps> {}\n\nexport default class WmTile extends BaseComponent<WmTileProps, WmTileState, WmTileStyles> {\n\n  constructor(props: WmTileProps) {\n    super(props, DEFAULT_CLASS, new WmTileProps());\n  }\n\n  renderWidget(props: WmTileProps) {\n    return (<Tappable target={this}>\n      <Animatedview entryanimation={props.animation} style={this.styles.root}>{this._background}{props.children}</Animatedview>\n    </Tappable>);\n  }\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,+CAA+C;AAEjG,OAAOC,WAAW,MAAM,cAAc;AACtC,SAASC,aAAa,QAAsB,eAAe;AAC3D,SAASC,QAAQ,QAAQ,mDAAmD;AAC5E,SAASC,YAAY,QAAQ,mEAAmE;AAEhG,OAAO,MAAMC,WAAW,SAASL,kBAAkB,CAAc;AAEjE,eAAe,MAAMM,MAAM,SAASP,aAAa,CAAyC;EAExFQ,WAAW,CAACC,KAAkB,EAAE;IAC9B,KAAK,CAACA,KAAK,EAAEN,aAAa,EAAE,IAAID,WAAW,EAAE,CAAC;EAChD;EAEAQ,YAAY,CAACD,KAAkB,EAAE;IAC/B,oBAAQ,oBAAC,QAAQ;MAAC,MAAM,EAAE;IAAK,gBAC7B,oBAAC,YAAY;MAAC,cAAc,EAAEA,KAAK,CAACE,SAAU;MAAC,KAAK,EAAE,IAAI,CAACC,MAAM,CAACC;IAAK,GAAE,IAAI,CAACC,WAAW,EAAEL,KAAK,CAACM,QAAQ,CAAgB,CAChH;EACb;AACF"}

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

@@ -127,7 +127,7 @@ export default class WmWizard extends BaseComponent {
     const isSkippable = this.steps[this.state.currentStep] && this.steps[this.state.currentStep].props.enableskip;
     return /*#__PURE__*/React.createElement(View, {
       style: this.styles.root
-    }, /*#__PURE__*/React.createElement(View, {
+    }, this._background, /*#__PURE__*/React.createElement(View, {
       style: this.styles.wizardHeader
     }, this.steps ? this.steps.map((step, i) => this.renderWizardHeader(step, i)) : null), /*#__PURE__*/React.createElement(View, {
       style: this.styles.wizardBody

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

@@ -1 +1 @@
-{"version":3,"names":["React","Text","View","TouchableOpacity","isArray","merge","BaseComponent","BaseComponentState","WmWizardProps","DEFAULT_CLASS","WmButton","WmIcon","WmAnchor","WmWizardState","WmWizard","constructor","props","steps","children","defaultStepIndex","defaultstep","map","item","index","name","updateCurrentStep","addWizardStep","step","forceUpdate","componentDidMount","showActiveStep","state","currentStep","setActive","isDone","setInActive","updateState","getStepStyle","style","styles","push","doneStep","activeStep","renderWizardHeader","isLastStep","numberOfSteps","isFirstStep","show","headerWrapper","stepWrapper","bind","stepCounter","stepIcon","icon","color","iconclass","stepTitle","title","stepConnector","width","left","onPrev","invokePrevCB","onNext","eventName","invokeSkipCB","invokeNextCB","onDone","$event","invokeEventCallback","proxy","onCancel","onSkip","renderWidget","length","isSkippable","enableskip","root","wizardHeader","i","wizardBody","wizardFooter","flexDirection","actionsalignment","wizardActions","theme","getStyle","doneButton","donebtnlabel","nextButton","nextbtnlabel","previousbtnlabel","cancelable","cancelbtnlabel","skipLink"],"sources":["wizard.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View, TouchableOpacity } from 'react-native';\nimport { isArray, merge } from 'lodash';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmWizardProps from './wizard.props';\nimport { DEFAULT_CLASS, WmWizardStyles } from './wizard.styles';\nimport WmButton from '@wavemaker/app-rn-runtime/components/basic/button/button.component';\nimport WmIcon from '@wavemaker/app-rn-runtime/components/basic/icon/icon.component';\nimport WmAnchor from '@wavemaker/app-rn-runtime/components/basic/anchor/anchor.component';\nimport WmWizardstep from './wizardstep/wizardstep.component';\n\nexport class WmWizardState extends BaseComponentState<WmWizardProps> {\n  currentStep: number = 0;\n  isDone: boolean = false;\n}\n\nexport default class WmWizard extends BaseComponent<WmWizardProps, WmWizardState, WmWizardStyles> {\n  private numberOfSteps: number = null as any;\n  private steps = [] as WmWizardstep[];\n  constructor(props: WmWizardProps) {\n    super(props, DEFAULT_CLASS, new WmWizardProps());\n    const steps = props.children;\n    let defaultStepIndex = 0;\n    if (isArray(steps) && props.defaultstep) {\n      steps.map((item: any, index: any) => {\n        if (props.defaultstep === item.props.name) {\n          defaultStepIndex = index;\n        }\n      })\n    }\n    this.updateCurrentStep(defaultStepIndex);\n  }\n\n  addWizardStep(step: WmWizardstep) {\n    this.steps[step.props.index] = step;\n    this.forceUpdate();\n  }\n\n  componentDidMount() {\n    super.componentDidMount();\n    this.showActiveStep();\n  }\n\n  showActiveStep() {\n    this.steps[this.state.currentStep]?.setActive();\n  }\n\n  updateCurrentStep(index: number, isDone = false) {\n    this.steps[this.state.currentStep]?.setInActive();\n    this.updateState({\n      currentStep: index,\n      isDone: isDone\n    } as WmWizardState, () => this.showActiveStep());\n  }\n\n  getStepStyle(index: number) {\n    const style = [this.styles.step];\n    if (this.state.isDone || index < this.state.currentStep) {\n      style.push(this.styles.doneStep);\n    } else if (this.state.currentStep === index) {\n      style.push(this.styles.activeStep);\n    }\n    return style;\n  }\n\n  renderWizardHeader(item: any, index: number) {\n    const isLastStep = index === this.numberOfSteps - 1;\n    const isFirstStep = index === 0;\n    return item.props.show != false ? (\n      <View style={this.styles.headerWrapper} key={index+1}>\n        <TouchableOpacity style={this.styles.stepWrapper}\n                          onPress={this.updateCurrentStep.bind(this, index, false)} disabled={index >= this.state.currentStep}>\n            <View style={this.getStepStyle(index)}>\n              {index >= this.state.currentStep && !this.state.isDone &&\n                    <Text style={index === this.state.currentStep ? this.styles.activeStep : this.styles.stepCounter}>{index+1}</Text>}\n              {(index < this.state.currentStep || this.state.isDone) &&\n                    <WmIcon styles={merge({}, this.styles.stepIcon, {icon: {color: this.styles.activeStep.color}})}\n                            iconclass={item.props.iconclass || 'wm-sl-l sl-check'}></WmIcon>}\n            </View>\n          <Text style={this.styles.stepTitle}>\n            {item.props.title || 'Step Title'}</Text>\n        </TouchableOpacity>\n        {this.numberOfSteps > 1 && <View style={[this.styles.stepConnector, { width: isFirstStep || isLastStep ? '50%' : '100%',\n                                                      left: isFirstStep ? '50%': '0%'}]}></View>}\n      </View>\n    ) : null;\n  }\n\n  onPrev(steps: any) {\n    const index = this.state.currentStep;\n    const currentStep = this.steps[index];\n    currentStep.invokePrevCB(index);\n    this.updateCurrentStep(index - 1);\n  }\n\n  onNext(steps: any, eventName?: string) {\n    const index = this.state.currentStep;\n    const currentStep = this.steps[index];\n    if (eventName === 'skip') {\n      currentStep.invokeSkipCB(index);\n    } else {\n      currentStep.invokeNextCB(index);\n    }\n    this.updateCurrentStep(index + 1);\n  }\n\n  onDone($event: any) {\n    this.updateState({\n      isDone: true\n    } as WmWizardState);\n    this.invokeEventCallback('onDone', [$event, this.proxy]);\n  }\n\n  onCancel() {\n    this.invokeEventCallback('onCancel', [null, this.proxy]);\n  }\n  onSkip(steps: any) {\n    this.onNext(steps, 'skip');\n  }\n\n  renderWidget(props: WmWizardProps) {\n    this.numberOfSteps = this.steps.length;\n    const activeStep = this.steps[this.state.currentStep];\n    const isSkippable = this.steps[this.state.currentStep] && this.steps[this.state.currentStep].props.enableskip;\n    return (\n      <View style={this.styles.root}>\n        <View style={this.styles.wizardHeader}>\n          {this.steps ? this.steps.map((step, i) => this.renderWizardHeader(step, i)) : null}\n        </View>\n        <View style={this.styles.wizardBody}>\n          {props.children}\n        </View>\n        <View style={[this.styles.wizardFooter,\n          {flexDirection: props.actionsalignment === 'right' ? 'row-reverse': 'row'}]}>\n          {(this.state.currentStep+1) === this.numberOfSteps &&\n            <WmButton iconclass={'wm-sl-l sl-check'} styles={merge({}, this.styles.wizardActions, this.theme.getStyle('btn-success'), this.styles.doneButton)}\n                      caption={props.donebtnlabel} onTap={this.onDone.bind(this)}></WmButton>\n          }\n          {(this.state.currentStep+1) < this.numberOfSteps &&\n            <WmButton iconclass={'wi wi-chevron-right'} styles={merge({}, this.styles.wizardActions, this.theme.getStyle('btn-primary'), this.styles.nextButton)}\n                      iconposition={'right'} caption={props.nextbtnlabel} onTap={this.onNext.bind(this, this.steps)}></WmButton>\n          }\n          {this.state.currentStep > 0 &&\n            <WmButton iconclass={'wi wi-chevron-left'} styles={merge({}, this.theme.getStyle('btn-default'), this.styles.wizardActions)} caption={props.previousbtnlabel}\n                      onTap={this.onPrev.bind(this, this.steps)}></WmButton>\n          }\n          {props.cancelable ?\n              <WmButton caption={props.cancelbtnlabel} styles={merge({}, this.theme.getStyle('btn-default'), this.styles.wizardActions)} onTap={this.onCancel.bind(this)}></WmButton>\n              : null\n          }\n          {isSkippable &&\n              <WmAnchor iconclass={'wi wi-chevron-right'} iconposition={'right'} caption={'Skip'}\n                        styles={merge({}, this.styles.wizardActions, this.styles.skipLink)} onTap={this.onSkip.bind(this, this.steps)}></WmAnchor>\n          }\n        </View>\n      </View>\n    );\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["React","Text","View","TouchableOpacity","isArray","merge","BaseComponent","BaseComponentState","WmWizardProps","DEFAULT_CLASS","WmButton","WmIcon","WmAnchor","WmWizardState","WmWizard","constructor","props","steps","children","defaultStepIndex","defaultstep","map","item","index","name","updateCurrentStep","addWizardStep","step","forceUpdate","componentDidMount","showActiveStep","state","currentStep","setActive","isDone","setInActive","updateState","getStepStyle","style","styles","push","doneStep","activeStep","renderWizardHeader","isLastStep","numberOfSteps","isFirstStep","show","headerWrapper","stepWrapper","bind","stepCounter","stepIcon","icon","color","iconclass","stepTitle","title","stepConnector","width","left","onPrev","invokePrevCB","onNext","eventName","invokeSkipCB","invokeNextCB","onDone","$event","invokeEventCallback","proxy","onCancel","onSkip","renderWidget","length","isSkippable","enableskip","root","_background","wizardHeader","i","wizardBody","wizardFooter","flexDirection","actionsalignment","wizardActions","theme","getStyle","doneButton","donebtnlabel","nextButton","nextbtnlabel","previousbtnlabel","cancelable","cancelbtnlabel","skipLink"],"sources":["wizard.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View, TouchableOpacity } from 'react-native';\nimport { isArray, merge } from 'lodash';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmWizardProps from './wizard.props';\nimport { DEFAULT_CLASS, WmWizardStyles } from './wizard.styles';\nimport WmButton from '@wavemaker/app-rn-runtime/components/basic/button/button.component';\nimport WmIcon from '@wavemaker/app-rn-runtime/components/basic/icon/icon.component';\nimport WmAnchor from '@wavemaker/app-rn-runtime/components/basic/anchor/anchor.component';\nimport WmWizardstep from './wizardstep/wizardstep.component';\n\nexport class WmWizardState extends BaseComponentState<WmWizardProps> {\n  currentStep: number = 0;\n  isDone: boolean = false;\n}\n\nexport default class WmWizard extends BaseComponent<WmWizardProps, WmWizardState, WmWizardStyles> {\n  private numberOfSteps: number = null as any;\n  private steps = [] as WmWizardstep[];\n  constructor(props: WmWizardProps) {\n    super(props, DEFAULT_CLASS, new WmWizardProps());\n    const steps = props.children;\n    let defaultStepIndex = 0;\n    if (isArray(steps) && props.defaultstep) {\n      steps.map((item: any, index: any) => {\n        if (props.defaultstep === item.props.name) {\n          defaultStepIndex = index;\n        }\n      })\n    }\n    this.updateCurrentStep(defaultStepIndex);\n  }\n\n  addWizardStep(step: WmWizardstep) {\n    this.steps[step.props.index] = step;\n    this.forceUpdate();\n  }\n\n  componentDidMount() {\n    super.componentDidMount();\n    this.showActiveStep();\n  }\n\n  showActiveStep() {\n    this.steps[this.state.currentStep]?.setActive();\n  }\n\n  updateCurrentStep(index: number, isDone = false) {\n    this.steps[this.state.currentStep]?.setInActive();\n    this.updateState({\n      currentStep: index,\n      isDone: isDone\n    } as WmWizardState, () => this.showActiveStep());\n  }\n\n  getStepStyle(index: number) {\n    const style = [this.styles.step];\n    if (this.state.isDone || index < this.state.currentStep) {\n      style.push(this.styles.doneStep);\n    } else if (this.state.currentStep === index) {\n      style.push(this.styles.activeStep);\n    }\n    return style;\n  }\n\n  renderWizardHeader(item: any, index: number) {\n    const isLastStep = index === this.numberOfSteps - 1;\n    const isFirstStep = index === 0;\n    return item.props.show != false ? (\n      <View style={this.styles.headerWrapper} key={index+1}>\n        <TouchableOpacity style={this.styles.stepWrapper}\n                          onPress={this.updateCurrentStep.bind(this, index, false)} disabled={index >= this.state.currentStep}>\n            <View style={this.getStepStyle(index)}>\n              {index >= this.state.currentStep && !this.state.isDone &&\n                    <Text style={index === this.state.currentStep ? this.styles.activeStep : this.styles.stepCounter}>{index+1}</Text>}\n              {(index < this.state.currentStep || this.state.isDone) &&\n                    <WmIcon styles={merge({}, this.styles.stepIcon, {icon: {color: this.styles.activeStep.color}})}\n                            iconclass={item.props.iconclass || 'wm-sl-l sl-check'}></WmIcon>}\n            </View>\n          <Text style={this.styles.stepTitle}>\n            {item.props.title || 'Step Title'}</Text>\n        </TouchableOpacity>\n        {this.numberOfSteps > 1 && <View style={[this.styles.stepConnector, { width: isFirstStep || isLastStep ? '50%' : '100%',\n                                                      left: isFirstStep ? '50%': '0%'}]}></View>}\n      </View>\n    ) : null;\n  }\n\n  onPrev(steps: any) {\n    const index = this.state.currentStep;\n    const currentStep = this.steps[index];\n    currentStep.invokePrevCB(index);\n    this.updateCurrentStep(index - 1);\n  }\n\n  onNext(steps: any, eventName?: string) {\n    const index = this.state.currentStep;\n    const currentStep = this.steps[index];\n    if (eventName === 'skip') {\n      currentStep.invokeSkipCB(index);\n    } else {\n      currentStep.invokeNextCB(index);\n    }\n    this.updateCurrentStep(index + 1);\n  }\n\n  onDone($event: any) {\n    this.updateState({\n      isDone: true\n    } as WmWizardState);\n    this.invokeEventCallback('onDone', [$event, this.proxy]);\n  }\n\n  onCancel() {\n    this.invokeEventCallback('onCancel', [null, this.proxy]);\n  }\n  onSkip(steps: any) {\n    this.onNext(steps, 'skip');\n  }\n\n  renderWidget(props: WmWizardProps) {\n    this.numberOfSteps = this.steps.length;\n    const activeStep = this.steps[this.state.currentStep];\n    const isSkippable = this.steps[this.state.currentStep] && this.steps[this.state.currentStep].props.enableskip;\n    return (\n      <View style={this.styles.root}>\n        {this._background}\n        <View style={this.styles.wizardHeader}>\n          {this.steps ? this.steps.map((step, i) => this.renderWizardHeader(step, i)) : null}\n        </View>\n        <View style={this.styles.wizardBody}>\n          {props.children}\n        </View>\n        <View style={[this.styles.wizardFooter,\n          {flexDirection: props.actionsalignment === 'right' ? 'row-reverse': 'row'}]}>\n          {(this.state.currentStep+1) === this.numberOfSteps &&\n            <WmButton iconclass={'wm-sl-l sl-check'} styles={merge({}, this.styles.wizardActions, this.theme.getStyle('btn-success'), this.styles.doneButton)}\n                      caption={props.donebtnlabel} onTap={this.onDone.bind(this)}></WmButton>\n          }\n          {(this.state.currentStep+1) < this.numberOfSteps &&\n            <WmButton iconclass={'wi wi-chevron-right'} styles={merge({}, this.styles.wizardActions, this.theme.getStyle('btn-primary'), this.styles.nextButton)}\n                      iconposition={'right'} caption={props.nextbtnlabel} onTap={this.onNext.bind(this, this.steps)}></WmButton>\n          }\n          {this.state.currentStep > 0 &&\n            <WmButton iconclass={'wi wi-chevron-left'} styles={merge({}, this.theme.getStyle('btn-default'), this.styles.wizardActions)} caption={props.previousbtnlabel}\n                      onTap={this.onPrev.bind(this, this.steps)}></WmButton>\n          }\n          {props.cancelable ?\n              <WmButton caption={props.cancelbtnlabel} styles={merge({}, this.theme.getStyle('btn-default'), this.styles.wizardActions)} onTap={this.onCancel.bind(this)}></WmButton>\n              : null\n          }\n          {isSkippable &&\n              <WmAnchor iconclass={'wi wi-chevron-right'} iconposition={'right'} caption={'Skip'}\n                        styles={merge({}, this.styles.wizardActions, this.styles.skipLink)} onTap={this.onSkip.bind(this, this.steps)}></WmAnchor>\n          }\n        </View>\n      </View>\n    );\n  }\n}\n"],"mappings":"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"}