import { Asset } from '../molecules/asset.js'
import { PromoText } from '../molecules/promo-text.js'
import { ValidationError } from '../routing/error-handler.js'
import h from '../shared/h.js'

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

  const { _variant } = props

  return h('div', { ...props, className: 'bg-bga text-txa rounded-2xl overflow-hidden lg:grid lg:grid-cols-12 gap-x-5' },
    h('div', { className: `col-span-8 row-start-1 ${_variant === 'right' ? '' : 'col-start-5'}` },
      h(Asset, { _model, _tall: true })
    ),
    h('div', { className: 'col-span-4 row-start-1' },
      h(PromoText, { _model })
    )
  )
}
