Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Autocomplete] types break when having multiple default values

See original GitHub issue

Duplicates

I have searched the existing issues

Latest version

I have tested the latest version

Steps to reproduce 🕹

Link to live example: https://codesandbox.io/s/wrong-types-in-autocomplete-with-multiple-default-values-b5qtpu

Steps:

Use an Autocomplete component with the following props a. multiple b. options passing an array of objects c. defaultValue passing an array of objects of the same type as the options
See type errors.

Current behavior 😯

Functionality works as expected.

Type error thrown: Type 'T[]' is not assignable to type 'readonly T[][]'.

Expected behavior 🤔

No type error should be thrown, since the passed values are correct. It should not expect an array of arrays.

Context 🔦

The goal is to have an array of default values that has the same type as the array of options.

Your environment 🌎

npx @mui/envinfo

  System:
    OS: macOS 12.0.1
  Binaries:
    Node: 16.10.0 - ~/.nvm/versions/node/v16.10.0/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 7.24.0 - ~/.nvm/versions/node/v16.10.0/bin/npm
  Browsers:
    Chrome: 107.0.5304.110
    Edge: Not Found
    Firefox: Not Found
    Safari: 15.1
  npmPackages:
    @emotion/react: ^11.10.5 => 11.10.5 
    @emotion/styled: ^11.10.5 => 11.10.5 
    @mui/base:  5.0.0-alpha.105 
    @mui/core-downloads-tracker:  5.10.13 
    @mui/material: ^5.10.13 => 5.10.13 
    @mui/private-theming:  5.10.9 
    @mui/styled-engine:  5.10.8 
    @mui/system:  5.10.13 
    @mui/types:  7.2.0 
    @mui/utils:  5.10.9 
    @types/react: ^18.0.25 => 18.0.25 
    react: ^18.2.0 => 18.2.0 
    react-dom: ^18.2.0 => 18.2.0 
    typescript: ^4.8.4 => 4.8.4

tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx"
  },
  "include": [
    "src"
  ]
}