import React, { useState, useEffect } from 'react';
import { View, StyleSheet } from 'react-native';
import { NovaSolidPlacesPlacesHome2 as HomeIcon, NovaSolidStatusClose as CloseIcon } from '@coorpacademy/nova-icons';
import { useTemplateContext } from '../../template/app-review/template-context';
import Touchable from '../../hoc/touchable/index.native';
import HeaderBackIcon from '../header-back-icon/index.native';
export const HOME_ICON_HEIGHT = 20;
export const CLOSE_ICON_HEIGHT = 16;
export const BACK_ICON_HEIGHT = 20;
const createStyleSheet = (theme, statusBarHeight) => StyleSheet.create({
  container: {
    paddingLeft: theme.spacing.base
  },
  floating: {
    paddingTop: theme.spacing.base,
    position: 'absolute',
    top: statusBarHeight
  },
  noSafeArea: {
    top: 0
  }
});
const HeaderBackButton = props => {
  const templateContext = useTemplateContext();
  const [styleSheet, setStylesheet] = useState(null);
  const {
    theme,
    display: {
      statusBarHeight
    }
  } = templateContext;
  const {
    type,
    color = theme.colors.white,
    onPress,
    isFloating = true,
    noSafeArea = false,
    testID = 'default-header-back-button-test-id'
  } = props;
  useEffect(() => {
    const _stylesheet = createStyleSheet(theme, statusBarHeight);
    setStylesheet(_stylesheet);
  }, [theme, statusBarHeight]);
  if (!styleSheet) {
    return null;
  }
  return /*#__PURE__*/React.createElement(View, {
    style: [styleSheet.container, isFloating && styleSheet.floating, isFloating && noSafeArea && styleSheet.noSafeArea]
  }, /*#__PURE__*/React.createElement(Touchable, {
    testID: testID,
    onPress: onPress,
    analyticsID: "button-close"
  }, type === 'home' ? /*#__PURE__*/React.createElement(HomeIcon, {
    height: HOME_ICON_HEIGHT,
    width: HOME_ICON_HEIGHT,
    color: color
  }) : null, type === 'close' ? /*#__PURE__*/React.createElement(CloseIcon, {
    height: CLOSE_ICON_HEIGHT,
    width: CLOSE_ICON_HEIGHT,
    color: color
  }) : null, type === 'back' ? /*#__PURE__*/React.createElement(HeaderBackIcon, {
    height: BACK_ICON_HEIGHT,
    width: BACK_ICON_HEIGHT,
    color: color
  }) : null));
};
export default HeaderBackButton;
//# sourceMappingURL=index.native.js.map