DropDown API Options not working

for Example if I added this attribute

data-mdb-autoClose="outside"

Expected behavior

the dropdown list shouldn't close unless i tap outside it

Actual behavior

It closes whether I tap on it or outside of it

Code

    <div class="dropdown">
  <a class="dropdown-toggle d-flex align-items-center hidden-arrow float-end" href="#" id="AvatarDropdownMenuLink" data-mdb-autoClose="outside" role="button" data-mdb-toggle="dropdown" aria-expanded="false">
    <img src="https://mdbcdn.b-cdn.net/img/new/avatars/2.jpg" class="rounded-circle" height="30" alt="" loading="lazy" />
  </a>
  <ul class="dropdown-menu dropdown-menu-end border" aria-labelledby="AvatarDropdownMenuLink">
    <li>
      <a class="dropdown-item" href="#">My profile</a>
    </li>
    <li>
      <a class="dropdown-item" href="#">Settings</a>
    </li>
    <li>
      <a class="dropdown-item" href="#">Logout</a>
    </li>
  </ul>
  <div class="dropdown">

Resources (screenshots, code snippets, etc.)

https://mdbootstrap.com/docs/standard/components/dropdowns/#docsTabsAPI