import { Animated, Dimensions, View } from 'react-native';
import styled from '@emotion/native';

const StyledWrapper = styled(Animated.View)({
  margin: 0,
  padding: 0,
  overflow: 'hidden',
});

/**
 * Height need to be high enough to cover most scenario
 * This container's purpose is only to help get correct children height and returns it
 * to use with Animated.timing
 */
const StyledHiddenWrapper = styled(View)(() => ({
  height: Dimensions.get('window').height,
}));

const StyledChildWrapper = styled(View)({
  margin: 0,
  padding: 0,
});

export { StyledWrapper, StyledHiddenWrapper, StyledChildWrapper };