<div class="topcoat-list dispobox-delivery-list {{#if ui.state.edit}}editing{{/if}}">
  <h2 class="topcoat-list__header">
    <span>
      <button class="topcoat-button--quiet icomatic expand-collapse" {{#unless ui.locked}}disabled{{/unless}}>{{#if expanded }}collapse{{else}}expand{{/if}}</button>
      {{ title }}
    </span>
    <span>
      {{#unless ui.locked}}
        <button type="button" class="topcoat-icon-button haptic icomatic add-new" {{#if ui.state.edit}}disabled{{/if}}>plus</button>
      {{/unless}}
      <button type="button" class="topcoat-icon-button haptic icomatic today" {{#if ui.state.edit}}disabled{{/if}}>calendar</button>
      <button type="button" class="topcoat-icon-button haptic icomatic back" {{#if ui.state.edit}}disabled{{/if}}>back</button>
      <button type="button" class="topcoat-icon-button haptic icomatic next" {{#if ui.state.edit}}disabled{{/if}}>next</button>
    </span>
  </h2>
  <ul class="topcoat-list__container">
    {{> dispobox_delivery_list }}
  </ul>
</div>
