@plusscommunities/pluss-webview-app 3.0.0 → 4.0.0

package/dist/module/components/WidgetLarge.js

@@ -1,24 +1,80 @@
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 import React, { Component } from 'react';
-import { View, StyleSheet } from 'react-native';
+import { View, Text, StyleSheet } from 'react-native';
 import { WebView } from 'react-native-webview';
-
+import { connect } from 'react-redux';
+import _ from 'lodash';
+import { Colours, Components } from '../core.config';
+import { Services } from '../feature.config';
 class WidgetLarge extends Component {
   constructor(props) {
     super(props);
-
     _defineProperty(this, "onLoadStart", () => {});
-
     _defineProperty(this, "onLoadEnd", () => {});
-
+    _defineProperty(this, "onGoToFullpage", () => {
+      const {
+        options
+      } = this.props;
+      Services.navigation.navigate('webViewPage', {
+        url: options['webUrl'],
+        headerTitle: this.getTitle()
+      });
+    });
+    _defineProperty(this, "getTitle", () => {
+      const {
+        options
+      } = this.props;
+      if (options && !_.isEmpty(options.Title)) return options.Title;
+      return 'Web View';
+    });
     this.state = {};
   }
-
   render() {
     const {
-      options
+      options,
+      colourBrandingMain
     } = this.props;
+    if (options.isWebViewSeparatePage) {
+      return /*#__PURE__*/React.createElement(View, {
+        style: [styles.buttonContainer, {
+          backgroundColor: Colours.hexToRGBAstring(colourBrandingMain, 0.2)
+        }]
+      }, /*#__PURE__*/React.createElement(View, {
+        style: styles.upperContainer
+      }, /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(Text, {
+        style: [styles.title, {
+          color: colourBrandingMain
+        }]
+      }, this.getTitle()))), /*#__PURE__*/React.createElement(Components.InlineButton, {
+        onPress: this.onGoToFullpage,
+        color: colourBrandingMain,
+        style: styles.button,
+        large: true
+      }, options.buttonText));
+      // return (
+      //   <View style={styles.sectionContainer}>
+      //     <View style={styles.sectionPadding}>
+      //       <View style={styles.sectionHeading}>
+      //         <Text style={styles.sectionTitle}>{this.getTitle()}</Text>
+      //       </View>
+      //     </View>
+      //     <View style={styles.buttonContainer}>
+      //       <Components.InlineButton
+      //         onPress={this.onGoToFullpage}
+      //         color={colourBrandingMain}
+      //         touchableStyle={{ paddingTop: 6 }}
+      //         textStyle={{ color: '#fff' }}
+      //         large
+      //       >
+      //         {options.buttonText}
+      //       </Components.InlineButton>
+      //     </View>
+      //   </View>
+      // );
+    }
+
     return /*#__PURE__*/React.createElement(View, {
       style: styles.container
     }, this.props.ListHeaderComponent, /*#__PURE__*/React.createElement(WebView, {
@@ -30,9 +86,7 @@ class WidgetLarge extends Component {
       onLoadEnd: this.onLoadEnd
     }));
   }
-
 }
-
 const styles = StyleSheet.create({
   container: {
     flex: 1
@@ -41,7 +95,33 @@ const styles = StyleSheet.create({
     flex: 1,
     alignItems: 'center',
     justifyContent: 'center'
+  },
+  buttonContainer: {
+    width: '100%',
+    alignItems: 'center',
+    justifyContent: 'center',
+    padding: 16
+  },
+  upperContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between'
+  },
+  title: {
+    fontFamily: 'sf-semibold',
+    fontSize: 16
+  },
+  button: {
+    paddingHorizontal: 40,
+    marginTop: 16
   }
 });
-export default WidgetLarge;
+const mapStateToProps = state => {
+  return {
+    colourBrandingMain: Colours.getMainBrandingColourFromState(state)
+  };
+};
+export default connect(mapStateToProps, {}, null, {
+  forwardRef: true
+})(WidgetLarge);
 //# sourceMappingURL=WidgetLarge.js.map

package/dist/module/components/WidgetLarge.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Component","View","StyleSheet","WebView","WidgetLarge","constructor","props","state","render","options","styles","container","ListHeaderComponent","uri","webContainer","onLoadStart","onLoadEnd","create","flex","alignItems","justifyContent"],"sources":["WidgetLarge.js"],"sourcesContent":["import React, { Component } from 'react';\nimport { View, StyleSheet } from 'react-native';\nimport { WebView } from 'react-native-webview';\n\nclass WidgetLarge extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {};\n  }\n\n  onLoadStart = () => {};\n  onLoadEnd = () => {};\n\n  render() {\n    const { options } = this.props;\n    return (\n      <View style={styles.container}>\n        {this.props.ListHeaderComponent}\n        <WebView\n          source={{ uri: options['webUrl'] }}\n          style={styles.webContainer}\n          onLoadStart={this.onLoadStart}\n          onLoadEnd={this.onLoadEnd}\n        />\n      </View>\n    );\n  }\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n  },\n  webContainer: {\n    flex: 1,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n});\n\nexport default WidgetLarge;\n"],"mappings":";;AAAA,OAAOA,KAAP,IAAgBC,SAAhB,QAAiC,OAAjC;AACA,SAASC,IAAT,EAAeC,UAAf,QAAiC,cAAjC;AACA,SAASC,OAAT,QAAwB,sBAAxB;;AAEA,MAAMC,WAAN,SAA0BJ,SAA1B,CAAoC;EAClCK,WAAW,CAACC,KAAD,EAAQ;IACjB,MAAMA,KAAN;;IADiB,qCAKL,MAAM,CAAE,CALH;;IAAA,mCAMP,MAAM,CAAE,CAND;;IAEjB,KAAKC,KAAL,GAAa,EAAb;EACD;;EAKDC,MAAM,GAAG;IACP,MAAM;MAAEC;IAAF,IAAc,KAAKH,KAAzB;IACA,oBACE,oBAAC,IAAD;MAAM,KAAK,EAAEI,MAAM,CAACC;IAApB,GACG,KAAKL,KAAL,CAAWM,mBADd,eAEE,oBAAC,OAAD;MACE,MAAM,EAAE;QAAEC,GAAG,EAAEJ,OAAO,CAAC,QAAD;MAAd,CADV;MAEE,KAAK,EAAEC,MAAM,CAACI,YAFhB;MAGE,WAAW,EAAE,KAAKC,WAHpB;MAIE,SAAS,EAAE,KAAKC;IAJlB,EAFF,CADF;EAWD;;AAtBiC;;AAyBpC,MAAMN,MAAM,GAAGR,UAAU,CAACe,MAAX,CAAkB;EAC/BN,SAAS,EAAE;IACTO,IAAI,EAAE;EADG,CADoB;EAI/BJ,YAAY,EAAE;IACZI,IAAI,EAAE,CADM;IAEZC,UAAU,EAAE,QAFA;IAGZC,cAAc,EAAE;EAHJ;AAJiB,CAAlB,CAAf;AAWA,eAAehB,WAAf"}
+{"version":3,"names":["React","Component","View","Text","StyleSheet","WebView","connect","_","Colours","Components","Services","WidgetLarge","constructor","props","_defineProperty","options","navigation","navigate","url","headerTitle","getTitle","isEmpty","Title","state","render","colourBrandingMain","isWebViewSeparatePage","createElement","style","styles","buttonContainer","backgroundColor","hexToRGBAstring","upperContainer","title","color","InlineButton","onPress","onGoToFullpage","button","large","buttonText","container","ListHeaderComponent","source","uri","webContainer","onLoadStart","onLoadEnd","create","flex","alignItems","justifyContent","width","padding","flexDirection","fontFamily","fontSize","paddingHorizontal","marginTop","mapStateToProps","getMainBrandingColourFromState","forwardRef"],"sources":["WidgetLarge.js"],"sourcesContent":["import React, { Component } from 'react';\nimport { View, Text, StyleSheet } from 'react-native';\nimport { WebView } from 'react-native-webview';\nimport { connect } from 'react-redux';\nimport _ from 'lodash';\nimport { Colours, Components } from '../core.config';\nimport { Services } from '../feature.config';\n\nclass WidgetLarge extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {};\n  }\n\n  onLoadStart = () => {};\n  onLoadEnd = () => {};\n\n  onGoToFullpage = () => {\n    const { options } = this.props;\n    Services.navigation.navigate('webViewPage', { url: options['webUrl'], headerTitle: this.getTitle() });\n  };\n\n  getTitle = () => {\n    const { options } = this.props;\n    if (options && !_.isEmpty(options.Title)) return options.Title;\n    return 'Web View';\n  };\n\n  render() {\n    const { options, colourBrandingMain } = this.props;\n    if (options.isWebViewSeparatePage) {\n      return (\n        <View style={[styles.buttonContainer, { backgroundColor: Colours.hexToRGBAstring(colourBrandingMain, 0.2) }]}>\n          <View style={styles.upperContainer}>\n            <View>\n              <Text style={[styles.title, { color: colourBrandingMain }]}>{this.getTitle()}</Text>\n            </View>\n          </View>\n          <Components.InlineButton onPress={this.onGoToFullpage} color={colourBrandingMain} style={styles.button} large>\n            {options.buttonText}\n          </Components.InlineButton>\n        </View>\n      );\n      // return (\n      //   <View style={styles.sectionContainer}>\n      //     <View style={styles.sectionPadding}>\n      //       <View style={styles.sectionHeading}>\n      //         <Text style={styles.sectionTitle}>{this.getTitle()}</Text>\n      //       </View>\n      //     </View>\n      //     <View style={styles.buttonContainer}>\n      //       <Components.InlineButton\n      //         onPress={this.onGoToFullpage}\n      //         color={colourBrandingMain}\n      //         touchableStyle={{ paddingTop: 6 }}\n      //         textStyle={{ color: '#fff' }}\n      //         large\n      //       >\n      //         {options.buttonText}\n      //       </Components.InlineButton>\n      //     </View>\n      //   </View>\n      // );\n    }\n    return (\n      <View style={styles.container}>\n        {this.props.ListHeaderComponent}\n        <WebView\n          source={{ uri: options['webUrl'] }}\n          style={styles.webContainer}\n          onLoadStart={this.onLoadStart}\n          onLoadEnd={this.onLoadEnd}\n        />\n      </View>\n    );\n  }\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n  },\n  webContainer: {\n    flex: 1,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  buttonContainer: {\n    width: '100%',\n    alignItems: 'center',\n    justifyContent: 'center',\n    padding: 16,\n  },\n  upperContainer: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n  },\n  title: {\n    fontFamily: 'sf-semibold',\n    fontSize: 16,\n  },\n  button: {\n    paddingHorizontal: 40,\n    marginTop: 16,\n  },\n});\n\nconst mapStateToProps = state => {\n  return {\n    colourBrandingMain: Colours.getMainBrandingColourFromState(state),\n  };\n};\n\nexport default connect(mapStateToProps, {}, null, { forwardRef: true })(WidgetLarge);\n"],"mappings":"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"}

package/dist/module/components/WidgetSmall.js

@@ -1,24 +1,80 @@
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 import React, { Component } from 'react';
-import { View, StyleSheet } from 'react-native';
+import { View, Text, StyleSheet } from 'react-native';
 import { WebView } from 'react-native-webview';
-
+import { connect } from 'react-redux';
+import _ from 'lodash';
+import { Colours, Components } from '../core.config';
+import { Services } from '../feature.config';
 class WidgetSmall extends Component {
   constructor(props) {
     super(props);
-
     _defineProperty(this, "onLoadStart", () => {});
-
     _defineProperty(this, "onLoadEnd", () => {});
-
+    _defineProperty(this, "onGoToFullpage", () => {
+      const {
+        options
+      } = this.props;
+      Services.navigation.navigate('webViewPage', {
+        url: options['webUrl'],
+        headerTitle: this.getTitle()
+      });
+    });
+    _defineProperty(this, "getTitle", () => {
+      const {
+        options
+      } = this.props;
+      if (options && !_.isEmpty(options.Title)) return options.Title;
+      return 'Web View';
+    });
     this.state = {};
   }
-
   render() {
     const {
-      options
+      options,
+      colourBrandingMain
     } = this.props;
+    if (options.isWebViewSeparatePage) {
+      return /*#__PURE__*/React.createElement(View, {
+        style: [styles.buttonContainer, {
+          backgroundColor: Colours.hexToRGBAstring(colourBrandingMain, 0.2)
+        }]
+      }, /*#__PURE__*/React.createElement(View, {
+        style: styles.upperContainer
+      }, /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(Text, {
+        style: [styles.title, {
+          color: colourBrandingMain
+        }]
+      }, this.getTitle()))), /*#__PURE__*/React.createElement(Components.InlineButton, {
+        onPress: this.onGoToFullpage,
+        color: colourBrandingMain,
+        style: styles.button,
+        large: true
+      }, options.buttonText));
+      // return (
+      //   <View style={styles.sectionContainer}>
+      //     <View style={styles.sectionPadding}>
+      //       <View style={styles.sectionHeading}>
+      //         <Text style={styles.sectionTitle}>{this.getTitle()}</Text>
+      //       </View>
+      //     </View>
+      //     <View style={styles.buttonContainer}>
+      //       <Components.InlineButton
+      //         onPress={this.onGoToFullpage}
+      //         color={colourBrandingMain}
+      //         touchableStyle={{ paddingTop: 6 }}
+      //         textStyle={{ color: '#fff' }}
+      //         large
+      //       >
+      //         {options.buttonText}
+      //       </Components.InlineButton>
+      //     </View>
+      //   </View>
+      // );
+    }
+
     return /*#__PURE__*/React.createElement(View, {
       style: styles.container
     }, /*#__PURE__*/React.createElement(WebView, {
@@ -30,9 +86,7 @@ class WidgetSmall extends Component {
       onLoadEnd: this.onLoadEnd
     }));
   }
-
 }
-
 const styles = StyleSheet.create({
   container: {
     height: 300,
@@ -43,7 +97,33 @@ const styles = StyleSheet.create({
     flex: 1,
     alignItems: 'center',
     justifyContent: 'center'
+  },
+  buttonContainer: {
+    width: '100%',
+    alignItems: 'center',
+    justifyContent: 'center',
+    padding: 16
+  },
+  upperContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between'
+  },
+  title: {
+    fontFamily: 'sf-semibold',
+    fontSize: 16
+  },
+  button: {
+    paddingHorizontal: 40,
+    marginTop: 16
   }
 });
-export default WidgetSmall;
+const mapStateToProps = state => {
+  return {
+    colourBrandingMain: Colours.getMainBrandingColourFromState(state)
+  };
+};
+export default connect(mapStateToProps, {}, null, {
+  forwardRef: true
+})(WidgetSmall);
 //# sourceMappingURL=WidgetSmall.js.map

package/dist/module/components/WidgetSmall.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Component","View","StyleSheet","WebView","WidgetSmall","constructor","props","state","render","options","styles","container","uri","webContainer","onLoadStart","onLoadEnd","create","height","paddingTop","paddingBottom","flex","alignItems","justifyContent"],"sources":["WidgetSmall.js"],"sourcesContent":["import React, { Component } from 'react';\nimport { View, StyleSheet } from 'react-native';\nimport { WebView } from 'react-native-webview';\n\nclass WidgetSmall extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {};\n  }\n\n  onLoadStart = () => {};\n  onLoadEnd = () => {};\n\n  render() {\n    const { options } = this.props;\n    return (\n      <View style={styles.container}>\n        <WebView\n          source={{ uri: options['webUrl'] }}\n          style={styles.webContainer}\n          onLoadStart={this.onLoadStart}\n          onLoadEnd={this.onLoadEnd}\n        />\n      </View>\n    );\n  }\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    height: 300,\n    paddingTop: 8,\n    paddingBottom: 8,\n  },\n  webContainer: {\n    flex: 1,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n});\n\nexport default WidgetSmall;\n"],"mappings":";;AAAA,OAAOA,KAAP,IAAgBC,SAAhB,QAAiC,OAAjC;AACA,SAASC,IAAT,EAAeC,UAAf,QAAiC,cAAjC;AACA,SAASC,OAAT,QAAwB,sBAAxB;;AAEA,MAAMC,WAAN,SAA0BJ,SAA1B,CAAoC;EAClCK,WAAW,CAACC,KAAD,EAAQ;IACjB,MAAMA,KAAN;;IADiB,qCAKL,MAAM,CAAE,CALH;;IAAA,mCAMP,MAAM,CAAE,CAND;;IAEjB,KAAKC,KAAL,GAAa,EAAb;EACD;;EAKDC,MAAM,GAAG;IACP,MAAM;MAAEC;IAAF,IAAc,KAAKH,KAAzB;IACA,oBACE,oBAAC,IAAD;MAAM,KAAK,EAAEI,MAAM,CAACC;IAApB,gBACE,oBAAC,OAAD;MACE,MAAM,EAAE;QAAEC,GAAG,EAAEH,OAAO,CAAC,QAAD;MAAd,CADV;MAEE,KAAK,EAAEC,MAAM,CAACG,YAFhB;MAGE,WAAW,EAAE,KAAKC,WAHpB;MAIE,SAAS,EAAE,KAAKC;IAJlB,EADF,CADF;EAUD;;AArBiC;;AAwBpC,MAAML,MAAM,GAAGR,UAAU,CAACc,MAAX,CAAkB;EAC/BL,SAAS,EAAE;IACTM,MAAM,EAAE,GADC;IAETC,UAAU,EAAE,CAFH;IAGTC,aAAa,EAAE;EAHN,CADoB;EAM/BN,YAAY,EAAE;IACZO,IAAI,EAAE,CADM;IAEZC,UAAU,EAAE,QAFA;IAGZC,cAAc,EAAE;EAHJ;AANiB,CAAlB,CAAf;AAaA,eAAelB,WAAf"}
+{"version":3,"names":["React","Component","View","Text","StyleSheet","WebView","connect","_","Colours","Components","Services","WidgetSmall","constructor","props","_defineProperty","options","navigation","navigate","url","headerTitle","getTitle","isEmpty","Title","state","render","colourBrandingMain","isWebViewSeparatePage","createElement","style","styles","buttonContainer","backgroundColor","hexToRGBAstring","upperContainer","title","color","InlineButton","onPress","onGoToFullpage","button","large","buttonText","container","source","uri","webContainer","onLoadStart","onLoadEnd","create","height","paddingTop","paddingBottom","flex","alignItems","justifyContent","width","padding","flexDirection","fontFamily","fontSize","paddingHorizontal","marginTop","mapStateToProps","getMainBrandingColourFromState","forwardRef"],"sources":["WidgetSmall.js"],"sourcesContent":["import React, { Component } from 'react';\nimport { View, Text, StyleSheet } from 'react-native';\nimport { WebView } from 'react-native-webview';\nimport { connect } from 'react-redux';\nimport _ from 'lodash';\nimport { Colours, Components } from '../core.config';\nimport { Services } from '../feature.config';\n\nclass WidgetSmall extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {};\n  }\n\n  onLoadStart = () => {};\n  onLoadEnd = () => {};\n\n  onGoToFullpage = () => {\n    const { options } = this.props;\n    Services.navigation.navigate('webViewPage', { url: options['webUrl'], headerTitle: this.getTitle() });\n  };\n\n  getTitle = () => {\n    const { options } = this.props;\n    if (options && !_.isEmpty(options.Title)) return options.Title;\n    return 'Web View';\n  };\n\n  render() {\n    const { options, colourBrandingMain } = this.props;\n    if (options.isWebViewSeparatePage) {\n      return (\n        <View style={[styles.buttonContainer, { backgroundColor: Colours.hexToRGBAstring(colourBrandingMain, 0.2) }]}>\n          <View style={styles.upperContainer}>\n            <View>\n              <Text style={[styles.title, { color: colourBrandingMain }]}>{this.getTitle()}</Text>\n            </View>\n          </View>\n          <Components.InlineButton onPress={this.onGoToFullpage} color={colourBrandingMain} style={styles.button} large>\n            {options.buttonText}\n          </Components.InlineButton>\n        </View>\n      );\n      // return (\n      //   <View style={styles.sectionContainer}>\n      //     <View style={styles.sectionPadding}>\n      //       <View style={styles.sectionHeading}>\n      //         <Text style={styles.sectionTitle}>{this.getTitle()}</Text>\n      //       </View>\n      //     </View>\n      //     <View style={styles.buttonContainer}>\n      //       <Components.InlineButton\n      //         onPress={this.onGoToFullpage}\n      //         color={colourBrandingMain}\n      //         touchableStyle={{ paddingTop: 6 }}\n      //         textStyle={{ color: '#fff' }}\n      //         large\n      //       >\n      //         {options.buttonText}\n      //       </Components.InlineButton>\n      //     </View>\n      //   </View>\n      // );\n    }\n    return (\n      <View style={styles.container}>\n        <WebView\n          source={{ uri: options['webUrl'] }}\n          style={styles.webContainer}\n          onLoadStart={this.onLoadStart}\n          onLoadEnd={this.onLoadEnd}\n        />\n      </View>\n    );\n  }\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    height: 300,\n    paddingTop: 8,\n    paddingBottom: 8,\n  },\n  webContainer: {\n    flex: 1,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  buttonContainer: {\n    width: '100%',\n    alignItems: 'center',\n    justifyContent: 'center',\n    padding: 16,\n  },\n  upperContainer: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n  },\n  title: {\n    fontFamily: 'sf-semibold',\n    fontSize: 16,\n  },\n  button: {\n    paddingHorizontal: 40,\n    marginTop: 16,\n  },\n});\n\nconst mapStateToProps = state => {\n  return {\n    colourBrandingMain: Colours.getMainBrandingColourFromState(state),\n  };\n};\n\nexport default connect(mapStateToProps, {}, null, { forwardRef: true })(WidgetSmall);\n"],"mappings":"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"}

package/dist/module/core.config.js

@@ -0,0 +1,17 @@
+// import * as PlussCore from '../../pluss-core/src';
+import * as PlussCore from '@plusscommunities/pluss-core-app';
+const {
+  Apis,
+  Fonts,
+  Actions,
+  ActionTypes,
+  Config,
+  Components,
+  Styles,
+  Session,
+  Helper,
+  Constants,
+  Colours
+} = PlussCore;
+export { Apis, Fonts, Actions, ActionTypes, Config, Components, Styles, Session, Helper, Constants, Colours };
+//# sourceMappingURL=core.config.js.map

package/dist/module/core.config.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["PlussCore","Apis","Fonts","Actions","ActionTypes","Config","Components","Styles","Session","Helper","Constants","Colours"],"sources":["core.config.js"],"sourcesContent":["// import * as PlussCore from '../../pluss-core/src';\nimport * as PlussCore from '@plusscommunities/pluss-core-app';\n\nconst { Apis, Fonts, Actions, ActionTypes, Config, Components, Styles, Session, Helper, Constants, Colours } = PlussCore;\nexport { Apis, Fonts, Actions, ActionTypes, Config, Components, Styles, Session, Helper, Constants, Colours };\n"],"mappings":"AAAA;AACA,OAAO,KAAKA,SAAS,MAAM,kCAAkC;AAE7D,MAAM;EAAEC,IAAI;EAAEC,KAAK;EAAEC,OAAO;EAAEC,WAAW;EAAEC,MAAM;EAAEC,UAAU;EAAEC,MAAM;EAAEC,OAAO;EAAEC,MAAM;EAAEC,SAAS;EAAEC;AAAQ,CAAC,GAAGX,SAAS;AACxH,SAASC,IAAI,EAAEC,KAAK,EAAEC,OAAO,EAAEC,WAAW,EAAEC,MAAM,EAAEC,UAAU,EAAEC,MAAM,EAAEC,OAAO,EAAEC,MAAM,EAAEC,SAAS,EAAEC,OAAO"}

package/dist/module/feature.config.js

@@ -1,6 +1,11 @@
+// import * as PlussCore from '../../pluss-core/src';
+import * as PlussCore from '@plusscommunities/pluss-core-app';
 export const Services = {
   navigation: null
 };
+export const BaseComponents = {
+  NotificationBell: null
+};
 const FeatureConfig = {
   key: 'web',
   title: 'Web',
@@ -9,6 +14,7 @@ const FeatureConfig = {
     viewBox: '0 0 24 24',
     navigate: 'web'
   },
+  hideTabBar: ['webViewPage'],
   env: {
     baseStage: '',
     baseAPIUrl: '',
@@ -25,7 +31,9 @@ const FeatureConfig = {
     newEventDefaults: '',
     defaultAllowComments: true
   },
-  init: (environment, navigation) => {
+  init: (environment, navigation, notificationBell) => {
+    BaseComponents.NotificationBell = notificationBell;
+    PlussCore.Config.init(environment, navigation);
     FeatureConfig.env = environment;
     Services.navigation = navigation;
   }

package/dist/module/feature.config.js.map

@@ -1 +1 @@
-{"version":3,"names":["Services","navigation","FeatureConfig","key","title","gridMenu","icon","viewBox","navigate","env","baseStage","baseAPIUrl","hasGradientHeader","defaultProfileImage","tinyChatDefault","baseUploadsUrl","allowMediaDownload","allowMediaSharing","awsUploadsBucket","awsStorageBucket","preferredSite","strings","newEventDefaults","defaultAllowComments","init","environment"],"sources":["feature.config.js"],"sourcesContent":["export const Services = {\n  navigation: null,\n};\n\nconst FeatureConfig = {\n  key: 'web',\n  title: 'Web',\n  gridMenu: {\n    icon: 'tab_news2',\n    viewBox: '0 0 24 24',\n    navigate: 'web',\n  },\n  env: {\n    baseStage: '',\n    baseAPIUrl: '',\n    hasGradientHeader: false,\n    defaultProfileImage: '',\n    tinyChatDefault: '',\n    baseUploadsUrl: '',\n    allowMediaDownload: false,\n    allowMediaSharing: false,\n    awsUploadsBucket: '',\n    awsStorageBucket: '',\n    preferredSite: '',\n    strings: {},\n    newEventDefaults: '',\n    defaultAllowComments: true,\n  },\n  init: (environment, navigation) => {\n    FeatureConfig.env = environment;\n    Services.navigation = navigation;\n  },\n};\nexport default FeatureConfig;\n"],"mappings":"AAAA,OAAO,MAAMA,QAAQ,GAAG;EACtBC,UAAU,EAAE;AADU,CAAjB;AAIP,MAAMC,aAAa,GAAG;EACpBC,GAAG,EAAE,KADe;EAEpBC,KAAK,EAAE,KAFa;EAGpBC,QAAQ,EAAE;IACRC,IAAI,EAAE,WADE;IAERC,OAAO,EAAE,WAFD;IAGRC,QAAQ,EAAE;EAHF,CAHU;EAQpBC,GAAG,EAAE;IACHC,SAAS,EAAE,EADR;IAEHC,UAAU,EAAE,EAFT;IAGHC,iBAAiB,EAAE,KAHhB;IAIHC,mBAAmB,EAAE,EAJlB;IAKHC,eAAe,EAAE,EALd;IAMHC,cAAc,EAAE,EANb;IAOHC,kBAAkB,EAAE,KAPjB;IAQHC,iBAAiB,EAAE,KARhB;IASHC,gBAAgB,EAAE,EATf;IAUHC,gBAAgB,EAAE,EAVf;IAWHC,aAAa,EAAE,EAXZ;IAYHC,OAAO,EAAE,EAZN;IAaHC,gBAAgB,EAAE,EAbf;IAcHC,oBAAoB,EAAE;EAdnB,CARe;EAwBpBC,IAAI,EAAE,CAACC,WAAD,EAAcxB,UAAd,KAA6B;IACjCC,aAAa,CAACO,GAAd,GAAoBgB,WAApB;IACAzB,QAAQ,CAACC,UAAT,GAAsBA,UAAtB;EACD;AA3BmB,CAAtB;AA6BA,eAAeC,aAAf"}
+{"version":3,"names":["PlussCore","Services","navigation","BaseComponents","NotificationBell","FeatureConfig","key","title","gridMenu","icon","viewBox","navigate","hideTabBar","env","baseStage","baseAPIUrl","hasGradientHeader","defaultProfileImage","tinyChatDefault","baseUploadsUrl","allowMediaDownload","allowMediaSharing","awsUploadsBucket","awsStorageBucket","preferredSite","strings","newEventDefaults","defaultAllowComments","init","environment","notificationBell","Config"],"sources":["feature.config.js"],"sourcesContent":["// import * as PlussCore from '../../pluss-core/src';\nimport * as PlussCore from '@plusscommunities/pluss-core-app';\n\nexport const Services = {\n  navigation: null,\n};\n\nexport const BaseComponents = {\n  NotificationBell: null,\n};\n\nconst FeatureConfig = {\n  key: 'web',\n  title: 'Web',\n  gridMenu: {\n    icon: 'tab_news2',\n    viewBox: '0 0 24 24',\n    navigate: 'web',\n  },\n  hideTabBar: ['webViewPage'],\n  env: {\n    baseStage: '',\n    baseAPIUrl: '',\n    hasGradientHeader: false,\n    defaultProfileImage: '',\n    tinyChatDefault: '',\n    baseUploadsUrl: '',\n    allowMediaDownload: false,\n    allowMediaSharing: false,\n    awsUploadsBucket: '',\n    awsStorageBucket: '',\n    preferredSite: '',\n    strings: {},\n    newEventDefaults: '',\n    defaultAllowComments: true,\n  },\n  init: (environment, navigation, notificationBell) => {\n    BaseComponents.NotificationBell = notificationBell;\n    PlussCore.Config.init(environment, navigation);\n    FeatureConfig.env = environment;\n    Services.navigation = navigation;\n  },\n};\nexport default FeatureConfig;\n"],"mappings":"AAAA;AACA,OAAO,KAAKA,SAAS,MAAM,kCAAkC;AAE7D,OAAO,MAAMC,QAAQ,GAAG;EACtBC,UAAU,EAAE;AACd,CAAC;AAED,OAAO,MAAMC,cAAc,GAAG;EAC5BC,gBAAgB,EAAE;AACpB,CAAC;AAED,MAAMC,aAAa,GAAG;EACpBC,GAAG,EAAE,KAAK;EACVC,KAAK,EAAE,KAAK;EACZC,QAAQ,EAAE;IACRC,IAAI,EAAE,WAAW;IACjBC,OAAO,EAAE,WAAW;IACpBC,QAAQ,EAAE;EACZ,CAAC;EACDC,UAAU,EAAE,CAAC,aAAa,CAAC;EAC3BC,GAAG,EAAE;IACHC,SAAS,EAAE,EAAE;IACbC,UAAU,EAAE,EAAE;IACdC,iBAAiB,EAAE,KAAK;IACxBC,mBAAmB,EAAE,EAAE;IACvBC,eAAe,EAAE,EAAE;IACnBC,cAAc,EAAE,EAAE;IAClBC,kBAAkB,EAAE,KAAK;IACzBC,iBAAiB,EAAE,KAAK;IACxBC,gBAAgB,EAAE,EAAE;IACpBC,gBAAgB,EAAE,EAAE;IACpBC,aAAa,EAAE,EAAE;IACjBC,OAAO,EAAE,CAAC,CAAC;IACXC,gBAAgB,EAAE,EAAE;IACpBC,oBAAoB,EAAE;EACxB,CAAC;EACDC,IAAI,EAAEA,CAACC,WAAW,EAAE3B,UAAU,EAAE4B,gBAAgB,KAAK;IACnD3B,cAAc,CAACC,gBAAgB,GAAG0B,gBAAgB;IAClD9B,SAAS,CAAC+B,MAAM,CAACH,IAAI,CAACC,WAAW,EAAE3B,UAAU,CAAC;IAC9CG,aAAa,CAACQ,GAAG,GAAGgB,WAAW;IAC/B5B,QAAQ,CAACC,UAAU,GAAGA,UAAU;EAClC;AACF,CAAC;AACD,eAAeG,aAAa"}

package/dist/module/index.js

@@ -1,6 +1,8 @@
 import WebPage from './screens/WebPage';
+import WebViewPage from './screens/WebViewPage';
 export const Screens = {
-  web: WebPage
+  web: WebPage,
+  webViewPage: WebViewPage
 };
 export { default as Config } from './feature.config';
 export { default as WidgetSmall } from './components/WidgetSmall';

package/dist/module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["WebPage","Screens","web","default","Config","WidgetSmall","WidgetLarge"],"sources":["index.js"],"sourcesContent":["import WebPage from './screens/WebPage';\n\nexport const Screens = { web: WebPage };\nexport { default as Config } from './feature.config';\nexport { default as WidgetSmall } from './components/WidgetSmall';\nexport { default as WidgetLarge } from './components/WidgetLarge';\n"],"mappings":"AAAA,OAAOA,OAAP,MAAoB,mBAApB;AAEA,OAAO,MAAMC,OAAO,GAAG;EAAEC,GAAG,EAAEF;AAAP,CAAhB;AACP,SAASG,OAAO,IAAIC,MAApB,QAAkC,kBAAlC;AACA,SAASD,OAAO,IAAIE,WAApB,QAAuC,0BAAvC;AACA,SAASF,OAAO,IAAIG,WAApB,QAAuC,0BAAvC"}
+{"version":3,"names":["WebPage","WebViewPage","Screens","web","webViewPage","default","Config","WidgetSmall","WidgetLarge"],"sources":["index.js"],"sourcesContent":["import WebPage from './screens/WebPage';\nimport WebViewPage from './screens/WebViewPage';\n\nexport const Screens = { web: WebPage, webViewPage: WebViewPage };\nexport { default as Config } from './feature.config';\nexport { default as WidgetSmall } from './components/WidgetSmall';\nexport { default as WidgetLarge } from './components/WidgetLarge';\n"],"mappings":"AAAA,OAAOA,OAAO,MAAM,mBAAmB;AACvC,OAAOC,WAAW,MAAM,uBAAuB;AAE/C,OAAO,MAAMC,OAAO,GAAG;EAAEC,GAAG,EAAEH,OAAO;EAAEI,WAAW,EAAEH;AAAY,CAAC;AACjE,SAASI,OAAO,IAAIC,MAAM,QAAQ,kBAAkB;AACpD,SAASD,OAAO,IAAIE,WAAW,QAAQ,0BAA0B;AACjE,SAASF,OAAO,IAAIG,WAAW,QAAQ,0BAA0B"}

package/dist/module/screens/WebPage.js

@@ -1,12 +1,9 @@
 import React, { PureComponent } from 'react';
 import WidgetLarge from '../components/WidgetLarge';
-
 class WebPage extends PureComponent {
   render() {
     return /*#__PURE__*/React.createElement(WidgetLarge, this.props);
   }
-
 }
-
 export default WebPage;
 //# sourceMappingURL=WebPage.js.map

package/dist/module/screens/WebPage.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","PureComponent","WidgetLarge","WebPage","render","props"],"sources":["WebPage.js"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport WidgetLarge from '../components/WidgetLarge';\n\nclass WebPage extends PureComponent {\n  render() {\n    return <WidgetLarge {...this.props} />;\n  }\n}\n\nexport default WebPage;\n"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,aAAhB,QAAqC,OAArC;AACA,OAAOC,WAAP,MAAwB,2BAAxB;;AAEA,MAAMC,OAAN,SAAsBF,aAAtB,CAAoC;EAClCG,MAAM,GAAG;IACP,oBAAO,oBAAC,WAAD,EAAiB,KAAKC,KAAtB,CAAP;EACD;;AAHiC;;AAMpC,eAAeF,OAAf"}
+{"version":3,"names":["React","PureComponent","WidgetLarge","WebPage","render","createElement","props"],"sources":["WebPage.js"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport WidgetLarge from '../components/WidgetLarge';\n\nclass WebPage extends PureComponent {\n  render() {\n    return <WidgetLarge {...this.props} />;\n  }\n}\n\nexport default WebPage;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,aAAa,QAAQ,OAAO;AAC5C,OAAOC,WAAW,MAAM,2BAA2B;AAEnD,MAAMC,OAAO,SAASF,aAAa,CAAC;EAClCG,MAAMA,CAAA,EAAG;IACP,oBAAOJ,KAAA,CAAAK,aAAA,CAACH,WAAW,EAAK,IAAI,CAACI,KAAQ,CAAC;EACxC;AACF;AAEA,eAAeH,OAAO"}

package/dist/module/screens/WebViewPage.js

@@ -0,0 +1,51 @@
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+import React, { Component } from 'react';
+import { View, StyleSheet } from 'react-native';
+import { WebView } from 'react-native-webview';
+import { Components } from '../core.config';
+import { Services } from '../feature.config';
+class WebViewPage extends Component {
+  constructor(props) {
+    super(props);
+    _defineProperty(this, "onLoadStart", () => {});
+    _defineProperty(this, "onLoadEnd", () => {});
+    _defineProperty(this, "onPressBack", () => {
+      Services.navigation.goBack();
+    });
+    this.state = {};
+  }
+  render() {
+    const {
+      url,
+      headerTitle
+    } = this.props;
+    return /*#__PURE__*/React.createElement(View, {
+      style: styles.container
+    }, /*#__PURE__*/React.createElement(Components.Header, {
+      leftIcon: "angle-left",
+      onPressLeft: this.onPressBack,
+      text: headerTitle
+    }), /*#__PURE__*/React.createElement(WebView, {
+      source: {
+        uri: url
+      },
+      style: styles.webContainer,
+      onLoadStart: this.onLoadStart,
+      onLoadEnd: this.onLoadEnd
+    }));
+  }
+}
+const styles = StyleSheet.create({
+  container: {
+    flex: 1
+  },
+  webContainer: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center'
+  }
+});
+export default WebViewPage;
+//# sourceMappingURL=WebViewPage.js.map

package/dist/module/screens/WebViewPage.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Component","View","StyleSheet","WebView","Components","Services","WebViewPage","constructor","props","_defineProperty","navigation","goBack","state","render","url","headerTitle","createElement","style","styles","container","Header","leftIcon","onPressLeft","onPressBack","text","source","uri","webContainer","onLoadStart","onLoadEnd","create","flex","alignItems","justifyContent"],"sources":["WebViewPage.js"],"sourcesContent":["import React, { Component } from 'react';\nimport { View, StyleSheet } from 'react-native';\nimport { WebView } from 'react-native-webview';\nimport { Components } from '../core.config';\nimport { Services } from '../feature.config';\n\nclass WebViewPage extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {};\n  }\n\n  onLoadStart = () => {};\n  onLoadEnd = () => {};\n\n  onPressBack = () => {\n    Services.navigation.goBack();\n  };\n\n  render() {\n    const { url, headerTitle } = this.props;\n    return (\n      <View style={styles.container}>\n        <Components.Header leftIcon=\"angle-left\" onPressLeft={this.onPressBack} text={headerTitle} />\n        <WebView source={{ uri: url }} style={styles.webContainer} onLoadStart={this.onLoadStart} onLoadEnd={this.onLoadEnd} />\n      </View>\n    );\n  }\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n  },\n  webContainer: {\n    flex: 1,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n});\n\nexport default WebViewPage;\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAIC,SAAS,QAAQ,OAAO;AACxC,SAASC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AAC/C,SAASC,OAAO,QAAQ,sBAAsB;AAC9C,SAASC,UAAU,QAAQ,gBAAgB;AAC3C,SAASC,QAAQ,QAAQ,mBAAmB;AAE5C,MAAMC,WAAW,SAASN,SAAS,CAAC;EAClCO,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAACC,eAAA,sBAID,MAAM,CAAC,CAAC;IAAAA,eAAA,oBACV,MAAM,CAAC,CAAC;IAAAA,eAAA,sBAEN,MAAM;MAClBJ,QAAQ,CAACK,UAAU,CAACC,MAAM,CAAC,CAAC;IAC9B,CAAC;IARC,IAAI,CAACC,KAAK,GAAG,CAAC,CAAC;EACjB;EASAC,MAAMA,CAAA,EAAG;IACP,MAAM;MAAEC,GAAG;MAAEC;IAAY,CAAC,GAAG,IAAI,CAACP,KAAK;IACvC,oBACET,KAAA,CAAAiB,aAAA,CAACf,IAAI;MAACgB,KAAK,EAAEC,MAAM,CAACC;IAAU,gBAC5BpB,KAAA,CAAAiB,aAAA,CAACZ,UAAU,CAACgB,MAAM;MAACC,QAAQ,EAAC,YAAY;MAACC,WAAW,EAAE,IAAI,CAACC,WAAY;MAACC,IAAI,EAAET;IAAY,CAAE,CAAC,eAC7FhB,KAAA,CAAAiB,aAAA,CAACb,OAAO;MAACsB,MAAM,EAAE;QAAEC,GAAG,EAAEZ;MAAI,CAAE;MAACG,KAAK,EAAEC,MAAM,CAACS,YAAa;MAACC,WAAW,EAAE,IAAI,CAACA,WAAY;MAACC,SAAS,EAAE,IAAI,CAACA;IAAU,CAAE,CAClH,CAAC;EAEX;AACF;AAEA,MAAMX,MAAM,GAAGhB,UAAU,CAAC4B,MAAM,CAAC;EAC/BX,SAAS,EAAE;IACTY,IAAI,EAAE;EACR,CAAC;EACDJ,YAAY,EAAE;IACZI,IAAI,EAAE,CAAC;IACPC,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE;EAClB;AACF,CAAC,CAAC;AAEF,eAAe3B,WAAW"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plusscommunities/pluss-webview-app",
-  "version": "3.0.0",
+  "version": "4.0.0",
   "description": "Extension package to enable webview on Pluss Communities Platform",
   "main": "dist/module/index.js",
   "module": "dist/module/index.js",
@@ -10,7 +10,7 @@
     "src/"
   ],
   "scripts": {
-    "build": "npm i && bob build",
+    "build": "npm i --legacy-peer-deps && bob build",
     "betapatch": "npm version prepatch --preid=beta",
     "patch": "npm version patch",
     "betaupload": "npm run build && npm publish --access public --tag beta",
@@ -21,8 +21,10 @@
   "author": "Phillip Suh",
   "license": "ISC",
   "dependencies": {
+    "@plusscommunities/pluss-core-app": "4.0.0",
+    "lodash": "^4.17.4",
     "react": "18.2.0",
-    "react-native": "0.71.6",
+    "react-native": "0.71.13",
     "react-native-webview": "11.26.0"
   },
   "devDependencies": {

package/src/components/WidgetLarge.js

@@ -1,6 +1,10 @@
 import React, { Component } from 'react';
-import { View, StyleSheet } from 'react-native';
+import { View, Text, StyleSheet } from 'react-native';
 import { WebView } from 'react-native-webview';
+import { connect } from 'react-redux';
+import _ from 'lodash';
+import { Colours, Components } from '../core.config';
+import { Services } from '../feature.config';
 
 class WidgetLarge extends Component {
   constructor(props) {
@@ -11,8 +15,53 @@ class WidgetLarge extends Component {
   onLoadStart = () => {};
   onLoadEnd = () => {};
 
-  render() {
+  onGoToFullpage = () => {
+    const { options } = this.props;
+    Services.navigation.navigate('webViewPage', { url: options['webUrl'], headerTitle: this.getTitle() });
+  };
+
+  getTitle = () => {
     const { options } = this.props;
+    if (options && !_.isEmpty(options.Title)) return options.Title;
+    return 'Web View';
+  };
+
+  render() {
+    const { options, colourBrandingMain } = this.props;
+    if (options.isWebViewSeparatePage) {
+      return (
+        <View style={[styles.buttonContainer, { backgroundColor: Colours.hexToRGBAstring(colourBrandingMain, 0.2) }]}>
+          <View style={styles.upperContainer}>
+            <View>
+              <Text style={[styles.title, { color: colourBrandingMain }]}>{this.getTitle()}</Text>
+            </View>
+          </View>
+          <Components.InlineButton onPress={this.onGoToFullpage} color={colourBrandingMain} style={styles.button} large>
+            {options.buttonText}
+          </Components.InlineButton>
+        </View>
+      );
+      // return (
+      //   <View style={styles.sectionContainer}>
+      //     <View style={styles.sectionPadding}>
+      //       <View style={styles.sectionHeading}>
+      //         <Text style={styles.sectionTitle}>{this.getTitle()}</Text>
+      //       </View>
+      //     </View>
+      //     <View style={styles.buttonContainer}>
+      //       <Components.InlineButton
+      //         onPress={this.onGoToFullpage}
+      //         color={colourBrandingMain}
+      //         touchableStyle={{ paddingTop: 6 }}
+      //         textStyle={{ color: '#fff' }}
+      //         large
+      //       >
+      //         {options.buttonText}
+      //       </Components.InlineButton>
+      //     </View>
+      //   </View>
+      // );
+    }
     return (
       <View style={styles.container}>
         {this.props.ListHeaderComponent}
@@ -36,6 +85,31 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'center',
   },
+  buttonContainer: {
+    width: '100%',
+    alignItems: 'center',
+    justifyContent: 'center',
+    padding: 16,
+  },
+  upperContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+  },
+  title: {
+    fontFamily: 'sf-semibold',
+    fontSize: 16,
+  },
+  button: {
+    paddingHorizontal: 40,
+    marginTop: 16,
+  },
 });
 
-export default WidgetLarge;
+const mapStateToProps = state => {
+  return {
+    colourBrandingMain: Colours.getMainBrandingColourFromState(state),
+  };
+};
+
+export default connect(mapStateToProps, {}, null, { forwardRef: true })(WidgetLarge);

package/src/components/WidgetSmall.js

@@ -1,6 +1,10 @@
 import React, { Component } from 'react';
-import { View, StyleSheet } from 'react-native';
+import { View, Text, StyleSheet } from 'react-native';
 import { WebView } from 'react-native-webview';
+import { connect } from 'react-redux';
+import _ from 'lodash';
+import { Colours, Components } from '../core.config';
+import { Services } from '../feature.config';
 
 class WidgetSmall extends Component {
   constructor(props) {
@@ -11,8 +15,53 @@ class WidgetSmall extends Component {
   onLoadStart = () => {};
   onLoadEnd = () => {};
 
-  render() {
+  onGoToFullpage = () => {
+    const { options } = this.props;
+    Services.navigation.navigate('webViewPage', { url: options['webUrl'], headerTitle: this.getTitle() });
+  };
+
+  getTitle = () => {
     const { options } = this.props;
+    if (options && !_.isEmpty(options.Title)) return options.Title;
+    return 'Web View';
+  };
+
+  render() {
+    const { options, colourBrandingMain } = this.props;
+    if (options.isWebViewSeparatePage) {
+      return (
+        <View style={[styles.buttonContainer, { backgroundColor: Colours.hexToRGBAstring(colourBrandingMain, 0.2) }]}>
+          <View style={styles.upperContainer}>
+            <View>
+              <Text style={[styles.title, { color: colourBrandingMain }]}>{this.getTitle()}</Text>
+            </View>
+          </View>
+          <Components.InlineButton onPress={this.onGoToFullpage} color={colourBrandingMain} style={styles.button} large>
+            {options.buttonText}
+          </Components.InlineButton>
+        </View>
+      );
+      // return (
+      //   <View style={styles.sectionContainer}>
+      //     <View style={styles.sectionPadding}>
+      //       <View style={styles.sectionHeading}>
+      //         <Text style={styles.sectionTitle}>{this.getTitle()}</Text>
+      //       </View>
+      //     </View>
+      //     <View style={styles.buttonContainer}>
+      //       <Components.InlineButton
+      //         onPress={this.onGoToFullpage}
+      //         color={colourBrandingMain}
+      //         touchableStyle={{ paddingTop: 6 }}
+      //         textStyle={{ color: '#fff' }}
+      //         large
+      //       >
+      //         {options.buttonText}
+      //       </Components.InlineButton>
+      //     </View>
+      //   </View>
+      // );
+    }
     return (
       <View style={styles.container}>
         <WebView
@@ -37,6 +86,31 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'center',
   },
+  buttonContainer: {
+    width: '100%',
+    alignItems: 'center',
+    justifyContent: 'center',
+    padding: 16,
+  },
+  upperContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+  },
+  title: {
+    fontFamily: 'sf-semibold',
+    fontSize: 16,
+  },
+  button: {
+    paddingHorizontal: 40,
+    marginTop: 16,
+  },
 });
 
-export default WidgetSmall;
+const mapStateToProps = state => {
+  return {
+    colourBrandingMain: Colours.getMainBrandingColourFromState(state),
+  };
+};
+
+export default connect(mapStateToProps, {}, null, { forwardRef: true })(WidgetSmall);

package/src/core.config.js

@@ -0,0 +1,5 @@
+// import * as PlussCore from '../../pluss-core/src';
+import * as PlussCore from '@plusscommunities/pluss-core-app';
+
+const { Apis, Fonts, Actions, ActionTypes, Config, Components, Styles, Session, Helper, Constants, Colours } = PlussCore;
+export { Apis, Fonts, Actions, ActionTypes, Config, Components, Styles, Session, Helper, Constants, Colours };

package/src/feature.config.js

@@ -1,7 +1,14 @@
+// import * as PlussCore from '../../pluss-core/src';
+import * as PlussCore from '@plusscommunities/pluss-core-app';
+
 export const Services = {
   navigation: null,
 };
 
+export const BaseComponents = {
+  NotificationBell: null,
+};
+
 const FeatureConfig = {
   key: 'web',
   title: 'Web',
@@ -10,6 +17,7 @@ const FeatureConfig = {
     viewBox: '0 0 24 24',
     navigate: 'web',
   },
+  hideTabBar: ['webViewPage'],
   env: {
     baseStage: '',
     baseAPIUrl: '',
@@ -26,7 +34,9 @@ const FeatureConfig = {
     newEventDefaults: '',
     defaultAllowComments: true,
   },
-  init: (environment, navigation) => {
+  init: (environment, navigation, notificationBell) => {
+    BaseComponents.NotificationBell = notificationBell;
+    PlussCore.Config.init(environment, navigation);
     FeatureConfig.env = environment;
     Services.navigation = navigation;
   },

package/src/index.js

@@ -1,6 +1,7 @@
 import WebPage from './screens/WebPage';
+import WebViewPage from './screens/WebViewPage';
 
-export const Screens = { web: WebPage };
+export const Screens = { web: WebPage, webViewPage: WebViewPage };
 export { default as Config } from './feature.config';
 export { default as WidgetSmall } from './components/WidgetSmall';
 export { default as WidgetLarge } from './components/WidgetLarge';

package/src/screens/WebViewPage.js

@@ -0,0 +1,42 @@
+import React, { Component } from 'react';
+import { View, StyleSheet } from 'react-native';
+import { WebView } from 'react-native-webview';
+import { Components } from '../core.config';
+import { Services } from '../feature.config';
+
+class WebViewPage extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {};
+  }
+
+  onLoadStart = () => {};
+  onLoadEnd = () => {};
+
+  onPressBack = () => {
+    Services.navigation.goBack();
+  };
+
+  render() {
+    const { url, headerTitle } = this.props;
+    return (
+      <View style={styles.container}>
+        <Components.Header leftIcon="angle-left" onPressLeft={this.onPressBack} text={headerTitle} />
+        <WebView source={{ uri: url }} style={styles.webContainer} onLoadStart={this.onLoadStart} onLoadEnd={this.onLoadEnd} />
+      </View>
+    );
+  }
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+  },
+  webContainer: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+});
+
+export default WebViewPage;