import React from 'react'
import AreaCaption from './AreaCaption';

type Props = {
  caption: string;
  icon?: React.ReactNode;
}

export default function IconedAreaCaption({icon, caption}: Props) {
  if(icon) {
    return (
      <div className="flex items-center space-x-2">
        <div className="flex-none w-6 h-6">
          {icon}
        </div>
        <AreaCaption secondary={true} className='flex-1'>{caption}</AreaCaption>
      </div>
    )
  }
  return (
    <AreaCaption>{caption}</AreaCaption>
  )
}