mapwize-ui-react-native/lib/module/components/bottomview/bottomViewDirection.js

Fully featured and ready to use UI to add Mapwize Indoor Maps and Navigation in your React Native app.

import React from 'react';
import { Image, StyleSheet, Text, View } from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';
import icons from '../../icons';

const BottomViewDirection = ({
  durationLabel,
  distanceLabel,
  errorLabel,
  mainColor = '#F23196'
}) => {
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SafeAreaView, {
    style: styles.bottomViewDirection,
    edges: ['bottom']
  }, errorLabel && /*#__PURE__*/React.createElement(Text, {
    style: styles.errorLabel
  }, errorLabel), !errorLabel && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
    style: {
      flexDirection: 'row',
      alignItems: 'center',
      justifyContent: 'center'
    }
  }, /*#__PURE__*/React.createElement(Image, {
    source: icons.CLOCK,
    style: {
      tintColor: mainColor,
      marginRight: 8
    }
  }), /*#__PURE__*/React.createElement(Text, {
    style: (styles.duration, {
      color: mainColor
    })
  }, durationLabel)), /*#__PURE__*/React.createElement(View, {
    style: {
      flexDirection: 'row',
      alignItems: 'center',
      justifyContent: 'center'
    }
  }, /*#__PURE__*/React.createElement(Image, {
    source: icons.WALK,
    style: {
      tintColor: mainColor,
      marginRight: 8
    }
  }), /*#__PURE__*/React.createElement(Text, {
    style: (styles.distanceLabel, {
      color: mainColor
    })
  }, distanceLabel)))));
};

const styles = StyleSheet.create({
  bottomViewDirection: {
    padding: 16,
    flexDirection: 'row',
    backgroundColor: 'white',
    justifyContent: 'space-evenly',
    elevation: 8,
    zIndex: 8,
    shadowOffset: {
      width: 0,
      height: -1
    },
    shadowOpacity: 0.2,
    shadowRadius: 2,
    borderTopEndRadius: 8,
    borderTopStartRadius: 8
  },
  duration: {
    margin: 2,
    borderRadius: 32,
    padding: 16,
    backgroundColor: 'white'
  },
  distanceLabel: {
    margin: 2,
    borderRadius: 32,
    padding: 16,
    backgroundColor: 'white'
  },
  errorLabel: {
    margin: 2,
    borderRadius: 32,
    padding: 16,
    backgroundColor: 'white'
  }
});
export default BottomViewDirection;
//# sourceMappingURL=bottomViewDirection.js.map