@let emptyProperties = emptyStateProperties();

@if (emptyProperties) {
  <bit-status-lockup>
    <bit-svg slot="graphic" [content]="emptyProperties.icon"></bit-svg>

    <span slot="title">{{ emptyProperties.title }}</span>

    @if (emptyProperties.description) {
      <span slot="description">{{ emptyProperties.description }}</span>
    }

    @if (emptyProperties.key === EMPTY_FOLDERS_STATE.emptyFolders) {
      <ng-container slot="button">
        <ng-content select="[slot=empty-add-folder]"></ng-content>
      </ng-container>
    }

    @if (emptyProperties.key === EMPTY_FOLDERS_STATE.noSearchMatches) {
      <button
        slot="button"
        bitButton
        type="button"
        buttonType="secondary"
        startIcon="bwi-clear"
        (click)="clearSearch.emit()"
      >
        {{ "clearSearch" | i18n }}
      </button>
    }
  </bit-status-lockup>
}