Video
Video — the video primitive, whoever hosts the bytes.
Video — the video primitive, whoever hosts the bytes.
Takes the whole slot value; url, poster, alt and the intrinsic dimensions are
read off it. There is no cropping, no editing, and no responsive ladder: one
progressive MP4 is served per hosted video and the poster is baked upstream.
Two branches, discriminated by value.source. An upload renders a <video>
element over its transcoded rendition; a link renders a lazy provider <iframe> over
an embed src the resolver already finished. Absent source is an upload. Both share
one frame container, one poster-only fallback, and one marker spread.
Framed (default): the box is frame.desktop.aspect, switching to
frame.mobile.aspect below frame.breakpoint when declared and not nominal — see
frame-box.ts. Video has no <picture>-equivalent device-switching source, so
frame.breakpoint here governs only this layout-box switch, never a crop pick.
Playback is author-declared, from the slot’s playback config, except under
preview: a hosted video takes it as <video> attributes verbatim, a link as the
provider’s own player params, as far as that player allows. autoplay requires
muted — enforced on the schema at check time, so a video reaching here with
autoplay is already muted.
The marker is never dropped: {...slot.x} is applied to the outermost element in
every branch, so two <Video> on one slot (a preview and the real player) are both
selectable in the editor.
Import from @homepages/template-kit.
Signature
Section titled “Signature”function Video(props: Props): ReactNodeParameters
Section titled “Parameters”| Name | Type | Required | Description |
|---|---|---|---|
| `{ | |||
| value, | |||
| alt, | |||
| frame, | |||
| fit, | |||
| playback, | |||
| preview, | |||
| className, | |||
| …rest | |||
| }` | Props |
required |
Returns
Section titled “Returns”ReactNode