Navigation Panel

Child block for Navigation Panels. Each panel supplies a navigation label, optional return label and icon, and an InnerBlocks content area. The parent Navigation Panels block reads panel metadata at render time to build the radio navigation list.

Block Namespace

prc-block/navigation-panel

Category

design

Supports

Feature	Detail
Anchor	Yes
HTML	No
Interactivity	Yes
Spacing	blockGap, margin (top/bottom), padding (default on)

Attributes

Attribute	Type	Default	Description
label	string	—	Text shown in the parent's navigation option list.
returnLabel	string	—	Label for the top-layout return control. Defaults to Return to {label}.
panelIconId	number	—	Attachment ID for the optional navigation icon.
panelIconUrl	string	—	URL for the optional navigation icon (editor preview and attribute sync).

Inner Blocks

Unrestricted within the panel content area. The default template inserts a single core/paragraph with placeholder text "Panel content…".

Parent / Ancestor Requirements

Must be a direct child of prc-block/navigation-panels.

Context

Direction	Key	Source block
Uses	navigation-panel/activeIndex	navigation-panels
Uses	navigation-panel/activeEditorIndex	navigation-panels

The editor compares the panel's block index against navigation-panel/activeEditorIndex (falling back to navigation-panel/activeIndex) and adds is-visible when they match.

Usage

1. Insert or select a Panel inside a Navigation Panels block.
2. In the Labels inspector panel, set the Navigation Label shown in the parent's option list.
3. Optionally set a Return Label for top-layout back navigation (defaults to Return to {label}).
4. Optionally upload a Panel Icon image shown beside the label in navigation options.
5. Add content blocks inside the panel body.

Navigation Panels toolbar controls manage adding, removing, and reordering panels.

Block Markup (save)

Panel content is saved via InnerBlocks.Content inside the panel wrapper. The Navigation Panels parent serializes all panel children.

PHP Rendering

class-navigation-panel.php (PRC\Platform\Blocks\Navigation_Panel)

Render callback:

1. Resolves label, returnLabel (with Return to {label} fallback), and panelIconId.
2. Writes data-wp-interactive="prc-block/navigation-panel" and data-wp-context with { label, returnLabel, icon }.
3. Wraps saved inner content in .wp-block-prc-block-navigation-panel__content.

The Navigation Panels render callback reads this context to build navigation radios, attach panel IDs, and pass returnLabel into the parent's Interactivity state.

Frontend Interactivity

view.js registers an empty prc-block/navigation-panel store scaffold. Panel show/hide is driven by the parent prc-block/navigation-panels store via data-wp-bind--hidden on the panel wrapper.

Related Blocks

Block	Relationship
prc-block/navigation-panels	Required parent block