Currently, the label shown for a StructBlock's collapsed representation takes its content from the first sub-block of the StructBlock, which isn't always what you want. Add a new `label_format` meta option to StructBlock to allow customising this - e.g. `label_format = "Profile for {first_name} {surname}"`
Tabbing (navigation using Tab or Shift + Tab keys) will now close
the menu and move to the next focusable element on the page instead
of focusing the next menu item.
The previous behaviour was a deviation from the ARIA menu practices:
https://w3c.github.io/aria-practices/#menu
Further changes / cleanup:
* Consume keyboard events like arrow down to prevent the browser
from interpreting them.
* Refactor repeated setTimeout and `.focus()` calls into single
`focusElement(el)` function. Let's keep it DRY!
Fixes #7290
* Add bars.svg icon
* Add Open/Close button for mobile mode
* Completely hide sidebar in mobile mode
* mobile state tweaks
* Rename 'open' to 'visibleOnMobile'
* Don't initialise 'collapsed' state based on screen size (old code)
* Remove main.sidebar--open (not used)
Co-authored-by: Storm Heg <storm@stormbase.digital>
- Due to how high-contrast mode works, there was no visual separation between the sidebar and the main content, adding a transparent border resolves this without having any visual impact in non-high contrast mode
- fixes #7456
* Fix left padding not changing fast enough
* Make all icons stay in a fixed Y position
So they don't move when you hover
* Make the Wagtail a bit bigger in collapsed mode
* Fix position of search icon when expanding/contracting menu
* Animation refinements
* Fix gap between icon and text changing for legacy icons during collapse
* Only peek the menu if the mouse hovers over a menu
This fixes an issue where peeking wouldn't happen if you collapsed the
menu and then hovered over a menu item without the mouse leaving the
sidebar. It now always peeks when the user hovers the menu item.
But we still want to avoid it peeking when the user clicks the collapse
button, so I've moved the mouse enter/leave handlers to a sub-element
that doesn't include this button.
* Peek the sidebar on focus
Allows the sidebar to open when it receives keyboard focus, and stops it
annoyingly closing while you are typing a search query.
* Remove the start peeking timeout
* Make more panels type collapsible
* Remove duplicate js in homepage template
* Move collapsible code into its own js file
* Change $li to $target in collapsible.js, as in #6342 Closes #7364, #6342, #6187, #2123
Co-authored by: Fabien Le Frapper <contact@fabienlefrapper.me>
Co-authored-by: Robbie Mackay <rm@robbiemackay.com>
Co-authored-by: Scott Cranfill <scott.cranfill@jpl.nasa.gov>
Fixes #7353
The error counter was only counting elements with class error-message, but non-block errors on ListBlock / StreamBlock use a different styling,help-critical.
The rationale for these was to keep the control flow in one direction, so that the child blocks don't know about the wider sequence they belong to. But that's already undermined by the fact that they have to keep track of their own index number, and it just makes things needlessly unwieldy, particularly when we go on to make action buttons pluggable (and emphatically want to avoid having a mass of abstraction between the button and the action it performs).
Fixes @cnk's test case from #7248. blockErrors within a ListBlockValidationError is an array (with nulls for the items with no errors), but setError was treating it as a dict keyed by block index, which meant it was erroneously passing nulls to the child setError method. FieldBlock handles this gracefully, but other blocks such as StructBlock don't.
This means we're not artificially forcing four different entity types into the same code path, and makes it possible to define new entity types outside of this module.
Also relax the eslint no-unused-vars to allow unused function parameters - having multiple classes following the same interface is a legitimate use of this.
* Added separate SidebarPanel component
* Copied explorer implementation
It's going to need a lot of changes
* Initialise the page explorer
* Move page explorer up a bit
* Hook into page explorer navigation
* Make navigate handler replace default button click behaviour
* Update page explorer to use SidebarPanel
* Add swipe in/out transition for page explorer
This allows us to test it without having to jump through hoops to make the rest of page-editor.js module-friendly, and moving the test module out of client/src/entrypoints means we don't duplicate it into wagtail/admin/static (where the test runner tries to run it again with broken imports)
This means we don't need a bogus "eslint-disable-next-line import/no-unresolved" directive when importing built CSS, which ends up breaking lint locally. Fixes #7177
