el-text-editor 0.0.44 → 0.0.46
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/el-text-editor.component.mjs +69 -11
- package/fesm2015/el-text-editor.mjs +68 -10
- package/fesm2015/el-text-editor.mjs.map +1 -1
- package/fesm2020/el-text-editor.mjs +68 -10
- package/fesm2020/el-text-editor.mjs.map +1 -1
- package/lib/el-text-editor.component.d.ts +3 -1
- package/package.json +1 -1
|
@@ -88,6 +88,31 @@ class ElTextEditorComponent {
|
|
|
88
88
|
this.isOpen.emit(this.IsOpen);
|
|
89
89
|
}
|
|
90
90
|
};
|
|
91
|
+
// openColorPicker(inputId: string) {
|
|
92
|
+
// const inputElement = document.getElementById(inputId);
|
|
93
|
+
// if (inputElement) {
|
|
94
|
+
// inputElement.click();
|
|
95
|
+
// }
|
|
96
|
+
// }
|
|
97
|
+
// setTextColor(event: any) {
|
|
98
|
+
// const editor = document.getElementById('editor');
|
|
99
|
+
// if (editor) {
|
|
100
|
+
// editor.focus();
|
|
101
|
+
// const color = event.target.value;
|
|
102
|
+
// this.selectedTextColor = color;
|
|
103
|
+
// document.execCommand('foreColor', false, color);
|
|
104
|
+
// }
|
|
105
|
+
// }
|
|
106
|
+
// setBackgroundColor(event: any) {
|
|
107
|
+
// const editor = document.getElementById('editor');
|
|
108
|
+
// if (editor) {
|
|
109
|
+
// editor.focus();
|
|
110
|
+
// const color = event.target.value;
|
|
111
|
+
// this.backgroundColor = color;
|
|
112
|
+
// document.execCommand('hiliteColor', false, color);
|
|
113
|
+
// }
|
|
114
|
+
// }
|
|
115
|
+
this.savedSelection = null;
|
|
91
116
|
this.getUserRoles();
|
|
92
117
|
}
|
|
93
118
|
themeMode() {
|
|
@@ -1050,25 +1075,56 @@ class ElTextEditorComponent {
|
|
|
1050
1075
|
openColorPicker(inputId) {
|
|
1051
1076
|
const inputElement = document.getElementById(inputId);
|
|
1052
1077
|
if (inputElement) {
|
|
1078
|
+
// Save the current selection
|
|
1079
|
+
const selection = window.getSelection();
|
|
1080
|
+
if (selection && selection.rangeCount > 0) {
|
|
1081
|
+
this.savedSelection = selection.getRangeAt(0);
|
|
1082
|
+
}
|
|
1053
1083
|
inputElement.click();
|
|
1054
1084
|
}
|
|
1055
1085
|
}
|
|
1056
1086
|
setTextColor(event) {
|
|
1057
|
-
|
|
1058
|
-
if (editor) {
|
|
1059
|
-
editor.focus();
|
|
1087
|
+
if (this.savedSelection) {
|
|
1060
1088
|
const color = event.target.value;
|
|
1061
1089
|
this.selectedTextColor = color;
|
|
1062
|
-
|
|
1090
|
+
// Restore the saved selection
|
|
1091
|
+
const selection = window.getSelection();
|
|
1092
|
+
if (selection) {
|
|
1093
|
+
selection.removeAllRanges();
|
|
1094
|
+
selection.addRange(this.savedSelection);
|
|
1095
|
+
// Apply the color using a span
|
|
1096
|
+
const range = this.savedSelection;
|
|
1097
|
+
const span = document.createElement('span');
|
|
1098
|
+
span.style.color = color;
|
|
1099
|
+
span.textContent = range.toString();
|
|
1100
|
+
// Replace the selected text with the styled span
|
|
1101
|
+
range.deleteContents();
|
|
1102
|
+
range.insertNode(span);
|
|
1103
|
+
// Clear the saved selection
|
|
1104
|
+
this.savedSelection = null;
|
|
1105
|
+
}
|
|
1063
1106
|
}
|
|
1064
1107
|
}
|
|
1065
1108
|
setBackgroundColor(event) {
|
|
1066
|
-
|
|
1067
|
-
if (editor) {
|
|
1068
|
-
editor.focus();
|
|
1109
|
+
if (this.savedSelection) {
|
|
1069
1110
|
const color = event.target.value;
|
|
1070
1111
|
this.backgroundColor = color;
|
|
1071
|
-
|
|
1112
|
+
// Restore the saved selection
|
|
1113
|
+
const selection = window.getSelection();
|
|
1114
|
+
if (selection) {
|
|
1115
|
+
selection.removeAllRanges();
|
|
1116
|
+
selection.addRange(this.savedSelection);
|
|
1117
|
+
// Apply the background color using a span
|
|
1118
|
+
const range = this.savedSelection;
|
|
1119
|
+
const span = document.createElement('span');
|
|
1120
|
+
span.style.backgroundColor = color;
|
|
1121
|
+
span.textContent = range.toString();
|
|
1122
|
+
// Replace the selected text with the styled span
|
|
1123
|
+
range.deleteContents();
|
|
1124
|
+
range.insertNode(span);
|
|
1125
|
+
// Clear the saved selection
|
|
1126
|
+
this.savedSelection = null;
|
|
1127
|
+
}
|
|
1072
1128
|
}
|
|
1073
1129
|
}
|
|
1074
1130
|
// colorChanged(event: any) {
|
|
@@ -1096,7 +1152,7 @@ class ElTextEditorComponent {
|
|
|
1096
1152
|
break;
|
|
1097
1153
|
case 'create-document':
|
|
1098
1154
|
this.imageEdit.emit();
|
|
1099
|
-
data = { editIMG: true, from: 'createDocument', index: this.selectedItemIndex, id: this.editorFrom.id,
|
|
1155
|
+
data = { editIMG: true, from: 'createDocument', index: this.selectedItemIndex, id: this.editorFrom.id, section: this.editorFrom.section, reportSectionId: this.editorFrom.reportSectionId };
|
|
1100
1156
|
// this.openDialog(data)
|
|
1101
1157
|
const compressedData3 = compress(JSON.stringify(this.imageEditUrl));
|
|
1102
1158
|
const compressedData4 = compress(this.editorText);
|
|
@@ -1331,7 +1387,7 @@ class ElTextEditorComponent {
|
|
|
1331
1387
|
}
|
|
1332
1388
|
}
|
|
1333
1389
|
ElTextEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: ElTextEditorComponent, deps: [{ token: i1.Router }, { token: i1.ActivatedRoute }, { token: i0.Renderer2 }, { token: i2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
|
|
1334
|
-
ElTextEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: ElTextEditorComponent, selector: "text-editor", inputs: { editorText: "editorText", editorFrom: "editorFrom", editorAction: "editorAction", UserRole: "UserRole", style: "style", disableToolbar: "disableToolbar", placeHolder: "placeHolder", reportId: "reportId", toolbarMode: "toolbarMode", value: "value" }, outputs: { editorTextChange: "editorTextChange", editorActionResponse: "editorActionResponse", editorTextClear: "editorTextClear", imageEdit: "imageEdit", placeHolderRemove: "placeHolderRemove", isOpen: "isOpen" }, providers: [{
|
|
1390
|
+
ElTextEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: ElTextEditorComponent, selector: "text-editor", inputs: { editorText: "editorText", editorFrom: "editorFrom", editorAction: "editorAction", UserRole: "UserRole", style: "style", disableToolbar: "disableToolbar", placeHolder: "placeHolder", reportId: "reportId", backgroundImage: "backgroundImage", toolbarMode: "toolbarMode", value: "value" }, outputs: { editorTextChange: "editorTextChange", editorActionResponse: "editorActionResponse", editorTextClear: "editorTextClear", imageEdit: "imageEdit", placeHolderRemove: "placeHolderRemove", isOpen: "isOpen" }, providers: [{
|
|
1335
1391
|
provide: NG_VALUE_ACCESSOR,
|
|
1336
1392
|
useExisting: forwardRef(() => ElTextEditorComponent),
|
|
1337
1393
|
multi: true
|
|
@@ -1359,6 +1415,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
|
|
|
1359
1415
|
type: Input
|
|
1360
1416
|
}], reportId: [{
|
|
1361
1417
|
type: Input
|
|
1418
|
+
}], backgroundImage: [{
|
|
1419
|
+
type: Input
|
|
1362
1420
|
}], toolbarMode: [{
|
|
1363
1421
|
type: Input
|
|
1364
1422
|
}], editorTextChange: [{
|