@props(['menuItem'])

<a type="button" class="sub-">
    Product
</a>

<ul
  role="menu"
  class="absolute end-0 top-12 z-auto w-56 overflow-hidden rounded border border-gray-300 bg-white shadow-sm"
>
  <a
    href="#"
    class="block px-3 py-2 text-sm font-medium text-gray-700 transition-colors hover:bg-gray-50 hover:text-gray-900"
    role="menuitem"
  >
    Storefront
  </a>

  <a
    href="#"
    class="block px-3 py-2 text-sm font-medium text-gray-700 transition-colors hover:bg-gray-50 hover:text-gray-900"
    role="menuitem"
  >
    Warehouse
  </a>

  <a
    href="#"
    class="block px-3 py-2 text-sm font-medium text-gray-700 transition-colors hover:bg-gray-50 hover:text-gray-900"
    role="menuitem"
  >
    Stock
  </a>
</ul>