import { Link } from '../atoms/link.js'
import h from '../shared/h.js'

export function Tags ({ _model, ...props }) {
  const { tags } = _model
  if (tags.length === 0) {
    return null
  }

  return h('div', { ...props, role: 'list', className: 'flex flex-wrap gap-2' }, tags.map(link =>
    h('div', { className: 'flex items-center', role: 'listitem' },
      h(Link, { _variant: 'tag', _model: link })
    )
  ))
}
