native-forms-test/Forms/blocks/Image.js

Build your own forms, surveys and polls for your React Native apps.

var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard"),_interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray")),_react=_interopRequireWildcard(require("react")),_reactNative=require("react-native"),_theme=require("../theme"),_utils=require("../utils"),_ScalableImage=_interopRequireDefault(require("../components/ScalableImage")),_Dimensions$get=_reactNative.Dimensions.get("window"),width=_Dimensions$get.width,Image=function(a){var b=a.block,c=a.form,d=a.blockIndex,e=c.backgroundColor,f=void 0===e?_theme.colors.white:e,g=c.textColor,h=void 0===g?_theme.colors.primary:g,i=(0,_react.useState)(!1),j=(0,_slicedToArray2.default)(i,2),k=j[0],l=j[1],m=b.url,n=(0,_utils.lightOrDark)(f),o={backgroundColor:f,marginBottom:-1,borderBottomColor:"dark"===n?_theme.colors.darkgrey:_theme.colors.border,borderBottomWidth:1,borderBottomStyle:"solid",borderTopWidth:0===d?0:1,borderTopColor:"dark"===n?_theme.colors.darkgrey:_theme.colors.border,borderTopStyle:"solid"};return _react.default.createElement(_reactNative.View,{style:[o,styles.container]},_react.default.createElement(_reactNative.View,{style:styles.imageContainer},!k&&m?_react.default.createElement(_ScalableImage.default,{onError:function onError(){return l(!0)},width:500>width?width-20:_theme.MAX_FORM_WIDTH-20,source:{uri:m}}):_react.default.createElement(_reactNative.Text,{style:{color:h,fontSize:15}},"Image not found")))},styles=_reactNative.StyleSheet.create({container:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",position:"relative",width:"100%"},imageContainer:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",width:"100%",maxWidth:_theme.MAX_FORM_WIDTH,paddingVertical:20,paddingHorizontal:10}}),_default=(0,_react.memo)(Image);exports.default=_default;