@if (parameter(); as parameter) {
  @switch (parameter.type) {
    @case (eParameterType.FLOAT) {
      <z-slider
        class="w-[200px]"
        [min]="parameter.min"
        [max]="parameter.max"
        [step]="0.1"
        [showValueLabel]="true"
        [value]="value$()"
        (changeEnd)="updateValue($event)"
      ></z-slider>

      <input
        z-input
        class="shrink-0 block ml-4 pl-3 w-24 h-8 text-[13px] text-gra-900"
        [max]="parameter.max"
        [min]="parameter.min"
        [step]="0.1"
        type="number"
        [ngModel]="value$()"
        (ngModelChange)="updateNumericValue($event, eParameterType.FLOAT)"
        [ngModelOptions]="{ standalone: true }"
      />
    }
    @case (eParameterType.INT) {
      <z-slider
        class="w-[200px]"
        [min]="parameter.min"
        [max]="parameter.max"
        [showValueLabel]="true"
        [value]="value$()"
        (changeEnd)="updateValue($event)"
      ></z-slider>

      <input
        z-input
        class="shrink-0 block ml-4 pl-3 w-24 h-8 text-[13px] text-gra-900"
        [max]="parameter.max"
        [min]="parameter.min"
        [step]="1"
        type="number"
        [ngModel]="value$()"
        (ngModelChange)="updateNumericValue($event, eParameterType.INT)"
        [ngModelOptions]="{ standalone: true }"
      />
    }

    @case (eParameterType.BOOLEAN) {
      <z-switch [(ngModel)]="value$" [ngModelOptions]="{ standalone: true }" zSize="sm" />
    }

    @default {
      @if (parameter.options) {
        <select
          class="xp-input w-36 h-full border-0 pl-3 pr-4 sm:text-sm sm:leading-6 focus-visible:outline-none focus-visible:bg-components-list-option-active-bg group-hover:bg-hover-bg cursor-pointer"
          [(ngModel)]="value$"
          [ngModelOptions]="{ standalone: true }"
        >
          @for (option of parameter.options; track option) {
            <option [value]="option" class="px-2 py-1 rounded-lg hover:bg-hover-bg">{{ option }}</option>
          }
        </select>
      } @else {
        <input
          z-input
          class="w-full ml-4 flex items-center h-8 text-[13px] text-gra-900"
          [(ngModel)]="value$"
          [ngModelOptions]="{ standalone: true }"
        />
      }
    }
  }
}