What to Watch - React

import { WhatToWatch } from '@sky-uk/ui-sections';

Example

The WhatToWatch section features a Rail of content cards that can be interactive.

Props

Props marked with ? are optional. Sections or section elements that do not provide the required props will not render. The data prop support key/value pairs that are rendered as kebab case data attributes on the component.

• $animated?: boolean defaults to false
• $appearance?: string (default | light)
• $theme?: GradientKey (gradient)
• background?: object
  • $theme?: Gradient gradient
  • $color?: Color (color)
  • $image?: Image (image)
• data?: object
• header
  • body?: string
  • headline: string
  • headlineLevel?: string (h1 | h2 | h3);
  • overline?: string | Image;
  • textCta?: object
    • text: string
    • href?: string
    • data?: object
    • onClick?: function
    • target?: string
  • primaryCta?: object
    • text: string
    • href?: string
    • data?: object
    • onClick?: function
    • target?: string
  • secondaryCta?: object
    • text: string
    • href?: string
    • data?: object
    • onClick?: function
    • target?: string
• items: array
  • cta: object
    • text?: string
    • href?: string
    • data?: object
    • onClick?: function
    • target?: string
  • title: string
  • href?: string
  • logo?:
    • src: string
    • alt?: string
  • image:
    • src: string
    • alt?: string
  • subTitle?: string