@ecodev/natural-editor 61.0.0 → 61.0.2

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.
Files changed (20) hide show
  1. package/esm2022/lib/class-dialog/class-dialog.component.mjs +16 -18
  2. package/esm2022/lib/color-dialog/color-dialog.component.mjs +158 -160
  3. package/esm2022/lib/custom-css/custom-css.directive.mjs +8 -13
  4. package/esm2022/lib/editor/editor.component.mjs +44 -46
  5. package/esm2022/lib/id-dialog/id-dialog.component.mjs +16 -18
  6. package/esm2022/lib/link-dialog/link-dialog.component.mjs +15 -17
  7. package/esm2022/lib/utils/image.mjs +8 -9
  8. package/esm2022/lib/utils/items/item.mjs +14 -13
  9. package/esm2022/public-api.mjs +1 -1
  10. package/fesm2022/ecodev-natural-editor.mjs +261 -275
  11. package/fesm2022/ecodev-natural-editor.mjs.map +1 -1
  12. package/lib/class-dialog/class-dialog.component.d.ts +1 -2
  13. package/lib/color-dialog/color-dialog.component.d.ts +1 -2
  14. package/lib/custom-css/custom-css.directive.d.ts +0 -1
  15. package/lib/editor/editor.component.d.ts +5 -6
  16. package/lib/id-dialog/id-dialog.component.d.ts +1 -2
  17. package/lib/link-dialog/link-dialog.component.d.ts +1 -2
  18. package/lib/utils/image.d.ts +1 -1
  19. package/package.json +1 -1
  20. package/public-api.d.ts +1 -1
package/fesm2022/ecodev-natural-editor.mjs CHANGED
@@ -1,18 +1,18 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Directive, Inject, HostBinding, Input, Injectable, Component, EventEmitter, ElementRef, Optional, Self, ViewChild, Output } from '@angular/core';
2
+ import { inject, Directive, HostBinding, Input, Injectable, Component, EventEmitter, ElementRef, ViewChild, Output } from '@angular/core';
3
3
  import { DOCUMENT } from '@angular/common';
4
+ import * as i2 from '@angular/forms';
5
+ import { FormControl, Validators, FormGroup, FormsModule, ReactiveFormsModule, NgControl } from '@angular/forms';
4
6
  import { DecorationSet, Decoration, EditorView } from 'prosemirror-view';
5
7
  import { Plugin, TextSelection, AllSelection, EditorState } from 'prosemirror-state';
6
8
  import { Schema, DOMSerializer, DOMParser } from 'prosemirror-model';
9
+ import * as i1 from '@angular/material/dialog';
10
+ import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule, MatDialog } from '@angular/material/dialog';
7
11
  import { setCellAttr, isInTable, selectionCell, CellSelection, tableNodeTypes, addColumnBefore, addColumnAfter, deleteColumn, addRowBefore, addRowAfter, deleteRow, deleteTable, mergeCells, splitCell, toggleHeaderColumn, toggleHeaderRow, toggleHeaderCell, tableEditing, goToNextCell } from 'prosemirror-tables';
8
12
  import { keymap } from 'prosemirror-keymap';
9
13
  import { nodes, marks } from 'prosemirror-schema-basic';
10
14
  import { addListNodes, wrapInList, splitListItem, liftListItem, sinkListItem } from 'prosemirror-schema-list';
11
15
  import { joinUpItem, liftItem, selectParentNodeItem, undoItem, redoItem, wrapItem, blockTypeItem } from 'prosemirror-menu';
12
- import * as i1 from '@angular/material/dialog';
13
- import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
14
- import * as i2 from '@angular/forms';
15
- import { FormControl, Validators, FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms';
16
16
  import { ifValid, NaturalIconDirective, NaturalFileDropDirective } from '@ecodev/natural';
17
17
  import * as i4$1 from '@angular/material/input';
18
18
  import { MatInputModule } from '@angular/material/input';
@@ -27,13 +27,13 @@ import { undo, redo, history } from 'prosemirror-history';
27
27
  import { dropCursor } from 'prosemirror-dropcursor';
28
28
  import { gapCursor } from 'prosemirror-gapcursor';
29
29
  import { wrappingInputRule, textblockTypeInputRule, ellipsis, emDash, inputRules, undoInputRule } from 'prosemirror-inputrules';
30
- import * as i9 from '@angular/material/divider';
30
+ import * as i6 from '@angular/material/divider';
31
31
  import { MatDividerModule } from '@angular/material/divider';
32
- import * as i8 from '@angular/material/menu';
32
+ import * as i5$1 from '@angular/material/menu';
33
33
  import { MatMenuModule } from '@angular/material/menu';
34
- import * as i7 from '@angular/material/button-toggle';
34
+ import * as i4$2 from '@angular/material/button-toggle';
35
35
  import { MatButtonToggleModule } from '@angular/material/button-toggle';
36
- import * as i5$1 from '@angular/material/tooltip';
36
+ import * as i2$1 from '@angular/material/tooltip';
37
37
  import { MatTooltipModule } from '@angular/material/tooltip';
38
38
 
39
39
  /**
@@ -71,6 +71,9 @@ let componentCount = 0;
71
71
  * ```
72
72
  */
73
73
  class NaturalCustomCssDirective {
74
+ document = inject(DOCUMENT);
75
+ style = null;
76
+ id = 'n' + ++uniqueId;
74
77
  set naturalCustomCss(value) {
75
78
  if (value && !this.style) {
76
79
  this.style = this.document.createElement('style');
@@ -80,11 +83,6 @@ class NaturalCustomCssDirective {
80
83
  this.style.innerHTML = value ? prefixCss(`[data-natural-id=${this.id}]`, value) : '';
81
84
  }
82
85
  }
83
- constructor(document) {
84
- this.document = document;
85
- this.style = null;
86
- this.id = 'n' + ++uniqueId;
87
- }
88
86
  ngOnDestroy() {
89
87
  this.style?.remove();
90
88
  // Reset uniqueId if we have no component alive anymore, so that we never reach max int
@@ -93,8 +91,8 @@ class NaturalCustomCssDirective {
93
91
  uniqueId = 0;
94
92
  }
95
93
  }
96
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: NaturalCustomCssDirective, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive }); }
97
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.3", type: NaturalCustomCssDirective, isStandalone: true, selector: "[naturalCustomCss]", inputs: { naturalCustomCss: "naturalCustomCss" }, host: { properties: { "attr.data-natural-id": "this.id" } }, ngImport: i0 }); }
94
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: NaturalCustomCssDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
95
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.3", type: NaturalCustomCssDirective, isStandalone: true, selector: "[naturalCustomCss]", inputs: { naturalCustomCss: "naturalCustomCss" }, host: { properties: { "attr.data-natural-id": "this.id" } }, ngImport: i0 });
98
96
  }
99
97
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: NaturalCustomCssDirective, decorators: [{
100
98
  type: Directive,
@@ -102,10 +100,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImpor
102
100
  selector: '[naturalCustomCss]',
103
101
  standalone: true,
104
102
  }]
105
- }], ctorParameters: () => [{ type: Document, decorators: [{
106
- type: Inject,
107
- args: [DOCUMENT]
108
- }] }], propDecorators: { id: [{
103
+ }], propDecorators: { id: [{
109
104
  type: HostBinding,
110
105
  args: ['attr.data-natural-id']
111
106
  }], naturalCustomCss: [{
@@ -114,7 +109,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImpor
114
109
  }] } });
115
110
 
116
111
  class ImagePlugin {
117
- constructor(document) {
112
+ plugin;
113
+ constructor() {
114
+ const document = inject(DOCUMENT);
118
115
  // eslint-disable-next-line @typescript-eslint/no-this-alias
119
116
  const self = this;
120
117
  this.plugin = new Plugin({
@@ -180,16 +177,13 @@ class ImagePlugin {
180
177
  },
181
178
  });
182
179
  }
183
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ImagePlugin, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable }); }
184
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ImagePlugin, providedIn: 'root' }); }
180
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ImagePlugin, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
181
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ImagePlugin, providedIn: 'root' });
185
182
  }
186
183
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ImagePlugin, decorators: [{
187
184
  type: Injectable,
188
185
  args: [{ providedIn: 'root' }]
189
- }], ctorParameters: () => [{ type: Document, decorators: [{
190
- type: Inject,
191
- args: [DOCUMENT]
192
- }] }] });
186
+ }], ctorParameters: () => [] });
193
187
 
194
188
  const ALIGN_PATTERN = /(left|right|center|justify)/;
195
189
  /**
@@ -480,20 +474,21 @@ const advancedSchema = new Schema({
480
474
  * so Angular can query the state as often as needed without performance hit.
481
475
  */
482
476
  class Item {
477
+ spec;
478
+ /**
479
+ * Whether the item is 'active' (for example, the item for toggling the strong mark might be active when the cursor is in strong text).
480
+ */
481
+ active = false;
482
+ /**
483
+ * Button is shown but disabled, because the item cannot be (un-)applied
484
+ */
485
+ disabled = false;
486
+ /**
487
+ * Whether the item is shown at the moment
488
+ */
489
+ show = true;
483
490
  constructor(spec) {
484
491
  this.spec = spec;
485
- /**
486
- * Whether the item is 'active' (for example, the item for toggling the strong mark might be active when the cursor is in strong text).
487
- */
488
- this.active = false;
489
- /**
490
- * Button is shown but disabled, because the item cannot be (un-)applied
491
- */
492
- this.disabled = false;
493
- /**
494
- * Whether the item is shown at the moment
495
- */
496
- this.show = true;
497
492
  }
498
493
  /**
499
494
  * Update the item state according to the editor state
@@ -588,157 +583,158 @@ class TextAlignItem extends Item {
588
583
  }
589
584
 
590
585
  class ColorDialogComponent {
591
- constructor(data, dialogRef) {
592
- this.dialogRef = dialogRef;
593
- this.colors = [
594
- [
595
- '#000000',
596
- '#111111',
597
- '#1c1c1c',
598
- '#333333',
599
- '#666666',
600
- '#808080',
601
- '#999999',
602
- '#b2b2b2',
603
- '#cccccc',
604
- '#dddddd',
605
- '#eeeeee',
606
- '#ffffff',
607
- ],
608
- [
609
- '#ffff00',
610
- '#ffbf00',
611
- '#ff8000',
612
- '#ff4000',
613
- '#ff0000',
614
- '#bf0041',
615
- '#800080',
616
- '#55308d',
617
- '#2a6099',
618
- '#158466',
619
- '#00a933',
620
- '#81d41a',
621
- ],
622
- [
623
- '#ffffd7',
624
- '#fff5ce',
625
- '#ffdbb6',
626
- '#ffd8ce',
627
- '#ffd7d7',
628
- '#f7d1d5',
629
- '#e0c2cd',
630
- '#dedce6',
631
- '#dee6ef',
632
- '#dee7e5',
633
- '#dde8cb',
634
- '#f6f9d4',
635
- ],
636
- [
637
- '#ffffa6',
638
- '#ffe994',
639
- '#ffb66c',
640
- '#ffaa95',
641
- '#ffa6a6',
642
- '#ec9ba4',
643
- '#bf819e',
644
- '#b7b3ca',
645
- '#b4c7dc',
646
- '#b3cac7',
647
- '#afd095',
648
- '#e8f2a1',
649
- ],
650
- [
651
- '#ffff6d',
652
- '#ffde59',
653
- '#ff972f',
654
- '#ff7b59',
655
- '#ff6d6d',
656
- '#e16173',
657
- '#a1467e',
658
- '#8e86ae',
659
- '#729fcf',
660
- '#81aca6',
661
- '#77bc65',
662
- '#d4ea6b',
663
- ],
664
- [
665
- '#ffff38',
666
- '#ffd428',
667
- '#ff860d',
668
- '#ff5429',
669
- '#ff3838',
670
- '#d62e4e',
671
- '#8d1d75',
672
- '#6b5e9b',
673
- '#5983b0',
674
- '#50938a',
675
- '#3faf46',
676
- '#bbe33d',
677
- ],
678
- [
679
- '#e6e905',
680
- '#e8a202',
681
- '#ea7500',
682
- '#ed4c05',
683
- '#f10d0c',
684
- '#a7074b',
685
- '#780373',
686
- '#5b277d',
687
- '#3465a4',
688
- '#168253',
689
- '#069a2e',
690
- '#5eb91e',
691
- ],
692
- [
693
- '#acb20c',
694
- '#b47804',
695
- '#b85c00',
696
- '#be480a',
697
- '#c9211e',
698
- '#861141',
699
- '#650953',
700
- '#55215b',
701
- '#355269',
702
- '#1e6a39',
703
- '#127622',
704
- '#468a1a',
705
- ],
706
- [
707
- '#706e0c',
708
- '#784b04',
709
- '#7b3d00',
710
- '#813709',
711
- '#8d281e',
712
- '#611729',
713
- '#4e102d',
714
- '#481d32',
715
- '#383d3c',
716
- '#28471f',
717
- '#224b12',
718
- '#395511',
719
- ],
720
- [
721
- '#443205',
722
- '#472702',
723
- '#492300',
724
- '#4b2204',
725
- '#50200c',
726
- '#41190d',
727
- '#3b160e',
728
- '#3a1a0f',
729
- '#362413',
730
- '#302709',
731
- '#2e2706',
732
- '#342a06',
733
- ],
734
- ];
735
- this.colorControl = new FormControl('', {
736
- validators: Validators.pattern(/^#\p{Hex_Digit}{6}/u),
737
- nonNullable: true,
738
- });
739
- this.form = new FormGroup({
740
- color: this.colorControl,
741
- });
586
+ dialogRef = inject(MatDialogRef);
587
+ colors = [
588
+ [
589
+ '#000000',
590
+ '#111111',
591
+ '#1c1c1c',
592
+ '#333333',
593
+ '#666666',
594
+ '#808080',
595
+ '#999999',
596
+ '#b2b2b2',
597
+ '#cccccc',
598
+ '#dddddd',
599
+ '#eeeeee',
600
+ '#ffffff',
601
+ ],
602
+ [
603
+ '#ffff00',
604
+ '#ffbf00',
605
+ '#ff8000',
606
+ '#ff4000',
607
+ '#ff0000',
608
+ '#bf0041',
609
+ '#800080',
610
+ '#55308d',
611
+ '#2a6099',
612
+ '#158466',
613
+ '#00a933',
614
+ '#81d41a',
615
+ ],
616
+ [
617
+ '#ffffd7',
618
+ '#fff5ce',
619
+ '#ffdbb6',
620
+ '#ffd8ce',
621
+ '#ffd7d7',
622
+ '#f7d1d5',
623
+ '#e0c2cd',
624
+ '#dedce6',
625
+ '#dee6ef',
626
+ '#dee7e5',
627
+ '#dde8cb',
628
+ '#f6f9d4',
629
+ ],
630
+ [
631
+ '#ffffa6',
632
+ '#ffe994',
633
+ '#ffb66c',
634
+ '#ffaa95',
635
+ '#ffa6a6',
636
+ '#ec9ba4',
637
+ '#bf819e',
638
+ '#b7b3ca',
639
+ '#b4c7dc',
640
+ '#b3cac7',
641
+ '#afd095',
642
+ '#e8f2a1',
643
+ ],
644
+ [
645
+ '#ffff6d',
646
+ '#ffde59',
647
+ '#ff972f',
648
+ '#ff7b59',
649
+ '#ff6d6d',
650
+ '#e16173',
651
+ '#a1467e',
652
+ '#8e86ae',
653
+ '#729fcf',
654
+ '#81aca6',
655
+ '#77bc65',
656
+ '#d4ea6b',
657
+ ],
658
+ [
659
+ '#ffff38',
660
+ '#ffd428',
661
+ '#ff860d',
662
+ '#ff5429',
663
+ '#ff3838',
664
+ '#d62e4e',
665
+ '#8d1d75',
666
+ '#6b5e9b',
667
+ '#5983b0',
668
+ '#50938a',
669
+ '#3faf46',
670
+ '#bbe33d',
671
+ ],
672
+ [
673
+ '#e6e905',
674
+ '#e8a202',
675
+ '#ea7500',
676
+ '#ed4c05',
677
+ '#f10d0c',
678
+ '#a7074b',
679
+ '#780373',
680
+ '#5b277d',
681
+ '#3465a4',
682
+ '#168253',
683
+ '#069a2e',
684
+ '#5eb91e',
685
+ ],
686
+ [
687
+ '#acb20c',
688
+ '#b47804',
689
+ '#b85c00',
690
+ '#be480a',
691
+ '#c9211e',
692
+ '#861141',
693
+ '#650953',
694
+ '#55215b',
695
+ '#355269',
696
+ '#1e6a39',
697
+ '#127622',
698
+ '#468a1a',
699
+ ],
700
+ [
701
+ '#706e0c',
702
+ '#784b04',
703
+ '#7b3d00',
704
+ '#813709',
705
+ '#8d281e',
706
+ '#611729',
707
+ '#4e102d',
708
+ '#481d32',
709
+ '#383d3c',
710
+ '#28471f',
711
+ '#224b12',
712
+ '#395511',
713
+ ],
714
+ [
715
+ '#443205',
716
+ '#472702',
717
+ '#492300',
718
+ '#4b2204',
719
+ '#50200c',
720
+ '#41190d',
721
+ '#3b160e',
722
+ '#3a1a0f',
723
+ '#362413',
724
+ '#302709',
725
+ '#2e2706',
726
+ '#342a06',
727
+ ],
728
+ ];
729
+ colorControl = new FormControl('', {
730
+ validators: Validators.pattern(/^#\p{Hex_Digit}{6}/u),
731
+ nonNullable: true,
732
+ });
733
+ form = new FormGroup({
734
+ color: this.colorControl,
735
+ });
736
+ constructor() {
737
+ const data = inject(MAT_DIALOG_DATA);
742
738
  this.form.setValue(data);
743
739
  }
744
740
  maybeConfirm() {
@@ -751,8 +747,8 @@ class ColorDialogComponent {
751
747
  this.colorControl.setValue(color);
752
748
  this.maybeConfirm();
753
749
  }
754
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ColorDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
755
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.3", 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"] }] }); }
750
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ColorDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
751
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.3", 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"] }] });
756
752
  }
757
753
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ColorDialogComponent, decorators: [{
758
754
  type: Component,
@@ -766,10 +762,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImpor
766
762
  MatFormFieldModule,
767
763
  MatInputModule,
768
764
  ], 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"] }]
769
- }], ctorParameters: () => [{ type: undefined, decorators: [{
770
- type: Inject,
771
- args: [MAT_DIALOG_DATA]
772
- }] }, { type: i1.MatDialogRef }] });
765
+ }], ctorParameters: () => [] });
773
766
 
774
767
  const setCellBackgroundColor = setCellAttr.bind(null, 'background');
775
768
  function findFirstClassInSelection$1(state) {
@@ -824,14 +817,15 @@ class CellBackgroundColorItem extends Item {
824
817
  }
825
818
 
826
819
  class LinkDialogComponent {
827
- constructor(data, dialogRef) {
828
- this.dialogRef = dialogRef;
829
- this.hrefControl = new FormControl('', { validators: Validators.required, nonNullable: true });
830
- this.titleControl = new FormControl('', { nonNullable: true });
831
- this.form = new FormGroup({
832
- href: this.hrefControl,
833
- title: this.titleControl,
834
- });
820
+ dialogRef = inject(MatDialogRef);
821
+ hrefControl = new FormControl('', { validators: Validators.required, nonNullable: true });
822
+ titleControl = new FormControl('', { nonNullable: true });
823
+ form = new FormGroup({
824
+ href: this.hrefControl,
825
+ title: this.titleControl,
826
+ });
827
+ constructor() {
828
+ const data = inject(MAT_DIALOG_DATA);
835
829
  this.form.setValue({ title: '', ...data });
836
830
  }
837
831
  maybeConfirm() {
@@ -840,16 +834,13 @@ class LinkDialogComponent {
840
834
  confirm() {
841
835
  this.dialogRef.close(this.form.getRawValue());
842
836
  }
843
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: LinkDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
844
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.3", 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"] }] }); }
837
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: LinkDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
838
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.3", 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"] }] });
845
839
  }
846
840
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: LinkDialogComponent, decorators: [{
847
841
  type: Component,
848
842
  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"] }]
849
- }], ctorParameters: () => [{ type: undefined, decorators: [{
850
- type: Inject,
851
- args: [MAT_DIALOG_DATA]
852
- }] }, { type: i1.MatDialogRef }] });
843
+ }], ctorParameters: () => [] });
853
844
 
854
845
  function markActive(state, type) {
855
846
  const { from, $from, to, empty } = state.selection;
@@ -968,15 +959,16 @@ function wrapListItem(nodeType) {
968
959
  }
969
960
 
970
961
  class ClassDialogComponent {
971
- constructor(data, dialogRef) {
972
- this.dialogRef = dialogRef;
973
- this.classControl = new FormControl('', {
974
- validators: Validators.pattern(/(^\s*(-?[_a-zA-Z]+[_a-zA-Z0-9-]*\s*)+)/),
975
- nonNullable: true,
976
- });
977
- this.form = new FormGroup({
978
- class: this.classControl,
979
- });
962
+ dialogRef = inject(MatDialogRef);
963
+ classControl = new FormControl('', {
964
+ validators: Validators.pattern(/(^\s*(-?[_a-zA-Z]+[_a-zA-Z0-9-]*\s*)+)/),
965
+ nonNullable: true,
966
+ });
967
+ form = new FormGroup({
968
+ class: this.classControl,
969
+ });
970
+ constructor() {
971
+ const data = inject(MAT_DIALOG_DATA);
980
972
  this.form.setValue(data);
981
973
  }
982
974
  maybeConfirm() {
@@ -985,16 +977,13 @@ class ClassDialogComponent {
985
977
  confirm() {
986
978
  this.dialogRef.close(this.form.getRawValue());
987
979
  }
988
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ClassDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
989
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.3", 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"] }] }); }
980
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ClassDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
981
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.3", 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"] }] });
990
982
  }
991
983
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: ClassDialogComponent, decorators: [{
992
984
  type: Component,
993
985
  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"] }]
994
- }], ctorParameters: () => [{ type: undefined, decorators: [{
995
- type: Inject,
996
- args: [MAT_DIALOG_DATA]
997
- }] }, { type: i1.MatDialogRef }] });
986
+ }], ctorParameters: () => [] });
998
987
 
999
988
  function setClass(tr, classValue, allowedNodeTypes) {
1000
989
  const { selection, doc } = tr;
@@ -1079,15 +1068,16 @@ class ClassItem extends Item {
1079
1068
  }
1080
1069
 
1081
1070
  class IdDialogComponent {
1082
- constructor(data, dialogRef) {
1083
- this.dialogRef = dialogRef;
1084
- this.idControl = new FormControl('', {
1085
- validators: Validators.pattern(/(^(-?[_a-zA-Z]+[_a-zA-Z0-9-]*)+)/),
1086
- nonNullable: true,
1087
- });
1088
- this.form = new FormGroup({
1089
- id: this.idControl,
1090
- });
1071
+ dialogRef = inject(MatDialogRef);
1072
+ idControl = new FormControl('', {
1073
+ validators: Validators.pattern(/(^(-?[_a-zA-Z]+[_a-zA-Z0-9-]*)+)/),
1074
+ nonNullable: true,
1075
+ });
1076
+ form = new FormGroup({
1077
+ id: this.idControl,
1078
+ });
1079
+ constructor() {
1080
+ const data = inject(MAT_DIALOG_DATA);
1091
1081
  this.form.setValue(data);
1092
1082
  }
1093
1083
  maybeConfirm() {
@@ -1096,16 +1086,13 @@ class IdDialogComponent {
1096
1086
  confirm() {
1097
1087
  this.dialogRef.close(this.form.getRawValue());
1098
1088
  }
1099
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: IdDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
1100
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.3", 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"] }] }); }
1089
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: IdDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1090
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.3", 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"] }] });
1101
1091
  }
1102
1092
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: IdDialogComponent, decorators: [{
1103
1093
  type: Component,
1104
1094
  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"] }]
1105
- }], ctorParameters: () => [{ type: undefined, decorators: [{
1106
- type: Inject,
1107
- args: [MAT_DIALOG_DATA]
1108
- }] }, { type: i1.MatDialogRef }] });
1095
+ }], ctorParameters: () => [] });
1109
1096
 
1110
1097
  function setId(tr, idValue, allowedNodeTypes) {
1111
1098
  const { selection, doc } = tr;
@@ -1514,31 +1501,37 @@ function buildKeymap(schema, isMac) {
1514
1501
  */
1515
1502
  // @dynamic
1516
1503
  class NaturalEditorComponent {
1517
- constructor(ngControl, document, dialog, imagePlugin) {
1518
- this.ngControl = ngControl;
1519
- this.document = document;
1520
- this.dialog = dialog;
1521
- this.imagePlugin = imagePlugin;
1522
- this.view = null;
1523
- this.contentChange = new EventEmitter();
1524
- /**
1525
- * Callback to upload an image.
1526
- *
1527
- * If given it will enable advanced schema, including image and tables.
1528
- * It must be given on initialization and cannot be changed later on.
1529
- */
1530
- this.imageUploader = null;
1531
- this.schema = basicSchema;
1532
- /**
1533
- * HTML string
1534
- */
1535
- this.content = '';
1536
- this.menu = null;
1537
- /**
1538
- * If subscribed to, then the save button will be shown and click events forwarded
1539
- */
1540
- this.save = new EventEmitter();
1541
- this.disabled = false;
1504
+ ngControl = inject(NgControl, { optional: true, self: true });
1505
+ document = inject(DOCUMENT);
1506
+ dialog = inject(MatDialog);
1507
+ imagePlugin = inject(ImagePlugin);
1508
+ view = null;
1509
+ editor;
1510
+ contentChange = new EventEmitter();
1511
+ /**
1512
+ * Callback to upload an image.
1513
+ *
1514
+ * If given it will enable advanced schema, including image and tables.
1515
+ * It must be given on initialization and cannot be changed later on.
1516
+ */
1517
+ imageUploader = null;
1518
+ schema = basicSchema;
1519
+ /**
1520
+ * Interface with ControlValueAccessor
1521
+ * Notifies parent model / form controller
1522
+ */
1523
+ onChange;
1524
+ /**
1525
+ * HTML string
1526
+ */
1527
+ content = '';
1528
+ menu = null;
1529
+ /**
1530
+ * If subscribed to, then the save button will be shown and click events forwarded
1531
+ */
1532
+ save = new EventEmitter();
1533
+ disabled = false;
1534
+ constructor() {
1542
1535
  if (this.ngControl !== null) {
1543
1536
  this.ngControl.valueAccessor = this;
1544
1537
  }
@@ -1668,8 +1661,8 @@ class NaturalEditorComponent {
1668
1661
  }
1669
1662
  this.view.focus();
1670
1663
  }
1671
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: NaturalEditorComponent, deps: [{ token: i2.NgControl, optional: true, self: true }, { token: DOCUMENT }, { token: i1.MatDialog }, { token: ImagePlugin }], target: i0.ɵɵFactoryTarget.Component }); }
1672
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.3", 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", "disabledInteractive", "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", "disabledInteractive"], 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"] }] }); }
1664
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: NaturalEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1665
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.3", 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: i2$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: i4$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i4$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i5$1.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: i5$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5$1.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: i6.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: NaturalFileDropDirective, selector: ":not([naturalFileSelect])[naturalFileDrop]", outputs: ["fileOver"] }] });
1673
1666
  }
1674
1667
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImport: i0, type: NaturalEditorComponent, decorators: [{
1675
1668
  type: Component,
@@ -1682,14 +1675,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.3", ngImpor
1682
1675
  MatDividerModule,
1683
1676
  NaturalFileDropDirective,
1684
1677
  ], 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"] }]
1685
- }], ctorParameters: () => [{ type: i2.NgControl, decorators: [{
1686
- type: Optional
1687
- }, {
1688
- type: Self
1689
- }] }, { type: Document, decorators: [{
1690
- type: Inject,
1691
- args: [DOCUMENT]
1692
- }] }, { type: i1.MatDialog }, { type: ImagePlugin }], propDecorators: { editor: [{
1678
+ }], ctorParameters: () => [], propDecorators: { editor: [{
1693
1679
  type: ViewChild,
1694
1680
  args: ['editor', { read: ElementRef, static: true }]
1695
1681
  }], contentChange: [{