import React, { FC, PropsWithChildren } from 'react'
import { Card } from '@wordpress/ui'

const LandingSection: FC<PropsWithChildren<{ heading?: string }>> = ({
  heading,
  children,
}) => (
  <Card.Root className="landing-section">
    {heading && (
      <Card.Header>
        <Card.Title render={<h2 />}>{heading}</Card.Title>
      </Card.Header>
    )}
    <Card.Content>{children}</Card.Content>
  </Card.Root>
)

export default LandingSection