Added MDBootstrap 5.0.0 to angular 13 application. Most components work fine but having issues with the tooltip and dropdown in a navigation menu. Is version 5 compatible with angular 13?

Expected behavior mdb-tooltip shows on hover and hides when mouse moves away from element. mdb-dropdown shows menu items on click and hides menu items when clicking away or on the element again.

Actual behavior mdb-tooltip shows on hover and does not hide when moving mouse away. mdb-dropdown shows menu items on click and but does not hide when clicking elsewhere or on the element again. menu remains even when navigating to another view.

Resources (screenshots, code snippets etc.)

In app.ts

import { MdbTooltipModule } from 'mdb-angular-ui-kit/tooltip';
import { MdbDropdownModule } from 'mdb-angular-ui-kit/dropdown';
import { MdbRippleModule } from 'mdb-angular-ui-kit/rip
…
@NgModule ({
  ...
  imports: [MdbTooltipModule, MdbDropdownModule, MdbRippleModule],
  ...
})

In component html

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <div class="container-fluid">
    <ul class="navbar-nav">
      <!-- Dropdown -->
      <li mdbDropdown class="nav-item dropdown">
        <a
          class="nav-link dropdown-toggle"
          href="#"
          id="navbarDropdownMenuLink"
          role="button"
          mdbDropdownToggle
          aria-expanded="false"
        >
          Dropdown link
        </a>
        <ul mdbDropdownMenu class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
          <li>
            <a class="dropdown-item" href="#">Action</a>
          </li>
          <li>
            <a class="dropdown-item" href="#">Another action</a>
          </li>
          <li>
            <a class="dropdown-item" href="#">Something else here</a>
          </li>
        </ul>
      </li>
    </ul>
  </div>
</nav>
<p class="mb-0">
  Hover the link to see the
  <a href="#" mdbTooltip="Hi! I'm tooltip">tooltip</a>
</p>