react-native-twopane-navigation/lib/module/components/paneRenderer/PaneRenderer.js

React Native package for dual screen devices navigation support (Surface Duo)

var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _interfaces=require("../../utilities/interfaces");var _reactNative=require("react-native");var _PaneHeaderContainer=_interopRequireDefault(require("../paneHeaderContainer/PaneHeaderContainer"));var _onePane=_interopRequireDefault(require("../../onePane/onePaneStore/onePane.methods"));var _react=_interopRequireWildcard(require("react"));var _twoPane=_interopRequireDefault(require("../../twoPane/twoPaneStore/twoPane.methods"));var _reactNativeDualscreeninfo=require("react-native-dualscreeninfo");var _utilityStore=require("../../shared/utilityStore/utilityStore.selectors");var _jsxFileName="C:\\Users\\adavi\\source\\repos\\react-native-dualscreen\\twopane-navigation\\src\\components\\paneRenderer\\PaneRenderer.tsx";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};if(i%2){ownKeys(Object(source),true).forEach(function(key){(0,_defineProperty2.default)(target,key,source[key]);});}else if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source));}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}}return target;}var PaneRenderer=function PaneRenderer(props){var defaultConfig=(0,_utilityStore.getUtilityStore)().config;var paneComponents=props.paneComponents,paneRects=props.paneRects,orientation=props.orientation;var firstPane=paneComponents[0];var isPaneOneExtended=function isPaneOneExtended(){var _firstPane$extensionO,_firstPane$extensionO2;if(firstPane.pane===_interfaces.paneType.ONE&&((_firstPane$extensionO=firstPane.extensionOptions)===null||_firstPane$extensionO===void 0?void 0:_firstPane$extensionO.isExtendedLandscape)&&(orientation===_reactNativeDualscreeninfo.DeviceOrientation.Landscape||orientation===_reactNativeDualscreeninfo.DeviceOrientation.LandscapeFlipped)){return true;}else if(firstPane.pane===_interfaces.paneType.ONE&&((_firstPane$extensionO2=firstPane.extensionOptions)===null||_firstPane$extensionO2===void 0?void 0:_firstPane$extensionO2.isExtendedPortrait)&&(orientation===_reactNativeDualscreeninfo.DeviceOrientation.Portrait||orientation===_reactNativeDualscreeninfo.DeviceOrientation.PortraitFlipped)){return true;}else{return false;}};var renderStyles=function renderStyles(pane,extensionOptions){if(pane===_interfaces.paneType.TWO){var _defaultConfig$twoPan5;if((orientation===_reactNativeDualscreeninfo.DeviceOrientation.Landscape||orientation===_reactNativeDualscreeninfo.DeviceOrientation.LandscapeFlipped)&&(extensionOptions===null||extensionOptions===void 0?void 0:extensionOptions.isExtendedLandscape)&&paneRects.length>1){var _defaultConfig$twoPan;return(0,_extends2.default)({},extendedStyles(paneRects[0],paneRects[0].height+paneRects[1].height).extendedPaneVertical,defaultConfig===null||defaultConfig===void 0?void 0:(_defaultConfig$twoPan=defaultConfig.twoPane)===null||_defaultConfig$twoPan===void 0?void 0:_defaultConfig$twoPan.paneBody);}else if((orientation===_reactNativeDualscreeninfo.DeviceOrientation.Portrait||orientation===_reactNativeDualscreeninfo.DeviceOrientation.PortraitFlipped)&&(extensionOptions===null||extensionOptions===void 0?void 0:extensionOptions.isExtendedPortrait)&&paneRects.length>1){var _defaultConfig$twoPan2;return(0,_extends2.default)({},extendedStyles(paneRects[0],paneRects[0].width*2).extendedPaneHorizontal,defaultConfig===null||defaultConfig===void 0?void 0:(_defaultConfig$twoPan2=defaultConfig.twoPane)===null||_defaultConfig$twoPan2===void 0?void 0:_defaultConfig$twoPan2.paneBody);}else if(paneRects.length>1){var _defaultConfig$twoPan4;if(isPaneOneExtended()){var _defaultConfig$twoPan3;return(0,_extends2.default)({},twoPaneStyles(paneRects[1]).paneOneExtended,defaultConfig===null||defaultConfig===void 0?void 0:(_defaultConfig$twoPan3=defaultConfig.twoPane)===null||_defaultConfig$twoPan3===void 0?void 0:_defaultConfig$twoPan3.paneBody);}return(0,_extends2.default)({},twoPaneStyles(paneRects[1]).twoPane,defaultConfig===null||defaultConfig===void 0?void 0:(_defaultConfig$twoPan4=defaultConfig.twoPane)===null||_defaultConfig$twoPan4===void 0?void 0:_defaultConfig$twoPan4.paneBody);}return(0,_extends2.default)({},twoPaneStyles(paneRects[0]).twoPaneManual,defaultConfig===null||defaultConfig===void 0?void 0:(_defaultConfig$twoPan5=defaultConfig.twoPane)===null||_defaultConfig$twoPan5===void 0?void 0:_defaultConfig$twoPan5.paneBody);}else{var _defaultConfig$onePan3;if((orientation===_reactNativeDualscreeninfo.DeviceOrientation.Landscape||orientation===_reactNativeDualscreeninfo.DeviceOrientation.LandscapeFlipped)&&(extensionOptions===null||extensionOptions===void 0?void 0:extensionOptions.isExtendedLandscape)&&paneRects.length>1){var _defaultConfig$onePan;return(0,_extends2.default)({},extendedStyles(paneRects[0],paneRects[0].height+paneRects[1].height).extendedPaneVertical,defaultConfig===null||defaultConfig===void 0?void 0:(_defaultConfig$onePan=defaultConfig.onePane)===null||_defaultConfig$onePan===void 0?void 0:_defaultConfig$onePan.paneBody);}else if((orientation===_reactNativeDualscreeninfo.DeviceOrientation.Portrait||orientation===_reactNativeDualscreeninfo.DeviceOrientation.PortraitFlipped)&&(extensionOptions===null||extensionOptions===void 0?void 0:extensionOptions.isExtendedPortrait)&&paneRects.length>1){var _defaultConfig$onePan2;return(0,_extends2.default)({},extendedStyles(paneRects[0],paneRects[0].width*2).extendedPaneHorizontal,defaultConfig===null||defaultConfig===void 0?void 0:(_defaultConfig$onePan2=defaultConfig.onePane)===null||_defaultConfig$onePan2===void 0?void 0:_defaultConfig$onePan2.paneBody);}return(0,_extends2.default)({},onePaneStyles(paneRects[0]).onePane,defaultConfig===null||defaultConfig===void 0?void 0:(_defaultConfig$onePan3=defaultConfig.onePane)===null||_defaultConfig$onePan3===void 0?void 0:_defaultConfig$onePan3.paneBody);}};var isComponentDisplayed=function isComponentDisplayed(component){var _paneOneComponents$po,_paneTwoComponents$po;var paneOneComponents=paneComponents.filter(function(x){return x.pane===_interfaces.paneType.ONE;});var paneTwoComponents=paneComponents.filter(function(x){return x.pane===_interfaces.paneType.TWO;});var isTopPaneOne=component.pane===_interfaces.paneType.ONE&&((_paneOneComponents$po=paneOneComponents.pop())===null||_paneOneComponents$po===void 0?void 0:_paneOneComponents$po.key)===component.key;var isTopPaneTwo=component.pane===_interfaces.paneType.TWO&&((_paneTwoComponents$po=paneTwoComponents.pop())===null||_paneTwoComponents$po===void 0?void 0:_paneTwoComponents$po.key)===component.key;if(paneRects.length===1&&isTopPaneOne||paneRects.length>1&&(isTopPaneOne||isTopPaneTwo&&!isPaneOneExtended())){return true;}else{return false;}};return _react.default.createElement(_react.Fragment,{__source:{fileName:_jsxFileName,lineNumber:165,columnNumber:9}},paneComponents.map(function(val){var _defaultConfig$onePan4,_defaultConfig$twoPan6,_defaultConfig$onePan5,_defaultConfig$twoPan7,_defaultConfig$onePan6,_defaultConfig$twoPan8,_defaultConfig$onePan7,_defaultConfig$twoPan9,_defaultConfig$onePan8,_defaultConfig$twoPan10;return _react.default.createElement(_reactNative.View,{key:val.key,__source:{fileName:_jsxFileName,lineNumber:168,columnNumber:21}},_react.default.createElement(_reactNative.View,{importantForAccessibility:isComponentDisplayed(val)?'auto':'no-hide-descendants',style:renderStyles(val.pane,val.extensionOptions),__source:{fileName:_jsxFileName,lineNumber:169,columnNumber:25}},_react.default.createElement(_reactNative.View,{style:generalStyles(_interfaces.paneType.ONE?(_defaultConfig$onePan4=defaultConfig.onePane)===null||_defaultConfig$onePan4===void 0?void 0:_defaultConfig$onePan4.paneHeader:(_defaultConfig$twoPan6=defaultConfig.twoPane)===null||_defaultConfig$twoPan6===void 0?void 0:_defaultConfig$twoPan6.paneHeader).header,__source:{fileName:_jsxFileName,lineNumber:177,columnNumber:29}},_react.default.createElement(_PaneHeaderContainer.default,{isGoBack:val.pane===_interfaces.paneType.ONE?paneComponents.filter(function(x){return x.pane===_interfaces.paneType.ONE;}).length>1:paneComponents.filter(function(x){return x.pane===_interfaces.paneType.TWO;}).length>1,screenHeader:val.header,goBack:function goBack(){return val.pane===_interfaces.paneType.ONE?_onePane.default.GoBack():_twoPane.default.GoBack();},configDefaultHeader:val.pane===_interfaces.paneType.ONE?(_defaultConfig$onePan5=defaultConfig.onePane)===null||_defaultConfig$onePan5===void 0?void 0:_defaultConfig$onePan5.paneHeader:(_defaultConfig$twoPan7=defaultConfig.twoPane)===null||_defaultConfig$twoPan7===void 0?void 0:_defaultConfig$twoPan7.paneHeader,configDefaultHeaderText:val.pane===_interfaces.paneType.ONE?(_defaultConfig$onePan6=defaultConfig.onePane)===null||_defaultConfig$onePan6===void 0?void 0:_defaultConfig$onePan6.paneHeaderText:(_defaultConfig$twoPan8=defaultConfig.twoPane)===null||_defaultConfig$twoPan8===void 0?void 0:_defaultConfig$twoPan8.paneHeaderText,configDefaultHeaderIcon:val.pane===_interfaces.paneType.ONE?(_defaultConfig$onePan7=defaultConfig.onePane)===null||_defaultConfig$onePan7===void 0?void 0:_defaultConfig$onePan7.paneHeaderIcon:(_defaultConfig$twoPan9=defaultConfig.twoPane)===null||_defaultConfig$twoPan9===void 0?void 0:_defaultConfig$twoPan9.paneHeaderIcon,__source:{fileName:_jsxFileName,lineNumber:186,columnNumber:33}})),_react.default.createElement(_reactNative.View,{style:generalStyles(_interfaces.paneType.ONE?(_defaultConfig$onePan8=defaultConfig.onePane)===null||_defaultConfig$onePan8===void 0?void 0:_defaultConfig$onePan8.paneHeader:(_defaultConfig$twoPan10=defaultConfig.twoPane)===null||_defaultConfig$twoPan10===void 0?void 0:_defaultConfig$twoPan10.paneHeader).body,__source:{fileName:_jsxFileName,lineNumber:223,columnNumber:29}},val.paneElement)));}));};var generalStyles=function generalStyles(headerConfigStyle){var _StyleSheet$flatten$h;return _reactNative.StyleSheet.create({header:{position:'absolute',top:0,width:'100%'},body:{position:'absolute',left:0,right:0,bottom:0,top:(_StyleSheet$flatten$h=_reactNative.StyleSheet.flatten(headerConfigStyle).height)!==null&&_StyleSheet$flatten$h!==void 0?_StyleSheet$flatten$h:56}});};var onePaneStyles=function onePaneStyles(paneRects){return _reactNative.StyleSheet.create({onePane:_objectSpread(_objectSpread({},_reactNative.StyleSheet.absoluteFillObject),{},{backgroundColor:'#f2f2f2',left:paneRects.x,height:paneRects.height,width:paneRects.width})});};var extendedStyles=function extendedStyles(paneRects,length){return _reactNative.StyleSheet.create({extendedPaneHorizontal:_objectSpread(_objectSpread({},_reactNative.StyleSheet.absoluteFillObject),{},{backgroundColor:'#f2f2f2',left:paneRects.x,height:paneRects.height,width:length+_reactNativeDualscreeninfo.DualScreenInfo.hingeWidth}),extendedPaneVertical:_objectSpread(_objectSpread({},_reactNative.StyleSheet.absoluteFillObject),{},{backgroundColor:'#f2f2f2',left:paneRects.x,height:length+_reactNativeDualscreeninfo.DualScreenInfo.hingeWidth,width:paneRects.width})});};var twoPaneStyles=function twoPaneStyles(paneRects){return _reactNative.StyleSheet.create({twoPane:_objectSpread(_objectSpread({flex:1},_reactNative.StyleSheet.absoluteFillObject),{},{backgroundColor:'#f2f2f2',left:paneRects.x,height:paneRects.height,width:paneRects.width,top:paneRects.y}),twoPaneManual:_objectSpread(_objectSpread({flex:1},_reactNative.StyleSheet.absoluteFillObject),{},{backgroundColor:'#f2f2f2',left:paneRects.width+_reactNativeDualscreeninfo.DualScreenInfo.hingeWidth,height:paneRects.height,width:paneRects.width}),paneOneExtended:{left:0,height:0,width:0,top:0}});};var _default=PaneRenderer;exports.default=_default;
//# sourceMappingURL=PaneRenderer.js.map