react-standalone-form-mui/lib/FormControl.js

The Material UI suite for react-standalone-form library.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _classnames = _interopRequireDefault(require("classnames"));

var _FormControl = _interopRequireDefault(require("@material-ui/core/FormControl"));

var _FormHelperText = _interopRequireDefault(require("@material-ui/core/FormHelperText"));

var _InputLabel = _interopRequireDefault(require("@material-ui/core/InputLabel"));

var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));

var _styles = require("@material-ui/core/styles");

var _reactStandaloneForm = require("react-standalone-form");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _extends() { _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; }; return _extends.apply(this, arguments); }

const withFormControl = InputComponent => _ref => {
  let {
    name,
    label,
    initialValue,
    type,
    help,
    className,
    addon,
    narrow,
    large,
    variant,
    noBottomGutter,
    fullWidth,
    disabled,
    ...otherProps
  } = _ref;
  const classes = useStyles();
  return /*#__PURE__*/_react.default.createElement(_reactStandaloneForm.FormConsumer, null, _ref2 => {
    let {
      fieldsData,
      setValue
    } = _ref2;
    if (!fieldsData[name]) return null;
    const {
      value,
      validation,
      required,
      help: fieldsDataHelp
    } = fieldsData[name];
    const logicProps = {
      name,
      initialValue,
      required,
      type,
      setValue
    };
    const inputProps = {
      name,
      value: (value !== null ? value : initialValue) || '',
      required,
      type,
      setValue,
      addon,
      ...otherProps
    };
    const shrinkLabel = type && (type.includes('date') || type.includes('time')) || InputComponent.displayName && ['Slider', 'MultiFormInput', 'Geocode'].find(item => InputComponent.displayName.includes(item)) ? {
      shrink: true
    } : {};
    return /*#__PURE__*/_react.default.createElement(_reactStandaloneForm.FormControlLogic, logicProps, /*#__PURE__*/_react.default.createElement(_FormControl.default, {
      error: validation === 'error',
      className: (0, _classnames.default)(classes.root, {
        [classes.noBottomGutter]: noBottomGutter,
        [className]: className
      }),
      fullWidth: fullWidth,
      variant: variant,
      disabled: disabled
    }, label ? InputComponent.displayName && ['Checkbox', 'Radio', 'Wysiwyg'].find(item => InputComponent.displayName.includes(item)) ? /*#__PURE__*/_react.default.createElement(_Typography.default, {
      variant: "h6"
    }, label) : label && /*#__PURE__*/_react.default.createElement(_InputLabel.default, _extends({
      htmlFor: name
    }, shrinkLabel), label) : null, /*#__PURE__*/_react.default.createElement(InputComponent, inputProps), (fieldsDataHelp || help) && /*#__PURE__*/_react.default.createElement(_FormHelperText.default, null, fieldsDataHelp || help)));
  });
};

const useStyles = (0, _styles.makeStyles)(theme => ({
  root: {
    maxWidth: "100%",
    display: 'flex'
  },
  noBottomGutter: {
    marginBottom: 0
  }
}));
withFormControl.propTypes = {
  name: _propTypes.default.string.isRequired,
  label: _propTypes.default.node,
  className: _propTypes.default.string,
  addon: _propTypes.default.node,
  help: _propTypes.default.string,
  disabled: _propTypes.default.bool,
  validation: _propTypes.default.oneOf(['success', 'error']),
  narrow: _propTypes.default.bool,
  large: _propTypes.default.bool,
  noBottomGutter: _propTypes.default.bool,
  initialValue: _propTypes.default.any,
  required: _propTypes.default.bool,
  setValue: _propTypes.default.func.isRequired,
  children: _propTypes.default.node.isRequired
};
var _default = withFormControl;
exports.default = _default;