import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
import _extends from "@babel/runtime-corejs3/helpers/extends";
import _Object$assign from "@babel/runtime-corejs3/core-js-stable/object/assign";
import _objectWithoutPropertiesLoose from "@babel/runtime-corejs3/helpers/objectWithoutPropertiesLoose";
// @flow
import React from 'react';
import TextField from './TextField';
import Autocomplete from '@material-ui/lab/Autocomplete';
import { makeStyles } from '@material-ui/core/styles';
/*:: import type { SelectableFieldValue, SelectOptions } from '../types'*/

const useStyles = makeStyles(theme => ({
  root: {
    flexGrow: 1,
    height: 250
  },
  container: {
    width: '100%'
  },
  paper: {
    position: 'absolute',
    zIndex: 1,
    marginTop: theme.spacing(1),
    left: 0,
    right: 0
  },
  chip: {
    margin: theme.spacing(0.5, 0.25)
  },
  inputRoot: {
    flexWrap: 'wrap'
  },
  inputInput: {
    width: 'auto',
    flexGrow: 1
  },
  divider: {
    height: theme.spacing(2)
  }
}));

function renderInput(inputProps) {
  const {
    InputProps,
    classes,
    ref
  } = inputProps,
        other = _objectWithoutPropertiesLoose(inputProps, ["InputProps", "classes", "ref"]);

  return /*#__PURE__*/React.createElement(TextField, _extends({
    InputProps: _Object$assign({
      inputRef: ref,
      classes: {
        root: classes.inputRoot,
        input: classes.inputInput
      }
    }, InputProps)
  }, other));
}
/*:: type Props = {
  id: string,
  value: SelectableFieldValue,
  placeholder?: string,
  onChange: (value: SelectableFieldValue) => any,
  options: SelectOptions
}*/


/**
 * A multi-select field that allows the user to enter a value that is not on the
 * list. Allows the selection of non-string values from a list, but the labels
 * for each item must be unique for this to work reliably
 */
export const SelectOne = (_ref) => {
  let {
    id,
    value,
    label,
    options,
    placeholder,
    onChange
  }
  /*: Props*/
  = _ref,
      props = _objectWithoutPropertiesLoose(_ref, ["id", "value", "label", "options", "placeholder", "onChange"]);

  const classes = useStyles();
  return /*#__PURE__*/React.createElement(Autocomplete, _extends({
    id: id,
    value: value,
    onChange: (e, v) => onChange(v),
    options: _mapInstanceProperty(options).call(options, op => typeof op === 'object' ? op.label : op),
    renderInput: params => renderInput(_Object$assign({}, params, {
      classes,
      label,
      placeholder
    }))
  }, props));
};
export const SelectMultiple = (_ref2) => {
  let {
    id,
    value,
    label,
    options,
    placeholder,
    onChange
  }
  /*: Props*/
  = _ref2,
      props = _objectWithoutPropertiesLoose(_ref2, ["id", "value", "label", "options", "placeholder", "onChange"]);

  const classes = useStyles();
  return /*#__PURE__*/React.createElement(Autocomplete, _extends({
    id: id,
    multiple: true,
    freeSolo: true,
    value: value || [],
    onChange: (e, v) => onChange(v),
    options: _mapInstanceProperty(options).call(options, op => typeof op === 'object' ? op.label : op),
    renderInput: params => renderInput(_Object$assign({}, params, {
      classes,
      label,
      placeholder
    }))
  }, props));
};
//# sourceMappingURL=Select.js.map