<div{{ attributes.addClass(component_wrapper_class) }}>
  {{ title_prefix }}
  {% if component_wrapper.display_title.value == 1 %}
    {% if label %}
      <h2{{ title_attributes.addClass('title') }}>{{ label }}</h2>
    {% endif %}
  {% endif %}
  {{ title_suffix }}

  {% if header is not empty %}
    <div class="component-wrapper--header">
      {{ header }}
    </div>
  {% endif %}

  <div class="component-wrapper-row">
    <div class="column-left">
      <div{{ content_attributes.addClass('component-wrapper--content') }}>
        {{ content|without('title', 'field_image') }}
      </div>
    </div>
    <div class="column-right">
      <div class="field--name-field-image">
        {% set n = images|length - 1 %}
        {% if images|length == 1 %}
          {% set imagestyle = {
            '#theme':      'image_style',
            '#style_name': 'we_780_958',
            '#uri':        content.field_image[0]['#item'].entity.uri.value,
            '#alt':        content.field_image[0]['#item'].alt,
            '#attributes': { class: 'food-menu-image' },
          } %}
          <div class="show-image-food-menu">
            {{ imagestyle }}
          </div>
        {% elseif images|length > 1 %}
          {% for i in 0..n %}
            {% set imagestyle = {
              '#theme':      'image_style',
              '#style_name': 'we_780_958',
              '#uri':        content.field_image[i]['#item'].entity.uri.value,
              '#alt':        content.field_image[i]['#item'].alt,
              '#attributes': { class: 'food-menu-image' },
            } %}
            <div class="mySlides slider-fade">
              {{ imagestyle }}
            </div>
            {% if i == n %}
              <a class="prev">❮</a>
              <a class="next">❯</a>
            {% endif %}
          {% endfor %}
        {% endif %}
      </div>
      {% if images|length > 1 %}
        {% set n = images|length - 1 %}
        <div class="slide-dots" style="text-align:center">
          {% for i in 0..n %}
            <span class="dot dot-{{ i }}"></span>
          {% endfor %}
        </div>
      {% endif %}
    </div>
  </div>

  {% if footer is not empty %}
    <div class="component-wrapper--footer">
      {{ footer }}
    </div>
  {% endif %}

</div>
