How to allow up and down arrow keys to wrap in menu

In bootstrap 5 menu, pressing up arrow key in first item or down allow key in last item does nothing.

How to make up arrow to move to last item in menu if pressed in first item and down arrow to move to first item if pressed in last item just like in normal windows desktop application menus?

To reproduce open page

<div class="btn-group">
  <button type="button" class="btn btn-danger dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
    Action
  </button>
  <ul class="dropdown-menu">
    <li><a class="dropdown-item" href="#"><u>A</u>ction</a></li>
    <li><a class="dropdown-item" href="#">A<u>n</u>other action</a></li>
    <li><a class="dropdown-item" href="#"><u>S</u>omething else here</a></li>
    <li><hr class="dropdown-divider"></li>
    <li><a class="dropdown-item" href="#">S<u>e</u>parated link</a></li>
  </ul>
</div>

https://jsfiddle.net/b6or2s5e/

Open Action menu. Pressing up arrow in first menu line or pressing down arrow in last menu line does nothi