45 lines
1.2 KiB
JavaScript
45 lines
1.2 KiB
JavaScript
|
import Box from '@mui/joy/Box';
|
||
|
|
import IconButton from '@mui/joy/IconButton';
|
||
|
|
import Input from '@mui/joy/Input';
|
||
|
|
import KeyRoundedIcon from '@mui/icons-material/KeyRounded';
|
||
|
|
import VisibilityRoundedIcon from '@mui/icons-material/VisibilityRounded';
|
||
|
|
|
||
|
|
export default function InputIntegration() {
|
||
|
|
return (
|
||
|
|
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
|
||
|
|
<Input
|
||
|
|
size="sm"
|
||
|
|
startDecorator={<KeyRoundedIcon />}
|
||
|
|
placeholder="Password"
|
||
|
|
type="password"
|
||
|
|
endDecorator={
|
||
|
|
<IconButton color="neutral">
|
||
|
|
<VisibilityRoundedIcon />
|
||
|
|
</IconButton>
|
||
|
|
}
|
||
|
|
/>
|
||
|
|
<Input
|
||
|
|
startDecorator={<KeyRoundedIcon />}
|
||
|
|
placeholder="Password"
|
||
|
|
type="password"
|
||
|
|
endDecorator={
|
||
|
|
<IconButton color="neutral">
|
||
|
|
<VisibilityRoundedIcon />
|
||
|
|
</IconButton>
|
||
|
|
}
|
||
|
|
/>
|
||
|
|
<Input
|
||
|
|
size="lg"
|
||
|
|
startDecorator={<KeyRoundedIcon />}
|
||
|
|
placeholder="Password"
|
||
|
|
type="password"
|
||
|
|
endDecorator={
|
||
|
|
<IconButton color="neutral">
|
||
|
|
<VisibilityRoundedIcon />
|
||
|
|
</IconButton>
|
||
|
|
}
|
||
|
|
/>
|
||
|
|
</Box>
|
||
|
|
);
|
||
|
|
}
|