@hmcts/ccd-case-ui-toolkit 7.3.89-exui-5056 → 7.3.89-exui-5101-rc-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.
- package/fesm2022/hmcts-ccd-case-ui-toolkit.mjs +666 -157
- package/fesm2022/hmcts-ccd-case-ui-toolkit.mjs.map +1 -1
- package/index.d.ts +37 -0
- package/index.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -25910,6 +25910,9 @@ function sanitiseRichTextDocument(documentElement) {
|
|
|
25910
25910
|
const listStart = tagName === 'ol' && /^\d{1,6}$/.test(element.getAttribute('start') || '')
|
|
25911
25911
|
? element.getAttribute('start')
|
|
25912
25912
|
: null;
|
|
25913
|
+
const listType = tagName === 'ol' && /^[ai]$/.test(element.getAttribute('type') || '')
|
|
25914
|
+
? element.getAttribute('type')
|
|
25915
|
+
: null;
|
|
25913
25916
|
while (element.attributes.length > 0) {
|
|
25914
25917
|
element.removeAttribute(element.attributes[0].name);
|
|
25915
25918
|
}
|
|
@@ -25922,6 +25925,9 @@ function sanitiseRichTextDocument(documentElement) {
|
|
|
25922
25925
|
if (listStart) {
|
|
25923
25926
|
element.setAttribute('start', listStart);
|
|
25924
25927
|
}
|
|
25928
|
+
if (listType) {
|
|
25929
|
+
element.setAttribute('type', listType);
|
|
25930
|
+
}
|
|
25925
25931
|
});
|
|
25926
25932
|
return documentElement.body.innerHTML;
|
|
25927
25933
|
}
|
|
@@ -25952,11 +25958,11 @@ class ReadRichTextAreaFieldComponent extends AbstractFieldReadComponent {
|
|
|
25952
25958
|
i0.ɵɵelement(0, "div", 0);
|
|
25953
25959
|
} if (rf & 2) {
|
|
25954
25960
|
i0.ɵɵproperty("innerHTML", ctx.sanitisedValue(), i0.ɵɵsanitizeHtml);
|
|
25955
|
-
} }, styles: ["@charset \"UTF-8\";.ccd-rich-text-area-read{overflow-wrap:anywhere;white-space:pre-wrap;word-break:normal}.ccd-rich-text-area-read strong,.ccd-rich-text-area-read strong *,.ccd-rich-text-area-read b,.ccd-rich-text-area-read b *{font-weight:700}.ccd-rich-text-area-read strong u,.ccd-rich-text-area-read u strong,.ccd-rich-text-area-read b u,.ccd-rich-text-area-read u b{font-weight:700!important;text-decoration:underline}.ccd-rich-text-area-read p,.ccd-rich-text-area-read ul,.ccd-rich-text-area-read ol{margin-top:0;overflow-wrap:anywhere;word-break:normal}.ccd-rich-text-area-read p:empty:before{content:\"\\a0\"}.ccd-rich-text-area-read ul{list-style:disc outside;padding-left:25px}.ccd-rich-text-area-read ol{list-style:decimal outside;padding-left:25px}.ccd-rich-text-area-read li{display:list-item;margin-bottom:5px}.ccd-rich-text-area-read li>p{margin:0}.ccd-rich-text-area-read .ccd-rich-text-indent-1{margin-left:40px}.ccd-rich-text-area-read .ccd-rich-text-indent-2{margin-left:80px}.ccd-rich-text-area-read .ccd-rich-text-indent-3{margin-left:120px}.ccd-rich-text-area-read .ccd-rich-text-indent-4{margin-left:160px}.ccd-rich-text-area-read .ccd-rich-text-indent-5{margin-left:200px}.ccd-rich-text-area-read .ccd-rich-text-indent-6{margin-left:240px}\n"], encapsulation: 2 });
|
|
25961
|
+
} }, styles: ["@charset \"UTF-8\";.ccd-rich-text-area-read{overflow-wrap:anywhere;white-space:pre-wrap;word-break:normal}.ccd-rich-text-area-read strong,.ccd-rich-text-area-read strong *,.ccd-rich-text-area-read b,.ccd-rich-text-area-read b *{font-weight:700}.ccd-rich-text-area-read strong u,.ccd-rich-text-area-read u strong,.ccd-rich-text-area-read b u,.ccd-rich-text-area-read u b{font-weight:700!important;text-decoration:underline}.ccd-rich-text-area-read p,.ccd-rich-text-area-read ul,.ccd-rich-text-area-read ol{margin-top:0;overflow-wrap:anywhere;word-break:normal}.ccd-rich-text-area-read p:empty:before{content:\"\\a0\"}.ccd-rich-text-area-read ul{list-style:disc outside;padding-left:25px}.ccd-rich-text-area-read ol{list-style:decimal outside;padding-left:25px}.ccd-rich-text-area-read ol[type=a]{list-style-type:lower-alpha}.ccd-rich-text-area-read ol[type=i]{list-style-type:lower-roman}.ccd-rich-text-area-read ol[type=i]>li::marker{content:\"(\" counter(list-item,lower-roman) \") \"}.ccd-rich-text-area-read li{display:list-item;margin-bottom:5px}.ccd-rich-text-area-read li>p{margin:0}.ccd-rich-text-area-read .ccd-rich-text-indent-1{margin-left:40px}.ccd-rich-text-area-read .ccd-rich-text-indent-2{margin-left:80px}.ccd-rich-text-area-read .ccd-rich-text-indent-3{margin-left:120px}.ccd-rich-text-area-read .ccd-rich-text-indent-4{margin-left:160px}.ccd-rich-text-area-read .ccd-rich-text-indent-5{margin-left:200px}.ccd-rich-text-area-read .ccd-rich-text-indent-6{margin-left:240px}\n"], encapsulation: 2 });
|
|
25956
25962
|
}
|
|
25957
25963
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadRichTextAreaFieldComponent, [{
|
|
25958
25964
|
type: Component,
|
|
25959
|
-
args: [{ selector: 'ccd-read-rich-text-area-field', template: `<div class="ccd-rich-text-area-read" [innerHTML]="sanitisedValue()"></div>`, encapsulation: ViewEncapsulation.None, standalone: false, styles: ["@charset \"UTF-8\";.ccd-rich-text-area-read{overflow-wrap:anywhere;white-space:pre-wrap;word-break:normal}.ccd-rich-text-area-read strong,.ccd-rich-text-area-read strong *,.ccd-rich-text-area-read b,.ccd-rich-text-area-read b *{font-weight:700}.ccd-rich-text-area-read strong u,.ccd-rich-text-area-read u strong,.ccd-rich-text-area-read b u,.ccd-rich-text-area-read u b{font-weight:700!important;text-decoration:underline}.ccd-rich-text-area-read p,.ccd-rich-text-area-read ul,.ccd-rich-text-area-read ol{margin-top:0;overflow-wrap:anywhere;word-break:normal}.ccd-rich-text-area-read p:empty:before{content:\"\\a0\"}.ccd-rich-text-area-read ul{list-style:disc outside;padding-left:25px}.ccd-rich-text-area-read ol{list-style:decimal outside;padding-left:25px}.ccd-rich-text-area-read li{display:list-item;margin-bottom:5px}.ccd-rich-text-area-read li>p{margin:0}.ccd-rich-text-area-read .ccd-rich-text-indent-1{margin-left:40px}.ccd-rich-text-area-read .ccd-rich-text-indent-2{margin-left:80px}.ccd-rich-text-area-read .ccd-rich-text-indent-3{margin-left:120px}.ccd-rich-text-area-read .ccd-rich-text-indent-4{margin-left:160px}.ccd-rich-text-area-read .ccd-rich-text-indent-5{margin-left:200px}.ccd-rich-text-area-read .ccd-rich-text-indent-6{margin-left:240px}\n"] }]
|
|
25965
|
+
args: [{ selector: 'ccd-read-rich-text-area-field', template: `<div class="ccd-rich-text-area-read" [innerHTML]="sanitisedValue()"></div>`, encapsulation: ViewEncapsulation.None, standalone: false, styles: ["@charset \"UTF-8\";.ccd-rich-text-area-read{overflow-wrap:anywhere;white-space:pre-wrap;word-break:normal}.ccd-rich-text-area-read strong,.ccd-rich-text-area-read strong *,.ccd-rich-text-area-read b,.ccd-rich-text-area-read b *{font-weight:700}.ccd-rich-text-area-read strong u,.ccd-rich-text-area-read u strong,.ccd-rich-text-area-read b u,.ccd-rich-text-area-read u b{font-weight:700!important;text-decoration:underline}.ccd-rich-text-area-read p,.ccd-rich-text-area-read ul,.ccd-rich-text-area-read ol{margin-top:0;overflow-wrap:anywhere;word-break:normal}.ccd-rich-text-area-read p:empty:before{content:\"\\a0\"}.ccd-rich-text-area-read ul{list-style:disc outside;padding-left:25px}.ccd-rich-text-area-read ol{list-style:decimal outside;padding-left:25px}.ccd-rich-text-area-read ol[type=a]{list-style-type:lower-alpha}.ccd-rich-text-area-read ol[type=i]{list-style-type:lower-roman}.ccd-rich-text-area-read ol[type=i]>li::marker{content:\"(\" counter(list-item,lower-roman) \") \"}.ccd-rich-text-area-read li{display:list-item;margin-bottom:5px}.ccd-rich-text-area-read li>p{margin:0}.ccd-rich-text-area-read .ccd-rich-text-indent-1{margin-left:40px}.ccd-rich-text-area-read .ccd-rich-text-indent-2{margin-left:80px}.ccd-rich-text-area-read .ccd-rich-text-indent-3{margin-left:120px}.ccd-rich-text-area-read .ccd-rich-text-indent-4{margin-left:160px}.ccd-rich-text-area-read .ccd-rich-text-indent-5{margin-left:200px}.ccd-rich-text-area-read .ccd-rich-text-indent-6{margin-left:240px}\n"] }]
|
|
25960
25966
|
}], () => [{ type: i1$5.DomSanitizer }], null); })();
|
|
25961
25967
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ReadRichTextAreaFieldComponent, { className: "ReadRichTextAreaFieldComponent", filePath: "lib/shared/components/palette/rich-text-area/read-rich-text-area-field.component.ts", lineNumber: 13 }); })();
|
|
25962
25968
|
|
|
@@ -25965,7 +25971,7 @@ const _c1$e = a0 => ({ "form-group-error": a0 });
|
|
|
25965
25971
|
const _c2$3 = a0 => ({ "ccd-rich-text-area__editor--error": a0 });
|
|
25966
25972
|
const _c3 = a0 => ({ "ccd-rich-text-area__toolbar-button--active": a0 });
|
|
25967
25973
|
function WriteRichTextAreaFieldComponent_span_2_Template(rf, ctx) { if (rf & 1) {
|
|
25968
|
-
i0.ɵɵelementStart(0, "span",
|
|
25974
|
+
i0.ɵɵelementStart(0, "span", 39);
|
|
25969
25975
|
i0.ɵɵtext(1);
|
|
25970
25976
|
i0.ɵɵpipe(2, "ccdFieldLabel");
|
|
25971
25977
|
i0.ɵɵelementEnd();
|
|
@@ -25975,7 +25981,7 @@ function WriteRichTextAreaFieldComponent_span_2_Template(rf, ctx) { if (rf & 1)
|
|
|
25975
25981
|
i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 1, ctx_r1.caseField));
|
|
25976
25982
|
} }
|
|
25977
25983
|
function WriteRichTextAreaFieldComponent_span_3_Template(rf, ctx) { if (rf & 1) {
|
|
25978
|
-
i0.ɵɵelementStart(0, "span",
|
|
25984
|
+
i0.ɵɵelementStart(0, "span", 40);
|
|
25979
25985
|
i0.ɵɵtext(1);
|
|
25980
25986
|
i0.ɵɵpipe(2, "rpxTranslate");
|
|
25981
25987
|
i0.ɵɵelementEnd();
|
|
@@ -25986,7 +25992,7 @@ function WriteRichTextAreaFieldComponent_span_3_Template(rf, ctx) { if (rf & 1)
|
|
|
25986
25992
|
i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 2, ctx_r1.caseField.hint_text));
|
|
25987
25993
|
} }
|
|
25988
25994
|
function WriteRichTextAreaFieldComponent_span_4_Template(rf, ctx) { if (rf & 1) {
|
|
25989
|
-
i0.ɵɵelementStart(0, "span",
|
|
25995
|
+
i0.ɵɵelementStart(0, "span", 41);
|
|
25990
25996
|
i0.ɵɵtext(1);
|
|
25991
25997
|
i0.ɵɵpipe(2, "ccdFirstError");
|
|
25992
25998
|
i0.ɵɵelementEnd();
|
|
@@ -25996,6 +26002,24 @@ function WriteRichTextAreaFieldComponent_span_4_Template(rf, ctx) { if (rf & 1)
|
|
|
25996
26002
|
i0.ɵɵadvance();
|
|
25997
26003
|
i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(2, 2, ctx_r1.richTextAreaControl.errors, ctx_r1.caseField.label), " ");
|
|
25998
26004
|
} }
|
|
26005
|
+
function orderedListStyleForType(type) {
|
|
26006
|
+
if (type === 'a') {
|
|
26007
|
+
return 'lower-alpha';
|
|
26008
|
+
}
|
|
26009
|
+
if (type === 'i') {
|
|
26010
|
+
return 'lower-roman';
|
|
26011
|
+
}
|
|
26012
|
+
return null;
|
|
26013
|
+
}
|
|
26014
|
+
function orderedListTypeForStyle(style) {
|
|
26015
|
+
if (style === 'lower-alpha') {
|
|
26016
|
+
return 'a';
|
|
26017
|
+
}
|
|
26018
|
+
if (style === 'lower-roman') {
|
|
26019
|
+
return 'i';
|
|
26020
|
+
}
|
|
26021
|
+
return null;
|
|
26022
|
+
}
|
|
25999
26023
|
const WORD_COLUMN_SPACING = 12;
|
|
26000
26024
|
const MAX_INDENT = 6;
|
|
26001
26025
|
const CSS_LENGTH_UNITS = ['rem', 'px', 'pt', 'in', 'cm', 'mm', 'em'];
|
|
@@ -26009,7 +26033,8 @@ const richTextNodes = {
|
|
|
26009
26033
|
...nodes.ordered_list,
|
|
26010
26034
|
attrs: {
|
|
26011
26035
|
order: { default: 1 },
|
|
26012
|
-
indent: { default: null }
|
|
26036
|
+
indent: { default: null },
|
|
26037
|
+
listStyle: { default: null }
|
|
26013
26038
|
},
|
|
26014
26039
|
parseDOM: [{
|
|
26015
26040
|
tag: 'ol',
|
|
@@ -26017,28 +26042,35 @@ const richTextNodes = {
|
|
|
26017
26042
|
const list = element;
|
|
26018
26043
|
return {
|
|
26019
26044
|
order: list.hasAttribute('start') ? Number(list.getAttribute('start')) : 1,
|
|
26020
|
-
indent: Number(list.
|
|
26045
|
+
indent: Number(list.dataset.indent) || null,
|
|
26046
|
+
listStyle: orderedListStyleForType(list.getAttribute('type'))
|
|
26021
26047
|
};
|
|
26022
26048
|
}
|
|
26023
26049
|
}],
|
|
26024
26050
|
toDOM: (node) => ['ol', {
|
|
26025
26051
|
start: node.attrs.order === 1 ? null : node.attrs.order,
|
|
26026
|
-
'data-indent': node.attrs.indent
|
|
26052
|
+
'data-indent': node.attrs.indent,
|
|
26053
|
+
type: orderedListTypeForStyle(node.attrs.listStyle)
|
|
26027
26054
|
}, 0]
|
|
26028
26055
|
},
|
|
26029
26056
|
bullet_list: {
|
|
26030
26057
|
...nodes.bullet_list,
|
|
26031
26058
|
attrs: {
|
|
26032
|
-
indent: { default: null }
|
|
26059
|
+
indent: { default: null },
|
|
26060
|
+
continuationOrder: { default: null }
|
|
26033
26061
|
},
|
|
26034
26062
|
parseDOM: [{
|
|
26035
26063
|
tag: 'ul',
|
|
26036
26064
|
getAttrs: (element) => {
|
|
26037
26065
|
const list = element;
|
|
26038
|
-
return {
|
|
26066
|
+
return {
|
|
26067
|
+
indent: Number(list.dataset.indent) || null
|
|
26068
|
+
};
|
|
26039
26069
|
}
|
|
26040
26070
|
}],
|
|
26041
|
-
toDOM: (node) => ['ul', {
|
|
26071
|
+
toDOM: (node) => ['ul', {
|
|
26072
|
+
'data-indent': node.attrs.indent
|
|
26073
|
+
}, 0]
|
|
26042
26074
|
}
|
|
26043
26075
|
};
|
|
26044
26076
|
const richTextSchema = new Schema({ nodes: richTextNodes, marks: marks });
|
|
@@ -26064,7 +26096,10 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26064
26096
|
plugins: [
|
|
26065
26097
|
new Plugin({
|
|
26066
26098
|
props: {
|
|
26067
|
-
handlePaste: (_view, event) => this.handleEditorPaste(event)
|
|
26099
|
+
handlePaste: (_view, event) => this.handleEditorPaste(event),
|
|
26100
|
+
handleDOMEvents: {
|
|
26101
|
+
keydown: (_view, event) => this.handleEditorKeyDown(event)
|
|
26102
|
+
}
|
|
26068
26103
|
}
|
|
26069
26104
|
})
|
|
26070
26105
|
],
|
|
@@ -26111,6 +26146,9 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26111
26146
|
errorId() {
|
|
26112
26147
|
return `${this.id()}_error`;
|
|
26113
26148
|
}
|
|
26149
|
+
listStyleId() {
|
|
26150
|
+
return `${this.id()}_list_style`;
|
|
26151
|
+
}
|
|
26114
26152
|
toolbarLabel() {
|
|
26115
26153
|
return `${this.caseField.label || this.caseField.id} formatting options`;
|
|
26116
26154
|
}
|
|
@@ -26124,6 +26162,13 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26124
26162
|
onToolbarButtonMouseDown(event) {
|
|
26125
26163
|
event.preventDefault();
|
|
26126
26164
|
}
|
|
26165
|
+
handleEditorKeyDown(event) {
|
|
26166
|
+
if (event.key !== 'Tab' || !this.isNodeActive('list_item')) {
|
|
26167
|
+
return false;
|
|
26168
|
+
}
|
|
26169
|
+
this.executeToolbarCommand(event, event.shiftKey ? 'outdent' : 'indent');
|
|
26170
|
+
return true;
|
|
26171
|
+
}
|
|
26127
26172
|
executeToolbarCommand(event, command) {
|
|
26128
26173
|
event.preventDefault();
|
|
26129
26174
|
event.stopPropagation();
|
|
@@ -26153,11 +26198,11 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26153
26198
|
this.changeIndent(false);
|
|
26154
26199
|
break;
|
|
26155
26200
|
case 'ordered_list':
|
|
26156
|
-
this.
|
|
26201
|
+
this.applyListStyleSelection('ordered_list');
|
|
26157
26202
|
this.paragraphCommandApplied = false;
|
|
26158
26203
|
break;
|
|
26159
26204
|
case 'bullet_list':
|
|
26160
|
-
this.
|
|
26205
|
+
this.toggleBulletList();
|
|
26161
26206
|
this.paragraphCommandApplied = false;
|
|
26162
26207
|
break;
|
|
26163
26208
|
default:
|
|
@@ -26171,6 +26216,249 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26171
26216
|
isToolbarCommandActive(command) {
|
|
26172
26217
|
return !!this.activeToolbarCommands[command];
|
|
26173
26218
|
}
|
|
26219
|
+
currentListStyle() {
|
|
26220
|
+
const activeList = this.activeListNode();
|
|
26221
|
+
if (activeList?.type.name === 'ordered_list') {
|
|
26222
|
+
const orderedListStyle = activeList.attrs.listStyle || 'decimal';
|
|
26223
|
+
if (orderedListStyle === 'lower-alpha') {
|
|
26224
|
+
return 'ordered_alpha';
|
|
26225
|
+
}
|
|
26226
|
+
if (orderedListStyle === 'lower-roman') {
|
|
26227
|
+
return 'ordered_roman';
|
|
26228
|
+
}
|
|
26229
|
+
return 'ordered_list';
|
|
26230
|
+
}
|
|
26231
|
+
if (activeList?.type.name === 'bullet_list') {
|
|
26232
|
+
return 'bullet_list';
|
|
26233
|
+
}
|
|
26234
|
+
return '';
|
|
26235
|
+
}
|
|
26236
|
+
currentListSelectValue() {
|
|
26237
|
+
const currentListStyle = this.currentListStyle();
|
|
26238
|
+
return currentListStyle === 'bullet_list' ? '' : currentListStyle;
|
|
26239
|
+
}
|
|
26240
|
+
onListStyleChange(event) {
|
|
26241
|
+
const listStyle = event.target.value;
|
|
26242
|
+
this.applyListStyleSelection(listStyle);
|
|
26243
|
+
this.richTextAreaControl.markAsDirty();
|
|
26244
|
+
this.editor.view.focus();
|
|
26245
|
+
this.updateToolbarState();
|
|
26246
|
+
this.syncAccessibilityLater();
|
|
26247
|
+
}
|
|
26248
|
+
applyListStyleSelection(listStyle) {
|
|
26249
|
+
const currentListStyle = this.currentListStyle();
|
|
26250
|
+
if (listStyle === currentListStyle) {
|
|
26251
|
+
if (listStyle === 'ordered_list') {
|
|
26252
|
+
this.changeActiveListType('ordered_list', 'decimal');
|
|
26253
|
+
}
|
|
26254
|
+
return;
|
|
26255
|
+
}
|
|
26256
|
+
const currentListType = this.listType(currentListStyle);
|
|
26257
|
+
const nextListType = this.listType(listStyle);
|
|
26258
|
+
if (currentListType && nextListType && currentListType !== nextListType) {
|
|
26259
|
+
this.changeActiveListType(nextListType, this.orderedListStyle(listStyle));
|
|
26260
|
+
}
|
|
26261
|
+
else if (nextListType === 'ordered_list') {
|
|
26262
|
+
if (currentListType !== 'ordered_list') {
|
|
26263
|
+
this.editor.commands.toggleOrderedList().exec();
|
|
26264
|
+
}
|
|
26265
|
+
this.applyOrderedListStyle(this.orderedListStyle(listStyle));
|
|
26266
|
+
}
|
|
26267
|
+
else if (listStyle === 'bullet_list') {
|
|
26268
|
+
if (currentListType !== 'bullet_list') {
|
|
26269
|
+
this.editor.commands.toggleBulletList().exec();
|
|
26270
|
+
}
|
|
26271
|
+
}
|
|
26272
|
+
else {
|
|
26273
|
+
this.applyParagraph();
|
|
26274
|
+
this.paragraphCommandApplied = true;
|
|
26275
|
+
}
|
|
26276
|
+
}
|
|
26277
|
+
changeActiveListType(listType, orderedListStyle) {
|
|
26278
|
+
const { state, dispatch } = this.editor.view;
|
|
26279
|
+
const { $from } = state.selection;
|
|
26280
|
+
const targetType = state.schema.nodes[listType];
|
|
26281
|
+
for (let depth = $from.depth; depth > 0; depth--) {
|
|
26282
|
+
const node = $from.node(depth);
|
|
26283
|
+
if (node.type.name !== 'ordered_list' && node.type.name !== 'bullet_list') {
|
|
26284
|
+
continue;
|
|
26285
|
+
}
|
|
26286
|
+
const transaction = state.tr;
|
|
26287
|
+
let nextOrder = 1;
|
|
26288
|
+
this.contiguousListPositions(depth, listType).forEach(({ position, list }) => {
|
|
26289
|
+
const indent = Number(list.attrs.indent) || null;
|
|
26290
|
+
const attrs = listType === 'ordered_list'
|
|
26291
|
+
? {
|
|
26292
|
+
order: nextOrder,
|
|
26293
|
+
indent,
|
|
26294
|
+
listStyle: orderedListStyle === 'decimal' ? null : orderedListStyle
|
|
26295
|
+
}
|
|
26296
|
+
: {
|
|
26297
|
+
indent,
|
|
26298
|
+
continuationOrder: Number(list.attrs.order) || null
|
|
26299
|
+
};
|
|
26300
|
+
transaction.setNodeMarkup(position, targetType, attrs);
|
|
26301
|
+
nextOrder += list.childCount;
|
|
26302
|
+
});
|
|
26303
|
+
dispatch(transaction);
|
|
26304
|
+
return;
|
|
26305
|
+
}
|
|
26306
|
+
}
|
|
26307
|
+
contiguousListPositions(depth, targetListType) {
|
|
26308
|
+
const { $from } = this.editor.view.state.selection;
|
|
26309
|
+
const parentDepth = depth - 1;
|
|
26310
|
+
const parent = $from.node(parentDepth);
|
|
26311
|
+
const activeList = $from.node(depth);
|
|
26312
|
+
const activeIndex = $from.index(parentDepth);
|
|
26313
|
+
const includedIndexes = new Set([activeIndex]);
|
|
26314
|
+
this.collectContiguousListIndexes(parent, activeList, activeIndex, -1, targetListType, includedIndexes);
|
|
26315
|
+
this.collectContiguousListIndexes(parent, activeList, activeIndex, 1, targetListType, includedIndexes);
|
|
26316
|
+
const positions = [];
|
|
26317
|
+
parent.forEach((child, childOffset, index) => {
|
|
26318
|
+
if (includedIndexes.has(index) && this.isList(child)) {
|
|
26319
|
+
positions.push({ position: $from.start(parentDepth) + childOffset, list: child });
|
|
26320
|
+
}
|
|
26321
|
+
});
|
|
26322
|
+
return positions;
|
|
26323
|
+
}
|
|
26324
|
+
collectContiguousListIndexes(parent, activeList, activeIndex, direction, targetListType, includedIndexes) {
|
|
26325
|
+
let adjacentList = activeList;
|
|
26326
|
+
let crossedContent = false;
|
|
26327
|
+
let crossedSectionHeading = false;
|
|
26328
|
+
for (let index = activeIndex + direction; index >= 0 && index < parent.childCount; index += direction) {
|
|
26329
|
+
const child = parent.child(index);
|
|
26330
|
+
if (this.isEmptyParagraph(child)) {
|
|
26331
|
+
continue;
|
|
26332
|
+
}
|
|
26333
|
+
const matchesActiveList = this.hasMatchingListType(child, activeList);
|
|
26334
|
+
const isMixedListToRepair = crossedSectionHeading && this.isList(child) &&
|
|
26335
|
+
child.type.name !== activeList.type.name && targetListType === activeList.type.name;
|
|
26336
|
+
if (matchesActiveList || isMixedListToRepair) {
|
|
26337
|
+
const isHeadingSeparatedBulletList = activeList.type.name === 'bullet_list';
|
|
26338
|
+
if (matchesActiveList && crossedContent && !isHeadingSeparatedBulletList &&
|
|
26339
|
+
!this.isSequentialList(child, adjacentList, direction)) {
|
|
26340
|
+
return;
|
|
26341
|
+
}
|
|
26342
|
+
includedIndexes.add(index);
|
|
26343
|
+
adjacentList = child;
|
|
26344
|
+
crossedContent = false;
|
|
26345
|
+
crossedSectionHeading = false;
|
|
26346
|
+
continue;
|
|
26347
|
+
}
|
|
26348
|
+
if (this.isList(child)) {
|
|
26349
|
+
return;
|
|
26350
|
+
}
|
|
26351
|
+
if (activeList.type.name === 'bullet_list') {
|
|
26352
|
+
if (!this.isListSectionHeading(child)) {
|
|
26353
|
+
return;
|
|
26354
|
+
}
|
|
26355
|
+
}
|
|
26356
|
+
else if (!this.hasListContinuation(activeList)) {
|
|
26357
|
+
return;
|
|
26358
|
+
}
|
|
26359
|
+
crossedContent = true;
|
|
26360
|
+
crossedSectionHeading = crossedSectionHeading || this.isListSectionHeading(child);
|
|
26361
|
+
}
|
|
26362
|
+
}
|
|
26363
|
+
isSequentialList(candidateList, adjacentList, direction) {
|
|
26364
|
+
const candidateOrder = this.listContinuationOrder(candidateList);
|
|
26365
|
+
const adjacentOrder = this.listContinuationOrder(adjacentList);
|
|
26366
|
+
if (!candidateOrder || !adjacentOrder) {
|
|
26367
|
+
return false;
|
|
26368
|
+
}
|
|
26369
|
+
return direction === 1
|
|
26370
|
+
? candidateOrder === adjacentOrder + adjacentList.childCount
|
|
26371
|
+
: candidateOrder + candidateList.childCount === adjacentOrder;
|
|
26372
|
+
}
|
|
26373
|
+
hasListContinuation(list) {
|
|
26374
|
+
return list.type.name === 'ordered_list' || Boolean(list.attrs.continuationOrder);
|
|
26375
|
+
}
|
|
26376
|
+
listContinuationOrder(list) {
|
|
26377
|
+
return Number(list.type.name === 'ordered_list' ? list.attrs.order : list.attrs.continuationOrder) || null;
|
|
26378
|
+
}
|
|
26379
|
+
isList(node) {
|
|
26380
|
+
return node.type.name === 'ordered_list' || node.type.name === 'bullet_list';
|
|
26381
|
+
}
|
|
26382
|
+
hasMatchingListType(node, activeList) {
|
|
26383
|
+
if (node.type !== activeList.type) {
|
|
26384
|
+
return false;
|
|
26385
|
+
}
|
|
26386
|
+
return node.type.name !== 'ordered_list' ||
|
|
26387
|
+
(node.attrs.listStyle || 'decimal') === (activeList.attrs.listStyle || 'decimal');
|
|
26388
|
+
}
|
|
26389
|
+
isEmptyParagraph(node) {
|
|
26390
|
+
return node.type.name === 'paragraph' && !node.textContent.trim();
|
|
26391
|
+
}
|
|
26392
|
+
isListSectionHeading(node) {
|
|
26393
|
+
if (!node.textContent.trim()) {
|
|
26394
|
+
return false;
|
|
26395
|
+
}
|
|
26396
|
+
if (node.type.name === 'heading') {
|
|
26397
|
+
return true;
|
|
26398
|
+
}
|
|
26399
|
+
if (node.type.name !== 'paragraph') {
|
|
26400
|
+
return false;
|
|
26401
|
+
}
|
|
26402
|
+
let hasText = false;
|
|
26403
|
+
let allTextIsBold = true;
|
|
26404
|
+
node.descendants((child) => {
|
|
26405
|
+
if (child.isText && child.textContent.trim()) {
|
|
26406
|
+
hasText = true;
|
|
26407
|
+
allTextIsBold = allTextIsBold && child.marks.some((mark) => mark.type.name === 'strong');
|
|
26408
|
+
}
|
|
26409
|
+
});
|
|
26410
|
+
return hasText && allTextIsBold;
|
|
26411
|
+
}
|
|
26412
|
+
toggleBulletList() {
|
|
26413
|
+
const currentListStyle = this.currentListStyle();
|
|
26414
|
+
const currentListType = this.listType(currentListStyle);
|
|
26415
|
+
if (currentListType === 'ordered_list') {
|
|
26416
|
+
this.changeActiveListType('bullet_list', 'decimal');
|
|
26417
|
+
}
|
|
26418
|
+
else {
|
|
26419
|
+
this.editor.commands.toggleBulletList().exec();
|
|
26420
|
+
}
|
|
26421
|
+
}
|
|
26422
|
+
listType(listStyle) {
|
|
26423
|
+
if (listStyle === 'bullet_list') {
|
|
26424
|
+
return 'bullet_list';
|
|
26425
|
+
}
|
|
26426
|
+
return listStyle ? 'ordered_list' : '';
|
|
26427
|
+
}
|
|
26428
|
+
orderedListStyle(listStyle) {
|
|
26429
|
+
if (listStyle === 'ordered_alpha') {
|
|
26430
|
+
return 'lower-alpha';
|
|
26431
|
+
}
|
|
26432
|
+
if (listStyle === 'ordered_roman') {
|
|
26433
|
+
return 'lower-roman';
|
|
26434
|
+
}
|
|
26435
|
+
return 'decimal';
|
|
26436
|
+
}
|
|
26437
|
+
activeListNode() {
|
|
26438
|
+
const { $from } = this.editor.view.state.selection;
|
|
26439
|
+
for (let depth = $from.depth; depth > 0; depth--) {
|
|
26440
|
+
const node = $from.node(depth);
|
|
26441
|
+
if (this.isList(node)) {
|
|
26442
|
+
return node;
|
|
26443
|
+
}
|
|
26444
|
+
}
|
|
26445
|
+
return null;
|
|
26446
|
+
}
|
|
26447
|
+
applyOrderedListStyle(listStyle) {
|
|
26448
|
+
const { state, dispatch } = this.editor.view;
|
|
26449
|
+
const { $from } = state.selection;
|
|
26450
|
+
for (let depth = $from.depth; depth > 0; depth--) {
|
|
26451
|
+
const node = $from.node(depth);
|
|
26452
|
+
if (node.type.name !== 'ordered_list') {
|
|
26453
|
+
continue;
|
|
26454
|
+
}
|
|
26455
|
+
dispatch(state.tr.setNodeMarkup($from.before(depth), node.type, {
|
|
26456
|
+
...node.attrs,
|
|
26457
|
+
listStyle: listStyle === 'decimal' ? null : listStyle
|
|
26458
|
+
}));
|
|
26459
|
+
return;
|
|
26460
|
+
}
|
|
26461
|
+
}
|
|
26174
26462
|
onPaste(event) {
|
|
26175
26463
|
if (event.defaultPrevented) {
|
|
26176
26464
|
return;
|
|
@@ -26225,11 +26513,13 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26225
26513
|
normalisePastedHtml(html) {
|
|
26226
26514
|
const documentElement = new DOMParser().parseFromString(html, 'text/html');
|
|
26227
26515
|
removeUnsafeRichTextElements(documentElement);
|
|
26516
|
+
this.normaliseWordStylesheetFormatting(documentElement);
|
|
26228
26517
|
this.removeWordNoise(documentElement);
|
|
26229
26518
|
this.normaliseWordSpacing(documentElement);
|
|
26230
26519
|
this.normaliseWordTables(documentElement);
|
|
26231
26520
|
this.normaliseWordSemanticBlocks(documentElement);
|
|
26232
26521
|
this.convertWordLists(documentElement);
|
|
26522
|
+
this.normaliseNestedListStructure(documentElement);
|
|
26233
26523
|
this.normaliseSupportedInlineFormatting(documentElement);
|
|
26234
26524
|
this.normaliseBlockFormatting(documentElement);
|
|
26235
26525
|
this.normalisePastedListSpacing(documentElement);
|
|
@@ -26244,6 +26534,7 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26244
26534
|
}
|
|
26245
26535
|
const documentElement = new DOMParser().parseFromString(value, 'text/html');
|
|
26246
26536
|
removeUnsafeRichTextElements(documentElement);
|
|
26537
|
+
this.normaliseWordStylesheetFormatting(documentElement);
|
|
26247
26538
|
this.normaliseWordSpacing(documentElement);
|
|
26248
26539
|
this.normaliseWordTables(documentElement);
|
|
26249
26540
|
this.normaliseWordSemanticBlocks(documentElement);
|
|
@@ -26310,15 +26601,25 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26310
26601
|
Italic: 'Control+I',
|
|
26311
26602
|
Underline: 'Control+U'
|
|
26312
26603
|
};
|
|
26313
|
-
const
|
|
26604
|
+
const toggleCommands = {
|
|
26605
|
+
Bold: 'bold',
|
|
26606
|
+
Italic: 'italic',
|
|
26607
|
+
Underline: 'underline',
|
|
26608
|
+
Paragraph: 'paragraph',
|
|
26609
|
+
'Bullet List': 'bullet_list',
|
|
26610
|
+
'Numbered List': 'ordered_list'
|
|
26611
|
+
};
|
|
26314
26612
|
const buttons = this.editorHost.nativeElement.querySelectorAll('button');
|
|
26315
26613
|
buttons.forEach((button) => {
|
|
26316
26614
|
const label = button.getAttribute('aria-label') || button.title;
|
|
26317
26615
|
if (shortcutLabels[label]) {
|
|
26318
26616
|
button.setAttribute('aria-keyshortcuts', shortcutLabels[label]);
|
|
26319
26617
|
}
|
|
26320
|
-
if (
|
|
26321
|
-
|
|
26618
|
+
if (toggleCommands[label]) {
|
|
26619
|
+
const isActive = label === 'Numbered List'
|
|
26620
|
+
? this.currentListStyle() === 'ordered_list'
|
|
26621
|
+
: this.isToolbarCommandActive(toggleCommands[label]);
|
|
26622
|
+
button.setAttribute('aria-pressed', `${isActive}`);
|
|
26322
26623
|
}
|
|
26323
26624
|
});
|
|
26324
26625
|
}
|
|
@@ -26371,6 +26672,58 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26371
26672
|
const officeParagraphs = Array.prototype.slice.call(documentElement.getElementsByTagName('o:p'));
|
|
26372
26673
|
officeParagraphs.forEach((element) => element.remove());
|
|
26373
26674
|
}
|
|
26675
|
+
normaliseWordStylesheetFormatting(documentElement) {
|
|
26676
|
+
const styleElements = Array.prototype.slice.call(documentElement.querySelectorAll('style'));
|
|
26677
|
+
styleElements.forEach((styleElement) => {
|
|
26678
|
+
const stylesheet = (styleElement.textContent || '').replace(/<!--|-->/g, '');
|
|
26679
|
+
const rules = this.stylesheetRules(stylesheet);
|
|
26680
|
+
rules.forEach(([selectors, declarations]) => {
|
|
26681
|
+
const hasBoldStyle = this.hasBoldStyle(declarations);
|
|
26682
|
+
const headingLevel = this.wordOutlineLevel(declarations);
|
|
26683
|
+
if (!hasBoldStyle && !headingLevel) {
|
|
26684
|
+
return;
|
|
26685
|
+
}
|
|
26686
|
+
selectors.split(',').forEach((selector) => {
|
|
26687
|
+
const normalisedSelector = selector.trim();
|
|
26688
|
+
if (!normalisedSelector || normalisedSelector.startsWith('@')) {
|
|
26689
|
+
return;
|
|
26690
|
+
}
|
|
26691
|
+
try {
|
|
26692
|
+
const matchingElements = documentElement.body.querySelectorAll(normalisedSelector);
|
|
26693
|
+
matchingElements.forEach((element) => {
|
|
26694
|
+
if (headingLevel) {
|
|
26695
|
+
element.dataset.wordHeadingLevel = headingLevel.toString();
|
|
26696
|
+
}
|
|
26697
|
+
if (hasBoldStyle) {
|
|
26698
|
+
this.wrapBoldInlineContents(documentElement, element);
|
|
26699
|
+
}
|
|
26700
|
+
});
|
|
26701
|
+
}
|
|
26702
|
+
catch {
|
|
26703
|
+
// Ignore Microsoft Office selectors that are not valid browser CSS selectors.
|
|
26704
|
+
}
|
|
26705
|
+
});
|
|
26706
|
+
});
|
|
26707
|
+
});
|
|
26708
|
+
}
|
|
26709
|
+
stylesheetRules(stylesheet) {
|
|
26710
|
+
const rules = [];
|
|
26711
|
+
let searchFrom = 0;
|
|
26712
|
+
let openingBrace = stylesheet.indexOf('{', searchFrom);
|
|
26713
|
+
while (openingBrace !== -1) {
|
|
26714
|
+
const closingBrace = stylesheet.indexOf('}', openingBrace + 1);
|
|
26715
|
+
if (closingBrace === -1) {
|
|
26716
|
+
break;
|
|
26717
|
+
}
|
|
26718
|
+
rules.push([
|
|
26719
|
+
stylesheet.slice(searchFrom, openingBrace),
|
|
26720
|
+
stylesheet.slice(openingBrace + 1, closingBrace)
|
|
26721
|
+
]);
|
|
26722
|
+
searchFrom = closingBrace + 1;
|
|
26723
|
+
openingBrace = stylesheet.indexOf('{', searchFrom);
|
|
26724
|
+
}
|
|
26725
|
+
return rules;
|
|
26726
|
+
}
|
|
26374
26727
|
normaliseWordSpacing(documentElement) {
|
|
26375
26728
|
const spacerElements = Array.prototype.slice.call(documentElement.body.querySelectorAll('[style*="mso-spacerun"]'));
|
|
26376
26729
|
spacerElements.forEach((spacerElement) => {
|
|
@@ -26432,18 +26785,29 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26432
26785
|
});
|
|
26433
26786
|
}
|
|
26434
26787
|
normaliseWordSemanticBlocks(documentElement) {
|
|
26435
|
-
const
|
|
26436
|
-
|
|
26437
|
-
const
|
|
26788
|
+
const blocks = Array.prototype.slice.call(documentElement.body.querySelectorAll('p, h1, h2, h3, h4, h5, h6'));
|
|
26789
|
+
blocks.forEach((block) => {
|
|
26790
|
+
const namedHeadingLevel = this.namedWordHeadingLevel(block);
|
|
26791
|
+
const existingHeadingLevel = /^h([1-6])$/i.exec(block.tagName)?.[1];
|
|
26792
|
+
if (existingHeadingLevel) {
|
|
26793
|
+
if (namedHeadingLevel) {
|
|
26794
|
+
this.wrapBoldInlineContents(documentElement, block);
|
|
26795
|
+
}
|
|
26796
|
+
return;
|
|
26797
|
+
}
|
|
26798
|
+
const headingLevel = this.wordHeadingLevel(block);
|
|
26438
26799
|
if (headingLevel) {
|
|
26439
|
-
this.replaceElementTag(documentElement,
|
|
26800
|
+
const heading = this.replaceElementTag(documentElement, block, `h${headingLevel}`);
|
|
26801
|
+
if (namedHeadingLevel) {
|
|
26802
|
+
this.wrapBoldInlineContents(documentElement, heading);
|
|
26803
|
+
}
|
|
26440
26804
|
}
|
|
26441
26805
|
});
|
|
26442
26806
|
}
|
|
26443
26807
|
wordHeadingLevel(element) {
|
|
26444
|
-
const
|
|
26445
|
-
if (
|
|
26446
|
-
return
|
|
26808
|
+
const namedHeadingLevel = this.namedWordHeadingLevel(element);
|
|
26809
|
+
if (namedHeadingLevel) {
|
|
26810
|
+
return namedHeadingLevel;
|
|
26447
26811
|
}
|
|
26448
26812
|
if (/MsoTitle/i.test(element.className || '')) {
|
|
26449
26813
|
return 1;
|
|
@@ -26455,6 +26819,31 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26455
26819
|
}, 0);
|
|
26456
26820
|
return largestFontSize >= 24 ? 1 : null;
|
|
26457
26821
|
}
|
|
26822
|
+
namedWordHeadingLevel(element) {
|
|
26823
|
+
const styledElements = [element].concat(Array.prototype.slice.call(element.querySelectorAll('*')));
|
|
26824
|
+
for (const styledElement of styledElements) {
|
|
26825
|
+
const storedHeadingLevel = Number(styledElement.dataset.wordHeadingLevel);
|
|
26826
|
+
if (storedHeadingLevel >= 1 && storedHeadingLevel <= 6) {
|
|
26827
|
+
return storedHeadingLevel;
|
|
26828
|
+
}
|
|
26829
|
+
const className = styledElement.className || '';
|
|
26830
|
+
const style = styledElement.getAttribute('style') || '';
|
|
26831
|
+
const headingDescription = `${className} ${style}`;
|
|
26832
|
+
const namedHeadingLevel = /(?:Mso)?Heading\s*([1-6])(?:Char)?/i.exec(headingDescription);
|
|
26833
|
+
if (namedHeadingLevel) {
|
|
26834
|
+
return Number(namedHeadingLevel[1]);
|
|
26835
|
+
}
|
|
26836
|
+
const outlineLevel = this.wordOutlineLevel(style);
|
|
26837
|
+
if (outlineLevel) {
|
|
26838
|
+
return outlineLevel;
|
|
26839
|
+
}
|
|
26840
|
+
}
|
|
26841
|
+
return null;
|
|
26842
|
+
}
|
|
26843
|
+
wordOutlineLevel(style) {
|
|
26844
|
+
const outlineLevel = /mso-outline-level\s*:\s*([1-6])/i.exec(style || '');
|
|
26845
|
+
return outlineLevel ? Number(outlineLevel[1]) : null;
|
|
26846
|
+
}
|
|
26458
26847
|
replaceElementTag(documentElement, element, tagName) {
|
|
26459
26848
|
const replacement = documentElement.createElement(tagName);
|
|
26460
26849
|
Array.prototype.slice.call(element.attributes).forEach((attribute) => {
|
|
@@ -26507,6 +26896,9 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26507
26896
|
const listStart = element.tagName.toLowerCase() === 'ol'
|
|
26508
26897
|
? this.normaliseListStart(element.getAttribute('start'))
|
|
26509
26898
|
: null;
|
|
26899
|
+
const listType = element.tagName.toLowerCase() === 'ol' && /^[ai]$/.test(element.getAttribute('type') || '')
|
|
26900
|
+
? element.getAttribute('type')
|
|
26901
|
+
: null;
|
|
26510
26902
|
while (element.attributes.length > 0) {
|
|
26511
26903
|
element.removeAttribute(element.attributes[0].name);
|
|
26512
26904
|
}
|
|
@@ -26519,6 +26911,9 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26519
26911
|
if (listStart) {
|
|
26520
26912
|
element.setAttribute('start', listStart);
|
|
26521
26913
|
}
|
|
26914
|
+
if (listType) {
|
|
26915
|
+
element.setAttribute('type', listType);
|
|
26916
|
+
}
|
|
26522
26917
|
});
|
|
26523
26918
|
}
|
|
26524
26919
|
normaliseListStart(value) {
|
|
@@ -26619,7 +27014,7 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26619
27014
|
hasBoldStyle(style) {
|
|
26620
27015
|
const fontWeightMatch = /(?:mso-bidi-)?font-weight\s*:\s*([^;]+)/i.exec(style);
|
|
26621
27016
|
if (!fontWeightMatch) {
|
|
26622
|
-
return
|
|
27017
|
+
return /(?:^|;)\s*font\s*:[^;]*\bbold\b/i.test(style);
|
|
26623
27018
|
}
|
|
26624
27019
|
const fontWeight = fontWeightMatch[1].trim().toLowerCase();
|
|
26625
27020
|
return fontWeight === 'bold' || fontWeight === 'bolder' || Number(fontWeight) >= 600;
|
|
@@ -26886,61 +27281,96 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26886
27281
|
convertWordLists(documentElement) {
|
|
26887
27282
|
const childNodes = Array.prototype.slice.call(documentElement.body.querySelectorAll('p'));
|
|
26888
27283
|
const wordListIndents = this.wordListIndents(childNodes);
|
|
26889
|
-
const
|
|
26890
|
-
const
|
|
26891
|
-
|
|
26892
|
-
|
|
27284
|
+
const orderedListTypes = this.wordOrderedListTypes(childNodes);
|
|
27285
|
+
const state = {
|
|
27286
|
+
listStack: [],
|
|
27287
|
+
listParents: [],
|
|
27288
|
+
resetListLevels: new Map(),
|
|
27289
|
+
previousListId: null
|
|
27290
|
+
};
|
|
26893
27291
|
childNodes.forEach((node) => {
|
|
26894
|
-
|
|
26895
|
-
|
|
26896
|
-
|
|
26897
|
-
|
|
26898
|
-
|
|
26899
|
-
|
|
26900
|
-
|
|
26901
|
-
|
|
26902
|
-
|
|
26903
|
-
|
|
26904
|
-
|
|
26905
|
-
|
|
26906
|
-
|
|
26907
|
-
|
|
26908
|
-
|
|
26909
|
-
|
|
26910
|
-
|
|
26911
|
-
|
|
26912
|
-
|
|
26913
|
-
|
|
26914
|
-
|
|
26915
|
-
|
|
26916
|
-
|
|
26917
|
-
|
|
26918
|
-
|
|
26919
|
-
|
|
26920
|
-
|
|
26921
|
-
|
|
26922
|
-
|
|
26923
|
-
|
|
26924
|
-
|
|
26925
|
-
|
|
26926
|
-
|
|
26927
|
-
|
|
26928
|
-
|
|
26929
|
-
|
|
26930
|
-
|
|
26931
|
-
|
|
26932
|
-
|
|
26933
|
-
|
|
26934
|
-
|
|
26935
|
-
|
|
26936
|
-
|
|
26937
|
-
|
|
27292
|
+
this.convertWordListParagraph(documentElement, node, wordListIndents, orderedListTypes, state);
|
|
27293
|
+
});
|
|
27294
|
+
}
|
|
27295
|
+
convertWordListParagraph(documentElement, node, wordListIndents, orderedListTypes, state) {
|
|
27296
|
+
if (!this.isWordListParagraph(node)) {
|
|
27297
|
+
this.resetWordListConversionState(state);
|
|
27298
|
+
return;
|
|
27299
|
+
}
|
|
27300
|
+
const paragraph = node;
|
|
27301
|
+
const listType = this.wordListType(paragraph);
|
|
27302
|
+
const orderedListType = listType === 'ol' ? orderedListTypes.get(this.wordListLevelKey(paragraph)) || null : null;
|
|
27303
|
+
const listId = this.wordListId(paragraph);
|
|
27304
|
+
const requestedLevel = this.wordListRequestedLevel(paragraph, listId, wordListIndents, state);
|
|
27305
|
+
const level = Math.min(requestedLevel, state.listStack.length + 1);
|
|
27306
|
+
const currentList = this.wordListForParagraph(documentElement, paragraph, listType, orderedListType, level, state);
|
|
27307
|
+
const listItem = documentElement.createElement('li');
|
|
27308
|
+
this.copyListItemContents(documentElement, paragraph, listItem);
|
|
27309
|
+
currentList.appendChild(listItem);
|
|
27310
|
+
paragraph.remove();
|
|
27311
|
+
state.previousListId = listId;
|
|
27312
|
+
}
|
|
27313
|
+
resetWordListConversionState(state) {
|
|
27314
|
+
state.listStack.length = 0;
|
|
27315
|
+
state.listParents.length = 0;
|
|
27316
|
+
state.resetListLevels.clear();
|
|
27317
|
+
state.previousListId = null;
|
|
27318
|
+
}
|
|
27319
|
+
wordListRequestedLevel(paragraph, listId, wordListIndents, state) {
|
|
27320
|
+
const declaredLevel = this.wordListDeclaredLevel(paragraph);
|
|
27321
|
+
let requestedLevel = this.wordListLevel(paragraph, wordListIndents);
|
|
27322
|
+
const rememberedResetLevel = declaredLevel === 1 ? state.resetListLevels.get(listId) : null;
|
|
27323
|
+
if (rememberedResetLevel) {
|
|
27324
|
+
return Math.max(requestedLevel, rememberedResetLevel);
|
|
27325
|
+
}
|
|
27326
|
+
if (declaredLevel === 1 && listId !== state.previousListId && state.listStack.length > 1 && requestedLevel === state.listStack.length) {
|
|
27327
|
+
requestedLevel++;
|
|
27328
|
+
state.resetListLevels.set(listId, requestedLevel);
|
|
27329
|
+
}
|
|
27330
|
+
else if (declaredLevel === 1 && listId) {
|
|
27331
|
+
state.resetListLevels.set(listId, requestedLevel);
|
|
27332
|
+
}
|
|
27333
|
+
return requestedLevel;
|
|
27334
|
+
}
|
|
27335
|
+
wordListForParagraph(documentElement, paragraph, listType, orderedListType, level, state) {
|
|
27336
|
+
const stackIndex = level - 1;
|
|
27337
|
+
const parentListItem = stackIndex > 0 ? state.listStack[stackIndex - 1]?.lastElementChild : null;
|
|
27338
|
+
const listParent = parentListItem || paragraph.parentNode;
|
|
27339
|
+
let currentList = state.listStack[stackIndex];
|
|
27340
|
+
if (currentList?.tagName.toLowerCase() !== listType || currentList?.getAttribute('type') !== orderedListType ||
|
|
27341
|
+
state.listParents[stackIndex] !== listParent) {
|
|
27342
|
+
currentList = this.createWordList(documentElement, paragraph, listType, orderedListType, parentListItem);
|
|
27343
|
+
state.listStack[stackIndex] = currentList;
|
|
27344
|
+
state.listParents[stackIndex] = listParent;
|
|
27345
|
+
}
|
|
27346
|
+
state.listStack.length = level;
|
|
27347
|
+
state.listParents.length = level;
|
|
27348
|
+
return currentList;
|
|
27349
|
+
}
|
|
27350
|
+
createWordList(documentElement, paragraph, listType, orderedListType, parentListItem) {
|
|
27351
|
+
const list = documentElement.createElement(listType);
|
|
27352
|
+
const listStart = this.wordListStart(paragraph);
|
|
27353
|
+
if (listType === 'ol' && listStart > 1) {
|
|
27354
|
+
list.setAttribute('start', listStart.toString());
|
|
27355
|
+
}
|
|
27356
|
+
if (orderedListType) {
|
|
27357
|
+
list.setAttribute('type', orderedListType);
|
|
27358
|
+
}
|
|
27359
|
+
if (parentListItem) {
|
|
27360
|
+
parentListItem.appendChild(list);
|
|
27361
|
+
}
|
|
27362
|
+
else {
|
|
27363
|
+
paragraph.parentNode.insertBefore(list, paragraph);
|
|
27364
|
+
}
|
|
27365
|
+
return list;
|
|
27366
|
+
}
|
|
27367
|
+
normaliseNestedListStructure(documentElement) {
|
|
27368
|
+
const orphanedNestedLists = Array.prototype.slice.call(documentElement.body.querySelectorAll('ol > ol, ol > ul, ul > ol, ul > ul'));
|
|
27369
|
+
orphanedNestedLists.forEach((nestedList) => {
|
|
27370
|
+
const previousListItem = nestedList.previousElementSibling;
|
|
27371
|
+
if (previousListItem?.tagName.toLowerCase() === 'li') {
|
|
27372
|
+
previousListItem.appendChild(nestedList);
|
|
26938
27373
|
}
|
|
26939
|
-
listStack.length = level;
|
|
26940
|
-
listParents.length = level;
|
|
26941
|
-
currentList.appendChild(listItem);
|
|
26942
|
-
paragraph.remove();
|
|
26943
|
-
previousListId = listId;
|
|
26944
27374
|
});
|
|
26945
27375
|
}
|
|
26946
27376
|
isWordListParagraph(node) {
|
|
@@ -26950,8 +27380,39 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26950
27380
|
return /MsoListParagraph/i.test(node.className) || /mso-list/i.test(node.getAttribute('style') || '');
|
|
26951
27381
|
}
|
|
26952
27382
|
wordListType(paragraph) {
|
|
26953
|
-
|
|
26954
|
-
|
|
27383
|
+
return /^\(?(?:\d+|[a-z]+)[.)]/i.test(this.wordListMarker(paragraph)) ? 'ol' : 'ul';
|
|
27384
|
+
}
|
|
27385
|
+
wordOrderedListTypes(nodes) {
|
|
27386
|
+
const markersByLevel = new Map();
|
|
27387
|
+
nodes.filter((node) => this.isWordListParagraph(node)).forEach((node) => {
|
|
27388
|
+
const marker = this.wordListMarker(node);
|
|
27389
|
+
if (!/^\(?(?:\d+|[a-z]+)[.)]/i.test(marker)) {
|
|
27390
|
+
return;
|
|
27391
|
+
}
|
|
27392
|
+
const key = this.wordListLevelKey(node);
|
|
27393
|
+
markersByLevel.set(key, [...(markersByLevel.get(key) || []), marker]);
|
|
27394
|
+
});
|
|
27395
|
+
const listTypes = new Map();
|
|
27396
|
+
markersByLevel.forEach((markers, key) => {
|
|
27397
|
+
const markerPattern = /^\(?([a-z]+|\d+)[.)]/i;
|
|
27398
|
+
const markerTokens = markers.map((marker) => markerPattern.exec(marker)?.[1]?.toLowerCase());
|
|
27399
|
+
if (markers.some((marker) => /^\([ivxlcdm]+\)/i.test(marker)) ||
|
|
27400
|
+
markerTokens.some((token) => token?.length > 1 && /^[ivxlcdm]+$/.test(token))) {
|
|
27401
|
+
listTypes.set(key, 'i');
|
|
27402
|
+
}
|
|
27403
|
+
else if (markerTokens.every((token) => /^[a-z]$/.test(token || ''))) {
|
|
27404
|
+
listTypes.set(key, 'a');
|
|
27405
|
+
}
|
|
27406
|
+
});
|
|
27407
|
+
return listTypes;
|
|
27408
|
+
}
|
|
27409
|
+
wordListLevelKey(paragraph) {
|
|
27410
|
+
return `${this.wordListId(paragraph) || ''}:${this.wordListDeclaredLevel(paragraph)}`;
|
|
27411
|
+
}
|
|
27412
|
+
wordListMarker(paragraph) {
|
|
27413
|
+
const markerElement = Array.prototype.slice.call(paragraph.querySelectorAll('[style]'))
|
|
27414
|
+
.find((element) => /mso-list:\s*Ignore/i.test(element.getAttribute('style') || ''));
|
|
27415
|
+
return (markerElement ? markerElement.textContent : paragraph.textContent).trim();
|
|
26955
27416
|
}
|
|
26956
27417
|
wordListLevel(paragraph, wordListIndents) {
|
|
26957
27418
|
const declaredLevel = this.wordListDeclaredLevel(paragraph);
|
|
@@ -26970,8 +27431,7 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26970
27431
|
wordListIndents(nodes) {
|
|
26971
27432
|
const indents = nodes
|
|
26972
27433
|
.filter((node) => this.isWordListParagraph(node))
|
|
26973
|
-
.map((node) => this.wordListIndent(node))
|
|
26974
|
-
.filter((indent) => indent > 0);
|
|
27434
|
+
.map((node) => this.wordListIndent(node));
|
|
26975
27435
|
return Array.from(new Set(indents)).sort((left, right) => left - right);
|
|
26976
27436
|
}
|
|
26977
27437
|
wordListIndent(paragraph) {
|
|
@@ -26980,10 +27440,7 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
26980
27440
|
return Math.round(indent);
|
|
26981
27441
|
}
|
|
26982
27442
|
wordListStart(paragraph) {
|
|
26983
|
-
const
|
|
26984
|
-
.find((element) => /mso-list:\s*Ignore/i.test(element.getAttribute('style') || ''));
|
|
26985
|
-
const marker = (markerElement ? markerElement.textContent : paragraph.textContent).trim();
|
|
26986
|
-
const match = marker.match(/^(\d+)[.)]/);
|
|
27443
|
+
const match = /^(\d+)[.)]/.exec(this.wordListMarker(paragraph));
|
|
26987
27444
|
return match ? Number(match[1]) : 1;
|
|
26988
27445
|
}
|
|
26989
27446
|
copyListItemContents(documentElement, paragraph, listItem) {
|
|
@@ -27032,13 +27489,14 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
27032
27489
|
if (!this.editor?.view) {
|
|
27033
27490
|
return;
|
|
27034
27491
|
}
|
|
27492
|
+
const activeListType = this.activeListNode()?.type.name;
|
|
27035
27493
|
this.activeToolbarCommands = {
|
|
27036
27494
|
bold: this.isMarkActive('strong'),
|
|
27037
27495
|
italic: this.isMarkActive('em'),
|
|
27038
27496
|
underline: this.isMarkActive('u'),
|
|
27039
27497
|
paragraph: this.paragraphCommandApplied && this.isPlainParagraphActive(),
|
|
27040
|
-
ordered_list:
|
|
27041
|
-
bullet_list:
|
|
27498
|
+
ordered_list: activeListType === 'ordered_list',
|
|
27499
|
+
bullet_list: activeListType === 'bullet_list'
|
|
27042
27500
|
};
|
|
27043
27501
|
}
|
|
27044
27502
|
updateToolbarStateLater() {
|
|
@@ -27077,6 +27535,7 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
27077
27535
|
}
|
|
27078
27536
|
const listCommand = increase ? sinkListItem(listItemType) : liftListItem(listItemType);
|
|
27079
27537
|
if (listCommand(state, dispatch)) {
|
|
27538
|
+
this.applyOrderedListStyleForCurrentDepth();
|
|
27080
27539
|
return;
|
|
27081
27540
|
}
|
|
27082
27541
|
if (increase && this.changeListIndent(true, state, dispatch)) {
|
|
@@ -27090,6 +27549,35 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
27090
27549
|
this.editor.commands.outdent().exec();
|
|
27091
27550
|
}
|
|
27092
27551
|
}
|
|
27552
|
+
applyOrderedListStyleForCurrentDepth() {
|
|
27553
|
+
const { state, dispatch } = this.editor.view;
|
|
27554
|
+
const { $from } = state.selection;
|
|
27555
|
+
const orderedListDepths = [];
|
|
27556
|
+
let activeOrderedListDepth = null;
|
|
27557
|
+
for (let depth = 1; depth <= $from.depth; depth++) {
|
|
27558
|
+
if ($from.node(depth).type.name === 'ordered_list') {
|
|
27559
|
+
orderedListDepths.push(depth);
|
|
27560
|
+
activeOrderedListDepth = depth;
|
|
27561
|
+
}
|
|
27562
|
+
}
|
|
27563
|
+
if (activeOrderedListDepth === null || orderedListDepths.length < 2) {
|
|
27564
|
+
return;
|
|
27565
|
+
}
|
|
27566
|
+
const activeList = $from.node(activeOrderedListDepth);
|
|
27567
|
+
const parentListDepth = orderedListDepths[orderedListDepths.length - 2];
|
|
27568
|
+
const parentListStyle = $from.node(parentListDepth).attrs.listStyle || 'decimal';
|
|
27569
|
+
const listStyle = this.nextNestedOrderedListStyle(parentListStyle);
|
|
27570
|
+
dispatch(state.tr.setNodeMarkup($from.before(activeOrderedListDepth), activeList.type, {
|
|
27571
|
+
...activeList.attrs,
|
|
27572
|
+
listStyle: listStyle === 'decimal' ? null : listStyle
|
|
27573
|
+
}));
|
|
27574
|
+
}
|
|
27575
|
+
nextNestedOrderedListStyle(parentListStyle) {
|
|
27576
|
+
if (parentListStyle === 'decimal') {
|
|
27577
|
+
return 'lower-alpha';
|
|
27578
|
+
}
|
|
27579
|
+
return 'lower-roman';
|
|
27580
|
+
}
|
|
27093
27581
|
changeListIndent(increase, state, dispatch) {
|
|
27094
27582
|
const { $from } = state.selection;
|
|
27095
27583
|
for (let depth = $from.depth; depth > 0; depth--) {
|
|
@@ -27191,7 +27679,7 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
27191
27679
|
} if (rf & 2) {
|
|
27192
27680
|
let _t;
|
|
27193
27681
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.editorHost = _t.first);
|
|
27194
|
-
} }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls:
|
|
27682
|
+
} }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 55, vars: 40, consts: [["editorHost", ""], [1, "form-group", "ccd-rich-text-area", 3, "ngClass"], [3, "id"], ["class", "form-label", 4, "ngIf"], ["class", "form-hint", 3, "id", 4, "ngIf"], ["class", "error-message", 3, "id", 4, "ngIf"], [1, "ccd-rich-text-area__editor", 3, "click", "keydown", "keyup", "paste", "ngClass"], ["role", "toolbar", 1, "ccd-rich-text-area__toolbar"], ["type", "button", "aria-label", "Undo", "title", "Undo", "aria-keyshortcuts", "Control+Z", 1, "ccd-rich-text-area__toolbar-button", 3, "mousedown", "click"], ["viewBox", "0 0 24 24", "aria-hidden", "true", "focusable", "false", 1, "ccd-rich-text-area__toolbar-icon"], ["d", "M12.5 8c-2.65 0-5.05.99-6.9 2.6L2 7v9h9l-3.62-3.62c1.39-1.16 3.16-1.88 5.12-1.88 3.54 0 6.55 2.31 7.6 5.5l2.37-.78C21.08 11.03 17.15 8 12.5 8z"], ["type", "button", "aria-label", "Redo", "title", "Redo", "aria-keyshortcuts", "Control+Y", 1, "ccd-rich-text-area__toolbar-button", 3, "mousedown", "click"], ["d", "M18.4 10.6C16.55 8.99 14.15 8 11.5 8c-4.65 0-8.58 3.03-9.96 7.22L3.9 16c1.05-3.19 4.05-5.5 7.6-5.5 1.95 0 3.73.72 5.12 1.88L13 16h9V7l-3.6 3.6z"], ["aria-hidden", "true", 1, "ccd-rich-text-area__toolbar-separator"], ["type", "button", "aria-label", "Bold", "title", "Bold", "aria-keyshortcuts", "Control+B", 1, "ccd-rich-text-area__toolbar-button", "ccd-rich-text-area__toolbar-button--bold", 3, "mousedown", "click", "ngClass"], ["d", "M15.6 10.79c.97-.67 1.65-1.77 1.65-2.79 0-2.26-1.75-4-4-4H7v14h7.04c2.09 0 3.71-1.7 3.71-3.79 0-1.52-.86-2.82-2.15-3.42zM10 6.5h3c.83 0 1.5.67 1.5 1.5S13.83 9.5 13 9.5h-3v-3zm3.5 9H10v-3h3.5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5z"], ["type", "button", "aria-label", "Italic", "title", "Italic", "aria-keyshortcuts", "Control+I", 1, "ccd-rich-text-area__toolbar-button", "ccd-rich-text-area__toolbar-button--italic", 3, "mousedown", "click", "ngClass"], ["d", "M10 4v3h2.21l-3.42 8H6v3h8v-3h-2.21l3.42-8H18V4z"], ["type", "button", "aria-label", "Underline", "title", "Underline", "aria-keyshortcuts", "Control+U", 1, "ccd-rich-text-area__toolbar-button", "ccd-rich-text-area__toolbar-button--underline", 3, "mousedown", "click", "ngClass"], ["d", "M12 17c3.31 0 6-2.69 6-6V3h-2.5v8c0 1.93-1.57 3.5-3.5 3.5S8.5 12.93 8.5 11V3H6v8c0 3.31 2.69 6 6 6zm-7 2v2h14v-2H5z"], ["type", "button", "aria-label", "Paragraph", "title", "Paragraph", 1, "ccd-rich-text-area__toolbar-button", "ccd-rich-text-area__toolbar-button--paragraph", 3, "mousedown", "click", "ngClass"], ["aria-hidden", "true", 1, "ccd-rich-text-area__toolbar-icon", "ccd-rich-text-area__toolbar-icon--paragraph"], ["type", "button", "aria-label", "Bullet List", "title", "Bullet List", 1, "ccd-rich-text-area__toolbar-button", 3, "mousedown", "click", "ngClass"], ["d", "M4 10.5c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zm0-6C3.17 4.5 2.5 5.17 2.5 6S3.17 7.5 4 7.5 5.5 6.83 5.5 6 4.83 4.5 4 4.5zm0 12c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zM7 13h14v-2H7v2zm0 6h14v-2H7v2zM7 5v2h14V5H7z"], ["type", "button", "aria-label", "Numbered List", "title", "Numbered List", 1, "ccd-rich-text-area__toolbar-button", 3, "mousedown", "click", "ngClass"], ["d", "M2 17h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1 3h1.8L2 13.1V14h3v-1H3.2L5 10.9V10H2v1zm5-6v2h14V5H7zm0 14h14v-2H7v2zm0-6h14v-2H7v2z"], [1, "ccd-rich-text-area__list-style"], [1, "ccd-rich-text-area__list-style-label", 3, "for"], [1, "ccd-rich-text-area__list-style-select", 3, "change", "id", "value"], ["value", ""], ["value", "ordered_list"], ["value", "ordered_alpha"], ["value", "ordered_roman"], ["type", "button", "aria-label", "Decrease Indent", "title", "Decrease Indent", 1, "ccd-rich-text-area__toolbar-button", 3, "mousedown", "click"], ["d", "M11 17h10v-2H11v2zm-8-5 4 4V8l-4 4zm0 9h18v-2H3v2zM3 3v2h18V3H3zm8 6h10V7H11v2zm0 4h10v-2H11v2z"], ["type", "button", "aria-label", "Increase Indent", "title", "Increase Indent", 1, "ccd-rich-text-area__toolbar-button", 3, "mousedown", "click"], ["d", "M3 21h18v-2H3v2zM3 8v8l4-4-4-4zm8 9h10v-2H11v2zM3 3v2h18V3H3zm8 6h10V7H11v2zm0 4h10v-2H11v2z"], [1, "NgxEditor__Wrapper"], ["outputFormat", "html", 3, "focusIn", "focusOut", "editor", "formControl"], [1, "form-label"], [1, "form-hint", 3, "id"], [1, "error-message", 3, "id"]], template: function WriteRichTextAreaFieldComponent_Template(rf, ctx) { if (rf & 1) {
|
|
27195
27683
|
const _r1 = i0.ɵɵgetCurrentView();
|
|
27196
27684
|
i0.ɵɵelementStart(0, "div", 1)(1, "div", 2);
|
|
27197
27685
|
i0.ɵɵtemplate(2, WriteRichTextAreaFieldComponent_span_2_Template, 3, 3, "span", 3);
|
|
@@ -27201,80 +27689,97 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
27201
27689
|
i0.ɵɵlistener("click", function WriteRichTextAreaFieldComponent_Template_div_click_5_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.syncAccessibilityLater()); })("keydown", function WriteRichTextAreaFieldComponent_Template_div_keydown_5_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onEditorKeyDown($event)); })("keyup", function WriteRichTextAreaFieldComponent_Template_div_keyup_5_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.syncAccessibilityLater()); })("paste", function WriteRichTextAreaFieldComponent_Template_div_paste_5_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onPaste($event)); });
|
|
27202
27690
|
i0.ɵɵelementStart(7, "div", 7)(8, "button", 8);
|
|
27203
27691
|
i0.ɵɵlistener("mousedown", function WriteRichTextAreaFieldComponent_Template_button_mousedown_8_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onToolbarButtonMouseDown($event)); })("click", function WriteRichTextAreaFieldComponent_Template_button_click_8_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.executeToolbarCommand($event, "undo")); });
|
|
27204
|
-
i0.ɵɵ
|
|
27205
|
-
i0.ɵɵ
|
|
27692
|
+
i0.ɵɵnamespaceSVG();
|
|
27693
|
+
i0.ɵɵelementStart(9, "svg", 9);
|
|
27694
|
+
i0.ɵɵelement(10, "path", 10);
|
|
27206
27695
|
i0.ɵɵelementEnd()();
|
|
27207
|
-
i0.ɵɵ
|
|
27696
|
+
i0.ɵɵnamespaceHTML();
|
|
27697
|
+
i0.ɵɵelementStart(11, "button", 11);
|
|
27208
27698
|
i0.ɵɵlistener("mousedown", function WriteRichTextAreaFieldComponent_Template_button_mousedown_11_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onToolbarButtonMouseDown($event)); })("click", function WriteRichTextAreaFieldComponent_Template_button_click_11_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.executeToolbarCommand($event, "redo")); });
|
|
27209
|
-
i0.ɵɵ
|
|
27210
|
-
i0.ɵɵ
|
|
27699
|
+
i0.ɵɵnamespaceSVG();
|
|
27700
|
+
i0.ɵɵelementStart(12, "svg", 9);
|
|
27701
|
+
i0.ɵɵelement(13, "path", 12);
|
|
27211
27702
|
i0.ɵɵelementEnd()();
|
|
27212
|
-
i0.ɵɵ
|
|
27213
|
-
i0.ɵɵ
|
|
27703
|
+
i0.ɵɵnamespaceHTML();
|
|
27704
|
+
i0.ɵɵelement(14, "span", 13);
|
|
27705
|
+
i0.ɵɵelementStart(15, "button", 14);
|
|
27214
27706
|
i0.ɵɵlistener("mousedown", function WriteRichTextAreaFieldComponent_Template_button_mousedown_15_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onToolbarButtonMouseDown($event)); })("click", function WriteRichTextAreaFieldComponent_Template_button_click_15_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.executeToolbarCommand($event, "bold")); });
|
|
27215
|
-
i0.ɵɵ
|
|
27216
|
-
i0.ɵɵ
|
|
27707
|
+
i0.ɵɵnamespaceSVG();
|
|
27708
|
+
i0.ɵɵelementStart(16, "svg", 9);
|
|
27709
|
+
i0.ɵɵelement(17, "path", 15);
|
|
27217
27710
|
i0.ɵɵelementEnd()();
|
|
27218
|
-
i0.ɵɵ
|
|
27711
|
+
i0.ɵɵnamespaceHTML();
|
|
27712
|
+
i0.ɵɵelementStart(18, "button", 16);
|
|
27219
27713
|
i0.ɵɵlistener("mousedown", function WriteRichTextAreaFieldComponent_Template_button_mousedown_18_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onToolbarButtonMouseDown($event)); })("click", function WriteRichTextAreaFieldComponent_Template_button_click_18_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.executeToolbarCommand($event, "italic")); });
|
|
27220
|
-
i0.ɵɵ
|
|
27221
|
-
i0.ɵɵ
|
|
27714
|
+
i0.ɵɵnamespaceSVG();
|
|
27715
|
+
i0.ɵɵelementStart(19, "svg", 9);
|
|
27716
|
+
i0.ɵɵelement(20, "path", 17);
|
|
27222
27717
|
i0.ɵɵelementEnd()();
|
|
27223
|
-
i0.ɵɵ
|
|
27718
|
+
i0.ɵɵnamespaceHTML();
|
|
27719
|
+
i0.ɵɵelementStart(21, "button", 18);
|
|
27224
27720
|
i0.ɵɵlistener("mousedown", function WriteRichTextAreaFieldComponent_Template_button_mousedown_21_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onToolbarButtonMouseDown($event)); })("click", function WriteRichTextAreaFieldComponent_Template_button_click_21_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.executeToolbarCommand($event, "underline")); });
|
|
27225
|
-
i0.ɵɵ
|
|
27226
|
-
i0.ɵɵ
|
|
27721
|
+
i0.ɵɵnamespaceSVG();
|
|
27722
|
+
i0.ɵɵelementStart(22, "svg", 9);
|
|
27723
|
+
i0.ɵɵelement(23, "path", 19);
|
|
27227
27724
|
i0.ɵɵelementEnd()();
|
|
27228
|
-
i0.ɵɵ
|
|
27725
|
+
i0.ɵɵnamespaceHTML();
|
|
27726
|
+
i0.ɵɵelementStart(24, "button", 20);
|
|
27229
27727
|
i0.ɵɵlistener("mousedown", function WriteRichTextAreaFieldComponent_Template_button_mousedown_24_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onToolbarButtonMouseDown($event)); })("click", function WriteRichTextAreaFieldComponent_Template_button_click_24_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.executeToolbarCommand($event, "paragraph")); });
|
|
27230
|
-
i0.ɵɵelementStart(25, "span",
|
|
27728
|
+
i0.ɵɵelementStart(25, "span", 21);
|
|
27231
27729
|
i0.ɵɵtext(26, "P");
|
|
27232
27730
|
i0.ɵɵelementEnd()();
|
|
27233
|
-
i0.ɵɵ
|
|
27234
|
-
i0.ɵɵ
|
|
27235
|
-
i0.ɵɵ
|
|
27236
|
-
i0.ɵɵ
|
|
27237
|
-
i0.ɵɵ
|
|
27238
|
-
i0.ɵɵelement(
|
|
27239
|
-
i0.ɵɵ
|
|
27240
|
-
i0.ɵɵ
|
|
27241
|
-
i0.ɵɵ
|
|
27242
|
-
i0.ɵɵ
|
|
27243
|
-
i0.ɵɵ
|
|
27244
|
-
i0.ɵɵ
|
|
27245
|
-
i0.ɵɵ
|
|
27246
|
-
i0.ɵɵelement(37, "span", 24);
|
|
27731
|
+
i0.ɵɵelement(27, "span", 13);
|
|
27732
|
+
i0.ɵɵelementStart(28, "button", 22);
|
|
27733
|
+
i0.ɵɵlistener("mousedown", function WriteRichTextAreaFieldComponent_Template_button_mousedown_28_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onToolbarButtonMouseDown($event)); })("click", function WriteRichTextAreaFieldComponent_Template_button_click_28_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.executeToolbarCommand($event, "bullet_list")); });
|
|
27734
|
+
i0.ɵɵnamespaceSVG();
|
|
27735
|
+
i0.ɵɵelementStart(29, "svg", 9);
|
|
27736
|
+
i0.ɵɵelement(30, "path", 23);
|
|
27737
|
+
i0.ɵɵelementEnd()();
|
|
27738
|
+
i0.ɵɵnamespaceHTML();
|
|
27739
|
+
i0.ɵɵelementStart(31, "button", 24);
|
|
27740
|
+
i0.ɵɵlistener("mousedown", function WriteRichTextAreaFieldComponent_Template_button_mousedown_31_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onToolbarButtonMouseDown($event)); })("click", function WriteRichTextAreaFieldComponent_Template_button_click_31_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.executeToolbarCommand($event, "ordered_list")); });
|
|
27741
|
+
i0.ɵɵnamespaceSVG();
|
|
27742
|
+
i0.ɵɵelementStart(32, "svg", 9);
|
|
27743
|
+
i0.ɵɵelement(33, "path", 25);
|
|
27247
27744
|
i0.ɵɵelementEnd()();
|
|
27248
|
-
i0.ɵɵ
|
|
27249
|
-
i0.ɵɵ
|
|
27250
|
-
i0.ɵɵ
|
|
27251
|
-
i0.ɵɵtext(41, "\u2022");
|
|
27745
|
+
i0.ɵɵnamespaceHTML();
|
|
27746
|
+
i0.ɵɵelementStart(34, "div", 26)(35, "label", 27);
|
|
27747
|
+
i0.ɵɵtext(36, "List style");
|
|
27252
27748
|
i0.ɵɵelementEnd();
|
|
27253
|
-
i0.ɵɵ
|
|
27254
|
-
i0.ɵɵ
|
|
27255
|
-
i0.ɵɵ
|
|
27749
|
+
i0.ɵɵelementStart(37, "select", 28);
|
|
27750
|
+
i0.ɵɵlistener("change", function WriteRichTextAreaFieldComponent_Template_select_change_37_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onListStyleChange($event)); });
|
|
27751
|
+
i0.ɵɵelementStart(38, "option", 29);
|
|
27752
|
+
i0.ɵɵtext(39, "No list");
|
|
27256
27753
|
i0.ɵɵelementEnd();
|
|
27257
|
-
i0.ɵɵ
|
|
27258
|
-
i0.ɵɵ
|
|
27259
|
-
i0.ɵɵtext(47, "\u2022");
|
|
27754
|
+
i0.ɵɵelementStart(40, "option", 30);
|
|
27755
|
+
i0.ɵɵtext(41, "Numbers (1, 2, 3)");
|
|
27260
27756
|
i0.ɵɵelementEnd();
|
|
27261
|
-
i0.ɵɵ
|
|
27262
|
-
i0.ɵɵ
|
|
27263
|
-
i0.ɵɵ
|
|
27264
|
-
i0.ɵɵ
|
|
27265
|
-
i0.ɵɵ
|
|
27266
|
-
i0.ɵɵ
|
|
27757
|
+
i0.ɵɵelementStart(42, "option", 31);
|
|
27758
|
+
i0.ɵɵtext(43, "Letters (a, b, c)");
|
|
27759
|
+
i0.ɵɵelementEnd();
|
|
27760
|
+
i0.ɵɵelementStart(44, "option", 32);
|
|
27761
|
+
i0.ɵɵtext(45, "Roman numerals (i), (ii), (iii)");
|
|
27762
|
+
i0.ɵɵelementEnd()()();
|
|
27763
|
+
i0.ɵɵelement(46, "span", 13);
|
|
27764
|
+
i0.ɵɵelementStart(47, "button", 33);
|
|
27765
|
+
i0.ɵɵlistener("mousedown", function WriteRichTextAreaFieldComponent_Template_button_mousedown_47_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onToolbarButtonMouseDown($event)); })("click", function WriteRichTextAreaFieldComponent_Template_button_click_47_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.executeToolbarCommand($event, "outdent")); });
|
|
27766
|
+
i0.ɵɵnamespaceSVG();
|
|
27767
|
+
i0.ɵɵelementStart(48, "svg", 9);
|
|
27768
|
+
i0.ɵɵelement(49, "path", 34);
|
|
27267
27769
|
i0.ɵɵelementEnd()();
|
|
27268
|
-
i0.ɵɵ
|
|
27269
|
-
i0.ɵɵ
|
|
27270
|
-
i0.ɵɵ
|
|
27271
|
-
i0.ɵɵ
|
|
27770
|
+
i0.ɵɵnamespaceHTML();
|
|
27771
|
+
i0.ɵɵelementStart(50, "button", 35);
|
|
27772
|
+
i0.ɵɵlistener("mousedown", function WriteRichTextAreaFieldComponent_Template_button_mousedown_50_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onToolbarButtonMouseDown($event)); })("click", function WriteRichTextAreaFieldComponent_Template_button_click_50_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.executeToolbarCommand($event, "indent")); });
|
|
27773
|
+
i0.ɵɵnamespaceSVG();
|
|
27774
|
+
i0.ɵɵelementStart(51, "svg", 9);
|
|
27775
|
+
i0.ɵɵelement(52, "path", 36);
|
|
27272
27776
|
i0.ɵɵelementEnd()()();
|
|
27273
|
-
i0.ɵɵ
|
|
27274
|
-
i0.ɵɵ
|
|
27777
|
+
i0.ɵɵnamespaceHTML();
|
|
27778
|
+
i0.ɵɵelementStart(53, "div", 37)(54, "ngx-editor", 38);
|
|
27779
|
+
i0.ɵɵlistener("focusIn", function WriteRichTextAreaFieldComponent_Template_ngx_editor_focusIn_54_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.syncAccessibilityLater()); })("focusOut", function WriteRichTextAreaFieldComponent_Template_ngx_editor_focusOut_54_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onEditorFocusOut()); });
|
|
27275
27780
|
i0.ɵɵelementEnd()()()();
|
|
27276
27781
|
} if (rf & 2) {
|
|
27277
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(
|
|
27782
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(24, _c1$e, !ctx.richTextAreaControl.valid && ctx.richTextAreaControl.dirty));
|
|
27278
27783
|
i0.ɵɵadvance();
|
|
27279
27784
|
i0.ɵɵproperty("id", ctx.labelId());
|
|
27280
27785
|
i0.ɵɵadvance();
|
|
@@ -27284,39 +27789,43 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
|
|
|
27284
27789
|
i0.ɵɵadvance();
|
|
27285
27790
|
i0.ɵɵproperty("ngIf", ctx.isInvalid());
|
|
27286
27791
|
i0.ɵɵadvance();
|
|
27287
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(
|
|
27792
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(26, _c2$3, ctx.isInvalid()));
|
|
27288
27793
|
i0.ɵɵadvance(2);
|
|
27289
27794
|
i0.ɵɵattribute("aria-label", ctx.toolbarLabel());
|
|
27290
27795
|
i0.ɵɵadvance(8);
|
|
27291
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(
|
|
27796
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(28, _c3, ctx.isToolbarCommandActive("bold")));
|
|
27292
27797
|
i0.ɵɵattribute("aria-pressed", ctx.isToolbarCommandActive("bold"));
|
|
27293
27798
|
i0.ɵɵadvance(3);
|
|
27294
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(
|
|
27799
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(30, _c3, ctx.isToolbarCommandActive("italic")));
|
|
27295
27800
|
i0.ɵɵattribute("aria-pressed", ctx.isToolbarCommandActive("italic"));
|
|
27296
27801
|
i0.ɵɵadvance(3);
|
|
27297
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(
|
|
27802
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(32, _c3, ctx.isToolbarCommandActive("underline")));
|
|
27298
27803
|
i0.ɵɵattribute("aria-pressed", ctx.isToolbarCommandActive("underline"));
|
|
27299
27804
|
i0.ɵɵadvance(3);
|
|
27300
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(
|
|
27805
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(34, _c3, ctx.isToolbarCommandActive("paragraph")));
|
|
27301
27806
|
i0.ɵɵattribute("aria-pressed", ctx.isToolbarCommandActive("paragraph"));
|
|
27302
|
-
i0.ɵɵadvance(
|
|
27303
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(
|
|
27304
|
-
i0.ɵɵattribute("aria-pressed", ctx.isToolbarCommandActive("ordered_list"));
|
|
27305
|
-
i0.ɵɵadvance(11);
|
|
27306
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(35, _c3, ctx.isToolbarCommandActive("bullet_list")));
|
|
27807
|
+
i0.ɵɵadvance(4);
|
|
27808
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(36, _c3, ctx.isToolbarCommandActive("bullet_list")));
|
|
27307
27809
|
i0.ɵɵattribute("aria-pressed", ctx.isToolbarCommandActive("bullet_list"));
|
|
27308
|
-
i0.ɵɵadvance(
|
|
27810
|
+
i0.ɵɵadvance(3);
|
|
27811
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(38, _c3, ctx.currentListStyle() === "ordered_list"));
|
|
27812
|
+
i0.ɵɵattribute("aria-pressed", ctx.currentListStyle() === "ordered_list");
|
|
27813
|
+
i0.ɵɵadvance(4);
|
|
27814
|
+
i0.ɵɵproperty("for", ctx.listStyleId());
|
|
27815
|
+
i0.ɵɵadvance(2);
|
|
27816
|
+
i0.ɵɵproperty("id", ctx.listStyleId())("value", ctx.currentListSelectValue());
|
|
27817
|
+
i0.ɵɵadvance(17);
|
|
27309
27818
|
i0.ɵɵproperty("editor", ctx.editor)("formControl", ctx.richTextAreaControl);
|
|
27310
|
-
} }, dependencies: [i5.NgClass, i5.NgIf, i4.NgControlStatus, i4.FormControlDirective, i3$1.NgxEditorComponent, FieldLabelPipe, FirstErrorPipe, i1.RpxTranslatePipe], styles: [".ccd-rich-text-area{margin-bottom:30px}.ccd-rich-text-area__editor{max-width:100%}.ccd-rich-text-area__toolbar{align-items:center;display:flex;flex-wrap:wrap;gap:
|
|
27819
|
+
} }, dependencies: [i5.NgClass, i5.NgIf, i4.NgSelectOption, i4.ɵNgSelectMultipleOption, i4.NgControlStatus, i4.FormControlDirective, i3$1.NgxEditorComponent, FieldLabelPipe, FirstErrorPipe, i1.RpxTranslatePipe], styles: [".ccd-rich-text-area{margin-bottom:30px}.ccd-rich-text-area__editor{max-width:100%}.ccd-rich-text-area__toolbar{align-items:center;background:#fff;border:1px solid #d8dde0;border-radius:6px;display:flex;flex-wrap:wrap;gap:2px;margin-bottom:10px;padding:6px 8px;width:fit-content}.ccd-rich-text-area .NgxEditor__Wrapper{border:1px solid #000;border-radius:0;max-width:100%;width:100%}.ccd-rich-text-area .NgxEditor__Wrapper:focus-within{outline:3px solid #ffdd00;outline-offset:0}.ccd-rich-text-area__toolbar-button{background:#fff;align-items:center;border:0;border-radius:2px;color:#0b0c0c;display:inline-flex;font-family:inherit;font-size:18px;font-weight:700;height:28px;justify-content:center;min-width:28px;padding:4px;width:28px}.ccd-rich-text-area__toolbar-button:hover{background:#f3f2f1}.ccd-rich-text-area__toolbar-button:focus{background:#fd0;box-shadow:0 0 0 2px #0b0c0c;outline:2px solid #ffdd00;outline-offset:0}.ccd-rich-text-area__toolbar-button--active{background:#1d70b8;color:#fff}.ccd-rich-text-area__toolbar-button--italic{font-style:italic}.ccd-rich-text-area__toolbar-button--underline{text-decoration:underline}.ccd-rich-text-area__toolbar-separator{border-left:1px solid #b1b4b6;height:24px;margin:0 5px 0 3px}.ccd-rich-text-area__list-style{align-items:center;display:inline-flex;gap:8px;margin:0 4px}.ccd-rich-text-area__list-style-label{font-weight:700;white-space:nowrap}.ccd-rich-text-area__list-style-select{background-color:#fff;border:1px solid #0b0c0c;border-radius:0;color:#0b0c0c;font-family:inherit;font-size:16px;height:32px;min-width:190px;padding:2px 28px 2px 8px}.ccd-rich-text-area__list-style-select:focus{box-shadow:0 0 0 2px #0b0c0c;outline:3px solid #ffdd00;outline-offset:0}.ccd-rich-text-area__toolbar-icon{display:block;fill:currentColor;height:20px;width:20px}.ccd-rich-text-area__toolbar-icon--paragraph{display:inline-flex;font-size:18px;line-height:1;width:auto}.ccd-rich-text-area .NgxEditor__Wrapper .NgxEditor{border:0;border-radius:0;height:255px;min-height:255px;overflow:hidden;width:100%}.ccd-rich-text-area__editor--error .NgxEditor__Wrapper{border-color:#d4351c}.ccd-rich-text-area .NgxEditor__Content{box-sizing:border-box;height:255px;min-height:255px;overflow-x:hidden;overflow-y:auto;padding:12px 14px}.ccd-rich-text-area .ProseMirror{min-height:231px;outline:0;overflow-wrap:anywhere;white-space:pre-wrap;word-break:normal}.ccd-rich-text-area .ProseMirror [data-indent=\"1\"]{margin-left:40px}.ccd-rich-text-area .ProseMirror [data-indent=\"2\"]{margin-left:80px}.ccd-rich-text-area .ProseMirror [data-indent=\"3\"]{margin-left:120px}.ccd-rich-text-area .ProseMirror [data-indent=\"4\"]{margin-left:160px}.ccd-rich-text-area .ProseMirror [data-indent=\"5\"]{margin-left:200px}.ccd-rich-text-area .ProseMirror [data-indent=\"6\"]{margin-left:240px}.ccd-rich-text-area .ProseMirror strong,.ccd-rich-text-area .ProseMirror strong *,.ccd-rich-text-area .ProseMirror b,.ccd-rich-text-area .ProseMirror b *{font-weight:700}.ccd-rich-text-area .ProseMirror strong u,.ccd-rich-text-area .ProseMirror u strong,.ccd-rich-text-area .ProseMirror b u,.ccd-rich-text-area .ProseMirror u b{font-weight:700!important;text-decoration:underline}.ccd-rich-text-area .ProseMirror:focus{box-shadow:none;outline:0}.ccd-rich-text-area .ProseMirror p,.ccd-rich-text-area .ProseMirror ul,.ccd-rich-text-area .ProseMirror ol{margin-top:0;overflow-wrap:anywhere;word-break:normal}.ccd-rich-text-area .ProseMirror ul{list-style:disc outside;padding-left:25px}.ccd-rich-text-area .ProseMirror ol{list-style:decimal outside;padding-left:25px}.ccd-rich-text-area .ProseMirror ol[type=a]{list-style-type:lower-alpha}.ccd-rich-text-area .ProseMirror ol[type=i]{list-style-type:lower-roman}.ccd-rich-text-area .ProseMirror ol[type=i]>li::marker{content:\"(\" counter(list-item,lower-roman) \") \"}.ccd-rich-text-area .ProseMirror li{display:list-item;margin-bottom:5px}.ccd-rich-text-area .ProseMirror li>p{margin:0}\n"], encapsulation: 2 });
|
|
27311
27820
|
}
|
|
27312
27821
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(WriteRichTextAreaFieldComponent, [{
|
|
27313
27822
|
type: Component,
|
|
27314
|
-
args: [{ selector: 'ccd-write-rich-text-area-field', encapsulation: ViewEncapsulation.None, standalone: false, template: "<div class=\"form-group ccd-rich-text-area\" [ngClass]=\"{'form-group-error': !richTextAreaControl.valid && richTextAreaControl.dirty}\">\n <div [id]=\"labelId()\">\n <span class=\"form-label\" *ngIf=\"caseField.label\">{{caseField | ccdFieldLabel}}</span>\n </div>\n <span [id]=\"hintId()\" class=\"form-hint\" *ngIf=\"caseField.hint_text\">{{caseField.hint_text | rpxTranslate}}</span>\n <span [id]=\"errorId()\" class=\"error-message\" *ngIf=\"isInvalid()\">\n {{richTextAreaControl.errors | ccdFirstError:caseField.label}}\n </span>\n\n <div\n #editorHost\n class=\"ccd-rich-text-area__editor\"\n [ngClass]=\"{'ccd-rich-text-area__editor--error': isInvalid()}\"\n (click)=\"syncAccessibilityLater()\"\n (keydown)=\"onEditorKeyDown($event)\"\n (keyup)=\"syncAccessibilityLater()\"\n (paste)=\"onPaste($event)\">\n <div\n class=\"ccd-rich-text-area__toolbar\"\n role=\"toolbar\"\n [attr.aria-label]=\"toolbarLabel()\">\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button\"\n aria-label=\"Undo\"\n title=\"Undo\"\n aria-keyshortcuts=\"Control+Z\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'undo')\">\n <span class=\"ccd-rich-text-area__toolbar-icon ccd-rich-text-area__toolbar-icon--undo\" aria-hidden=\"true\">↶</span>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button\"\n aria-label=\"Redo\"\n title=\"Redo\"\n aria-keyshortcuts=\"Control+Y\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'redo')\">\n <span class=\"ccd-rich-text-area__toolbar-icon ccd-rich-text-area__toolbar-icon--redo\" aria-hidden=\"true\">↷</span>\n </button>\n <span class=\"ccd-rich-text-area__toolbar-separator\" aria-hidden=\"true\"></span>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button ccd-rich-text-area__toolbar-button--bold\"\n [ngClass]=\"{'ccd-rich-text-area__toolbar-button--active': isToolbarCommandActive('bold')}\"\n [attr.aria-pressed]=\"isToolbarCommandActive('bold')\"\n aria-label=\"Bold\"\n title=\"Bold\"\n aria-keyshortcuts=\"Control+B\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'bold')\">\n <span class=\"ccd-rich-text-area__toolbar-icon ccd-rich-text-area__toolbar-icon--bold\" aria-hidden=\"true\">B</span>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button ccd-rich-text-area__toolbar-button--italic\"\n [ngClass]=\"{'ccd-rich-text-area__toolbar-button--active': isToolbarCommandActive('italic')}\"\n [attr.aria-pressed]=\"isToolbarCommandActive('italic')\"\n aria-label=\"Italic\"\n title=\"Italic\"\n aria-keyshortcuts=\"Control+I\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'italic')\">\n <span class=\"ccd-rich-text-area__toolbar-icon ccd-rich-text-area__toolbar-icon--italic\" aria-hidden=\"true\">I</span>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button ccd-rich-text-area__toolbar-button--underline\"\n [ngClass]=\"{'ccd-rich-text-area__toolbar-button--active': isToolbarCommandActive('underline')}\"\n [attr.aria-pressed]=\"isToolbarCommandActive('underline')\"\n aria-label=\"Underline\"\n title=\"Underline\"\n aria-keyshortcuts=\"Control+U\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'underline')\">\n <span class=\"ccd-rich-text-area__toolbar-icon ccd-rich-text-area__toolbar-icon--underline\" aria-hidden=\"true\">U</span>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button ccd-rich-text-area__toolbar-button--paragraph\"\n [ngClass]=\"{'ccd-rich-text-area__toolbar-button--active': isToolbarCommandActive('paragraph')}\"\n [attr.aria-pressed]=\"isToolbarCommandActive('paragraph')\"\n aria-label=\"Paragraph\"\n title=\"Paragraph\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'paragraph')\">\n <span class=\"ccd-rich-text-area__toolbar-icon ccd-rich-text-area__toolbar-icon--paragraph\" aria-hidden=\"true\">P</span>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button\"\n [ngClass]=\"{'ccd-rich-text-area__toolbar-button--active': isToolbarCommandActive('ordered_list')}\"\n [attr.aria-pressed]=\"isToolbarCommandActive('ordered_list')\"\n aria-label=\"Ordered List\"\n title=\"Ordered List\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'ordered_list')\">\n <span class=\"ccd-rich-text-area__list-icon ccd-rich-text-area__list-icon--ordered\" aria-hidden=\"true\">\n <span class=\"ccd-rich-text-area__list-marker\">1</span>\n <span class=\"ccd-rich-text-area__list-line\"></span>\n <span class=\"ccd-rich-text-area__list-marker\">2</span>\n <span class=\"ccd-rich-text-area__list-line\"></span>\n <span class=\"ccd-rich-text-area__list-marker\">3</span>\n <span class=\"ccd-rich-text-area__list-line\"></span>\n </span>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button\"\n [ngClass]=\"{'ccd-rich-text-area__toolbar-button--active': isToolbarCommandActive('bullet_list')}\"\n [attr.aria-pressed]=\"isToolbarCommandActive('bullet_list')\"\n aria-label=\"Bullet List\"\n title=\"Bullet List\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'bullet_list')\">\n <span class=\"ccd-rich-text-area__list-icon ccd-rich-text-area__list-icon--bullet\" aria-hidden=\"true\">\n <span class=\"ccd-rich-text-area__list-marker\">•</span>\n <span class=\"ccd-rich-text-area__list-line\"></span>\n <span class=\"ccd-rich-text-area__list-marker\">•</span>\n <span class=\"ccd-rich-text-area__list-line\"></span>\n <span class=\"ccd-rich-text-area__list-marker\">•</span>\n <span class=\"ccd-rich-text-area__list-line\"></span>\n </span>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button\"\n aria-label=\"Decrease Indent\"\n title=\"Decrease Indent\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'outdent')\">\n <span class=\"ccd-rich-text-area__indent-icon ccd-rich-text-area__indent-icon--outdent\" aria-hidden=\"true\">\n <span class=\"ccd-rich-text-area__indent-line ccd-rich-text-area__indent-line--top\"></span>\n <span class=\"ccd-rich-text-area__indent-line ccd-rich-text-area__indent-line--middle\"></span>\n <span class=\"ccd-rich-text-area__indent-line ccd-rich-text-area__indent-line--bottom\"></span>\n <span class=\"ccd-rich-text-area__indent-arrow\"></span>\n </span>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button\"\n aria-label=\"Increase Indent\"\n title=\"Increase Indent\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'indent')\">\n <span class=\"ccd-rich-text-area__indent-icon ccd-rich-text-area__indent-icon--indent\" aria-hidden=\"true\">\n <span class=\"ccd-rich-text-area__indent-line ccd-rich-text-area__indent-line--top\"></span>\n <span class=\"ccd-rich-text-area__indent-line ccd-rich-text-area__indent-line--middle\"></span>\n <span class=\"ccd-rich-text-area__indent-line ccd-rich-text-area__indent-line--bottom\"></span>\n <span class=\"ccd-rich-text-area__indent-arrow\"></span>\n </span>\n </button>\n </div>\n\n <div class=\"NgxEditor__Wrapper\">\n <ngx-editor\n [editor]=\"editor\"\n [formControl]=\"richTextAreaControl\"\n outputFormat=\"html\"\n (focusIn)=\"syncAccessibilityLater()\"\n (focusOut)=\"onEditorFocusOut()\">\n </ngx-editor>\n </div>\n </div>\n</div>\n", styles: [".ccd-rich-text-area{margin-bottom:30px}.ccd-rich-text-area__editor{max-width:100%}.ccd-rich-text-area__toolbar{align-items:center;display:flex;flex-wrap:wrap;gap:0 4px;margin-bottom:6px}.ccd-rich-text-area .NgxEditor__Wrapper{border:1px solid #000;border-radius:0;max-width:100%;width:100%}.ccd-rich-text-area .NgxEditor__Wrapper:focus-within{outline:3px solid #ffdd00;outline-offset:0}.ccd-rich-text-area__toolbar-button{background:#fff;align-items:center;border:1px solid #0b0c0c;border-radius:0;color:#0b0c0c;display:inline-flex;font-family:inherit;font-size:18px;font-weight:700;height:36px;justify-content:center;min-width:36px;padding:4px;width:36px}.ccd-rich-text-area__toolbar-button:hover{background:#f3f2f1}.ccd-rich-text-area__toolbar-button:focus{background:#fd0;box-shadow:0 0 0 2px #0b0c0c;outline:3px solid #ffdd00;outline-offset:0}.ccd-rich-text-area__toolbar-button--active{background:#1d70b8;color:#fff}.ccd-rich-text-area__toolbar-button--italic{font-style:italic}.ccd-rich-text-area__toolbar-button--underline{text-decoration:underline}.ccd-rich-text-area__toolbar-separator{border-left:1px solid #b1b4b6;height:36px;margin:0 8px 0 6px}.ccd-rich-text-area__toolbar-icon{display:inline-flex;line-height:1}.ccd-rich-text-area__toolbar-icon--undo,.ccd-rich-text-area__toolbar-icon--redo{font-size:23px;font-weight:400;transform:translateY(-1px)}.ccd-rich-text-area__toolbar-icon--bold{font-size:18px}.ccd-rich-text-area__toolbar-icon--italic{color:inherit;font-size:18px;font-style:italic}.ccd-rich-text-area__toolbar-icon--underline{font-size:18px;text-decoration:underline;text-underline-offset:3px}.ccd-rich-text-area__toolbar-icon--paragraph{font-size:18px}.ccd-rich-text-area__list-icon{column-gap:2px;display:grid;grid-template-columns:8px 13px;grid-template-rows:repeat(3,5px);height:17px;width:23px}.ccd-rich-text-area__list-marker{align-self:center;font-size:9px;font-weight:700;line-height:1;text-align:right}.ccd-rich-text-area__list-icon--ordered .ccd-rich-text-area__list-marker:after{content:\".\"}.ccd-rich-text-area__list-icon--bullet .ccd-rich-text-area__list-marker{font-size:14px;line-height:.5}.ccd-rich-text-area__list-line{align-self:center;border-top:2px solid currentColor;display:block;width:12px}.ccd-rich-text-area__indent-icon{display:block;height:18px;position:relative;width:23px}.ccd-rich-text-area__indent-line{background:currentColor;display:block;height:2px;position:absolute;right:0}.ccd-rich-text-area__indent-line--top{top:3px;width:18px}.ccd-rich-text-area__indent-line--middle{top:8px;width:13px}.ccd-rich-text-area__indent-line--bottom{top:13px;width:18px}.ccd-rich-text-area__indent-arrow{background:currentColor;display:block;height:2px;left:1px;position:absolute;top:8px;width:9px}.ccd-rich-text-area__indent-arrow:before,.ccd-rich-text-area__indent-arrow:after{background:currentColor;content:\"\";display:block;height:2px;position:absolute;top:0;width:6px}.ccd-rich-text-area__indent-icon--outdent .ccd-rich-text-area__indent-arrow:before{left:-1px;transform:rotate(45deg);transform-origin:left center}.ccd-rich-text-area__indent-icon--outdent .ccd-rich-text-area__indent-arrow:after{left:-1px;transform:rotate(-45deg);transform-origin:left center}.ccd-rich-text-area__indent-icon--indent .ccd-rich-text-area__indent-arrow:before{right:-1px;transform:rotate(45deg);transform-origin:right center}.ccd-rich-text-area__indent-icon--indent .ccd-rich-text-area__indent-arrow:after{right:-1px;transform:rotate(-45deg);transform-origin:right center}.ccd-rich-text-area .NgxEditor__Wrapper .NgxEditor{border:0;border-radius:0;height:255px;min-height:255px;overflow:hidden;width:100%}.ccd-rich-text-area__editor--error .NgxEditor__Wrapper{border-color:#d4351c}.ccd-rich-text-area .NgxEditor__Content{box-sizing:border-box;height:255px;min-height:255px;overflow-x:hidden;overflow-y:auto;padding:12px 14px}.ccd-rich-text-area .ProseMirror{min-height:231px;outline:0;overflow-wrap:anywhere;white-space:pre-wrap;word-break:normal}.ccd-rich-text-area .ProseMirror [data-indent=\"1\"]{margin-left:40px}.ccd-rich-text-area .ProseMirror [data-indent=\"2\"]{margin-left:80px}.ccd-rich-text-area .ProseMirror [data-indent=\"3\"]{margin-left:120px}.ccd-rich-text-area .ProseMirror [data-indent=\"4\"]{margin-left:160px}.ccd-rich-text-area .ProseMirror [data-indent=\"5\"]{margin-left:200px}.ccd-rich-text-area .ProseMirror [data-indent=\"6\"]{margin-left:240px}.ccd-rich-text-area .ProseMirror strong,.ccd-rich-text-area .ProseMirror strong *,.ccd-rich-text-area .ProseMirror b,.ccd-rich-text-area .ProseMirror b *{font-weight:700}.ccd-rich-text-area .ProseMirror strong u,.ccd-rich-text-area .ProseMirror u strong,.ccd-rich-text-area .ProseMirror b u,.ccd-rich-text-area .ProseMirror u b{font-weight:700!important;text-decoration:underline}.ccd-rich-text-area .ProseMirror:focus{box-shadow:none;outline:0}.ccd-rich-text-area .ProseMirror p,.ccd-rich-text-area .ProseMirror ul,.ccd-rich-text-area .ProseMirror ol{margin-top:0;overflow-wrap:anywhere;word-break:normal}.ccd-rich-text-area .ProseMirror ul{list-style:disc outside;padding-left:25px}.ccd-rich-text-area .ProseMirror ol{list-style:decimal outside;padding-left:25px}.ccd-rich-text-area .ProseMirror li{display:list-item;margin-bottom:5px}.ccd-rich-text-area .ProseMirror li>p{margin:0}\n"] }]
|
|
27823
|
+
args: [{ selector: 'ccd-write-rich-text-area-field', encapsulation: ViewEncapsulation.None, standalone: false, template: "<div class=\"form-group ccd-rich-text-area\" [ngClass]=\"{'form-group-error': !richTextAreaControl.valid && richTextAreaControl.dirty}\">\n <div [id]=\"labelId()\">\n <span class=\"form-label\" *ngIf=\"caseField.label\">{{caseField | ccdFieldLabel}}</span>\n </div>\n <span [id]=\"hintId()\" class=\"form-hint\" *ngIf=\"caseField.hint_text\">{{caseField.hint_text | rpxTranslate}}</span>\n <span [id]=\"errorId()\" class=\"error-message\" *ngIf=\"isInvalid()\">\n {{richTextAreaControl.errors | ccdFirstError:caseField.label}}\n </span>\n\n <div\n #editorHost\n class=\"ccd-rich-text-area__editor\"\n [ngClass]=\"{'ccd-rich-text-area__editor--error': isInvalid()}\"\n (click)=\"syncAccessibilityLater()\"\n (keydown)=\"onEditorKeyDown($event)\"\n (keyup)=\"syncAccessibilityLater()\"\n (paste)=\"onPaste($event)\">\n <div\n class=\"ccd-rich-text-area__toolbar\"\n role=\"toolbar\"\n [attr.aria-label]=\"toolbarLabel()\">\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button\"\n aria-label=\"Undo\"\n title=\"Undo\"\n aria-keyshortcuts=\"Control+Z\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'undo')\">\n <svg class=\"ccd-rich-text-area__toolbar-icon\" viewBox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\">\n <path d=\"M12.5 8c-2.65 0-5.05.99-6.9 2.6L2 7v9h9l-3.62-3.62c1.39-1.16 3.16-1.88 5.12-1.88 3.54 0 6.55 2.31 7.6 5.5l2.37-.78C21.08 11.03 17.15 8 12.5 8z\"></path>\n </svg>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button\"\n aria-label=\"Redo\"\n title=\"Redo\"\n aria-keyshortcuts=\"Control+Y\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'redo')\">\n <svg class=\"ccd-rich-text-area__toolbar-icon\" viewBox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\">\n <path d=\"M18.4 10.6C16.55 8.99 14.15 8 11.5 8c-4.65 0-8.58 3.03-9.96 7.22L3.9 16c1.05-3.19 4.05-5.5 7.6-5.5 1.95 0 3.73.72 5.12 1.88L13 16h9V7l-3.6 3.6z\"></path>\n </svg>\n </button>\n <span class=\"ccd-rich-text-area__toolbar-separator\" aria-hidden=\"true\"></span>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button ccd-rich-text-area__toolbar-button--bold\"\n [ngClass]=\"{'ccd-rich-text-area__toolbar-button--active': isToolbarCommandActive('bold')}\"\n [attr.aria-pressed]=\"isToolbarCommandActive('bold')\"\n aria-label=\"Bold\"\n title=\"Bold\"\n aria-keyshortcuts=\"Control+B\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'bold')\">\n <svg class=\"ccd-rich-text-area__toolbar-icon\" viewBox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\">\n <path d=\"M15.6 10.79c.97-.67 1.65-1.77 1.65-2.79 0-2.26-1.75-4-4-4H7v14h7.04c2.09 0 3.71-1.7 3.71-3.79 0-1.52-.86-2.82-2.15-3.42zM10 6.5h3c.83 0 1.5.67 1.5 1.5S13.83 9.5 13 9.5h-3v-3zm3.5 9H10v-3h3.5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5z\"></path>\n </svg>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button ccd-rich-text-area__toolbar-button--italic\"\n [ngClass]=\"{'ccd-rich-text-area__toolbar-button--active': isToolbarCommandActive('italic')}\"\n [attr.aria-pressed]=\"isToolbarCommandActive('italic')\"\n aria-label=\"Italic\"\n title=\"Italic\"\n aria-keyshortcuts=\"Control+I\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'italic')\">\n <svg class=\"ccd-rich-text-area__toolbar-icon\" viewBox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\">\n <path d=\"M10 4v3h2.21l-3.42 8H6v3h8v-3h-2.21l3.42-8H18V4z\"></path>\n </svg>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button ccd-rich-text-area__toolbar-button--underline\"\n [ngClass]=\"{'ccd-rich-text-area__toolbar-button--active': isToolbarCommandActive('underline')}\"\n [attr.aria-pressed]=\"isToolbarCommandActive('underline')\"\n aria-label=\"Underline\"\n title=\"Underline\"\n aria-keyshortcuts=\"Control+U\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'underline')\">\n <svg class=\"ccd-rich-text-area__toolbar-icon\" viewBox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\">\n <path d=\"M12 17c3.31 0 6-2.69 6-6V3h-2.5v8c0 1.93-1.57 3.5-3.5 3.5S8.5 12.93 8.5 11V3H6v8c0 3.31 2.69 6 6 6zm-7 2v2h14v-2H5z\"></path>\n </svg>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button ccd-rich-text-area__toolbar-button--paragraph\"\n [ngClass]=\"{'ccd-rich-text-area__toolbar-button--active': isToolbarCommandActive('paragraph')}\"\n [attr.aria-pressed]=\"isToolbarCommandActive('paragraph')\"\n aria-label=\"Paragraph\"\n title=\"Paragraph\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'paragraph')\">\n <span class=\"ccd-rich-text-area__toolbar-icon ccd-rich-text-area__toolbar-icon--paragraph\" aria-hidden=\"true\">P</span>\n </button>\n <span class=\"ccd-rich-text-area__toolbar-separator\" aria-hidden=\"true\"></span>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button\"\n [ngClass]=\"{'ccd-rich-text-area__toolbar-button--active': isToolbarCommandActive('bullet_list')}\"\n [attr.aria-pressed]=\"isToolbarCommandActive('bullet_list')\"\n aria-label=\"Bullet List\"\n title=\"Bullet List\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'bullet_list')\">\n <svg class=\"ccd-rich-text-area__toolbar-icon\" viewBox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\">\n <path d=\"M4 10.5c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zm0-6C3.17 4.5 2.5 5.17 2.5 6S3.17 7.5 4 7.5 5.5 6.83 5.5 6 4.83 4.5 4 4.5zm0 12c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5 1.5-.67 1.5-1.5-.67-1.5-1.5-1.5zM7 13h14v-2H7v2zm0 6h14v-2H7v2zM7 5v2h14V5H7z\"></path>\n </svg>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button\"\n [ngClass]=\"{'ccd-rich-text-area__toolbar-button--active': currentListStyle() === 'ordered_list'}\"\n [attr.aria-pressed]=\"currentListStyle() === 'ordered_list'\"\n aria-label=\"Numbered List\"\n title=\"Numbered List\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'ordered_list')\">\n <svg class=\"ccd-rich-text-area__toolbar-icon\" viewBox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\">\n <path d=\"M2 17h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1 3h1.8L2 13.1V14h3v-1H3.2L5 10.9V10H2v1zm5-6v2h14V5H7zm0 14h14v-2H7v2zm0-6h14v-2H7v2z\"></path>\n </svg>\n </button>\n <div class=\"ccd-rich-text-area__list-style\">\n <label class=\"ccd-rich-text-area__list-style-label\" [for]=\"listStyleId()\">List style</label>\n <select\n class=\"ccd-rich-text-area__list-style-select\"\n [id]=\"listStyleId()\"\n [value]=\"currentListSelectValue()\"\n (change)=\"onListStyleChange($event)\">\n <option value=\"\">No list</option>\n <option value=\"ordered_list\">Numbers (1, 2, 3)</option>\n <option value=\"ordered_alpha\">Letters (a, b, c)</option>\n <option value=\"ordered_roman\">Roman numerals (i), (ii), (iii)</option>\n </select>\n </div>\n <span class=\"ccd-rich-text-area__toolbar-separator\" aria-hidden=\"true\"></span>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button\"\n aria-label=\"Decrease Indent\"\n title=\"Decrease Indent\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'outdent')\">\n <svg class=\"ccd-rich-text-area__toolbar-icon\" viewBox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\">\n <path d=\"M11 17h10v-2H11v2zm-8-5 4 4V8l-4 4zm0 9h18v-2H3v2zM3 3v2h18V3H3zm8 6h10V7H11v2zm0 4h10v-2H11v2z\"></path>\n </svg>\n </button>\n <button\n type=\"button\"\n class=\"ccd-rich-text-area__toolbar-button\"\n aria-label=\"Increase Indent\"\n title=\"Increase Indent\"\n (mousedown)=\"onToolbarButtonMouseDown($event)\"\n (click)=\"executeToolbarCommand($event, 'indent')\">\n <svg class=\"ccd-rich-text-area__toolbar-icon\" viewBox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\">\n <path d=\"M3 21h18v-2H3v2zM3 8v8l4-4-4-4zm8 9h10v-2H11v2zM3 3v2h18V3H3zm8 6h10V7H11v2zm0 4h10v-2H11v2z\"></path>\n </svg>\n </button>\n </div>\n\n <div class=\"NgxEditor__Wrapper\">\n <ngx-editor\n [editor]=\"editor\"\n [formControl]=\"richTextAreaControl\"\n outputFormat=\"html\"\n (focusIn)=\"syncAccessibilityLater()\"\n (focusOut)=\"onEditorFocusOut()\">\n </ngx-editor>\n </div>\n </div>\n</div>\n", styles: [".ccd-rich-text-area{margin-bottom:30px}.ccd-rich-text-area__editor{max-width:100%}.ccd-rich-text-area__toolbar{align-items:center;background:#fff;border:1px solid #d8dde0;border-radius:6px;display:flex;flex-wrap:wrap;gap:2px;margin-bottom:10px;padding:6px 8px;width:fit-content}.ccd-rich-text-area .NgxEditor__Wrapper{border:1px solid #000;border-radius:0;max-width:100%;width:100%}.ccd-rich-text-area .NgxEditor__Wrapper:focus-within{outline:3px solid #ffdd00;outline-offset:0}.ccd-rich-text-area__toolbar-button{background:#fff;align-items:center;border:0;border-radius:2px;color:#0b0c0c;display:inline-flex;font-family:inherit;font-size:18px;font-weight:700;height:28px;justify-content:center;min-width:28px;padding:4px;width:28px}.ccd-rich-text-area__toolbar-button:hover{background:#f3f2f1}.ccd-rich-text-area__toolbar-button:focus{background:#fd0;box-shadow:0 0 0 2px #0b0c0c;outline:2px solid #ffdd00;outline-offset:0}.ccd-rich-text-area__toolbar-button--active{background:#1d70b8;color:#fff}.ccd-rich-text-area__toolbar-button--italic{font-style:italic}.ccd-rich-text-area__toolbar-button--underline{text-decoration:underline}.ccd-rich-text-area__toolbar-separator{border-left:1px solid #b1b4b6;height:24px;margin:0 5px 0 3px}.ccd-rich-text-area__list-style{align-items:center;display:inline-flex;gap:8px;margin:0 4px}.ccd-rich-text-area__list-style-label{font-weight:700;white-space:nowrap}.ccd-rich-text-area__list-style-select{background-color:#fff;border:1px solid #0b0c0c;border-radius:0;color:#0b0c0c;font-family:inherit;font-size:16px;height:32px;min-width:190px;padding:2px 28px 2px 8px}.ccd-rich-text-area__list-style-select:focus{box-shadow:0 0 0 2px #0b0c0c;outline:3px solid #ffdd00;outline-offset:0}.ccd-rich-text-area__toolbar-icon{display:block;fill:currentColor;height:20px;width:20px}.ccd-rich-text-area__toolbar-icon--paragraph{display:inline-flex;font-size:18px;line-height:1;width:auto}.ccd-rich-text-area .NgxEditor__Wrapper .NgxEditor{border:0;border-radius:0;height:255px;min-height:255px;overflow:hidden;width:100%}.ccd-rich-text-area__editor--error .NgxEditor__Wrapper{border-color:#d4351c}.ccd-rich-text-area .NgxEditor__Content{box-sizing:border-box;height:255px;min-height:255px;overflow-x:hidden;overflow-y:auto;padding:12px 14px}.ccd-rich-text-area .ProseMirror{min-height:231px;outline:0;overflow-wrap:anywhere;white-space:pre-wrap;word-break:normal}.ccd-rich-text-area .ProseMirror [data-indent=\"1\"]{margin-left:40px}.ccd-rich-text-area .ProseMirror [data-indent=\"2\"]{margin-left:80px}.ccd-rich-text-area .ProseMirror [data-indent=\"3\"]{margin-left:120px}.ccd-rich-text-area .ProseMirror [data-indent=\"4\"]{margin-left:160px}.ccd-rich-text-area .ProseMirror [data-indent=\"5\"]{margin-left:200px}.ccd-rich-text-area .ProseMirror [data-indent=\"6\"]{margin-left:240px}.ccd-rich-text-area .ProseMirror strong,.ccd-rich-text-area .ProseMirror strong *,.ccd-rich-text-area .ProseMirror b,.ccd-rich-text-area .ProseMirror b *{font-weight:700}.ccd-rich-text-area .ProseMirror strong u,.ccd-rich-text-area .ProseMirror u strong,.ccd-rich-text-area .ProseMirror b u,.ccd-rich-text-area .ProseMirror u b{font-weight:700!important;text-decoration:underline}.ccd-rich-text-area .ProseMirror:focus{box-shadow:none;outline:0}.ccd-rich-text-area .ProseMirror p,.ccd-rich-text-area .ProseMirror ul,.ccd-rich-text-area .ProseMirror ol{margin-top:0;overflow-wrap:anywhere;word-break:normal}.ccd-rich-text-area .ProseMirror ul{list-style:disc outside;padding-left:25px}.ccd-rich-text-area .ProseMirror ol{list-style:decimal outside;padding-left:25px}.ccd-rich-text-area .ProseMirror ol[type=a]{list-style-type:lower-alpha}.ccd-rich-text-area .ProseMirror ol[type=i]{list-style-type:lower-roman}.ccd-rich-text-area .ProseMirror ol[type=i]>li::marker{content:\"(\" counter(list-item,lower-roman) \") \"}.ccd-rich-text-area .ProseMirror li{display:list-item;margin-bottom:5px}.ccd-rich-text-area .ProseMirror li>p{margin:0}\n"] }]
|
|
27315
27824
|
}], null, { editorHost: [{
|
|
27316
27825
|
type: ViewChild,
|
|
27317
27826
|
args: ['editorHost']
|
|
27318
27827
|
}] }); })();
|
|
27319
|
-
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(WriteRichTextAreaFieldComponent, { className: "WriteRichTextAreaFieldComponent", filePath: "lib/shared/components/palette/rich-text-area/write-rich-text-area-field.component.ts", lineNumber:
|
|
27828
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(WriteRichTextAreaFieldComponent, { className: "WriteRichTextAreaFieldComponent", filePath: "lib/shared/components/palette/rich-text-area/write-rich-text-area-field.component.ts", lineNumber: 112 }); })();
|
|
27320
27829
|
|
|
27321
27830
|
class ReadTextFieldComponent extends AbstractFieldReadComponent {
|
|
27322
27831
|
static ɵfac = /*@__PURE__*/ (() => { let ɵReadTextFieldComponent_BaseFactory; return function ReadTextFieldComponent_Factory(__ngFactoryType__) { return (ɵReadTextFieldComponent_BaseFactory || (ɵReadTextFieldComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ReadTextFieldComponent)))(__ngFactoryType__ || ReadTextFieldComponent); }; })();
|