HySidebar

A persistent navigation rail with collapse-to-icon-only state.

hy-sidebar is a single <nav> landmark — it does not wrap in <aside>, because <aside> is itself a complementary landmark and nesting the two would expose two landmarks for one purpose.

Pair with hy-sidebar-group for titled sections and hy-sidebar-item for rows. On mobile, wrap the sidebar inside hy-drawer — the drawer provides overlay/focus-trap semantics, the sidebar provides the content.

Events

• collapse - Fired on every collapse state change. Detail: { collapsed: boolean }

Slots

• header - Logo, brand, or title above the nav. Stays visible when collapsed. Slot icon-only content (≈32px) that reads in the narrow rail. Position relative to the collapse toggle depends on togglePlacement — see that property for the visual contract.
• default - Items and groups.
• footer - Account, settings, version badge. Hidden chrome when empty.

Methods

expand()

Expand the sidebar. No-op if already expanded.

collapse()

Collapse the sidebar. No-op if already collapsed.

toggle()

Toggle the collapsed state.