kanban.hbs

<div class="header">
  <div 
    class="header__text"
    object
    key:board-heading="@innerText"
    default:board-heading="My Projects"
    edit:board-heading:without-remove
  >{{boardHeading}}</div>
  <button 
    class="button button--add-stack"
    new:stack
  >Add stack</button>
</div>
<div class="board-container">
  <div 
    class="board"
    array
    key="stacks"
    sortable="stacks"
  >
    {{#for stack in stacks}}
      <div 
        class="stack"
        object
        key:stack-heading="@search"
        default:stack-heading="A Project"
      >
        <div class="stack__top">
          <p 
            class="stack__text"
            target:stack-heading="@innerText"
            edit:stack-heading
          >{{default stack.stackHeading "New stack item"}}</p>
          <button 
            class="button button--plus-square"
            new:card
          >
            <img class="stack__new-icon" src="/images/new.svg">
          </button>
        </div>
        <div 
          class="stack__list"
          key="cards"
          array
          sortable="cards"
        >
          {{#for card in stack.cards}}
            <div 
              class="card"
              object
              key:card-text="@search"
              edit:card-text
            >
              <p 
                class="card__text"
                target:card-text="@innerText"
              >{{default card.cardText "New card item"}}</p>
              <img class="card__drag" src="/images/drag.svg">
            </div>
          {{/for}}
        </div>
        <div class="stack__add-card-container">
          <button 
            class="stack__add-card"
            new:card
          >
            <img class="stack__add-card-icon" src="/images/plus.svg"><p>Add card</p>
          </button>
        </div>
      </div>
    {{/for}}
  </div>
</div>