Component library

Showing 4 components with role split.

<SplitSlide>
coreSplitPresentation
Two-column layout for text plus visual or bullets plus callout.
When to use: Compare two blocks or pair narrative with a stat.
Preview
Five inboxes per invoice
No single queue of record
Manual touches
5
per supplier invoice
Prop Type Notes
left ReactNode Required. Left column content.
right ReactNode Required. Right column content.
reverse boolean Optional. Default: false. Swap columns on wide screens.
Examples
```
<SplitSlide
  left={<BulletList items={["Five inboxes per invoice", "No single queue of record"]} />}
  right={<BigStat label="Manual touches" value="5" hint="per supplier invoice" />}
/>
```
<MediaSlide>
coreMediaSplitPresentation
Title plus optional image area (use src + alt for static images).
When to use: Screenshot or diagram slide.
Preview
Current intake
Prop Type Notes
title string Required. Slide title.
src string Optional. Image URL (https recommended).
alt string Optional. Image alt text.
children ReactNode Optional. Optional body under the title.
Examples
```
<MediaSlide title="Current intake" src="https://example.com/diagram.png" alt="Process diagram" />
```
<SplitBriefSlide>
expressiveSplitPresentation
Two-column narrative layout with bracketed panels for a problem/solution or context/outcome brief.
When to use: Second slide after the cover: state the situation on the left and the intended outcome on the right. Omit right for a single-panel brief.
Preview
Mission Brief
Rewiring How We Share Ideas
Every presentation is an opportunity to transport your audience.
No canvas limits. No cookie-cutter layouts.
Prop Type Notes
label string Optional. HUD pill above the title.
title string Required. Section headline.
left ReactNode Required. Left (or sole) body panel.
right ReactNode Optional. Optional second panel.
Examples
```
<SplitBriefSlide
  label="Mission Brief"
  title="Rewiring How We Share Ideas"
  left="Every presentation is an opportunity to transport your audience."
  right="No canvas limits. No cookie-cutter layouts."
/>
```

Prop	Type	Notes
left	ReactNode	Required. Left column content.
right	ReactNode	Required. Right column content.
reverse	boolean	Optional. Default: `false`. Swap columns on wide screens.

Prop	Type	Notes
title	string	Required. Slide title.
src	string	Optional. Image URL (https recommended).
alt	string	Optional. Image alt text.
children	ReactNode	Optional. Optional body under the title.

Prop	Type	Notes
label	string	Optional. HUD pill above the title.
title	string	Required. Section headline.
left	ReactNode	Required. Left (or sole) body panel.
right	ReactNode	Optional. Optional second panel.

<BroadsideSplit>

broadsideSplitMediaPresentation

Text + image split. Use upload_media (MCP) or an https URL for imageSrc.

When to use: When a slide needs a photograph or diagram beside copy.

Preview

Evidence04

when content needs image support

Upload via MCP upload_media, then pass the returned url.

Source · 2026

Prop	Type	Notes
chromeLeft	string	Optional. Top chrome left.
chromeRight	string	Optional. Top chrome right.
kicker	string	Optional. Mono eyebrow.
title	string	Required. Headline.
body	string	Optional. Supporting copy.
imageSrc	string	Optional. Image URL from upload_media or https.
imageAlt	string	Optional. Alt text.
imageCaption	string	Optional. Caption under the image.
footLeft	string	Optional. Footer left.
footRight	string	Optional. Footer right.

Examples

<BroadsideSplit chromeLeft="Evidence" chromeRight="04" title="when content needs image support" body="Upload via MCP upload_media, then pass the returned url." imageSrc="/uploads/media/example.png" imageAlt="Evidence wall" imageCaption="Source · 2026" />

Preview

Examples

Preview

Current intake

Examples

Preview

Rewiring How We Share Ideas

Examples

Preview

when content needs image support

Examples