<div class="editor" (click)="onClick()">
  <span class="state-container">
    @switch (currentPropertyState()) {
      @case (readState) {
        <span>
            @switch(containerType()) {
              @case('WritableSignal') {
                <span class="editable">Signal({{valueToSubmit()}})</span>
              }
              @default {
                <span class="editable">{{ valueToSubmit() }}</span>
              }
            }
        </span>
      }
      @case (writeState) {
        <span>
          <input
            #inputEl
            matInput
            type="text"
            class="editor-input editable"
            (mousedown)="$event.stopPropagation()"
            [(ngModel)]="valueToSubmit"
            (keydown.enter)="accept()"
            (keydown.escape)="reject()"
            (blur)="onBlur()"
            />
        </span>
      }
    }
  </span>
</div>
