<sky-modal class="lookup-custom-picker-modal" headingText="Names">
  <sky-modal-content>
    @if (peopleForm) {
      <form [formGroup]="peopleForm">
        <sky-selection-box-grid>
          @for (
            personControl of peopleForm.controls.people.controls;
            track personControl;
            let i = $index
          ) {
            <sky-selection-box [control]="checkbox">
              <sky-icon icon="user" />
              <sky-selection-box-header>
                {{ people[i].name }}
              </sky-selection-box-header>
              <sky-selection-box-description>
                {{ people[i].formal }}
              </sky-selection-box-description>
              <sky-checkbox #checkbox [formControl]="personControl" />
            </sky-selection-box>
          }
        </sky-selection-box-grid>
      </form>
    } @else {
      <div class="wait-container">
        <sky-wait [isWaiting]="true" />
      </div>
    }
  </sky-modal-content>
  <sky-modal-footer>
    <button
      class="sky-btn sky-btn-primary lookup-custom-picker-save-button"
      type="button"
      (click)="save()"
    >
      Save
    </button>
  </sky-modal-footer>
</sky-modal>
