import React from 'react';
import {
	Picker,
	TextInput,
} from '~comp';
import {
	TextInput as TextInput2,
	Picker as Picker2,
	Switch,
	Slider,
} from 'nixplay-ui-kit';
import PropTypes from 'prop-types';


export const pickerRenderer = (props) => {
	const {
		input: { value, onChange },
		meta,
		...otherProps
	} = props;
	return (
		<Picker
			{...otherProps}
			value={value}
			onChange={onChange}
			meta={meta}
		/>
	);
};

pickerRenderer.propTypes = {
	input: PropTypes.object.isRequired,
	meta: PropTypes.object.isRequired,
};


export const picker2Renderer = (props) => {
	const {
		input: { value, onChange },
		meta,
		refName,
		defaultValue,
		useDefaultValue,
		...otherProps
	} = props;
	const val = (() => {
		if (useDefaultValue && defaultValue) {
			return defaultValue;
		}
		return value;
	})();
	return (
		<Picker2
			{...otherProps}
			value={val}
			onChange={onChange}
			meta={meta}
			numberOfLines={props.setPickerNumberOfLines}
			ref={refName}
		/>
	);
};

picker2Renderer.propTypes = {
	input: PropTypes.object.isRequired,
	meta: PropTypes.object.isRequired,
	refName: PropTypes.func,
	defaultValue: PropTypes.string,
	useDefaultValue: PropTypes.bool,
	setPickerNumberOfLines: PropTypes.number,
};

picker2Renderer.defaultProps = {
	refName: () => {},
	defaultValue: '',
	useDefaultValue: false,
	setPickerNumberOfLines: 1,
};


export const textInputRenderer = (props) => {
	const {
		input: { value, onChange, ...otherInputProps },
		meta,
		...otherProps
	} = props;
	return (
		<TextInput
			{...otherProps}
			{...otherInputProps}
			value={value}
			onChangeText={onChange}
			meta={meta}
		/>
	);
};

textInputRenderer.propTypes = {
	input: PropTypes.object.isRequired,
	meta: PropTypes.object.isRequired,
};


export const textInput2Renderer = (props) => {
	const {
		input: { value, onChange, ...otherInputProps },
		meta,
		...otherProps
	} = props;
	return (
		<TextInput2
			{...otherProps}
			{...otherInputProps}
			value={value}
			onChangeText={onChange}
			meta={meta}
		/>
	);
};

textInput2Renderer.propTypes = {
	input: PropTypes.object.isRequired,
	meta: PropTypes.object.isRequired,
};


export const switchRenderer = (props) => {
	const {
		input: { value, onChange, ...otherInputProps },
		meta,
		...otherProps
	} = props;
	return (
		<Switch
			{...otherProps}
			{...otherInputProps}
			value={value}
			onValueChange={onChange}
			meta={meta}
		/>
	);
};

switchRenderer.propTypes = {
	input: PropTypes.object.isRequired,
	meta: PropTypes.object.isRequired,
};


export const sliderRenderer = (props) => {
	const {
		input: { value, onChange, ...otherInputProps },
		meta,
		...otherProps
	} = props;
	return (
		<Slider
			{...otherProps}
			{...otherInputProps}
			value={(value || 0)}
			onSlidingComplete={onChange}
			meta={meta}
		/>
	);
};

sliderRenderer.propTypes = {
	input: PropTypes.object.isRequired,
	meta: PropTypes.object.isRequired,
};

