005cf56baf
Some checks failed
No response / noResponse (push) Has been cancelled
CI / Continuous releases (push) Has been cancelled
CI / test-dev (macos-latest) (push) Has been cancelled
CI / test-dev (ubuntu-latest) (push) Has been cancelled
CI / test-dev (windows-latest) (push) Has been cancelled
Maintenance / main (push) Has been cancelled
Scorecards supply-chain security / Scorecards analysis (push) Has been cancelled
CodeQL / Analyze (push) Has been cancelled
79 lines
2.6 KiB
TypeScript
79 lines
2.6 KiB
TypeScript
import TextField from '@mui/material/TextField';
|
|
import Autocomplete from '@mui/material/Autocomplete';
|
|
import Chip from '@mui/material/Chip';
|
|
import Stack from '@mui/material/Stack';
|
|
|
|
export default function CustomSingleValueRendering() {
|
|
return (
|
|
<Stack spacing={3} sx={{ width: 500 }}>
|
|
<Autocomplete
|
|
options={top100Films}
|
|
getOptionLabel={(option) => option.title}
|
|
renderValue={(value, getItemProps) => (
|
|
<Chip label={value.title} {...getItemProps()} />
|
|
)}
|
|
renderInput={(params) => <TextField {...params} label="Movie" />}
|
|
/>
|
|
<Autocomplete
|
|
options={top100Films.map((option) => option.title)}
|
|
freeSolo
|
|
renderValue={(value, getItemProps) => (
|
|
<Chip label={value} {...getItemProps()} />
|
|
)}
|
|
renderInput={(params) => <TextField {...params} label="freeSolo" />}
|
|
/>
|
|
</Stack>
|
|
);
|
|
}
|
|
|
|
// Top 100 films as rated by IMDb users. http://www.imdb.com/chart/top
|
|
const top100Films = [
|
|
{ title: 'The Shawshank Redemption', year: 1994 },
|
|
{ title: 'The Godfather', year: 1972 },
|
|
{ title: 'The Godfather: Part II', year: 1974 },
|
|
{ title: 'The Dark Knight', year: 2008 },
|
|
{ title: '12 Angry Men', year: 1957 },
|
|
{ title: "Schindler's List", year: 1993 },
|
|
{ title: 'Pulp Fiction', year: 1994 },
|
|
{
|
|
title: 'The Lord of the Rings: The Return of the King',
|
|
year: 2003,
|
|
},
|
|
{ title: 'The Good, the Bad and the Ugly', year: 1966 },
|
|
{ title: 'Fight Club', year: 1999 },
|
|
{
|
|
title: 'The Lord of the Rings: The Fellowship of the Ring',
|
|
year: 2001,
|
|
},
|
|
{
|
|
title: 'Star Wars: Episode V - The Empire Strikes Back',
|
|
year: 1980,
|
|
},
|
|
{ title: 'Forrest Gump', year: 1994 },
|
|
{ title: 'Inception', year: 2010 },
|
|
{
|
|
title: 'The Lord of the Rings: The Two Towers',
|
|
year: 2002,
|
|
},
|
|
{ title: "One Flew Over the Cuckoo's Nest", year: 1975 },
|
|
{ title: 'Goodfellas', year: 1990 },
|
|
{ title: 'The Matrix', year: 1999 },
|
|
{ title: 'Seven Samurai', year: 1954 },
|
|
{
|
|
title: 'Star Wars: Episode IV - A New Hope',
|
|
year: 1977,
|
|
},
|
|
{ title: 'City of God', year: 2002 },
|
|
{ title: 'Se7en', year: 1995 },
|
|
{ title: 'The Silence of the Lambs', year: 1991 },
|
|
{ title: "It's a Wonderful Life", year: 1946 },
|
|
{ title: 'Life Is Beautiful', year: 1997 },
|
|
{ title: 'The Usual Suspects', year: 1995 },
|
|
{ title: 'Léon: The Professional', year: 1994 },
|
|
{ title: 'Spirited Away', year: 2001 },
|
|
{ title: 'Saving Private Ryan', year: 1998 },
|
|
{ title: 'Once Upon a Time in the West', year: 1968 },
|
|
{ title: 'American History X', year: 1998 },
|
|
{ title: 'Interstellar', year: 2014 },
|
|
];
|