<section class="dialog">
    <div
        [innerHTML]="'edit-dossier-dialog.dictionary.edit-dialog.title' | translate: { label: data.label }"
        class="dialog-header heading-l"
    ></div>

    <form (submit)="save()" [formGroup]="form">
        <div class="dialog-content">
            <div class="iqser-input-group w-300">
                <mat-checkbox formControlName="addToDictionaryAction">
                    {{ 'edit-dossier-dialog.dictionary.edit-dialog.add-to-dictionary-action' | translate }}
                </mat-checkbox>
            </div>
        </div>

        <div class="dialog-actions" *ngIf="data.canEdit">
            <iqser-icon-button
                [disabled]="!form.valid || !changed"
                [label]="'edit-dossier-dialog.dictionary.edit-dialog.save' | translate"
                [submit]="true"
                [type]="iconButtonTypes.primary"
            ></iqser-icon-button>

            <div
                [translate]="'edit-dossier-dialog.dictionary.edit-dialog.cancel'"
                class="all-caps-label pointer cancel"
                mat-dialog-close
            ></div>
        </div>
    </form>

    <iqser-circle-button class="dialog-close" icon="iqser:close" mat-dialog-close></iqser-circle-button>
</section>
