[Autocomplete] Error: (0 , _mui_base_useAutocomplete__WEBPACK_IMPORTED_MODULE_2__.useAutocomplete) is not a function

[firmart]

Steps to reproduce

Link to live example: link

Steps:

1. npm run dev

Current behavior

Expected behavior

No error.

Context

Use useAutocomplete to build a Search component. However, the example provided in the doc fails with Next.js.

Your environment

npx @mui/envinfo

 Browser : Chrome

  Output from `npx @mui/envinfo` goes here.

  System:
    OS: Linux 5.15 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish)
  Binaries:
    Node: 21.6.2 - ~/.nvm/versions/node/v21.6.2/bin/node
    npm: 10.2.4 - ~/.nvm/versions/node/v21.6.2/bin/npm
    pnpm: 8.15.4 - ~/.local/share/pnpm/pnpm
  Browsers:
    Chrome: 123.0.6312.105
  npmPackages:
    @mui/base: 5.0.0-beta.58 => 5.0.0-beta.58
    @types/react: ^18.3.5 => 18.3.5
    react: ^18.3.1 => 18.3.1
    react-dom: ^18.3.1 => 18.3.1
    typescript: ^5.6.2 => 5.6.2

Search keywords: useAutocomplete, next.js

[michaldudak]

The Search in your example should be defined as a client component. Adding 'use client'; at the top solves the issue.