react-form-in-second/dist/form/select.js

make form easily, no more painful

'use strict';

Object.defineProperty(exports, "__esModule", {
	value: true
});

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var OptionItem = function OptionItem(_ref) {
	var value = _ref.value,
	    label = _ref.label,
	    children = _ref.children;


	if (Array.isArray(children) && children.length) {

		return React.createElement(
			'optgroup',
			{ label: label },
			children.map(function (item) {
				return React.createElement(OptionItem, _extends({}, item, { key: item.value }));
			})
		);
	}

	return React.createElement(
		'option',
		{ value: value },
		label
	);
};

var Select = function Select(props) {

	var fields = ['name', 'value', 'disabled', 'multiple', 'placeholder', 'required'];

	var onChangeVal = function onChangeVal(evt) {
		var _evt$target = evt.target,
		    name = _evt$target.name,
		    value = _evt$target.value,
		    onChange = props.onChange,
		    multiple = props.multiple;


		if (multiple) {

			value = [];

			var _iteratorNormalCompletion = true;
			var _didIteratorError = false;
			var _iteratorError = undefined;

			try {
				for (var _iterator = evt.target.options[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
					var opt = _step.value;


					if (opt.selected) value.push(opt.value);
				}
			} catch (err) {
				_didIteratorError = true;
				_iteratorError = err;
			} finally {
				try {
					if (!_iteratorNormalCompletion && _iterator.return) {
						_iterator.return();
					}
				} finally {
					if (_didIteratorError) {
						throw _iteratorError;
					}
				}
			}
		}

		if (typeof onChange === 'function') onChange(name, value);
	};

	var attrs = {
		className: 'form-control ' + (props.inputClassName || ' '),
		onChange: onChangeVal
	};

	fields.forEach(function (field) {

		attrs[field] = props[field];
	});

	if (props.multiple && !Array.isArray(attrs.value)) {

		attrs.value = [];
	};

	var renderOptions = function renderOptions() {
		var options = props.options;


		return Array.isArray(options) && options.map(function (item) {
			return React.createElement(OptionItem, _extends({}, item, { key: item.value }));
		});
	};

	return React.createElement(
		'select',
		attrs,
		renderOptions()
	);
};

var SelectWrapper = function SelectWrapper(props) {
	var className = props.className,
	    label = props.label,
	    error = props.error,
	    children = props.children;


	return React.createElement(
		'div',
		{ className: 'form-group ' + (className || '') },
		React.createElement(
			'label',
			null,
			label
		),
		React.createElement(Select, props),
		children,
		error && React.createElement(
			'span',
			{ className: 'error' },
			error
		)
	);
};

exports.default = SelectWrapper;