<div class="dialog-header">
	<h2 mat-dialog-title>{{ title }}</h2>
	<div class="dialog-header-actions" *ngIf="modalButtonsTop">
		<ng-container *ngTemplateOutlet="actions"></ng-container>
	</div>
</div>

<div class="alert alert-danger mat-dialog-error dialog-header-error" *ngIf="modalButtonsTop && hasError">
	<ng-container *ngIf="errorMessage">{{ errorMessage }}</ng-container>
	<ng-container *ngIf="error">
		<p *ngIf="error.title">{{ error.title }}</p>
		<ul *ngIf="error.errors">
			<li *ngFor="let item of error.errors | keyvalue">{{ item.value }}</li>
		</ul>
	</ng-container>
</div>

<div mat-dialog-content>
	<ng-content></ng-content>

	<mat-dialog-actions class="mat-dialog-actions" *ngIf="!modalButtonsTop">
		<div class="mat-dialog-left">
			<div class="alert alert-danger mat-dialog-error" *ngIf="hasError">
				<ng-container *ngIf="errorMessage">{{ errorMessage }}</ng-container>
				<ng-container *ngIf="error">
					<p *ngIf="error.title">{{ error.title }}</p>
					<ul *ngIf="error.errors">
						<li *ngFor="let item of error.errors | keyvalue">{{ item.value }}</li>
					</ul>
				</ng-container>
			</div>
		</div>
		<div class="mat-dialog-right">
			<div class="button-bottom">
				<ng-container *ngTemplateOutlet="actions"></ng-container>
			</div>
		</div>
	</mat-dialog-actions>
</div>
