@times-components/interactive-wrapper 0.8.17 → 0.8.18

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.8.18](https://github.com/newsuk/times-components/compare/@times-components/interactive-wrapper@0.8.17...@times-components/interactive-wrapper@0.8.18) (2021-11-25)
+
+**Note:** Version bump only for package @times-components/interactive-wrapper
+
+
+
+
+
 ## [0.8.17](https://github.com/newsuk/times-components/compare/@times-components/interactive-wrapper@0.8.16...@times-components/interactive-wrapper@0.8.17) (2021-08-31)
 
 **Note:** Version bump only for package @times-components/interactive-wrapper

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@times-components/interactive-wrapper",
-  "version": "0.8.17",
+  "version": "0.8.18",
   "description": "Wrapper for legacy Interactive components",
-  "main": "dist/interactive-wrapper",
-  "dev": "src/interactive-wrapper",
+  "main": "dist/interactive-wrapper.web",
+  "dev": "src/interactive-wrapper.web",
   "scripts": {
     "depcheck": "depcheck --ignores='@babel/*,babel-*,depcheck,eslint,identity-obj-proxy,jest,prettier,webpack*' --ignore-bin-package=false --skip-missing",
     "fmt": "eslint . --fix && prettier --write '**/*.*'",
@@ -37,29 +37,25 @@
   "devDependencies": {
     "@babel/core": "7.4.4",
     "@times-components/eslint-config-thetimes": "0.8.17",
-    "@times-components/jest-configurator": "2.7.2",
-    "@times-components/jest-serializer": "3.2.26",
-    "@times-components/storybook": "4.1.66",
+    "@times-components/jest-configurator": "2.7.3",
+    "@times-components/jest-serializer": "3.2.27",
+    "@times-components/storybook": "4.1.67",
     "@times-components/test-utils": "2.3.9",
     "@times-components/webpack-configurator": "2.0.28",
     "babel-jest": "24.8.0",
     "enzyme": "3.9.0",
     "eslint": "5.9.0",
-    "fetch-mock": "8.3.1",
     "jest": "24.8.0",
     "prettier": "1.14.3",
     "react": "16.9.0",
     "react-dom": "16.9.0",
     "react-native": "0.61.5",
-    "react-test-renderer": "16.9.0",
     "webpack": "4.30.0",
     "webpack-cli": "3.3.1"
   },
   "dependencies": {
-    "@times-components/image": "6.8.6",
-    "@times-components/utils": "6.5.6",
-    "prop-types": "15.7.2",
-    "react-native-webview": "11.0.0"
+    "@times-components/image": "6.8.7",
+    "prop-types": "15.7.2"
   },
   "resolutions": {
     "react": "16.9.0",
@@ -74,5 +70,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "65ec0f0e97d8d020df94cb2bcb63eae9814da7af"
+  "gitHead": "e4ffceaf25ca396380a235406bf49c846731b2b4"
 }

package/dist/interactive-wrapper.android.js

@@ -1 +0,0 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _reactNativeWebview=require("react-native-webview");var _propTypes=_interopRequireDefault(require("prop-types"));var _webviewEventCallbackSetup=_interopRequireDefault(require("./webview-event-callback-setup"));var _responsiveImage=_interopRequireDefault(require("./responsive-image"));var _jsxFileName="/home/circleci/project/packages/interactive-wrapper/src/interactive-wrapper.android.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}function _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=(0,_getPrototypeOf2.default)(Derived),result;if(hasNativeReflectConstruct){var NewTarget=(0,_getPrototypeOf2.default)(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return(0,_possibleConstructorReturn2.default)(this,result);};}function _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}var editorialLambdaProtocol="https://";var editorialLambdaOrigin="jotn9sgpg6.execute-api.eu-west-1.amazonaws.com";var editorialLambdaSlug="prod/component";var InteractiveWrapper=function(_Component){(0,_inherits2.default)(InteractiveWrapper,_Component);var _super=_createSuper(InteractiveWrapper);function InteractiveWrapper(){var _this;(0,_classCallCheck2.default)(this,InteractiveWrapper);_this=_super.call(this);_this.state={height:_reactNative.Platform.OS==="ios"?0:50};_this.onMessage=_this.onMessage.bind((0,_assertThisInitialized2.default)(_this));_this.handleNavigationStateChange=_this.handleNavigationStateChange.bind((0,_assertThisInitialized2.default)(_this));_this.onLoadEnd=_this.onLoadEnd.bind((0,_assertThisInitialized2.default)(_this));return _this;}(0,_createClass2.default)(InteractiveWrapper,[{key:"onMessage",value:function onMessage(e){if(e&&e.nativeEvent&&e.nativeEvent.data||e.nativeEvent.data==="0"){var height=this.state.height;var newHeight=parseInt(e.nativeEvent.data,10);if(newHeight&&newHeight>height){var updateState=newHeight<30?{height:newHeight+30}:{height:newHeight};this.setState(updateState);}}else{console.error("Invalid height received "+e.nativeEvent.data);}}},{key:"onLoadEnd",value:function onLoadEnd(){if(this.webview){this.webview.postMessage("thetimes.co.uk","*");}}},{key:"handleNavigationStateChange",value:function handleNavigationStateChange(data){if(!data.url.includes("data:text/html")&&data.url.includes("http")&&!data.url.includes(editorialLambdaOrigin)){InteractiveWrapper.openURLInBrowser(data.url);return false;}return true;}},{key:"render",value:function render(){var _this2=this;var _this$props=this.props,_this$props$config=_this$props.config,dev=_this$props$config.dev,environment=_this$props$config.environment,platform=_this$props$config.platform,version=_this$props$config.version,id=_this$props.id;var height=this.state.height;var uri=""+editorialLambdaProtocol+editorialLambdaOrigin+"/"+editorialLambdaSlug+"/"+id+"?dev="+dev+"&env="+environment+"&platform="+platform+"&version="+version;var scriptToInjectIOS="window.postMessage = function(data) {window.ReactNativeWebView.postMessage(data);};("+_webviewEventCallbackSetup.default+")({window});";var scriptToInjectAndroid="\n      setTimeout(function() {\n        window.ReactNativeWebView.postMessage(document.documentElement.scrollHeight);\n      }, 500);\n      true;\n    ";var scriptToInject=_reactNative.Platform.OS==="ios"?scriptToInjectIOS:scriptToInjectAndroid;return _react.default.createElement(_reactNativeWebview.WebView,{injectedJavaScript:scriptToInject,onLoadEnd:this.onLoadEnd,onMessage:this.onMessage,ref:function ref(_ref){_this2.webview=_ref;},scrollEnabled:false,onShouldStartLoadWithRequest:this.handleNavigationStateChange,source:{uri:uri},style:{height:height},__source:{fileName:_jsxFileName,lineNumber:91,columnNumber:7}});}}],[{key:"openURLInBrowser",value:function openURLInBrowser(url){return _reactNative.Linking.canOpenURL(url).then(function(supported){if(!supported){return console.error("Cant open url",url);}return _reactNative.Linking.openURL(url);}).catch(function(err){return console.error("An error occurred",err);});}}]);return InteractiveWrapper;}(_react.Component);InteractiveWrapper.propTypes={config:_propTypes.default.shape({}),id:_propTypes.default.string.isRequired};InteractiveWrapper.defaultProps={config:{}};InteractiveWrapper.ResponsiveImageInteractive=_responsiveImage.default;var _default=InteractiveWrapper;exports.default=_default;

package/dist/interactive-wrapper.js

@@ -1 +0,0 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _reactNativeWebview=require("react-native-webview");var _propTypes=_interopRequireDefault(require("prop-types"));var _webviewEventCallbackSetup=_interopRequireDefault(require("./webview-event-callback-setup"));var _responsiveImage=_interopRequireDefault(require("./responsive-image"));var _jsxFileName="/home/circleci/project/packages/interactive-wrapper/src/interactive-wrapper.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}function _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=(0,_getPrototypeOf2.default)(Derived),result;if(hasNativeReflectConstruct){var NewTarget=(0,_getPrototypeOf2.default)(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return(0,_possibleConstructorReturn2.default)(this,result);};}function _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}var editorialLambdaProtocol="https://";var editorialLambdaOrigin="jotn9sgpg6.execute-api.eu-west-1.amazonaws.com";var editorialLambdaSlug="prod/component";var InteractiveWrapper=function(_Component){(0,_inherits2.default)(InteractiveWrapper,_Component);var _super=_createSuper(InteractiveWrapper);function InteractiveWrapper(){var _this;(0,_classCallCheck2.default)(this,InteractiveWrapper);_this=_super.call(this);_this.state={height:_reactNative.Platform.OS==="ios"?0:50};_this.onMessage=_this.onMessage.bind((0,_assertThisInitialized2.default)(_this));_this.handleNavigationStateChange=_this.handleNavigationStateChange.bind((0,_assertThisInitialized2.default)(_this));_this.onLoadEnd=_this.onLoadEnd.bind((0,_assertThisInitialized2.default)(_this));return _this;}(0,_createClass2.default)(InteractiveWrapper,[{key:"onMessage",value:function onMessage(e){if(e&&e.nativeEvent&&e.nativeEvent.data||e.nativeEvent.data==="0"){var height=this.state.height;var newHeight=parseInt(e.nativeEvent.data,10);if(newHeight&&newHeight>height){var updateState=newHeight<30?{height:newHeight+30}:{height:newHeight};this.setState(updateState);}}else{console.error("Invalid height received "+e.nativeEvent.data);}}},{key:"onLoadEnd",value:function onLoadEnd(){if(this.webview){this.webview.postMessage("thetimes.co.uk","*");}}},{key:"handleNavigationStateChange",value:function handleNavigationStateChange(data){if(!data.url.includes("data:text/html")&&data.url.includes("http")&&!data.url.includes(editorialLambdaOrigin)){InteractiveWrapper.openURLInBrowser(data.url);this.webview.reload();}}},{key:"render",value:function render(){var _this2=this;var _this$props=this.props,_this$props$config=_this$props.config,dev=_this$props$config.dev,environment=_this$props$config.environment,platform=_this$props$config.platform,version=_this$props$config.version,id=_this$props.id;var height=this.state.height;var uri=""+editorialLambdaProtocol+editorialLambdaOrigin+"/"+editorialLambdaSlug+"/"+id+"?dev="+dev+"&env="+environment+"&platform="+platform+"&version="+version;var scriptToInjectIOS="window.postMessage = function(data) {window.ReactNativeWebView.postMessage(data);};("+_webviewEventCallbackSetup.default+")({window});";var scriptToInjectAndroid="\n      setTimeout(function() {\n        window.ReactNativeWebView.postMessage(document.documentElement.scrollHeight);\n      }, 500);\n      true;\n    ";var scriptToInject=_reactNative.Platform.OS==="ios"?scriptToInjectIOS:scriptToInjectAndroid;return _react.default.createElement(_reactNativeWebview.WebView,{injectedJavaScript:scriptToInject,onLoadEnd:this.onLoadEnd,onMessage:this.onMessage,onNavigationStateChange:this.handleNavigationStateChange,ref:function ref(_ref){_this2.webview=_ref;},scrollEnabled:false,source:{uri:uri},style:{height:height},__source:{fileName:_jsxFileName,lineNumber:90,columnNumber:7}});}}],[{key:"openURLInBrowser",value:function openURLInBrowser(url){return _reactNative.Linking.canOpenURL(url).then(function(supported){if(!supported){return console.error("Cant open url",url);}return _reactNative.Linking.openURL(url);}).catch(function(err){return console.error("An error occurred",err);});}}]);return InteractiveWrapper;}(_react.Component);InteractiveWrapper.propTypes={config:_propTypes.default.shape({}),id:_propTypes.default.string.isRequired};InteractiveWrapper.defaultProps={config:{}};InteractiveWrapper.ResponsiveImageInteractive=_responsiveImage.default;var _default=InteractiveWrapper;exports.default=_default;

package/dist/responsive-image.ios.js

@@ -1 +0,0 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _regenerator=_interopRequireDefault(require("@babel/runtime/regenerator"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _utils=require("@times-components/utils");var _propTypes=_interopRequireDefault(require("prop-types"));var _jsxFileName="/home/circleci/project/packages/interactive-wrapper/src/responsive-image.ios.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}function _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=(0,_getPrototypeOf2.default)(Derived),result;if(hasNativeReflectConstruct){var NewTarget=(0,_getPrototypeOf2.default)(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return(0,_possibleConstructorReturn2.default)(this,result);};}function _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}var deckUrl=function deckUrl(id){return"https://gobble.timesdev.tools/deck/api/deck-post-action/"+id;};var ResponsiveImageInteractive=function(_Component){(0,_inherits2.default)(ResponsiveImageInteractive,_Component);var _super=_createSuper(ResponsiveImageInteractive);function ResponsiveImageInteractive(props){var _this;(0,_classCallCheck2.default)(this,ResponsiveImageInteractive);_this=_super.call(this,props);_this.state={image:undefined};return _this;}(0,_createClass2.default)(ResponsiveImageInteractive,[{key:"componentDidMount",value:function componentDidMount(){var deckId=this.props.deckId;if(deckId){this.getDeck(deckId);}}},{key:"getDeck",value:function getDeck(id){var _this2=this;var res,_await$res$json,data,images,image;return _regenerator.default.async(function getDeck$(_context){while(1){switch(_context.prev=_context.next){case 0:_context.next=2;return _regenerator.default.awrap(fetch(deckUrl(id),{headers:{"Content-Type":"application/json"}}));case 2:res=_context.sent;_context.next=5;return _regenerator.default.awrap(res.json());case 5:_await$res$json=_context.sent;data=_await$res$json.body.data;images=data.filter(function(dat){return dat.type==="image";}).map(function(d){return{uri:d.data.Image,width:parseInt(d.data.Size,10)};}).filter(function(d){return d.width<=(0,_utils.screenWidth)();}).sort(function(a,b){return a.width-b.width;});if(images.length){image=images[images.length-1];_reactNative.Image.getSize(image.uri,function(width,height){image.height=height;image.aspectRatio=width/height;_this2.setState({image:image});});}case 9:case"end":return _context.stop();}}},null,null,null,Promise);}},{key:"render",value:function render(){var image=this.state.image;if(image){return _react.default.createElement(_reactNative.ImageBackground,{source:image,imageStyle:{resizeMode:"contain"},style:{width:"100%",aspectRatio:image.aspectRatio},__source:{fileName:_jsxFileName,lineNumber:56,columnNumber:9}});}return _react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:63,columnNumber:12}});}}]);return ResponsiveImageInteractive;}(_react.Component);ResponsiveImageInteractive.propTypes={deckId:_propTypes.default.number.isRequired};var _default=ResponsiveImageInteractive;exports.default=_default;