@krowdy-ui/views/es/ReferentInput/ReferentInput.js

React components that implement Google's Material Design.

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
import React from 'react';
import { TextField as MuiTextField, withStyles } from '@material-ui/core';
import clsx from 'clsx';
import PropTypes from 'prop-types';
export const styles = theme => ({
  filled: {
    backgroundColor: theme.palette.secondary[10]
  },
  input: {
    '&::placeholder': {
      color: theme.palette.grey[600],
      opacity: 1
    },
    padding: theme.spacing(.5, 0)
  },
  inputSelect: {
    backgroundColor: 'red'
  },
  root: {
    borderRadius: theme.shape.borderRadius,
    color: 'inherit',
    fontSize: 10,
    padding: theme.spacing(.5, .75)
  },
  unPadding: {
    padding: 0
  },
  unPaddingInput: {
    '&::placeholder': {
      color: theme.palette.grey[600],
      opacity: 1
    },
    padding: theme.spacing(.25, .5)
  }
});

const ReferentInput = _ref => {
  let {
    filled,
    unPadding,
    classes
  } = _ref,
      props = _objectWithoutPropertiesLoose(_ref, ["filled", "unPadding", "classes"]);

  return /*#__PURE__*/React.createElement(MuiTextField, _extends({
    inputProps: {
      autoComplete: `new-${props.name}`
    },
    InputProps: _extends({}, props.InputProps, {
      className: clsx(filled && classes.filled),
      classes: {
        input: clsx(classes.input, unPadding && classes.unPaddingInput),
        root: clsx(classes.root, unPadding && classes.unPadding)
      },
      disableUnderline: true
    })
  }, props));
};

process.env.NODE_ENV !== "production" ? ReferentInput.propTypes = _extends({}, MuiTextField.propTypes, {
  classes: PropTypes.shape(_extends({}, MuiTextField.propTypes.classes, {
    filled: PropTypes.string,
    unPadding: PropTypes.string,
    unPaddingInput: PropTypes.string
  })),
  filled: PropTypes.bool,
  unPadding: PropTypes.bool
}) : void 0;
export default withStyles(styles, {
  name: 'ReferentInput'
})(ReferentInput);