Implement new minimap component for forms with side panels (#8673)

[thibaudcolas]

Depends on #9316 and #9319. Implements the new minimap component (#8673). Still working on the last few aspects of the design (scrolling, top button styles) but most of the logic is here.

The minimap is a new React component, whose rendering is driven by plain JavaScript based on:

• Events fired by tabs and collapsible panels as they reveal / hide their content
• IntersectionObserver, checking which collapsible panels are visible

The React code is relatively simple, rendering the menu items differently depending on the metadata of the section they correspond to. The JS code is more complex, as there are a lot of special cases to account for.

The minimap reflects the contents of the currently-visible tab, but I chose to have it alongside the side panels, so the DOM order is slightly better (side panels toggles, then minimap, then tabs). Only having a single component also helps with performance – we won’t need to render one minimap per tab.

---

Please check the following:

• [ ] Do the tests still pass?[^1]
• [ ] Does the code comply with the style guide?
  • [ ] Run make lint from the Wagtail root.
• [ ] For Python changes: Have you added tests to cover the new/fixed behaviour?
• [ ] For front-end changes: Did you test on all of Wagtail’s supported environments?[^2]
  • [ ] Please list the exact browser and operating system versions you tested:
  • [ ] Please list which assistive technologies [^3] you tested:
• [ ] For new features: Has the documentation been updated accordingly?

Please describe additional details for testing this change.

[^1]: Development Testing [^2]: Browser and device support [^3]: Accessibility Target

[squash-labs[bot]]

Manage this branch in Squash

Test this branch here: https://thibaudcolasfeature8673-minima-8z9w1.squash.io