@wavemaker/app-rn-runtime 11.5.0-next.40301 → 11.5.0-rc.5392

app-rn-runtime/components/advanced/carousel/carousel-template/carousel-template.component.js

@@ -9,8 +9,11 @@ export default class WmCarouselTemplate extends BaseComponent {
     super(props, DEFAULT_CLASS, new WmCarouselTemplateProps());
   }
   renderWidget(props) {
+    var _this$parent;
     return /*#__PURE__*/React.createElement(View, {
-      style: this.styles.root
+      style: [this.styles.root, {
+        height: this.styles.root.height || ((_this$parent = this.parent) === null || _this$parent === void 0 ? void 0 : _this$parent.styles.root.height) && '100%'
+      }]
     }, this._background, props.children);
   }
 }

app-rn-runtime/components/advanced/carousel/carousel-template/carousel-template.component.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","View","BaseComponent","BaseComponentState","WmCarouselTemplateProps","DEFAULT_CLASS","WmCarouselTemplateState","WmCarouselTemplate","constructor","props","renderWidget","createElement","style","styles","root","_background","children"],"sources":["carousel-template.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 WmCarouselTemplateProps from './carousel-template.props';\nimport { DEFAULT_CLASS, WmCarouselTemplateStyles } from './carousel-template.styles';\n\nexport class WmCarouselTemplateState extends BaseComponentState<WmCarouselTemplateProps> {}\n\nexport default class WmCarouselTemplate extends BaseComponent<WmCarouselTemplateProps, WmCarouselTemplateState, WmCarouselTemplateStyles> {\n\n  constructor(props: WmCarouselTemplateProps) {\n    super(props, DEFAULT_CLASS, new WmCarouselTemplateProps());\n  }\n\n  renderWidget(props: WmCarouselTemplateProps) {\n    return (<View style={this.styles.root}>{this._background}{props.children}</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,uBAAuB,MAAM,2BAA2B;AAC/D,SAASC,aAAa,QAAkC,4BAA4B;AAEpF,OAAO,MAAMC,uBAAuB,SAASH,kBAAkB,CAA0B;AAEzF,eAAe,MAAMI,kBAAkB,SAASL,aAAa,CAA6E;EAExIM,WAAWA,CAACC,KAA8B,EAAE;IAC1C,KAAK,CAACA,KAAK,EAAEJ,aAAa,EAAE,IAAID,uBAAuB,CAAC,CAAC,CAAC;EAC5D;EAEAM,YAAYA,CAACD,KAA8B,EAAE;IAC3C,oBAAQT,KAAA,CAAAW,aAAA,CAACV,IAAI;MAACW,KAAK,EAAE,IAAI,CAACC,MAAM,CAACC;IAAK,GAAE,IAAI,CAACC,WAAW,EAAEN,KAAK,CAACO,QAAe,CAAC;EAClF;AACF"}
+{"version":3,"names":["React","View","BaseComponent","BaseComponentState","WmCarouselTemplateProps","DEFAULT_CLASS","WmCarouselTemplateState","WmCarouselTemplate","constructor","props","renderWidget","_this$parent","createElement","style","styles","root","height","parent","_background","children"],"sources":["carousel-template.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 WmCarouselTemplateProps from './carousel-template.props';\nimport { DEFAULT_CLASS, WmCarouselTemplateStyles } from './carousel-template.styles';\n\nexport class WmCarouselTemplateState extends BaseComponentState<WmCarouselTemplateProps> {}\n\nexport default class WmCarouselTemplate extends BaseComponent<WmCarouselTemplateProps, WmCarouselTemplateState, WmCarouselTemplateStyles> {\n\n  constructor(props: WmCarouselTemplateProps) {\n    super(props, DEFAULT_CLASS, new WmCarouselTemplateProps());\n  }\n\n  renderWidget(props: WmCarouselTemplateProps) {\n    return (<View style={[this.styles.root, {\n      height: this.styles.root.height || (this.parent?.styles.root.height && '100%')\n    }]}>{this._background}{props.children}</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,uBAAuB,MAAM,2BAA2B;AAC/D,SAASC,aAAa,QAAkC,4BAA4B;AAEpF,OAAO,MAAMC,uBAAuB,SAASH,kBAAkB,CAA0B;AAEzF,eAAe,MAAMI,kBAAkB,SAASL,aAAa,CAA6E;EAExIM,WAAWA,CAACC,KAA8B,EAAE;IAC1C,KAAK,CAACA,KAAK,EAAEJ,aAAa,EAAE,IAAID,uBAAuB,CAAC,CAAC,CAAC;EAC5D;EAEAM,YAAYA,CAACD,KAA8B,EAAE;IAAA,IAAAE,YAAA;IAC3C,oBAAQX,KAAA,CAAAY,aAAA,CAACX,IAAI;MAACY,KAAK,EAAE,CAAC,IAAI,CAACC,MAAM,CAACC,IAAI,EAAE;QACtCC,MAAM,EAAE,IAAI,CAACF,MAAM,CAACC,IAAI,CAACC,MAAM,IAAK,EAAAL,YAAA,OAAI,CAACM,MAAM,cAAAN,YAAA,uBAAXA,YAAA,CAAaG,MAAM,CAACC,IAAI,CAACC,MAAM,KAAI;MACzE,CAAC;IAAE,GAAE,IAAI,CAACE,WAAW,EAAET,KAAK,CAACU,QAAe,CAAC;EAC/C;AACF"}

app-rn-runtime/components/advanced/carousel/carousel-template/carousel-template.styles.js

@@ -7,8 +7,7 @@ BASE_THEME.registerStyle((themeVariables, addStyle) => {
       flexDirection: 'column',
       justifyContent: 'center',
       alignItems: 'center',
-      width: '100%',
-      height: '100%'
+      width: '100%'
     },
     text: {}
   });

app-rn-runtime/components/advanced/carousel/carousel-template/carousel-template.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","flexDirection","justifyContent","alignItems","width","height","text"],"sources":["carousel-template.styles.ts"],"sourcesContent":["import BASE_THEME from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\n\nexport type WmCarouselTemplateStyles = BaseStyles & {};\n\nexport const DEFAULT_CLASS = 'app-carousel-template';\n\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n    const defaultStyles: WmCarouselTemplateStyles = defineStyles({\n        root: {\n            flexDirection: 'column',\n            justifyContent: 'center',\n            alignItems: 'center',\n            width: '100%',\n            height: '100%'\n        },\n        text: {}\n    });\n\n    addStyle(DEFAULT_CLASS, '', defaultStyles);\n});"],"mappings":"AAAA,OAAOA,UAAU,MAAM,wCAAwC;AAC/D,SAAqBC,YAAY,QAAQ,+CAA+C;AAIxF,OAAO,MAAMC,aAAa,GAAG,uBAAuB;AAEpDF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACnD,MAAMC,aAAuC,GAAGL,YAAY,CAAC;IACzDM,IAAI,EAAE;MACFC,aAAa,EAAE,QAAQ;MACvBC,cAAc,EAAE,QAAQ;MACxBC,UAAU,EAAE,QAAQ;MACpBC,KAAK,EAAE,MAAM;MACbC,MAAM,EAAE;IACZ,CAAC;IACDC,IAAI,EAAE,CAAC;EACX,CAAC,CAAC;EAEFR,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;AAC9C,CAAC,CAAC"}
+{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","flexDirection","justifyContent","alignItems","width","text"],"sources":["carousel-template.styles.ts"],"sourcesContent":["import BASE_THEME from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\n\nexport type WmCarouselTemplateStyles = BaseStyles & {};\n\nexport const DEFAULT_CLASS = 'app-carousel-template';\n\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n    const defaultStyles: WmCarouselTemplateStyles = defineStyles({\n        root: {\n            flexDirection: 'column',\n            justifyContent: 'center',\n            alignItems: 'center',\n            width: '100%'\n        },\n        text: {}\n    });\n\n    addStyle(DEFAULT_CLASS, '', defaultStyles);\n});"],"mappings":"AAAA,OAAOA,UAAU,MAAM,wCAAwC;AAC/D,SAAqBC,YAAY,QAAQ,+CAA+C;AAIxF,OAAO,MAAMC,aAAa,GAAG,uBAAuB;AAEpDF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACnD,MAAMC,aAAuC,GAAGL,YAAY,CAAC;IACzDM,IAAI,EAAE;MACFC,aAAa,EAAE,QAAQ;MACvBC,cAAc,EAAE,QAAQ;MACxBC,UAAU,EAAE,QAAQ;MACpBC,KAAK,EAAE;IACX,CAAC;IACDC,IAAI,EAAE,CAAC;EACX,CAAC,CAAC;EAEFP,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;AAC9C,CAAC,CAAC"}

app-rn-runtime/components/advanced/carousel/carousel.component.js

@@ -2,87 +2,124 @@ 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 { View, Text } from 'react-native';
-import Carousel, { Pagination } from 'react-native-snap-carousel';
+import { isArray } from 'lodash-es';
+import { Animated, View } from 'react-native';
+import { DefaultKeyExtractor } from '@wavemaker/app-rn-runtime/core/key.extractor';
 import WmIcon from '@wavemaker/app-rn-runtime/components/basic/icon/icon.component';
 import { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';
+import * as SwipeAnimation from '@wavemaker/app-rn-runtime/gestures/swipe.animation';
 import WmCarouselProps from './carousel.props';
 import { DEFAULT_CLASS } from './carousel.styles';
 export class WmCarouselState extends BaseComponentState {
   constructor() {
     super(...arguments);
-    _defineProperty(this, "activeIndex", 0);
-    _defineProperty(this, "sliderWidth", 0);
+    _defineProperty(this, "activeIndex", 1);
   }
 }
 export default class WmCarousel extends BaseComponent {
   constructor(_props) {
     super(_props, DEFAULT_CLASS, new WmCarouselProps(), new WmCarouselState());
-    _defineProperty(this, "carouselRef", null);
     _defineProperty(this, "noOfSlides", 0);
+    _defineProperty(this, "slideLayout", null);
+    _defineProperty(this, "keyExtractor", new DefaultKeyExtractor());
     _defineProperty(this, "stopPlay", null);
+    _defineProperty(this, "animationView", null);
+    _defineProperty(this, "animationHandlers", {
+      bounds: e => {
+        var _this$slideLayout;
+        const activeTabIndex = this.state.activeIndex - 1,
+          w = ((_this$slideLayout = this.slideLayout) === null || _this$slideLayout === void 0 ? void 0 : _this$slideLayout.width) || 0,
+          props = this.state.props,
+          noOfTabs = props.type === 'dynamic' ? props.dataset : props.children;
+        return {
+          lower: -1 * (activeTabIndex - (activeTabIndex === 0 ? 0 : 1)) * w,
+          center: -1 * activeTabIndex * w,
+          upper: -1 * (activeTabIndex + (activeTabIndex === noOfTabs - 1 ? 0 : 1)) * w
+        };
+      },
+      computePhase: value => {
+        var _this$slideLayout2;
+        const w = ((_this$slideLayout2 = this.slideLayout) === null || _this$slideLayout2 === void 0 ? void 0 : _this$slideLayout2.width) || 0;
+        return w && Math.abs(value / w);
+      },
+      onLower: e => {
+        this.onSlideChange(this.state.activeIndex - 1);
+      },
+      onUpper: e => {
+        this.onSlideChange(this.state.activeIndex + 1);
+      }
+    });
     _defineProperty(this, "onSlideChange", index => {
       const prevIndex = this.state.activeIndex;
       this.updateState({
         activeIndex: index
       }, () => this.invokeEventCallback('onChange', [this, index, prevIndex]));
     });
-    _defineProperty(this, "renderItem", data => {
+    _defineProperty(this, "renderItem", (item, index) => {
       const props = this.state.props;
       if (props.type === 'dynamic') {
-        return props.renderSlide ? props.renderSlide(data.item, data.index) : null;
+        return props.renderSlide ? props.renderSlide(item, index) : null;
       }
-      return props.children[data.index];
-    });
-    _defineProperty(this, "onLayoutChange", e => {
-      this.updateState({
-        sliderWidth: e.nativeEvent.layout.width
-      });
-    });
-    _defineProperty(this, "getDotElement", _ref => {
-      let {
-        active,
-        index
-      } = _ref;
-      return /*#__PURE__*/React.createElement(Text, {
-        style: active ? this.styles.activeDotStyle : this.styles.dotStyle
-      }, index);
+      return props.children[index];
     });
     _defineProperty(this, "next", () => {
-      if (this.carouselRef && this.carouselRef.currentIndex < this.noOfSlides - 1) {
-        var _this$carouselRef;
-        (_this$carouselRef = this.carouselRef) === null || _this$carouselRef === void 0 ? void 0 : _this$carouselRef.snapToNext();
+      const props = this.state.props;
+      const data = props.type === 'dynamic' ? props.dataset : props.children;
+      if (this.state.activeIndex >= (data === null || data === void 0 ? void 0 : data.length) || 0) {
+        var _this$animationView;
+        this.onSlideChange(1);
+        (_this$animationView = this.animationView) === null || _this$animationView === void 0 ? void 0 : _this$animationView.setPosition(0);
       } else {
-        var _this$carouselRef2;
-        (_this$carouselRef2 = this.carouselRef) === null || _this$carouselRef2 === void 0 ? void 0 : _this$carouselRef2.snapToItem(0);
+        var _this$animationView2;
+        (_this$animationView2 = this.animationView) === null || _this$animationView2 === void 0 ? void 0 : _this$animationView2.goToUpper();
       }
     });
     _defineProperty(this, "prev", () => {
-      if (this.carouselRef && this.carouselRef.currentIndex > 0) {
-        var _this$carouselRef3;
-        (_this$carouselRef3 = this.carouselRef) === null || _this$carouselRef3 === void 0 ? void 0 : _this$carouselRef3.snapToPrev();
-      } else {
-        var _this$carouselRef4;
-        (_this$carouselRef4 = this.carouselRef) === null || _this$carouselRef4 === void 0 ? void 0 : _this$carouselRef4.snapToItem(this.noOfSlides - 1);
-      }
+      var _this$animationView3;
+      (_this$animationView3 = this.animationView) === null || _this$animationView3 === void 0 ? void 0 : _this$animationView3.goToLower();
     });
     this.cleanup.push(() => {
       this.stopPlay && this.stopPlay();
     });
   }
+  generateItemKey(item, index, props) {
+    if (props.itemkey && item && !this._showSkeleton) {
+      return props.itemkey(item, index);
+    }
+    return 'list_item_' + this.keyExtractor.getKey(item, true);
+  }
+  setSlideLayout(event) {
+    this.slideLayout = event.nativeEvent.layout;
+    this.forceUpdate();
+  }
   autoPlay() {
     const props = this.state.props;
     this.stopPlay && this.stopPlay();
-    if (props.animation && props.animationinterval) {
+    if (props.animation === 'auto' && props.animationinterval) {
       const intervalId = setInterval(() => {
         this.next();
       }, props.animationinterval * 1000);
       this.stopPlay = () => clearInterval(intervalId);
+    } else {
+      setTimeout(() => {
+        var _this$animationView4;
+        this.onSlideChange(1);
+        (_this$animationView4 = this.animationView) === null || _this$animationView4 === void 0 ? void 0 : _this$animationView4.setPosition(0);
+      }, 1000);
     }
   }
   onPropertyChange(name, $new, $old) {
     super.onPropertyChange(name, $new, $old);
     switch (name) {
+      case 'dataset':
+        {
+          var _this$keyExtractor;
+          (_this$keyExtractor = this.keyExtractor) === null || _this$keyExtractor === void 0 ? void 0 : _this$keyExtractor.clear();
+          this.updateState({
+            activeIndex: Math.min(this.state.activeIndex, ($new === null || $new === void 0 ? void 0 : $new.length) || 0)
+          });
+          break;
+        }
       case 'animation':
       case 'animationinterval':
         {
@@ -90,58 +127,83 @@ export default class WmCarousel extends BaseComponent {
         }
     }
   }
-  renderPagination(props, styles) {
-    return /*#__PURE__*/React.createElement(Pagination, {
-      carouselRef: this.carouselRef,
-      dotsLength: this.noOfSlides,
-      activeDotIndex: this.state.activeIndex,
-      containerStyle: styles.dotsWrapperStyle,
-      dotStyle: styles.activeDotStyle,
-      inactiveDotStyle: styles.dotStyle,
-      inactiveDotScale: 0.8,
-      tappableDots: true
-    });
+  renderPagination(data) {
+    const maxNoOfDots = this.state.props.maxnoofdots;
+    let minIndex = Math.max(this.state.activeIndex - maxNoOfDots + 1, 0);
+    let maxIndex = Math.min(minIndex + maxNoOfDots - 1, data.length);
+    if (maxIndex === data.length) {
+      minIndex = maxIndex - maxNoOfDots;
+    }
+    return /*#__PURE__*/React.createElement(View, {
+      style: this.styles.dotsWrapperStyle
+    }, data.map((item, index) => {
+      return index >= minIndex && index <= maxIndex ? /*#__PURE__*/React.createElement(View, {
+        key: 'dots_' + this.generateItemKey(item, index, this.state.props),
+        style: [this.styles.dotStyle, index === this.state.activeIndex - 1 ? this.styles.activeDotStyle : null]
+      }) : null;
+    }));
   }
   renderWidget(props) {
+    var _data;
     const hasNavs = props.controls === 'both' || props.controls === 'navs';
     const hasDots = props.controls === 'both' || props.controls === 'indicators';
     let styles = this.styles;
-    const data = props.type === 'dynamic' ? props.dataset : props.children;
-    this.noOfSlides = (data === null || data === void 0 ? void 0 : data.length) || 0;
-    const autoPlay = props.animation === 'auto';
+    let data = props.type === 'dynamic' ? props.dataset : props.children;
+    data = isArray(data) ? data : [];
+    this.noOfSlides = ((_data = data) === null || _data === void 0 ? void 0 : _data.length) || 0;
     // TODO: loop prop on Carousel is not working Refer: https://github.com/meliorence/react-native-snap-carousel/issues/608
     return /*#__PURE__*/React.createElement(View, {
       style: styles.root,
-      onLayout: this.onLayoutChange
-    }, this._background, this.state.sliderWidth > 0 ? /*#__PURE__*/React.createElement(Carousel, {
-      ref: ref => this.carouselRef = ref,
-      data: data || [],
-      firstItem: 0,
+      onLayout: this.setSlideLayout.bind(this)
+    }, this._background, /*#__PURE__*/React.createElement(SwipeAnimation.View, {
+      enableGestures: props.enablegestures,
       style: {
-        width: '100%',
-        height: '100%'
+        flexDirection: 'row',
+        flexWrap: 'nowrap',
+        alignItems: 'center',
+        height: props.type === 'dynamic' ? undefined : '100%'
+      },
+      direction: "horizontal",
+      ref: r => {
+        this.animationView = r;
       },
-      enableSnap: true,
-      loopClonesPerSide: 1,
-      autoplay: false,
-      activeSlideAlignment: "start",
-      renderItem: this.renderItem,
-      sliderWidth: this.state.sliderWidth,
-      itemWidth: this.state.sliderWidth,
-      lockScrollWhileSnapping: false,
-      scrollEnabled: false,
-      onSnapToItem: this.onSlideChange
-    }) : null, hasNavs ? /*#__PURE__*/React.createElement(View, {
+      handlers: this.animationHandlers
+    }, data.map((item, index) => {
+      var _this$animationView5, _this$animationView6;
+      const isActive = index === this.state.activeIndex - 1;
+      let scale = (_this$animationView5 = this.animationView) === null || _this$animationView5 === void 0 ? void 0 : _this$animationView5.animationPhase.interpolate({
+        inputRange: [-2000, index - 1, index, index + 1, 2000],
+        outputRange: [0.8, 0.8, 1, 0.8, 0.8]
+      });
+      let translateX = (_this$animationView6 = this.animationView) === null || _this$animationView6 === void 0 ? void 0 : _this$animationView6.animationPhase.interpolate({
+        inputRange: [-2000, index - 1, index, index + 1, 2000],
+        outputRange: [-56, -56, 0, 56, 56]
+      });
+      return /*#__PURE__*/React.createElement(Animated.View, {
+        key: this.generateItemKey(item, index, props),
+        style: [{
+          height: props.type === 'dynamic' ? undefined : '100%'
+        }, this.styles.slide, index === 0 ? this.styles.firstSlide : null, index === data.length - 1 ? this.styles.lastSlide : null, isActive ? this.styles.activeSlide : null, translateX && scale ? {
+          transform: [{
+            translateX: translateX
+          }, {
+            scale: scale
+          }]
+        } : null]
+      }, this.renderItem(item, index));
+    })), hasNavs ? /*#__PURE__*/React.createElement(View, {
       style: styles.btnPanel
     }, /*#__PURE__*/React.createElement(WmIcon, {
+      id: this.getTestId('prev_icon'),
       iconclass: "wi wi-chevron-left fa-2x",
       styles: styles.prevBtn,
       onTap: this.prev
     }), /*#__PURE__*/React.createElement(WmIcon, {
+      id: this.getTestId('next_icon'),
       iconclass: "wi wi-chevron-right fa-2x",
       styles: styles.nextBtn,
       onTap: this.next
-    })) : null, this.state.sliderWidth > 0 && hasDots && data ? this.renderPagination(props, styles) : null);
+    })) : null, hasDots && data ? this.renderPagination(data) : null);
   }
 }
 //# sourceMappingURL=carousel.component.js.map

app-rn-runtime/components/advanced/carousel/carousel.component.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","View","Text","Carousel","Pagination","WmIcon","BaseComponent","BaseComponentState","WmCarouselProps","DEFAULT_CLASS","WmCarouselState","constructor","arguments","_defineProperty","WmCarousel","props","index","prevIndex","state","activeIndex","updateState","invokeEventCallback","data","type","renderSlide","item","children","e","sliderWidth","nativeEvent","layout","width","_ref","active","createElement","style","styles","activeDotStyle","dotStyle","carouselRef","currentIndex","noOfSlides","_this$carouselRef","snapToNext","_this$carouselRef2","snapToItem","_this$carouselRef3","snapToPrev","_this$carouselRef4","cleanup","push","stopPlay","autoPlay","animation","animationinterval","intervalId","setInterval","next","clearInterval","onPropertyChange","name","$new","$old","renderPagination","dotsLength","activeDotIndex","containerStyle","dotsWrapperStyle","inactiveDotStyle","inactiveDotScale","tappableDots","renderWidget","hasNavs","controls","hasDots","dataset","length","root","onLayout","onLayoutChange","_background","ref","firstItem","height","enableSnap","loopClonesPerSide","autoplay","activeSlideAlignment","renderItem","itemWidth","lockScrollWhileSnapping","scrollEnabled","onSnapToItem","onSlideChange","btnPanel","iconclass","prevBtn","onTap","prev","nextBtn"],"sources":["carousel.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View, Text, LayoutChangeEvent } from 'react-native';\nimport Carousel, { Pagination } from 'react-native-snap-carousel';\nimport WmIcon from '@wavemaker/app-rn-runtime/components/basic/icon/icon.component';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmCarouselProps from './carousel.props';\nimport { DEFAULT_CLASS, WmCarouselStyles } from './carousel.styles';\n\nexport class WmCarouselState extends BaseComponentState<WmCarouselProps> {\n  activeIndex = 0;\n  sliderWidth = 0;\n}\n\nexport default class WmCarousel extends BaseComponent<WmCarouselProps, WmCarouselState, WmCarouselStyles> {\n\n  carouselRef: Carousel<unknown> | null = null as any;\n  noOfSlides: number = 0;\n  stopPlay: Function = null as any;\n\n  constructor(props: WmCarouselProps) {\n    super(props, DEFAULT_CLASS, new WmCarouselProps(), new WmCarouselState());\n    this.cleanup.push(() => {\n      this.stopPlay && this.stopPlay();\n    })\n  }\n\n  autoPlay() {\n    const props = this.state.props;\n    this.stopPlay && this.stopPlay();\n    if (props.animation && props.animationinterval) {\n      const intervalId = setInterval(() => {\n        this.next();\n      }, props.animationinterval * 1000);\n      this.stopPlay = () => clearInterval(intervalId);\n    }\n  }\n\n  onPropertyChange(name: string, $new: any, $old: any): void {\n      super.onPropertyChange(name, $new, $old);\n      switch (name) {\n        case 'animation':\n        case 'animationinterval' : {\n          this.autoPlay();\n        }\n      }\n  }\n\n  onSlideChange = (index: number) => {\n    const prevIndex = this.state.activeIndex;\n    this.updateState({\n      activeIndex: index\n    } as WmCarouselState,\n    () => this.invokeEventCallback('onChange', [this, index, prevIndex]));\n  }\n\n  renderItem = (data: any) => {\n    const props = this.state.props;\n    if (props.type === 'dynamic') {\n      return props.renderSlide ? props.renderSlide(data.item, data.index) : null;\n    }\n    return props.children[data.index];\n  }\n\n  onLayoutChange = (e: LayoutChangeEvent) => {\n    this.updateState({\n      sliderWidth: e.nativeEvent.layout.width\n    } as WmCarouselState);\n  }\n\n  getDotElement = ({active, index}: {active: boolean, index: number}) => {\n    return (<Text style={active ? this.styles.activeDotStyle: this.styles.dotStyle}>{index}</Text>);\n  }\n\n  renderPagination(props: WmCarouselProps, styles: WmCarouselStyles) {\n    return (\n        <Pagination\n          carouselRef={this.carouselRef as any}\n          dotsLength={this.noOfSlides}\n          activeDotIndex={this.state.activeIndex}\n          containerStyle={styles.dotsWrapperStyle}\n          dotStyle={styles.activeDotStyle}\n          inactiveDotStyle={styles.dotStyle}\n          inactiveDotScale={0.8}\n          tappableDots={true}\n        />\n    );\n  }\n\n  next = () => {\n    if (this.carouselRef && this.carouselRef.currentIndex < this.noOfSlides - 1) {\n      this.carouselRef?.snapToNext();\n    } else {\n      this.carouselRef?.snapToItem(0);\n    }\n  }\n\n  prev = () => {\n    if (this.carouselRef && this.carouselRef.currentIndex > 0) {\n      this.carouselRef?.snapToPrev();\n    } else {\n      this.carouselRef?.snapToItem(this.noOfSlides - 1);\n    }\n  }\n\n  renderWidget(props: WmCarouselProps) {\n    const hasNavs = props.controls === 'both' || props.controls ==='navs';\n    const hasDots = props.controls === 'both' || props.controls ==='indicators';\n    let styles = this.styles;\n    const data = props.type === 'dynamic' ? props.dataset : props.children;\n    this.noOfSlides = data?.length || 0;\n    const autoPlay = props.animation === 'auto';\n    // TODO: loop prop on Carousel is not working Refer: https://github.com/meliorence/react-native-snap-carousel/issues/608\n    return (\n      <View style={styles.root} onLayout={this.onLayoutChange}>\n        {this._background}\n        {this.state.sliderWidth > 0 ?\n          (<Carousel\n            ref={ref => this.carouselRef = ref}\n            data={data || []}\n            firstItem={0}\n            style={{width: '100%', height: '100%'}}\n            enableSnap={true}\n            loopClonesPerSide={1}\n            autoplay={false}\n            activeSlideAlignment='start'\n            renderItem={this.renderItem}\n            sliderWidth={this.state.sliderWidth}\n            itemWidth={this.state.sliderWidth}\n            lockScrollWhileSnapping={false}\n            scrollEnabled={false}\n            onSnapToItem={this.onSlideChange}\n          ></Carousel>) : null}\n        {hasNavs ? (\n          <View style={styles.btnPanel}>\n            <WmIcon\n              iconclass=\"wi wi-chevron-left fa-2x\"\n              styles={styles.prevBtn}\n              onTap={this.prev}/>\n            <WmIcon\n              iconclass=\"wi wi-chevron-right fa-2x\"\n              styles={styles.nextBtn}\n              onTap={this.next}/>\n          </View>): null}\n        {this.state.sliderWidth > 0 && hasDots && data ? this.renderPagination(props, styles) : null}\n      </View>);\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["React","isArray","Animated","View","DefaultKeyExtractor","WmIcon","BaseComponent","BaseComponentState","SwipeAnimation","WmCarouselProps","DEFAULT_CLASS","WmCarouselState","constructor","arguments","_defineProperty","WmCarousel","props","bounds","e","_this$slideLayout","activeTabIndex","state","activeIndex","w","slideLayout","width","noOfTabs","type","dataset","children","lower","center","upper","computePhase","value","_this$slideLayout2","Math","abs","onLower","onSlideChange","onUpper","index","prevIndex","updateState","invokeEventCallback","item","renderSlide","data","length","_this$animationView","animationView","setPosition","_this$animationView2","goToUpper","_this$animationView3","goToLower","cleanup","push","stopPlay","generateItemKey","itemkey","_showSkeleton","keyExtractor","getKey","setSlideLayout","event","nativeEvent","layout","forceUpdate","autoPlay","animation","animationinterval","intervalId","setInterval","next","clearInterval","setTimeout","_this$animationView4","onPropertyChange","name","$new","$old","_this$keyExtractor","clear","min","renderPagination","maxNoOfDots","maxnoofdots","minIndex","max","maxIndex","createElement","style","styles","dotsWrapperStyle","map","key","dotStyle","activeDotStyle","renderWidget","_data","hasNavs","controls","hasDots","noOfSlides","root","onLayout","bind","_background","enableGestures","enablegestures","flexDirection","flexWrap","alignItems","height","undefined","direction","ref","r","handlers","animationHandlers","_this$animationView5","_this$animationView6","isActive","scale","animationPhase","interpolate","inputRange","outputRange","translateX","slide","firstSlide","lastSlide","activeSlide","transform","renderItem","btnPanel","id","getTestId","iconclass","prevBtn","onTap","prev","nextBtn"],"sources":["carousel.component.tsx"],"sourcesContent":["import React from 'react';\nimport { isArray } from 'lodash-es';\nimport { Animated, View, Text, LayoutChangeEvent, LayoutRectangle } from 'react-native';\nimport { DefaultKeyExtractor } from '@wavemaker/app-rn-runtime/core/key.extractor';\nimport WmIcon from '@wavemaker/app-rn-runtime/components/basic/icon/icon.component';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\nimport * as SwipeAnimation from '@wavemaker/app-rn-runtime/gestures/swipe.animation';\n\nimport WmCarouselProps from './carousel.props';\nimport { DEFAULT_CLASS, WmCarouselStyles } from './carousel.styles';\n\nexport class WmCarouselState extends BaseComponentState<WmCarouselProps> {\n  activeIndex = 1;\n}\n\nexport default class WmCarousel extends BaseComponent<WmCarouselProps, WmCarouselState, WmCarouselStyles> {\n\n  noOfSlides: number = 0;\n  private slideLayout: LayoutRectangle = null as any;\n  private keyExtractor = new DefaultKeyExtractor();\n  stopPlay: Function = null as any;\n  private animationView: SwipeAnimation.View | null = null as any;\n  private animationHandlers = {\n    bounds: (e) => {\n      const activeTabIndex = this.state.activeIndex - 1,\n            w = this.slideLayout?.width || 0,\n            props = this.state.props,\n            noOfTabs = props.type === 'dynamic' ? props.dataset : props.children;\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    computePhase: (value) => {\n      const w = this.slideLayout?.width || 0;\n      return w && Math.abs(value / w);\n    },\n    onLower: (e) => {\n      this.onSlideChange(this.state.activeIndex - 1);\n    },\n    onUpper: (e) => {\n      this.onSlideChange(this.state.activeIndex + 1);\n    }\n  } as SwipeAnimation.Handlers;\n\n  constructor(props: WmCarouselProps) {\n    super(props, DEFAULT_CLASS, new WmCarouselProps(), new WmCarouselState());\n    this.cleanup.push(() => {\n      this.stopPlay && this.stopPlay();\n    })\n  }\n\n  private generateItemKey(item: any, index: number, props: WmCarouselProps) {\n    if (props.itemkey && item && !this._showSkeleton) {\n      return props.itemkey(item, index);\n    }\n    return 'list_item_' +  this.keyExtractor.getKey(item, true);\n  }\n\n  setSlideLayout(event: LayoutChangeEvent) {\n    this.slideLayout = event.nativeEvent.layout;\n    this.forceUpdate();\n  }\n\n  autoPlay() {\n    const props = this.state.props;\n    this.stopPlay && this.stopPlay();\n    if (props.animation === 'auto' && props.animationinterval) {\n      const intervalId = setInterval(() => {\n        this.next();\n      }, props.animationinterval * 1000);\n      this.stopPlay = () => clearInterval(intervalId);\n    } else {\n      setTimeout(() => {\n        this.onSlideChange(1);\n        this.animationView?.setPosition(0);\n      }, 1000);\n    }\n  }\n\n  onPropertyChange(name: string, $new: any, $old: any): void {\n      super.onPropertyChange(name, $new, $old);\n      switch (name) {\n        case 'dataset': {\n          this.keyExtractor?.clear();\n          this.updateState({\n            activeIndex: Math.min(this.state.activeIndex, $new?.length || 0)\n          } as WmCarouselState);\n          break;\n        }\n        case 'animation':\n        case 'animationinterval' : {\n          this.autoPlay();\n        }\n      }\n  }\n\n  onSlideChange = (index: number) => {\n    const prevIndex = this.state.activeIndex;\n    this.updateState({\n      activeIndex: index\n    } as WmCarouselState,\n    () => this.invokeEventCallback('onChange', [this, index, prevIndex]));\n  }\n\n  renderItem = (item: any, index: number) => {\n    const props = this.state.props;\n    if (props.type === 'dynamic') {\n      return props.renderSlide ? props.renderSlide(item, index) : null;\n    }\n    return props.children[index];\n  }\n\n  next = () => {\n    const props = this.state.props;\n    const data = props.type === 'dynamic' ? props.dataset : props.children;\n    if (this.state.activeIndex >= data?.length || 0) {\n      this.onSlideChange(1);\n      this.animationView?.setPosition(0);\n    } else {\n      this.animationView?.goToUpper();\n    }\n  }\n\n  prev = () => {\n    this.animationView?.goToLower();\n  }\n\n  renderPagination(data: any) {\n    const maxNoOfDots = this.state.props.maxnoofdots;\n    let minIndex = Math.max(this.state.activeIndex - maxNoOfDots + 1, 0);\n    let maxIndex = Math.min(minIndex + maxNoOfDots - 1, data.length);\n    if (maxIndex === data.length) {\n      minIndex = maxIndex - maxNoOfDots;\n    }\n    return (<View style={this.styles.dotsWrapperStyle}>\n      {\n        data.map((item: any, index: number) => {\n          return index >= minIndex && index <= maxIndex ? (\n            <View key={'dots_' + this.generateItemKey(item, index, this.state.props)} \n              style={[\n                this.styles.dotStyle,\n                index === this.state.activeIndex - 1 ? this.styles.activeDotStyle: null]}>\n            </View>) : null;\n        })\n      }\n    </View>);\n  }\n\n  renderWidget(props: WmCarouselProps) {\n    const hasNavs = props.controls === 'both' || props.controls ==='navs';\n    const hasDots = props.controls === 'both' || props.controls ==='indicators';\n    let styles = this.styles;\n    let data = props.type === 'dynamic' ? props.dataset : props.children;\n    data = isArray(data) ? data : [];\n    this.noOfSlides = data?.length || 0;\n    // TODO: loop prop on Carousel is not working Refer: https://github.com/meliorence/react-native-snap-carousel/issues/608\n    return (\n      <View style={styles.root} onLayout={this.setSlideLayout.bind(this)}>\n        {this._background}\n        <SwipeAnimation.View \n            enableGestures={props.enablegestures}\n            style={{\n              flexDirection: 'row',\n              flexWrap: 'nowrap',\n              alignItems: 'center',\n              height: props.type === 'dynamic' ? undefined : '100%',\n            }}\n            direction='horizontal'\n            ref={(r) => {this.animationView = r}}\n            handlers = {this.animationHandlers}\n          >\n          {data.map((item: any, index: number) => {\n            const isActive = index === this.state.activeIndex - 1;\n            let scale = this.animationView?.animationPhase.interpolate({\n              inputRange: [-2000, index - 1, index, index + 1, 2000],\n              outputRange: [0.8, 0.8, 1, 0.8, 0.8]\n            });\n            let translateX = this.animationView?.animationPhase.interpolate({\n              inputRange: [-2000, index - 1, index, index + 1, 2000],\n              outputRange: [-56, -56, 0, 56, 56]\n            });\n            return (\n              <Animated.View key={this.generateItemKey(item, index, props)}\n                style={[\n                  {height: props.type === 'dynamic' ? undefined : '100%'},\n                  this.styles.slide,\n                  index === 0 ? this.styles.firstSlide : null,\n                  index === data.length - 1 ? this.styles.lastSlide: null,\n                  isActive ? this.styles.activeSlide: null,\n                  translateX && scale ? {\n                    transform: [\n                      {\n                        translateX: translateX\n                      },\n                      {\n                        scale: scale\n                      }\n                    ]\n                  } : null]}>\n                {this.renderItem(item, index)}\n              </Animated.View>\n            );\n          })}\n        </SwipeAnimation.View>\n        {hasNavs ? (\n          <View style={styles.btnPanel}>\n            <WmIcon\n              id={this.getTestId('prev_icon')}\n              iconclass=\"wi wi-chevron-left fa-2x\"\n              styles={styles.prevBtn}\n              onTap={this.prev}/>\n            <WmIcon\n              id={this.getTestId('next_icon')}\n              iconclass=\"wi wi-chevron-right fa-2x\"\n              styles={styles.nextBtn}\n              onTap={this.next}/>\n          </View>): null}\n          {hasDots && data ? this.renderPagination(data) : null}\n      </View>);\n  }\n}\n"],"mappings":"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"}

app-rn-runtime/components/advanced/carousel/carousel.props.js

@@ -11,7 +11,10 @@ export default class WmCarouselProps extends BaseProps {
     _defineProperty(this, "animationinterval", 3);
     _defineProperty(this, "controls", 'both');
     _defineProperty(this, "children", null);
+    _defineProperty(this, "itemkey", null);
     _defineProperty(this, "renderSlide", void 0);
+    _defineProperty(this, "enablegestures", true);
+    _defineProperty(this, "maxnoofdots", 20);
   }
 }
 //# sourceMappingURL=carousel.props.js.map

app-rn-runtime/components/advanced/carousel/carousel.props.js.map

@@ -1 +1 @@
-{"version":3,"names":["BaseProps","WmCarouselProps","constructor","arguments","_defineProperty"],"sources":["carousel.props.ts"],"sourcesContent":["import { BaseProps } from '@wavemaker/app-rn-runtime/core/base.component';\nimport React from 'react';\n\nexport default class WmCarouselProps extends BaseProps {\n  dataset: any = null;\n  type?: 'static' | 'dynamic' = 'static';\n  animation?: string = 'auto';\n  animationinterval?: number = 3;\n  controls?: 'both' | 'none' | 'navs' | 'indicators' = 'both';\n  children? = null as any;\n  renderSlide?: ($item: any, $index: number) => React.ReactNode;\n}"],"mappings":";;;AAAA,SAASA,SAAS,QAAQ,+CAA+C;AAGzE,eAAe,MAAMC,eAAe,SAASD,SAAS,CAAC;EAAAE,YAAA;IAAA,SAAAC,SAAA;IAAAC,eAAA,kBACtC,IAAI;IAAAA,eAAA,eACW,QAAQ;IAAAA,eAAA,oBACjB,MAAM;IAAAA,eAAA,4BACE,CAAC;IAAAA,eAAA,mBACuB,MAAM;IAAAA,eAAA,mBAC/C,IAAI;IAAAA,eAAA;EAAA;AAElB"}
+{"version":3,"names":["BaseProps","WmCarouselProps","constructor","arguments","_defineProperty"],"sources":["carousel.props.ts"],"sourcesContent":["import { BaseProps } from '@wavemaker/app-rn-runtime/core/base.component';\nimport React from 'react';\n\nexport default class WmCarouselProps extends BaseProps {\n  dataset: any = null;\n  type?: 'static' | 'dynamic' = 'static';\n  animation?: 'auto' | 'none' = 'auto';\n  animationinterval?: number = 3;\n  controls?: 'both' | 'none' | 'navs' | 'indicators' = 'both';\n  children? = null as any;\n  itemkey?: ($item: any, $index: any) => any = null as any;\n  renderSlide?: ($item: any, $index: number) => React.ReactNode;\n  enablegestures  = true;\n  maxnoofdots = 20;\n}"],"mappings":";;;AAAA,SAASA,SAAS,QAAQ,+CAA+C;AAGzE,eAAe,MAAMC,eAAe,SAASD,SAAS,CAAC;EAAAE,YAAA;IAAA,SAAAC,SAAA;IAAAC,eAAA,kBACtC,IAAI;IAAAA,eAAA,eACW,QAAQ;IAAAA,eAAA,oBACR,MAAM;IAAAA,eAAA,4BACP,CAAC;IAAAA,eAAA,mBACuB,MAAM;IAAAA,eAAA,mBAC/C,IAAI;IAAAA,eAAA,kBAC6B,IAAI;IAAAA,eAAA;IAAAA,eAAA,yBAE/B,IAAI;IAAAA,eAAA,sBACR,EAAE;EAAA;AAClB"}

app-rn-runtime/components/advanced/carousel/carousel.styles.js

@@ -15,6 +15,16 @@ BASE_THEME.registerStyle((themeVariables, addStyle) => {
       position: 'relative'
     },
     text: {},
+    slide: {
+      width: '100%',
+      paddingHorizontal: 16,
+      transform: [{
+        translateX: 0
+      }]
+    },
+    firstSlide: {},
+    lastSlide: {},
+    activeSlide: {},
     btnPanel: {
       position: 'absolute',
       top: '50%',
@@ -53,25 +63,23 @@ BASE_THEME.registerStyle((themeVariables, addStyle) => {
     },
     dotsWrapperStyle: {
       opacity: 1,
-      height: 64,
-      marginTop: -64,
-      position: 'absolute',
-      top: '100%',
       backgroundColor: themeVariables.carouselDotWrapperBgColor,
-      alignSelf: 'center',
+      flexDirection: 'row',
+      justifyContent: 'center',
+      alignItems: 'center',
       paddingTop: 4,
       paddingBottom: 4
     },
     activeDotStyle: {
-      width: 12,
-      height: 12,
-      borderRadius: 10,
       backgroundColor: themeVariables.carouselActiveDotColor,
       opacity: 1
     },
     dotStyle: {
+      width: 8,
+      height: 8,
+      borderRadius: 10,
       opacity: 0.2,
-      marginHorizontal: -2,
+      marginHorizontal: 2,
       backgroundColor: themeVariables.carouselDotColor
     }
   });

app-rn-runtime/components/advanced/carousel/carousel.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","btn","height","width","borderRadius","borderColor","transparent","borderWidth","justifyContent","defaultStyles","root","position","text","btnPanel","top","marginTop","flexDirection","alignItems","prevBtn","marginLeft","backgroundColor","carouselPrevBgColor","fontSize","icon","color","carouselPrevBtnColor","nextBtn","marginRight","carouselNextBtnColor","dotsWrapperStyle","opacity","carouselDotWrapperBgColor","alignSelf","paddingTop","paddingBottom","activeDotStyle","carouselActiveDotColor","dotStyle","marginHorizontal","carouselDotColor","transform","rotateY","defaultColorF","right","padding","primaryColor"],"sources":["carousel.styles.ts"],"sourcesContent":["import { ViewStyle } from 'react-native';\nimport BASE_THEME, { AllStyle } from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { WmIconStyles } from '@wavemaker/app-rn-runtime/components/basic/icon/icon.styles';\n\nexport type WmCarouselStyles = BaseStyles & {\n    btnPanel: AllStyle,\n    prevBtn: WmIconStyles,\n    nextBtn: WmIconStyles,\n    dotsWrapperStyle: AllStyle,\n    dotStyle: AllStyle,\n    activeDotStyle: AllStyle\n};\nexport const DEFAULT_CLASS = 'app-carousel';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n    const btn: ViewStyle = {\n        height: 48,\n        width: 48,\n        borderRadius: 48,\n        borderColor: themeVariables.transparent,\n        borderWidth: 1,\n        justifyContent: 'center'\n    };\n    const defaultStyles: WmCarouselStyles = defineStyles({\n        root: {\n            position: 'relative'\n        },\n        text: {},\n        btnPanel: {\n            position: 'absolute',\n            top: '50%',\n            marginTop: -64,\n            height: 64,\n            flexDirection: 'row',\n            alignItems: 'center',\n            justifyContent: 'space-between',\n            width: '100%'\n        },\n        prevBtn : {\n            root: {\n                marginLeft: 12,\n                ...btn,\n                backgroundColor: themeVariables.carouselPrevBgColor\n            },\n            text: {\n                fontSize: 32\n            },\n            icon : {\n                color: themeVariables.carouselPrevBtnColor\n            }\n        } as WmIconStyles,\n        nextBtn : {\n            root: {\n                marginRight: 12,\n                ...btn,\n                backgroundColor: themeVariables.carouselPrevBgColor\n            },\n            text: {\n                fontSize: 32\n            },\n            icon : {\n                color: themeVariables.carouselNextBtnColor\n            }\n        } as WmIconStyles,\n        dotsWrapperStyle:{\n            opacity: 1,\n            height: 64,\n            marginTop: -64,\n            position: 'absolute',\n            top: '100%',\n            backgroundColor: themeVariables.carouselDotWrapperBgColor,\n            alignSelf: 'center',\n            paddingTop: 4,\n            paddingBottom: 4\n        },\n        activeDotStyle: {\n            width: 12,\n            height: 12,\n            borderRadius: 10,\n            backgroundColor: themeVariables.carouselActiveDotColor,\n            opacity: 1\n        },\n        dotStyle: {\n            opacity: 0.2,\n            marginHorizontal: -2,\n            backgroundColor: themeVariables.carouselDotColor\n        }\n    } as WmCarouselStyles);\n\n    addStyle(DEFAULT_CLASS, '', defaultStyles);\n    addStyle(DEFAULT_CLASS + '-rtl', '', {\n        prevBtn : {\n            root:{\n                transform: [{rotateY: '180deg'}]\n            }\n        },\n        nextBtn : {\n            root:{\n                transform: [{rotateY: '180deg'}]\n            }\n        }\n    });\n\n    addStyle('app-carousel-1', '', {\n        btnPanel: {\n            top: '100%'\n        },\n        prevBtn: {\n            root: {\n                borderRadius: 6\n            }\n        },\n        nextBtn: {\n            root: {\n                borderRadius: 6\n            }\n        }\n    } as any as WmCarouselStyles);\n\n    addStyle('app-carousel-2', '', {\n        btnPanel: {\n            backgroundColor: themeVariables.defaultColorF,\n            width: '100%',\n            top: '100%',\n            right: 0,\n            padding: 8,\n            justifyContent: 'flex-end'\n        },\n        dotsWrapperStyle:{\n            alignSelf: 'flex-start',\n            justifyContent: 'flex-start'\n        },\n        activeDotStyle: {\n            backgroundColor: themeVariables.primaryColor,\n        },\n        dotStyle: {\n            backgroundColor: themeVariables.primaryColor,\n        },\n        prevBtn: {\n            root: {\n                backgroundColor: 'rgba(255, 255, 255, 0.1)',\n                borderColor: themeVariables.primaryColor,\n            },\n            icon : {\n                color: themeVariables.primaryColor\n            }\n        },\n        nextBtn: {\n            root: {\n                marginLeft: 8,\n                backgroundColor: 'rgba(255, 255, 255, 0.1)',\n                borderColor: themeVariables.primaryColor,\n            },\n            icon : {\n                color: themeVariables.primaryColor\n            }\n        }\n    } as any as WmCarouselStyles);\n});"],"mappings":"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"}
+{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","btn","height","width","borderRadius","borderColor","transparent","borderWidth","justifyContent","defaultStyles","root","position","text","slide","paddingHorizontal","transform","translateX","firstSlide","lastSlide","activeSlide","btnPanel","top","marginTop","flexDirection","alignItems","prevBtn","marginLeft","backgroundColor","carouselPrevBgColor","fontSize","icon","color","carouselPrevBtnColor","nextBtn","marginRight","carouselNextBtnColor","dotsWrapperStyle","opacity","carouselDotWrapperBgColor","paddingTop","paddingBottom","activeDotStyle","carouselActiveDotColor","dotStyle","marginHorizontal","carouselDotColor","rotateY","defaultColorF","right","padding","alignSelf","primaryColor"],"sources":["carousel.styles.ts"],"sourcesContent":["import { ViewStyle } from 'react-native';\nimport BASE_THEME, { AllStyle } from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { WmIconStyles } from '@wavemaker/app-rn-runtime/components/basic/icon/icon.styles';\n\nexport type WmCarouselStyles = BaseStyles & {\n    btnPanel: AllStyle,\n    prevBtn: WmIconStyles,\n    slide: AllStyle,\n    firstSlide: AllStyle,\n    lastSlide: AllStyle,\n    activeSlide: AllStyle,\n    nextBtn: WmIconStyles,\n    dotsWrapperStyle: AllStyle,\n    dotStyle: AllStyle,\n    activeDotStyle: AllStyle\n};\nexport const DEFAULT_CLASS = 'app-carousel';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n    const btn: ViewStyle = {\n        height: 48,\n        width: 48,\n        borderRadius: 48,\n        borderColor: themeVariables.transparent,\n        borderWidth: 1,\n        justifyContent: 'center'\n    };\n    const defaultStyles: WmCarouselStyles = defineStyles({\n        root: {\n            position: 'relative'\n        },\n        text: {},\n        slide: {\n            width: '100%',\n            paddingHorizontal: 16,\n            transform: [\n                {\n                    translateX: 0\n                }\n            ]\n        },\n        firstSlide: {},\n        lastSlide: {},\n        activeSlide: {},\n        btnPanel: {\n            position: 'absolute',\n            top: '50%',\n            marginTop: -64,\n            height: 64,\n            flexDirection: 'row',\n            alignItems: 'center',\n            justifyContent: 'space-between',\n            width: '100%'\n        },\n        prevBtn : {\n            root: {\n                marginLeft: 12,\n                ...btn,\n                backgroundColor: themeVariables.carouselPrevBgColor\n            },\n            text: {\n                fontSize: 32\n            },\n            icon : {\n                color: themeVariables.carouselPrevBtnColor\n            }\n        } as WmIconStyles,\n        nextBtn : {\n            root: {\n                marginRight: 12,\n                ...btn,\n                backgroundColor: themeVariables.carouselPrevBgColor\n            },\n            text: {\n                fontSize: 32\n            },\n            icon : {\n                color: themeVariables.carouselNextBtnColor\n            }\n        } as WmIconStyles,\n        dotsWrapperStyle:{\n            opacity: 1,\n            backgroundColor: themeVariables.carouselDotWrapperBgColor,\n            flexDirection: 'row',\n            justifyContent: 'center',\n            alignItems: 'center',\n            paddingTop: 4,\n            paddingBottom: 4\n        },\n        activeDotStyle: {\n            backgroundColor: themeVariables.carouselActiveDotColor,\n            opacity: 1\n        },\n        dotStyle: {\n            width: 8,\n            height: 8,\n            borderRadius: 10,\n            opacity: 0.2,\n            marginHorizontal: 2,\n            backgroundColor: themeVariables.carouselDotColor\n        }\n    } as WmCarouselStyles);\n\n    addStyle(DEFAULT_CLASS, '', defaultStyles);\n    addStyle(DEFAULT_CLASS + '-rtl', '', {\n        prevBtn : {\n            root:{\n                transform: [{rotateY: '180deg'}]\n            }\n        },\n        nextBtn : {\n            root:{\n                transform: [{rotateY: '180deg'}]\n            }\n        }\n    });\n\n    addStyle('app-carousel-1', '', {\n        btnPanel: {\n            top: '100%'\n        },\n        prevBtn: {\n            root: {\n                borderRadius: 6\n            }\n        },\n        nextBtn: {\n            root: {\n                borderRadius: 6\n            }\n        }\n    } as any as WmCarouselStyles);\n\n    addStyle('app-carousel-2', '', {\n        btnPanel: {\n            backgroundColor: themeVariables.defaultColorF,\n            width: '100%',\n            top: '100%',\n            right: 0,\n            padding: 8,\n            justifyContent: 'flex-end'\n        },\n        dotsWrapperStyle:{\n            alignSelf: 'flex-start',\n            justifyContent: 'flex-start'\n        },\n        activeDotStyle: {\n            backgroundColor: themeVariables.primaryColor,\n        },\n        dotStyle: {\n            backgroundColor: themeVariables.primaryColor,\n        },\n        prevBtn: {\n            root: {\n                backgroundColor: 'rgba(255, 255, 255, 0.1)',\n                borderColor: themeVariables.primaryColor,\n            },\n            icon : {\n                color: themeVariables.primaryColor\n            }\n        },\n        nextBtn: {\n            root: {\n                marginLeft: 8,\n                backgroundColor: 'rgba(255, 255, 255, 0.1)',\n                borderColor: themeVariables.primaryColor,\n            },\n            icon : {\n                color: themeVariables.primaryColor\n            }\n        }\n    } as any as WmCarouselStyles);\n});"],"mappings":"AACA,OAAOA,UAAU,MAAoB,wCAAwC;AAC7E,SAAqBC,YAAY,QAAQ,+CAA+C;AAexF,OAAO,MAAMC,aAAa,GAAG,cAAc;AAC3CF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACnD,MAAMC,GAAc,GAAG;IACnBC,MAAM,EAAE,EAAE;IACVC,KAAK,EAAE,EAAE;IACTC,YAAY,EAAE,EAAE;IAChBC,WAAW,EAAEN,cAAc,CAACO,WAAW;IACvCC,WAAW,EAAE,CAAC;IACdC,cAAc,EAAE;EACpB,CAAC;EACD,MAAMC,aAA+B,GAAGb,YAAY,CAAC;IACjDc,IAAI,EAAE;MACFC,QAAQ,EAAE;IACd,CAAC;IACDC,IAAI,EAAE,CAAC,CAAC;IACRC,KAAK,EAAE;MACHV,KAAK,EAAE,MAAM;MACbW,iBAAiB,EAAE,EAAE;MACrBC,SAAS,EAAE,CACP;QACIC,UAAU,EAAE;MAChB,CAAC;IAET,CAAC;IACDC,UAAU,EAAE,CAAC,CAAC;IACdC,SAAS,EAAE,CAAC,CAAC;IACbC,WAAW,EAAE,CAAC,CAAC;IACfC,QAAQ,EAAE;MACNT,QAAQ,EAAE,UAAU;MACpBU,GAAG,EAAE,KAAK;MACVC,SAAS,EAAE,CAAC,EAAE;MACdpB,MAAM,EAAE,EAAE;MACVqB,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBhB,cAAc,EAAE,eAAe;MAC/BL,KAAK,EAAE;IACX,CAAC;IACDsB,OAAO,EAAG;MACNf,IAAI,EAAE;QACFgB,UAAU,EAAE,EAAE;QACd,GAAGzB,GAAG;QACN0B,eAAe,EAAE5B,cAAc,CAAC6B;MACpC,CAAC;MACDhB,IAAI,EAAE;QACFiB,QAAQ,EAAE;MACd,CAAC;MACDC,IAAI,EAAG;QACHC,KAAK,EAAEhC,cAAc,CAACiC;MAC1B;IACJ,CAAiB;IACjBC,OAAO,EAAG;MACNvB,IAAI,EAAE;QACFwB,WAAW,EAAE,EAAE;QACf,GAAGjC,GAAG;QACN0B,eAAe,EAAE5B,cAAc,CAAC6B;MACpC,CAAC;MACDhB,IAAI,EAAE;QACFiB,QAAQ,EAAE;MACd,CAAC;MACDC,IAAI,EAAG;QACHC,KAAK,EAAEhC,cAAc,CAACoC;MAC1B;IACJ,CAAiB;IACjBC,gBAAgB,EAAC;MACbC,OAAO,EAAE,CAAC;MACVV,eAAe,EAAE5B,cAAc,CAACuC,yBAAyB;MACzDf,aAAa,EAAE,KAAK;MACpBf,cAAc,EAAE,QAAQ;MACxBgB,UAAU,EAAE,QAAQ;MACpBe,UAAU,EAAE,CAAC;MACbC,aAAa,EAAE;IACnB,CAAC;IACDC,cAAc,EAAE;MACZd,eAAe,EAAE5B,cAAc,CAAC2C,sBAAsB;MACtDL,OAAO,EAAE;IACb,CAAC;IACDM,QAAQ,EAAE;MACNxC,KAAK,EAAE,CAAC;MACRD,MAAM,EAAE,CAAC;MACTE,YAAY,EAAE,EAAE;MAChBiC,OAAO,EAAE,GAAG;MACZO,gBAAgB,EAAE,CAAC;MACnBjB,eAAe,EAAE5B,cAAc,CAAC8C;IACpC;EACJ,CAAqB,CAAC;EAEtB7C,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEY,aAAa,CAAC;EAC1CT,QAAQ,CAACH,aAAa,GAAG,MAAM,EAAE,EAAE,EAAE;IACjC4B,OAAO,EAAG;MACNf,IAAI,EAAC;QACDK,SAAS,EAAE,CAAC;UAAC+B,OAAO,EAAE;QAAQ,CAAC;MACnC;IACJ,CAAC;IACDb,OAAO,EAAG;MACNvB,IAAI,EAAC;QACDK,SAAS,EAAE,CAAC;UAAC+B,OAAO,EAAE;QAAQ,CAAC;MACnC;IACJ;EACJ,CAAC,CAAC;EAEF9C,QAAQ,CAAC,gBAAgB,EAAE,EAAE,EAAE;IAC3BoB,QAAQ,EAAE;MACNC,GAAG,EAAE;IACT,CAAC;IACDI,OAAO,EAAE;MACLf,IAAI,EAAE;QACFN,YAAY,EAAE;MAClB;IACJ,CAAC;IACD6B,OAAO,EAAE;MACLvB,IAAI,EAAE;QACFN,YAAY,EAAE;MAClB;IACJ;EACJ,CAA4B,CAAC;EAE7BJ,QAAQ,CAAC,gBAAgB,EAAE,EAAE,EAAE;IAC3BoB,QAAQ,EAAE;MACNO,eAAe,EAAE5B,cAAc,CAACgD,aAAa;MAC7C5C,KAAK,EAAE,MAAM;MACbkB,GAAG,EAAE,MAAM;MACX2B,KAAK,EAAE,CAAC;MACRC,OAAO,EAAE,CAAC;MACVzC,cAAc,EAAE;IACpB,CAAC;IACD4B,gBAAgB,EAAC;MACbc,SAAS,EAAE,YAAY;MACvB1C,cAAc,EAAE;IACpB,CAAC;IACDiC,cAAc,EAAE;MACZd,eAAe,EAAE5B,cAAc,CAACoD;IACpC,CAAC;IACDR,QAAQ,EAAE;MACNhB,eAAe,EAAE5B,cAAc,CAACoD;IACpC,CAAC;IACD1B,OAAO,EAAE;MACLf,IAAI,EAAE;QACFiB,eAAe,EAAE,0BAA0B;QAC3CtB,WAAW,EAAEN,cAAc,CAACoD;MAChC,CAAC;MACDrB,IAAI,EAAG;QACHC,KAAK,EAAEhC,cAAc,CAACoD;MAC1B;IACJ,CAAC;IACDlB,OAAO,EAAE;MACLvB,IAAI,EAAE;QACFgB,UAAU,EAAE,CAAC;QACbC,eAAe,EAAE,0BAA0B;QAC3CtB,WAAW,EAAEN,cAAc,CAACoD;MAChC,CAAC;MACDrB,IAAI,EAAG;QACHC,KAAK,EAAEhC,cAAc,CAACoD;MAC1B;IACJ;EACJ,CAA4B,CAAC;AACjC,CAAC,CAAC"}

app-rn-runtime/components/advanced/login/login.component.js

@@ -1,3 +1,4 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 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); }
@@ -28,9 +29,9 @@ export default class WmLogin extends BaseComponent {
   renderWidget(props) {
     return /*#__PURE__*/React.createElement(View, {
       style: this.styles.root
-    }, this._background, this.state.errorMsg && /*#__PURE__*/React.createElement(Text, {
+    }, this._background, this.state.errorMsg && /*#__PURE__*/React.createElement(Text, _extends({}, this.getTestPropsForLabel('error'), {
       style: this.styles.errorMsgStyles
-    }, this.state.errorMsg), /*#__PURE__*/React.createElement(View, {
+    }), this.state.errorMsg), /*#__PURE__*/React.createElement(View, {
       style: this.styles.formStyles
     }, props.children));
   }

app-rn-runtime/components/advanced/login/login.component.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Text","View","BaseComponent","BaseComponentState","WmLoginProps","DEFAULT_CLASS","WmLoginState","constructor","arguments","_defineProperty","WmLogin","props","onLoginSuccess","response","onLoginError","error","updateState","errorMsg","message","doLogin","formData","onLogin","bind","renderWidget","createElement","style","styles","root","_background","state","errorMsgStyles","formStyles","children"],"sources":["login.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmLoginProps from './login.props';\nimport { DEFAULT_CLASS, WmLoginStyles } from './login.styles';\nimport { AxiosError, AxiosResponse } from 'axios';\n\nexport class WmLoginState extends BaseComponentState<WmLoginProps> {\n  errorMsg = '';\n}\n\nexport default class WmLogin extends BaseComponent<WmLoginProps, WmLoginState, WmLoginStyles> {\n  constructor(props: WmLoginProps) {\n    super(props, DEFAULT_CLASS, new WmLoginProps());\n  }\n\n  onLoginSuccess(response: AxiosResponse) {\n  }\n\n  onLoginError(error: AxiosError) {\n    this.updateState({errorMsg: error?.message} as WmLoginState);\n  }\n\n  doLogin(formData: any) {\n    this.props.onLogin(formData, this.onLoginSuccess.bind(this), this.onLoginError.bind(this));\n  }\n\n  renderWidget(props: WmLoginProps) {\n    return (<View style={this.styles.root}>\n      {this._background}\n      {this.state.errorMsg && <Text style={this.styles.errorMsgStyles}>{this.state.errorMsg}</Text>}\n      <View style={this.styles.formStyles}>{props.children}</View>\n    </View>); \n  }\n}\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AACzC,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,+CAA+C;AAEjG,OAAOC,YAAY,MAAM,eAAe;AACxC,SAASC,aAAa,QAAuB,gBAAgB;AAG7D,OAAO,MAAMC,YAAY,SAASH,kBAAkB,CAAe;EAAAI,YAAA;IAAA,SAAAC,SAAA;IAAAC,eAAA,mBACtD,EAAE;EAAA;AACf;AAEA,eAAe,MAAMC,OAAO,SAASR,aAAa,CAA4C;EAC5FK,WAAWA,CAACI,KAAmB,EAAE;IAC/B,KAAK,CAACA,KAAK,EAAEN,aAAa,EAAE,IAAID,YAAY,CAAC,CAAC,CAAC;EACjD;EAEAQ,cAAcA,CAACC,QAAuB,EAAE,CACxC;EAEAC,YAAYA,CAACC,KAAiB,EAAE;IAC9B,IAAI,CAACC,WAAW,CAAC;MAACC,QAAQ,EAAEF,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEG;IAAO,CAAiB,CAAC;EAC9D;EAEAC,OAAOA,CAACC,QAAa,EAAE;IACrB,IAAI,CAACT,KAAK,CAACU,OAAO,CAACD,QAAQ,EAAE,IAAI,CAACR,cAAc,CAACU,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,CAACR,YAAY,CAACQ,IAAI,CAAC,IAAI,CAAC,CAAC;EAC5F;EAEAC,YAAYA,CAACZ,KAAmB,EAAE;IAChC,oBAAQZ,KAAA,CAAAyB,aAAA,CAACvB,IAAI;MAACwB,KAAK,EAAE,IAAI,CAACC,MAAM,CAACC;IAAK,GACnC,IAAI,CAACC,WAAW,EAChB,IAAI,CAACC,KAAK,CAACZ,QAAQ,iBAAIlB,KAAA,CAAAyB,aAAA,CAACxB,IAAI;MAACyB,KAAK,EAAE,IAAI,CAACC,MAAM,CAACI;IAAe,GAAE,IAAI,CAACD,KAAK,CAACZ,QAAe,CAAC,eAC7FlB,KAAA,CAAAyB,aAAA,CAACvB,IAAI;MAACwB,KAAK,EAAE,IAAI,CAACC,MAAM,CAACK;IAAW,GAAEpB,KAAK,CAACqB,QAAe,CACvD,CAAC;EACT;AACF"}
+{"version":3,"names":["React","Text","View","BaseComponent","BaseComponentState","WmLoginProps","DEFAULT_CLASS","WmLoginState","constructor","arguments","_defineProperty","WmLogin","props","onLoginSuccess","response","onLoginError","error","updateState","errorMsg","message","doLogin","formData","onLogin","bind","renderWidget","createElement","style","styles","root","_background","state","_extends","getTestPropsForLabel","errorMsgStyles","formStyles","children"],"sources":["login.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmLoginProps from './login.props';\nimport { DEFAULT_CLASS, WmLoginStyles } from './login.styles';\nimport { AxiosError, AxiosResponse } from 'axios';\n\nexport class WmLoginState extends BaseComponentState<WmLoginProps> {\n  errorMsg = '';\n}\n\nexport default class WmLogin extends BaseComponent<WmLoginProps, WmLoginState, WmLoginStyles> {\n  constructor(props: WmLoginProps) {\n    super(props, DEFAULT_CLASS, new WmLoginProps());\n  }\n\n  onLoginSuccess(response: AxiosResponse) {\n  }\n\n  onLoginError(error: AxiosError) {\n    this.updateState({errorMsg: error?.message} as WmLoginState);\n  }\n\n  doLogin(formData: any) {\n    this.props.onLogin(formData, this.onLoginSuccess.bind(this), this.onLoginError.bind(this));\n  }\n\n  renderWidget(props: WmLoginProps) {\n    return (<View style={this.styles.root}>\n      {this._background}\n      {this.state.errorMsg && <Text {...this.getTestPropsForLabel('error')} style={this.styles.errorMsgStyles}>{this.state.errorMsg}</Text>}\n      <View style={this.styles.formStyles}>{props.children}</View>\n    </View>); \n  }\n}\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AACzC,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,+CAA+C;AAEjG,OAAOC,YAAY,MAAM,eAAe;AACxC,SAASC,aAAa,QAAuB,gBAAgB;AAG7D,OAAO,MAAMC,YAAY,SAASH,kBAAkB,CAAe;EAAAI,YAAA;IAAA,SAAAC,SAAA;IAAAC,eAAA,mBACtD,EAAE;EAAA;AACf;AAEA,eAAe,MAAMC,OAAO,SAASR,aAAa,CAA4C;EAC5FK,WAAWA,CAACI,KAAmB,EAAE;IAC/B,KAAK,CAACA,KAAK,EAAEN,aAAa,EAAE,IAAID,YAAY,CAAC,CAAC,CAAC;EACjD;EAEAQ,cAAcA,CAACC,QAAuB,EAAE,CACxC;EAEAC,YAAYA,CAACC,KAAiB,EAAE;IAC9B,IAAI,CAACC,WAAW,CAAC;MAACC,QAAQ,EAAEF,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEG;IAAO,CAAiB,CAAC;EAC9D;EAEAC,OAAOA,CAACC,QAAa,EAAE;IACrB,IAAI,CAACT,KAAK,CAACU,OAAO,CAACD,QAAQ,EAAE,IAAI,CAACR,cAAc,CAACU,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,CAACR,YAAY,CAACQ,IAAI,CAAC,IAAI,CAAC,CAAC;EAC5F;EAEAC,YAAYA,CAACZ,KAAmB,EAAE;IAChC,oBAAQZ,KAAA,CAAAyB,aAAA,CAACvB,IAAI;MAACwB,KAAK,EAAE,IAAI,CAACC,MAAM,CAACC;IAAK,GACnC,IAAI,CAACC,WAAW,EAChB,IAAI,CAACC,KAAK,CAACZ,QAAQ,iBAAIlB,KAAA,CAAAyB,aAAA,CAACxB,IAAI,EAAA8B,QAAA,KAAK,IAAI,CAACC,oBAAoB,CAAC,OAAO,CAAC;MAAEN,KAAK,EAAE,IAAI,CAACC,MAAM,CAACM;IAAe,IAAE,IAAI,CAACH,KAAK,CAACZ,QAAe,CAAC,eACrIlB,KAAA,CAAAyB,aAAA,CAACvB,IAAI;MAACwB,KAAK,EAAE,IAAI,CAACC,MAAM,CAACO;IAAW,GAAEtB,KAAK,CAACuB,QAAe,CACvD,CAAC;EACT;AACF"}