@wavemaker-ai/app-rn-runtime 1.0.0-next.27766

package/components/container/container.component.js

@@ -0,0 +1,217 @@
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import React from 'react';
+import { View, Platform, Animated } from 'react-native';
+import WmContainerProps from './container.props';
+import { DEFAULT_CLASS } from './container.styles';
+import { Tappable } from '@wavemaker-ai/app-rn-runtime/core/tappable.component';
+import { Animatedview } from '@wavemaker-ai/app-rn-runtime/components/basic/animatedview.component';
+import { PartialHost, PartialHostState } from './partial-host.component';
+import { createSkeleton } from '../basic/skeleton/skeleton.component';
+import { StickyWrapperContext } from '@wavemaker-ai/app-rn-runtime/core/sticky-wrapper';
+import { SafeAreaInsetsContext } from 'react-native-safe-area-context';
+import { StickyContainer } from '@wavemaker-ai/app-rn-runtime/core/components/sticky-container.component';
+import { getParentStyles } from '@wavemaker-ai/app-rn-runtime/core/components/sticky-container.styles';
+import injector from '@wavemaker-ai/app-rn-runtime/core/injector';
+import { isAutoLayout as checkAutoLayout, getContentContainerStyle, getDirectionStyle, getDimensionStyle, extractAutoLayoutProps } from '@wavemaker-ai/app-rn-runtime/core/auto-layout.utils';
+import { AutoLayoutHost } from '@wavemaker-ai/app-rn-runtime/core/auto-layout-host.component';
+export class WmContainerState extends PartialHostState {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "isPartialLoaded", false);
+    _defineProperty(this, "stickyContainerVisibility", false);
+  }
+}
+export default class WmContainer extends PartialHost {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmContainerProps(), new WmContainerState());
+    _defineProperty(this, "containerRef", void 0);
+    _defineProperty(this, "scrollViewRef", /*#__PURE__*/React.createRef());
+    _defineProperty(this, "stickyContainerOpacity", void 0);
+    _defineProperty(this, "appConfig", injector.get('APP_CONFIG'));
+    _defineProperty(this, "insets", {
+      top: 0,
+      bottom: 0,
+      left: 0,
+      right: 0
+    });
+    _defineProperty(this, "handleOnScrollEndDrag", event => {
+      var _event$nativeEvent;
+      const currentY = event === null || event === void 0 || (_event$nativeEvent = event.nativeEvent) === null || _event$nativeEvent === void 0 || (_event$nativeEvent = _event$nativeEvent.contentOffset) === null || _event$nativeEvent === void 0 ? void 0 : _event$nativeEvent.y;
+      if (currentY > 0) {
+        this.invokeEventCallback('onScroll', [null, this.proxy]);
+      }
+    });
+    _defineProperty(this, "handleOnMomentumScrollEnd", event => {
+      var _event$nativeEvent2;
+      const currentY = event === null || event === void 0 || (_event$nativeEvent2 = event.nativeEvent) === null || _event$nativeEvent2 === void 0 || (_event$nativeEvent2 = _event$nativeEvent2.contentOffset) === null || _event$nativeEvent2 === void 0 ? void 0 : _event$nativeEvent2.y;
+      if (currentY < 1) {
+        this.invokeEventCallback('onScrolltotop', [null, this.proxy]);
+      }
+    });
+    this.containerRef = /*#__PURE__*/React.createRef();
+    this.stickyContainerOpacity = new Animated.Value(1);
+    this.subscribe('updateStickyHeaders', _event => {
+      if (this.props.sticky) {
+        setTimeout(() => {
+          this.getStickyHeaderTranslateY();
+        }, 500);
+      }
+    });
+  }
+  getBackground() {
+    return this._showSkeleton ? null : this._background;
+  }
+  getAutoLayoutProps() {
+    var _this$parent;
+    return extractAutoLayoutProps(this.props, (_this$parent = this.parent) === null || _this$parent === void 0 || (_this$parent = _this$parent.state) === null || _this$parent === void 0 ? void 0 : _this$parent.props);
+  }
+  renderSkeleton(props) {
+    if (!props.showskeletonchildren) {
+      var _this$props;
+      const dimensions = {
+        width: this.styles.root.width ? '100%' : undefined,
+        height: this.styles.root.height ? '100%' : undefined
+      };
+      const skeletonStyles = ((_this$props = this.props) === null || _this$props === void 0 || (_this$props = _this$props.styles) === null || _this$props === void 0 ? void 0 : _this$props.skeleton) || {
+        root: {},
+        text: {}
+      };
+      return createSkeleton(this.theme, skeletonStyles, {
+        ...this.styles.root
+      }, /*#__PURE__*/React.createElement(View, {
+        style: [this.styles.root, {
+          opacity: 0
+        }]
+      }, /*#__PURE__*/React.createElement(Tappable, _extends({}, this.getTestPropsForAction(), {
+        target: this,
+        styles: dimensions,
+        disableTouchEffect: this.state.props.disabletoucheffect
+      }), /*#__PURE__*/React.createElement(View, {
+        style: [dimensions, this.styles.content]
+      }, this.renderContent(props)))));
+    }
+    return null;
+  }
+  getStickyHeaderTranslateY() {
+    var _this$appConfig, _this$containerRef;
+    const isEdgeToEdgeApp = !!((_this$appConfig = this.appConfig) !== null && _this$appConfig !== void 0 && (_this$appConfig = _this$appConfig.edgeToEdgeConfig) !== null && _this$appConfig !== void 0 && _this$appConfig.isEdgeToEdgeApp);
+    (_this$containerRef = this.containerRef) === null || _this$containerRef === void 0 || (_this$containerRef = _this$containerRef.current) === null || _this$containerRef === void 0 || _this$containerRef.measure((_x = 0, _y = 0, _width = 0, _height = 0, px = 0, py = 0) => {
+      var _this$insets;
+      const topInsetsInYposition = Platform.OS == 'ios' && !isEdgeToEdgeApp ? ((_this$insets = this.insets) === null || _this$insets === void 0 ? void 0 : _this$insets.top) || 0 : 0;
+      if (this.context && this.context.stickyContainerTranslateY) {
+        this.context.stickyContainerTranslateY.value = py - topInsetsInYposition;
+        this.updateState({
+          stickyContainerVisibility: true
+        });
+      }
+    });
+  }
+  componentDidUpdate(_prevProps, prevState) {
+    if (prevState.stickyContainerVisibility !== this.state.stickyContainerVisibility) {
+      Animated.timing(this.stickyContainerOpacity, {
+        toValue: this.state.stickyContainerVisibility ? 0 : 1,
+        delay: 500,
+        useNativeDriver: true
+      }).start();
+    }
+    //emiting container wdiget scrollview ref value to bottom sheet widget(bottom sheet sticky header/footer feature)
+    if (this.scrollViewRef.current) {
+      this.notify('containerScrollViewReady', [this.scrollViewRef], true);
+    }
+  }
+  renderStickyContent(props, dimensions, styles) {
+    const {
+      stickyContainerVisibility
+    } = this.state;
+    const {
+      positioningStyles
+    } = getParentStyles(this);
+    const alProps = this.getAutoLayoutProps();
+    const autoLayoutStyle = getContentContainerStyle(alProps);
+    const directionStyle = getDirectionStyle(alProps);
+    const autoLayoutDimensionsInner = getDimensionStyle(alProps, this.styles.root, true);
+    const isAutoLayout = checkAutoLayout(alProps);
+    return /*#__PURE__*/React.createElement(React.Fragment, null, stickyContainerVisibility ? /*#__PURE__*/React.createElement(StickyContainer, {
+      component: this,
+      theme: this.theme,
+      style: [this.styles.sticky, {
+        backgroundColor: styles.backgroundColor
+      }, isAutoLayout ? directionStyle : {}],
+      positionStyles: positioningStyles,
+      show: props.show
+    }, /*#__PURE__*/React.createElement(View, {
+      style: [isAutoLayout ? autoLayoutDimensionsInner : dimensions, {
+        backgroundColor: styles.backgroundColor
+      }, this.styles.content, isAutoLayout ? autoLayoutStyle : {}]
+    }, this.renderContent(props))) : /*#__PURE__*/React.createElement(React.Fragment, null), /*#__PURE__*/React.createElement(Animated.View, {
+      style: [isAutoLayout ? autoLayoutDimensionsInner : dimensions, {
+        opacity: this.stickyContainerOpacity
+      }, this.styles.content, isAutoLayout ? autoLayoutStyle : {}],
+      ref: this.containerRef
+    }, this.renderContent(props)));
+  }
+  renderWidget(props) {
+    const alProps = this.getAutoLayoutProps();
+    const autoLayoutStyle = getContentContainerStyle(alProps);
+    const directionStyle = getDirectionStyle(alProps);
+    const autoLayoutDimensionsInner = getDimensionStyle(alProps, this.styles.root, true);
+    const autoLayoutDimensionsOuter = getDimensionStyle(alProps, this.styles.root);
+    const dimensions = {
+      width: this.styles.root.width ? '100%' : undefined,
+      height: this.styles.root.height ? '100%' : undefined
+    };
+    const styles = this._showSkeleton ? {
+      ...this.styles.root,
+      ...this.styles.skeleton.root
+    } : this.styles.root;
+    if (props.sticky) {
+      this.isSticky = true;
+    }
+    const isAutoLayout = checkAutoLayout(alProps);
+    return /*#__PURE__*/React.createElement(SafeAreaInsetsContext.Consumer, null, (insets = {
+      top: 0,
+      bottom: 0,
+      left: 0,
+      right: 0
+    }) => {
+      this.insets = insets;
+      return /*#__PURE__*/React.createElement(Animatedview, {
+        entryanimation: props.animation,
+        delay: props.animationdelay,
+        style: [styles, isAutoLayout ? {
+          ...autoLayoutDimensionsOuter,
+          ...directionStyle
+        } : {}],
+        onLayout: (event, ref) => {
+          this.handleLayout(event, ref);
+        }
+      }, this.getBackground(), /*#__PURE__*/React.createElement(Tappable, _extends({}, this.getTestPropsForAction(), {
+        target: this,
+        styles: [isAutoLayout ? {
+          ...autoLayoutDimensionsInner,
+          ...directionStyle
+        } : dimensions],
+        disableTouchEffect: this.state.props.disabletoucheffect
+      }), props.sticky ? this.renderStickyContent(props, dimensions, styles) : /*#__PURE__*/React.createElement(AutoLayoutHost, {
+        autoLayoutProps: alProps,
+        shouldScroll: props.overflow === 'scroll',
+        containerStyle: isAutoLayout ? autoLayoutDimensionsInner : dimensions,
+        contentStyle: [this.styles.content, isAutoLayout ? {
+          ...directionStyle,
+          ...autoLayoutStyle,
+          minWidth: 0
+        } : {}],
+        onScroll: event => this.notify('scroll', [event]),
+        scrollEventThrottle: 48,
+        ref: this.scrollViewRef,
+        onScrollEndDrag: this.handleOnScrollEndDrag,
+        onMomentumScrollEnd: this.handleOnMomentumScrollEnd
+      }, this.renderContent(props))));
+    });
+  }
+}
+_defineProperty(WmContainer, "contextType", StickyWrapperContext);
+//# sourceMappingURL=container.component.js.map

package/components/container/container.component.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Platform","Animated","WmContainerProps","DEFAULT_CLASS","Tappable","Animatedview","PartialHost","PartialHostState","createSkeleton","StickyWrapperContext","SafeAreaInsetsContext","StickyContainer","getParentStyles","injector","isAutoLayout","checkAutoLayout","getContentContainerStyle","getDirectionStyle","getDimensionStyle","extractAutoLayoutProps","AutoLayoutHost","WmContainerState","constructor","args","_defineProperty","WmContainer","props","createRef","get","top","bottom","left","right","event","_event$nativeEvent","currentY","nativeEvent","contentOffset","y","invokeEventCallback","proxy","_event$nativeEvent2","containerRef","stickyContainerOpacity","Value","subscribe","_event","sticky","setTimeout","getStickyHeaderTranslateY","getBackground","_showSkeleton","_background","getAutoLayoutProps","_this$parent","parent","state","renderSkeleton","showskeletonchildren","_this$props","dimensions","width","styles","root","undefined","height","skeletonStyles","skeleton","text","theme","createElement","style","opacity","_extends","getTestPropsForAction","target","disableTouchEffect","disabletoucheffect","content","renderContent","_this$appConfig","_this$containerRef","isEdgeToEdgeApp","appConfig","edgeToEdgeConfig","current","measure","_x","_y","_width","_height","px","py","_this$insets","topInsetsInYposition","OS","insets","context","stickyContainerTranslateY","value","updateState","stickyContainerVisibility","componentDidUpdate","_prevProps","prevState","timing","toValue","delay","useNativeDriver","start","scrollViewRef","notify","renderStickyContent","positioningStyles","alProps","autoLayoutStyle","directionStyle","autoLayoutDimensionsInner","Fragment","component","backgroundColor","positionStyles","show","ref","renderWidget","autoLayoutDimensionsOuter","isSticky","Consumer","entryanimation","animation","animationdelay","onLayout","handleLayout","autoLayoutProps","shouldScroll","overflow","containerStyle","contentStyle","minWidth","onScroll","scrollEventThrottle","onScrollEndDrag","handleOnScrollEndDrag","onMomentumScrollEnd","handleOnMomentumScrollEnd"],"sources":["container.component.tsx"],"sourcesContent":["import React from 'react';\nimport { LayoutChangeEvent, View, ViewStyle, Platform, Animated } from 'react-native';\nimport WmContainerProps from './container.props';\nimport { DEFAULT_CLASS, WmContainerStyles } from './container.styles';\nimport { Tappable } from '@wavemaker-ai/app-rn-runtime/core/tappable.component';\nimport { Animatedview } from '@wavemaker-ai/app-rn-runtime/components/basic/animatedview.component';\nimport { PartialHost, PartialHostState } from './partial-host.component';\nimport { createSkeleton } from '../basic/skeleton/skeleton.component';\nimport { WmSkeletonStyles } from '../basic/skeleton/skeleton.styles';\nimport { StickyWrapperContextType, StickyWrapperContext } from '@wavemaker-ai/app-rn-runtime/core/sticky-wrapper';\nimport { EdgeInsets, SafeAreaInsetsContext } from 'react-native-safe-area-context';\nimport { StickyContainer } from '@wavemaker-ai/app-rn-runtime/core/components/sticky-container.component';\nimport { getParentStyles } from '@wavemaker-ai/app-rn-runtime/core/components/sticky-container.styles';\nimport injector from '@wavemaker-ai/app-rn-runtime/core/injector';\nimport AppConfig from '@wavemaker-ai/app-rn-runtime/core/AppConfig';\nimport {\n  isAutoLayout as checkAutoLayout,\n  getContentContainerStyle,\n  getDirectionStyle,\n  getDimensionStyle,\n  extractAutoLayoutProps,\n} from '@wavemaker-ai/app-rn-runtime/core/auto-layout.utils';\nimport { AutoLayoutHost } from '@wavemaker-ai/app-rn-runtime/core/auto-layout-host.component';\nimport { ScrollView } from 'react-native-gesture-handler';\n\n\nexport class WmContainerState extends PartialHostState<WmContainerProps> {\n  isPartialLoaded = false;\n  stickyContainerVisibility = false;\n}\n\nexport default class WmContainer extends PartialHost<WmContainerProps, WmContainerState, WmContainerStyles> {\n  static contextType = StickyWrapperContext;\n  private containerRef: React.RefObject<View | null>;\n  private scrollViewRef = React.createRef<ScrollView>();\n  private stickyContainerOpacity: Animated.Value;\n  private appConfig = injector.get<AppConfig>('APP_CONFIG');\n  insets: EdgeInsets | null = {\n    top: 0, bottom: 0, left: 0, right: 0\n  };\n\n  constructor(props: WmContainerProps) {\n    super(props, DEFAULT_CLASS, new WmContainerProps(), new WmContainerState());\n    this.containerRef = React.createRef();\n    this.stickyContainerOpacity = new Animated.Value(1);\n\n    this.subscribe('updateStickyHeaders', (_event: any) => {\n      if(this.props.sticky){\n        setTimeout(()=>{\n          this.getStickyHeaderTranslateY();\n        }, 500);\n      }\n    })\n  }\n\n  getBackground(): React.JSX.Element | null {\n    return this._showSkeleton ? null : this._background\n  }\n\n  private getAutoLayoutProps() {\n    return extractAutoLayoutProps(this.props, this.parent?.state?.props);\n  }\n\n  public renderSkeleton(props: WmContainerProps): React.ReactNode {\n      if(!props.showskeletonchildren) {\n        const dimensions = {\n          width: this.styles.root.width ? '100%' : undefined,\n          height: this.styles.root.height ? '100%' : undefined\n        };\n        const skeletonStyles: WmSkeletonStyles = this.props?.styles?.skeleton || { root: {}, text: {}  } as WmSkeletonStyles\n        return createSkeleton(this.theme, skeletonStyles, {\n          ...this.styles.root\n        }, (<View style={[this.styles.root, { opacity: 0 }]}>\n                  <Tappable {...this.getTestPropsForAction()} target={this} styles={dimensions} disableTouchEffect={this.state.props.disabletoucheffect}>\n            <View style={[dimensions as ViewStyle,  this.styles.content]}>{this.renderContent(props)}</View>\n        </Tappable>\n\n        </View>))\n      }\n      return null;\n  }\n\n  public getStickyHeaderTranslateY(){\n    const isEdgeToEdgeApp = !!this.appConfig?.edgeToEdgeConfig?.isEdgeToEdgeApp;\n    this.containerRef?.current?.measure((_x = 0, _y = 0, _width = 0, _height = 0, px = 0, py = 0)=>{\n      const topInsetsInYposition = (Platform.OS == 'ios' && !isEdgeToEdgeApp) ? (this.insets?.top || 0): 0\n      if((this.context) && (this.context as StickyWrapperContextType).stickyContainerTranslateY) {\n        (this.context as StickyWrapperContextType).stickyContainerTranslateY.value = py - topInsetsInYposition ;\n        this.updateState({ stickyContainerVisibility: true} as WmContainerState);\n      }\n    })\n  }\n  private handleOnScrollEndDrag = (event: any) => {\n    const currentY = event?.nativeEvent?.contentOffset?.y;\n    if (currentY > 0) {\n      this.invokeEventCallback('onScroll', [null, this.proxy]);\n    }\n  }\n\n  private handleOnMomentumScrollEnd = (event: any) => {\n    const currentY = event?.nativeEvent?.contentOffset?.y;\n    if (currentY < 1) {\n      this.invokeEventCallback('onScrolltotop', [null, this.proxy]);\n    }\n  }\n\n\n  componentDidUpdate(_prevProps: any, prevState: any) {\n    if (prevState.stickyContainerVisibility !== this.state.stickyContainerVisibility) {\n      Animated.timing(this.stickyContainerOpacity, {\n        toValue: this.state.stickyContainerVisibility ? 0 : 1,\n        delay: 500,\n        useNativeDriver: true\n      }).start();\n    }\n    //emiting container wdiget scrollview ref value to bottom sheet widget(bottom sheet sticky header/footer feature)\n    if (this.scrollViewRef.current) {\n      this.notify('containerScrollViewReady', [this.scrollViewRef], true);\n    }\n        \n  }\n\n  private renderStickyContent(props: WmContainerProps, dimensions: ViewStyle, styles: ViewStyle) {\n    const { stickyContainerVisibility } = this.state;\n    const { positioningStyles } = getParentStyles(this);\n    const alProps = this.getAutoLayoutProps();\n    const autoLayoutStyle = getContentContainerStyle(alProps);\n    const directionStyle = getDirectionStyle(alProps);\n    const autoLayoutDimensionsInner = getDimensionStyle(alProps, this.styles.root, true);\n    const isAutoLayout = checkAutoLayout(alProps);\n\n    return (\n      <>\n        {stickyContainerVisibility ? (\n          <StickyContainer\n            component={this}\n            theme={this.theme}\n            style={[\n              this.styles.sticky,\n              { backgroundColor: styles.backgroundColor },\n              isAutoLayout ? directionStyle : {}\n            ]}\n            positionStyles={positioningStyles}\n            show={props.show as boolean}\n          >\n            <View style={[isAutoLayout ? autoLayoutDimensionsInner : dimensions as ViewStyle, { backgroundColor: styles.backgroundColor }, this.styles.content, isAutoLayout ? autoLayoutStyle : {}]}>\n              {this.renderContent(props)}\n            </View>\n          </StickyContainer>\n        ) : <></>}\n        <Animated.View\n          style={[\n            isAutoLayout ? autoLayoutDimensionsInner : dimensions as ViewStyle,\n            { opacity: this.stickyContainerOpacity },\n            this.styles.content,\n            isAutoLayout ? autoLayoutStyle : {}\n          ]}\n          ref={this.containerRef}\n        >\n          {this.renderContent(props)}\n        </Animated.View>\n      </>\n    );\n  }\n\n  renderWidget(props: WmContainerProps) {\n    const alProps = this.getAutoLayoutProps();\n    const autoLayoutStyle = getContentContainerStyle(alProps);\n    const directionStyle = getDirectionStyle(alProps);\n    const autoLayoutDimensionsInner = getDimensionStyle(alProps, this.styles.root, true);\n    const autoLayoutDimensionsOuter = getDimensionStyle(alProps, this.styles.root);\n\n    const dimensions: ViewStyle = {\n      width: this.styles.root.width ? '100%' : undefined,\n      height: this.styles.root.height ? '100%' : undefined\n    };\n\n    const styles = this._showSkeleton ? {\n      ...this.styles.root,\n      ...this.styles.skeleton.root\n    } : this.styles.root;\n\n    if (props.sticky) {\n      this.isSticky = true;\n    }\n\n    const isAutoLayout = checkAutoLayout(alProps);\n    return (\n      <SafeAreaInsetsContext.Consumer>\n        {(insets = { top: 0, bottom: 0, left: 0, right: 0 }) => {\n          this.insets = insets;\n          return (\n              <Animatedview\n              entryanimation={props.animation}\n              delay={props.animationdelay}\n              style={[styles, isAutoLayout ? {...autoLayoutDimensionsOuter, ...directionStyle} : {}]}\n              onLayout={(event: LayoutChangeEvent, ref: React.RefObject<View>) => {\n                this.handleLayout(event, ref);\n              }}\n            >\n              {this.getBackground()}\n              <Tappable\n                {...this.getTestPropsForAction()}\n                target={this}\n                styles={[isAutoLayout ? { ...autoLayoutDimensionsInner, ...directionStyle } : dimensions]}\n                disableTouchEffect={this.state.props.disabletoucheffect}\n              >\n                  {props.sticky ? (\n                    this.renderStickyContent(props, dimensions, styles)\n                  ) : (\n                    <AutoLayoutHost\n                      autoLayoutProps={alProps}\n                      shouldScroll={props.overflow === 'scroll'}\n                      containerStyle={isAutoLayout ? autoLayoutDimensionsInner : dimensions as ViewStyle}\n                      contentStyle={[\n                        this.styles.content,\n                        isAutoLayout ? { ...directionStyle, ...autoLayoutStyle, minWidth: 0 } : {},\n                      ]}\n                      onScroll={(event) => this.notify('scroll', [event])}\n                      scrollEventThrottle={48}\n                      ref={this.scrollViewRef}\n                      onScrollEndDrag={this.handleOnScrollEndDrag}\n                      onMomentumScrollEnd={this.handleOnMomentumScrollEnd}\n                    >\n                      {this.renderContent(props)}\n                    </AutoLayoutHost>\n                  )}\n              </Tappable>\n            </Animatedview>\n          );\n        }}\n      </SafeAreaInsetsContext.Consumer>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/components/container/container.props.js

@@ -0,0 +1,25 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { PartialHostProps } from './partial-host.component';
+class WmContainerProps extends PartialHostProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "animation", null);
+    _defineProperty(this, "animationdelay", null);
+    _defineProperty(this, "onLoad", void 0);
+    _defineProperty(this, "scrollable", false);
+    _defineProperty(this, "sticky", false);
+    _defineProperty(this, "stickyContainerVisibility", false);
+    _defineProperty(this, "stickyContainerOpacity", void 0);
+    _defineProperty(this, "direction", void 0);
+    _defineProperty(this, "wrap", void 0);
+    _defineProperty(this, "alignment", void 0);
+    _defineProperty(this, "gap", void 0);
+    _defineProperty(this, "columngap", void 0);
+    _defineProperty(this, "parent-direction", void 0);
+    _defineProperty(this, "emittoparent", false);
+  }
+}
+export default WmContainerProps;
+//# sourceMappingURL=container.props.js.map

package/components/container/container.props.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["PartialHostProps","WmContainerProps","constructor","args","_defineProperty"],"sources":["container.props.ts"],"sourcesContent":["import { PartialHostProps } from './partial-host.component';\nimport { Animated } from 'react-native';\nimport { AutoLayoutProps } from '@wavemaker-ai/app-rn-runtime/core/auto-layout.utils';\n\ninterface WmContainerProps extends AutoLayoutProps {}\n\nclass WmContainerProps extends PartialHostProps {\n  animation?: string = null as any;\n  animationdelay?: number = null as any;\n  onLoad?: Function;\n  scrollable?: Boolean = false as any;\n  sticky?: Boolean = false as boolean;\n  stickyContainerVisibility?: Boolean = false;\n  stickyContainerOpacity?: Animated.Value;\n  direction?: 'row' | 'column';\n  wrap?: boolean;\n  alignment?: string;\n  gap?: number | string | 'auto';\n  columngap?: number | string | 'auto';\n  \"parent-direction\"?: string;\n  emittoparent?: boolean = false;\n}\nexport default WmContainerProps;\n"],"mappings":";;;AAAA,SAASA,gBAAgB,QAAQ,0BAA0B;AAM3D,MAAMC,gBAAgB,SAASD,gBAAgB,CAAC;EAAAE,YAAA,GAAAC,IAAA;IAAA,SAAAA,IAAA;IAAAC,eAAA,oBACzB,IAAI;IAAAA,eAAA,yBACC,IAAI;IAAAA,eAAA;IAAAA,eAAA,qBAEP,KAAK;IAAAA,eAAA,iBACT,KAAK;IAAAA,eAAA,oCACc,KAAK;IAAAA,eAAA;IAAAA,eAAA;IAAAA,eAAA;IAAAA,eAAA;IAAAA,eAAA;IAAAA,eAAA;IAAAA,eAAA,OAO3C,kBAAkB;IAAAA,eAAA,uBACO,KAAK;EAAA;AAChC;AACA,eAAeH,gBAAgB","ignoreList":[]}

package/components/container/container.styles.js

@@ -0,0 +1,48 @@
+import BASE_THEME from '@wavemaker-ai/app-rn-runtime/styles/theme';
+import { defineStyles } from '@wavemaker-ai/app-rn-runtime/core/base.component';
+export const DEFAULT_CLASS = 'app-container';
+BASE_THEME.registerStyle((themeVariables, addStyle) => {
+  const defaultStyles = defineStyles({
+    root: {},
+    text: {},
+    content: {
+      flexDirection: 'column'
+    },
+    skeleton: {
+      root: {
+        borderColor: 'transparent',
+        shadowColor: 'transparent',
+        backgroundColor: 'transparent'
+      }
+    },
+    sticky: {}
+  });
+  addStyle(DEFAULT_CLASS, '', defaultStyles);
+  addStyle('media-body', '', {
+    root: {
+      flex: 1,
+      paddingLeft: 8,
+      paddingRight: 8,
+      justifyContent: 'center'
+    }
+  });
+  addStyle('media-right', '', {
+    root: {
+      justifyContent: 'center'
+    }
+  });
+  addStyle('app-elevated-container', '', {
+    root: {
+      boxShadow: '2px 2px 2px rgba(0, 0, 0, 0.2)',
+      borderRadius: 8
+    }
+  });
+  addStyle('app-outlined-container', '', {
+    root: {
+      borderWidth: 1,
+      borderColor: themeVariables.containerOutlineColor,
+      borderStyle: 'solid'
+    }
+  });
+});
+//# sourceMappingURL=container.styles.js.map

package/components/container/container.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","text","content","flexDirection","skeleton","borderColor","shadowColor","backgroundColor","sticky","flex","paddingLeft","paddingRight","justifyContent","boxShadow","borderRadius","borderWidth","containerOutlineColor","borderStyle"],"sources":["container.styles.ts"],"sourcesContent":["import BASE_THEME, { AllStyle }  from '@wavemaker-ai/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker-ai/app-rn-runtime/core/base.component';\nimport { WmSkeletonStyles } from '../basic/skeleton/skeleton.styles';\n\nexport type WmContainerStyles = BaseStyles & {\n    content: AllStyle,\n    skeleton: WmSkeletonStyles,\n    sticky: AllStyle\n};\n\nexport const DEFAULT_CLASS = 'app-container';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n    const defaultStyles: WmContainerStyles = defineStyles({\n        root: {},\n        text: {},\n        content: {\n            flexDirection: 'column'\n        },\n        skeleton: {\n            root: {\n                borderColor: 'transparent',\n                shadowColor: 'transparent',\n                backgroundColor: 'transparent',\n            },\n        } as any as WmSkeletonStyles,\n        sticky: {}\n    });\n\n    addStyle(DEFAULT_CLASS, '', defaultStyles);\n    addStyle('media-body', '', {\n        root: {\n            flex: 1,\n            paddingLeft: 8,\n            paddingRight: 8,\n            justifyContent: 'center'\n        }\n    } as WmContainerStyles);\n    addStyle('media-right', '', {\n        root: {\n            justifyContent: 'center'\n        }\n    } as WmContainerStyles);\n    addStyle('app-elevated-container', '', {\n        root: {\n            boxShadow: '2px 2px 2px rgba(0, 0, 0, 0.2)',\n            borderRadius: 8\n        }\n    } as WmContainerStyles);\n    addStyle('app-outlined-container', '', {\n        root: {\n            borderWidth: 1,\n            borderColor: themeVariables.containerOutlineColor,\n            borderStyle: 'solid'\n        }\n    } as WmContainerStyles);\n});\n"],"mappings":"AAAA,OAAOA,UAAU,MAAqB,2CAA2C;AACjF,SAAqBC,YAAY,QAAQ,kDAAkD;AAS3F,OAAO,MAAMC,aAAa,GAAG,eAAe;AAC5CF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACnD,MAAMC,aAAgC,GAAGL,YAAY,CAAC;IAClDM,IAAI,EAAE,CAAC,CAAC;IACRC,IAAI,EAAE,CAAC,CAAC;IACRC,OAAO,EAAE;MACLC,aAAa,EAAE;IACnB,CAAC;IACDC,QAAQ,EAAE;MACNJ,IAAI,EAAE;QACFK,WAAW,EAAE,aAAa;QAC1BC,WAAW,EAAE,aAAa;QAC1BC,eAAe,EAAE;MACrB;IACJ,CAA4B;IAC5BC,MAAM,EAAE,CAAC;EACb,CAAC,CAAC;EAEFV,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;EAC1CD,QAAQ,CAAC,YAAY,EAAE,EAAE,EAAE;IACvBE,IAAI,EAAE;MACFS,IAAI,EAAE,CAAC;MACPC,WAAW,EAAE,CAAC;MACdC,YAAY,EAAE,CAAC;MACfC,cAAc,EAAE;IACpB;EACJ,CAAsB,CAAC;EACvBd,QAAQ,CAAC,aAAa,EAAE,EAAE,EAAE;IACxBE,IAAI,EAAE;MACFY,cAAc,EAAE;IACpB;EACJ,CAAsB,CAAC;EACvBd,QAAQ,CAAC,wBAAwB,EAAE,EAAE,EAAE;IACnCE,IAAI,EAAE;MACFa,SAAS,EAAE,gCAAgC;MAC3CC,YAAY,EAAE;IAClB;EACJ,CAAsB,CAAC;EACvBhB,QAAQ,CAAC,wBAAwB,EAAE,EAAE,EAAE;IACnCE,IAAI,EAAE;MACFe,WAAW,EAAE,CAAC;MACdV,WAAW,EAAER,cAAc,CAACmB,qBAAqB;MACjDC,WAAW,EAAE;IACjB;EACJ,CAAsB,CAAC;AAC3B,CAAC,CAAC","ignoreList":[]}

package/components/container/layoutgrid/gridcolumn/gridcolumn.component.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import { View } from 'react-native';
+import { BaseComponent, BaseComponentState } from '@wavemaker-ai/app-rn-runtime/core/base.component';
+import WmGridcolumnProps from './gridcolumn.props';
+import { DEFAULT_CLASS } from './gridcolumn.styles';
+export class WmGridcolumnState extends BaseComponentState {}
+export default class WmGridcolumn extends BaseComponent {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmGridcolumnProps());
+  }
+  renderWidget(props) {
+    if (this.styles.root.height) {
+      this.styles.root.overflow = undefined;
+    }
+    let styles;
+    if (props.xscolumnwidth) {
+      styles = this.theme.getStyle(`col-xs-${props.xscolumnwidth}  col-sm-${props.columnwidth}`);
+    } else {
+      styles = this.theme.getStyle(`col-xs-${props.columnwidth}`);
+    }
+    return /*#__PURE__*/React.createElement(View, {
+      style: [{
+        width: "100%"
+      }, styles.root, this.styles.root],
+      onLayout: event => this.handleLayout(event)
+    }, this._background, props.children);
+  }
+}
+//# sourceMappingURL=gridcolumn.component.js.map

package/components/container/layoutgrid/gridcolumn/gridcolumn.component.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","BaseComponent","BaseComponentState","WmGridcolumnProps","DEFAULT_CLASS","WmGridcolumnState","WmGridcolumn","constructor","props","renderWidget","styles","root","height","overflow","undefined","xscolumnwidth","theme","getStyle","columnwidth","createElement","style","width","onLayout","event","handleLayout","_background","children"],"sources":["gridcolumn.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker-ai/app-rn-runtime/core/base.component';\n\nimport WmGridcolumnProps from './gridcolumn.props';\nimport { DEFAULT_CLASS, WmGridColumnStyles } from './gridcolumn.styles';\n\nexport class WmGridcolumnState extends BaseComponentState<WmGridcolumnProps> {\n\n}\n\nexport default class WmGridcolumn extends BaseComponent<WmGridcolumnProps, WmGridcolumnState, WmGridColumnStyles> {\n\n  constructor(props: WmGridcolumnProps) {\n    super(props, DEFAULT_CLASS, new WmGridcolumnProps());\n  }\n\n  renderWidget(props: WmGridcolumnProps) {\n    if (this.styles.root.height) {\n      this.styles.root.overflow = undefined;\n    }\n\n    let styles;\n    if(props.xscolumnwidth) {\n      styles = this.theme.getStyle(`col-xs-${props.xscolumnwidth}  col-sm-${props.columnwidth}`);\n    } else {\n      styles = this.theme.getStyle(`col-xs-${props.columnwidth}`)\n    }\n\n    return (\n      <View\n        style={[{width: \"100%\"}, styles.root, this.styles.root]}\n        onLayout={(event) => this.handleLayout(event)}\n      >\n        {this._background}\n        {props.children}\n      </View>\n    );\n  }\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AACnC,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,kDAAkD;AAEpG,OAAOC,iBAAiB,MAAM,oBAAoB;AAClD,SAASC,aAAa,QAA4B,qBAAqB;AAEvE,OAAO,MAAMC,iBAAiB,SAASH,kBAAkB,CAAoB;AAI7E,eAAe,MAAMI,YAAY,SAASL,aAAa,CAA2D;EAEhHM,WAAWA,CAACC,KAAwB,EAAE;IACpC,KAAK,CAACA,KAAK,EAAEJ,aAAa,EAAE,IAAID,iBAAiB,CAAC,CAAC,CAAC;EACtD;EAEAM,YAAYA,CAACD,KAAwB,EAAE;IACrC,IAAI,IAAI,CAACE,MAAM,CAACC,IAAI,CAACC,MAAM,EAAE;MAC3B,IAAI,CAACF,MAAM,CAACC,IAAI,CAACE,QAAQ,GAAGC,SAAS;IACvC;IAEA,IAAIJ,MAAM;IACV,IAAGF,KAAK,CAACO,aAAa,EAAE;MACtBL,MAAM,GAAG,IAAI,CAACM,KAAK,CAACC,QAAQ,CAAC,UAAUT,KAAK,CAACO,aAAa,YAAYP,KAAK,CAACU,WAAW,EAAE,CAAC;IAC5F,CAAC,MAAM;MACLR,MAAM,GAAG,IAAI,CAACM,KAAK,CAACC,QAAQ,CAAC,UAAUT,KAAK,CAACU,WAAW,EAAE,CAAC;IAC7D;IAEA,oBACEnB,KAAA,CAAAoB,aAAA,CAACnB,IAAI;MACHoB,KAAK,EAAE,CAAC;QAACC,KAAK,EAAE;MAAM,CAAC,EAAEX,MAAM,CAACC,IAAI,EAAE,IAAI,CAACD,MAAM,CAACC,IAAI,CAAE;MACxDW,QAAQ,EAAGC,KAAK,IAAK,IAAI,CAACC,YAAY,CAACD,KAAK;IAAE,GAE7C,IAAI,CAACE,WAAW,EAChBjB,KAAK,CAACkB,QACH,CAAC;EAEX;AACF","ignoreList":[]}

package/components/container/layoutgrid/gridcolumn/gridcolumn.props.js

@@ -0,0 +1,13 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { BaseProps } from '@wavemaker-ai/app-rn-runtime/core/base.component';
+export default class WmGridcolumnProps extends BaseProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "children", void 0);
+    _defineProperty(this, "columnwidth", null);
+    _defineProperty(this, "xscolumnwidth", null);
+  }
+}
+//# sourceMappingURL=gridcolumn.props.js.map

package/components/container/layoutgrid/gridcolumn/gridcolumn.props.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BaseProps","WmGridcolumnProps","constructor","args","_defineProperty"],"sources":["gridcolumn.props.ts"],"sourcesContent":["import { BaseProps } from '@wavemaker-ai/app-rn-runtime/core/base.component';\n\nexport default class WmGridcolumnProps extends BaseProps {\n  children: any;\n  columnwidth: number = null as any;\n  xscolumnwidth: number = null as any;\n}\n"],"mappings":";;;AAAA,SAASA,SAAS,QAAQ,kDAAkD;AAE5E,eAAe,MAAMC,iBAAiB,SAASD,SAAS,CAAC;EAAAE,YAAA,GAAAC,IAAA;IAAA,SAAAA,IAAA;IAAAC,eAAA;IAAAA,eAAA,sBAEjC,IAAI;IAAAA,eAAA,wBACF,IAAI;EAAA;AAC9B","ignoreList":[]}

package/components/container/layoutgrid/gridcolumn/gridcolumn.styles.js

@@ -0,0 +1,12 @@
+import BASE_THEME from '@wavemaker-ai/app-rn-runtime/styles/theme';
+import { defineStyles } from '@wavemaker-ai/app-rn-runtime/core/base.component';
+export const DEFAULT_CLASS = 'app-gridcolumn';
+BASE_THEME.registerStyle((themeVariables, addStyle) => {
+  const defaultStyles = defineStyles({
+    root: {},
+    text: {}
+  });
+  addStyle(DEFAULT_CLASS, '', defaultStyles);
+  addStyle('table-cell', '', {});
+});
+//# sourceMappingURL=gridcolumn.styles.js.map

package/components/container/layoutgrid/gridcolumn/gridcolumn.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","text"],"sources":["gridcolumn.styles.ts"],"sourcesContent":["import BASE_THEME from '@wavemaker-ai/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker-ai/app-rn-runtime/core/base.component';\n\nexport type WmGridColumnStyles = BaseStyles & {};\n\nexport const DEFAULT_CLASS = 'app-gridcolumn';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n    const defaultStyles: WmGridColumnStyles = defineStyles({\n        root: {},\n        text: {}\n    });\n\n    addStyle(DEFAULT_CLASS, '', defaultStyles);\n\n    addStyle('table-cell', '', {});\n});\n"],"mappings":"AAAA,OAAOA,UAAU,MAAM,2CAA2C;AAClE,SAAqBC,YAAY,QAAQ,kDAAkD;AAI3F,OAAO,MAAMC,aAAa,GAAG,gBAAgB;AAC7CF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACnD,MAAMC,aAAiC,GAAGL,YAAY,CAAC;IACnDM,IAAI,EAAE,CAAC,CAAC;IACRC,IAAI,EAAE,CAAC;EACX,CAAC,CAAC;EAEFH,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;EAE1CD,QAAQ,CAAC,YAAY,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC;AAClC,CAAC,CAAC","ignoreList":[]}

package/components/container/layoutgrid/gridrow/gridrow.component.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import { View } from 'react-native';
+import { BaseComponent, BaseComponentState } from '@wavemaker-ai/app-rn-runtime/core/base.component';
+import WmGridrowProps from './gridrow.props';
+import { DEFAULT_CLASS } from './gridrow.styles';
+export class WmGridrowState extends BaseComponentState {}
+export default class WmGridrow extends BaseComponent {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmGridrowProps());
+  }
+  renderWidget(props) {
+    const styles = this._showSkeleton ? {
+      ...this.styles.root,
+      ...this.styles.skeleton.root
+    } : this.styles.root;
+    return /*#__PURE__*/React.createElement(View, {
+      style: styles,
+      onLayout: event => this.handleLayout(event)
+    }, this._background, props.children);
+  }
+}
+//# sourceMappingURL=gridrow.component.js.map

package/components/container/layoutgrid/gridrow/gridrow.component.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","BaseComponent","BaseComponentState","WmGridrowProps","DEFAULT_CLASS","WmGridrowState","WmGridrow","constructor","props","renderWidget","styles","_showSkeleton","root","skeleton","createElement","style","onLayout","event","handleLayout","_background","children"],"sources":["gridrow.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker-ai/app-rn-runtime/core/base.component';\n\nimport WmGridrowProps from './gridrow.props';\nimport { DEFAULT_CLASS, WmGridRowStyles } from './gridrow.styles';\nimport { WmSkeletonStyles } from '@wavemaker-ai/app-rn-runtime/components/basic/skeleton/skeleton.styles';\n\nexport class WmGridrowState extends BaseComponentState<WmGridrowProps> {\n\n}\n\nexport default class WmGridrow extends BaseComponent<WmGridrowProps, WmGridrowState, WmGridRowStyles> {\n\n  constructor(props: WmGridrowProps) {\n    super(props, DEFAULT_CLASS, new WmGridrowProps());\n  }\n\n  renderWidget(props: WmGridrowProps) {\n    const styles = this._showSkeleton ?  {\n      ...this.styles.root,\n      ...this.styles.skeleton.root\n    } : this.styles.root\n\n    return (\n      <View\n        style={styles}\n        onLayout={(event) => this.handleLayout(event)}\n      >\n        {this._background}\n        {props.children}\n      </View>\n    );\n  }\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AACnC,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,kDAAkD;AAEpG,OAAOC,cAAc,MAAM,iBAAiB;AAC5C,SAASC,aAAa,QAAyB,kBAAkB;AAGjE,OAAO,MAAMC,cAAc,SAASH,kBAAkB,CAAiB;AAIvE,eAAe,MAAMI,SAAS,SAASL,aAAa,CAAkD;EAEpGM,WAAWA,CAACC,KAAqB,EAAE;IACjC,KAAK,CAACA,KAAK,EAAEJ,aAAa,EAAE,IAAID,cAAc,CAAC,CAAC,CAAC;EACnD;EAEAM,YAAYA,CAACD,KAAqB,EAAE;IAClC,MAAME,MAAM,GAAG,IAAI,CAACC,aAAa,GAAI;MACnC,GAAG,IAAI,CAACD,MAAM,CAACE,IAAI;MACnB,GAAG,IAAI,CAACF,MAAM,CAACG,QAAQ,CAACD;IAC1B,CAAC,GAAG,IAAI,CAACF,MAAM,CAACE,IAAI;IAEpB,oBACEb,KAAA,CAAAe,aAAA,CAACd,IAAI;MACHe,KAAK,EAAEL,MAAO;MACdM,QAAQ,EAAGC,KAAK,IAAK,IAAI,CAACC,YAAY,CAACD,KAAK;IAAE,GAE7C,IAAI,CAACE,WAAW,EAChBX,KAAK,CAACY,QACH,CAAC;EAEX;AACF","ignoreList":[]}

package/components/container/layoutgrid/gridrow/gridrow.props.js

@@ -0,0 +1,11 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { BaseProps } from '@wavemaker-ai/app-rn-runtime/core/base.component';
+export default class WmGridrowProps extends BaseProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "children", void 0);
+  }
+}
+//# sourceMappingURL=gridrow.props.js.map

package/components/container/layoutgrid/gridrow/gridrow.props.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BaseProps","WmGridrowProps","constructor","args","_defineProperty"],"sources":["gridrow.props.ts"],"sourcesContent":["import { BaseProps } from '@wavemaker-ai/app-rn-runtime/core/base.component';\n\nexport default class WmGridrowProps extends BaseProps {\n  children: any;\n}\n"],"mappings":";;;AAAA,SAASA,SAAS,QAAQ,kDAAkD;AAE5E,eAAe,MAAMC,cAAc,SAASD,SAAS,CAAC;EAAAE,YAAA,GAAAC,IAAA;IAAA,SAAAA,IAAA;IAAAC,eAAA;EAAA;AAEtD","ignoreList":[]}

package/components/container/layoutgrid/gridrow/gridrow.styles.js

@@ -0,0 +1,42 @@
+import BASE_THEME from '@wavemaker-ai/app-rn-runtime/styles/theme';
+import { defineStyles } from '@wavemaker-ai/app-rn-runtime/core/base.component';
+export const DEFAULT_CLASS = 'app-gridrow';
+BASE_THEME.registerStyle((themeVariables, addStyle) => {
+  const defaultStyles = defineStyles({
+    root: {
+      flexDirection: 'row',
+      width: '100%',
+      flexWrap: 'wrap'
+    },
+    text: {},
+    skeleton: {
+      root: {
+        borderColor: 'transparent'
+      }
+    }
+  });
+  addStyle(DEFAULT_CLASS, '', defaultStyles);
+  addStyle('table-row', '', {
+    root: {
+      borderBottomWidth: 1,
+      borderStyle: 'solid',
+      borderColor: themeVariables.gridColumnBorderColor
+    }
+  });
+  addStyle('table-header-row', '', {
+    root: {
+      backgroundColor: themeVariables.layoutGridHeaderBgColor
+    }
+  });
+  addStyle('table-striped-row0', '', {
+    root: {
+      backgroundColor: themeVariables.layoutGridStripColor1
+    }
+  });
+  addStyle('table-striped-row1', '', {
+    root: {
+      backgroundColor: themeVariables.layoutGridStripColor2
+    }
+  });
+});
+//# sourceMappingURL=gridrow.styles.js.map

package/components/container/layoutgrid/gridrow/gridrow.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","flexDirection","width","flexWrap","text","skeleton","borderColor","borderBottomWidth","borderStyle","gridColumnBorderColor","backgroundColor","layoutGridHeaderBgColor","layoutGridStripColor1","layoutGridStripColor2"],"sources":["gridrow.styles.ts"],"sourcesContent":["import BASE_THEME from '@wavemaker-ai/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker-ai/app-rn-runtime/core/base.component';\nimport { WmSkeletonStyles } from '@wavemaker-ai/app-rn-runtime/components/basic/skeleton/skeleton.styles';\n\nexport type WmGridRowStyles = BaseStyles & {\n  skeleton: WmSkeletonStyles;\n};\n\nexport const DEFAULT_CLASS = 'app-gridrow';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n  const defaultStyles: WmGridRowStyles = defineStyles({\n      root: {\n          flexDirection: 'row',\n          width: '100%',\n          flexWrap: 'wrap'\n      },\n      text: {},\n      skeleton: {\n        root: {\n          borderColor: 'transparent'\n        }\n      } as any as WmSkeletonStyles\n  });\n\n  addStyle(DEFAULT_CLASS, '', defaultStyles);\n  addStyle('table-row', '', {\n      root: {\n          borderBottomWidth: 1,\n          borderStyle: 'solid',\n          borderColor: themeVariables.gridColumnBorderColor\n      }\n  });\n  addStyle('table-header-row', '', {\n      root: {\n          backgroundColor: themeVariables.layoutGridHeaderBgColor\n      }\n  });\n  addStyle('table-striped-row0', '', {\n    root: {\n      backgroundColor: themeVariables.layoutGridStripColor1\n    }\n  });\n  addStyle('table-striped-row1', '', {\n    root: {\n      backgroundColor: themeVariables.layoutGridStripColor2\n    }\n  });\n});\n"],"mappings":"AAAA,OAAOA,UAAU,MAAM,2CAA2C;AAClE,SAAqBC,YAAY,QAAQ,kDAAkD;AAO3F,OAAO,MAAMC,aAAa,GAAG,aAAa;AAC1CF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACrD,MAAMC,aAA8B,GAAGL,YAAY,CAAC;IAChDM,IAAI,EAAE;MACFC,aAAa,EAAE,KAAK;MACpBC,KAAK,EAAE,MAAM;MACbC,QAAQ,EAAE;IACd,CAAC;IACDC,IAAI,EAAE,CAAC,CAAC;IACRC,QAAQ,EAAE;MACRL,IAAI,EAAE;QACJM,WAAW,EAAE;MACf;IACF;EACJ,CAAC,CAAC;EAEFR,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;EAC1CD,QAAQ,CAAC,WAAW,EAAE,EAAE,EAAE;IACtBE,IAAI,EAAE;MACFO,iBAAiB,EAAE,CAAC;MACpBC,WAAW,EAAE,OAAO;MACpBF,WAAW,EAAET,cAAc,CAACY;IAChC;EACJ,CAAC,CAAC;EACFX,QAAQ,CAAC,kBAAkB,EAAE,EAAE,EAAE;IAC7BE,IAAI,EAAE;MACFU,eAAe,EAAEb,cAAc,CAACc;IACpC;EACJ,CAAC,CAAC;EACFb,QAAQ,CAAC,oBAAoB,EAAE,EAAE,EAAE;IACjCE,IAAI,EAAE;MACJU,eAAe,EAAEb,cAAc,CAACe;IAClC;EACF,CAAC,CAAC;EACFd,QAAQ,CAAC,oBAAoB,EAAE,EAAE,EAAE;IACjCE,IAAI,EAAE;MACJU,eAAe,EAAEb,cAAc,CAACgB;IAClC;EACF,CAAC,CAAC;AACJ,CAAC,CAAC","ignoreList":[]}

package/components/container/layoutgrid/layoutgrid.component.js

@@ -0,0 +1,44 @@
+import React from 'react';
+import { View } from 'react-native';
+import { BaseComponent, BaseComponentState } from '@wavemaker-ai/app-rn-runtime/core/base.component';
+import WmLayoutgridProps from './layoutgrid.props';
+import { DEFAULT_CLASS } from './layoutgrid.styles';
+import { createSkeleton } from '@wavemaker-ai/app-rn-runtime/components/basic/skeleton/skeleton.component';
+export class WmLayoutgridState extends BaseComponentState {}
+export default class WmLayoutgrid extends BaseComponent {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmLayoutgridProps());
+  }
+  getBackground() {
+    return this._showSkeleton ? null : this._background;
+  }
+  renderSkeleton(props) {
+    if (!props.showskeletonchildren) {
+      var _this$props;
+      const skeletonStyles = ((_this$props = this.props) === null || _this$props === void 0 || (_this$props = _this$props.styles) === null || _this$props === void 0 ? void 0 : _this$props.skeleton) || {
+        root: {},
+        text: {}
+      };
+      return createSkeleton(this.theme, skeletonStyles, {
+        ...this.styles.root
+      }, /*#__PURE__*/React.createElement(View, {
+        style: [this.styles.root, {
+          opacity: 0
+        }]
+      }, props.children));
+    }
+    return null;
+  }
+  renderWidget(props) {
+    const styles = this._showSkeleton ? {
+      ...this.styles.root,
+      ...this.styles.skeleton.root
+    } : this.styles.root;
+    return /*#__PURE__*/React.createElement(View, {
+      onLayout: event => this.handleLayout(event),
+      style: styles,
+      testID: this.getTestId()
+    }, this.getBackground(), props.children);
+  }
+}
+//# sourceMappingURL=layoutgrid.component.js.map

package/components/container/layoutgrid/layoutgrid.component.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","BaseComponent","BaseComponentState","WmLayoutgridProps","DEFAULT_CLASS","createSkeleton","WmLayoutgridState","WmLayoutgrid","constructor","props","getBackground","_showSkeleton","_background","renderSkeleton","showskeletonchildren","_this$props","skeletonStyles","styles","skeleton","root","text","theme","createElement","style","opacity","children","renderWidget","onLayout","event","handleLayout","testID","getTestId"],"sources":["layoutgrid.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker-ai/app-rn-runtime/core/base.component';\n\nimport WmLayoutgridProps from './layoutgrid.props';\nimport { DEFAULT_CLASS, WmLayoutGridStyles } from './layoutgrid.styles';\nimport { WmSkeletonStyles } from '@wavemaker-ai/app-rn-runtime/components/basic/skeleton/skeleton.styles';\nimport { createSkeleton } from '@wavemaker-ai/app-rn-runtime/components/basic/skeleton/skeleton.component';\n\nexport class WmLayoutgridState extends BaseComponentState<WmLayoutgridProps> {\n\n}\n\nexport default class WmLayoutgrid extends BaseComponent<WmLayoutgridProps, WmLayoutgridState, WmLayoutGridStyles> {\n\n  constructor(props: WmLayoutgridProps) {\n    super(props, DEFAULT_CLASS, new WmLayoutgridProps());\n  }\n\n  getBackground(): React.JSX.Element | null {\n    return this._showSkeleton ? null : this._background\n  }\n\n  public renderSkeleton(props: WmLayoutgridProps): React.ReactNode {\n    if(!props.showskeletonchildren) {\n      const skeletonStyles: WmSkeletonStyles = this.props?.styles?.skeleton || { root: {}, text: {}  } as WmSkeletonStyles\n      return createSkeleton(this.theme, skeletonStyles, {\n        ...this.styles.root\n      }, (<View style={[this.styles.root, { opacity: 0 }]}>\n        {props.children}\n      </View>))\n    }\n    return null;\n  }\n\n\n  renderWidget(props: WmLayoutgridProps) {\n    const styles = this._showSkeleton ? {\n      ...this.styles.root,\n      ...this.styles.skeleton.root\n    } : this.styles.root\n    return (\n      <View\n        onLayout={(event) => this.handleLayout(event)}\n        style={styles}\n        testID={this.getTestId()}\n      >\n        {this.getBackground()}\n        {props.children}\n      </View>\n    );\n  }\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AACnC,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,kDAAkD;AAEpG,OAAOC,iBAAiB,MAAM,oBAAoB;AAClD,SAASC,aAAa,QAA4B,qBAAqB;AAEvE,SAASC,cAAc,QAAQ,2EAA2E;AAE1G,OAAO,MAAMC,iBAAiB,SAASJ,kBAAkB,CAAoB;AAI7E,eAAe,MAAMK,YAAY,SAASN,aAAa,CAA2D;EAEhHO,WAAWA,CAACC,KAAwB,EAAE;IACpC,KAAK,CAACA,KAAK,EAAEL,aAAa,EAAE,IAAID,iBAAiB,CAAC,CAAC,CAAC;EACtD;EAEAO,aAAaA,CAAA,EAA6B;IACxC,OAAO,IAAI,CAACC,aAAa,GAAG,IAAI,GAAG,IAAI,CAACC,WAAW;EACrD;EAEOC,cAAcA,CAACJ,KAAwB,EAAmB;IAC/D,IAAG,CAACA,KAAK,CAACK,oBAAoB,EAAE;MAAA,IAAAC,WAAA;MAC9B,MAAMC,cAAgC,GAAG,EAAAD,WAAA,OAAI,CAACN,KAAK,cAAAM,WAAA,gBAAAA,WAAA,GAAVA,WAAA,CAAYE,MAAM,cAAAF,WAAA,uBAAlBA,WAAA,CAAoBG,QAAQ,KAAI;QAAEC,IAAI,EAAE,CAAC,CAAC;QAAEC,IAAI,EAAE,CAAC;MAAG,CAAqB;MACpH,OAAOf,cAAc,CAAC,IAAI,CAACgB,KAAK,EAAEL,cAAc,EAAE;QAChD,GAAG,IAAI,CAACC,MAAM,CAACE;MACjB,CAAC,eAAGpB,KAAA,CAAAuB,aAAA,CAACtB,IAAI;QAACuB,KAAK,EAAE,CAAC,IAAI,CAACN,MAAM,CAACE,IAAI,EAAE;UAAEK,OAAO,EAAE;QAAE,CAAC;MAAE,GACjDf,KAAK,CAACgB,QACH,CAAE,CAAC;IACX;IACA,OAAO,IAAI;EACb;EAGAC,YAAYA,CAACjB,KAAwB,EAAE;IACrC,MAAMQ,MAAM,GAAG,IAAI,CAACN,aAAa,GAAG;MAClC,GAAG,IAAI,CAACM,MAAM,CAACE,IAAI;MACnB,GAAG,IAAI,CAACF,MAAM,CAACC,QAAQ,CAACC;IAC1B,CAAC,GAAG,IAAI,CAACF,MAAM,CAACE,IAAI;IACpB,oBACEpB,KAAA,CAAAuB,aAAA,CAACtB,IAAI;MACH2B,QAAQ,EAAGC,KAAK,IAAK,IAAI,CAACC,YAAY,CAACD,KAAK,CAAE;MAC9CL,KAAK,EAAEN,MAAO;MACda,MAAM,EAAE,IAAI,CAACC,SAAS,CAAC;IAAE,GAExB,IAAI,CAACrB,aAAa,CAAC,CAAC,EACpBD,KAAK,CAACgB,QACH,CAAC;EAEX;AACF","ignoreList":[]}

package/components/container/layoutgrid/layoutgrid.props.js

@@ -0,0 +1,11 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { BaseProps } from '@wavemaker-ai/app-rn-runtime/core/base.component';
+export default class WmLayoutgridProps extends BaseProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "children", void 0);
+  }
+}
+//# sourceMappingURL=layoutgrid.props.js.map

package/components/container/layoutgrid/layoutgrid.props.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BaseProps","WmLayoutgridProps","constructor","args","_defineProperty"],"sources":["layoutgrid.props.ts"],"sourcesContent":["import { BaseProps } from '@wavemaker-ai/app-rn-runtime/core/base.component';\n\nexport default class WmLayoutgridProps extends BaseProps {\n  children: any;\n}\n"],"mappings":";;;AAAA,SAASA,SAAS,QAAQ,kDAAkD;AAE5E,eAAe,MAAMC,iBAAiB,SAASD,SAAS,CAAC;EAAAE,YAAA,GAAAC,IAAA;IAAA,SAAAA,IAAA;IAAAC,eAAA;EAAA;AAEzD","ignoreList":[]}