How to use the @appbaseio/reactivecore/lib/utils/types.react function in @appbaseio/reactivecore

updateComponentProps: types.funcRequired,
	// component props
	className: types.string,
	componentId: types.stringRequired,
	data: types.dataNumberBox,
	dataField: types.stringRequired,
	defaultValue: types.number,
	value: types.number,
	innerClass: types.style,
	nestedField: types.string,
	labelPosition: types.labelPosition,
	onQueryChange: types.func,
	onValueChange: types.func,
	onChange: types.func,
	queryFormat: types.queryFormatNumberBox,
	react: types.react,
	style: types.style,
	title: types.title,
	URLParams: types.bool,
};

NumberBox.defaultProps = {
	className: null,
	labelPosition: 'left',
	queryFormat: 'gte',
	style: {},
	URLParams: false,
};

const mapStateToProps = (state, props) => ({
	selectedValue: state.selectedValues[props.componentId]
		? state.selectedValues[props.componentId].value

// component props
	beforeValueChange: types.func,
	className: types.string,
	componentId: types.stringRequired,
	customQuery: types.func,
	data: types.data,
	dataField: types.stringRequired,
	defaultValue: types.string,
	value: types.string,
	filterLabel: types.string,
	innerClass: types.style,
	nestedField: types.string,
	onQueryChange: types.func,
	onValueChange: types.func,
	onChange: types.func,
	react: types.react,
	showFilter: types.bool,
	showRadio: types.boolRequired,
	style: types.style,
	title: types.title,
	URLParams: types.bool,
	includeNullValues: types.bool,
};

SingleRange.defaultProps = {
	className: null,
	showFilter: true,
	showRadio: true,
	style: {},
	URLParams: false,
	includeNullValues: false,
};

updateComponentProps: types.funcRequired,
	// component props
	className: types.string,
	componentId: types.stringRequired,
	data: types.data,
	dataField: types.stringRequired,
	defaultValue: types.stringOrArray,
	value: types.stringOrArray,
	filterLabel: types.string,
	nestedField: types.string,
	innerClass: types.style,
	multiSelect: types.bool,
	onValueChange: types.func,
	onChange: types.func,
	onQueryChange: types.func,
	react: types.react,
	showFilter: types.bool,
	style: types.style,
	title: types.title,
	URLParams: types.bool,
};

ToggleButton.defaultProps = {
	className: null,
	multiSelect: true,
	showFilter: true,
	style: {},
	URLParams: false,
};

const mapStateToProps = (state, props) => ({
	selectedValue:

promotedResults: types.hits,
	isLoading: types.bool,
	selectedValue: types.selectedValue,
	setComponentProps: types.funcRequired,
	updateComponentProps: types.funcRequired,
	// component props
	children: types.func,
	componentId: types.stringRequired,
	defaultQuery: types.func,
	customQuery: types.func,
	defaultValue: types.any, // eslint-disable-line
	value: types.any, // eslint-disable-line
	filterLabel: types.string,
	onQueryChange: types.func,
	onError: types.func,
	react: types.react,
	render: types.func,
	showFilter: types.bool,
	URLParams: types.bool,
	onData: types.func,
};

const mapStateToProps = (state, props) => ({
	aggregations:
		(state.aggregations[props.componentId] && state.aggregations[props.componentId]) || null,
	aggregationData: state.compositeAggregations[props.componentId] || [],
	hits: (state.hits[props.componentId] && state.hits[props.componentId].hits) || [],
	selectedValue:
		(state.selectedValues[props.componentId]
			&& state.selectedValues[props.componentId].value)
		|| null,
	isLoading: state.isLoading[props.componentId],

error: types.title,
	innerClass: types.style,
	innerRef: types.func,
	loader: types.title,
	mapProps: types.props,
	markerProps: types.props,
	markers: types.children,
	renderAllData: types.func,
	renderData: types.func,
	renderError: types.title,
	onPageChange: types.func,
	onError: types.func,
	onPopoverClick: types.func,
	pages: types.number,
	pagination: types.bool,
	react: types.react,
	searchAsMove: types.bool,
	showMapStyles: types.bool,
	showMarkerClusters: types.bool,
	showMarkers: types.bool,
	showSearchAsMove: types.bool,
	size: types.number,
	sortBy: types.sortBy,
	stream: types.bool,
	streamAutoCenter: types.bool,
	style: types.style,
	URLParams: types.bool,
	defaultRadius: types.number,
	unit: types.string,
	autoClosePopover: types.bool,
	renderMap: types.func,
	updaterKey: types.number,

filterLabel: types.string,
	icon: types.children,
	iconPosition: types.iconPosition,
	innerClass: types.style,
	innerRef: types.func,
	nestedField: types.string,
	onBlur: types.func,
	onChange: types.func,
	onFocus: types.func,
	onKeyDown: types.func,
	onKeyPress: types.func,
	onKeyUp: types.func,
	onQueryChange: types.func,
	onValueChange: types.func,
	placeholder: types.string,
	react: types.react,
	setQueryOptions: types.funcRequired,
	value: types.selectedValue,
	showFilter: types.bool,
	showIcon: types.bool,
	style: types.style,
	theme: types.style,
	title: types.title,
	unit: types.string,
	URLParams: types.bool,
	serviceOptions: types.props,
};

GeoDistanceDropdown.defaultProps = {
	className: null,
	placeholder: 'Select a value',
	showFilter: true,

infiniteScroll: types.bool,
	listClass: types.string,
	loader: types.title,
	render: types.func,
	renderItem: types.func,
	renderError: types.title,
	renderPagination: types.func,
	onData: types.func,
	renderNoResults: types.title,
	onPageChange: types.func,
	onPageClick: types.func,
	pages: types.number,
	pagination: types.bool,
	paginationAt: types.paginationAt,
	showEndPage: types.bool,
	react: types.react,
	renderResultStats: types.func,
	scrollOnChange: types.bool,
	scrollTarget: types.string,
	showLoader: types.bool,
	showResultStats: types.bool,
	size: types.number,
	sortBy: types.sortBy,
	sortOptions: types.sortOptions,
	stream: types.bool,
	style: types.style,
	URLParams: types.bool,
	defaultSortOption: types.string,
	afterKey: types.props,
};

ReactiveList.defaultProps = {

dayPickerInputProps: types.props,
	defaultValue: types.date,
	value: types.date,
	filterLabel: types.string,
	focused: types.bool,
	initialMonth: types.dateObject,
	innerClass: types.style,
	numberOfMonths: types.number,
	onQueryChange: types.func,
	onValueChange: types.func,
	onChange: types.func,
	placeholder: types.string,
	parseDate: types.func,
	nestedField: types.string,
	queryFormat: types.queryFormatDate,
	react: types.react,
	showClear: types.bool,
	showFilter: types.bool,
	style: types.style,
	theme: types.style,
	title: types.string,
};

DatePicker.defaultProps = {
	clickUnselectsDay: true,
	numberOfMonths: 1,
	placeholder: 'Select Date',
	showClear: true,
	showFilter: true,
	queryFormat: 'epoch_millis',
};

defaultZoom: types.number,
	innerClass: types.style,
	innerStyle: types.style,
	innerProps: types.props,
	innerRef: types.func,
	loader: types.title,
	mapProps: types.props,
	markerProps: types.props,
	markers: types.children,
	onAllData: types.func,
	onData: types.func,
	onPageChange: types.func,
	onPopoverClick: types.func,
	pages: types.number,
	pagination: types.bool,
	react: types.react,
	showMapStyles: types.bool,
	showMarkerClusters: types.bool,
	showMarkers: types.bool,
	size: types.number,
	sortBy: types.sortBy,
	sortOptions: types.sortOptions,
	stream: types.bool,
	streamAutoCenter: types.bool,
	style: types.style,
	URLParams: types.bool,
};

ReactiveMap.defaultProps = {
	size: 10,
	style: {},
	pages: 5,

onChange: function onChange(e) {
					return _this2.setValue(e.target.value);
				},
				value: this.state.currentValue
			})
		);
	};

	return TextField;
}(Component);

TextField.propTypes = {
	addComponent: types.addComponent,
	componentId: types.componentId,
	defaultSelected: types.string,
	react: types.react,
	removeComponent: types.removeComponent,
	dataField: types.dataField,
	title: types.title,
	beforeValueChange: types.beforeValueChange,
	onValueChange: types.onValueChange,
	customQuery: types.customQuery,
	onQueryChange: types.onQueryChange,
	updateQuery: types.updateQuery,
	placeholder: types.placeholder,
	selectedValue: types.selectedValue,
	setValue: types.setValue,
	filterLabel: types.string
};

TextField.defaultProps = {
	placeholder: "Search"