import { RichText } from '../atoms/rich-text.js'
import { ValidationError } from '../routing/error-handler.js'
import h from '../shared/h.js'

export function Quote ({ _model, _variant, ...props }) {
  const { title, text } = _model
  if (!title || !text) {
    throw new ValidationError()
  }

  const sizes = { small: 3, medium: 7, large: 8 }
  const textSize = sizes[_variant] || sizes.medium

  return h('blockquote', { ...props, className: 'space-y-5 p-6 bg-bga text-txa h-full rounded-2xl' },
    h('div', {
      className: `font-custom text-${textSize}xl`,
      children: h(RichText, text)
    }),
    h('cite', { className: 'block' }, title)
  )
}
