Deck
SectionBreak slide
The chapter turn on the VI canvas: a big zero-padded index and a short title on the line, the canvas otherwise clear. Deck chrome rides the meta row.
Install
npx shadcn@latest add @alix/sectionBreakSlidePreview
03
The first ninety days
Usage
import { SectionBreakSlide } from "@/components/deck/sectionBreakSlide";
<SectionBreakSlide number="3" title="The first ninety days" />Examples
01
With a framing line
An optional description sets up the section beneath the title: a single clause, not a paragraph.
02
Where the cash is trapped
Working capital, not the P&L, funds the recovery.
<SectionBreakSlide
number="2"
title="Where the cash is trapped"
description="Working capital, not the P&L, funds the recovery."
/>02
On the brand surface
The turn can drop onto navy to punctuate the deck's rhythm: the ink flips to white in one prop.
04
The ask
<SectionBreakSlide number="4" title="The ask" surface="primary" />When to use it
Use it for
- A section turn between chapters of the argument, not a header for a single slide.
- Numbering from "1" upward as a string: the slide zero-pads it to "01".
- A short verdict title; a framing clause in description if the chapter needs a set-up.
Reach for something else
- Writing "01." into the title: the ordinal is computed from number.
- The opening cover. Use TitleSlide.
- A standalone claim the room should repeat. Use StatementSlide.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| number | string | – | The section index as a string ("3"); the slide pads it to "03". A string, not a number, so a CMS/deck JSON maps it cleanly. |
| title | string | – | The chapter title, on the line beside the index. |
| description | string | – | Optional framing clause beneath the title. |
| surface | VISurface | – | Override the default surface with the brand vocabulary (white, primary, sand, greyGradient, goldGradient); ink derives from it. |
| meta | string[] | – | Deck chrome for the footer meta row. |