Repository: mui/material-ui
File: docs/data/material/components/autocomplete/FreeSolo.tsx (TypeScript)

Code before:
        options={top100Films.map((option) => option.title)}
        renderInput={(params) => <TextField {...params} label="freeSolo" />}
      />
      <Autocomplete
        freeSolo
        id="free-solo-2-demo"
        disableClearable
        options={top100Films.map((option) => option.title)}
        renderInput={(params) => (
          <TextField
            {...params}
            label="Search input"
            slotProps={{
              input: {
                ...params.InputProps,
                type: 'search',
              },
            }}
          />
        )}
      />
      <Autocomplete
        id="free-solo-demo3"
        freeSolo
        options={top100Films}
        renderInput={(params) => <TextField {...params} label="freeSolo" />}
        getOptionLabel={(option) =>
          typeof option === 'string' ? option : option.title
        }
        // this demo demonstrates how the value parameter can be either an object (same type as option) or a string
        // it could become a string if, for example, you press "Enter" in the input field
        isOptionEqualToValue={(option, value) => {
          if (typeof value === 'string') {
            return option.title === value;
          }
          return option.title === value.title;
        }}
      />
    </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 },

Review comment (suggestion):
Just to have a different placeholder than others (https://deploy-preview-47801--material-ui.netlify.app/material-ui/react-autocomplete/#search-input):

```suggestion
        renderInput={(params) => <TextField {...params} label="freeSolo (handle string values)" />}
```

Code after:
        options={top100Films.map((option) => option.title)}
        renderInput={(params) => <TextField {...params} label="freeSolo" />}
      />
      <Autocomplete
        freeSolo
        id="free-solo-2-demo"
        disableClearable
        options={top100Films.map((option) => option.title)}
        renderInput={(params) => (
          <TextField
            {...params}
            label="Search input"
            slotProps={{
              input: {
                ...params.InputProps,
                type: 'search',
              },
            }}
          />
        )}
      />
      <Autocomplete
        id="free-solo-demo3"
        freeSolo
        options={top100Films}
        renderInput={(params) => (
          <TextField {...params} label="freeSolo (handle string values)" />
        )}
        getOptionLabel={(option) =>
          typeof option === 'string' ? option : option.title
        }
        // this demo demonstrates how the value parameter can be either an object (same type as option) or a string
        // it could become a string if, for example, you press "Enter" in the input field
        isOptionEqualToValue={(option, value) => {
          if (typeof value === 'string') {
            return option.title === value;
          }
          return option.title === value.title;
        }}
      />
    </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 },