psp_panel/src/app/shared/components/card-data.component.html

<p-card>
  <ng-template #title>
    <ng-container [ngTemplateOutlet]="header">
      <div class="flex items-center gap-10 justify-between">
        <h5 class="font-bold py-1.5">{{ cardTitle }}</h5>
        <div class="flex items-center gap-2 shrink-0">
          <ng-container [ngTemplateOutlet]="moreActions"></ng-container>
          @if (showRefresh) {
            <p-button icon="pi pi-refresh" outlined (click)="refresh()"></p-button>
          }
          @if (editable) {
            <button
              pButton
              type="button"
              [icon]="`pi ${editMode ? 'pi-times' : 'pi-pencil'}`"
              class="p-button-text p-button-plain"
              (click)="onEditClick()"
            ></button>
          }
        </div>
      </div>
    </ng-container>
    <hr />
  </ng-template>
  <ng-content></ng-content>
</p-card>