Connect label to select input

Signed-off-by: Claudia Bressi <cbressi@vmware.com>
This commit is contained in:
Claudia Bressi
2022-05-05 13:36:26 +02:00
parent f36a3c7cb5
commit 76df16c817
@@ -19,6 +19,7 @@ import Chip from '@material-ui/core/Chip';
import ClickAwayListener from '@material-ui/core/ClickAwayListener';
import FormControl from '@material-ui/core/FormControl';
import InputBase from '@material-ui/core/InputBase';
import InputLabel from '@material-ui/core/InputLabel';
import MenuItem from '@material-ui/core/MenuItem';
import Select from '@material-ui/core/Select';
import {
@@ -87,6 +88,16 @@ const useStyles = makeStyles(
color: theme.palette.text.primary,
},
},
formLabel: {
transform: 'initial',
fontWeight: 'bold',
fontSize: 14,
fontFamily: theme.typography.fontFamily,
color: theme.palette.text.primary,
'&.Mui-focused': {
color: theme.palette.text.primary,
},
},
chips: {
display: 'flex',
flexWrap: 'wrap',
@@ -184,9 +195,10 @@ export function SelectComponent(props: SelectProps) {
return (
<div className={classes.root}>
<Typography variant="button">{label}</Typography>
{/* <Typography variant="button">{label}</Typography> */}
<ClickAwayListener onClickAway={handleClickAway}>
<FormControl className={classes.formControl}>
<InputLabel className={classes.formLabel}>{label}</InputLabel>
<Select
value={value}
native={native}
@@ -198,6 +210,8 @@ export function SelectComponent(props: SelectProps) {
onClick={handleClick}
open={isOpen}
input={<BootstrapInput />}
label={label}
tabIndex={0}
renderValue={s =>
multiple && (value as any[]).length !== 0 ? (
<div className={classes.chips}>