@if (layout == 'horizontal') {
  <div class="w-view-text-content grid flex align-content-center">
    <div class="col-4">
      <w-input-label class="flex" [label]="label" [tooltip]="tooltip" [tooltipPosition]="tooltipPosition"></w-input-label>
    </div>
    <div class="col-8 w-view-text-value" [ngClass]="{'w-text-value-list': displayAsList == true}">
      <span class="flex"> {{checkEmptyValue(value)}} </span>
    </div>
  </div>
} @else {
  <div class="flex flex-column">
    <w-input-label class="flex" [label]="label" [tooltip]="tooltip" [tooltipPosition]="tooltipPosition"></w-input-label>
    <div class="flex input-label-gap-divider"></div>
    <div class="flex w-view-text-value" [ngClass]="{'w-text-value-list': displayAsList == true}">
      <span class="flex"> {{checkEmptyValue(value)}} </span>
    </div>
    <div class="flex spacingXSMDivider"></div>
  </div>
}