{% from '@bonniernews/dn-design-system-web/njk-helpers/attributes.njk' import getAttributes %}
{% from '@bonniernews/dn-design-system-web/components/group-header/group-header.njk' import GroupHeader %}

{% macro TeaserPackage(params) %}
  {%- set componentClassName = "ds-teaser-package" %}
  {%- set classNamePrefix = componentClassName + "--" %}
  {%- set classes = [
    componentClassName,
    classNamePrefix + params.areaType if params.areaType,
    'ds-theme--' + params.theme if params.theme,
    params.classNames if params.classNames,
    'ds-dark' if params.areaType == 'bauta'
  ] | join(" ") %}
  {%- set attributes = getAttributes(params.attributes) %}

  <div class="{{ classes }}">
    {% if params.vignetteText %}
      {{ GroupHeader({
        title: params.vignetteText,
        href: params.vignetteTargetUrl,
        variant: params.areaType if params.areaType,
        mediaHtml: params.vignetteIconHtml if params.vignetteIconHtml
      }) }}
    {% endif %}
    {{ params.teasersHtml | safe }}
  </div>
{% endmacro %}