import React from 'react';
import { StyleSheet, Text, View, TextInput, Button } from 'react-native';

import Module from '../../lib/Module';
import Types from '../../lib/Types';

export default class BaseContainer extends Module {
	constructor(props) {
		super(props);
	}
	render() {
		let {
			selected,
			width,
			height,
			overflow,
			// margin, // cannot use margin no children
			// padding, // cannot use margin no children
			shadowColor,
			shadowWidth,
			shadowHeight,
			shadowOpacity,
			shadowRadius,
			backgroundColor,
			...restProps
		} = this.props;
		
		if(!backgroundColor) backgroundColor = '';
		if(!shadowColor) shadowColor = '';
		if(!shadowWidth) shadowWidth = 0;
		if(!shadowHeight) shadowHeight = 0;
		return (
		    <View {...restProps} style={{width, height, overflow , backgroundColor , shadowColor, shadowOffset:{width:shadowWidth,height:shadowHeight}, shadowOpacity: shadowOpacity, shadowRadius}}>
		    </View>
		);
	}
}


BaseContainer.Inputs = {
	width: new Types.Integer(),
	height: new Types.Integer(),
	overflow: new Types.Integer().require().default('hidden'),
	backgroundColor: new Types.Text().require().color(),
	// margin: new Types.Text().default('0'),
	// padding: new Types.Text().default('0'),
	shadowColor: new Types.Text().require().color().default(""),
	shadowWidth: new Types.Integer().require(),
	shadowHeight: new Types.Integer().require(),
	shadowOpacity: new Types.Real().default(0),
	// shadowElevation: new Types.Integer().default(5),
	shadowRadius: new Types.Integer().default(5)
}