@wavemaker/app-rn-runtime 12.0.0-next.141219 → 12.0.0-next.141221

package/components/basic/button/button.component.js

@@ -0,0 +1,113 @@
+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); }
+import React from 'react';
+import { Text, View } from 'react-native';
+import { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';
+import { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';
+import { Badge } from 'react-native-paper';
+import WmButtonProps from './button.props';
+import { DEFAULT_CLASS } from './button.styles';
+import WmIcon from '@wavemaker/app-rn-runtime/components/basic/icon/icon.component';
+import { Animatedview } from '@wavemaker/app-rn-runtime/components/basic/animatedview.component';
+import { createSkeleton } from '../skeleton/skeleton.component';
+import { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker/app-rn-runtime/core/accessibility';
+export class WmButtonState extends BaseComponentState {}
+export default class WmButton extends BaseComponent {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmButtonProps());
+  }
+  prepareIcon({
+    iconclass,
+    iconurl,
+    hint,
+    name,
+    iconsize,
+    iconheight,
+    iconmargin,
+    iconwidth
+  }) {
+    return iconclass || iconurl ? /*#__PURE__*/React.createElement(WmIcon, {
+      id: this.getTestId('icon'),
+      hint: hint,
+      styles: this.styles.icon,
+      name: `${name}_icon`,
+      iconclass: iconclass,
+      iconsize: iconsize,
+      iconurl: iconurl,
+      iconheight: iconheight,
+      iconmargin: iconmargin,
+      iconwidth: iconwidth
+    }) : null;
+  }
+  prepareBadge(props) {
+    //@ts-ignore
+    return /*#__PURE__*/React.createElement(Badge, _extends({
+      style: this.styles.badge
+    }, this.getTestProps('badge')), props.badgevalue);
+  }
+  renderSkeleton(prop) {
+    let skeletonWidth, skeletonHeight;
+    if (this.props.skeletonwidth == "0") {
+      skeletonWidth = 0;
+    } else {
+      var _this$styles$root;
+      skeletonWidth = this.props.skeletonwidth || ((_this$styles$root = this.styles.root) === null || _this$styles$root === void 0 ? void 0 : _this$styles$root.width);
+    }
+    if (this.props.skeletonheight == "0") {
+      skeletonHeight = 0;
+    } else {
+      var _this$styles$root2;
+      skeletonHeight = this.props.skeletonheight || ((_this$styles$root2 = this.styles.root) === null || _this$styles$root2 === void 0 ? void 0 : _this$styles$root2.height);
+    }
+    return createSkeleton(this.theme, this.styles.skeleton, {
+      ...this.styles.root,
+      width: skeletonWidth,
+      height: skeletonHeight
+    });
+  }
+  renderWidget(props) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Animatedview, {
+      entryanimation: props.animation,
+      delay: props.animationdelay,
+      style: [this.styles.root, {
+        paddingTop: 0,
+        paddingBottom: 0,
+        paddingLeft: 0,
+        paddingRight: 0,
+        overflow: 'hidden',
+        flexDirection: 'column'
+      }, this.styles.root.height == "100%" ? {
+        flex: 1
+      } : {}]
+      // accessibilityProps={{...getAccessibilityProps(
+      //   AccessibilityWidgetType.BUTTON,
+      //   props
+      // )}}
+    }, this._background, /*#__PURE__*/React.createElement(Tappable, _extends({
+      styles: {
+        paddingTop: this.styles.root.paddingTop,
+        paddingBottom: this.styles.root.paddingBottom,
+        paddingLeft: this.styles.root.paddingLeft,
+        paddingRight: this.styles.root.paddingRight,
+        width: '100%',
+        height: this.styles.root.height ? '100%' : null,
+        justifyContent: 'center'
+      },
+      rippleColor: this.styles.root.rippleColor,
+      target: this
+    }, this.getTestPropsForAction(), {
+      accessibilityProps: {
+        ...getAccessibilityProps(AccessibilityWidgetType.BUTTON, props)
+      }
+    }), /*#__PURE__*/React.createElement(View, {
+      style: [this.styles.content, {
+        flexDirection: props.iconposition === 'top' ? 'column' : 'row'
+      }]
+    }, props.iconposition === 'top' && this.prepareIcon(props), props.iconposition === 'left' && this.prepareIcon(props), props.caption ? /*#__PURE__*/React.createElement(Text, _extends({
+      style: this.styles.text
+    }, this.getTestPropsForLabel('caption'), {
+      importantForAccessibility: 'no'
+      // accessibilityLabel={`${props.caption}`}
+    }), props.caption) : null, props.iconposition === 'right' && this.prepareIcon(props)))), props.badgevalue && this.prepareBadge(props));
+  }
+}
+//# sourceMappingURL=button.component.js.map

package/components/basic/button/button.props.js

@@ -0,0 +1,27 @@
+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 WmButtonProps extends BaseProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "animation", null);
+    _defineProperty(this, "animationdelay", null);
+    _defineProperty(this, "caption", null);
+    _defineProperty(this, "badgevalue", null);
+    _defineProperty(this, "iconclass", null);
+    _defineProperty(this, "iconposition", 'left');
+    _defineProperty(this, "onTap", null);
+    _defineProperty(this, "iconsize", 0);
+    _defineProperty(this, "skeletonheight", null);
+    _defineProperty(this, "skeletonwidth", null);
+    _defineProperty(this, "iconurl", null);
+    _defineProperty(this, "iconheight", null);
+    _defineProperty(this, "iconwidth", null);
+    _defineProperty(this, "iconmargin", null);
+    _defineProperty(this, "accessibilitylabel", undefined);
+    _defineProperty(this, "hint", undefined);
+    _defineProperty(this, "accessibilityrole", "button");
+  }
+}
+//# sourceMappingURL=button.props.js.map

package/components/basic/buttongroup/buttongroup.props.js

@@ -0,0 +1,14 @@
+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 WmButtongroupProps extends BaseProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "children", void 0);
+    _defineProperty(this, "vertical", null);
+    _defineProperty(this, "skeletonheight", null);
+    _defineProperty(this, "skeletonwidth", null);
+  }
+}
+//# sourceMappingURL=buttongroup.props.js.map

package/components/basic/custom/custom.props.js

@@ -0,0 +1,16 @@
+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 WmCustomProps extends BaseProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "renderview", () => {
+      return null;
+    });
+    _defineProperty(this, "children", null);
+    _defineProperty(this, "skeletonheight", null);
+    _defineProperty(this, "skeletonwidth", null);
+  }
+}
+//# sourceMappingURL=custom.props.js.map

package/components/basic/icon/icon.component.js

@@ -0,0 +1,266 @@
+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 { Animated, Easing, Text, Image, View } from 'react-native';
+import { FontAwesome } from '@expo/vector-icons';
+import { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';
+import { isFullPathUrl } from '@wavemaker/app-rn-runtime/core/utils';
+import { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker/app-rn-runtime/core/accessibility';
+import WmIconProps from './icon.props';
+import { DEFAULT_CLASS } from './icon.styles';
+import WavIcon from './wavicon/wavicon.component';
+import StreamlineLightIcon from './streamline-light-icon/streamline-light-icon.component';
+import StreamlineRegularIcon from './streamline-regular-icon/streamline-regular-icon.component';
+import { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';
+import { Animatedview } from '@wavemaker/app-rn-runtime/components/basic/animatedview.component';
+import { createSkeleton } from '../skeleton/skeleton.component';
+const ICON_SIZES = new Map([['fa-lg', 24], ['fa-2x', 36], ['fa-3x', 48], ['fa-4x', 60], ['fa-5x', 72]]);
+const ICON_ROTATTION = new Map([['fa-rotate-90', '90deg'], ['fa-rotate-180', '180deg'], ['fa-rotate-270', '270deg']]);
+export class WmIconState extends BaseComponentState {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "iconDef", {});
+  }
+}
+export default class WmIcon extends BaseComponent {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmIconProps());
+    _defineProperty(this, "spinValue", new Animated.Value(0));
+    _defineProperty(this, "pulseValue", new Animated.Value(0));
+    _defineProperty(this, "stopAnimation", true);
+    _defineProperty(this, "_iconSource", null);
+  }
+  getIconDef(iconClass) {
+    const iconDef = {
+      rotate: '0'
+    };
+    const splits = iconClass.split(' ');
+    iconDef.isFontAwesome = !!splits.find(v => v === 'fa');
+    iconDef.isStreamlineLightIcon = !!splits.find(v => v === 'wm-sl-l');
+    iconDef.isStreamlineRegularIcon = !!splits.find(v => v === 'wm-sl-r');
+    if (iconDef.isFontAwesome) {
+      var _splits$find;
+      iconDef.type = ((_splits$find = splits.find(v => v.startsWith('fa-'))) === null || _splits$find === void 0 ? void 0 : _splits$find.substring(3)) || '';
+    } else if (iconDef.isStreamlineLightIcon) {
+      var _splits$find2;
+      iconDef.type = ((_splits$find2 = splits.find(v => v.startsWith('sl-'))) === null || _splits$find2 === void 0 ? void 0 : _splits$find2.substring(3)) || '';
+    } else if (iconDef.isStreamlineRegularIcon) {
+      var _splits$find3;
+      iconDef.type = ((_splits$find3 = splits.find(v => v.startsWith('sl-'))) === null || _splits$find3 === void 0 ? void 0 : _splits$find3.substring(3)) || '';
+    } else {
+      var _splits$find4;
+      iconDef.isWavIcon = !iconDef.isFontAwesome && !!splits.find(v => v === 'wi');
+      iconDef.type = iconDef.isWavIcon && ((_splits$find4 = splits.find(v => v.startsWith('wi-'))) === null || _splits$find4 === void 0 ? void 0 : _splits$find4.substring(3)) || '';
+    }
+    if (iconClass.indexOf('fa-spin') >= 0) {
+      iconDef.animation = 'spin';
+    } else if (iconClass.indexOf('fa-pulse') >= 0) {
+      iconDef.animation = 'pulse';
+    }
+    iconDef.size = splits.map(v => ICON_SIZES.get(v)).find(v => !!v) || 12;
+    iconDef.rotate = splits.map(v => ICON_ROTATTION.get(v)).find(v => !!v) || '0deg';
+    return iconDef;
+  }
+  spin() {
+    if (this.stopAnimation) {
+      return;
+    }
+    this.spinValue.setValue(0);
+    Animated.timing(this.spinValue, {
+      toValue: 1,
+      duration: 1000,
+      easing: Easing.linear,
+      useNativeDriver: true
+    }).start(() => this.spin());
+  }
+  componentDidMount() {
+    super.componentDidMount();
+    this.spin();
+  }
+  componentWillUnmount() {
+    super.componentWillUnmount();
+    this.stopAnimation = true;
+  }
+  onPropertyChange(name, $new, $old) {
+    super.onPropertyChange(name, $new, $old);
+    switch (name) {
+      case 'iconclass':
+        $new && this.updateState({
+          iconDef: this.getIconDef($new)
+        });
+        break;
+    }
+  }
+  getCustomIcon(props, style) {
+    var _this$theme$getStyle;
+    const customIcon = this.theme.mergeStyle({}, ((_this$theme$getStyle = this.theme.getStyle((props === null || props === void 0 ? void 0 : props.iconclass) || '')) === null || _this$theme$getStyle === void 0 ? void 0 : _this$theme$getStyle.icon) || this.styles.icon);
+    const customIconContent = customIcon === null || customIcon === void 0 ? void 0 : customIcon.content;
+    if (customIconContent) {
+      delete customIcon.content;
+      return /*#__PURE__*/React.createElement(Text, {
+        style: [style, customIcon.fontFamily ? {
+          fontFamily: customIcon.fontFamily
+        } : null]
+      }, decodeURIComponent(customIconContent));
+    }
+    return null;
+  }
+  renderSkeleton(props) {
+    let skeletonWidth = this.props.skeletonwidth || this.props.iconsize || this.styles.root.width;
+    let skeletonHeight = this.props.skeletonheight || this.props.iconsize || this.styles.root.height;
+    if (this.props.skeletonheight == "0") {
+      skeletonWidth = 0;
+    }
+    if (this.props.skeletonheight == "0") {
+      skeletonHeight = 0;
+    }
+    return createSkeleton(this.theme, this.styles.skeleton, {
+      ...this.styles.root,
+      width: skeletonWidth,
+      height: skeletonHeight
+    });
+  }
+  getElementToShow(props, iconSrc) {
+    const {
+      iconmargin,
+      iconheight,
+      iconwidth
+    } = props;
+    let width, height;
+    let elementToshow, source;
+    if (iconwidth) width = iconwidth;else if (iconheight) width = iconheight;else width = 12;
+    if (iconheight) height = iconheight;else if (iconwidth) height = iconwidth;else height = 12;
+    if (isFullPathUrl(iconSrc)) {
+      source = {
+        uri: iconSrc
+      };
+    } else {
+      source = iconSrc;
+    }
+    elementToshow = /*#__PURE__*/React.createElement(Image, {
+      testID: this.getTestId('icon'),
+      style: {
+        margin: iconmargin !== null && iconmargin !== void 0 ? iconmargin : 0,
+        height: height,
+        width: width
+      },
+      source: source
+    });
+    return elementToshow;
+  }
+  loadIcon(iconImage) {
+    if (!iconImage || !this.loadAsset) {
+      return null;
+    }
+    const iconImageSrc = this.loadAsset(iconImage);
+    if (iconImageSrc && typeof iconImageSrc !== 'function') {
+      return iconImageSrc;
+    }
+    return null;
+  }
+  renderIcon(props) {
+    let iconJsx = null;
+    this._iconSource = this._iconSource || this.loadIcon(props.iconurl);
+    const iconSrc = this._iconSource;
+    if (iconSrc) {
+      return this.getElementToShow(props, iconSrc);
+    }
+    const iconDef = this.state.iconDef;
+    if (!iconDef) {
+      return null;
+    }
+    const {
+      root,
+      text,
+      icon
+    } = this.styles;
+    const style = [{
+      color: root.color || text.color
+    }, icon, {
+      transform: [{
+        rotate: iconDef.rotate
+      }]
+    }];
+    const customIcon = this.getCustomIcon(props, style);
+    const iconSize = props.iconsize || this.styles.root.fontSize || this.styles.text.fontSize || iconDef.size;
+    if (props.show && iconDef && iconDef.isFontAwesome) {
+      //@ts-ignore type information is not matching
+      iconJsx = /*#__PURE__*/React.createElement(FontAwesome, _extends({
+        name: customIcon ? '' : iconDef.type,
+        style: style,
+        size: iconSize
+      }, this.getTestProps('icon')), customIcon);
+    } else if (props.show && iconDef) {
+      var _this$styles$icon;
+      let WMCustomIcon = WavIcon;
+      if (iconDef.isStreamlineLightIcon) {
+        WMCustomIcon = StreamlineLightIcon;
+      } else if (iconDef.isStreamlineRegularIcon) {
+        WMCustomIcon = StreamlineRegularIcon;
+      } else if (!iconDef.isWavIcon && !customIcon && !((_this$styles$icon = this.styles.icon) !== null && _this$styles$icon !== void 0 && _this$styles$icon.fontFamily)) {
+        return null;
+      }
+      //@ts-ignore type information is not matching
+      iconJsx = WMCustomIcon ? /*#__PURE__*/React.createElement(WMCustomIcon, _extends({
+        name: customIcon ? '' : iconDef.type,
+        style: style,
+        size: iconSize
+      }, this.getTestProps('icon')), customIcon) : null;
+    }
+    if (iconJsx && iconDef.animation === 'spin') {
+      const rotate = this.spinValue.interpolate({
+        inputRange: [0, 1],
+        outputRange: ['0deg', '360deg']
+      });
+      const animation = {
+        transform: [{
+          rotate
+        }]
+      };
+      this.stopAnimation = false;
+      return /*#__PURE__*/React.createElement(Animated.View, {
+        style: animation
+      }, iconJsx);
+    } else if (iconJsx && iconDef.animation === 'pulse') {
+      const opacity = this.spinValue.interpolate({
+        inputRange: [0, 1],
+        outputRange: [0, 1]
+      });
+      const animation = {
+        opacity: opacity
+      };
+      this.stopAnimation = false;
+      return /*#__PURE__*/React.createElement(Animated.View, {
+        style: animation
+      }, iconJsx);
+    } else {
+      this.stopAnimation = true;
+    }
+    return /*#__PURE__*/React.createElement(View
+    // {...getAccessibilityProps(AccessibilityWidgetType.ICON, this.props)}
+    , null, iconJsx);
+  }
+  renderWidget(props) {
+    let icon = this.renderIcon(props);
+    let iterationCount = props.iterationcount ? props.iterationcount != 'infinite' ? parseInt(props.iterationcount) : 'infinite' : undefined;
+    return /*#__PURE__*/React.createElement(Tappable, _extends({
+      target: this,
+      rippleColor: this.styles.root.rippleColor
+    }, this.getTestPropsForAction(), {
+      accessibilityProps: {
+        ...getAccessibilityProps(AccessibilityWidgetType.ICON, props)
+      }
+    }), /*#__PURE__*/React.createElement(Animatedview, {
+      entryanimation: props.animation,
+      delay: props.animationdelay,
+      style: this.styles.root,
+      iterationCount: iterationCount
+    }, this._background, props.iconposition === 'left' && icon || null, props.caption && /*#__PURE__*/React.createElement(Text, _extends({}, this.getTestPropsForLabel('caption'), {
+      style: this.styles.text,
+      accessibilityRole: props !== null && props !== void 0 && props.accessibilityrole ? props === null || props === void 0 ? void 0 : props.accessibilityrole : 'text'
+    }), props.caption) || null, props.iconposition === 'right' && icon || null));
+  }
+}
+//# sourceMappingURL=icon.component.js.map

package/components/basic/icon/icon.props.js

@@ -0,0 +1,27 @@
+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 WmIconProps extends BaseProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "animation", null);
+    _defineProperty(this, "animationdelay", null);
+    _defineProperty(this, "iterationcount", void 0);
+    _defineProperty(this, "iconclass", 'wm-sl-l sl-user');
+    _defineProperty(this, "iconposition", 'left');
+    _defineProperty(this, "caption", '');
+    _defineProperty(this, "iconsize", 0);
+    _defineProperty(this, "onTap", void 0);
+    _defineProperty(this, "skeletonheight", null);
+    _defineProperty(this, "skeletonwidth", null);
+    _defineProperty(this, "iconurl", null);
+    _defineProperty(this, "iconheight", null);
+    _defineProperty(this, "iconwidth", null);
+    _defineProperty(this, "iconmargin", null);
+    _defineProperty(this, "accessibilitylabel", undefined);
+    _defineProperty(this, "hint", undefined);
+    _defineProperty(this, "accessibilityrole", void 0);
+  }
+}
+//# sourceMappingURL=icon.props.js.map

package/components/basic/label/label.component.js

@@ -0,0 +1,156 @@
+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 { Text, View } from 'react-native';
+import { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';
+import { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';
+import { NavigationServiceConsumer } from '@wavemaker/app-rn-runtime/core/navigation.service';
+import { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker/app-rn-runtime/core/accessibility';
+import WmLabelProps from './label.props';
+import { DEFAULT_CLASS } from './label.styles';
+import { isNil, toString } from 'lodash-es';
+import { Animatedview } from '@wavemaker/app-rn-runtime/components/basic/animatedview.component';
+import { createSkeleton } from '../skeleton/skeleton.component';
+export class WmLabelState extends BaseComponentState {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "parts", []);
+  }
+}
+export default class WmLabel extends BaseComponent {
+  constructor(props) {
+    super(props, DEFAULT_CLASS, new WmLabelProps(), new WmLabelState());
+  }
+  getAsterisk() {
+    return /*#__PURE__*/React.createElement(Text, {
+      style: this.styles.asterisk
+    }, "*");
+  }
+  onPropertyChange(name, $new, $old) {
+    super.onPropertyChange(name, $new, $old);
+    switch (name) {
+      case "caption":
+        this.updateState({
+          parts: this.parseCaption(String($new))
+        });
+        break;
+    }
+  }
+  getMultilineSkeleton(width, height) {
+    const styles = {
+      borderRadius: 4,
+      marginBottom: 10,
+      height: height
+    };
+    return createSkeleton(this.theme, this.styles.skeleton, {
+      ...styles,
+      width: width,
+      height: height
+    });
+  }
+  parseCaption(caption) {
+    if (!caption) {
+      return [];
+    }
+    caption += '';
+    caption = caption.replace(/\s*\(\s*\$event,\s*\$widget\s*\)\s*/, '');
+    caption = caption.replace(/\(\s*\)/, '(#/__EMPTY__)');
+    const pattern = /\[([^\]]+)\]\(([^)]*)\)/g;
+    const linkRegex = /^(((http|https):\/\/)|javascript:|#).+$/;
+    const captionSplit = caption.split(pattern);
+    let parts = [];
+    for (let i = 0; i < captionSplit.length; i++) {
+      const isLink = linkRegex.test(captionSplit[i]);
+      let part = {};
+      const isNextTextALink = linkRegex.test(captionSplit[i + 1]);
+      if (isLink) {
+        var _captionSplit;
+        part.text = (_captionSplit = captionSplit[i - 1]) !== null && _captionSplit !== void 0 ? _captionSplit : '';
+        part.link = captionSplit[i] === '#/__EMPTY__' ? '' : captionSplit[i];
+      } else {
+        part.text = isNextTextALink ? "" : captionSplit[i];
+      }
+      ;
+      if (part.text) {
+        parts.push(part);
+      }
+    }
+    return parts;
+  }
+  renderSkeleton(props) {
+    let skeletonWidth, skeletonHeight;
+    if (this.props.skeletonwidth == "0") {
+      skeletonWidth = 0;
+    } else {
+      var _this$styles$root;
+      skeletonWidth = this.props.skeletonwidth || ((_this$styles$root = this.styles.root) === null || _this$styles$root === void 0 ? void 0 : _this$styles$root.width);
+    }
+    if (this.props.skeletonheight == "0") {
+      skeletonHeight = 0;
+    } else {
+      var _this$styles$root2;
+      skeletonHeight = this.props.skeletonheight || ((_this$styles$root2 = this.styles.root) === null || _this$styles$root2 === void 0 ? void 0 : _this$styles$root2.height) || this.styles.text.fontSize;
+    }
+    if (this.props.multilineskeleton) {
+      return /*#__PURE__*/React.createElement(View, {
+        style: {
+          width: skeletonWidth
+        }
+      }, this.getMultilineSkeleton('100%', skeletonHeight), this.getMultilineSkeleton('70%', skeletonHeight), this.getMultilineSkeleton('40%', skeletonHeight));
+    } else {
+      return createSkeleton(this.theme, this.styles.skeleton, {
+        ...this.styles.root,
+        width: skeletonWidth,
+        height: skeletonHeight
+      });
+    }
+  }
+  renderWidget(props) {
+    const linkStyles = this.theme.mergeStyle({
+      text: this.styles.text
+    }, this.styles.link);
+    return !isNil(props.caption) ? /*#__PURE__*/React.createElement(Animatedview, {
+      entryanimation: props.animation,
+      delay: props.animationdelay,
+      style: this.styles.root
+    }, this._background, /*#__PURE__*/React.createElement(NavigationServiceConsumer, null, navigationService => {
+      var _this$state$parts, _this$state$parts2;
+      return /*#__PURE__*/React.createElement(Tappable, {
+        target: this
+      }, /*#__PURE__*/React.createElement(Text, _extends({
+        style: this.state.parts.length <= 1 ? this.styles.text : {
+          flexWrap: "wrap",
+          textAlign: this.styles.text.textAlign
+        }
+      }, this.state.parts.length <= 1 ? this.getTestPropsForLabel('caption') : {}, getAccessibilityProps(AccessibilityWidgetType.LABEL, props), {
+        numberOfLines: props.nooflines,
+        ellipsizeMode: "tail"
+      }), ((_this$state$parts = this.state.parts) === null || _this$state$parts === void 0 ? void 0 : _this$state$parts.length) === 1 ? toString(this.state.props.caption) : (_this$state$parts2 = this.state.parts) === null || _this$state$parts2 === void 0 ? void 0 : _this$state$parts2.map((part, index) => {
+        const isLink = !isNil(part.link);
+        return /*#__PURE__*/React.createElement(Text, _extends({
+          key: `part_${index}`,
+          style: [this.styles.text, isLink ? this.styles.link.text : null, props.isValid ? null : {
+            color: 'red'
+          }]
+        }, this.getTestPropsForLabel(isLink ? `link_${index}` : `caption_${index}`), {
+          selectable: this.styles.text.userSelect === 'text',
+          onPress: () => {
+            if (part.link) {
+              if (part.link.startsWith('http:') || part.link.startsWith('https:') || part.link.startsWith('#')) {
+                navigationService.openUrl(part.link, '_blank');
+              } else if (part.link.startsWith('javascript:')) {
+                const eventName = part.link.substring(11);
+                this.invokeEventCallback(eventName, [null, this.proxy]);
+              }
+            }
+            this.invokeEventCallback('onTap', [null, this.proxy]);
+          }
+          // {...getAccessibilityProps(AccessibilityWidgetType.LABEL, props)}
+        }), toString(part.text));
+      }), props.required && this.getAsterisk()));
+    })) : null;
+  }
+}
+//# sourceMappingURL=label.component.js.map

package/components/basic/label/label.props.js

@@ -0,0 +1,24 @@
+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 WmLabelProps extends BaseProps {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "animation", null);
+    _defineProperty(this, "animationdelay", null);
+    _defineProperty(this, "caption", 'Label');
+    _defineProperty(this, "required", null);
+    _defineProperty(this, "isValid", true);
+    _defineProperty(this, "wrap", true);
+    _defineProperty(this, "nooflines", undefined);
+    _defineProperty(this, "skeletonheight", null);
+    _defineProperty(this, "skeletonwidth", null);
+    _defineProperty(this, "multilineskeleton", false);
+    _defineProperty(this, "accessibilitylabel", undefined);
+    _defineProperty(this, "hint", undefined);
+    _defineProperty(this, "accessibilityrole", 'text');
+    _defineProperty(this, "onTap", null);
+  }
+}
+//# sourceMappingURL=label.props.js.map