import React from "react"; import Select from "@material-ui/core/Select"; import { makeStyles } from "@material-ui/core/styles"; import Input from "@material-ui/core/Input"; import InputLabel from "@material-ui/core/InputLabel"; import MenuItem from "@material-ui/core/MenuItem"; import FormControl from "@material-ui/core/FormControl"; import KeyboardArrowDownIcon from "@material-ui/icons/KeyboardArrowDown"; import "./index.scss"; export default function MultipleSelector(props) { const useStyles = makeStyles((theme) => ({ root: { "& .MuiTextField-root": { width: "100%", position: "relative", marginRight: 10, "& input": { textAlign: props.align, direction: props.align === "right" ? "rtl" : "ltr", }, }, }, })); const classes = useStyles(); const { parent, name, label, options, selectedOptions } = props; return ( <> {window.innerWidth < 1000 ? ( {label} } variant="outlined" > {options.map((name, i) => ( {name} ))} ) : null} {window.innerWidth > 1000 ? ( {label} } variant="outlined" > {options.map((name, i) => ( {name} ))} ) : null} ); }