Material Ui自动完成清除图标样式

import React, { useState } from 'react';
import Autocomplete from '@material-ui/lab/Autocomplete';
import TextField from '@material-ui/core/TextField';
import ClearIcon from '@material-ui/icons/Clear';

const MyAutocomplete = () => {
  const [value, setValue] = useState('');

  const handleClear = () => {
    setValue('');
  };

  return (
    <Autocomplete
      freeSolo
      value={value}
      onChange={(event, newValue) => {
        setValue(newValue);
      }}
      renderInput={(params) => (
        <TextField
          {...params}
          label="Search"
          InputProps={{
            ...params.InputProps,
            endAdornment: (
              <>
                {value && (
                  <ClearIcon
                    style={{ cursor: 'pointer' }}
                    onClick={handleClear}
                  />
                )}
                {params.InputProps.endAdornment}
              </>
            ),
          }}
        />
      )}
    />
  );
};

export default MyAutocomplete;