@ecodev/natural-editor 58.0.0 → 58.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/class-dialog/class-dialog.component.mjs +2 -2
- package/esm2022/lib/color-dialog/color-dialog.component.mjs +2 -2
- package/esm2022/lib/editor/editor.component.mjs +2 -2
- package/esm2022/lib/id-dialog/id-dialog.component.mjs +2 -2
- package/esm2022/lib/link-dialog/link-dialog.component.mjs +2 -2
- package/fesm2022/ecodev-natural-editor.mjs +10 -10
- package/package.json +1 -1
|
@@ -30,11 +30,11 @@ export class ClassDialogComponent {
|
|
|
30
30
|
this.dialogRef.close(this.form.getRawValue());
|
|
31
31
|
}
|
|
32
32
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ClassDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
33
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ClassDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>Saisir les classes CSS</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>Classes CSS</mat-label>\n <input matInput [formControl]=\"classControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (classControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ou plusieurs nom de classe CSS</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{width:70vw;max-width:30em
|
|
33
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ClassDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>Saisir les classes CSS</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>Classes CSS</mat-label>\n <input matInput [formControl]=\"classControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (classControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ou plusieurs nom de classe CSS</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;width:70vw;max-width:30em}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] }); }
|
|
34
34
|
}
|
|
35
35
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ClassDialogComponent, decorators: [{
|
|
36
36
|
type: Component,
|
|
37
|
-
args: [{ standalone: true, imports: [MatDialogModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatButtonModule], template: "<h2 i18n mat-dialog-title>Saisir les classes CSS</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>Classes CSS</mat-label>\n <input matInput [formControl]=\"classControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (classControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ou plusieurs nom de classe CSS</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{width:70vw;max-width:30em
|
|
37
|
+
args: [{ standalone: true, imports: [MatDialogModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatButtonModule], template: "<h2 i18n mat-dialog-title>Saisir les classes CSS</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>Classes CSS</mat-label>\n <input matInput [formControl]=\"classControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (classControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ou plusieurs nom de classe CSS</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;width:70vw;max-width:30em}\n"] }]
|
|
38
38
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
39
39
|
type: Inject,
|
|
40
40
|
args: [MAT_DIALOG_DATA]
|
|
@@ -179,7 +179,7 @@ export class ColorDialogComponent {
|
|
|
179
179
|
this.maybeConfirm();
|
|
180
180
|
}
|
|
181
181
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ColorDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
182
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ColorDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>S\u00E9lectionner une couleur</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <div>\n @for (row of colors; track row) {\n <div>\n @for (color of row; track color) {\n <div class=\"color\" [style]=\"{backgroundColor: color}\" (click)=\"selectColor(color)\"> </div>\n }\n </div>\n }\n </div>\n\n <div>\n <button mat-button (click)=\"selectColor('')\">\n <mat-icon naturalIcon=\"format_color_reset\" />\n <span i18n>Transparent</span></button\n >\n </div>\n\n <mat-form-field>\n <mat-label i18n>Couleur</mat-label>\n <input matInput [formControl]=\"colorControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n <div\n class=\"sample\"\n matTextSuffix\n [style]=\"{backgroundColor: colorControl.valid ? colorControl.value : ''}\"\n ></div>\n @if (colorControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre le format hexadecimal. Par exemple: #ff4000 </mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{
|
|
182
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ColorDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>S\u00E9lectionner une couleur</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <div>\n @for (row of colors; track row) {\n <div>\n @for (color of row; track color) {\n <div class=\"color\" [style]=\"{backgroundColor: color}\" (click)=\"selectColor(color)\"> </div>\n }\n </div>\n }\n </div>\n\n <div>\n <button mat-button (click)=\"selectColor('')\">\n <mat-icon naturalIcon=\"format_color_reset\" />\n <span i18n>Transparent</span></button\n >\n </div>\n\n <mat-form-field>\n <mat-label i18n>Couleur</mat-label>\n <input matInput [formControl]=\"colorControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n <div\n class=\"sample\"\n matTextSuffix\n [style]=\"{backgroundColor: colorControl.valid ? colorControl.value : ''}\"\n ></div>\n @if (colorControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre le format hexadecimal. Par exemple: #ff4000 </mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;row-gap:25px;justify-content:center;width:70vw;max-width:30em}.color{display:inline-block;cursor:pointer;margin:3px;width:25px;height:25px}.color:hover{margin:0;padding:3px}.sample{width:27px;height:27px}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NaturalIconDirective, selector: "mat-icon[naturalIcon]", inputs: ["naturalIcon", "size"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i5.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }] }); }
|
|
183
183
|
}
|
|
184
184
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ColorDialogComponent, decorators: [{
|
|
185
185
|
type: Component,
|
|
@@ -192,7 +192,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImpor
|
|
|
192
192
|
NaturalIconDirective,
|
|
193
193
|
MatFormFieldModule,
|
|
194
194
|
MatInputModule,
|
|
195
|
-
], template: "<h2 i18n mat-dialog-title>S\u00E9lectionner une couleur</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <div>\n @for (row of colors; track row) {\n <div>\n @for (color of row; track color) {\n <div class=\"color\" [style]=\"{backgroundColor: color}\" (click)=\"selectColor(color)\"> </div>\n }\n </div>\n }\n </div>\n\n <div>\n <button mat-button (click)=\"selectColor('')\">\n <mat-icon naturalIcon=\"format_color_reset\" />\n <span i18n>Transparent</span></button\n >\n </div>\n\n <mat-form-field>\n <mat-label i18n>Couleur</mat-label>\n <input matInput [formControl]=\"colorControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n <div\n class=\"sample\"\n matTextSuffix\n [style]=\"{backgroundColor: colorControl.valid ? colorControl.value : ''}\"\n ></div>\n @if (colorControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre le format hexadecimal. Par exemple: #ff4000 </mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{
|
|
195
|
+
], template: "<h2 i18n mat-dialog-title>S\u00E9lectionner une couleur</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <div>\n @for (row of colors; track row) {\n <div>\n @for (color of row; track color) {\n <div class=\"color\" [style]=\"{backgroundColor: color}\" (click)=\"selectColor(color)\"> </div>\n }\n </div>\n }\n </div>\n\n <div>\n <button mat-button (click)=\"selectColor('')\">\n <mat-icon naturalIcon=\"format_color_reset\" />\n <span i18n>Transparent</span></button\n >\n </div>\n\n <mat-form-field>\n <mat-label i18n>Couleur</mat-label>\n <input matInput [formControl]=\"colorControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n <div\n class=\"sample\"\n matTextSuffix\n [style]=\"{backgroundColor: colorControl.valid ? colorControl.value : ''}\"\n ></div>\n @if (colorControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre le format hexadecimal. Par exemple: #ff4000 </mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;row-gap:25px;justify-content:center;width:70vw;max-width:30em}.color{display:inline-block;cursor:pointer;margin:3px;width:25px;height:25px}.color:hover{margin:0;padding:3px}.sample{width:27px;height:27px}\n"] }]
|
|
196
196
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
197
197
|
type: Inject,
|
|
198
198
|
args: [MAT_DIALOG_DATA]
|
|
@@ -197,7 +197,7 @@ export class NaturalEditorComponent {
|
|
|
197
197
|
this.view.focus();
|
|
198
198
|
}
|
|
199
199
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: NaturalEditorComponent, deps: [{ token: i1.NgControl, optional: true, self: true }, { token: DOCUMENT }, { token: i2.MatDialog }, { token: i3.ImagePlugin }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
200
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: NaturalEditorComponent, isStandalone: true, selector: "natural-editor", inputs: { imageUploader: "imageUploader" }, outputs: { contentChange: "contentChange", save: "save" }, providers: [ImagePlugin], viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "@if (menu && !this.disabled) {\n <div class=\"menu-container\">\n <div class=\"menu\">\n @if (save.observed) {\n <button mat-icon-button (click)=\"save.emit()\" i18n-matTooltip matTooltip=\"Enregistrer\">\n <mat-icon fontIcon=\"save\" />\n </button>\n }\n <mat-button-toggle-group hideMultipleSelectionIndicator multiple>\n @if (menu.toggleStrong) {\n <mat-button-toggle\n [disabled]=\"menu.toggleStrong.disabled\"\n [checked]=\"menu.toggleStrong.active\"\n (click)=\"run($event, 'toggleStrong')\"\n i18n-matTooltip\n matTooltip=\"Gras\"\n >\n <mat-icon fontIcon=\"format_bold\" />\n </mat-button-toggle>\n }\n @if (menu.toggleEm) {\n <mat-button-toggle\n [disabled]=\"menu.toggleEm.disabled\"\n [checked]=\"menu.toggleEm.active\"\n (click)=\"run($event, 'toggleEm')\"\n i18n-matTooltip\n matTooltip=\"Italique\"\n >\n <mat-icon fontIcon=\"format_italic\" />\n </mat-button-toggle>\n }\n @if (menu.toggleCode) {\n <mat-button-toggle\n [disabled]=\"menu.toggleCode.disabled\"\n [checked]=\"menu.toggleCode.active\"\n (click)=\"run($event, 'toggleCode')\"\n i18n-matTooltip\n matTooltip=\"Code\"\n >\n <mat-icon fontIcon=\"code\" />\n </mat-button-toggle>\n }\n @if (menu.toggleLink) {\n <mat-button-toggle\n [disabled]=\"menu.toggleLink.disabled\"\n [checked]=\"menu.toggleLink.active\"\n (click)=\"run($event, 'toggleLink')\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer un lien...\"\n >\n <mat-icon fontIcon=\"insert_link\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n <button mat-button [matMenuTriggerFor]=\"blockMenu\">\n <span i18n>Type</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n <mat-menu #blockMenu=\"matMenu\">\n @if (menu.makeParagraph) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeParagraph.disabled\"\n (click)=\"run($event, 'makeParagraph')\"\n i18n\n >Paragraphe\n </button>\n }\n @if (menu.makeCodeBlock) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeCodeBlock.disabled\"\n (click)=\"run($event, 'makeCodeBlock')\"\n i18n\n >Code\n </button>\n }\n @if (menu.makeHead1) {\n <button mat-menu-item [disabled]=\"menu.makeHead1.disabled\" (click)=\"run($event, 'makeHead1')\" i18n\n >Titre 1\n </button>\n }\n @if (menu.makeHead2) {\n <button mat-menu-item [disabled]=\"menu.makeHead2.disabled\" (click)=\"run($event, 'makeHead2')\" i18n\n >Titre 2\n </button>\n }\n @if (menu.makeHead3) {\n <button mat-menu-item [disabled]=\"menu.makeHead3.disabled\" (click)=\"run($event, 'makeHead3')\" i18n\n >Titre 3\n </button>\n }\n @if (menu.makeHead4) {\n <button mat-menu-item [disabled]=\"menu.makeHead4.disabled\" (click)=\"run($event, 'makeHead4')\" i18n\n >Titre 4\n </button>\n }\n @if (menu.makeHead5) {\n <button mat-menu-item [disabled]=\"menu.makeHead5.disabled\" (click)=\"run($event, 'makeHead5')\" i18n\n >Titre 5\n </button>\n }\n @if (menu.makeHead6) {\n <button mat-menu-item [disabled]=\"menu.makeHead6.disabled\" (click)=\"run($event, 'makeHead6')\" i18n\n >Titre 6\n </button>\n }\n <mat-divider />\n @if (menu.blockClass) {\n <button mat-menu-item [disabled]=\"menu.blockClass.disabled\" (click)=\"run($event, 'blockClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.blockId) {\n <button i18n mat-menu-item [disabled]=\"menu.blockId.disabled\" (click)=\"run($event, 'blockId')\"\n >ID...\n </button>\n }\n </mat-menu>\n @if (menu.addColumnBefore) {\n <button mat-button [matMenuTriggerFor]=\"tableMenu\">\n <span i18n>Tableau</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n }\n <mat-menu #tableMenu=\"matMenu\">\n @if (menu.insertTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.insertTable.disabled\"\n (click)=\"run($event, 'insertTable')\"\n i18n\n >Ins\u00E9rer un tableau\n </button>\n }\n @if (menu.deleteTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteTable.disabled\"\n (click)=\"run($event, 'deleteTable')\"\n i18n\n >Supprimer le tableau\n </button>\n }\n @if (menu.mergeCells) {\n <button mat-menu-item [disabled]=\"menu.mergeCells.disabled\" (click)=\"run($event, 'mergeCells')\" i18n\n >Fusionner les cellules\n </button>\n }\n @if (menu.splitCell) {\n <button mat-menu-item [disabled]=\"menu.splitCell.disabled\" (click)=\"run($event, 'splitCell')\" i18n\n >Scinder les cellules\n </button>\n }\n @if (menu.cellBackgroundColor) {\n <button\n mat-menu-item\n [disabled]=\"menu.cellBackgroundColor.disabled\"\n (click)=\"run($event, 'cellBackgroundColor')\"\n i18n\n >Couleur de fond...\n </button>\n }\n @if (menu.tableClass) {\n <button mat-menu-item [disabled]=\"menu.tableClass.disabled\" (click)=\"run($event, 'tableClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.tableId) {\n <button i18n mat-menu-item [disabled]=\"menu.tableId.disabled\" (click)=\"run($event, 'tableId')\"\n >ID...\n </button>\n }\n <mat-divider />\n @if (menu.addColumnBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnBefore.disabled\"\n (click)=\"run($event, 'addColumnBefore')\"\n i18n\n >Ins\u00E9rer une colonne avant\n </button>\n }\n @if (menu.addColumnAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnAfter.disabled\"\n (click)=\"run($event, 'addColumnAfter')\"\n i18n\n >Ins\u00E9rer une colonne apr\u00E8s\n </button>\n }\n @if (menu.deleteColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteColumn.disabled\"\n (click)=\"run($event, 'deleteColumn')\"\n i18n\n >Supprimer la colonne\n </button>\n }\n <mat-divider />\n @if (menu.addRowBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowBefore.disabled\"\n (click)=\"run($event, 'addRowBefore')\"\n i18n\n >Ins\u00E9rer une ligne avant\n </button>\n }\n @if (menu.addRowAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowAfter.disabled\"\n (click)=\"run($event, 'addRowAfter')\"\n i18n\n >Ins\u00E9rer une ligne apr\u00E8s\n </button>\n }\n @if (menu.deleteRow) {\n <button mat-menu-item [disabled]=\"menu.deleteRow.disabled\" (click)=\"run($event, 'deleteRow')\" i18n\n >Supprimer la ligne\n </button>\n }\n <mat-divider />\n @if (menu.toggleHeaderColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderColumn.disabled\"\n (click)=\"run($event, 'toggleHeaderColumn')\"\n i18n\n >Ent\u00EAte de colonne\n </button>\n }\n @if (menu.toggleHeaderRow) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderRow.disabled\"\n (click)=\"run($event, 'toggleHeaderRow')\"\n i18n\n >Ent\u00EAte de ligne\n </button>\n }\n @if (menu.toggleHeaderCell) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderCell.disabled\"\n (click)=\"run($event, 'toggleHeaderCell')\"\n i18n\n >Ent\u00EAte de cellule\n </button>\n }\n </mat-menu>\n @if (imageUploader) {\n <button\n mat-icon-button\n naturalFileDrop\n [selectable]=\"true\"\n [broadcast]=\"false\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer une image\"\n (fileChange)=\"upload($event)\"\n >\n <mat-icon fontIcon=\"insert_photo\" />\n </button>\n }\n @if (menu.alignLeft) {\n <mat-button-toggle-group hideSingleSelectionIndicator>\n @if (menu.alignLeft) {\n <mat-button-toggle\n [disabled]=\"menu.alignLeft.disabled\"\n [checked]=\"menu.alignLeft.active\"\n (click)=\"run($event, 'alignLeft')\"\n i18n-matTooltip\n matTooltip=\"Aligner gauche\"\n >\n <mat-icon fontIcon=\"format_align_left\" />\n </mat-button-toggle>\n }\n @if (menu.alignCenter) {\n <mat-button-toggle\n [disabled]=\"menu.alignCenter.disabled\"\n [checked]=\"menu.alignCenter.active\"\n (click)=\"run($event, 'alignCenter')\"\n i18n-matTooltip\n matTooltip=\"Centrer\"\n >\n <mat-icon fontIcon=\"format_align_center\" />\n </mat-button-toggle>\n }\n @if (menu.alignRight) {\n <mat-button-toggle\n [disabled]=\"menu.alignRight.disabled\"\n [checked]=\"menu.alignRight.active\"\n (click)=\"run($event, 'alignRight')\"\n i18n-matTooltip\n matTooltip=\"Aligner droite\"\n >\n <mat-icon fontIcon=\"format_align_right\" />\n </mat-button-toggle>\n }\n @if (menu.alignJustify) {\n <mat-button-toggle\n [disabled]=\"menu.alignJustify.disabled\"\n [checked]=\"menu.alignJustify.active\"\n (click)=\"run($event, 'alignJustify')\"\n i18n-matTooltip\n matTooltip=\"Justifier\"\n >\n <mat-icon fontIcon=\"format_align_justify\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n }\n @if (menu.undo) {\n <button\n mat-icon-button\n [disabled]=\"menu.undo.disabled\"\n (click)=\"run($event, 'undo')\"\n i18n-matTooltip\n matTooltip=\"Annuler\"\n >\n <mat-icon fontIcon=\"undo\" />\n </button>\n }\n @if (menu.redo) {\n <button\n mat-icon-button\n [disabled]=\"menu.redo.disabled\"\n (click)=\"run($event, 'redo')\"\n i18n-matTooltip\n matTooltip=\"Refaire\"\n >\n <mat-icon fontIcon=\"redo\" />\n </button>\n }\n @if (menu.wrapBulletList && menu.wrapBulletList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBulletList.disabled\"\n (click)=\"run($event, 'wrapBulletList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 puce\"\n >\n <mat-icon fontIcon=\"format_list_bulleted\" />\n </button>\n }\n @if (menu.wrapOrderedList && menu.wrapOrderedList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapOrderedList.disabled\"\n (click)=\"run($event, 'wrapOrderedList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 num\u00E9ro\"\n >\n <mat-icon fontIcon=\"format_list_numbered\" />\n </button>\n }\n @if (menu.wrapBlockQuote && menu.wrapBlockQuote.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBlockQuote.disabled\"\n (click)=\"run($event, 'wrapBlockQuote')\"\n i18n-matTooltip\n matTooltip=\"Citation\"\n >\n <mat-icon fontIcon=\"format_quote\" />\n </button>\n }\n @if (menu.joinUp && menu.joinUp.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.joinUp.disabled\"\n (click)=\"run($event, 'joinUp')\"\n i18n-matTooltip\n matTooltip=\"Fusionner avec l'\u00E9l\u00E9ment du haut\"\n >\n <mat-icon fontIcon=\"move_up\" />\n </button>\n }\n @if (menu.lift && menu.lift.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.lift.disabled\"\n (click)=\"run($event, 'lift')\"\n i18n-matTooltip\n matTooltip=\"D\u00E9sindenter\"\n >\n <mat-icon fontIcon=\"format_indent_decrease\" />\n </button>\n }\n @if (menu.selectParentNode && menu.selectParentNode.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.selectParentNode.disabled\"\n (click)=\"run($event, 'selectParentNode')\"\n i18n-matTooltip\n matTooltip=\"S\u00E9lectionner l'\u00E9l\u00E9ment parent\"\n >\n <mat-icon fontIcon=\"select_all\" />\n </button>\n }\n </div>\n </div>\n}\n<div class=\"editor-container\" #editor></div>\n", styles: [".menu{border-bottom:1px solid;display:flex;flex-wrap:wrap;padding:10px 18px}.menu-container{position:sticky;top:-20px;z-index:999}::ng-deep .ProseMirror{position:relative}::ng-deep .ProseMirror{word-wrap:break-word;white-space:pre-wrap;-webkit-font-variant-ligatures:none;font-variant-ligatures:none}::ng-deep .ProseMirror pre{white-space:pre-wrap}::ng-deep .ProseMirror li{position:relative}::ng-deep .ProseMirror-hideselection *::selection{background:transparent}::ng-deep .ProseMirror-hideselection *::-moz-selection{background:transparent}::ng-deep .ProseMirror-hideselection{caret-color:transparent}::ng-deep .ProseMirror-selectednode{outline:2px solid #8cf}::ng-deep li.ProseMirror-selectednode{outline:none}::ng-deep li.ProseMirror-selectednode:after{content:\"\";position:absolute;inset:-2px -2px -2px -32px;border:2px solid #8cf;pointer-events:none}::ng-deep .ProseMirror-gapcursor{display:none;pointer-events:none;position:absolute}::ng-deep .ProseMirror-gapcursor:after{content:\"\";display:block;position:absolute;top:-2px;width:20px;border-top:1px solid black;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}::ng-deep .ProseMirror-focused .ProseMirror-gapcursor{display:block}::ng-deep .ProseMirror-example-setup-style hr{padding:2px 10px;border:none;margin:1em 0}::ng-deep .ProseMirror-example-setup-style hr:after{content:\"\";display:block;height:1px;background-color:silver;line-height:2px}::ng-deep .ProseMirror ul,::ng-deep .ProseMirror ol{padding-left:30px}::ng-deep .ProseMirror blockquote{padding-left:1em;border-left:3px solid #eee;margin-left:0;margin-right:0}::ng-deep .ProseMirror-example-setup-style img{cursor:default}::ng-deep .ProseMirror p:first-child,::ng-deep .ProseMirror h1:first-child,::ng-deep .ProseMirror h2:first-child,::ng-deep .ProseMirror h3:first-child,::ng-deep .ProseMirror h4:first-child,::ng-deep .ProseMirror h5:first-child,::ng-deep .ProseMirror h6:first-child{margin-top:10px}::ng-deep .ProseMirror{padding:4px 8px 4px 14px;line-height:1.2;outline:none}::ng-deep .ProseMirror p{margin-bottom:1em}::ng-deep .ProseMirror .tableWrapper{overflow-x:auto}::ng-deep .ProseMirror table{border-collapse:collapse;table-layout:fixed;width:100%;overflow:hidden}::ng-deep .ProseMirror td,::ng-deep .ProseMirror th{vertical-align:top;box-sizing:border-box;position:relative}::ng-deep .ProseMirror .column-resize-handle{position:absolute;right:-2px;top:0;bottom:0;width:4px;z-index:20;background-color:#adf;pointer-events:none}::ng-deep .ProseMirror.resize-cursor{cursor:col-resize}::ng-deep .ProseMirror .selectedCell:after{z-index:2;position:absolute;content:\"\";inset:0;background:#c8c8ff66;pointer-events:none}::ng-deep .ProseMirror table{margin:0}::ng-deep .ProseMirror th,::ng-deep .ProseMirror td{min-width:1em;border:1px solid #ddd;padding:3px 5px}::ng-deep .ProseMirror .tableWrapper{margin:1em 0}::ng-deep .ProseMirror th{font-weight:700;text-align:left}::ng-deep placeholder{display:block;width:50px;height:50px;background-size:500% 100%!important;animation:gradient 3s none infinite}@keyframes gradient{0%{background-position:100% 100%}to{background-position:0 0}}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i7.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i7.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i8.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i8.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i8.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i9.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: NaturalFileDropDirective, selector: ":not([naturalFileSelect])[naturalFileDrop]", outputs: ["fileOver"] }] }); }
|
|
200
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: NaturalEditorComponent, isStandalone: true, selector: "natural-editor", inputs: { imageUploader: "imageUploader" }, outputs: { contentChange: "contentChange", save: "save" }, providers: [ImagePlugin], viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "@if (menu && !this.disabled) {\n <div class=\"menu-container\">\n <div class=\"menu\">\n @if (save.observed) {\n <button mat-icon-button (click)=\"save.emit()\" i18n-matTooltip matTooltip=\"Enregistrer\">\n <mat-icon fontIcon=\"save\" />\n </button>\n }\n <mat-button-toggle-group hideMultipleSelectionIndicator multiple>\n @if (menu.toggleStrong) {\n <mat-button-toggle\n [disabled]=\"menu.toggleStrong.disabled\"\n [checked]=\"menu.toggleStrong.active\"\n (click)=\"run($event, 'toggleStrong')\"\n i18n-matTooltip\n matTooltip=\"Gras\"\n >\n <mat-icon fontIcon=\"format_bold\" />\n </mat-button-toggle>\n }\n @if (menu.toggleEm) {\n <mat-button-toggle\n [disabled]=\"menu.toggleEm.disabled\"\n [checked]=\"menu.toggleEm.active\"\n (click)=\"run($event, 'toggleEm')\"\n i18n-matTooltip\n matTooltip=\"Italique\"\n >\n <mat-icon fontIcon=\"format_italic\" />\n </mat-button-toggle>\n }\n @if (menu.toggleCode) {\n <mat-button-toggle\n [disabled]=\"menu.toggleCode.disabled\"\n [checked]=\"menu.toggleCode.active\"\n (click)=\"run($event, 'toggleCode')\"\n i18n-matTooltip\n matTooltip=\"Code\"\n >\n <mat-icon fontIcon=\"code\" />\n </mat-button-toggle>\n }\n @if (menu.toggleLink) {\n <mat-button-toggle\n [disabled]=\"menu.toggleLink.disabled\"\n [checked]=\"menu.toggleLink.active\"\n (click)=\"run($event, 'toggleLink')\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer un lien...\"\n >\n <mat-icon fontIcon=\"insert_link\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n <button mat-button [matMenuTriggerFor]=\"blockMenu\">\n <span i18n>Type</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n <mat-menu #blockMenu=\"matMenu\">\n @if (menu.makeParagraph) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeParagraph.disabled\"\n (click)=\"run($event, 'makeParagraph')\"\n i18n\n >Paragraphe\n </button>\n }\n @if (menu.makeCodeBlock) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeCodeBlock.disabled\"\n (click)=\"run($event, 'makeCodeBlock')\"\n i18n\n >Code\n </button>\n }\n @if (menu.makeHead1) {\n <button mat-menu-item [disabled]=\"menu.makeHead1.disabled\" (click)=\"run($event, 'makeHead1')\" i18n\n >Titre 1\n </button>\n }\n @if (menu.makeHead2) {\n <button mat-menu-item [disabled]=\"menu.makeHead2.disabled\" (click)=\"run($event, 'makeHead2')\" i18n\n >Titre 2\n </button>\n }\n @if (menu.makeHead3) {\n <button mat-menu-item [disabled]=\"menu.makeHead3.disabled\" (click)=\"run($event, 'makeHead3')\" i18n\n >Titre 3\n </button>\n }\n @if (menu.makeHead4) {\n <button mat-menu-item [disabled]=\"menu.makeHead4.disabled\" (click)=\"run($event, 'makeHead4')\" i18n\n >Titre 4\n </button>\n }\n @if (menu.makeHead5) {\n <button mat-menu-item [disabled]=\"menu.makeHead5.disabled\" (click)=\"run($event, 'makeHead5')\" i18n\n >Titre 5\n </button>\n }\n @if (menu.makeHead6) {\n <button mat-menu-item [disabled]=\"menu.makeHead6.disabled\" (click)=\"run($event, 'makeHead6')\" i18n\n >Titre 6\n </button>\n }\n <mat-divider />\n @if (menu.blockClass) {\n <button mat-menu-item [disabled]=\"menu.blockClass.disabled\" (click)=\"run($event, 'blockClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.blockId) {\n <button i18n mat-menu-item [disabled]=\"menu.blockId.disabled\" (click)=\"run($event, 'blockId')\"\n >ID...\n </button>\n }\n </mat-menu>\n @if (menu.addColumnBefore) {\n <button mat-button [matMenuTriggerFor]=\"tableMenu\">\n <span i18n>Tableau</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n }\n <mat-menu #tableMenu=\"matMenu\">\n @if (menu.insertTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.insertTable.disabled\"\n (click)=\"run($event, 'insertTable')\"\n i18n\n >Ins\u00E9rer un tableau\n </button>\n }\n @if (menu.deleteTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteTable.disabled\"\n (click)=\"run($event, 'deleteTable')\"\n i18n\n >Supprimer le tableau\n </button>\n }\n @if (menu.mergeCells) {\n <button mat-menu-item [disabled]=\"menu.mergeCells.disabled\" (click)=\"run($event, 'mergeCells')\" i18n\n >Fusionner les cellules\n </button>\n }\n @if (menu.splitCell) {\n <button mat-menu-item [disabled]=\"menu.splitCell.disabled\" (click)=\"run($event, 'splitCell')\" i18n\n >Scinder les cellules\n </button>\n }\n @if (menu.cellBackgroundColor) {\n <button\n mat-menu-item\n [disabled]=\"menu.cellBackgroundColor.disabled\"\n (click)=\"run($event, 'cellBackgroundColor')\"\n i18n\n >Couleur de fond...\n </button>\n }\n @if (menu.tableClass) {\n <button mat-menu-item [disabled]=\"menu.tableClass.disabled\" (click)=\"run($event, 'tableClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.tableId) {\n <button i18n mat-menu-item [disabled]=\"menu.tableId.disabled\" (click)=\"run($event, 'tableId')\"\n >ID...\n </button>\n }\n <mat-divider />\n @if (menu.addColumnBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnBefore.disabled\"\n (click)=\"run($event, 'addColumnBefore')\"\n i18n\n >Ins\u00E9rer une colonne avant\n </button>\n }\n @if (menu.addColumnAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnAfter.disabled\"\n (click)=\"run($event, 'addColumnAfter')\"\n i18n\n >Ins\u00E9rer une colonne apr\u00E8s\n </button>\n }\n @if (menu.deleteColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteColumn.disabled\"\n (click)=\"run($event, 'deleteColumn')\"\n i18n\n >Supprimer la colonne\n </button>\n }\n <mat-divider />\n @if (menu.addRowBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowBefore.disabled\"\n (click)=\"run($event, 'addRowBefore')\"\n i18n\n >Ins\u00E9rer une ligne avant\n </button>\n }\n @if (menu.addRowAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowAfter.disabled\"\n (click)=\"run($event, 'addRowAfter')\"\n i18n\n >Ins\u00E9rer une ligne apr\u00E8s\n </button>\n }\n @if (menu.deleteRow) {\n <button mat-menu-item [disabled]=\"menu.deleteRow.disabled\" (click)=\"run($event, 'deleteRow')\" i18n\n >Supprimer la ligne\n </button>\n }\n <mat-divider />\n @if (menu.toggleHeaderColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderColumn.disabled\"\n (click)=\"run($event, 'toggleHeaderColumn')\"\n i18n\n >Ent\u00EAte de colonne\n </button>\n }\n @if (menu.toggleHeaderRow) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderRow.disabled\"\n (click)=\"run($event, 'toggleHeaderRow')\"\n i18n\n >Ent\u00EAte de ligne\n </button>\n }\n @if (menu.toggleHeaderCell) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderCell.disabled\"\n (click)=\"run($event, 'toggleHeaderCell')\"\n i18n\n >Ent\u00EAte de cellule\n </button>\n }\n </mat-menu>\n @if (imageUploader) {\n <button\n mat-icon-button\n naturalFileDrop\n [selectable]=\"true\"\n [broadcast]=\"false\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer une image\"\n (fileChange)=\"upload($event)\"\n >\n <mat-icon fontIcon=\"insert_photo\" />\n </button>\n }\n @if (menu.alignLeft) {\n <mat-button-toggle-group hideSingleSelectionIndicator>\n @if (menu.alignLeft) {\n <mat-button-toggle\n [disabled]=\"menu.alignLeft.disabled\"\n [checked]=\"menu.alignLeft.active\"\n (click)=\"run($event, 'alignLeft')\"\n i18n-matTooltip\n matTooltip=\"Aligner gauche\"\n >\n <mat-icon fontIcon=\"format_align_left\" />\n </mat-button-toggle>\n }\n @if (menu.alignCenter) {\n <mat-button-toggle\n [disabled]=\"menu.alignCenter.disabled\"\n [checked]=\"menu.alignCenter.active\"\n (click)=\"run($event, 'alignCenter')\"\n i18n-matTooltip\n matTooltip=\"Centrer\"\n >\n <mat-icon fontIcon=\"format_align_center\" />\n </mat-button-toggle>\n }\n @if (menu.alignRight) {\n <mat-button-toggle\n [disabled]=\"menu.alignRight.disabled\"\n [checked]=\"menu.alignRight.active\"\n (click)=\"run($event, 'alignRight')\"\n i18n-matTooltip\n matTooltip=\"Aligner droite\"\n >\n <mat-icon fontIcon=\"format_align_right\" />\n </mat-button-toggle>\n }\n @if (menu.alignJustify) {\n <mat-button-toggle\n [disabled]=\"menu.alignJustify.disabled\"\n [checked]=\"menu.alignJustify.active\"\n (click)=\"run($event, 'alignJustify')\"\n i18n-matTooltip\n matTooltip=\"Justifier\"\n >\n <mat-icon fontIcon=\"format_align_justify\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n }\n @if (menu.undo) {\n <button\n mat-icon-button\n [disabled]=\"menu.undo.disabled\"\n (click)=\"run($event, 'undo')\"\n i18n-matTooltip\n matTooltip=\"Annuler\"\n >\n <mat-icon fontIcon=\"undo\" />\n </button>\n }\n @if (menu.redo) {\n <button\n mat-icon-button\n [disabled]=\"menu.redo.disabled\"\n (click)=\"run($event, 'redo')\"\n i18n-matTooltip\n matTooltip=\"Refaire\"\n >\n <mat-icon fontIcon=\"redo\" />\n </button>\n }\n @if (menu.wrapBulletList && menu.wrapBulletList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBulletList.disabled\"\n (click)=\"run($event, 'wrapBulletList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 puce\"\n >\n <mat-icon fontIcon=\"format_list_bulleted\" />\n </button>\n }\n @if (menu.wrapOrderedList && menu.wrapOrderedList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapOrderedList.disabled\"\n (click)=\"run($event, 'wrapOrderedList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 num\u00E9ro\"\n >\n <mat-icon fontIcon=\"format_list_numbered\" />\n </button>\n }\n @if (menu.wrapBlockQuote && menu.wrapBlockQuote.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBlockQuote.disabled\"\n (click)=\"run($event, 'wrapBlockQuote')\"\n i18n-matTooltip\n matTooltip=\"Citation\"\n >\n <mat-icon fontIcon=\"format_quote\" />\n </button>\n }\n @if (menu.joinUp && menu.joinUp.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.joinUp.disabled\"\n (click)=\"run($event, 'joinUp')\"\n i18n-matTooltip\n matTooltip=\"Fusionner avec l'\u00E9l\u00E9ment du haut\"\n >\n <mat-icon fontIcon=\"move_up\" />\n </button>\n }\n @if (menu.lift && menu.lift.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.lift.disabled\"\n (click)=\"run($event, 'lift')\"\n i18n-matTooltip\n matTooltip=\"D\u00E9sindenter\"\n >\n <mat-icon fontIcon=\"format_indent_decrease\" />\n </button>\n }\n @if (menu.selectParentNode && menu.selectParentNode.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.selectParentNode.disabled\"\n (click)=\"run($event, 'selectParentNode')\"\n i18n-matTooltip\n matTooltip=\"S\u00E9lectionner l'\u00E9l\u00E9ment parent\"\n >\n <mat-icon fontIcon=\"select_all\" />\n </button>\n }\n </div>\n </div>\n}\n<div class=\"editor-container\" #editor></div>\n", styles: [".menu{display:flex;flex-wrap:wrap;border-bottom:1px solid;padding:10px 18px}.menu-container{position:sticky;top:-20px;z-index:999}::ng-deep .ProseMirror{position:relative}::ng-deep .ProseMirror{word-wrap:break-word;-webkit-font-variant-ligatures:none;font-variant-ligatures:none;white-space:pre-wrap}::ng-deep .ProseMirror pre{white-space:pre-wrap}::ng-deep .ProseMirror li{position:relative}::ng-deep .ProseMirror-hideselection *::selection{background:transparent}::ng-deep .ProseMirror-hideselection *::-moz-selection{background:transparent}::ng-deep .ProseMirror-hideselection{caret-color:transparent}::ng-deep .ProseMirror-selectednode{outline:2px solid #8cf}::ng-deep li.ProseMirror-selectednode{outline:none}::ng-deep li.ProseMirror-selectednode:after{position:absolute;inset:-2px -2px -2px -32px;border:2px solid #8cf;pointer-events:none;content:\"\"}::ng-deep .ProseMirror-gapcursor{display:none;position:absolute;pointer-events:none}::ng-deep .ProseMirror-gapcursor:after{display:block;position:absolute;top:-2px;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite;border-top:1px solid black;width:20px;content:\"\"}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}::ng-deep .ProseMirror-focused .ProseMirror-gapcursor{display:block}::ng-deep .ProseMirror-example-setup-style hr{margin:1em 0;border:none;padding:2px 10px}::ng-deep .ProseMirror-example-setup-style hr:after{display:block;background-color:silver;height:1px;content:\"\";line-height:2px}::ng-deep .ProseMirror ul,::ng-deep .ProseMirror ol{padding-left:30px}::ng-deep .ProseMirror blockquote{margin-right:0;margin-left:0;border-left:3px solid #eee;padding-left:1em}::ng-deep .ProseMirror-example-setup-style img{cursor:default}::ng-deep .ProseMirror p:first-child,::ng-deep .ProseMirror h1:first-child,::ng-deep .ProseMirror h2:first-child,::ng-deep .ProseMirror h3:first-child,::ng-deep .ProseMirror h4:first-child,::ng-deep .ProseMirror h5:first-child,::ng-deep .ProseMirror h6:first-child{margin-top:10px}::ng-deep .ProseMirror{outline:none;padding:4px 8px 4px 14px;line-height:1.2}::ng-deep .ProseMirror p{margin-bottom:1em}::ng-deep .ProseMirror .tableWrapper{overflow-x:auto}::ng-deep .ProseMirror table{border-collapse:collapse;width:100%;table-layout:fixed;overflow:hidden}::ng-deep .ProseMirror td,::ng-deep .ProseMirror th{position:relative;vertical-align:top;box-sizing:border-box}::ng-deep .ProseMirror .column-resize-handle{position:absolute;top:0;right:-2px;bottom:0;z-index:20;background-color:#adf;width:4px;pointer-events:none}::ng-deep .ProseMirror.resize-cursor{cursor:col-resize}::ng-deep .ProseMirror .selectedCell:after{position:absolute;inset:0;z-index:2;background:#c8c8ff66;pointer-events:none;content:\"\"}::ng-deep .ProseMirror table{margin:0}::ng-deep .ProseMirror th,::ng-deep .ProseMirror td{border:1px solid #ddd;padding:3px 5px;min-width:1em}::ng-deep .ProseMirror .tableWrapper{margin:1em 0}::ng-deep .ProseMirror th{font-weight:700;text-align:left}::ng-deep placeholder{display:block;animation:gradient 3s none infinite;background-size:500% 100%!important;width:50px;height:50px}@keyframes gradient{0%{background-position:100% 100%}to{background-position:0 0}}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i7.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i7.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i8.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i8.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i8.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i9.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: NaturalFileDropDirective, selector: ":not([naturalFileSelect])[naturalFileDrop]", outputs: ["fileOver"] }] }); }
|
|
201
201
|
}
|
|
202
202
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: NaturalEditorComponent, decorators: [{
|
|
203
203
|
type: Component,
|
|
@@ -209,7 +209,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImpor
|
|
|
209
209
|
MatMenuModule,
|
|
210
210
|
MatDividerModule,
|
|
211
211
|
NaturalFileDropDirective,
|
|
212
|
-
], template: "@if (menu && !this.disabled) {\n <div class=\"menu-container\">\n <div class=\"menu\">\n @if (save.observed) {\n <button mat-icon-button (click)=\"save.emit()\" i18n-matTooltip matTooltip=\"Enregistrer\">\n <mat-icon fontIcon=\"save\" />\n </button>\n }\n <mat-button-toggle-group hideMultipleSelectionIndicator multiple>\n @if (menu.toggleStrong) {\n <mat-button-toggle\n [disabled]=\"menu.toggleStrong.disabled\"\n [checked]=\"menu.toggleStrong.active\"\n (click)=\"run($event, 'toggleStrong')\"\n i18n-matTooltip\n matTooltip=\"Gras\"\n >\n <mat-icon fontIcon=\"format_bold\" />\n </mat-button-toggle>\n }\n @if (menu.toggleEm) {\n <mat-button-toggle\n [disabled]=\"menu.toggleEm.disabled\"\n [checked]=\"menu.toggleEm.active\"\n (click)=\"run($event, 'toggleEm')\"\n i18n-matTooltip\n matTooltip=\"Italique\"\n >\n <mat-icon fontIcon=\"format_italic\" />\n </mat-button-toggle>\n }\n @if (menu.toggleCode) {\n <mat-button-toggle\n [disabled]=\"menu.toggleCode.disabled\"\n [checked]=\"menu.toggleCode.active\"\n (click)=\"run($event, 'toggleCode')\"\n i18n-matTooltip\n matTooltip=\"Code\"\n >\n <mat-icon fontIcon=\"code\" />\n </mat-button-toggle>\n }\n @if (menu.toggleLink) {\n <mat-button-toggle\n [disabled]=\"menu.toggleLink.disabled\"\n [checked]=\"menu.toggleLink.active\"\n (click)=\"run($event, 'toggleLink')\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer un lien...\"\n >\n <mat-icon fontIcon=\"insert_link\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n <button mat-button [matMenuTriggerFor]=\"blockMenu\">\n <span i18n>Type</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n <mat-menu #blockMenu=\"matMenu\">\n @if (menu.makeParagraph) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeParagraph.disabled\"\n (click)=\"run($event, 'makeParagraph')\"\n i18n\n >Paragraphe\n </button>\n }\n @if (menu.makeCodeBlock) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeCodeBlock.disabled\"\n (click)=\"run($event, 'makeCodeBlock')\"\n i18n\n >Code\n </button>\n }\n @if (menu.makeHead1) {\n <button mat-menu-item [disabled]=\"menu.makeHead1.disabled\" (click)=\"run($event, 'makeHead1')\" i18n\n >Titre 1\n </button>\n }\n @if (menu.makeHead2) {\n <button mat-menu-item [disabled]=\"menu.makeHead2.disabled\" (click)=\"run($event, 'makeHead2')\" i18n\n >Titre 2\n </button>\n }\n @if (menu.makeHead3) {\n <button mat-menu-item [disabled]=\"menu.makeHead3.disabled\" (click)=\"run($event, 'makeHead3')\" i18n\n >Titre 3\n </button>\n }\n @if (menu.makeHead4) {\n <button mat-menu-item [disabled]=\"menu.makeHead4.disabled\" (click)=\"run($event, 'makeHead4')\" i18n\n >Titre 4\n </button>\n }\n @if (menu.makeHead5) {\n <button mat-menu-item [disabled]=\"menu.makeHead5.disabled\" (click)=\"run($event, 'makeHead5')\" i18n\n >Titre 5\n </button>\n }\n @if (menu.makeHead6) {\n <button mat-menu-item [disabled]=\"menu.makeHead6.disabled\" (click)=\"run($event, 'makeHead6')\" i18n\n >Titre 6\n </button>\n }\n <mat-divider />\n @if (menu.blockClass) {\n <button mat-menu-item [disabled]=\"menu.blockClass.disabled\" (click)=\"run($event, 'blockClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.blockId) {\n <button i18n mat-menu-item [disabled]=\"menu.blockId.disabled\" (click)=\"run($event, 'blockId')\"\n >ID...\n </button>\n }\n </mat-menu>\n @if (menu.addColumnBefore) {\n <button mat-button [matMenuTriggerFor]=\"tableMenu\">\n <span i18n>Tableau</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n }\n <mat-menu #tableMenu=\"matMenu\">\n @if (menu.insertTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.insertTable.disabled\"\n (click)=\"run($event, 'insertTable')\"\n i18n\n >Ins\u00E9rer un tableau\n </button>\n }\n @if (menu.deleteTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteTable.disabled\"\n (click)=\"run($event, 'deleteTable')\"\n i18n\n >Supprimer le tableau\n </button>\n }\n @if (menu.mergeCells) {\n <button mat-menu-item [disabled]=\"menu.mergeCells.disabled\" (click)=\"run($event, 'mergeCells')\" i18n\n >Fusionner les cellules\n </button>\n }\n @if (menu.splitCell) {\n <button mat-menu-item [disabled]=\"menu.splitCell.disabled\" (click)=\"run($event, 'splitCell')\" i18n\n >Scinder les cellules\n </button>\n }\n @if (menu.cellBackgroundColor) {\n <button\n mat-menu-item\n [disabled]=\"menu.cellBackgroundColor.disabled\"\n (click)=\"run($event, 'cellBackgroundColor')\"\n i18n\n >Couleur de fond...\n </button>\n }\n @if (menu.tableClass) {\n <button mat-menu-item [disabled]=\"menu.tableClass.disabled\" (click)=\"run($event, 'tableClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.tableId) {\n <button i18n mat-menu-item [disabled]=\"menu.tableId.disabled\" (click)=\"run($event, 'tableId')\"\n >ID...\n </button>\n }\n <mat-divider />\n @if (menu.addColumnBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnBefore.disabled\"\n (click)=\"run($event, 'addColumnBefore')\"\n i18n\n >Ins\u00E9rer une colonne avant\n </button>\n }\n @if (menu.addColumnAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnAfter.disabled\"\n (click)=\"run($event, 'addColumnAfter')\"\n i18n\n >Ins\u00E9rer une colonne apr\u00E8s\n </button>\n }\n @if (menu.deleteColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteColumn.disabled\"\n (click)=\"run($event, 'deleteColumn')\"\n i18n\n >Supprimer la colonne\n </button>\n }\n <mat-divider />\n @if (menu.addRowBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowBefore.disabled\"\n (click)=\"run($event, 'addRowBefore')\"\n i18n\n >Ins\u00E9rer une ligne avant\n </button>\n }\n @if (menu.addRowAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowAfter.disabled\"\n (click)=\"run($event, 'addRowAfter')\"\n i18n\n >Ins\u00E9rer une ligne apr\u00E8s\n </button>\n }\n @if (menu.deleteRow) {\n <button mat-menu-item [disabled]=\"menu.deleteRow.disabled\" (click)=\"run($event, 'deleteRow')\" i18n\n >Supprimer la ligne\n </button>\n }\n <mat-divider />\n @if (menu.toggleHeaderColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderColumn.disabled\"\n (click)=\"run($event, 'toggleHeaderColumn')\"\n i18n\n >Ent\u00EAte de colonne\n </button>\n }\n @if (menu.toggleHeaderRow) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderRow.disabled\"\n (click)=\"run($event, 'toggleHeaderRow')\"\n i18n\n >Ent\u00EAte de ligne\n </button>\n }\n @if (menu.toggleHeaderCell) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderCell.disabled\"\n (click)=\"run($event, 'toggleHeaderCell')\"\n i18n\n >Ent\u00EAte de cellule\n </button>\n }\n </mat-menu>\n @if (imageUploader) {\n <button\n mat-icon-button\n naturalFileDrop\n [selectable]=\"true\"\n [broadcast]=\"false\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer une image\"\n (fileChange)=\"upload($event)\"\n >\n <mat-icon fontIcon=\"insert_photo\" />\n </button>\n }\n @if (menu.alignLeft) {\n <mat-button-toggle-group hideSingleSelectionIndicator>\n @if (menu.alignLeft) {\n <mat-button-toggle\n [disabled]=\"menu.alignLeft.disabled\"\n [checked]=\"menu.alignLeft.active\"\n (click)=\"run($event, 'alignLeft')\"\n i18n-matTooltip\n matTooltip=\"Aligner gauche\"\n >\n <mat-icon fontIcon=\"format_align_left\" />\n </mat-button-toggle>\n }\n @if (menu.alignCenter) {\n <mat-button-toggle\n [disabled]=\"menu.alignCenter.disabled\"\n [checked]=\"menu.alignCenter.active\"\n (click)=\"run($event, 'alignCenter')\"\n i18n-matTooltip\n matTooltip=\"Centrer\"\n >\n <mat-icon fontIcon=\"format_align_center\" />\n </mat-button-toggle>\n }\n @if (menu.alignRight) {\n <mat-button-toggle\n [disabled]=\"menu.alignRight.disabled\"\n [checked]=\"menu.alignRight.active\"\n (click)=\"run($event, 'alignRight')\"\n i18n-matTooltip\n matTooltip=\"Aligner droite\"\n >\n <mat-icon fontIcon=\"format_align_right\" />\n </mat-button-toggle>\n }\n @if (menu.alignJustify) {\n <mat-button-toggle\n [disabled]=\"menu.alignJustify.disabled\"\n [checked]=\"menu.alignJustify.active\"\n (click)=\"run($event, 'alignJustify')\"\n i18n-matTooltip\n matTooltip=\"Justifier\"\n >\n <mat-icon fontIcon=\"format_align_justify\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n }\n @if (menu.undo) {\n <button\n mat-icon-button\n [disabled]=\"menu.undo.disabled\"\n (click)=\"run($event, 'undo')\"\n i18n-matTooltip\n matTooltip=\"Annuler\"\n >\n <mat-icon fontIcon=\"undo\" />\n </button>\n }\n @if (menu.redo) {\n <button\n mat-icon-button\n [disabled]=\"menu.redo.disabled\"\n (click)=\"run($event, 'redo')\"\n i18n-matTooltip\n matTooltip=\"Refaire\"\n >\n <mat-icon fontIcon=\"redo\" />\n </button>\n }\n @if (menu.wrapBulletList && menu.wrapBulletList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBulletList.disabled\"\n (click)=\"run($event, 'wrapBulletList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 puce\"\n >\n <mat-icon fontIcon=\"format_list_bulleted\" />\n </button>\n }\n @if (menu.wrapOrderedList && menu.wrapOrderedList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapOrderedList.disabled\"\n (click)=\"run($event, 'wrapOrderedList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 num\u00E9ro\"\n >\n <mat-icon fontIcon=\"format_list_numbered\" />\n </button>\n }\n @if (menu.wrapBlockQuote && menu.wrapBlockQuote.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBlockQuote.disabled\"\n (click)=\"run($event, 'wrapBlockQuote')\"\n i18n-matTooltip\n matTooltip=\"Citation\"\n >\n <mat-icon fontIcon=\"format_quote\" />\n </button>\n }\n @if (menu.joinUp && menu.joinUp.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.joinUp.disabled\"\n (click)=\"run($event, 'joinUp')\"\n i18n-matTooltip\n matTooltip=\"Fusionner avec l'\u00E9l\u00E9ment du haut\"\n >\n <mat-icon fontIcon=\"move_up\" />\n </button>\n }\n @if (menu.lift && menu.lift.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.lift.disabled\"\n (click)=\"run($event, 'lift')\"\n i18n-matTooltip\n matTooltip=\"D\u00E9sindenter\"\n >\n <mat-icon fontIcon=\"format_indent_decrease\" />\n </button>\n }\n @if (menu.selectParentNode && menu.selectParentNode.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.selectParentNode.disabled\"\n (click)=\"run($event, 'selectParentNode')\"\n i18n-matTooltip\n matTooltip=\"S\u00E9lectionner l'\u00E9l\u00E9ment parent\"\n >\n <mat-icon fontIcon=\"select_all\" />\n </button>\n }\n </div>\n </div>\n}\n<div class=\"editor-container\" #editor></div>\n", styles: [".menu{border-bottom:1px solid;display:flex;flex-wrap:wrap;padding:10px 18px}.menu-container{position:sticky;top:-20px;z-index:999}::ng-deep .ProseMirror{position:relative}::ng-deep .ProseMirror{word-wrap:break-word;white-space:pre-wrap;-webkit-font-variant-ligatures:none;font-variant-ligatures:none}::ng-deep .ProseMirror pre{white-space:pre-wrap}::ng-deep .ProseMirror li{position:relative}::ng-deep .ProseMirror-hideselection *::selection{background:transparent}::ng-deep .ProseMirror-hideselection *::-moz-selection{background:transparent}::ng-deep .ProseMirror-hideselection{caret-color:transparent}::ng-deep .ProseMirror-selectednode{outline:2px solid #8cf}::ng-deep li.ProseMirror-selectednode{outline:none}::ng-deep li.ProseMirror-selectednode:after{content:\"\";position:absolute;inset:-2px -2px -2px -32px;border:2px solid #8cf;pointer-events:none}::ng-deep .ProseMirror-gapcursor{display:none;pointer-events:none;position:absolute}::ng-deep .ProseMirror-gapcursor:after{content:\"\";display:block;position:absolute;top:-2px;width:20px;border-top:1px solid black;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}::ng-deep .ProseMirror-focused .ProseMirror-gapcursor{display:block}::ng-deep .ProseMirror-example-setup-style hr{padding:2px 10px;border:none;margin:1em 0}::ng-deep .ProseMirror-example-setup-style hr:after{content:\"\";display:block;height:1px;background-color:silver;line-height:2px}::ng-deep .ProseMirror ul,::ng-deep .ProseMirror ol{padding-left:30px}::ng-deep .ProseMirror blockquote{padding-left:1em;border-left:3px solid #eee;margin-left:0;margin-right:0}::ng-deep .ProseMirror-example-setup-style img{cursor:default}::ng-deep .ProseMirror p:first-child,::ng-deep .ProseMirror h1:first-child,::ng-deep .ProseMirror h2:first-child,::ng-deep .ProseMirror h3:first-child,::ng-deep .ProseMirror h4:first-child,::ng-deep .ProseMirror h5:first-child,::ng-deep .ProseMirror h6:first-child{margin-top:10px}::ng-deep .ProseMirror{padding:4px 8px 4px 14px;line-height:1.2;outline:none}::ng-deep .ProseMirror p{margin-bottom:1em}::ng-deep .ProseMirror .tableWrapper{overflow-x:auto}::ng-deep .ProseMirror table{border-collapse:collapse;table-layout:fixed;width:100%;overflow:hidden}::ng-deep .ProseMirror td,::ng-deep .ProseMirror th{vertical-align:top;box-sizing:border-box;position:relative}::ng-deep .ProseMirror .column-resize-handle{position:absolute;right:-2px;top:0;bottom:0;width:4px;z-index:20;background-color:#adf;pointer-events:none}::ng-deep .ProseMirror.resize-cursor{cursor:col-resize}::ng-deep .ProseMirror .selectedCell:after{z-index:2;position:absolute;content:\"\";inset:0;background:#c8c8ff66;pointer-events:none}::ng-deep .ProseMirror table{margin:0}::ng-deep .ProseMirror th,::ng-deep .ProseMirror td{min-width:1em;border:1px solid #ddd;padding:3px 5px}::ng-deep .ProseMirror .tableWrapper{margin:1em 0}::ng-deep .ProseMirror th{font-weight:700;text-align:left}::ng-deep placeholder{display:block;width:50px;height:50px;background-size:500% 100%!important;animation:gradient 3s none infinite}@keyframes gradient{0%{background-position:100% 100%}to{background-position:0 0}}\n"] }]
|
|
212
|
+
], template: "@if (menu && !this.disabled) {\n <div class=\"menu-container\">\n <div class=\"menu\">\n @if (save.observed) {\n <button mat-icon-button (click)=\"save.emit()\" i18n-matTooltip matTooltip=\"Enregistrer\">\n <mat-icon fontIcon=\"save\" />\n </button>\n }\n <mat-button-toggle-group hideMultipleSelectionIndicator multiple>\n @if (menu.toggleStrong) {\n <mat-button-toggle\n [disabled]=\"menu.toggleStrong.disabled\"\n [checked]=\"menu.toggleStrong.active\"\n (click)=\"run($event, 'toggleStrong')\"\n i18n-matTooltip\n matTooltip=\"Gras\"\n >\n <mat-icon fontIcon=\"format_bold\" />\n </mat-button-toggle>\n }\n @if (menu.toggleEm) {\n <mat-button-toggle\n [disabled]=\"menu.toggleEm.disabled\"\n [checked]=\"menu.toggleEm.active\"\n (click)=\"run($event, 'toggleEm')\"\n i18n-matTooltip\n matTooltip=\"Italique\"\n >\n <mat-icon fontIcon=\"format_italic\" />\n </mat-button-toggle>\n }\n @if (menu.toggleCode) {\n <mat-button-toggle\n [disabled]=\"menu.toggleCode.disabled\"\n [checked]=\"menu.toggleCode.active\"\n (click)=\"run($event, 'toggleCode')\"\n i18n-matTooltip\n matTooltip=\"Code\"\n >\n <mat-icon fontIcon=\"code\" />\n </mat-button-toggle>\n }\n @if (menu.toggleLink) {\n <mat-button-toggle\n [disabled]=\"menu.toggleLink.disabled\"\n [checked]=\"menu.toggleLink.active\"\n (click)=\"run($event, 'toggleLink')\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer un lien...\"\n >\n <mat-icon fontIcon=\"insert_link\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n <button mat-button [matMenuTriggerFor]=\"blockMenu\">\n <span i18n>Type</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n <mat-menu #blockMenu=\"matMenu\">\n @if (menu.makeParagraph) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeParagraph.disabled\"\n (click)=\"run($event, 'makeParagraph')\"\n i18n\n >Paragraphe\n </button>\n }\n @if (menu.makeCodeBlock) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeCodeBlock.disabled\"\n (click)=\"run($event, 'makeCodeBlock')\"\n i18n\n >Code\n </button>\n }\n @if (menu.makeHead1) {\n <button mat-menu-item [disabled]=\"menu.makeHead1.disabled\" (click)=\"run($event, 'makeHead1')\" i18n\n >Titre 1\n </button>\n }\n @if (menu.makeHead2) {\n <button mat-menu-item [disabled]=\"menu.makeHead2.disabled\" (click)=\"run($event, 'makeHead2')\" i18n\n >Titre 2\n </button>\n }\n @if (menu.makeHead3) {\n <button mat-menu-item [disabled]=\"menu.makeHead3.disabled\" (click)=\"run($event, 'makeHead3')\" i18n\n >Titre 3\n </button>\n }\n @if (menu.makeHead4) {\n <button mat-menu-item [disabled]=\"menu.makeHead4.disabled\" (click)=\"run($event, 'makeHead4')\" i18n\n >Titre 4\n </button>\n }\n @if (menu.makeHead5) {\n <button mat-menu-item [disabled]=\"menu.makeHead5.disabled\" (click)=\"run($event, 'makeHead5')\" i18n\n >Titre 5\n </button>\n }\n @if (menu.makeHead6) {\n <button mat-menu-item [disabled]=\"menu.makeHead6.disabled\" (click)=\"run($event, 'makeHead6')\" i18n\n >Titre 6\n </button>\n }\n <mat-divider />\n @if (menu.blockClass) {\n <button mat-menu-item [disabled]=\"menu.blockClass.disabled\" (click)=\"run($event, 'blockClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.blockId) {\n <button i18n mat-menu-item [disabled]=\"menu.blockId.disabled\" (click)=\"run($event, 'blockId')\"\n >ID...\n </button>\n }\n </mat-menu>\n @if (menu.addColumnBefore) {\n <button mat-button [matMenuTriggerFor]=\"tableMenu\">\n <span i18n>Tableau</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n }\n <mat-menu #tableMenu=\"matMenu\">\n @if (menu.insertTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.insertTable.disabled\"\n (click)=\"run($event, 'insertTable')\"\n i18n\n >Ins\u00E9rer un tableau\n </button>\n }\n @if (menu.deleteTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteTable.disabled\"\n (click)=\"run($event, 'deleteTable')\"\n i18n\n >Supprimer le tableau\n </button>\n }\n @if (menu.mergeCells) {\n <button mat-menu-item [disabled]=\"menu.mergeCells.disabled\" (click)=\"run($event, 'mergeCells')\" i18n\n >Fusionner les cellules\n </button>\n }\n @if (menu.splitCell) {\n <button mat-menu-item [disabled]=\"menu.splitCell.disabled\" (click)=\"run($event, 'splitCell')\" i18n\n >Scinder les cellules\n </button>\n }\n @if (menu.cellBackgroundColor) {\n <button\n mat-menu-item\n [disabled]=\"menu.cellBackgroundColor.disabled\"\n (click)=\"run($event, 'cellBackgroundColor')\"\n i18n\n >Couleur de fond...\n </button>\n }\n @if (menu.tableClass) {\n <button mat-menu-item [disabled]=\"menu.tableClass.disabled\" (click)=\"run($event, 'tableClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.tableId) {\n <button i18n mat-menu-item [disabled]=\"menu.tableId.disabled\" (click)=\"run($event, 'tableId')\"\n >ID...\n </button>\n }\n <mat-divider />\n @if (menu.addColumnBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnBefore.disabled\"\n (click)=\"run($event, 'addColumnBefore')\"\n i18n\n >Ins\u00E9rer une colonne avant\n </button>\n }\n @if (menu.addColumnAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnAfter.disabled\"\n (click)=\"run($event, 'addColumnAfter')\"\n i18n\n >Ins\u00E9rer une colonne apr\u00E8s\n </button>\n }\n @if (menu.deleteColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteColumn.disabled\"\n (click)=\"run($event, 'deleteColumn')\"\n i18n\n >Supprimer la colonne\n </button>\n }\n <mat-divider />\n @if (menu.addRowBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowBefore.disabled\"\n (click)=\"run($event, 'addRowBefore')\"\n i18n\n >Ins\u00E9rer une ligne avant\n </button>\n }\n @if (menu.addRowAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowAfter.disabled\"\n (click)=\"run($event, 'addRowAfter')\"\n i18n\n >Ins\u00E9rer une ligne apr\u00E8s\n </button>\n }\n @if (menu.deleteRow) {\n <button mat-menu-item [disabled]=\"menu.deleteRow.disabled\" (click)=\"run($event, 'deleteRow')\" i18n\n >Supprimer la ligne\n </button>\n }\n <mat-divider />\n @if (menu.toggleHeaderColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderColumn.disabled\"\n (click)=\"run($event, 'toggleHeaderColumn')\"\n i18n\n >Ent\u00EAte de colonne\n </button>\n }\n @if (menu.toggleHeaderRow) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderRow.disabled\"\n (click)=\"run($event, 'toggleHeaderRow')\"\n i18n\n >Ent\u00EAte de ligne\n </button>\n }\n @if (menu.toggleHeaderCell) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderCell.disabled\"\n (click)=\"run($event, 'toggleHeaderCell')\"\n i18n\n >Ent\u00EAte de cellule\n </button>\n }\n </mat-menu>\n @if (imageUploader) {\n <button\n mat-icon-button\n naturalFileDrop\n [selectable]=\"true\"\n [broadcast]=\"false\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer une image\"\n (fileChange)=\"upload($event)\"\n >\n <mat-icon fontIcon=\"insert_photo\" />\n </button>\n }\n @if (menu.alignLeft) {\n <mat-button-toggle-group hideSingleSelectionIndicator>\n @if (menu.alignLeft) {\n <mat-button-toggle\n [disabled]=\"menu.alignLeft.disabled\"\n [checked]=\"menu.alignLeft.active\"\n (click)=\"run($event, 'alignLeft')\"\n i18n-matTooltip\n matTooltip=\"Aligner gauche\"\n >\n <mat-icon fontIcon=\"format_align_left\" />\n </mat-button-toggle>\n }\n @if (menu.alignCenter) {\n <mat-button-toggle\n [disabled]=\"menu.alignCenter.disabled\"\n [checked]=\"menu.alignCenter.active\"\n (click)=\"run($event, 'alignCenter')\"\n i18n-matTooltip\n matTooltip=\"Centrer\"\n >\n <mat-icon fontIcon=\"format_align_center\" />\n </mat-button-toggle>\n }\n @if (menu.alignRight) {\n <mat-button-toggle\n [disabled]=\"menu.alignRight.disabled\"\n [checked]=\"menu.alignRight.active\"\n (click)=\"run($event, 'alignRight')\"\n i18n-matTooltip\n matTooltip=\"Aligner droite\"\n >\n <mat-icon fontIcon=\"format_align_right\" />\n </mat-button-toggle>\n }\n @if (menu.alignJustify) {\n <mat-button-toggle\n [disabled]=\"menu.alignJustify.disabled\"\n [checked]=\"menu.alignJustify.active\"\n (click)=\"run($event, 'alignJustify')\"\n i18n-matTooltip\n matTooltip=\"Justifier\"\n >\n <mat-icon fontIcon=\"format_align_justify\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n }\n @if (menu.undo) {\n <button\n mat-icon-button\n [disabled]=\"menu.undo.disabled\"\n (click)=\"run($event, 'undo')\"\n i18n-matTooltip\n matTooltip=\"Annuler\"\n >\n <mat-icon fontIcon=\"undo\" />\n </button>\n }\n @if (menu.redo) {\n <button\n mat-icon-button\n [disabled]=\"menu.redo.disabled\"\n (click)=\"run($event, 'redo')\"\n i18n-matTooltip\n matTooltip=\"Refaire\"\n >\n <mat-icon fontIcon=\"redo\" />\n </button>\n }\n @if (menu.wrapBulletList && menu.wrapBulletList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBulletList.disabled\"\n (click)=\"run($event, 'wrapBulletList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 puce\"\n >\n <mat-icon fontIcon=\"format_list_bulleted\" />\n </button>\n }\n @if (menu.wrapOrderedList && menu.wrapOrderedList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapOrderedList.disabled\"\n (click)=\"run($event, 'wrapOrderedList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 num\u00E9ro\"\n >\n <mat-icon fontIcon=\"format_list_numbered\" />\n </button>\n }\n @if (menu.wrapBlockQuote && menu.wrapBlockQuote.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBlockQuote.disabled\"\n (click)=\"run($event, 'wrapBlockQuote')\"\n i18n-matTooltip\n matTooltip=\"Citation\"\n >\n <mat-icon fontIcon=\"format_quote\" />\n </button>\n }\n @if (menu.joinUp && menu.joinUp.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.joinUp.disabled\"\n (click)=\"run($event, 'joinUp')\"\n i18n-matTooltip\n matTooltip=\"Fusionner avec l'\u00E9l\u00E9ment du haut\"\n >\n <mat-icon fontIcon=\"move_up\" />\n </button>\n }\n @if (menu.lift && menu.lift.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.lift.disabled\"\n (click)=\"run($event, 'lift')\"\n i18n-matTooltip\n matTooltip=\"D\u00E9sindenter\"\n >\n <mat-icon fontIcon=\"format_indent_decrease\" />\n </button>\n }\n @if (menu.selectParentNode && menu.selectParentNode.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.selectParentNode.disabled\"\n (click)=\"run($event, 'selectParentNode')\"\n i18n-matTooltip\n matTooltip=\"S\u00E9lectionner l'\u00E9l\u00E9ment parent\"\n >\n <mat-icon fontIcon=\"select_all\" />\n </button>\n }\n </div>\n </div>\n}\n<div class=\"editor-container\" #editor></div>\n", styles: [".menu{display:flex;flex-wrap:wrap;border-bottom:1px solid;padding:10px 18px}.menu-container{position:sticky;top:-20px;z-index:999}::ng-deep .ProseMirror{position:relative}::ng-deep .ProseMirror{word-wrap:break-word;-webkit-font-variant-ligatures:none;font-variant-ligatures:none;white-space:pre-wrap}::ng-deep .ProseMirror pre{white-space:pre-wrap}::ng-deep .ProseMirror li{position:relative}::ng-deep .ProseMirror-hideselection *::selection{background:transparent}::ng-deep .ProseMirror-hideselection *::-moz-selection{background:transparent}::ng-deep .ProseMirror-hideselection{caret-color:transparent}::ng-deep .ProseMirror-selectednode{outline:2px solid #8cf}::ng-deep li.ProseMirror-selectednode{outline:none}::ng-deep li.ProseMirror-selectednode:after{position:absolute;inset:-2px -2px -2px -32px;border:2px solid #8cf;pointer-events:none;content:\"\"}::ng-deep .ProseMirror-gapcursor{display:none;position:absolute;pointer-events:none}::ng-deep .ProseMirror-gapcursor:after{display:block;position:absolute;top:-2px;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite;border-top:1px solid black;width:20px;content:\"\"}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}::ng-deep .ProseMirror-focused .ProseMirror-gapcursor{display:block}::ng-deep .ProseMirror-example-setup-style hr{margin:1em 0;border:none;padding:2px 10px}::ng-deep .ProseMirror-example-setup-style hr:after{display:block;background-color:silver;height:1px;content:\"\";line-height:2px}::ng-deep .ProseMirror ul,::ng-deep .ProseMirror ol{padding-left:30px}::ng-deep .ProseMirror blockquote{margin-right:0;margin-left:0;border-left:3px solid #eee;padding-left:1em}::ng-deep .ProseMirror-example-setup-style img{cursor:default}::ng-deep .ProseMirror p:first-child,::ng-deep .ProseMirror h1:first-child,::ng-deep .ProseMirror h2:first-child,::ng-deep .ProseMirror h3:first-child,::ng-deep .ProseMirror h4:first-child,::ng-deep .ProseMirror h5:first-child,::ng-deep .ProseMirror h6:first-child{margin-top:10px}::ng-deep .ProseMirror{outline:none;padding:4px 8px 4px 14px;line-height:1.2}::ng-deep .ProseMirror p{margin-bottom:1em}::ng-deep .ProseMirror .tableWrapper{overflow-x:auto}::ng-deep .ProseMirror table{border-collapse:collapse;width:100%;table-layout:fixed;overflow:hidden}::ng-deep .ProseMirror td,::ng-deep .ProseMirror th{position:relative;vertical-align:top;box-sizing:border-box}::ng-deep .ProseMirror .column-resize-handle{position:absolute;top:0;right:-2px;bottom:0;z-index:20;background-color:#adf;width:4px;pointer-events:none}::ng-deep .ProseMirror.resize-cursor{cursor:col-resize}::ng-deep .ProseMirror .selectedCell:after{position:absolute;inset:0;z-index:2;background:#c8c8ff66;pointer-events:none;content:\"\"}::ng-deep .ProseMirror table{margin:0}::ng-deep .ProseMirror th,::ng-deep .ProseMirror td{border:1px solid #ddd;padding:3px 5px;min-width:1em}::ng-deep .ProseMirror .tableWrapper{margin:1em 0}::ng-deep .ProseMirror th{font-weight:700;text-align:left}::ng-deep placeholder{display:block;animation:gradient 3s none infinite;background-size:500% 100%!important;width:50px;height:50px}@keyframes gradient{0%{background-position:100% 100%}to{background-position:0 0}}\n"] }]
|
|
213
213
|
}], ctorParameters: () => [{ type: i1.NgControl, decorators: [{
|
|
214
214
|
type: Optional
|
|
215
215
|
}, {
|
|
@@ -30,11 +30,11 @@ export class IdDialogComponent {
|
|
|
30
30
|
this.dialogRef.close(this.form.getRawValue());
|
|
31
31
|
}
|
|
32
32
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: IdDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
33
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: IdDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>Saisir le ID</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>ID</mat-label>\n <input matInput [formControl]=\"idControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (idControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ID valide</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{width:70vw;max-width:30em
|
|
33
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: IdDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>Saisir le ID</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>ID</mat-label>\n <input matInput [formControl]=\"idControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (idControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ID valide</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;width:70vw;max-width:30em}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] }); }
|
|
34
34
|
}
|
|
35
35
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: IdDialogComponent, decorators: [{
|
|
36
36
|
type: Component,
|
|
37
|
-
args: [{ standalone: true, imports: [MatDialogModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatButtonModule], template: "<h2 i18n mat-dialog-title>Saisir le ID</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>ID</mat-label>\n <input matInput [formControl]=\"idControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (idControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ID valide</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{width:70vw;max-width:30em
|
|
37
|
+
args: [{ standalone: true, imports: [MatDialogModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatButtonModule], template: "<h2 i18n mat-dialog-title>Saisir le ID</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>ID</mat-label>\n <input matInput [formControl]=\"idControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (idControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ID valide</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;width:70vw;max-width:30em}\n"] }]
|
|
38
38
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
39
39
|
type: Inject,
|
|
40
40
|
args: [MAT_DIALOG_DATA]
|
|
@@ -29,11 +29,11 @@ export class LinkDialogComponent {
|
|
|
29
29
|
this.dialogRef.close(this.form.getRawValue());
|
|
30
30
|
}
|
|
31
31
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: LinkDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
32
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: LinkDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>Ins\u00E9rer un lien</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>URL</mat-label>\n <input matInput [formControl]=\"hrefControl\" (keydown.enter)=\"maybeConfirm()\" />\n @if (hrefControl.hasError('required')) {\n <mat-error i18n>Ce champ est requis</mat-error>\n }\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Titre</mat-label>\n <input matInput [formControl]=\"titleControl\" (keydown.enter)=\"maybeConfirm()\" />\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{width:70vw;max-width:60em
|
|
32
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: LinkDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>Ins\u00E9rer un lien</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>URL</mat-label>\n <input matInput [formControl]=\"hrefControl\" (keydown.enter)=\"maybeConfirm()\" />\n @if (hrefControl.hasError('required')) {\n <mat-error i18n>Ce champ est requis</mat-error>\n }\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Titre</mat-label>\n <input matInput [formControl]=\"titleControl\" (keydown.enter)=\"maybeConfirm()\" />\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;width:70vw;max-width:60em}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] }); }
|
|
33
33
|
}
|
|
34
34
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: LinkDialogComponent, decorators: [{
|
|
35
35
|
type: Component,
|
|
36
|
-
args: [{ standalone: true, imports: [MatDialogModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatButtonModule], template: "<h2 i18n mat-dialog-title>Ins\u00E9rer un lien</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>URL</mat-label>\n <input matInput [formControl]=\"hrefControl\" (keydown.enter)=\"maybeConfirm()\" />\n @if (hrefControl.hasError('required')) {\n <mat-error i18n>Ce champ est requis</mat-error>\n }\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Titre</mat-label>\n <input matInput [formControl]=\"titleControl\" (keydown.enter)=\"maybeConfirm()\" />\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{width:70vw;max-width:60em
|
|
36
|
+
args: [{ standalone: true, imports: [MatDialogModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatButtonModule], template: "<h2 i18n mat-dialog-title>Ins\u00E9rer un lien</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>URL</mat-label>\n <input matInput [formControl]=\"hrefControl\" (keydown.enter)=\"maybeConfirm()\" />\n @if (hrefControl.hasError('required')) {\n <mat-error i18n>Ce champ est requis</mat-error>\n }\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Titre</mat-label>\n <input matInput [formControl]=\"titleControl\" (keydown.enter)=\"maybeConfirm()\" />\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;width:70vw;max-width:60em}\n"] }]
|
|
37
37
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
38
38
|
type: Inject,
|
|
39
39
|
args: [MAT_DIALOG_DATA]
|
|
@@ -753,7 +753,7 @@ class ColorDialogComponent {
|
|
|
753
753
|
this.maybeConfirm();
|
|
754
754
|
}
|
|
755
755
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ColorDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
756
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ColorDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>S\u00E9lectionner une couleur</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <div>\n @for (row of colors; track row) {\n <div>\n @for (color of row; track color) {\n <div class=\"color\" [style]=\"{backgroundColor: color}\" (click)=\"selectColor(color)\"> </div>\n }\n </div>\n }\n </div>\n\n <div>\n <button mat-button (click)=\"selectColor('')\">\n <mat-icon naturalIcon=\"format_color_reset\" />\n <span i18n>Transparent</span></button\n >\n </div>\n\n <mat-form-field>\n <mat-label i18n>Couleur</mat-label>\n <input matInput [formControl]=\"colorControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n <div\n class=\"sample\"\n matTextSuffix\n [style]=\"{backgroundColor: colorControl.valid ? colorControl.value : ''}\"\n ></div>\n @if (colorControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre le format hexadecimal. Par exemple: #ff4000 </mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{
|
|
756
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ColorDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>S\u00E9lectionner une couleur</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <div>\n @for (row of colors; track row) {\n <div>\n @for (color of row; track color) {\n <div class=\"color\" [style]=\"{backgroundColor: color}\" (click)=\"selectColor(color)\"> </div>\n }\n </div>\n }\n </div>\n\n <div>\n <button mat-button (click)=\"selectColor('')\">\n <mat-icon naturalIcon=\"format_color_reset\" />\n <span i18n>Transparent</span></button\n >\n </div>\n\n <mat-form-field>\n <mat-label i18n>Couleur</mat-label>\n <input matInput [formControl]=\"colorControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n <div\n class=\"sample\"\n matTextSuffix\n [style]=\"{backgroundColor: colorControl.valid ? colorControl.value : ''}\"\n ></div>\n @if (colorControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre le format hexadecimal. Par exemple: #ff4000 </mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;row-gap:25px;justify-content:center;width:70vw;max-width:30em}.color{display:inline-block;cursor:pointer;margin:3px;width:25px;height:25px}.color:hover{margin:0;padding:3px}.sample{width:27px;height:27px}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NaturalIconDirective, selector: "mat-icon[naturalIcon]", inputs: ["naturalIcon", "size"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }] }); }
|
|
757
757
|
}
|
|
758
758
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ColorDialogComponent, decorators: [{
|
|
759
759
|
type: Component,
|
|
@@ -766,7 +766,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImpor
|
|
|
766
766
|
NaturalIconDirective,
|
|
767
767
|
MatFormFieldModule,
|
|
768
768
|
MatInputModule,
|
|
769
|
-
], template: "<h2 i18n mat-dialog-title>S\u00E9lectionner une couleur</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <div>\n @for (row of colors; track row) {\n <div>\n @for (color of row; track color) {\n <div class=\"color\" [style]=\"{backgroundColor: color}\" (click)=\"selectColor(color)\"> </div>\n }\n </div>\n }\n </div>\n\n <div>\n <button mat-button (click)=\"selectColor('')\">\n <mat-icon naturalIcon=\"format_color_reset\" />\n <span i18n>Transparent</span></button\n >\n </div>\n\n <mat-form-field>\n <mat-label i18n>Couleur</mat-label>\n <input matInput [formControl]=\"colorControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n <div\n class=\"sample\"\n matTextSuffix\n [style]=\"{backgroundColor: colorControl.valid ? colorControl.value : ''}\"\n ></div>\n @if (colorControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre le format hexadecimal. Par exemple: #ff4000 </mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{
|
|
769
|
+
], template: "<h2 i18n mat-dialog-title>S\u00E9lectionner une couleur</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <div>\n @for (row of colors; track row) {\n <div>\n @for (color of row; track color) {\n <div class=\"color\" [style]=\"{backgroundColor: color}\" (click)=\"selectColor(color)\"> </div>\n }\n </div>\n }\n </div>\n\n <div>\n <button mat-button (click)=\"selectColor('')\">\n <mat-icon naturalIcon=\"format_color_reset\" />\n <span i18n>Transparent</span></button\n >\n </div>\n\n <mat-form-field>\n <mat-label i18n>Couleur</mat-label>\n <input matInput [formControl]=\"colorControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n <div\n class=\"sample\"\n matTextSuffix\n [style]=\"{backgroundColor: colorControl.valid ? colorControl.value : ''}\"\n ></div>\n @if (colorControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre le format hexadecimal. Par exemple: #ff4000 </mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;row-gap:25px;justify-content:center;width:70vw;max-width:30em}.color{display:inline-block;cursor:pointer;margin:3px;width:25px;height:25px}.color:hover{margin:0;padding:3px}.sample{width:27px;height:27px}\n"] }]
|
|
770
770
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
771
771
|
type: Inject,
|
|
772
772
|
args: [MAT_DIALOG_DATA]
|
|
@@ -842,11 +842,11 @@ class LinkDialogComponent {
|
|
|
842
842
|
this.dialogRef.close(this.form.getRawValue());
|
|
843
843
|
}
|
|
844
844
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: LinkDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
845
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: LinkDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>Ins\u00E9rer un lien</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>URL</mat-label>\n <input matInput [formControl]=\"hrefControl\" (keydown.enter)=\"maybeConfirm()\" />\n @if (hrefControl.hasError('required')) {\n <mat-error i18n>Ce champ est requis</mat-error>\n }\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Titre</mat-label>\n <input matInput [formControl]=\"titleControl\" (keydown.enter)=\"maybeConfirm()\" />\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{width:70vw;max-width:60em
|
|
845
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: LinkDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>Ins\u00E9rer un lien</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>URL</mat-label>\n <input matInput [formControl]=\"hrefControl\" (keydown.enter)=\"maybeConfirm()\" />\n @if (hrefControl.hasError('required')) {\n <mat-error i18n>Ce champ est requis</mat-error>\n }\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Titre</mat-label>\n <input matInput [formControl]=\"titleControl\" (keydown.enter)=\"maybeConfirm()\" />\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;width:70vw;max-width:60em}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] }); }
|
|
846
846
|
}
|
|
847
847
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: LinkDialogComponent, decorators: [{
|
|
848
848
|
type: Component,
|
|
849
|
-
args: [{ standalone: true, imports: [MatDialogModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatButtonModule], template: "<h2 i18n mat-dialog-title>Ins\u00E9rer un lien</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>URL</mat-label>\n <input matInput [formControl]=\"hrefControl\" (keydown.enter)=\"maybeConfirm()\" />\n @if (hrefControl.hasError('required')) {\n <mat-error i18n>Ce champ est requis</mat-error>\n }\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Titre</mat-label>\n <input matInput [formControl]=\"titleControl\" (keydown.enter)=\"maybeConfirm()\" />\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{width:70vw;max-width:60em
|
|
849
|
+
args: [{ standalone: true, imports: [MatDialogModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatButtonModule], template: "<h2 i18n mat-dialog-title>Ins\u00E9rer un lien</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>URL</mat-label>\n <input matInput [formControl]=\"hrefControl\" (keydown.enter)=\"maybeConfirm()\" />\n @if (hrefControl.hasError('required')) {\n <mat-error i18n>Ce champ est requis</mat-error>\n }\n </mat-form-field>\n <mat-form-field>\n <mat-label i18n>Titre</mat-label>\n <input matInput [formControl]=\"titleControl\" (keydown.enter)=\"maybeConfirm()\" />\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;width:70vw;max-width:60em}\n"] }]
|
|
850
850
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
851
851
|
type: Inject,
|
|
852
852
|
args: [MAT_DIALOG_DATA]
|
|
@@ -987,11 +987,11 @@ class ClassDialogComponent {
|
|
|
987
987
|
this.dialogRef.close(this.form.getRawValue());
|
|
988
988
|
}
|
|
989
989
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ClassDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
990
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ClassDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>Saisir les classes CSS</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>Classes CSS</mat-label>\n <input matInput [formControl]=\"classControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (classControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ou plusieurs nom de classe CSS</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{width:70vw;max-width:30em
|
|
990
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: ClassDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>Saisir les classes CSS</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>Classes CSS</mat-label>\n <input matInput [formControl]=\"classControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (classControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ou plusieurs nom de classe CSS</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;width:70vw;max-width:30em}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] }); }
|
|
991
991
|
}
|
|
992
992
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: ClassDialogComponent, decorators: [{
|
|
993
993
|
type: Component,
|
|
994
|
-
args: [{ standalone: true, imports: [MatDialogModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatButtonModule], template: "<h2 i18n mat-dialog-title>Saisir les classes CSS</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>Classes CSS</mat-label>\n <input matInput [formControl]=\"classControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (classControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ou plusieurs nom de classe CSS</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{width:70vw;max-width:30em
|
|
994
|
+
args: [{ standalone: true, imports: [MatDialogModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatButtonModule], template: "<h2 i18n mat-dialog-title>Saisir les classes CSS</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>Classes CSS</mat-label>\n <input matInput [formControl]=\"classControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (classControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ou plusieurs nom de classe CSS</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;width:70vw;max-width:30em}\n"] }]
|
|
995
995
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
996
996
|
type: Inject,
|
|
997
997
|
args: [MAT_DIALOG_DATA]
|
|
@@ -1098,11 +1098,11 @@ class IdDialogComponent {
|
|
|
1098
1098
|
this.dialogRef.close(this.form.getRawValue());
|
|
1099
1099
|
}
|
|
1100
1100
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: IdDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1101
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: IdDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>Saisir le ID</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>ID</mat-label>\n <input matInput [formControl]=\"idControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (idControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ID valide</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{width:70vw;max-width:30em
|
|
1101
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: IdDialogComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>Saisir le ID</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>ID</mat-label>\n <input matInput [formControl]=\"idControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (idControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ID valide</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;width:70vw;max-width:30em}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] }); }
|
|
1102
1102
|
}
|
|
1103
1103
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: IdDialogComponent, decorators: [{
|
|
1104
1104
|
type: Component,
|
|
1105
|
-
args: [{ standalone: true, imports: [MatDialogModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatButtonModule], template: "<h2 i18n mat-dialog-title>Saisir le ID</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>ID</mat-label>\n <input matInput [formControl]=\"idControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (idControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ID valide</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{width:70vw;max-width:30em
|
|
1105
|
+
args: [{ standalone: true, imports: [MatDialogModule, FormsModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatButtonModule], template: "<h2 i18n mat-dialog-title>Saisir le ID</h2>\n\n<mat-dialog-content [formGroup]=\"form\">\n <mat-form-field>\n <mat-label i18n>ID</mat-label>\n <input matInput [formControl]=\"idControl\" (keydown.enter)=\"maybeConfirm()\" cdkFocusInitial />\n @if (idControl.hasError('pattern')) {\n <mat-error i18n>Doit \u00EAtre un ID valide</mat-error>\n }\n </mat-form-field>\n</mat-dialog-content>\n\n<mat-dialog-actions align=\"end\">\n <button mat-button mat-dialog-close i18n>Annuler</button>\n <button mat-stroked-button (click)=\"maybeConfirm()\" [disabled]=\"!form.valid\"><span i18n>Valider</span></button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{display:grid;width:70vw;max-width:30em}\n"] }]
|
|
1106
1106
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
1107
1107
|
type: Inject,
|
|
1108
1108
|
args: [MAT_DIALOG_DATA]
|
|
@@ -1670,7 +1670,7 @@ class NaturalEditorComponent {
|
|
|
1670
1670
|
this.view.focus();
|
|
1671
1671
|
}
|
|
1672
1672
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: NaturalEditorComponent, deps: [{ token: i2.NgControl, optional: true, self: true }, { token: DOCUMENT }, { token: i1.MatDialog }, { token: ImagePlugin }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1673
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: NaturalEditorComponent, isStandalone: true, selector: "natural-editor", inputs: { imageUploader: "imageUploader" }, outputs: { contentChange: "contentChange", save: "save" }, providers: [ImagePlugin], viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "@if (menu && !this.disabled) {\n <div class=\"menu-container\">\n <div class=\"menu\">\n @if (save.observed) {\n <button mat-icon-button (click)=\"save.emit()\" i18n-matTooltip matTooltip=\"Enregistrer\">\n <mat-icon fontIcon=\"save\" />\n </button>\n }\n <mat-button-toggle-group hideMultipleSelectionIndicator multiple>\n @if (menu.toggleStrong) {\n <mat-button-toggle\n [disabled]=\"menu.toggleStrong.disabled\"\n [checked]=\"menu.toggleStrong.active\"\n (click)=\"run($event, 'toggleStrong')\"\n i18n-matTooltip\n matTooltip=\"Gras\"\n >\n <mat-icon fontIcon=\"format_bold\" />\n </mat-button-toggle>\n }\n @if (menu.toggleEm) {\n <mat-button-toggle\n [disabled]=\"menu.toggleEm.disabled\"\n [checked]=\"menu.toggleEm.active\"\n (click)=\"run($event, 'toggleEm')\"\n i18n-matTooltip\n matTooltip=\"Italique\"\n >\n <mat-icon fontIcon=\"format_italic\" />\n </mat-button-toggle>\n }\n @if (menu.toggleCode) {\n <mat-button-toggle\n [disabled]=\"menu.toggleCode.disabled\"\n [checked]=\"menu.toggleCode.active\"\n (click)=\"run($event, 'toggleCode')\"\n i18n-matTooltip\n matTooltip=\"Code\"\n >\n <mat-icon fontIcon=\"code\" />\n </mat-button-toggle>\n }\n @if (menu.toggleLink) {\n <mat-button-toggle\n [disabled]=\"menu.toggleLink.disabled\"\n [checked]=\"menu.toggleLink.active\"\n (click)=\"run($event, 'toggleLink')\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer un lien...\"\n >\n <mat-icon fontIcon=\"insert_link\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n <button mat-button [matMenuTriggerFor]=\"blockMenu\">\n <span i18n>Type</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n <mat-menu #blockMenu=\"matMenu\">\n @if (menu.makeParagraph) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeParagraph.disabled\"\n (click)=\"run($event, 'makeParagraph')\"\n i18n\n >Paragraphe\n </button>\n }\n @if (menu.makeCodeBlock) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeCodeBlock.disabled\"\n (click)=\"run($event, 'makeCodeBlock')\"\n i18n\n >Code\n </button>\n }\n @if (menu.makeHead1) {\n <button mat-menu-item [disabled]=\"menu.makeHead1.disabled\" (click)=\"run($event, 'makeHead1')\" i18n\n >Titre 1\n </button>\n }\n @if (menu.makeHead2) {\n <button mat-menu-item [disabled]=\"menu.makeHead2.disabled\" (click)=\"run($event, 'makeHead2')\" i18n\n >Titre 2\n </button>\n }\n @if (menu.makeHead3) {\n <button mat-menu-item [disabled]=\"menu.makeHead3.disabled\" (click)=\"run($event, 'makeHead3')\" i18n\n >Titre 3\n </button>\n }\n @if (menu.makeHead4) {\n <button mat-menu-item [disabled]=\"menu.makeHead4.disabled\" (click)=\"run($event, 'makeHead4')\" i18n\n >Titre 4\n </button>\n }\n @if (menu.makeHead5) {\n <button mat-menu-item [disabled]=\"menu.makeHead5.disabled\" (click)=\"run($event, 'makeHead5')\" i18n\n >Titre 5\n </button>\n }\n @if (menu.makeHead6) {\n <button mat-menu-item [disabled]=\"menu.makeHead6.disabled\" (click)=\"run($event, 'makeHead6')\" i18n\n >Titre 6\n </button>\n }\n <mat-divider />\n @if (menu.blockClass) {\n <button mat-menu-item [disabled]=\"menu.blockClass.disabled\" (click)=\"run($event, 'blockClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.blockId) {\n <button i18n mat-menu-item [disabled]=\"menu.blockId.disabled\" (click)=\"run($event, 'blockId')\"\n >ID...\n </button>\n }\n </mat-menu>\n @if (menu.addColumnBefore) {\n <button mat-button [matMenuTriggerFor]=\"tableMenu\">\n <span i18n>Tableau</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n }\n <mat-menu #tableMenu=\"matMenu\">\n @if (menu.insertTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.insertTable.disabled\"\n (click)=\"run($event, 'insertTable')\"\n i18n\n >Ins\u00E9rer un tableau\n </button>\n }\n @if (menu.deleteTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteTable.disabled\"\n (click)=\"run($event, 'deleteTable')\"\n i18n\n >Supprimer le tableau\n </button>\n }\n @if (menu.mergeCells) {\n <button mat-menu-item [disabled]=\"menu.mergeCells.disabled\" (click)=\"run($event, 'mergeCells')\" i18n\n >Fusionner les cellules\n </button>\n }\n @if (menu.splitCell) {\n <button mat-menu-item [disabled]=\"menu.splitCell.disabled\" (click)=\"run($event, 'splitCell')\" i18n\n >Scinder les cellules\n </button>\n }\n @if (menu.cellBackgroundColor) {\n <button\n mat-menu-item\n [disabled]=\"menu.cellBackgroundColor.disabled\"\n (click)=\"run($event, 'cellBackgroundColor')\"\n i18n\n >Couleur de fond...\n </button>\n }\n @if (menu.tableClass) {\n <button mat-menu-item [disabled]=\"menu.tableClass.disabled\" (click)=\"run($event, 'tableClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.tableId) {\n <button i18n mat-menu-item [disabled]=\"menu.tableId.disabled\" (click)=\"run($event, 'tableId')\"\n >ID...\n </button>\n }\n <mat-divider />\n @if (menu.addColumnBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnBefore.disabled\"\n (click)=\"run($event, 'addColumnBefore')\"\n i18n\n >Ins\u00E9rer une colonne avant\n </button>\n }\n @if (menu.addColumnAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnAfter.disabled\"\n (click)=\"run($event, 'addColumnAfter')\"\n i18n\n >Ins\u00E9rer une colonne apr\u00E8s\n </button>\n }\n @if (menu.deleteColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteColumn.disabled\"\n (click)=\"run($event, 'deleteColumn')\"\n i18n\n >Supprimer la colonne\n </button>\n }\n <mat-divider />\n @if (menu.addRowBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowBefore.disabled\"\n (click)=\"run($event, 'addRowBefore')\"\n i18n\n >Ins\u00E9rer une ligne avant\n </button>\n }\n @if (menu.addRowAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowAfter.disabled\"\n (click)=\"run($event, 'addRowAfter')\"\n i18n\n >Ins\u00E9rer une ligne apr\u00E8s\n </button>\n }\n @if (menu.deleteRow) {\n <button mat-menu-item [disabled]=\"menu.deleteRow.disabled\" (click)=\"run($event, 'deleteRow')\" i18n\n >Supprimer la ligne\n </button>\n }\n <mat-divider />\n @if (menu.toggleHeaderColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderColumn.disabled\"\n (click)=\"run($event, 'toggleHeaderColumn')\"\n i18n\n >Ent\u00EAte de colonne\n </button>\n }\n @if (menu.toggleHeaderRow) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderRow.disabled\"\n (click)=\"run($event, 'toggleHeaderRow')\"\n i18n\n >Ent\u00EAte de ligne\n </button>\n }\n @if (menu.toggleHeaderCell) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderCell.disabled\"\n (click)=\"run($event, 'toggleHeaderCell')\"\n i18n\n >Ent\u00EAte de cellule\n </button>\n }\n </mat-menu>\n @if (imageUploader) {\n <button\n mat-icon-button\n naturalFileDrop\n [selectable]=\"true\"\n [broadcast]=\"false\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer une image\"\n (fileChange)=\"upload($event)\"\n >\n <mat-icon fontIcon=\"insert_photo\" />\n </button>\n }\n @if (menu.alignLeft) {\n <mat-button-toggle-group hideSingleSelectionIndicator>\n @if (menu.alignLeft) {\n <mat-button-toggle\n [disabled]=\"menu.alignLeft.disabled\"\n [checked]=\"menu.alignLeft.active\"\n (click)=\"run($event, 'alignLeft')\"\n i18n-matTooltip\n matTooltip=\"Aligner gauche\"\n >\n <mat-icon fontIcon=\"format_align_left\" />\n </mat-button-toggle>\n }\n @if (menu.alignCenter) {\n <mat-button-toggle\n [disabled]=\"menu.alignCenter.disabled\"\n [checked]=\"menu.alignCenter.active\"\n (click)=\"run($event, 'alignCenter')\"\n i18n-matTooltip\n matTooltip=\"Centrer\"\n >\n <mat-icon fontIcon=\"format_align_center\" />\n </mat-button-toggle>\n }\n @if (menu.alignRight) {\n <mat-button-toggle\n [disabled]=\"menu.alignRight.disabled\"\n [checked]=\"menu.alignRight.active\"\n (click)=\"run($event, 'alignRight')\"\n i18n-matTooltip\n matTooltip=\"Aligner droite\"\n >\n <mat-icon fontIcon=\"format_align_right\" />\n </mat-button-toggle>\n }\n @if (menu.alignJustify) {\n <mat-button-toggle\n [disabled]=\"menu.alignJustify.disabled\"\n [checked]=\"menu.alignJustify.active\"\n (click)=\"run($event, 'alignJustify')\"\n i18n-matTooltip\n matTooltip=\"Justifier\"\n >\n <mat-icon fontIcon=\"format_align_justify\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n }\n @if (menu.undo) {\n <button\n mat-icon-button\n [disabled]=\"menu.undo.disabled\"\n (click)=\"run($event, 'undo')\"\n i18n-matTooltip\n matTooltip=\"Annuler\"\n >\n <mat-icon fontIcon=\"undo\" />\n </button>\n }\n @if (menu.redo) {\n <button\n mat-icon-button\n [disabled]=\"menu.redo.disabled\"\n (click)=\"run($event, 'redo')\"\n i18n-matTooltip\n matTooltip=\"Refaire\"\n >\n <mat-icon fontIcon=\"redo\" />\n </button>\n }\n @if (menu.wrapBulletList && menu.wrapBulletList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBulletList.disabled\"\n (click)=\"run($event, 'wrapBulletList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 puce\"\n >\n <mat-icon fontIcon=\"format_list_bulleted\" />\n </button>\n }\n @if (menu.wrapOrderedList && menu.wrapOrderedList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapOrderedList.disabled\"\n (click)=\"run($event, 'wrapOrderedList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 num\u00E9ro\"\n >\n <mat-icon fontIcon=\"format_list_numbered\" />\n </button>\n }\n @if (menu.wrapBlockQuote && menu.wrapBlockQuote.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBlockQuote.disabled\"\n (click)=\"run($event, 'wrapBlockQuote')\"\n i18n-matTooltip\n matTooltip=\"Citation\"\n >\n <mat-icon fontIcon=\"format_quote\" />\n </button>\n }\n @if (menu.joinUp && menu.joinUp.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.joinUp.disabled\"\n (click)=\"run($event, 'joinUp')\"\n i18n-matTooltip\n matTooltip=\"Fusionner avec l'\u00E9l\u00E9ment du haut\"\n >\n <mat-icon fontIcon=\"move_up\" />\n </button>\n }\n @if (menu.lift && menu.lift.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.lift.disabled\"\n (click)=\"run($event, 'lift')\"\n i18n-matTooltip\n matTooltip=\"D\u00E9sindenter\"\n >\n <mat-icon fontIcon=\"format_indent_decrease\" />\n </button>\n }\n @if (menu.selectParentNode && menu.selectParentNode.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.selectParentNode.disabled\"\n (click)=\"run($event, 'selectParentNode')\"\n i18n-matTooltip\n matTooltip=\"S\u00E9lectionner l'\u00E9l\u00E9ment parent\"\n >\n <mat-icon fontIcon=\"select_all\" />\n </button>\n }\n </div>\n </div>\n}\n<div class=\"editor-container\" #editor></div>\n", styles: [".menu{border-bottom:1px solid;display:flex;flex-wrap:wrap;padding:10px 18px}.menu-container{position:sticky;top:-20px;z-index:999}::ng-deep .ProseMirror{position:relative}::ng-deep .ProseMirror{word-wrap:break-word;white-space:pre-wrap;-webkit-font-variant-ligatures:none;font-variant-ligatures:none}::ng-deep .ProseMirror pre{white-space:pre-wrap}::ng-deep .ProseMirror li{position:relative}::ng-deep .ProseMirror-hideselection *::selection{background:transparent}::ng-deep .ProseMirror-hideselection *::-moz-selection{background:transparent}::ng-deep .ProseMirror-hideselection{caret-color:transparent}::ng-deep .ProseMirror-selectednode{outline:2px solid #8cf}::ng-deep li.ProseMirror-selectednode{outline:none}::ng-deep li.ProseMirror-selectednode:after{content:\"\";position:absolute;inset:-2px -2px -2px -32px;border:2px solid #8cf;pointer-events:none}::ng-deep .ProseMirror-gapcursor{display:none;pointer-events:none;position:absolute}::ng-deep .ProseMirror-gapcursor:after{content:\"\";display:block;position:absolute;top:-2px;width:20px;border-top:1px solid black;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}::ng-deep .ProseMirror-focused .ProseMirror-gapcursor{display:block}::ng-deep .ProseMirror-example-setup-style hr{padding:2px 10px;border:none;margin:1em 0}::ng-deep .ProseMirror-example-setup-style hr:after{content:\"\";display:block;height:1px;background-color:silver;line-height:2px}::ng-deep .ProseMirror ul,::ng-deep .ProseMirror ol{padding-left:30px}::ng-deep .ProseMirror blockquote{padding-left:1em;border-left:3px solid #eee;margin-left:0;margin-right:0}::ng-deep .ProseMirror-example-setup-style img{cursor:default}::ng-deep .ProseMirror p:first-child,::ng-deep .ProseMirror h1:first-child,::ng-deep .ProseMirror h2:first-child,::ng-deep .ProseMirror h3:first-child,::ng-deep .ProseMirror h4:first-child,::ng-deep .ProseMirror h5:first-child,::ng-deep .ProseMirror h6:first-child{margin-top:10px}::ng-deep .ProseMirror{padding:4px 8px 4px 14px;line-height:1.2;outline:none}::ng-deep .ProseMirror p{margin-bottom:1em}::ng-deep .ProseMirror .tableWrapper{overflow-x:auto}::ng-deep .ProseMirror table{border-collapse:collapse;table-layout:fixed;width:100%;overflow:hidden}::ng-deep .ProseMirror td,::ng-deep .ProseMirror th{vertical-align:top;box-sizing:border-box;position:relative}::ng-deep .ProseMirror .column-resize-handle{position:absolute;right:-2px;top:0;bottom:0;width:4px;z-index:20;background-color:#adf;pointer-events:none}::ng-deep .ProseMirror.resize-cursor{cursor:col-resize}::ng-deep .ProseMirror .selectedCell:after{z-index:2;position:absolute;content:\"\";inset:0;background:#c8c8ff66;pointer-events:none}::ng-deep .ProseMirror table{margin:0}::ng-deep .ProseMirror th,::ng-deep .ProseMirror td{min-width:1em;border:1px solid #ddd;padding:3px 5px}::ng-deep .ProseMirror .tableWrapper{margin:1em 0}::ng-deep .ProseMirror th{font-weight:700;text-align:left}::ng-deep placeholder{display:block;width:50px;height:50px;background-size:500% 100%!important;animation:gradient 3s none infinite}@keyframes gradient{0%{background-position:100% 100%}to{background-position:0 0}}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i7.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i7.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i8.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i8.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i8.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i9.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: NaturalFileDropDirective, selector: ":not([naturalFileSelect])[naturalFileDrop]", outputs: ["fileOver"] }] }); }
|
|
1673
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: NaturalEditorComponent, isStandalone: true, selector: "natural-editor", inputs: { imageUploader: "imageUploader" }, outputs: { contentChange: "contentChange", save: "save" }, providers: [ImagePlugin], viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "@if (menu && !this.disabled) {\n <div class=\"menu-container\">\n <div class=\"menu\">\n @if (save.observed) {\n <button mat-icon-button (click)=\"save.emit()\" i18n-matTooltip matTooltip=\"Enregistrer\">\n <mat-icon fontIcon=\"save\" />\n </button>\n }\n <mat-button-toggle-group hideMultipleSelectionIndicator multiple>\n @if (menu.toggleStrong) {\n <mat-button-toggle\n [disabled]=\"menu.toggleStrong.disabled\"\n [checked]=\"menu.toggleStrong.active\"\n (click)=\"run($event, 'toggleStrong')\"\n i18n-matTooltip\n matTooltip=\"Gras\"\n >\n <mat-icon fontIcon=\"format_bold\" />\n </mat-button-toggle>\n }\n @if (menu.toggleEm) {\n <mat-button-toggle\n [disabled]=\"menu.toggleEm.disabled\"\n [checked]=\"menu.toggleEm.active\"\n (click)=\"run($event, 'toggleEm')\"\n i18n-matTooltip\n matTooltip=\"Italique\"\n >\n <mat-icon fontIcon=\"format_italic\" />\n </mat-button-toggle>\n }\n @if (menu.toggleCode) {\n <mat-button-toggle\n [disabled]=\"menu.toggleCode.disabled\"\n [checked]=\"menu.toggleCode.active\"\n (click)=\"run($event, 'toggleCode')\"\n i18n-matTooltip\n matTooltip=\"Code\"\n >\n <mat-icon fontIcon=\"code\" />\n </mat-button-toggle>\n }\n @if (menu.toggleLink) {\n <mat-button-toggle\n [disabled]=\"menu.toggleLink.disabled\"\n [checked]=\"menu.toggleLink.active\"\n (click)=\"run($event, 'toggleLink')\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer un lien...\"\n >\n <mat-icon fontIcon=\"insert_link\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n <button mat-button [matMenuTriggerFor]=\"blockMenu\">\n <span i18n>Type</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n <mat-menu #blockMenu=\"matMenu\">\n @if (menu.makeParagraph) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeParagraph.disabled\"\n (click)=\"run($event, 'makeParagraph')\"\n i18n\n >Paragraphe\n </button>\n }\n @if (menu.makeCodeBlock) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeCodeBlock.disabled\"\n (click)=\"run($event, 'makeCodeBlock')\"\n i18n\n >Code\n </button>\n }\n @if (menu.makeHead1) {\n <button mat-menu-item [disabled]=\"menu.makeHead1.disabled\" (click)=\"run($event, 'makeHead1')\" i18n\n >Titre 1\n </button>\n }\n @if (menu.makeHead2) {\n <button mat-menu-item [disabled]=\"menu.makeHead2.disabled\" (click)=\"run($event, 'makeHead2')\" i18n\n >Titre 2\n </button>\n }\n @if (menu.makeHead3) {\n <button mat-menu-item [disabled]=\"menu.makeHead3.disabled\" (click)=\"run($event, 'makeHead3')\" i18n\n >Titre 3\n </button>\n }\n @if (menu.makeHead4) {\n <button mat-menu-item [disabled]=\"menu.makeHead4.disabled\" (click)=\"run($event, 'makeHead4')\" i18n\n >Titre 4\n </button>\n }\n @if (menu.makeHead5) {\n <button mat-menu-item [disabled]=\"menu.makeHead5.disabled\" (click)=\"run($event, 'makeHead5')\" i18n\n >Titre 5\n </button>\n }\n @if (menu.makeHead6) {\n <button mat-menu-item [disabled]=\"menu.makeHead6.disabled\" (click)=\"run($event, 'makeHead6')\" i18n\n >Titre 6\n </button>\n }\n <mat-divider />\n @if (menu.blockClass) {\n <button mat-menu-item [disabled]=\"menu.blockClass.disabled\" (click)=\"run($event, 'blockClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.blockId) {\n <button i18n mat-menu-item [disabled]=\"menu.blockId.disabled\" (click)=\"run($event, 'blockId')\"\n >ID...\n </button>\n }\n </mat-menu>\n @if (menu.addColumnBefore) {\n <button mat-button [matMenuTriggerFor]=\"tableMenu\">\n <span i18n>Tableau</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n }\n <mat-menu #tableMenu=\"matMenu\">\n @if (menu.insertTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.insertTable.disabled\"\n (click)=\"run($event, 'insertTable')\"\n i18n\n >Ins\u00E9rer un tableau\n </button>\n }\n @if (menu.deleteTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteTable.disabled\"\n (click)=\"run($event, 'deleteTable')\"\n i18n\n >Supprimer le tableau\n </button>\n }\n @if (menu.mergeCells) {\n <button mat-menu-item [disabled]=\"menu.mergeCells.disabled\" (click)=\"run($event, 'mergeCells')\" i18n\n >Fusionner les cellules\n </button>\n }\n @if (menu.splitCell) {\n <button mat-menu-item [disabled]=\"menu.splitCell.disabled\" (click)=\"run($event, 'splitCell')\" i18n\n >Scinder les cellules\n </button>\n }\n @if (menu.cellBackgroundColor) {\n <button\n mat-menu-item\n [disabled]=\"menu.cellBackgroundColor.disabled\"\n (click)=\"run($event, 'cellBackgroundColor')\"\n i18n\n >Couleur de fond...\n </button>\n }\n @if (menu.tableClass) {\n <button mat-menu-item [disabled]=\"menu.tableClass.disabled\" (click)=\"run($event, 'tableClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.tableId) {\n <button i18n mat-menu-item [disabled]=\"menu.tableId.disabled\" (click)=\"run($event, 'tableId')\"\n >ID...\n </button>\n }\n <mat-divider />\n @if (menu.addColumnBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnBefore.disabled\"\n (click)=\"run($event, 'addColumnBefore')\"\n i18n\n >Ins\u00E9rer une colonne avant\n </button>\n }\n @if (menu.addColumnAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnAfter.disabled\"\n (click)=\"run($event, 'addColumnAfter')\"\n i18n\n >Ins\u00E9rer une colonne apr\u00E8s\n </button>\n }\n @if (menu.deleteColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteColumn.disabled\"\n (click)=\"run($event, 'deleteColumn')\"\n i18n\n >Supprimer la colonne\n </button>\n }\n <mat-divider />\n @if (menu.addRowBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowBefore.disabled\"\n (click)=\"run($event, 'addRowBefore')\"\n i18n\n >Ins\u00E9rer une ligne avant\n </button>\n }\n @if (menu.addRowAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowAfter.disabled\"\n (click)=\"run($event, 'addRowAfter')\"\n i18n\n >Ins\u00E9rer une ligne apr\u00E8s\n </button>\n }\n @if (menu.deleteRow) {\n <button mat-menu-item [disabled]=\"menu.deleteRow.disabled\" (click)=\"run($event, 'deleteRow')\" i18n\n >Supprimer la ligne\n </button>\n }\n <mat-divider />\n @if (menu.toggleHeaderColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderColumn.disabled\"\n (click)=\"run($event, 'toggleHeaderColumn')\"\n i18n\n >Ent\u00EAte de colonne\n </button>\n }\n @if (menu.toggleHeaderRow) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderRow.disabled\"\n (click)=\"run($event, 'toggleHeaderRow')\"\n i18n\n >Ent\u00EAte de ligne\n </button>\n }\n @if (menu.toggleHeaderCell) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderCell.disabled\"\n (click)=\"run($event, 'toggleHeaderCell')\"\n i18n\n >Ent\u00EAte de cellule\n </button>\n }\n </mat-menu>\n @if (imageUploader) {\n <button\n mat-icon-button\n naturalFileDrop\n [selectable]=\"true\"\n [broadcast]=\"false\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer une image\"\n (fileChange)=\"upload($event)\"\n >\n <mat-icon fontIcon=\"insert_photo\" />\n </button>\n }\n @if (menu.alignLeft) {\n <mat-button-toggle-group hideSingleSelectionIndicator>\n @if (menu.alignLeft) {\n <mat-button-toggle\n [disabled]=\"menu.alignLeft.disabled\"\n [checked]=\"menu.alignLeft.active\"\n (click)=\"run($event, 'alignLeft')\"\n i18n-matTooltip\n matTooltip=\"Aligner gauche\"\n >\n <mat-icon fontIcon=\"format_align_left\" />\n </mat-button-toggle>\n }\n @if (menu.alignCenter) {\n <mat-button-toggle\n [disabled]=\"menu.alignCenter.disabled\"\n [checked]=\"menu.alignCenter.active\"\n (click)=\"run($event, 'alignCenter')\"\n i18n-matTooltip\n matTooltip=\"Centrer\"\n >\n <mat-icon fontIcon=\"format_align_center\" />\n </mat-button-toggle>\n }\n @if (menu.alignRight) {\n <mat-button-toggle\n [disabled]=\"menu.alignRight.disabled\"\n [checked]=\"menu.alignRight.active\"\n (click)=\"run($event, 'alignRight')\"\n i18n-matTooltip\n matTooltip=\"Aligner droite\"\n >\n <mat-icon fontIcon=\"format_align_right\" />\n </mat-button-toggle>\n }\n @if (menu.alignJustify) {\n <mat-button-toggle\n [disabled]=\"menu.alignJustify.disabled\"\n [checked]=\"menu.alignJustify.active\"\n (click)=\"run($event, 'alignJustify')\"\n i18n-matTooltip\n matTooltip=\"Justifier\"\n >\n <mat-icon fontIcon=\"format_align_justify\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n }\n @if (menu.undo) {\n <button\n mat-icon-button\n [disabled]=\"menu.undo.disabled\"\n (click)=\"run($event, 'undo')\"\n i18n-matTooltip\n matTooltip=\"Annuler\"\n >\n <mat-icon fontIcon=\"undo\" />\n </button>\n }\n @if (menu.redo) {\n <button\n mat-icon-button\n [disabled]=\"menu.redo.disabled\"\n (click)=\"run($event, 'redo')\"\n i18n-matTooltip\n matTooltip=\"Refaire\"\n >\n <mat-icon fontIcon=\"redo\" />\n </button>\n }\n @if (menu.wrapBulletList && menu.wrapBulletList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBulletList.disabled\"\n (click)=\"run($event, 'wrapBulletList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 puce\"\n >\n <mat-icon fontIcon=\"format_list_bulleted\" />\n </button>\n }\n @if (menu.wrapOrderedList && menu.wrapOrderedList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapOrderedList.disabled\"\n (click)=\"run($event, 'wrapOrderedList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 num\u00E9ro\"\n >\n <mat-icon fontIcon=\"format_list_numbered\" />\n </button>\n }\n @if (menu.wrapBlockQuote && menu.wrapBlockQuote.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBlockQuote.disabled\"\n (click)=\"run($event, 'wrapBlockQuote')\"\n i18n-matTooltip\n matTooltip=\"Citation\"\n >\n <mat-icon fontIcon=\"format_quote\" />\n </button>\n }\n @if (menu.joinUp && menu.joinUp.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.joinUp.disabled\"\n (click)=\"run($event, 'joinUp')\"\n i18n-matTooltip\n matTooltip=\"Fusionner avec l'\u00E9l\u00E9ment du haut\"\n >\n <mat-icon fontIcon=\"move_up\" />\n </button>\n }\n @if (menu.lift && menu.lift.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.lift.disabled\"\n (click)=\"run($event, 'lift')\"\n i18n-matTooltip\n matTooltip=\"D\u00E9sindenter\"\n >\n <mat-icon fontIcon=\"format_indent_decrease\" />\n </button>\n }\n @if (menu.selectParentNode && menu.selectParentNode.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.selectParentNode.disabled\"\n (click)=\"run($event, 'selectParentNode')\"\n i18n-matTooltip\n matTooltip=\"S\u00E9lectionner l'\u00E9l\u00E9ment parent\"\n >\n <mat-icon fontIcon=\"select_all\" />\n </button>\n }\n </div>\n </div>\n}\n<div class=\"editor-container\" #editor></div>\n", styles: [".menu{display:flex;flex-wrap:wrap;border-bottom:1px solid;padding:10px 18px}.menu-container{position:sticky;top:-20px;z-index:999}::ng-deep .ProseMirror{position:relative}::ng-deep .ProseMirror{word-wrap:break-word;-webkit-font-variant-ligatures:none;font-variant-ligatures:none;white-space:pre-wrap}::ng-deep .ProseMirror pre{white-space:pre-wrap}::ng-deep .ProseMirror li{position:relative}::ng-deep .ProseMirror-hideselection *::selection{background:transparent}::ng-deep .ProseMirror-hideselection *::-moz-selection{background:transparent}::ng-deep .ProseMirror-hideselection{caret-color:transparent}::ng-deep .ProseMirror-selectednode{outline:2px solid #8cf}::ng-deep li.ProseMirror-selectednode{outline:none}::ng-deep li.ProseMirror-selectednode:after{position:absolute;inset:-2px -2px -2px -32px;border:2px solid #8cf;pointer-events:none;content:\"\"}::ng-deep .ProseMirror-gapcursor{display:none;position:absolute;pointer-events:none}::ng-deep .ProseMirror-gapcursor:after{display:block;position:absolute;top:-2px;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite;border-top:1px solid black;width:20px;content:\"\"}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}::ng-deep .ProseMirror-focused .ProseMirror-gapcursor{display:block}::ng-deep .ProseMirror-example-setup-style hr{margin:1em 0;border:none;padding:2px 10px}::ng-deep .ProseMirror-example-setup-style hr:after{display:block;background-color:silver;height:1px;content:\"\";line-height:2px}::ng-deep .ProseMirror ul,::ng-deep .ProseMirror ol{padding-left:30px}::ng-deep .ProseMirror blockquote{margin-right:0;margin-left:0;border-left:3px solid #eee;padding-left:1em}::ng-deep .ProseMirror-example-setup-style img{cursor:default}::ng-deep .ProseMirror p:first-child,::ng-deep .ProseMirror h1:first-child,::ng-deep .ProseMirror h2:first-child,::ng-deep .ProseMirror h3:first-child,::ng-deep .ProseMirror h4:first-child,::ng-deep .ProseMirror h5:first-child,::ng-deep .ProseMirror h6:first-child{margin-top:10px}::ng-deep .ProseMirror{outline:none;padding:4px 8px 4px 14px;line-height:1.2}::ng-deep .ProseMirror p{margin-bottom:1em}::ng-deep .ProseMirror .tableWrapper{overflow-x:auto}::ng-deep .ProseMirror table{border-collapse:collapse;width:100%;table-layout:fixed;overflow:hidden}::ng-deep .ProseMirror td,::ng-deep .ProseMirror th{position:relative;vertical-align:top;box-sizing:border-box}::ng-deep .ProseMirror .column-resize-handle{position:absolute;top:0;right:-2px;bottom:0;z-index:20;background-color:#adf;width:4px;pointer-events:none}::ng-deep .ProseMirror.resize-cursor{cursor:col-resize}::ng-deep .ProseMirror .selectedCell:after{position:absolute;inset:0;z-index:2;background:#c8c8ff66;pointer-events:none;content:\"\"}::ng-deep .ProseMirror table{margin:0}::ng-deep .ProseMirror th,::ng-deep .ProseMirror td{border:1px solid #ddd;padding:3px 5px;min-width:1em}::ng-deep .ProseMirror .tableWrapper{margin:1em 0}::ng-deep .ProseMirror th{font-weight:700;text-align:left}::ng-deep placeholder{display:block;animation:gradient 3s none infinite;background-size:500% 100%!important;width:50px;height:50px}@keyframes gradient{0%{background-position:100% 100%}to{background-position:0 0}}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i7.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i7.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i8.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i8.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i8.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i9.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: NaturalFileDropDirective, selector: ":not([naturalFileSelect])[naturalFileDrop]", outputs: ["fileOver"] }] }); }
|
|
1674
1674
|
}
|
|
1675
1675
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: NaturalEditorComponent, decorators: [{
|
|
1676
1676
|
type: Component,
|
|
@@ -1682,7 +1682,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImpor
|
|
|
1682
1682
|
MatMenuModule,
|
|
1683
1683
|
MatDividerModule,
|
|
1684
1684
|
NaturalFileDropDirective,
|
|
1685
|
-
], template: "@if (menu && !this.disabled) {\n <div class=\"menu-container\">\n <div class=\"menu\">\n @if (save.observed) {\n <button mat-icon-button (click)=\"save.emit()\" i18n-matTooltip matTooltip=\"Enregistrer\">\n <mat-icon fontIcon=\"save\" />\n </button>\n }\n <mat-button-toggle-group hideMultipleSelectionIndicator multiple>\n @if (menu.toggleStrong) {\n <mat-button-toggle\n [disabled]=\"menu.toggleStrong.disabled\"\n [checked]=\"menu.toggleStrong.active\"\n (click)=\"run($event, 'toggleStrong')\"\n i18n-matTooltip\n matTooltip=\"Gras\"\n >\n <mat-icon fontIcon=\"format_bold\" />\n </mat-button-toggle>\n }\n @if (menu.toggleEm) {\n <mat-button-toggle\n [disabled]=\"menu.toggleEm.disabled\"\n [checked]=\"menu.toggleEm.active\"\n (click)=\"run($event, 'toggleEm')\"\n i18n-matTooltip\n matTooltip=\"Italique\"\n >\n <mat-icon fontIcon=\"format_italic\" />\n </mat-button-toggle>\n }\n @if (menu.toggleCode) {\n <mat-button-toggle\n [disabled]=\"menu.toggleCode.disabled\"\n [checked]=\"menu.toggleCode.active\"\n (click)=\"run($event, 'toggleCode')\"\n i18n-matTooltip\n matTooltip=\"Code\"\n >\n <mat-icon fontIcon=\"code\" />\n </mat-button-toggle>\n }\n @if (menu.toggleLink) {\n <mat-button-toggle\n [disabled]=\"menu.toggleLink.disabled\"\n [checked]=\"menu.toggleLink.active\"\n (click)=\"run($event, 'toggleLink')\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer un lien...\"\n >\n <mat-icon fontIcon=\"insert_link\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n <button mat-button [matMenuTriggerFor]=\"blockMenu\">\n <span i18n>Type</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n <mat-menu #blockMenu=\"matMenu\">\n @if (menu.makeParagraph) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeParagraph.disabled\"\n (click)=\"run($event, 'makeParagraph')\"\n i18n\n >Paragraphe\n </button>\n }\n @if (menu.makeCodeBlock) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeCodeBlock.disabled\"\n (click)=\"run($event, 'makeCodeBlock')\"\n i18n\n >Code\n </button>\n }\n @if (menu.makeHead1) {\n <button mat-menu-item [disabled]=\"menu.makeHead1.disabled\" (click)=\"run($event, 'makeHead1')\" i18n\n >Titre 1\n </button>\n }\n @if (menu.makeHead2) {\n <button mat-menu-item [disabled]=\"menu.makeHead2.disabled\" (click)=\"run($event, 'makeHead2')\" i18n\n >Titre 2\n </button>\n }\n @if (menu.makeHead3) {\n <button mat-menu-item [disabled]=\"menu.makeHead3.disabled\" (click)=\"run($event, 'makeHead3')\" i18n\n >Titre 3\n </button>\n }\n @if (menu.makeHead4) {\n <button mat-menu-item [disabled]=\"menu.makeHead4.disabled\" (click)=\"run($event, 'makeHead4')\" i18n\n >Titre 4\n </button>\n }\n @if (menu.makeHead5) {\n <button mat-menu-item [disabled]=\"menu.makeHead5.disabled\" (click)=\"run($event, 'makeHead5')\" i18n\n >Titre 5\n </button>\n }\n @if (menu.makeHead6) {\n <button mat-menu-item [disabled]=\"menu.makeHead6.disabled\" (click)=\"run($event, 'makeHead6')\" i18n\n >Titre 6\n </button>\n }\n <mat-divider />\n @if (menu.blockClass) {\n <button mat-menu-item [disabled]=\"menu.blockClass.disabled\" (click)=\"run($event, 'blockClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.blockId) {\n <button i18n mat-menu-item [disabled]=\"menu.blockId.disabled\" (click)=\"run($event, 'blockId')\"\n >ID...\n </button>\n }\n </mat-menu>\n @if (menu.addColumnBefore) {\n <button mat-button [matMenuTriggerFor]=\"tableMenu\">\n <span i18n>Tableau</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n }\n <mat-menu #tableMenu=\"matMenu\">\n @if (menu.insertTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.insertTable.disabled\"\n (click)=\"run($event, 'insertTable')\"\n i18n\n >Ins\u00E9rer un tableau\n </button>\n }\n @if (menu.deleteTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteTable.disabled\"\n (click)=\"run($event, 'deleteTable')\"\n i18n\n >Supprimer le tableau\n </button>\n }\n @if (menu.mergeCells) {\n <button mat-menu-item [disabled]=\"menu.mergeCells.disabled\" (click)=\"run($event, 'mergeCells')\" i18n\n >Fusionner les cellules\n </button>\n }\n @if (menu.splitCell) {\n <button mat-menu-item [disabled]=\"menu.splitCell.disabled\" (click)=\"run($event, 'splitCell')\" i18n\n >Scinder les cellules\n </button>\n }\n @if (menu.cellBackgroundColor) {\n <button\n mat-menu-item\n [disabled]=\"menu.cellBackgroundColor.disabled\"\n (click)=\"run($event, 'cellBackgroundColor')\"\n i18n\n >Couleur de fond...\n </button>\n }\n @if (menu.tableClass) {\n <button mat-menu-item [disabled]=\"menu.tableClass.disabled\" (click)=\"run($event, 'tableClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.tableId) {\n <button i18n mat-menu-item [disabled]=\"menu.tableId.disabled\" (click)=\"run($event, 'tableId')\"\n >ID...\n </button>\n }\n <mat-divider />\n @if (menu.addColumnBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnBefore.disabled\"\n (click)=\"run($event, 'addColumnBefore')\"\n i18n\n >Ins\u00E9rer une colonne avant\n </button>\n }\n @if (menu.addColumnAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnAfter.disabled\"\n (click)=\"run($event, 'addColumnAfter')\"\n i18n\n >Ins\u00E9rer une colonne apr\u00E8s\n </button>\n }\n @if (menu.deleteColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteColumn.disabled\"\n (click)=\"run($event, 'deleteColumn')\"\n i18n\n >Supprimer la colonne\n </button>\n }\n <mat-divider />\n @if (menu.addRowBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowBefore.disabled\"\n (click)=\"run($event, 'addRowBefore')\"\n i18n\n >Ins\u00E9rer une ligne avant\n </button>\n }\n @if (menu.addRowAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowAfter.disabled\"\n (click)=\"run($event, 'addRowAfter')\"\n i18n\n >Ins\u00E9rer une ligne apr\u00E8s\n </button>\n }\n @if (menu.deleteRow) {\n <button mat-menu-item [disabled]=\"menu.deleteRow.disabled\" (click)=\"run($event, 'deleteRow')\" i18n\n >Supprimer la ligne\n </button>\n }\n <mat-divider />\n @if (menu.toggleHeaderColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderColumn.disabled\"\n (click)=\"run($event, 'toggleHeaderColumn')\"\n i18n\n >Ent\u00EAte de colonne\n </button>\n }\n @if (menu.toggleHeaderRow) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderRow.disabled\"\n (click)=\"run($event, 'toggleHeaderRow')\"\n i18n\n >Ent\u00EAte de ligne\n </button>\n }\n @if (menu.toggleHeaderCell) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderCell.disabled\"\n (click)=\"run($event, 'toggleHeaderCell')\"\n i18n\n >Ent\u00EAte de cellule\n </button>\n }\n </mat-menu>\n @if (imageUploader) {\n <button\n mat-icon-button\n naturalFileDrop\n [selectable]=\"true\"\n [broadcast]=\"false\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer une image\"\n (fileChange)=\"upload($event)\"\n >\n <mat-icon fontIcon=\"insert_photo\" />\n </button>\n }\n @if (menu.alignLeft) {\n <mat-button-toggle-group hideSingleSelectionIndicator>\n @if (menu.alignLeft) {\n <mat-button-toggle\n [disabled]=\"menu.alignLeft.disabled\"\n [checked]=\"menu.alignLeft.active\"\n (click)=\"run($event, 'alignLeft')\"\n i18n-matTooltip\n matTooltip=\"Aligner gauche\"\n >\n <mat-icon fontIcon=\"format_align_left\" />\n </mat-button-toggle>\n }\n @if (menu.alignCenter) {\n <mat-button-toggle\n [disabled]=\"menu.alignCenter.disabled\"\n [checked]=\"menu.alignCenter.active\"\n (click)=\"run($event, 'alignCenter')\"\n i18n-matTooltip\n matTooltip=\"Centrer\"\n >\n <mat-icon fontIcon=\"format_align_center\" />\n </mat-button-toggle>\n }\n @if (menu.alignRight) {\n <mat-button-toggle\n [disabled]=\"menu.alignRight.disabled\"\n [checked]=\"menu.alignRight.active\"\n (click)=\"run($event, 'alignRight')\"\n i18n-matTooltip\n matTooltip=\"Aligner droite\"\n >\n <mat-icon fontIcon=\"format_align_right\" />\n </mat-button-toggle>\n }\n @if (menu.alignJustify) {\n <mat-button-toggle\n [disabled]=\"menu.alignJustify.disabled\"\n [checked]=\"menu.alignJustify.active\"\n (click)=\"run($event, 'alignJustify')\"\n i18n-matTooltip\n matTooltip=\"Justifier\"\n >\n <mat-icon fontIcon=\"format_align_justify\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n }\n @if (menu.undo) {\n <button\n mat-icon-button\n [disabled]=\"menu.undo.disabled\"\n (click)=\"run($event, 'undo')\"\n i18n-matTooltip\n matTooltip=\"Annuler\"\n >\n <mat-icon fontIcon=\"undo\" />\n </button>\n }\n @if (menu.redo) {\n <button\n mat-icon-button\n [disabled]=\"menu.redo.disabled\"\n (click)=\"run($event, 'redo')\"\n i18n-matTooltip\n matTooltip=\"Refaire\"\n >\n <mat-icon fontIcon=\"redo\" />\n </button>\n }\n @if (menu.wrapBulletList && menu.wrapBulletList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBulletList.disabled\"\n (click)=\"run($event, 'wrapBulletList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 puce\"\n >\n <mat-icon fontIcon=\"format_list_bulleted\" />\n </button>\n }\n @if (menu.wrapOrderedList && menu.wrapOrderedList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapOrderedList.disabled\"\n (click)=\"run($event, 'wrapOrderedList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 num\u00E9ro\"\n >\n <mat-icon fontIcon=\"format_list_numbered\" />\n </button>\n }\n @if (menu.wrapBlockQuote && menu.wrapBlockQuote.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBlockQuote.disabled\"\n (click)=\"run($event, 'wrapBlockQuote')\"\n i18n-matTooltip\n matTooltip=\"Citation\"\n >\n <mat-icon fontIcon=\"format_quote\" />\n </button>\n }\n @if (menu.joinUp && menu.joinUp.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.joinUp.disabled\"\n (click)=\"run($event, 'joinUp')\"\n i18n-matTooltip\n matTooltip=\"Fusionner avec l'\u00E9l\u00E9ment du haut\"\n >\n <mat-icon fontIcon=\"move_up\" />\n </button>\n }\n @if (menu.lift && menu.lift.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.lift.disabled\"\n (click)=\"run($event, 'lift')\"\n i18n-matTooltip\n matTooltip=\"D\u00E9sindenter\"\n >\n <mat-icon fontIcon=\"format_indent_decrease\" />\n </button>\n }\n @if (menu.selectParentNode && menu.selectParentNode.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.selectParentNode.disabled\"\n (click)=\"run($event, 'selectParentNode')\"\n i18n-matTooltip\n matTooltip=\"S\u00E9lectionner l'\u00E9l\u00E9ment parent\"\n >\n <mat-icon fontIcon=\"select_all\" />\n </button>\n }\n </div>\n </div>\n}\n<div class=\"editor-container\" #editor></div>\n", styles: [".menu{border-bottom:1px solid;display:flex;flex-wrap:wrap;padding:10px 18px}.menu-container{position:sticky;top:-20px;z-index:999}::ng-deep .ProseMirror{position:relative}::ng-deep .ProseMirror{word-wrap:break-word;white-space:pre-wrap;-webkit-font-variant-ligatures:none;font-variant-ligatures:none}::ng-deep .ProseMirror pre{white-space:pre-wrap}::ng-deep .ProseMirror li{position:relative}::ng-deep .ProseMirror-hideselection *::selection{background:transparent}::ng-deep .ProseMirror-hideselection *::-moz-selection{background:transparent}::ng-deep .ProseMirror-hideselection{caret-color:transparent}::ng-deep .ProseMirror-selectednode{outline:2px solid #8cf}::ng-deep li.ProseMirror-selectednode{outline:none}::ng-deep li.ProseMirror-selectednode:after{content:\"\";position:absolute;inset:-2px -2px -2px -32px;border:2px solid #8cf;pointer-events:none}::ng-deep .ProseMirror-gapcursor{display:none;pointer-events:none;position:absolute}::ng-deep .ProseMirror-gapcursor:after{content:\"\";display:block;position:absolute;top:-2px;width:20px;border-top:1px solid black;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}::ng-deep .ProseMirror-focused .ProseMirror-gapcursor{display:block}::ng-deep .ProseMirror-example-setup-style hr{padding:2px 10px;border:none;margin:1em 0}::ng-deep .ProseMirror-example-setup-style hr:after{content:\"\";display:block;height:1px;background-color:silver;line-height:2px}::ng-deep .ProseMirror ul,::ng-deep .ProseMirror ol{padding-left:30px}::ng-deep .ProseMirror blockquote{padding-left:1em;border-left:3px solid #eee;margin-left:0;margin-right:0}::ng-deep .ProseMirror-example-setup-style img{cursor:default}::ng-deep .ProseMirror p:first-child,::ng-deep .ProseMirror h1:first-child,::ng-deep .ProseMirror h2:first-child,::ng-deep .ProseMirror h3:first-child,::ng-deep .ProseMirror h4:first-child,::ng-deep .ProseMirror h5:first-child,::ng-deep .ProseMirror h6:first-child{margin-top:10px}::ng-deep .ProseMirror{padding:4px 8px 4px 14px;line-height:1.2;outline:none}::ng-deep .ProseMirror p{margin-bottom:1em}::ng-deep .ProseMirror .tableWrapper{overflow-x:auto}::ng-deep .ProseMirror table{border-collapse:collapse;table-layout:fixed;width:100%;overflow:hidden}::ng-deep .ProseMirror td,::ng-deep .ProseMirror th{vertical-align:top;box-sizing:border-box;position:relative}::ng-deep .ProseMirror .column-resize-handle{position:absolute;right:-2px;top:0;bottom:0;width:4px;z-index:20;background-color:#adf;pointer-events:none}::ng-deep .ProseMirror.resize-cursor{cursor:col-resize}::ng-deep .ProseMirror .selectedCell:after{z-index:2;position:absolute;content:\"\";inset:0;background:#c8c8ff66;pointer-events:none}::ng-deep .ProseMirror table{margin:0}::ng-deep .ProseMirror th,::ng-deep .ProseMirror td{min-width:1em;border:1px solid #ddd;padding:3px 5px}::ng-deep .ProseMirror .tableWrapper{margin:1em 0}::ng-deep .ProseMirror th{font-weight:700;text-align:left}::ng-deep placeholder{display:block;width:50px;height:50px;background-size:500% 100%!important;animation:gradient 3s none infinite}@keyframes gradient{0%{background-position:100% 100%}to{background-position:0 0}}\n"] }]
|
|
1685
|
+
], template: "@if (menu && !this.disabled) {\n <div class=\"menu-container\">\n <div class=\"menu\">\n @if (save.observed) {\n <button mat-icon-button (click)=\"save.emit()\" i18n-matTooltip matTooltip=\"Enregistrer\">\n <mat-icon fontIcon=\"save\" />\n </button>\n }\n <mat-button-toggle-group hideMultipleSelectionIndicator multiple>\n @if (menu.toggleStrong) {\n <mat-button-toggle\n [disabled]=\"menu.toggleStrong.disabled\"\n [checked]=\"menu.toggleStrong.active\"\n (click)=\"run($event, 'toggleStrong')\"\n i18n-matTooltip\n matTooltip=\"Gras\"\n >\n <mat-icon fontIcon=\"format_bold\" />\n </mat-button-toggle>\n }\n @if (menu.toggleEm) {\n <mat-button-toggle\n [disabled]=\"menu.toggleEm.disabled\"\n [checked]=\"menu.toggleEm.active\"\n (click)=\"run($event, 'toggleEm')\"\n i18n-matTooltip\n matTooltip=\"Italique\"\n >\n <mat-icon fontIcon=\"format_italic\" />\n </mat-button-toggle>\n }\n @if (menu.toggleCode) {\n <mat-button-toggle\n [disabled]=\"menu.toggleCode.disabled\"\n [checked]=\"menu.toggleCode.active\"\n (click)=\"run($event, 'toggleCode')\"\n i18n-matTooltip\n matTooltip=\"Code\"\n >\n <mat-icon fontIcon=\"code\" />\n </mat-button-toggle>\n }\n @if (menu.toggleLink) {\n <mat-button-toggle\n [disabled]=\"menu.toggleLink.disabled\"\n [checked]=\"menu.toggleLink.active\"\n (click)=\"run($event, 'toggleLink')\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer un lien...\"\n >\n <mat-icon fontIcon=\"insert_link\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n <button mat-button [matMenuTriggerFor]=\"blockMenu\">\n <span i18n>Type</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n <mat-menu #blockMenu=\"matMenu\">\n @if (menu.makeParagraph) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeParagraph.disabled\"\n (click)=\"run($event, 'makeParagraph')\"\n i18n\n >Paragraphe\n </button>\n }\n @if (menu.makeCodeBlock) {\n <button\n mat-menu-item\n [disabled]=\"menu.makeCodeBlock.disabled\"\n (click)=\"run($event, 'makeCodeBlock')\"\n i18n\n >Code\n </button>\n }\n @if (menu.makeHead1) {\n <button mat-menu-item [disabled]=\"menu.makeHead1.disabled\" (click)=\"run($event, 'makeHead1')\" i18n\n >Titre 1\n </button>\n }\n @if (menu.makeHead2) {\n <button mat-menu-item [disabled]=\"menu.makeHead2.disabled\" (click)=\"run($event, 'makeHead2')\" i18n\n >Titre 2\n </button>\n }\n @if (menu.makeHead3) {\n <button mat-menu-item [disabled]=\"menu.makeHead3.disabled\" (click)=\"run($event, 'makeHead3')\" i18n\n >Titre 3\n </button>\n }\n @if (menu.makeHead4) {\n <button mat-menu-item [disabled]=\"menu.makeHead4.disabled\" (click)=\"run($event, 'makeHead4')\" i18n\n >Titre 4\n </button>\n }\n @if (menu.makeHead5) {\n <button mat-menu-item [disabled]=\"menu.makeHead5.disabled\" (click)=\"run($event, 'makeHead5')\" i18n\n >Titre 5\n </button>\n }\n @if (menu.makeHead6) {\n <button mat-menu-item [disabled]=\"menu.makeHead6.disabled\" (click)=\"run($event, 'makeHead6')\" i18n\n >Titre 6\n </button>\n }\n <mat-divider />\n @if (menu.blockClass) {\n <button mat-menu-item [disabled]=\"menu.blockClass.disabled\" (click)=\"run($event, 'blockClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.blockId) {\n <button i18n mat-menu-item [disabled]=\"menu.blockId.disabled\" (click)=\"run($event, 'blockId')\"\n >ID...\n </button>\n }\n </mat-menu>\n @if (menu.addColumnBefore) {\n <button mat-button [matMenuTriggerFor]=\"tableMenu\">\n <span i18n>Tableau</span>\n <mat-icon fontIcon=\"arrow_drop_down\" />\n </button>\n }\n <mat-menu #tableMenu=\"matMenu\">\n @if (menu.insertTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.insertTable.disabled\"\n (click)=\"run($event, 'insertTable')\"\n i18n\n >Ins\u00E9rer un tableau\n </button>\n }\n @if (menu.deleteTable) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteTable.disabled\"\n (click)=\"run($event, 'deleteTable')\"\n i18n\n >Supprimer le tableau\n </button>\n }\n @if (menu.mergeCells) {\n <button mat-menu-item [disabled]=\"menu.mergeCells.disabled\" (click)=\"run($event, 'mergeCells')\" i18n\n >Fusionner les cellules\n </button>\n }\n @if (menu.splitCell) {\n <button mat-menu-item [disabled]=\"menu.splitCell.disabled\" (click)=\"run($event, 'splitCell')\" i18n\n >Scinder les cellules\n </button>\n }\n @if (menu.cellBackgroundColor) {\n <button\n mat-menu-item\n [disabled]=\"menu.cellBackgroundColor.disabled\"\n (click)=\"run($event, 'cellBackgroundColor')\"\n i18n\n >Couleur de fond...\n </button>\n }\n @if (menu.tableClass) {\n <button mat-menu-item [disabled]=\"menu.tableClass.disabled\" (click)=\"run($event, 'tableClass')\" i18n\n >Classe...\n </button>\n }\n @if (menu.tableId) {\n <button i18n mat-menu-item [disabled]=\"menu.tableId.disabled\" (click)=\"run($event, 'tableId')\"\n >ID...\n </button>\n }\n <mat-divider />\n @if (menu.addColumnBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnBefore.disabled\"\n (click)=\"run($event, 'addColumnBefore')\"\n i18n\n >Ins\u00E9rer une colonne avant\n </button>\n }\n @if (menu.addColumnAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addColumnAfter.disabled\"\n (click)=\"run($event, 'addColumnAfter')\"\n i18n\n >Ins\u00E9rer une colonne apr\u00E8s\n </button>\n }\n @if (menu.deleteColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.deleteColumn.disabled\"\n (click)=\"run($event, 'deleteColumn')\"\n i18n\n >Supprimer la colonne\n </button>\n }\n <mat-divider />\n @if (menu.addRowBefore) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowBefore.disabled\"\n (click)=\"run($event, 'addRowBefore')\"\n i18n\n >Ins\u00E9rer une ligne avant\n </button>\n }\n @if (menu.addRowAfter) {\n <button\n mat-menu-item\n [disabled]=\"menu.addRowAfter.disabled\"\n (click)=\"run($event, 'addRowAfter')\"\n i18n\n >Ins\u00E9rer une ligne apr\u00E8s\n </button>\n }\n @if (menu.deleteRow) {\n <button mat-menu-item [disabled]=\"menu.deleteRow.disabled\" (click)=\"run($event, 'deleteRow')\" i18n\n >Supprimer la ligne\n </button>\n }\n <mat-divider />\n @if (menu.toggleHeaderColumn) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderColumn.disabled\"\n (click)=\"run($event, 'toggleHeaderColumn')\"\n i18n\n >Ent\u00EAte de colonne\n </button>\n }\n @if (menu.toggleHeaderRow) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderRow.disabled\"\n (click)=\"run($event, 'toggleHeaderRow')\"\n i18n\n >Ent\u00EAte de ligne\n </button>\n }\n @if (menu.toggleHeaderCell) {\n <button\n mat-menu-item\n [disabled]=\"menu.toggleHeaderCell.disabled\"\n (click)=\"run($event, 'toggleHeaderCell')\"\n i18n\n >Ent\u00EAte de cellule\n </button>\n }\n </mat-menu>\n @if (imageUploader) {\n <button\n mat-icon-button\n naturalFileDrop\n [selectable]=\"true\"\n [broadcast]=\"false\"\n i18n-matTooltip\n matTooltip=\"Ins\u00E9rer une image\"\n (fileChange)=\"upload($event)\"\n >\n <mat-icon fontIcon=\"insert_photo\" />\n </button>\n }\n @if (menu.alignLeft) {\n <mat-button-toggle-group hideSingleSelectionIndicator>\n @if (menu.alignLeft) {\n <mat-button-toggle\n [disabled]=\"menu.alignLeft.disabled\"\n [checked]=\"menu.alignLeft.active\"\n (click)=\"run($event, 'alignLeft')\"\n i18n-matTooltip\n matTooltip=\"Aligner gauche\"\n >\n <mat-icon fontIcon=\"format_align_left\" />\n </mat-button-toggle>\n }\n @if (menu.alignCenter) {\n <mat-button-toggle\n [disabled]=\"menu.alignCenter.disabled\"\n [checked]=\"menu.alignCenter.active\"\n (click)=\"run($event, 'alignCenter')\"\n i18n-matTooltip\n matTooltip=\"Centrer\"\n >\n <mat-icon fontIcon=\"format_align_center\" />\n </mat-button-toggle>\n }\n @if (menu.alignRight) {\n <mat-button-toggle\n [disabled]=\"menu.alignRight.disabled\"\n [checked]=\"menu.alignRight.active\"\n (click)=\"run($event, 'alignRight')\"\n i18n-matTooltip\n matTooltip=\"Aligner droite\"\n >\n <mat-icon fontIcon=\"format_align_right\" />\n </mat-button-toggle>\n }\n @if (menu.alignJustify) {\n <mat-button-toggle\n [disabled]=\"menu.alignJustify.disabled\"\n [checked]=\"menu.alignJustify.active\"\n (click)=\"run($event, 'alignJustify')\"\n i18n-matTooltip\n matTooltip=\"Justifier\"\n >\n <mat-icon fontIcon=\"format_align_justify\" />\n </mat-button-toggle>\n }\n </mat-button-toggle-group>\n }\n @if (menu.undo) {\n <button\n mat-icon-button\n [disabled]=\"menu.undo.disabled\"\n (click)=\"run($event, 'undo')\"\n i18n-matTooltip\n matTooltip=\"Annuler\"\n >\n <mat-icon fontIcon=\"undo\" />\n </button>\n }\n @if (menu.redo) {\n <button\n mat-icon-button\n [disabled]=\"menu.redo.disabled\"\n (click)=\"run($event, 'redo')\"\n i18n-matTooltip\n matTooltip=\"Refaire\"\n >\n <mat-icon fontIcon=\"redo\" />\n </button>\n }\n @if (menu.wrapBulletList && menu.wrapBulletList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBulletList.disabled\"\n (click)=\"run($event, 'wrapBulletList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 puce\"\n >\n <mat-icon fontIcon=\"format_list_bulleted\" />\n </button>\n }\n @if (menu.wrapOrderedList && menu.wrapOrderedList.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapOrderedList.disabled\"\n (click)=\"run($event, 'wrapOrderedList')\"\n i18n-matTooltip\n matTooltip=\"Liste \u00E0 num\u00E9ro\"\n >\n <mat-icon fontIcon=\"format_list_numbered\" />\n </button>\n }\n @if (menu.wrapBlockQuote && menu.wrapBlockQuote.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.wrapBlockQuote.disabled\"\n (click)=\"run($event, 'wrapBlockQuote')\"\n i18n-matTooltip\n matTooltip=\"Citation\"\n >\n <mat-icon fontIcon=\"format_quote\" />\n </button>\n }\n @if (menu.joinUp && menu.joinUp.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.joinUp.disabled\"\n (click)=\"run($event, 'joinUp')\"\n i18n-matTooltip\n matTooltip=\"Fusionner avec l'\u00E9l\u00E9ment du haut\"\n >\n <mat-icon fontIcon=\"move_up\" />\n </button>\n }\n @if (menu.lift && menu.lift.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.lift.disabled\"\n (click)=\"run($event, 'lift')\"\n i18n-matTooltip\n matTooltip=\"D\u00E9sindenter\"\n >\n <mat-icon fontIcon=\"format_indent_decrease\" />\n </button>\n }\n @if (menu.selectParentNode && menu.selectParentNode.show) {\n <button\n mat-icon-button\n [disabled]=\"menu.selectParentNode.disabled\"\n (click)=\"run($event, 'selectParentNode')\"\n i18n-matTooltip\n matTooltip=\"S\u00E9lectionner l'\u00E9l\u00E9ment parent\"\n >\n <mat-icon fontIcon=\"select_all\" />\n </button>\n }\n </div>\n </div>\n}\n<div class=\"editor-container\" #editor></div>\n", styles: [".menu{display:flex;flex-wrap:wrap;border-bottom:1px solid;padding:10px 18px}.menu-container{position:sticky;top:-20px;z-index:999}::ng-deep .ProseMirror{position:relative}::ng-deep .ProseMirror{word-wrap:break-word;-webkit-font-variant-ligatures:none;font-variant-ligatures:none;white-space:pre-wrap}::ng-deep .ProseMirror pre{white-space:pre-wrap}::ng-deep .ProseMirror li{position:relative}::ng-deep .ProseMirror-hideselection *::selection{background:transparent}::ng-deep .ProseMirror-hideselection *::-moz-selection{background:transparent}::ng-deep .ProseMirror-hideselection{caret-color:transparent}::ng-deep .ProseMirror-selectednode{outline:2px solid #8cf}::ng-deep li.ProseMirror-selectednode{outline:none}::ng-deep li.ProseMirror-selectednode:after{position:absolute;inset:-2px -2px -2px -32px;border:2px solid #8cf;pointer-events:none;content:\"\"}::ng-deep .ProseMirror-gapcursor{display:none;position:absolute;pointer-events:none}::ng-deep .ProseMirror-gapcursor:after{display:block;position:absolute;top:-2px;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite;border-top:1px solid black;width:20px;content:\"\"}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}::ng-deep .ProseMirror-focused .ProseMirror-gapcursor{display:block}::ng-deep .ProseMirror-example-setup-style hr{margin:1em 0;border:none;padding:2px 10px}::ng-deep .ProseMirror-example-setup-style hr:after{display:block;background-color:silver;height:1px;content:\"\";line-height:2px}::ng-deep .ProseMirror ul,::ng-deep .ProseMirror ol{padding-left:30px}::ng-deep .ProseMirror blockquote{margin-right:0;margin-left:0;border-left:3px solid #eee;padding-left:1em}::ng-deep .ProseMirror-example-setup-style img{cursor:default}::ng-deep .ProseMirror p:first-child,::ng-deep .ProseMirror h1:first-child,::ng-deep .ProseMirror h2:first-child,::ng-deep .ProseMirror h3:first-child,::ng-deep .ProseMirror h4:first-child,::ng-deep .ProseMirror h5:first-child,::ng-deep .ProseMirror h6:first-child{margin-top:10px}::ng-deep .ProseMirror{outline:none;padding:4px 8px 4px 14px;line-height:1.2}::ng-deep .ProseMirror p{margin-bottom:1em}::ng-deep .ProseMirror .tableWrapper{overflow-x:auto}::ng-deep .ProseMirror table{border-collapse:collapse;width:100%;table-layout:fixed;overflow:hidden}::ng-deep .ProseMirror td,::ng-deep .ProseMirror th{position:relative;vertical-align:top;box-sizing:border-box}::ng-deep .ProseMirror .column-resize-handle{position:absolute;top:0;right:-2px;bottom:0;z-index:20;background-color:#adf;width:4px;pointer-events:none}::ng-deep .ProseMirror.resize-cursor{cursor:col-resize}::ng-deep .ProseMirror .selectedCell:after{position:absolute;inset:0;z-index:2;background:#c8c8ff66;pointer-events:none;content:\"\"}::ng-deep .ProseMirror table{margin:0}::ng-deep .ProseMirror th,::ng-deep .ProseMirror td{border:1px solid #ddd;padding:3px 5px;min-width:1em}::ng-deep .ProseMirror .tableWrapper{margin:1em 0}::ng-deep .ProseMirror th{font-weight:700;text-align:left}::ng-deep placeholder{display:block;animation:gradient 3s none infinite;background-size:500% 100%!important;width:50px;height:50px}@keyframes gradient{0%{background-position:100% 100%}to{background-position:0 0}}\n"] }]
|
|
1686
1686
|
}], ctorParameters: () => [{ type: i2.NgControl, decorators: [{
|
|
1687
1687
|
type: Optional
|
|
1688
1688
|
}, {
|