@wavemaker/app-rn-runtime 12.0.0-next.46502 → 12.0.0-next.47809

package/components/basic/picture/picture.component.js

@@ -0,0 +1,294 @@
+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 { Image, View } from 'react-native';
+import { Image as EXPOImage } from 'expo-image';
+import { isNumber } from 'lodash-es';
+import { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';
+import { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';
+import ImageSizeEstimator from '@wavemaker/app-rn-runtime/core/imageSizeEstimator';
+import { isFullPathUrl } from '@wavemaker/app-rn-runtime/core/utils';
+import { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker/app-rn-runtime/core/accessibility';
+import WmPictureProps from './picture.props';
+import { DEFAULT_CLASS } from './picture.styles';
+import { Animatedview } from '@wavemaker/app-rn-runtime/components/basic/animatedview.component';
+import { createSkeleton } from '../skeleton/skeleton.component';
+export class WmPictureState extends BaseComponentState {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "naturalImageWidth", 0);
+    _defineProperty(this, "naturalImageHeight", 0);
+    _defineProperty(this, "imageWidth", 0);
+    _defineProperty(this, "imageHeight", 0);
+    _defineProperty(this, "originalContainerWidth", 0);
+    _defineProperty(this, "originalContainerHeight", 0);
+  }
+}
+export default class WmPicture extends BaseComponent {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmPictureProps());
+    _defineProperty(this, "_pictureSource", null);
+    _defineProperty(this, "_picturePlaceHolder", null);
+    // The below property will be used to track and remove the calculateImageSize listenrs of individual picturesource
+    _defineProperty(this, "_cleanupTracker", {});
+    _defineProperty(this, "onViewLayoutChange", e => {
+      var _this$styles, _this$styles2, _this$styles3;
+      let imageWidth = e.nativeEvent.layout.width;
+      let imageHeight = e.nativeEvent.layout.height;
+      if (!imageWidth && !imageHeight) {
+        return;
+      }
+      if (!((_this$styles = this.styles) !== null && _this$styles !== void 0 && _this$styles.root.height) || typeof ((_this$styles2 = this.styles) === null || _this$styles2 === void 0 ? void 0 : _this$styles2.root.height) === 'string' && !((_this$styles3 = this.styles) !== null && _this$styles3 !== void 0 && _this$styles3.root.height.includes('%'))) {
+        imageHeight = 0;
+      }
+      if (this.state.props.aspectratio && !imageHeight && imageWidth) {
+        imageHeight = imageWidth / parseFloat(this.state.props.aspectratio);
+      } else if (this.state.props.aspectratio && !imageWidth && imageHeight) {
+        imageWidth = imageWidth * parseFloat(this.state.props.aspectratio);
+      } else if (imageWidth && !imageHeight) {
+        imageHeight = imageWidth * this.state.naturalImageHeight / this.state.naturalImageWidth;
+      } else if (imageHeight && !imageWidth) {
+        imageWidth = imageHeight * this.state.naturalImageWidth / this.state.naturalImageHeight;
+      }
+      this.updateState({
+        imageWidth: imageWidth,
+        imageHeight: imageHeight,
+        originalContainerWidth: this.styles.root.width ? e.nativeEvent.layout.width : 0,
+        originalContainerHeight: this.styles.root.height ? e.nativeEvent.layout.height : 0
+      });
+    });
+    _defineProperty(this, "showImage", (imageElement, props) => {
+      return imageElement;
+    });
+  }
+  loadImage(image) {
+    if (!image || !this.loadAsset) {
+      return null;
+    }
+    const imageSrc = this.loadAsset(image);
+    if (imageSrc && typeof imageSrc === 'object' && typeof imageSrc.default === 'function') {
+      return null;
+    }
+    // if(this.state.props.aspectratio) {
+    //   return imageSrc;
+    // }
+    if (isNumber(imageSrc)) {
+      const {
+        width,
+        height
+      } = Image.resolveAssetSource(imageSrc);
+      this.updateState({
+        naturalImageWidth: width,
+        naturalImageHeight: height
+      });
+    } else if (imageSrc !== null) {
+      const cancel = ImageSizeEstimator.getSize(imageSrc, (width, height) => {
+        this.updateState({
+          naturalImageWidth: width,
+          naturalImageHeight: height
+        });
+        this.cleanup.splice(this.cleanup.indexOf(cancel), 1);
+      });
+      if (this.props.picturesource && this._cleanupTracker[this.props.picturesource]) {
+        this._cleanupTracker[this.props.picturesource].push(cancel);
+      } else if (this.props.picturesource && !this._cleanupTracker[this.props.picturesource]) {
+        this._cleanupTracker[this.props.picturesource] = [];
+        this._cleanupTracker[this.props.picturesource].push(cancel);
+      }
+      this.cleanup.push(cancel);
+    }
+    return imageSrc;
+  }
+
+  // Check if the image source prop is changed from previous update to remove all listeners
+  componentDidUpdate(prevProps, prevState, snapshot) {
+    if (this.state.props.picturesource !== prevProps.picturesource) {
+      if (prevProps.picturesource && this._cleanupTracker[prevProps.picturesource]) {
+        this._cleanupTracker[prevProps.picturesource].forEach(func => {
+          func();
+        });
+        this._cleanupTracker[prevProps.picturesource] = [];
+        delete this._cleanupTracker[prevProps.picturesource];
+      }
+    }
+    super.componentDidUpdate(prevProps, prevState);
+  }
+  onPropertyChange(name, $new, $old) {
+    switch (name) {
+      case 'picturesource':
+        this._pictureSource = null;
+      case 'pictureplaceholder':
+        this._picturePlaceHolder = null;
+        break;
+    }
+  }
+  createShape(shape, imageWidth) {
+    if (shape) {
+      switch (shape) {
+        case 'circle':
+          return {
+            picture: {
+              borderRadius: isNumber(imageWidth) ? imageWidth / 2 : 4
+            }
+          };
+        case 'rounded':
+          return this.theme.getStyle('rounded-image');
+        case 'thumbnail':
+          return this.theme.getStyle('thumbnail-image');
+      }
+    }
+    return {};
+  }
+  getElementToShow(props, imgSrc, shapeStyles) {
+    let elementToshow, source;
+    if (imgSrc && typeof imgSrc === 'object' && typeof (imgSrc === null || imgSrc === void 0 ? void 0 : imgSrc.default) === 'function') {
+      let imgStyle = {};
+      if (props.resizemode === 'contain') {
+        imgStyle['width'] = '100%';
+        imgStyle['height'] = '100%';
+      }
+      elementToshow = /*#__PURE__*/React.createElement(imgSrc === null || imgSrc === void 0 ? void 0 : imgSrc.default, imgStyle);
+      //} else if (!isWebPreviewMode() && props.isSvg) {
+      //  svg from uri
+      //  elementToshow = <SvgUri testID={this.getTestId('picture')} width={this.styles.root.width as NumberProp} height={this.styles.root.height as NumberProp} uri={imgSrc}/>;
+    } else if (isFullPathUrl(imgSrc)) {
+      source = {
+        uri: imgSrc
+      };
+    } else {
+      source = imgSrc;
+    }
+    if (this.state.naturalImageWidth || this.state.props.aspectratio) {
+      elementToshow =
+      /*#__PURE__*/
+      // * INFO: if any issue arises like freezing of application because of 
+      // * rendering large number of images, check the cache policy.
+      React.createElement(EXPOImage, _extends({
+        cachePolicy: "memory"
+      }, this.getTestProps('picture'), {
+        style: [this.styles.picture, shapeStyles.picture, props.fastload || this.state.imageWidth ? {
+          opacity: 1
+        } : {
+          opacity: 0
+        }],
+        contentFit: props.resizemode,
+        source: source
+      }));
+    }
+    return elementToshow;
+  }
+  renderSkeleton(props) {
+    var _this$styles$root, _shapeStyles$root, _shapeStyles$picture, _this$styles$root2, _shapeStyles$root2, _shapeStyles$picture2, _this$styles$root3, _shapeStyles$picture3, _shapeStyles$root3, _this$styles$root4;
+    const imageWidth = this.state.imageWidth;
+    const imageHeight = this.state.imageHeight;
+    const shapeStyles = this.createShape(this.props.shape, imageWidth);
+    const skeletonWidth = this.props.skeletonwidth || ((_this$styles$root = this.styles.root) === null || _this$styles$root === void 0 ? void 0 : _this$styles$root.width) || ((_shapeStyles$root = shapeStyles.root) === null || _shapeStyles$root === void 0 ? void 0 : _shapeStyles$root.width) || ((_shapeStyles$picture = shapeStyles.picture) === null || _shapeStyles$picture === void 0 ? void 0 : _shapeStyles$picture.width) || imageWidth;
+    const skeletonHeight = this.props.skeletonheight || ((_this$styles$root2 = this.styles.root) === null || _this$styles$root2 === void 0 ? void 0 : _this$styles$root2.height) || ((_shapeStyles$root2 = shapeStyles.root) === null || _shapeStyles$root2 === void 0 ? void 0 : _shapeStyles$root2.height) || ((_shapeStyles$picture2 = shapeStyles.picture) === null || _shapeStyles$picture2 === void 0 ? void 0 : _shapeStyles$picture2.height) || imageHeight;
+    return createSkeleton(this.theme, this.styles.skeleton, {
+      ...this.styles.root,
+      borderRadius: this.props.shape == 'circle' && (_this$styles$root3 = this.styles.root) !== null && _this$styles$root3 !== void 0 && _this$styles$root3.width ? 25 : ((_shapeStyles$picture3 = shapeStyles.picture) === null || _shapeStyles$picture3 === void 0 ? void 0 : _shapeStyles$picture3.borderRadius) || ((_shapeStyles$root3 = shapeStyles.root) === null || _shapeStyles$root3 === void 0 ? void 0 : _shapeStyles$root3.borderRadius) || ((_this$styles$root4 = this.styles.root) === null || _this$styles$root4 === void 0 ? void 0 : _this$styles$root4.borderRadius) || 4,
+      width: skeletonWidth,
+      height: skeletonHeight
+    });
+  }
+  //TODO: remove the re calculation logic later. Keeping it as an extra safety.  
+  calculateBasedOnaspectratio() {
+    if (this.state.props.aspectratio) {
+      if (this.state.originalContainerWidth) {
+        return {
+          imageHeight: this.state.originalContainerWidth / parseFloat(this.state.props.aspectratio),
+          imageWidth: this.state.originalContainerWidth
+        };
+      } else if (this.state.originalContainerHeight) {
+        return {
+          imageHeight: this.state.originalContainerHeight,
+          imageWidth: this.state.originalContainerHeight * parseFloat(this.state.props.aspectratio)
+        };
+      }
+    }
+    return null;
+  }
+
+  //TODO: remove the re calculation logic later. Keeping it as an extra safety.  
+  calculateBasedOnNaturalDimensions() {
+    // No need to calculate width & height if the user already passign them explicitly from props.  
+    const widthAndHeightExistsInProps = this.styles.root.width && this.styles.root.height;
+    if (!this.state.props.aspectratio && !widthAndHeightExistsInProps) {
+      if (this.state.originalContainerWidth) {
+        return {
+          imageHeight: this.state.originalContainerWidth * this.state.naturalImageHeight / this.state.naturalImageWidth,
+          imageWidth: this.state.originalContainerWidth
+        };
+      } else if (this.state.originalContainerHeight) {
+        return {
+          imageHeight: this.state.originalContainerHeight,
+          imageWidth: this.state.originalContainerHeight * this.state.naturalImageWidth / this.state.naturalImageHeight
+        };
+      }
+    }
+    return null;
+  }
+  renderWidget(props) {
+    var _shapeStyles$picture4;
+    let imageWidth = this.state.imageWidth;
+    let imageHeight = this.state.imageHeight;
+
+    //TODO: remove the re calculation logic later. Keeping it as an extra safety.  
+    const aspectDimensions = this.calculateBasedOnaspectratio();
+    const naturalDimensions = this.calculateBasedOnNaturalDimensions();
+    if (aspectDimensions) {
+      const dimensions = aspectDimensions;
+      imageWidth = dimensions.imageWidth;
+      imageHeight = dimensions.imageHeight;
+    } else if (naturalDimensions) {
+      const dimensions = naturalDimensions;
+      imageHeight = dimensions.imageHeight;
+      imageWidth = dimensions.imageWidth;
+    }
+    const shapeStyles = this.createShape(props.shape, imageWidth);
+    this._pictureSource = this._pictureSource || this.loadImage(props.picturesource);
+    this._picturePlaceHolder = props.fastload ? this._pictureSource || this._picturePlaceHolder || this.loadImage(props.pictureplaceholder) : this._picturePlaceHolder || this.loadImage(props.pictureplaceholder);
+    const imgSrc = this._pictureSource || this._picturePlaceHolder;
+    let elementToshow;
+    if (imgSrc) {
+      elementToshow = this.getElementToShow(props, imgSrc, shapeStyles);
+    }
+    return imgSrc && (this.state.naturalImageWidth || props.isSvg || props.aspectratio) ? /*#__PURE__*/React.createElement(View, {
+      style: [{
+        width: imageWidth,
+        height: imageHeight
+      }, this.styles.root, shapeStyles.root, shapeStyles.picture],
+      onLayout: event => this.handleLayout(event)
+    }, this._background, /*#__PURE__*/React.createElement(View, {
+      style: [{
+        overflow: 'hidden',
+        width: '100%',
+        height: '100%'
+      }],
+      onLayout: this.onViewLayoutChange
+    }, /*#__PURE__*/React.createElement(Tappable, _extends({
+      disableTouchEffect: this.state.props.disabletoucheffect
+    }, this.getTestPropsForAction(), {
+      rippleColor: this.styles.root.rippleColor,
+      target: this,
+      styles: {
+        width: imageWidth ? null : '100%',
+        height: imageHeight ? null : '100%'
+      }
+    }), /*#__PURE__*/React.createElement(Animatedview, {
+      entryanimation: props.animation,
+      delay: props.animationdelay,
+      style: [{
+        height: imageHeight,
+        width: imageWidth,
+        borderRadius: (_shapeStyles$picture4 = shapeStyles.picture) === null || _shapeStyles$picture4 === void 0 ? void 0 : _shapeStyles$picture4.borderRadius
+      }],
+      accessibilityProps: props.accessible ? {
+        ...getAccessibilityProps(AccessibilityWidgetType.PICTURE, props)
+      } : {}
+    }, this.showImage(elementToshow, props))))) : null;
+  }
+}
+//# sourceMappingURL=picture.component.js.map

package/components/basic/picture/picture.component.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Image","View","EXPOImage","isNumber","Tappable","BaseComponent","BaseComponentState","ImageSizeEstimator","isFullPathUrl","AccessibilityWidgetType","getAccessibilityProps","WmPictureProps","DEFAULT_CLASS","Animatedview","createSkeleton","WmPictureState","constructor","args","_defineProperty","WmPicture","props","e","_this$styles","_this$styles2","_this$styles3","imageWidth","nativeEvent","layout","width","imageHeight","height","styles","root","includes","state","aspectratio","parseFloat","naturalImageHeight","naturalImageWidth","updateState","originalContainerWidth","originalContainerHeight","imageElement","loadImage","image","loadAsset","imageSrc","default","resolveAssetSource","cancel","getSize","cleanup","splice","indexOf","picturesource","_cleanupTracker","push","componentDidUpdate","prevProps","prevState","snapshot","forEach","func","onPropertyChange","name","$new","$old","_pictureSource","_picturePlaceHolder","createShape","shape","picture","borderRadius","theme","getStyle","getElementToShow","imgSrc","shapeStyles","elementToshow","source","imgStyle","resizemode","createElement","uri","_extends","cachePolicy","getTestProps","style","fastload","opacity","contentFit","renderSkeleton","_this$styles$root","_shapeStyles$root","_shapeStyles$picture","_this$styles$root2","_shapeStyles$root2","_shapeStyles$picture2","_this$styles$root3","_shapeStyles$picture3","_shapeStyles$root3","_this$styles$root4","skeletonWidth","skeletonwidth","skeletonHeight","skeletonheight","skeleton","calculateBasedOnaspectratio","calculateBasedOnNaturalDimensions","widthAndHeightExistsInProps","renderWidget","_shapeStyles$picture4","aspectDimensions","naturalDimensions","dimensions","pictureplaceholder","isSvg","onLayout","event","handleLayout","_background","overflow","onViewLayoutChange","disableTouchEffect","disabletoucheffect","getTestPropsForAction","rippleColor","target","entryanimation","animation","delay","animationdelay","accessibilityProps","accessible","PICTURE","showImage"],"sources":["picture.component.tsx"],"sourcesContent":["import React from 'react';\nimport {  DimensionValue, Image, LayoutChangeEvent, View } from 'react-native';\nimport {Image as EXPOImage} from 'expo-image';\nimport { isNumber } from 'lodash-es';\nimport { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\nimport ImageSizeEstimator from '@wavemaker/app-rn-runtime/core/imageSizeEstimator';\nimport { isFullPathUrl } from '@wavemaker/app-rn-runtime/core/utils';\nimport { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker/app-rn-runtime/core/accessibility';\n\nimport WmPictureProps from './picture.props';\nimport { DEFAULT_CLASS, WmPictureStyles } from './picture.styles';\nimport { Animatedview } from '@wavemaker/app-rn-runtime/components/basic/animatedview.component';\nimport WmSkeleton, { createSkeleton } from '../skeleton/skeleton.component';\n\nexport class WmPictureState extends BaseComponentState<WmPictureProps> {\n  naturalImageWidth: number = 0;\n  naturalImageHeight: number = 0;\n  imageWidth: number = 0;\n  imageHeight: number = 0;\n  originalContainerWidth: number = 0;\n  originalContainerHeight: number = 0;\n}\n\nexport default class WmPicture extends BaseComponent<WmPictureProps, WmPictureState, WmPictureStyles> {\n\n  private _pictureSource = null as any;\n  private _picturePlaceHolder = null as any;\n\n  // The below property will be used to track and remove the calculateImageSize listenrs of individual picturesource\n  private _cleanupTracker = {} as any\n\n  constructor(props: WmPictureProps) {\n    super(props, DEFAULT_CLASS, new WmPictureProps());\n  }\n\n  loadImage(image: string | undefined) {\n    if (!image || !this.loadAsset) {\n      return null;\n    }\n    const imageSrc = this.loadAsset(image) as any;\n    if (imageSrc && typeof imageSrc === 'object' && typeof imageSrc.default === 'function') {\n      return null;\n    }\n    // if(this.state.props.aspectratio) {\n    //   return imageSrc;\n    // }\n    if (isNumber(imageSrc)) {\n      const {width, height} = Image.resolveAssetSource(imageSrc);\n      this.updateState({\n        naturalImageWidth: width,\n        naturalImageHeight: height\n      } as WmPictureState);\n    } else if (imageSrc !== null) {\n      const cancel = ImageSizeEstimator.getSize(imageSrc, (width: number, height: number) => {\n        this.updateState({\n          naturalImageWidth: width,\n          naturalImageHeight: height\n        } as WmPictureState);\n        this.cleanup.splice(this.cleanup.indexOf(cancel), 1);\n      });\n      if(this.props.picturesource && this._cleanupTracker[this.props.picturesource]) {\n        this._cleanupTracker[this.props.picturesource].push(cancel)\n      } else if(this.props.picturesource && !this._cleanupTracker[this.props.picturesource]) {\n        this._cleanupTracker[this.props.picturesource] = [];\n        this._cleanupTracker[this.props.picturesource].push(cancel)\n      }\n      this.cleanup.push(cancel);\n    }\n    return imageSrc;\n  }\n\n    // Check if the image source prop is changed from previous update to remove all listeners\n  componentDidUpdate(prevProps: Readonly<WmPictureProps>, prevState: Readonly<WmPictureState>, snapshot?: any): void {\n    if(this.state.props.picturesource !== prevProps.picturesource) {\n      if(prevProps.picturesource && this._cleanupTracker[prevProps.picturesource]) {\n        this._cleanupTracker[prevProps.picturesource].forEach((func: any) => {\n          func();\n        });  \n        this._cleanupTracker[prevProps.picturesource] = []\n        delete this._cleanupTracker[prevProps.picturesource] \n      }\n    }\n    super.componentDidUpdate(prevProps, prevState)\n  }\n\n\n  onPropertyChange(name: string, $new: any, $old: any) {\n    switch(name) {\n      case 'picturesource':\n        this._pictureSource = null;\n      case 'pictureplaceholder':\n        this._picturePlaceHolder = null;\n        break;\n    }\n  }\n\n  onViewLayoutChange = (e: LayoutChangeEvent) => {\n    let imageWidth = e.nativeEvent.layout.width;\n    let imageHeight = e.nativeEvent.layout.height;\n    if (!imageWidth && !imageHeight) {\n      return;\n    }\n    if (!this.styles?.root.height\n        || (typeof this.styles?.root.height === 'string'\n          && !this.styles?.root.height.includes('%'))) {\n        imageHeight = 0;\n    }\n    if(this.state.props.aspectratio && !imageHeight && imageWidth) {\n      imageHeight = imageWidth / parseFloat(this.state.props.aspectratio as string)\n    } else if (this.state.props.aspectratio && !imageWidth && imageHeight) {\n      imageWidth = imageWidth * parseFloat(this.state.props.aspectratio as string)\n    } else if (imageWidth && !imageHeight) {\n      imageHeight = imageWidth * this.state.naturalImageHeight / this.state.naturalImageWidth;\n    } else if (imageHeight && !imageWidth) {\n      imageWidth = imageHeight * this.state.naturalImageWidth / this.state.naturalImageHeight;\n    }\n    this.updateState({\n      imageWidth: imageWidth,\n      imageHeight: imageHeight,\n      originalContainerWidth: this.styles.root.width ? e.nativeEvent.layout.width : 0,\n      originalContainerHeight: this.styles.root.height ? e.nativeEvent.layout.height: 0\n    } as WmPictureState);\n  };\n\n  createShape(shape: string | undefined, imageWidth?: number | string): WmPictureStyles {\n    if (shape) {\n      switch(shape) {\n        case 'circle':\n          return {\n            picture: {\n              borderRadius: isNumber(imageWidth) ? imageWidth / 2 : 4\n            }\n          } as WmPictureStyles;\n        case 'rounded' :\n          return (this.theme.getStyle('rounded-image') as WmPictureStyles);\n        case 'thumbnail' :\n          return (this.theme.getStyle('thumbnail-image') as WmPictureStyles);\n      }\n    }\n    return {} as WmPictureStyles;\n  }\n\n  getElementToShow(props: WmPictureProps, imgSrc: any, shapeStyles: WmPictureStyles) {\n    let elementToshow, source;\n    if (imgSrc && typeof imgSrc === 'object' && typeof imgSrc?.default === 'function') {\n      let imgStyle : any = {};\n      if (props.resizemode === 'contain') {\n        imgStyle['width'] = '100%';\n        imgStyle['height'] = '100%';\n      }\n      elementToshow = React.createElement(imgSrc?.default, imgStyle);\n    //} else if (!isWebPreviewMode() && props.isSvg) {\n    //  svg from uri\n    //  elementToshow = <SvgUri testID={this.getTestId('picture')} width={this.styles.root.width as NumberProp} height={this.styles.root.height as NumberProp} uri={imgSrc}/>;\n    } else if (isFullPathUrl(imgSrc)) {\n      source = {\n        uri: imgSrc\n      };\n    } else {\n      source = imgSrc;\n    }\n    if (this.state.naturalImageWidth || this.state.props.aspectratio) {\n      elementToshow = (\n        // * INFO: if any issue arises like freezing of application because of \n        // * rendering large number of images, check the cache policy.\n        <EXPOImage\n          cachePolicy='memory' \n          {...this.getTestProps('picture')}\n          style={[this.styles.picture, shapeStyles.picture, (props.fastload || this.state.imageWidth) ? {opacity: 1} : {opacity: 0} ]}\n          contentFit={props.resizemode}\n          source={source}\n        />\n      );\n    }\n    return elementToshow;\n  }\n\n  public renderSkeleton(props: WmPictureProps){\n    const imageWidth = this.state.imageWidth;\n    const imageHeight = this.state.imageHeight;\n    const shapeStyles = this.createShape(this.props.shape, imageWidth);\n    const skeletonWidth = this.props.skeletonwidth || this.styles.root?.width || shapeStyles.root?.width || shapeStyles.picture?.width || imageWidth;\n    const skeletonHeight = this.props.skeletonheight || this.styles.root?.height || shapeStyles.root?.height || shapeStyles.picture?.height || imageHeight;\n    return createSkeleton(this.theme, this.styles.skeleton, {\n      ...this.styles.root,\n      borderRadius:  this.props.shape == 'circle' && this.styles.root?.width ? 25 : shapeStyles.picture?.borderRadius || shapeStyles.root?.borderRadius || this.styles.root?.borderRadius || 4,\n      width: skeletonWidth as DimensionValue,\n      height: skeletonHeight as DimensionValue\n    });\n  }\n\n  showImage = (imageElement: any, props: WmPictureProps) => {\n    return imageElement;\n  }\n\n\n    //TODO: remove the re calculation logic later. Keeping it as an extra safety.  \n    calculateBasedOnaspectratio(): {imageWidth: number, imageHeight: number} | null  {\n      if(this.state.props.aspectratio) {\n        if(this.state.originalContainerWidth) {\n          return {\n            imageHeight: this.state.originalContainerWidth / parseFloat(this.state.props.aspectratio as string),\n            imageWidth: this.state.originalContainerWidth\n          }\n        } else if(this.state.originalContainerHeight) {\n          return {\n            imageHeight: this.state.originalContainerHeight, \n            imageWidth: this.state.originalContainerHeight * parseFloat(this.state.props.aspectratio as string),\n          }\n        }\n      }\n      return null\n    }\n    \n    //TODO: remove the re calculation logic later. Keeping it as an extra safety.  \n    calculateBasedOnNaturalDimensions(): {imageWidth: number, imageHeight: number} | null {\n      // No need to calculate width & height if the user already passign them explicitly from props.  \n      const widthAndHeightExistsInProps = this.styles.root.width && this.styles.root.height\n      if(!this.state.props.aspectratio && !widthAndHeightExistsInProps) {\n        if(this.state.originalContainerWidth) {\n          return {\n            imageHeight: this.state.originalContainerWidth * this.state.naturalImageHeight / this.state.naturalImageWidth,\n            imageWidth: this.state.originalContainerWidth\n          }\n        } else if(this.state.originalContainerHeight) {\n          return {\n            imageHeight: this.state.originalContainerHeight, \n            imageWidth: this.state.originalContainerHeight * this.state.naturalImageWidth / this.state.naturalImageHeight\n          }\n        }\n      }\n      return null\n    }\n  \n\n  renderWidget(props: WmPictureProps) {\n    let imageWidth = this.state.imageWidth;\n    let imageHeight = this.state.imageHeight;\n\n\n    //TODO: remove the re calculation logic later. Keeping it as an extra safety.  \n    const aspectDimensions = this.calculateBasedOnaspectratio();\n    const naturalDimensions = this.calculateBasedOnNaturalDimensions();\n    if(aspectDimensions) {\n      const dimensions = aspectDimensions as {imageWidth: number, imageHeight: number}\n      imageWidth = dimensions.imageWidth;\n      imageHeight = dimensions.imageHeight\n    } else if(naturalDimensions) {\n      const dimensions = naturalDimensions as {imageWidth: number, imageHeight: number}\n      imageHeight = dimensions.imageHeight\n      imageWidth = dimensions.imageWidth\n    }\n    const shapeStyles = this.createShape(props.shape, imageWidth);\n    this._pictureSource =  this._pictureSource || this.loadImage(props.picturesource);\n    this._picturePlaceHolder = props.fastload ? \n      (this._pictureSource || this._picturePlaceHolder || this.loadImage(props.pictureplaceholder)) :\n      (this._picturePlaceHolder || this.loadImage(props.pictureplaceholder));\n    const imgSrc: any = this._pictureSource || this._picturePlaceHolder;\n    let elementToshow;\n    if (imgSrc) {\n      elementToshow = this.getElementToShow(props, imgSrc, shapeStyles);\n    }\n    return imgSrc && (this.state.naturalImageWidth || props.isSvg || props.aspectratio) ? (\n      <View \n      style={[{\n        width: imageWidth,\n        height: imageHeight\n      }, this.styles.root, shapeStyles.root, shapeStyles.picture]}\n      onLayout={(event) => this.handleLayout(event)}\n    >\n        {this._background}\n      <View style={[{overflow: 'hidden', width: '100%',\n        height: '100%'}]} onLayout={this.onViewLayoutChange}>\n        <Tappable\n          disableTouchEffect={this.state.props.disabletoucheffect}\n          {...this.getTestPropsForAction()}\n          rippleColor={this.styles.root.rippleColor}\n          target={this} styles={{width: imageWidth ? null : '100%', height: imageHeight ? null : '100%'}}>\n          <Animatedview entryanimation={props.animation} delay={props.animationdelay} style={[{\n                height: imageHeight,\n                width: imageWidth,\n                borderRadius: shapeStyles.picture?.borderRadius\n              }]}\n            accessibilityProps={props.accessible ? {...getAccessibilityProps(AccessibilityWidgetType.PICTURE, props)} : {}}>\n                {this.showImage(elementToshow, props)}\n            </Animatedview>\n          </Tappable>\n        </View>\n      </View>\n    ): null;\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/components/basic/picture/picture.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 { BaseProps } from '@wavemaker/app-rn-runtime/core/base.component';
+export default class WmPictureProps extends BaseProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "animation", null);
+    _defineProperty(this, "animationdelay", null);
+    _defineProperty(this, "picturesource", null);
+    _defineProperty(this, "pictureplaceholder", null);
+    _defineProperty(this, "shape", null);
+    _defineProperty(this, "isSvg", null);
+    _defineProperty(this, "resizemode", 'stretch');
+    _defineProperty(this, "skeletonheight", null);
+    _defineProperty(this, "skeletonwidth", null);
+    _defineProperty(this, "accessible", true);
+    _defineProperty(this, "accessibilitylabel", undefined);
+    _defineProperty(this, "hint", undefined);
+    _defineProperty(this, "accessibilityrole", 'image');
+    _defineProperty(this, "fastload", false);
+    _defineProperty(this, "aspectratio", null);
+  }
+}
+//# sourceMappingURL=picture.props.js.map

package/components/basic/picture/picture.props.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BaseProps","WmPictureProps","constructor","args","_defineProperty","undefined"],"sources":["picture.props.ts"],"sourcesContent":["import { AccessibilityRole, ImageResizeMode } from 'react-native';\nimport { BaseProps } from '@wavemaker/app-rn-runtime/core/base.component';\n\nexport default class WmPictureProps extends BaseProps {\n  animation?: string = null as any;\n  animationdelay?: number = null as any;\n  picturesource?: string = null as any;\n  pictureplaceholder?: string = null as any;\n  shape?: string = null as any;\n  isSvg?: string = null as any;\n  resizemode?: any = 'stretch' as any;\n  skeletonheight?: string = null as any;\n  skeletonwidth?: string = null as any;\n  accessible?: boolean = true;\n  accessibilitylabel?: string = undefined;\n  hint?: string = undefined;\n  accessibilityrole?: AccessibilityRole = 'image';\n  fastload?: boolean = false;\n  aspectratio?: string | number | null = null;\n}\n"],"mappings":";;;AACA,SAASA,SAAS,QAAQ,+CAA+C;AAEzE,eAAe,MAAMC,cAAc,SAASD,SAAS,CAAC;EAAAE,YAAA,GAAAC,IAAA;IAAA,SAAAA,IAAA;IAAAC,eAAA,oBAC/B,IAAI;IAAAA,eAAA,yBACC,IAAI;IAAAA,eAAA,wBACL,IAAI;IAAAA,eAAA,6BACC,IAAI;IAAAA,eAAA,gBACjB,IAAI;IAAAA,eAAA,gBACJ,IAAI;IAAAA,eAAA,qBACF,SAAS;IAAAA,eAAA,yBACF,IAAI;IAAAA,eAAA,wBACL,IAAI;IAAAA,eAAA,qBACN,IAAI;IAAAA,eAAA,6BACGC,SAAS;IAAAD,eAAA,eACvBC,SAAS;IAAAD,eAAA,4BACe,OAAO;IAAAA,eAAA,mBAC1B,KAAK;IAAAA,eAAA,sBACa,IAAI;EAAA;AAC7C","ignoreList":[]}

package/components/basic/picture/picture.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","overflow","width","rippleColor","transparent","text","picture","height","skeleton","borderRadius","backgroundColor","pictureThumbBgColor","borderWidth","borderStyle","borderColor","pictureThumbBorderColor","paddingTop","paddingBottom","paddingLeft","paddingRight"],"sources":["picture.styles.ts"],"sourcesContent":["import { ImageStyle, ViewStyle } from 'react-native';\nimport BASE_THEME  from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { WmSkeletonStyles } from '../skeleton/skeleton.styles';\n\nexport type WmPictureStyles = BaseStyles & {\n  picture: ImageStyle & ViewStyle,\n  skeleton: WmSkeletonStyles\n};\n\nexport const DEFAULT_CLASS = 'app-picture';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n  const defaultStyles: WmPictureStyles = defineStyles({\n    root: {\n      overflow: 'hidden',\n      width: 270,\n      rippleColor: themeVariables.transparent\n    },\n    text: {},\n    picture: {\n      width: '100%',\n      height: '100%'\n    },\n    skeleton: {\n      root: {\n        width: '100%',\n        height: 128\n      }\n    } as any as WmSkeletonStyles\n  });\n\n  addStyle(DEFAULT_CLASS, '', defaultStyles);\n  addStyle('rounded-image', '', {\n    picture: {\n      borderRadius: 6\n    }\n  } as WmPictureStyles);\n  addStyle('thumbnail-image', '', {\n    root: {\n      backgroundColor: themeVariables.pictureThumbBgColor,\n      borderWidth: 1,\n      borderStyle: 'solid',\n      borderColor: themeVariables.pictureThumbBorderColor,\n      borderRadius: 6,\n      paddingTop: 8,\n      paddingBottom: 8,\n      paddingLeft: 8,\n      paddingRight: 8\n    }\n  } as WmPictureStyles);\n});\n"],"mappings":"AACA,OAAOA,UAAU,MAAO,wCAAwC;AAChE,SAAqBC,YAAY,QAAQ,+CAA+C;AAQxF,OAAO,MAAMC,aAAa,GAAG,aAAa;AAC1CF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACrD,MAAMC,aAA8B,GAAGL,YAAY,CAAC;IAClDM,IAAI,EAAE;MACJC,QAAQ,EAAE,QAAQ;MAClBC,KAAK,EAAE,GAAG;MACVC,WAAW,EAAEN,cAAc,CAACO;IAC9B,CAAC;IACDC,IAAI,EAAE,CAAC,CAAC;IACRC,OAAO,EAAE;MACPJ,KAAK,EAAE,MAAM;MACbK,MAAM,EAAE;IACV,CAAC;IACDC,QAAQ,EAAE;MACRR,IAAI,EAAE;QACJE,KAAK,EAAE,MAAM;QACbK,MAAM,EAAE;MACV;IACF;EACF,CAAC,CAAC;EAEFT,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;EAC1CD,QAAQ,CAAC,eAAe,EAAE,EAAE,EAAE;IAC5BQ,OAAO,EAAE;MACPG,YAAY,EAAE;IAChB;EACF,CAAoB,CAAC;EACrBX,QAAQ,CAAC,iBAAiB,EAAE,EAAE,EAAE;IAC9BE,IAAI,EAAE;MACJU,eAAe,EAAEb,cAAc,CAACc,mBAAmB;MACnDC,WAAW,EAAE,CAAC;MACdC,WAAW,EAAE,OAAO;MACpBC,WAAW,EAAEjB,cAAc,CAACkB,uBAAuB;MACnDN,YAAY,EAAE,CAAC;MACfO,UAAU,EAAE,CAAC;MACbC,aAAa,EAAE,CAAC;MAChBC,WAAW,EAAE,CAAC;MACdC,YAAY,EAAE;IAChB;EACF,CAAoB,CAAC;AACvB,CAAC,CAAC","ignoreList":[]}

package/components/basic/progress-bar/progress-bar.component.js

@@ -0,0 +1,96 @@
+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 } from 'react-native';
+import { ProgressBar } from 'react-native-paper';
+import { LinearGradient as ExpoLinearGradient } from 'expo-linear-gradient';
+import { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';
+import { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';
+import { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker/app-rn-runtime/core/accessibility';
+import WmProgressBarProps from './progress-bar.props';
+import { DEFAULT_CLASS } from './progress-bar.styles';
+import { parseProgressBarLinearGradient } from '@wavemaker/app-rn-runtime/core/utils';
+import WmTooltip from '../tooltip/tooltip.component';
+export class WmProgressBarState extends BaseComponentState {}
+export default class WmProgressBar extends BaseComponent {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmProgressBarProps());
+    _defineProperty(this, "onTooltiptext", (minValue, maxValue, percentage) => {
+      if (this.props.showtooltip && this.props.onTooltiptext) {
+        const result = this.invokeEventCallback('onTooltiptext', [undefined, this.proxy, minValue, maxValue, percentage]);
+        if (result) {
+          return result;
+        }
+      }
+
+      // Default fallback to percentage display
+      return `${percentage}%`;
+    });
+  }
+  renderWidget(props) {
+    var _styles$root, _styles$progressBar;
+    let value = (props.datavalue - props.minvalue) / (props.maxvalue - props.minvalue);
+    const styles = this.theme.mergeStyle(this.theme.getStyle(`app-${props.type}-progress-bar`), this.styles);
+    const {
+      hasLinearGradient,
+      color1,
+      color2,
+      start,
+      end
+    } = parseProgressBarLinearGradient(styles === null || styles === void 0 || (_styles$root = styles.root) === null || _styles$root === void 0 || (_styles$root = _styles$root.progressBar) === null || _styles$root === void 0 ? void 0 : _styles$root.backgroundColor);
+    const gradientColors = [color1, color2];
+    const valuePercent = `${Math.round(value * 100)}%`;
+    const percentage = Math.round(value * 100);
+    const progressValue = Math.min(Math.max(value, 0), 1); // Ensure value is between 0 and 1
+    const progressWidth = progressValue * 100;
+    return /*#__PURE__*/React.createElement(View, {
+      style: styles.root,
+      onLayout: event => this.handleLayout(event)
+    }, this._background, /*#__PURE__*/React.createElement(Tappable, {
+      target: this,
+      styles: {
+        root: {
+          width: '100%',
+          height: '100%'
+        }
+      },
+      disableTouchEffect: this.state.props.disabletoucheffect
+    }, /*#__PURE__*/React.createElement(ProgressBar, _extends({}, this.getTestPropsForAction('progressbar'), getAccessibilityProps(AccessibilityWidgetType.PROGRESSBAR, props), {
+      animatedValue: value,
+      color: styles.progressValue.color,
+      style: [styles.progressBar, {
+        height: styles.root.height || styles.progressBar.height
+      }]
+    })), hasLinearGradient ? /*#__PURE__*/React.createElement(ExpoLinearGradient, {
+      colors: gradientColors,
+      start: start,
+      end: end,
+      style: [{
+        width: valuePercent,
+        height: styles.root.height || styles.progressBar.height,
+        position: 'absolute',
+        borderRadius: (styles === null || styles === void 0 || (_styles$progressBar = styles.progressBar) === null || _styles$progressBar === void 0 ? void 0 : _styles$progressBar.borderRadius) || 0
+      }]
+    }) : /*#__PURE__*/React.createElement(React.Fragment, null), props.showtooltip ? /*#__PURE__*/React.createElement(View, {
+      style: {
+        position: 'absolute',
+        left: `${progressWidth}%`,
+        bottom: 0,
+        height: '100%',
+        justifyContent: 'center',
+        alignItems: 'center',
+        zIndex: 10
+      }
+    }, /*#__PURE__*/React.createElement(WmTooltip, {
+      showTooltip: props.showtooltip,
+      text: this.onTooltiptext(props.minvalue, props.maxvalue, percentage),
+      direction: props.tooltipposition,
+      tooltipStyle: styles.tooltip,
+      tooltipLabelStyle: styles.tooltipLabel,
+      tooltipTriangleStyle: styles.tooltipTriangle
+    })) : /*#__PURE__*/React.createElement(React.Fragment, null)));
+  }
+}
+//# sourceMappingURL=progress-bar.component.js.map

package/components/basic/progress-bar/progress-bar.component.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","ProgressBar","LinearGradient","ExpoLinearGradient","Tappable","BaseComponent","BaseComponentState","AccessibilityWidgetType","getAccessibilityProps","WmProgressBarProps","DEFAULT_CLASS","parseProgressBarLinearGradient","WmTooltip","WmProgressBarState","WmProgressBar","constructor","props","_defineProperty","minValue","maxValue","percentage","showtooltip","onTooltiptext","result","invokeEventCallback","undefined","proxy","renderWidget","_styles$root","_styles$progressBar","value","datavalue","minvalue","maxvalue","styles","theme","mergeStyle","getStyle","type","hasLinearGradient","color1","color2","start","end","root","progressBar","backgroundColor","gradientColors","valuePercent","Math","round","progressValue","min","max","progressWidth","createElement","style","onLayout","event","handleLayout","_background","target","width","height","disableTouchEffect","state","disabletoucheffect","_extends","getTestPropsForAction","PROGRESSBAR","animatedValue","color","colors","position","borderRadius","Fragment","left","bottom","justifyContent","alignItems","zIndex","showTooltip","text","direction","tooltipposition","tooltipStyle","tooltip","tooltipLabelStyle","tooltipLabel","tooltipTriangleStyle","tooltipTriangle"],"sources":["progress-bar.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { ProgressBar } from 'react-native-paper';\nimport { LinearGradient as ExpoLinearGradient } from 'expo-linear-gradient';\nimport { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker/app-rn-runtime/core/accessibility';\n\nimport WmProgressBarProps from './progress-bar.props';\nimport { DEFAULT_CLASS, WmProgressBarStyles } from './progress-bar.styles';\nimport { parseProgressBarLinearGradient } from '@wavemaker/app-rn-runtime/core/utils';\nimport WmTooltip from '../tooltip/tooltip.component';\n\nexport class WmProgressBarState extends BaseComponentState<WmProgressBarProps> {}\n\nexport default class WmProgressBar extends BaseComponent<WmProgressBarProps, WmProgressBarState, WmProgressBarStyles> {\n\n  constructor(props: WmProgressBarProps) {\n    super(props, DEFAULT_CLASS, new WmProgressBarProps());\n  }\n\n  onTooltiptext = (minValue: number, maxValue: number, percentage: number) => {\n    if (this.props.showtooltip && this.props.onTooltiptext) {\n      const result = this.invokeEventCallback('onTooltiptext', [\n        undefined,\n        this.proxy,\n        minValue,\n        maxValue,\n        percentage\n      ]);\n\n      if (result) {\n        return result;\n      }\n    }\n\n    // Default fallback to percentage display\n    return `${percentage}%`;\n  }\n\n  renderWidget(props: WmProgressBarProps) {\n    let value = (props.datavalue - props.minvalue) / (props.maxvalue - props.minvalue);\n    const styles = this.theme.mergeStyle(this.theme.getStyle(`app-${props.type}-progress-bar`), this.styles);\n    const {hasLinearGradient, color1, color2, start, end} = parseProgressBarLinearGradient(styles?.root?.progressBar?.backgroundColor as string);\n    const gradientColors: [string, string, ...string[]] = [color1, color2];\n    const valuePercent = `${Math.round(value * 100)}%`;\n    const percentage = Math.round(value * 100);\n    const progressValue = Math.min(Math.max(value, 0), 1); // Ensure value is between 0 and 1\n    const progressWidth = progressValue * 100;\n\n    return (\n    <View \n      style={styles.root}\n      onLayout={(event) => this.handleLayout(event)}\n    >\n      {this._background}\n      <Tappable target={this} styles={{root:{width: '100%', height: '100%'}}} disableTouchEffect={this.state.props.disabletoucheffect}>\n        <ProgressBar\n          {...this.getTestPropsForAction('progressbar')}\n          {...getAccessibilityProps(AccessibilityWidgetType.PROGRESSBAR, props)}\n          animatedValue={value}\n          color={styles.progressValue.color}\n          style={[styles.progressBar, {height: styles.root.height || styles.progressBar.height}]}\n        />\n        \n        {/* Linear Gradient for filled portion */}\n        {hasLinearGradient ? (\n          <ExpoLinearGradient\n            colors={gradientColors}\n            start={start}\n            end={end}\n            style={[\n              {\n                width: valuePercent as any,\n                height: styles.root.height || styles.progressBar.height,\n                position: 'absolute',\n                borderRadius: styles?.progressBar?.borderRadius || 0,\n              },\n            ]}\n          />\n        ) : (\n          <></>\n        )}\n        \n        {/* Tooltip positioned at progress value */}\n        {props.showtooltip ?\n          (\n            <View\n              style={{\n                position: 'absolute',\n                left: `${progressWidth}%`,\n                bottom: 0,\n                height: '100%',\n                justifyContent: 'center',\n                alignItems: 'center',\n                zIndex: 10,\n              }}\n            >\n              <WmTooltip\n                showTooltip={props.showtooltip}\n                text={this.onTooltiptext(props.minvalue, props.maxvalue, percentage)}\n                direction={props.tooltipposition}\n                tooltipStyle={styles.tooltip}\n                tooltipLabelStyle={styles.tooltipLabel}\n                tooltipTriangleStyle={styles.tooltipTriangle}\n              />\n            </View>\n          ) : <></>}\n      </Tappable>\n    </View>); \n  }\n}"],"mappings":"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","ignoreList":[]}

package/components/basic/progress-bar/progress-bar.props.js

@@ -0,0 +1,19 @@
+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/app-rn-runtime/core/base.component';
+export default class WmProgressBarProps extends BaseProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "type", 'default');
+    _defineProperty(this, "datavalue", 30);
+    _defineProperty(this, "minvalue", 0);
+    _defineProperty(this, "maxvalue", 100);
+    _defineProperty(this, "accessibilitylabel", undefined);
+    _defineProperty(this, "accessibilityrole", 'progressbar');
+    _defineProperty(this, "showtooltip", false);
+    _defineProperty(this, "tooltipposition", 'up');
+    _defineProperty(this, "onTooltiptext", null);
+  }
+}
+//# sourceMappingURL=progress-bar.props.js.map

package/components/basic/progress-bar/progress-bar.props.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BaseProps","WmProgressBarProps","constructor","args","_defineProperty","undefined"],"sources":["progress-bar.props.ts"],"sourcesContent":["import { BaseProps } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { AccessibilityRole } from 'react-native';\nexport default class WmProgressBarProps extends BaseProps {\n  type: 'default' | 'success' | 'info' | 'warning' | 'error' = 'default';\n  datavalue: number = 30;\n  minvalue: number = 0;\n  maxvalue: number = 100;\n  accessibilitylabel?: string = undefined;\n  accessibilityrole?: AccessibilityRole = 'progressbar';\n  showtooltip?: boolean = false;\n  tooltipposition?: 'up' | 'down' | 'left' | 'right' = 'up';\n  onTooltiptext?: Function | null = null;\n}"],"mappings":";;;AAAA,SAASA,SAAS,QAAQ,+CAA+C;AAEzE,eAAe,MAAMC,kBAAkB,SAASD,SAAS,CAAC;EAAAE,YAAA,GAAAC,IAAA;IAAA,SAAAA,IAAA;IAAAC,eAAA,eACK,SAAS;IAAAA,eAAA,oBAClD,EAAE;IAAAA,eAAA,mBACH,CAAC;IAAAA,eAAA,mBACD,GAAG;IAAAA,eAAA,6BACQC,SAAS;IAAAD,eAAA,4BACC,aAAa;IAAAA,eAAA,sBAC7B,KAAK;IAAAA,eAAA,0BACwB,IAAI;IAAAA,eAAA,wBACvB,IAAI;EAAA;AACxC","ignoreList":[]}

package/components/basic/progress-bar/progress-bar.styles.js

@@ -0,0 +1,45 @@
+import Color from 'color';
+import BASE_THEME from '@wavemaker/app-rn-runtime/styles/theme';
+import { defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';
+export const DEFAULT_CLASS = 'app-progress-bar';
+BASE_THEME.registerStyle((themeVariables, addStyle) => {
+  const defaultStyles = defineStyles({
+    root: {},
+    text: {},
+    progressBar: {
+      height: 4
+    },
+    progressValue: {},
+    tooltip: {
+      backgroundColor: themeVariables.tooltipBgColor,
+      paddingHorizontal: 8,
+      paddingVertical: 4,
+      borderRadius: 4
+    },
+    tooltipLabel: {
+      color: themeVariables.defaultColor,
+      fontSize: 12
+    },
+    tooltipTriangle: {
+      borderBottomColor: themeVariables.tooltipBgColor
+    }
+  });
+  const getStyle = color => ({
+    progressBar: {
+      backgroundColor: Color(color).alpha(0.2).rgb().toString()
+    },
+    progressValue: {
+      color: color
+    },
+    tooltip: {},
+    tooltipLabel: {},
+    tooltipTriangle: {}
+  });
+  addStyle(DEFAULT_CLASS, '', defaultStyles);
+  addStyle('app-default-progress-bar', '', getStyle(themeVariables.progressBarDefaultColor));
+  addStyle('app-success-progress-bar', '', getStyle(themeVariables.progressBarSuccessColor));
+  addStyle('app-info-progress-bar', '', getStyle(themeVariables.progressBarInfoColor));
+  addStyle('app-danger-progress-bar', '', getStyle(themeVariables.progressBarDangerColor));
+  addStyle('app-warning-progress-bar', '', getStyle(themeVariables.progressBarWarningColor));
+});
+//# sourceMappingURL=progress-bar.styles.js.map

package/components/basic/progress-bar/progress-bar.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Color","BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","text","progressBar","height","progressValue","tooltip","backgroundColor","tooltipBgColor","paddingHorizontal","paddingVertical","borderRadius","tooltipLabel","color","defaultColor","fontSize","tooltipTriangle","borderBottomColor","getStyle","alpha","rgb","toString","progressBarDefaultColor","progressBarSuccessColor","progressBarInfoColor","progressBarDangerColor","progressBarWarningColor"],"sources":["progress-bar.styles.ts"],"sourcesContent":["import Color from 'color';\nimport BASE_THEME, { AllStyle } from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { Platform } from 'react-native';\n\nexport type WmProgressBarStyles = BaseStyles & {\n    progressBar: AllStyle,\n    progressValue: AllStyle,\n    tooltip: AllStyle,\n    tooltipLabel: AllStyle,\n    tooltipTriangle: AllStyle\n};\n\nexport const DEFAULT_CLASS = 'app-progress-bar';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n    const defaultStyles: WmProgressBarStyles = defineStyles({\n        root: {},\n        text: {},\n        progressBar: {\n            height: 4\n        },\n        progressValue: {},\n        tooltip: {\n            backgroundColor: themeVariables.tooltipBgColor,\n            paddingHorizontal: 8,\n            paddingVertical: 4,\n            borderRadius: 4\n        },\n        tooltipLabel: {\n            color: themeVariables.defaultColor,\n            fontSize: 12\n        },\n        tooltipTriangle: {\n            borderBottomColor: themeVariables.tooltipBgColor\n        }\n    });\n\n    const getStyle = (color: string) => ({\n        progressBar: {\n            backgroundColor: Color(color).alpha(0.2).rgb().toString()\n        },\n        progressValue: {\n            color: color\n        },\n        tooltip: {},\n        tooltipLabel: {},\n        tooltipTriangle: {}\n    } as WmProgressBarStyles);\n\n    addStyle(DEFAULT_CLASS, '', defaultStyles);\n    addStyle('app-default-progress-bar', '', getStyle(themeVariables.progressBarDefaultColor));\n    addStyle('app-success-progress-bar', '', getStyle(themeVariables.progressBarSuccessColor));\n    addStyle('app-info-progress-bar', '', getStyle(themeVariables.progressBarInfoColor));\n    addStyle('app-danger-progress-bar', '', getStyle(themeVariables.progressBarDangerColor));\n    addStyle('app-warning-progress-bar', '', getStyle(themeVariables.progressBarWarningColor));\n});"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAoB,wCAAwC;AAC7E,SAAqBC,YAAY,QAAQ,+CAA+C;AAWxF,OAAO,MAAMC,aAAa,GAAG,kBAAkB;AAC/CF,UAAU,CAACG,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACnD,MAAMC,aAAkC,GAAGL,YAAY,CAAC;IACpDM,IAAI,EAAE,CAAC,CAAC;IACRC,IAAI,EAAE,CAAC,CAAC;IACRC,WAAW,EAAE;MACTC,MAAM,EAAE;IACZ,CAAC;IACDC,aAAa,EAAE,CAAC,CAAC;IACjBC,OAAO,EAAE;MACLC,eAAe,EAAET,cAAc,CAACU,cAAc;MAC9CC,iBAAiB,EAAE,CAAC;MACpBC,eAAe,EAAE,CAAC;MAClBC,YAAY,EAAE;IAClB,CAAC;IACDC,YAAY,EAAE;MACVC,KAAK,EAAEf,cAAc,CAACgB,YAAY;MAClCC,QAAQ,EAAE;IACd,CAAC;IACDC,eAAe,EAAE;MACbC,iBAAiB,EAAEnB,cAAc,CAACU;IACtC;EACJ,CAAC,CAAC;EAEF,MAAMU,QAAQ,GAAIL,KAAa,KAAM;IACjCV,WAAW,EAAE;MACTI,eAAe,EAAEd,KAAK,CAACoB,KAAK,CAAC,CAACM,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC,CAACC,QAAQ,CAAC;IAC5D,CAAC;IACDhB,aAAa,EAAE;MACXQ,KAAK,EAAEA;IACX,CAAC;IACDP,OAAO,EAAE,CAAC,CAAC;IACXM,YAAY,EAAE,CAAC,CAAC;IAChBI,eAAe,EAAE,CAAC;EACtB,CAAC,CAAwB;EAEzBjB,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;EAC1CD,QAAQ,CAAC,0BAA0B,EAAE,EAAE,EAAEmB,QAAQ,CAACpB,cAAc,CAACwB,uBAAuB,CAAC,CAAC;EAC1FvB,QAAQ,CAAC,0BAA0B,EAAE,EAAE,EAAEmB,QAAQ,CAACpB,cAAc,CAACyB,uBAAuB,CAAC,CAAC;EAC1FxB,QAAQ,CAAC,uBAAuB,EAAE,EAAE,EAAEmB,QAAQ,CAACpB,cAAc,CAAC0B,oBAAoB,CAAC,CAAC;EACpFzB,QAAQ,CAAC,yBAAyB,EAAE,EAAE,EAAEmB,QAAQ,CAACpB,cAAc,CAAC2B,sBAAsB,CAAC,CAAC;EACxF1B,QAAQ,CAAC,0BAA0B,EAAE,EAAE,EAAEmB,QAAQ,CAACpB,cAAc,CAAC4B,uBAAuB,CAAC,CAAC;AAC9F,CAAC,CAAC","ignoreList":[]}