22 lines
600 B
TypeScript
22 lines
600 B
TypeScript
|
import CheckIcon from '@mui/icons-material/Check';
|
||
|
|
import Avatar from '@mui/joy/Avatar';
|
||
|
|
import Box from '@mui/joy/Box';
|
||
|
|
import Chip from '@mui/joy/Chip';
|
||
|
|
|
||
|
|
export default function ClickableChip() {
|
||
|
|
return (
|
||
|
|
<Box sx={{ display: 'flex', gap: 1, alignItems: 'center' }}>
|
||
|
|
<Chip
|
||
|
|
variant="outlined"
|
||
|
|
color="neutral"
|
||
|
|
size="lg"
|
||
|
|
startDecorator={<Avatar size="sm" src={`/static/images/avatar/1.jpg`} />}
|
||
|
|
endDecorator={<CheckIcon fontSize="md" />}
|
||
|
|
onClick={() => alert('You clicked the Joy Chip!')}
|
||
|
|
>
|
||
|
|
Mark
|
||
|
|
</Chip>
|
||
|
|
</Box>
|
||
|
|
);
|
||
|
|
}
|