linstrom/frontend-reactive/app/components/util/map-edit.hbs

<div class="{{@wrapper-classes}}">
  {{#if @readonly}}
    <ul>
      {{#each this.args.list as |element|}}
        <li>
          <div class="string-array-element-wrapper">
            <p class="{{@element-key-classes}}">{{element.key}}</p>
            <p class="{{@element-value-classes}}">{{element.value}}</p>
          </div>
        </li>
      {{/each}}
    </ul>
  {{else}}
    <ul>
      {{#each this.args.list as |element index|}}
        <li>
          <div class="string-array-element-wrapper">
            <Input @type="text" @value={{element.key}} />
            <Input @type="text" @value={{element.value}} />
            <div
              class="{{@remove-element-classes}}"
              type="button"
              {{on "click" (fn this.removeElement index)}}
            >
              X
            </div>
          </div>
        </li>
      {{/each}}

    </ul>
    <div
      class="{{@add-element-classes}}"
      type="button"
      {{on "click" this.addElement}}
    >
      Add element
    </div>
  {{/if}}
</div>