Panel presenter

Labeled panels in, one affordance out. Narrow the window past lg (or md, in one section) to see each section switch between tabs and an accordion.

Accordion → tabs — life at this employer

The default and the driving use case: accordion below lg, tabs above it. Both trees are in the HTML; CSS shows exactly one.

Charge nurses still take patients. Managers round on every shift, and the people who set the schedule work it.

Ninety-four percent of our nurses were here last year, and the year before that.

  • Tuition and certification funded up front, not reimbursed
  • A clinical ladder written into your development plan
  • Self-scheduling on most units
  • Relocation support for out-of-state hires

Trails start ten minutes from the parking lot. Mount Graham tops out above 10,000 feet, and the drive up takes under an hour.

Tabs everywhere — scalar config

A scalar affordance renders a single tree, with no duplicated content and no visibility classes.

Charge nurses still take patients. Managers round on every shift, and the people who set the schedule work it.

Ninety-four percent of our nurses were here last year, and the year before that.

  • Tuition and certification funded up front, not reimbursed
  • A clinical ladder written into your development plan
  • Self-scheduling on most units
  • Relocation support for out-of-state hires

Trails start ten minutes from the parking lot. Mount Graham tops out above 10,000 feet, and the drive up takes under an hour.

Accordion everywhere — two panels open by index

type=multiple with defaultOpen={[0, 2]}. Closed panels still ship their copy in the payload, hidden with display.

Charge nurses still take patients. Managers round on every shift, and the people who set the schedule work it.

Ninety-four percent of our nurses were here last year, and the year before that.

  • Tuition and certification funded up front, not reimbursed
  • A clinical ladder written into your development plan
  • Self-scheduling on most units
  • Relocation support for out-of-state hires

Trails start ten minutes from the parking lot. Mount Graham tops out above 10,000 feet, and the drive up takes under an hour.

Tabs → accordion at md — the inverted switch

The switch runs both directions, at any single breakpoint. This one is tabs on mobile and an accordion from md.

Charge nurses still take patients. Managers round on every shift, and the people who set the schedule work it.

Ninety-four percent of our nurses were here last year, and the year before that.

Heterogeneous panels — a nested list presenter

Panels need not share a shape. The second one nests a ListPresenter; the presenter never inspects panel bodies.

Founded in 1926 as a twelve-bed clinic. Six campuses now, and the original building is still in use.

  • 1,200+Employees
  • 48Specialties
  • 94%Retention

  • Tuition and certification funded up front, not reimbursed
  • A clinical ladder written into your development plan
  • Self-scheduling on most units
  • Relocation support for out-of-state hires

Six long labels — tab strip overflow

Editor-authored labels can be long. The strip wraps rather than scrolling; a scrollable strip is out of scope for v1.

Panel body for “Culture and the people you work beside”.

Panel body for “Benefits, tuition support and the clinical ladder”.

Panel body for “Lifestyle in the Gila Valley”.

Panel body for “Relocation and housing assistance”.

Panel body for “Professional development and certification”.

Panel body for “Retirement, insurance and time off”.