web

web / lib/types/cms-blocks

lib/types/cms-blocks

CMS block type definitions for Payload CMS page blocks.

Types used by the block renderer to map CMS content to React components.

Interfaces

BlockStyle

Style controls available on every page builder block.

Properties

paddingTop?

optional paddingTop: "none" | "sm" | "md" | "lg" | "xl" | null

paddingBottom?

optional paddingBottom: "none" | "sm" | "md" | "lg" | "xl" | null

backgroundColor?

optional backgroundColor: string | null

maxWidth?

optional maxWidth: "sm" | "md" | "lg" | "xl" | "full" | null

anchorId?

optional anchorId: string | null

hideOnMobile?

optional hideOnMobile: boolean | null

hideOnDesktop?

optional hideOnDesktop: boolean | null

separator?

optional separator: "none" | "line" | "gradient" | "wave" | null

HeroBlock

Properties

blockType

blockType: "hero"

title

title: string

subtitle?

optional subtitle: string | null

description?

optional description: string | null

background?

optional background: "gradient" | "grid" | null

buttons?

optional buttons: object[] | null

blockStyle?

optional blockStyle: BlockStyle | null

id?

optional id: string | null

blockName?

optional blockName: string | null

FeatureItem

Properties

icon

icon: string

title

title: string

description

description: string

accent?

optional accent: "none" | "primary" | "secondary" | "accent" | "muted" | null

id?

optional id: string | null

FeaturesBlock

Properties

blockType

blockType: "features"

sectionTitle?

optional sectionTitle: string | null

sectionDescription?

optional sectionDescription: string | null

features

features: FeatureItem[]

columns?

optional columns: "1" | "2" | "3" | "4" | null

blockStyle?

optional blockStyle: BlockStyle | null

id?

optional id: string | null

blockName?

optional blockName: string | null

StatItem

Properties

value

value: string

label

label: string

icon?

optional icon: string | null

id?

optional id: string | null

StatsBlock

Properties

blockType

blockType: "stats"

stats

stats: StatItem[]

blockStyle?

optional blockStyle: BlockStyle | null

id?

optional id: string | null

blockName?

optional blockName: string | null

DetailsGridItem

Properties

icon

icon: string

label

label: string

value

value: string

link?

optional link: string | null

id?

optional id: string | null

DetailsGridBlock

Properties

blockType

blockType: "detailsGrid"

sectionTitle?

optional sectionTitle: string | null

variant?

optional variant: "grid-2" | "grid-3" | "grid-4" | "compact" | null

items

items: DetailsGridItem[]

blockStyle?

optional blockStyle: BlockStyle | null

id?

optional id: string | null

blockName?

optional blockName: string | null

TimelineBlockItem

Properties

date

date: string

title

title: string

description

description: string

id?

optional id: string | null

TimelineBlock

Properties

blockType

blockType: "timeline"

sectionTitle?

optional sectionTitle: string | null

variant?

optional variant: "compact" | "vertical" | null

items

items: TimelineBlockItem[]

blockStyle?

optional blockStyle: BlockStyle | null

id?

optional id: string | null

blockName?

optional blockName: string | null

TestimonialItem

Properties

quote

quote: string

author

author: string

role?

optional role: string | null

avatar?

optional avatar: string | null

id?

optional id: string | null

TestimonialsBlock

Properties

blockType

blockType: "testimonials"

sectionTitle?

optional sectionTitle: string | null

variant?

optional variant: "single" | "grid" | "masonry" | null

items

items: TestimonialItem[]

blockStyle?

optional blockStyle: BlockStyle | null

id?

optional id: string | null

blockName?

optional blockName: string | null

RichTextBlock

Properties

blockType

blockType: "richText"

content

content: unknown

blockStyle?

optional blockStyle: BlockStyle | null

id?

optional id: string | null

blockName?

optional blockName: string | null

CTABlock

Properties

blockType

blockType: "cta"

headline

headline: string

description?

optional description: string | null

buttonText

buttonText: string

buttonLink

buttonLink: string

blockStyle?

optional blockStyle: BlockStyle | null

id?

optional id: string | null

blockName?

optional blockName: string | null

NewsletterFormBlock

Properties

blockType

blockType: "newsletterForm"

headline?

optional headline: string | null

placeholder?

optional placeholder: string | null

buttonText?

optional buttonText: string | null

blockStyle?

optional blockStyle: BlockStyle | null

id?

optional id: string | null

blockName?

optional blockName: string | null

NewsletterCTABlock

Properties

blockType

blockType: "newsletterCTA"

headline?

optional headline: string | null

description?

optional description: string | null

placeholder?

optional placeholder: string | null

buttonText?

optional buttonText: string | null

variant?

optional variant: "default" | "elevated" | "centered" | null

size?

optional size: "default" | "lg" | "xl" | null

blockStyle?

optional blockStyle: BlockStyle | null

id?

optional id: string | null

blockName?

optional blockName: string | null

BlockRendererProps

Properties

blocks

blocks: Block[]

Type Aliases

Block

Block = HeroBlock | FeaturesBlock | StatsBlock | DetailsGridBlock | TimelineBlock | TestimonialsBlock | RichTextBlock | CTABlock | NewsletterFormBlock | NewsletterCTABlock