{% from '@bonniernews/dn-design-system-web/components/icon-sprite/icon-sprite.njk' import IconUse %}
{% from '@bonniernews/dn-design-system-web/components/button/button.njk' import Button %}
{% from '@bonniernews/dn-design-system-web/njk-helpers/attributes.njk' import getAttributes %}

{% macro Tooltip(params) %}
  {% set componentClassName = "ds-tooltip" %}

  {%- set classes = [
    componentClassName,
    "ds-force-px" if params.forcePx,
    componentClassName + '--arrow-' + params.arrowPosition,
    componentClassName + '--close-outside-click' if params.closeOnClickOutside,
    componentClassName + '--hidden' if not params.forceOpen,
    params.classNames if params.classNames
  ] | join(" ") %}
  {% set attributes = getAttributes(params.attributes) %}

  <div class="{{ classes }}" {{- attributes | safe }}>
    <div class="{{ componentClassName + '__content' }}">
      {% if params.title %}
        <h2>{{ params.title }}</h2>
      {% endif %}

      {{ caller() if caller }}
    </div>

    {% if params.closeButton %}
      {{ Button({
        variant: "transparent",
        size: "sm",
        iconName: "close",
        isIconButton: true,
        classNames: "ds-tooltip__close",
        attributes: { "aria-label": "Stäng" }
      })}}
    {% endif %}
</div>
{% endmacro %}