import React, { useState } from 'react';
import {View , Text, TextInput, Button,StyleSheet} from 'react-native';
import { Icon } from 'react-native-elements'
import SketchPicker   from 'react-color';
export default function ColorEditor(props) {

	/*let [number , setNumber] = useState(props.number || '')
	let title = props.title || "Input";*/

	let [color, setColor] = useState(props.color || '');
	let title = props.title || "Input";
	return(
		<View style={styles.container}>
			<Text> Color Picker </Text>
	 		<SketchPicker 
	 		color={color}
	 		width="180px" onChangeComplete ={(color) =>{ 
	 		props.onChange && props.onChange(color.hex);
			setColor(color)
				}}/>
		 		
		</View>
		)

}

const styles = StyleSheet.create({
	container:{
		padding:10
	},
	defaultInput: {
		marginTop:6,
		borderWidth:1,
		width:100
	},
	title: {

	}
})