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() {
|
|
@@ -1054,25 +1079,56 @@ class ElTextEditorComponent {
|
|
|
1054
1079
|
openColorPicker(inputId) {
|
|
1055
1080
|
const inputElement = document.getElementById(inputId);
|
|
1056
1081
|
if (inputElement) {
|
|
1082
|
+
// Save the current selection
|
|
1083
|
+
const selection = window.getSelection();
|
|
1084
|
+
if (selection && selection.rangeCount > 0) {
|
|
1085
|
+
this.savedSelection = selection.getRangeAt(0);
|
|
1086
|
+
}
|
|
1057
1087
|
inputElement.click();
|
|
1058
1088
|
}
|
|
1059
1089
|
}
|
|
1060
1090
|
setTextColor(event) {
|
|
1061
|
-
|
|
1062
|
-
if (editor) {
|
|
1063
|
-
editor.focus();
|
|
1091
|
+
if (this.savedSelection) {
|
|
1064
1092
|
const color = event.target.value;
|
|
1065
1093
|
this.selectedTextColor = color;
|
|
1066
|
-
|
|
1094
|
+
// Restore the saved selection
|
|
1095
|
+
const selection = window.getSelection();
|
|
1096
|
+
if (selection) {
|
|
1097
|
+
selection.removeAllRanges();
|
|
1098
|
+
selection.addRange(this.savedSelection);
|
|
1099
|
+
// Apply the color using a span
|
|
1100
|
+
const range = this.savedSelection;
|
|
1101
|
+
const span = document.createElement('span');
|
|
1102
|
+
span.style.color = color;
|
|
1103
|
+
span.textContent = range.toString();
|
|
1104
|
+
// Replace the selected text with the styled span
|
|
1105
|
+
range.deleteContents();
|
|
1106
|
+
range.insertNode(span);
|
|
1107
|
+
// Clear the saved selection
|
|
1108
|
+
this.savedSelection = null;
|
|
1109
|
+
}
|
|
1067
1110
|
}
|
|
1068
1111
|
}
|
|
1069
1112
|
setBackgroundColor(event) {
|
|
1070
|
-
|
|
1071
|
-
if (editor) {
|
|
1072
|
-
editor.focus();
|
|
1113
|
+
if (this.savedSelection) {
|
|
1073
1114
|
const color = event.target.value;
|
|
1074
1115
|
this.backgroundColor = color;
|
|
1075
|
-
|
|
1116
|
+
// Restore the saved selection
|
|
1117
|
+
const selection = window.getSelection();
|
|
1118
|
+
if (selection) {
|
|
1119
|
+
selection.removeAllRanges();
|
|
1120
|
+
selection.addRange(this.savedSelection);
|
|
1121
|
+
// Apply the background color using a span
|
|
1122
|
+
const range = this.savedSelection;
|
|
1123
|
+
const span = document.createElement('span');
|
|
1124
|
+
span.style.backgroundColor = color;
|
|
1125
|
+
span.textContent = range.toString();
|
|
1126
|
+
// Replace the selected text with the styled span
|
|
1127
|
+
range.deleteContents();
|
|
1128
|
+
range.insertNode(span);
|
|
1129
|
+
// Clear the saved selection
|
|
1130
|
+
this.savedSelection = null;
|
|
1131
|
+
}
|
|
1076
1132
|
}
|
|
1077
1133
|
}
|
|
1078
1134
|
// colorChanged(event: any) {
|
|
@@ -1100,7 +1156,7 @@ class ElTextEditorComponent {
|
|
|
1100
1156
|
break;
|
|
1101
1157
|
case 'create-document':
|
|
1102
1158
|
this.imageEdit.emit();
|
|
1103
|
-
data = { editIMG: true, from: 'createDocument', index: this.selectedItemIndex, id: this.editorFrom.id,
|
|
1159
|
+
data = { editIMG: true, from: 'createDocument', index: this.selectedItemIndex, id: this.editorFrom.id, section: this.editorFrom.section, reportSectionId: this.editorFrom.reportSectionId };
|
|
1104
1160
|
// this.openDialog(data)
|
|
1105
1161
|
const compressedData3 = compress(JSON.stringify(this.imageEditUrl));
|
|
1106
1162
|
const compressedData4 = compress(this.editorText);
|
|
@@ -1336,7 +1392,7 @@ class ElTextEditorComponent {
|
|
|
1336
1392
|
}
|
|
1337
1393
|
}
|
|
1338
1394
|
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 });
|
|
1339
|
-
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: [{
|
|
1395
|
+
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: [{
|
|
1340
1396
|
provide: NG_VALUE_ACCESSOR,
|
|
1341
1397
|
useExisting: forwardRef(() => ElTextEditorComponent),
|
|
1342
1398
|
multi: true
|
|
@@ -1364,6 +1420,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
|
|
|
1364
1420
|
type: Input
|
|
1365
1421
|
}], reportId: [{
|
|
1366
1422
|
type: Input
|
|
1423
|
+
}], backgroundImage: [{
|
|
1424
|
+
type: Input
|
|
1367
1425
|
}], toolbarMode: [{
|
|
1368
1426
|
type: Input
|
|
1369
1427
|
}], editorTextChange: [{
|