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

Code before:
        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 can be of both types, typeof option and a string
        // it could become a string if you, for example, would press "Enter" within 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 },
  {
    title: 'The Lord of the Rings: The Return of the King',
    year: 2003,
  },
  { title: 'The Good, the Bad and the Ugly', year: 1966 },

Review comment (suggestion):
The comment wording could be clearer. Consider changing "how the value can be of both types, typeof option and a string" to "how the value parameter can be either an object (same type as option) or a string" for better clarity.
```suggestion
        // This demo shows how the value parameter can be either an object (same type as `option`) or a string.
        // The value can become a string if you, for example, press "Enter" while typing in the input field.
```

Code after:
        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 },
  { title: "Schindler's List", year: 1993 },
  { title: 'Pulp Fiction', year: 1994 },
  {
    title: 'The Lord of the Rings: The Return of the King',
    year: 2003,