import React, { forwardRef } from "react"
import PropTypes from "prop-types"
import Input from './input'
import Filter from './filter'

const TYPES = {
  input: Input,
  filter: Filter
}


const MultiSelect = forwardRef(({
  type = "input",
  ...props
}, forwardedRef) => {
  if(props.create) type = "input"
  const Component = TYPES[type]

  return <Component {...props} ref={forwardedRef} />
})


export default MultiSelect

MultiSelect.propTypes = {
  type: PropTypes.oneOf(Object.keys(TYPES)),
  name: PropTypes.string,
  className: PropTypes.string,
  options: PropTypes.array.isRequired,
  value: PropTypes.array,
  label: PropTypes.node,
  placeholder: PropTypes.string,
  onChange: PropTypes.func,
  filter: PropTypes.func,
  error: PropTypes.bool,
  disabled: PropTypes.bool,
  /** With type="input", this allows to add a new option. When a string, it overrides default prefix */
  create: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
  "aria-label": PropTypes.string,
  "aria-labelledby": PropTypes.string,
}
