function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

import React from 'react';
import { StyleSheet } from 'react-native';
import { Box } from '../../primitives';
import { isNil } from 'lodash';

const AspectRatio = ({
  style,
  ratio,
  children,
  ...props
}) => {
  let computedStyle = style; // DOC:  It uses a aspectRatio property of React Native

  let aspectRatio = !isNil(ratio) ? ratio : 4 / 3;
  computedStyle = StyleSheet.flatten([style, {
    aspectRatio
  }]);
  let newChildWithProps = /*#__PURE__*/React.cloneElement(children, { ...children.props,
    ...{
      position: 'absolute',
      top: 0,
      bottom: 0,
      right: 0,
      left: 0
    }
  }, children.props.children);
  return /*#__PURE__*/React.createElement(Box, _extends({}, props, {
    style: computedStyle
  }), newChildWithProps);
};

export default AspectRatio;
//# sourceMappingURL=index.js.map