LivePreviewBreakpoint
Defined in: packages/core/src/livePreview/types.ts:111
One toggle-able simulated viewport width, offered as a button in the embedded preview panel’s breakpoint row and the floating indicator’s pop-out resize controls.
Rendering precedence: icon, when set, renders instead of label as the
button’s visible content, with label becoming the hover title/tooltip
instead. With no icon, label renders as plain text. label is
therefore always required — even an icon-only button needs it for the
tooltip and for accessibility (it becomes the button’s aria-label).
Properties
Section titled “Properties”
optionalicon?:string
Defined in: packages/core/src/livePreview/types.ts:125
Renders instead of label in the toggle button when set — e.g. a
"Smartphone"/"Tablet"/"Laptop"/"Monitor" icon per breakpoint so a
project can show device silhouettes instead of pixel numbers. Omit to
show label as plain text.
label:
string
Defined in: packages/core/src/livePreview/types.ts:116
Always required. The button’s visible text when icon is unset; the
hover title and aria-label when icon is set.
width:
number
Defined in: packages/core/src/livePreview/types.ts:118
The viewport width, in pixels, this breakpoint simulates.