Allow Bootstrap dropdown menus to open as popovers so that their containers can't clip them

Context

Bootstrap 3 dropdown menus are absolutely positioned inside their .dropdown or .btn-group parent, so any ancestor that clips its overflowing content also clips the menu. For instance the page content, #xwikicontent, has overflow: auto: a dropdown near the end of the content gets a scrollbar instead of a fully visible menu. XWIKI-18684 is this problem for the Live Data menu.

No dropdown of XWiki Standard escapes this clipping today. The only placement fixes deal with the edges of the screen:

• flamingo.js shifts any dropdown menu that overflows the right edge of the screen, see XWIKI-12609.
• The compact location picker opens its menu upwards when there is no room below, see XWIKI-24636.

Proposal

Make "popover" an opt-in mode of the Bootstrap dropdown, in our Bootstrap fork xwiki-platform-bootstrap, so that any dropdown that can be clipped opens its menu in the top layer, anchored to its toggle:

• A dropdown opts in by using popovertarget on its toggle instead of data-toggle="dropdown", and the popover attribute on its menu.
• dropdowns.less styles .dropdown-menu[popover]: hidden unless the popover is open, fixed position with CSS anchor positioning, below the toggle or above it when there is more room above, and scrolling when it doesn't fit on either side.
• dropdown.js ignores the keys pressed in a popover menu, since it currently prevents Escape from closing the popover and closes the menu on the arrow and space keys. It also keeps the open class and aria-expanded of the toggle in sync with the popover, and closes the menu on a click inside it, like the other dropdowns.

Dropdowns that are never clipped keep working as before, since the new rules only apply to menus with the popover attribute.

Starting point

The fix of XWIKI-18684 introduces a Vue component of the Live Data, XWikiPopoverDropdown, that implements this mode for one dropdown: https://github.com/xwiki/xwiki-platform/pull/6925 . It was checked in Chromium 156, Firefox 157 and WebKit 27.2. Once the fork supports the mode, that component reduces to markup.

The Popover API and CSS anchor positioning are available in the latest stable versions of all the supported browsers: anchor positioning since Chrome 125, Safari 26 and Firefox 147.

Open points

• The arrow keys no longer move between the items of a popover menu, Tab does. dropdown.js could provide the arrow keys for popover menus too.
• When a menu is wider than the room on its side of the toggle, browsers shift it back into the screen. But when it also doesn't fit vertically, no fallback position applies. Adding flip-inline fallbacks to the list made Chromium 156 pick positions inconsistently, depending on the order of the fallbacks, so they were left out.
• When the menu fits below its toggle but there is more room above, Chromium and Firefox open it above, while WebKit, which tries the default position first, opens it below.
• Which dropdowns to migrate: only the ones that can be clipped. A likely candidate is the Live Data "select all" dropdown, inside the scrolling table wrapper, not verified yet.