The Panel Toggle block is a container block that hides inner blocks behind a toggle button, with three display modes:
- Inline — content is always visible; the toggle opens a slide-in overlay panel on demand.
- Responsive — content is hidden on mobile behind a toggle, and shown inline on desktop. An optional Always show toggle setting keeps the button visible on desktop too, with the same overlay-on-demand behavior as inline mode.
- Overlay — content is always hidden behind a toggle, regardless of viewport size.
The toggle button is fully customisable: icon, label, and display format (icon only, text only, or combined). A Toggle position setting controls whether the button appears before or after the content in the layout.
Mode: Inline
Display toggle and content inline, move content to overlay on toggle click.
Mode: Responsive + always show toggle
Desktop: Same as above.
Mobile: Display toggle, hide content, open content in overlay on toggle click.
Mode: Responsive (no toggle on desktop)
Desktop: Hide toggle, display content inline.
Mobile: Same as above
Mode: Overlay
Display toggle, hide content, open content in overlay on toggle click.
