[Autocomplete] 'renderTags' ignored when 'multiple' is false

• The issue is present in the latest release.
• I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

On v5 alpha, when passing renderTags to Autocomplete when multiple is false the renderTags prop will be ignored.

Expected Behavior 🤔

renderTags should be used to render the selected item(s) in the Input no matter what multiple is set to.

Steps to Reproduce 🕹

Comment line 11 of this code sandbox

Context 🔦

We have a single select Autocomplete where we set the renderOption prop to render a custom element that includes a small profile pic. However once one option is selected there is currently no way to render this custom element in the Input of the Autocomplete

Your Environment 🌎

`npx @material-ui/envinfo`

  System:
    OS: Linux 5.8 Pop!_OS 20.04 LTS
  Binaries:
    Node: 14.15.1 - ~/.nvm/versions/node/v14.15.1/bin/node
    Yarn: 1.22.5 - /usr/bin/yarn
    npm: 6.14.10 - ~/Projects/clinical-dashboard-v2/node_modules/.bin/npm
  Browsers:
    Chrome: 89.0.4389.82 <--- using this one
    Firefox: 86.0
  npmPackages:
    @emotion/react: ^11.0.0 => 11.1.4 
    @emotion/styled: ^11.0.0 => 11.0.0 
    @material-ui/core: 5.0.0-alpha.34 => 5.0.0-alpha.34 
    @material-ui/lab: 5.0.0-alpha.34 => 5.0.0-alpha.34 
    @material-ui/private-theming:  5.0.0-alpha.33 
    @material-ui/styled-engine:  5.0.0-alpha.34 
    @material-ui/styles:  5.0.0-alpha.33 
    @material-ui/system:  5.0.0-alpha.34 
    @material-ui/types:  6.0.0 
    @material-ui/unstyled:  5.0.0-alpha.34 
    @material-ui/utils:  5.0.0-alpha.33 
    @types/react: ^17.0.3 => 17.0.3 
    react: ^17.0.1 => 17.0.1 
    react-dom: ^17.0.1 => 17.0.1 
    styled-components: ^5.2.1 => 5.2.1 
    typescript: ^4.2.0 => 4.2.4 

[ZeeshanTamboli]

I can think of the following approaches:

1. We could have a renderTag or renderSingleValue API prop for this.
2. We can have a components prop with SingleValue slot like what react-select does in https://codesandbox.io/s/s0yc5?module=/example.tsx&file=/example.tsx.

We should also update the API docs for renderTags that it works only when multiple is true.

@oliviertassinari @michaldudak What do you guys think?

[Idonoghue]

Thanks for the response @eps1lon . That makes a lot of sense. Looking at it now everything inside the getTagProps passed to the renderTags function wouldn’t apply to a single select.

To describe a bit further our use case, we have a custom component, <EntityLabel/> that renders formatted text with a profile pic. It is trivially easy to render these components as the list of options for the Autocomplete using renderOption. However once one is selected and displayed in the input, there is no render- prop in the Autocomplete API for a custom component like there is for multiple selected values.