{% macro renderAccordionMenu(context, item) %}
  {% set journal3 = context.journal3 %}
  {% set image_width = context.image_width %}
  {% set image_height = context.image_height %}
  <li class="{{ journal3.classes(item.classes) | replace({'dropdown': ''}) }} {% if item.isOpen and item.items %}panel-active{% endif %} {% if item.isDivider %}is-divider{% endif %}">
    {% set id = journal3.uniqueId('collapse-') %}
    {% if item.link.href %}
      <a href="{{ item.link.href }}" {{ journal3.linkAttrs(item.link) }}>
        {% if item.thumb %}
          <span class="menu-image">
            <img src="{{ item.thumb }}" {% if item.thumb2x %}srcset="{{ item.thumb }} 1x, {{ item.thumb2x }} 2x" {% endif %} alt="{{ item.title }}" width="{{ image_width }}" height="{{ image_height }}"/>
          </span>
        {% endif %}
        {{ journal3.countBadge(item.title, item.link.total, item.link.classes) }}
        {% if item.items %}
          {% if item.isOpen %}
            <span class="open-menu" data-toggle="collapse" data-target="#{{ id }}" aria-expanded="true" role="heading"><em class="fa fa-plus"></em></span>
          {% else %}
            <span class="open-menu collapsed" data-toggle="collapse" data-target="#{{ id }}" role="heading"><em class="fa fa-plus"></em></span>
          {% endif %}
        {% endif %}
      </a>
    {% else %}
      <a>
        {% if item.thumb %}
          <span class="menu-image">
              <img src="{{ item.thumb }}" {% if item.thumb2x %}srcset="{{ item.thumb }} 1x, {{ item.thumb2x }} 2x" {% endif %} alt="{{ item.title }}" width="{{ image_width }}" height="{{ image_height }}"/>
          </span>
        {% endif %}
        {{ journal3.countBadge(item.title, item.link.total, item.link.classes) }}
        {% if item.items %}
          {% if item.isOpen %}
            <span class="open-menu" data-toggle="collapse" data-target="#{{ id }}" aria-expanded="true" role="heading"><em class="fa fa-plus"></em></span>
          {% else %}
            <span class="open-menu collapsed" data-toggle="collapse" data-target="#{{ id }}" role="heading"><em class="fa fa-plus"></em></span>
          {% endif %}
        {% endif %}
      </a>
    {% endif %}
    {% if item.items %}
      <div class="collapse {% if item.isOpen %}in{% endif %}" id="{{ id }}">
        <ul class="j-menu">
          {% for subitem in item.items %}
            {{ _self.renderAccordionMenu(context, subitem) }}
          {% endfor %}
        </ul>
      </div>
    {% endif %}
  </li>
{% endmacro %}
<div class="{{ journal3.classes(classes) }}">
  <button aria-label="Edit" class="admin-edit" type="button" data-edit="{{ edit }}"><em class="fa fa-pencil" data-placement="auto" data-toggle="tooltip-hover" data-tooltip-class="admin-edit-tooltip" title="Edit {{ name }}"></em></button>
  {% if title %}
    <h3 class="title module-title">{{ title }}</h3>
  {% endif %}
  <ul class="j-menu">
    {% for item in items %}
      {{ _self.renderAccordionMenu(_context, item) }}
    {% endfor %}
  </ul>
</div>
