Showcase item

The one shared editorial item: media plus text.

The one shared editorial item (ADR 0011, 0027). It replaced the old "feature", and there is no separate showcase block any more: media, an optional eyebrow, a heading, a body of one or several paragraphs, an optional highlight list, and an optional read-more link.

Its media is a MediaCarousel over 1…N images, so one image is a static picture and many is a swipeable gallery — the editor's per-item choice, made by what they upload rather than by a setting.

Layout-agnostic. It renders media-above-text in DOM order and the host decides orientation: in a two-up FeatureGrid cell it reads as a card, and as the grid's lone or spanning item it becomes a full-width editorial beat with media beside text. Same component, two very different pages — which is why this entry shows it bare and the FeatureGrid entry shows it placed.

Distinct from the reference site's content carousels, which page through different bits of information. That material stays a static FeatureGrid, so nothing scannable hides behind a swipe.

Everything filled

Tone

The building

A courtyard that does the work of a garden

The block is built around a planted courtyard, open to the sky and closed to the street. It is where the building does its socialising.

Every stair lands on it, so it is passed through rather than visited, which is what keeps it in use through the shoulder seasons.

  • Open to every resident
  • Tables and a covered bench
  • Bike parking under cover
Read more

The minimum

Media and a heading. No eyebrow, no list, no link, one image — the least the component accepts, so the optional fields are visibly optional.

Tone

One image, no list, no link

The least a Showcase item can be given. The media is a static picture, because the data decides.

Props

packages/primitives/src/Showcase.astro
PropTypeRequired
imagesShowcaseImage[]yes
eyebrowstring
headingstringyes
body

One or several paragraphs.

string | string[]
highlightsstring[]
linkHrefstring
linkLabelstring
prevLabel

Forwarded to MediaCarousel; only used when `images` has more than one.

string
nextLabelstring
headingLevel1 | 2 | 3 | 4 | 5 | 6
ShowcaseImage — referenced by a prop above
FieldTypeRequired
srcstringyes
altstringyes