mopinion-react-native-sdk/dist/components/Page.js

Collect in-app feedback with Mopinion for React Native. Built fully in React Native for optimal integration with your React Native app.

var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=Page;var _reactNative=require("react-native");var _FormContext=require("./FormContext");var _PageContainer=_interopRequireDefault(require("./PageContainer"));var _FormGroup=_interopRequireDefault(require("./FormGroup"));var _Buttons=require("./Buttons");var _utils=require("../utils");var _styles=require("../styles");var _jsxRuntime=require("react/jsx-runtime");function Page(props){var _formConfig$blocks$br,_breakBlock$propertie,_breakBlock$propertie2,_breakBlock$propertie3,_breakBlock$propertie4,_formConfig$propertie,_formConfig$propertie2,_breakBlock$propertie5;var theme=(0,_styles.useTheme)();var _props$pageBlocks=props.pageBlocks,pageBlocks=_props$pageBlocks===void 0?[]:_props$pageBlocks,pageNumber=props.pageNumber;var _useFormContext=(0,_FormContext.useFormContext)(),formConfig=_useFormContext.formConfig,loading=_useFormContext.loading,nextPage=_useFormContext.nextPage,prevPage=_useFormContext.prevPage,submit=_useFormContext.submit,showNavAutopostPages=_useFormContext.showNavAutopostPages,pages=_useFormContext.pages;var breakBlockId=formConfig.layout.filter(function(blockId){var _formConfig$blocks$bl;return((_formConfig$blocks$bl=formConfig.blocks[blockId])==null?void 0:_formConfig$blocks$bl.typeName)==='page_break';})[pageNumber-1];var breakBlock=(_formConfig$blocks$br=formConfig.blocks[breakBlockId])!=null?_formConfig$blocks$br:{};var isFirst=Number(pageNumber)===1;var isLast=Number((0,_utils.objectKeys)(formConfig.pageMap).slice(-1).pop())===Number(pageNumber);var pageCount=pages.length;var nextLabel=(_breakBlock$propertie=(_breakBlock$propertie2=breakBlock.properties)==null?void 0:_breakBlock$propertie2.nextLabel)!=null?_breakBlock$propertie:'Next';var prevLabel=isLast?formConfig.text.btnLastBackText:(_breakBlock$propertie3=(_breakBlock$propertie4=breakBlock.properties)==null?void 0:_breakBlock$propertie4.prevLabel)!=null?_breakBlock$propertie3:'Previous';var _ref=(_formConfig$propertie=(_formConfig$propertie2=formConfig.properties)==null?void 0:_formConfig$propertie2.advanced)!=null?_formConfig$propertie:{},hideNavigation=_ref.hideNavigation,hideSubNavigation=_ref.hideSubNavigation;var isAutopostablePage=!showNavAutopostPages.includes(pageNumber)&&(((_breakBlock$propertie5=breakBlock.properties)==null?void 0:_breakBlock$propertie5.autopost)||isLast&&formConfig.properties.advanced.lastPageAutoPost);var showPrev=!isFirst&&!hideSubNavigation;var showNext=!isLast&&pageCount>1&&!hideSubNavigation&&!isAutopostablePage;var showSubmit=isLast&&!hideNavigation&&!isAutopostablePage;return(0,_jsxRuntime.jsxs)(_PageContainer.default,{children:[pageBlocks.map(function(blockId,index){var block=formConfig.blocks[blockId];return(0,_jsxRuntime.jsx)(_FormGroup.default,{page:pageNumber,block:block,screenshotCheckboxLabel:formConfig.text.screenshotCheckboxLabel,screenshotCaption:formConfig.text.screenshotCaption,firstOnPage:index===0},blockId);}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.group,isFirst?{justifyContent:'flex-end'}:{}],children:[showPrev&&(0,_jsxRuntime.jsx)(_Buttons.PreviousButton,{text:prevLabel,buttonType:"prev",onPress:prevPage,icon:"angleLeft"}),showNext&&(0,_jsxRuntime.jsx)(_Buttons.ActionButton,{text:nextLabel,onPress:nextPage,icon:"angleRight"}),showSubmit&&(0,_jsxRuntime.jsx)(_Buttons.ActionButton,{text:formConfig.text.btnSubmitText,buttonType:"submit",onPress:submit,icon:"paperPlaneO",loading:loading,activityIndicatorColor:theme.actionButtonTextColor})]})]});}var styles=_reactNative.StyleSheet.create({fill:{flex:1,flexGrow:1,justifyContent:'space-between'},background:{backgroundColor:'#eee'},shadow:{shadowColor:'#000',shadowOpacity:0.225,shadowRadius:1,shadowOffset:{width:0,height:1},borderRadius:2},group:{flex:0,paddingTop:10,paddingBottom:10,overflow:'visible',marginLeft:10,marginRight:10,flexDirection:'row',justifyContent:'space-between'}});