{{#extend "modal" id="share-list-modal" classIconTitle="fas fa-share-alt" title='Share "My Project List"' fullWidth=true wide=true}}
  {{#content "sections"}}

    {{#extend "modal-body-section" customSectionClass="share-list share-list__link"}}
      {{#content "body"}}
        <div class="share-list__link-label">
          <h5>Project list link</h5>
          <span id="copy-link">
                    <a href="#"><i class="fas fa-copy icon"></i><span class="link-title">Copy link</span></a>
                </span>
        </div>
        {{> form-row id="shopping-list-link"}}
      {{/content}}
    {{/extend}}

    {{#extend "modal-body-section" customSectionClass="share-list share-list__email"}}
      {{#content "body"}}

        <form class="share-list__form" action="#" id="share-list-form">

          {{> form-row type="email" id="share-via-email" label="Share via email" info="Enter email addresses separated by space:"}}

          <div class="share-via-email-box">
            {{> form-row type="email"}}
          </div>

          <span id="add-btn" class="add-email-btn">
                    <a href="#"><i class="fas fa-plus-square icon"></i><span class="link-title">Add email</span></a>
                </span>

          <div class="email-notification">{{> notifications notification-page.success_email-sent withCloseBtn="true"}}</div>

          <div class="btn-share-confirmation">
            <button class="btn btn-primary">
              <span class="btn__text">Share</span>
            </button>
            <button class="btn btn-secondary share-list__cancel">
              <span class="btn__text">Cancel</span>
            </button>
          </div>
        </form>
      {{/content}}
    {{/extend}}
  {{/content}}
{{/extend}}


<script>
  let count = 0;
  $('.share-via-email-box').hide();
  $('#add-btn').click(function(){
    $('.share-via-email-box').show();

    if (count >= 1 && count < 3) {
      $(this).prev('.share-via-email-box').clone().insertBefore(this);
    }

    if (count === 3) {
      $(this).prev('.share-via-email-box').clone().insertBefore(this);
      $('#add-btn').hide();
    }

    count++;
  })

  $(".share-list__cancel").bind("click", function() {
    $("input[type=email]").val("");
  });
</script>