<div {{ attributes.defaults(stimulus_controller(this.shortName)) }}>
   <div
         {% if this.isCarousel %}{{ stimulus_target(this.shortName, 'carousel') }}{% endif %}
         {% if this.hasControls %} data-controls="true"{% endif %}
         {% if this.hasNav %} data-nav="true"{% endif %}
        data-number-of-slides="{{ this.numberOfSlides }}"
        data-gap-between-sliders="{{ this.gapBetweenSliders }}"
   >
         <twig:block name="content"></twig:block>
   </div>
   {% if this.hasControls %}
      <div class="tns-controls" data-tns-controls>
         <button class="btn">
            <twig:ux:icon name="caret-left"/>
         </button>
         <button class="btn">
            <twig:ux:icon name="caret-right"/>
         </button>
      </div>
   {% endif %}
</div>
