@progress/kendo-angular-editor 2.5.0 → 3.0.0-dev.202112211443
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/dist/cdn/js/kendo-angular-editor.js +2 -2
- package/dist/cdn/main.js +1 -1
- package/dist/es/common/error-messages.js +3 -2
- package/dist/es/editor.component.js +95 -67
- package/dist/es/main.js +1 -0
- package/dist/es/package-metadata.js +1 -1
- package/dist/es/preventable-events/paste-event-data.js +4 -0
- package/dist/es/preventable-events/paste-event.js +25 -0
- package/dist/es2015/common/error-messages.js +3 -2
- package/dist/es2015/common/paste-cleanup-settings.d.ts +14 -0
- package/dist/es2015/editor.component.d.ts +15 -10
- package/dist/es2015/editor.component.js +95 -67
- package/dist/es2015/index.metadata.json +1 -1
- package/dist/es2015/main.d.ts +2 -0
- package/dist/es2015/main.js +1 -0
- package/dist/es2015/package-metadata.js +1 -1
- package/dist/es2015/preventable-events/paste-event-data.d.ts +21 -0
- package/dist/es2015/preventable-events/paste-event-data.js +4 -0
- package/dist/es2015/preventable-events/paste-event.d.ts +27 -0
- package/dist/es2015/preventable-events/paste-event.js +20 -0
- package/dist/fesm2015/index.js +114 -70
- package/dist/fesm5/index.js +117 -70
- package/dist/npm/common/error-messages.js +3 -1
- package/dist/npm/editor.component.js +91 -63
- package/dist/npm/main.js +2 -0
- package/dist/npm/package-metadata.js +1 -1
- package/dist/npm/preventable-events/paste-event-data.js +6 -0
- package/dist/npm/preventable-events/paste-event.js +27 -0
- package/dist/systemjs/kendo-angular-editor.js +1 -1
- package/package.json +1 -1
package/dist/es2015/main.d.ts
CHANGED
|
@@ -9,3 +9,5 @@ export { EditorState, Plugin, PluginKey, Transaction, EditorView, Decoration, De
|
|
|
9
9
|
export { PluginsFn } from './common/plugins-function';
|
|
10
10
|
export { ApplyToWordOptions } from './common/apply-to-word-options';
|
|
11
11
|
export { EditorResizableOptions } from './common/resizable-options.interface';
|
|
12
|
+
export { EditorPasteEvent } from './preventable-events/paste-event';
|
|
13
|
+
export { EditorPastedContentArgs } from './preventable-events/paste-event-data';
|
package/dist/es2015/main.js
CHANGED
|
@@ -6,3 +6,4 @@ export { EditorComponent } from './editor.component';
|
|
|
6
6
|
export { EditorModule } from './editor.module';
|
|
7
7
|
export { schema, Schema } from './config/schema';
|
|
8
8
|
export { EditorState, Plugin, PluginKey, Transaction, EditorView, Decoration, DecorationSet, NodeType, Node, MarkType, Mark, InputRule, inputRules, wrappingInputRule, textblockTypeInputRule, keymap, baseKeymap, history, dropCursor, gapCursor, tableNodes, getSelectionText } from '@progress/kendo-editor-common';
|
|
9
|
+
export { EditorPasteEvent } from './preventable-events/paste-event';
|
|
@@ -9,7 +9,7 @@ export const packageMetadata = {
|
|
|
9
9
|
name: '@progress/kendo-angular-editor',
|
|
10
10
|
productName: 'Kendo UI for Angular',
|
|
11
11
|
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
|
12
|
-
publishDate:
|
|
12
|
+
publishDate: 1640097479,
|
|
13
13
|
version: '',
|
|
14
14
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
|
|
15
15
|
};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
/**
|
|
6
|
+
* The Editor [`pastedContent`]({% slug api_editor_editorcomponent %}#toc-pastedcontent) callback argument.
|
|
7
|
+
*/
|
|
8
|
+
export declare type EditorPastedContentArgs = {
|
|
9
|
+
/**
|
|
10
|
+
* The HTML content cleaned in accordance with the [`PasteCleanupSettings`]({% slug paste_cleanup %}).
|
|
11
|
+
*/
|
|
12
|
+
cleanedHtml: string;
|
|
13
|
+
/**
|
|
14
|
+
* The raw pasted content.
|
|
15
|
+
*/
|
|
16
|
+
originalHtml: string;
|
|
17
|
+
/**
|
|
18
|
+
* The original DOM event.
|
|
19
|
+
*/
|
|
20
|
+
originalEvent: ClipboardEvent;
|
|
21
|
+
};
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { PreventableEvent } from "@progress/kendo-angular-common";
|
|
6
|
+
/**
|
|
7
|
+
* The Editor [`paste`]({% slug api_editor_editorcomponent %}#toc-paste) event.
|
|
8
|
+
*/
|
|
9
|
+
export declare class EditorPasteEvent extends PreventableEvent {
|
|
10
|
+
/**
|
|
11
|
+
* The HTML content cleaned in accordance with the [`PasteCleanupSettings`]({% slug paste_cleanup %}).
|
|
12
|
+
*/
|
|
13
|
+
cleanedHtml: string;
|
|
14
|
+
/**
|
|
15
|
+
* The raw pasted content.
|
|
16
|
+
*/
|
|
17
|
+
originalHtml: string;
|
|
18
|
+
/**
|
|
19
|
+
* The original DOM event.
|
|
20
|
+
*/
|
|
21
|
+
originalEvent: ClipboardEvent;
|
|
22
|
+
/**
|
|
23
|
+
* Constructs the event arguments for the `paste` event.
|
|
24
|
+
* @hidden
|
|
25
|
+
*/
|
|
26
|
+
constructor(cleanedHtml: string, originalHtml: string, originalEvent: ClipboardEvent);
|
|
27
|
+
}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2021 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { PreventableEvent } from "@progress/kendo-angular-common";
|
|
6
|
+
/**
|
|
7
|
+
* The Editor [`paste`]({% slug api_editor_editorcomponent %}#toc-paste) event.
|
|
8
|
+
*/
|
|
9
|
+
export class EditorPasteEvent extends PreventableEvent {
|
|
10
|
+
/**
|
|
11
|
+
* Constructs the event arguments for the `paste` event.
|
|
12
|
+
* @hidden
|
|
13
|
+
*/
|
|
14
|
+
constructor(cleanedHtml, originalHtml, originalEvent) {
|
|
15
|
+
super();
|
|
16
|
+
this.cleanedHtml = cleanedHtml;
|
|
17
|
+
this.originalHtml = originalHtml;
|
|
18
|
+
this.originalEvent = originalEvent;
|
|
19
|
+
}
|
|
20
|
+
}
|
package/dist/fesm2015/index.js
CHANGED
|
@@ -5,12 +5,12 @@
|
|
|
5
5
|
import { __decorate, __param, __metadata } from 'tslib';
|
|
6
6
|
import { Inject, Optional, Input, ViewChild, ElementRef, Component, Injectable, EventEmitter, isDevMode, Output, HostBinding, ContentChild, ViewContainerRef, forwardRef, ChangeDetectorRef, NgZone, TemplateRef, Host, Directive, NgModule } from '@angular/core';
|
|
7
7
|
import { FormControl, Validators, FormGroup, NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
8
|
-
import { Subject, BehaviorSubject, zip, fromEvent,
|
|
9
|
-
import { take,
|
|
8
|
+
import { Subject, BehaviorSubject, zip, fromEvent, interval } from 'rxjs';
|
|
9
|
+
import { take, map, filter, concatMap, takeUntil } from 'rxjs/operators';
|
|
10
10
|
import { ToolBarComponent, ToolBarToolComponent, ToolBarButtonComponent, ToolBarModule } from '@progress/kendo-angular-toolbar';
|
|
11
11
|
import { DialogContentBase, DialogRef, DialogService, DialogModule } from '@progress/kendo-angular-dialog';
|
|
12
|
-
import { isDocumentAvailable, guid, KendoInput, Keys } from '@progress/kendo-angular-common';
|
|
13
|
-
import { nodes, Schema, marks, Selection, SelectionRange, TextSelection, Fragment, Slice, NodeSelection, insertNode, expandToWordWrap, toggleInlineFormat, bold, cleanFormatting, applyLink, applyInlineStyle, insertText, italic, strikethrough, subscript, superscript, underline, removeLink, link, selectAll, isAligned, alignCenterRules, alignBlocks, alignRemoveRules, alignJustifyRules, alignLeftRules, alignRightRules, formatBlockElements, getHtml, indent, insertImage, toggleOrderedList, toggleUnorderedList, outdent, redo, setHtml, undo, hasMark, activeNode, canIndentAsListItem, canBeIndented, indentRules, hasNode, canOutdentAsListItem, outdentRules, getActiveMarks, expandSelection, addColumnBefore, addColumnAfter, addRowBefore, addRowAfter, deleteRow, deleteColumn, mergeCells, splitCell, deleteTable, getNodeFromSelection, getMark, getSelectionText, parseContent, Plugin, PluginKey, history, keymap, buildListKeymap, buildKeymap, baseKeymap, gapCursor, imageResizing, placeholder, EditorState, EditorView,
|
|
12
|
+
import { isDocumentAvailable, guid, PreventableEvent, hasObservers, KendoInput, Keys } from '@progress/kendo-angular-common';
|
|
13
|
+
import { nodes, Schema, marks, Selection, SelectionRange, TextSelection, Fragment, Slice, NodeSelection, insertNode, expandToWordWrap, toggleInlineFormat, bold, cleanFormatting, applyLink, applyInlineStyle, insertText, italic, strikethrough, subscript, superscript, underline, removeLink, link, selectAll, isAligned, alignCenterRules, alignBlocks, alignRemoveRules, alignJustifyRules, alignLeftRules, alignRightRules, formatBlockElements, getHtml, indent, insertImage, toggleOrderedList, toggleUnorderedList, outdent, redo, setHtml, undo, hasMark, activeNode, canIndentAsListItem, canBeIndented, indentRules, hasNode, canOutdentAsListItem, outdentRules, getActiveMarks, expandSelection, addColumnBefore, addColumnAfter, addRowBefore, addRowAfter, deleteRow, deleteColumn, mergeCells, splitCell, deleteTable, getNodeFromSelection, getMark, getSelectionText, pasteCleanup, parseContent, AllSelection, Plugin, PluginKey, history, keymap, buildListKeymap, buildKeymap, baseKeymap, gapCursor, imageResizing, placeholder, EditorState, EditorView, removeComments, sanitize, removeAttribute, sanitizeStyleAttr, sanitizeClassAttr } from '@progress/kendo-editor-common';
|
|
14
14
|
export { Schema, EditorState, Plugin, PluginKey, Transaction, EditorView, Decoration, DecorationSet, NodeType, Node, MarkType, Mark, InputRule, inputRules, wrappingInputRule, textblockTypeInputRule, keymap, baseKeymap, history, dropCursor, gapCursor, tableNodes, getSelectionText } from '@progress/kendo-editor-common';
|
|
15
15
|
import { validatePackage } from '@progress/kendo-licensing';
|
|
16
16
|
import { LocalizationService, L10N_PREFIX, RTL, MessageService, ComponentMessages } from '@progress/kendo-angular-l10n';
|
|
@@ -27,7 +27,7 @@ const packageMetadata = {
|
|
|
27
27
|
name: '@progress/kendo-angular-editor',
|
|
28
28
|
productName: 'Kendo UI for Angular',
|
|
29
29
|
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
|
30
|
-
publishDate:
|
|
30
|
+
publishDate: 1640097479,
|
|
31
31
|
version: '',
|
|
32
32
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
|
|
33
33
|
};
|
|
@@ -2533,7 +2533,7 @@ const tablesStyles = `
|
|
|
2533
2533
|
*/
|
|
2534
2534
|
const rtlStyles = 'body { direction: rtl }';
|
|
2535
2535
|
|
|
2536
|
-
const ɵ0$6 = (arg) => `plugins must be a function, but received ${JSON.stringify(arg)}.`;
|
|
2536
|
+
const ɵ0$6 = (arg) => `plugins must be a function, but received ${JSON.stringify(arg)}.`, ɵ1$6 = (arg) => `pastedContent must be a function, but received ${JSON.stringify(arg)}.`;
|
|
2537
2537
|
/* tslint:disable:variable-name */
|
|
2538
2538
|
/**
|
|
2539
2539
|
* @hidden
|
|
@@ -2542,6 +2542,7 @@ const EditorErrorMessages = {
|
|
|
2542
2542
|
schemaType: 'Expected value of type Schema. See http://www.telerik.com/kendo-angular-ui/components/editor/schema/',
|
|
2543
2543
|
setSchemaOnce: 'The Schema cannot be changed dynamically. See http://www.telerik.com/kendo-angular-ui/components/editor/schema/',
|
|
2544
2544
|
pluginsCallbackType: ɵ0$6,
|
|
2545
|
+
pastedContentCallbackType: ɵ1$6,
|
|
2545
2546
|
setPluginsOnce: 'The plugins cannot be changed dynamically. See http://www.telerik.com/kendo-angular-ui/components/editor/plugins/',
|
|
2546
2547
|
setPlaceHolderOnce: 'The placeholder cannot be changed dynamically. See http://www.telerik.com/kendo-angular-ui/components/editor/placeholder/',
|
|
2547
2548
|
printTool: 'The Print tool and functionality are supported only in iframe mode. See https://www.telerik.com/kendo-angular-ui-develop/components/editor/api/EditorPrintButtonDirective/'
|
|
@@ -2562,16 +2563,32 @@ EditorToolsService = __decorate([
|
|
|
2562
2563
|
Injectable()
|
|
2563
2564
|
], EditorToolsService);
|
|
2564
2565
|
|
|
2566
|
+
/**
|
|
2567
|
+
* The Editor [`paste`]({% slug api_editor_editorcomponent %}#toc-paste) event.
|
|
2568
|
+
*/
|
|
2569
|
+
class EditorPasteEvent extends PreventableEvent {
|
|
2570
|
+
/**
|
|
2571
|
+
* Constructs the event arguments for the `paste` event.
|
|
2572
|
+
* @hidden
|
|
2573
|
+
*/
|
|
2574
|
+
constructor(cleanedHtml, originalHtml, originalEvent) {
|
|
2575
|
+
super();
|
|
2576
|
+
this.cleanedHtml = cleanedHtml;
|
|
2577
|
+
this.originalHtml = originalHtml;
|
|
2578
|
+
this.originalEvent = originalEvent;
|
|
2579
|
+
}
|
|
2580
|
+
}
|
|
2581
|
+
|
|
2565
2582
|
var EditorComponent_1;
|
|
2566
2583
|
const EMPTY_PARAGRAPH = '<p></p>';
|
|
2567
2584
|
const defaultPasteCleanupSettings = {
|
|
2568
2585
|
convertMsLists: false,
|
|
2569
2586
|
removeAttributes: [],
|
|
2570
2587
|
removeHtmlComments: false,
|
|
2571
|
-
removeInvalidHTML:
|
|
2588
|
+
removeInvalidHTML: true,
|
|
2572
2589
|
removeMsClasses: false,
|
|
2573
2590
|
removeMsStyles: false,
|
|
2574
|
-
stripTags: [
|
|
2591
|
+
stripTags: []
|
|
2575
2592
|
};
|
|
2576
2593
|
const removeCommentsIf = conditionallyExecute(removeComments);
|
|
2577
2594
|
const removeInvalidHTMLIf = conditionallyExecute(sanitize);
|
|
@@ -2607,14 +2624,6 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
|
|
|
2607
2624
|
* @default false
|
|
2608
2625
|
*/
|
|
2609
2626
|
this.applyToWord = false;
|
|
2610
|
-
/**
|
|
2611
|
-
* By design, the Editor emits `valueChange`, updates the model and the ToolBar state on each keystroke.
|
|
2612
|
-
* When you are interested in ignoring the new values for a given amout of time and take only the most recent one, you can use the `updateInterval` property.
|
|
2613
|
-
* A possible use case is to get the new values and to update the ToolBar state at a maximum rate per second in order to speed up your application.
|
|
2614
|
-
* The specified interval (in milliseconds) should be a positive number.
|
|
2615
|
-
* By default the `updateInterval` is set to 100 miliseconds. If set to zero the delay will be disabled entirely.
|
|
2616
|
-
*/
|
|
2617
|
-
this.updateInterval = 100;
|
|
2618
2627
|
/**
|
|
2619
2628
|
* By default, whitespace is collapsed as per HTML's rules.
|
|
2620
2629
|
* Set to `true` to preserve whitespace, but normalize newlines to spaces.
|
|
@@ -2640,6 +2649,11 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
|
|
|
2640
2649
|
* Fires when the content area of the Editor is focused ([see example]({% slug overview_editor %}#toc-events)).
|
|
2641
2650
|
*/
|
|
2642
2651
|
this.onFocus = new EventEmitter();
|
|
2652
|
+
/**
|
|
2653
|
+
* Fires when the user performs paste in the content area of the Editor ([see example]({% slug overview_editor %}#toc-events)).
|
|
2654
|
+
* The event is preventable. If you cancel it, the Editor content will not change.
|
|
2655
|
+
*/
|
|
2656
|
+
this.paste = new EventEmitter();
|
|
2643
2657
|
/**
|
|
2644
2658
|
* Fires when the content area of the Editor is blurred ([see example]({% slug overview_editor %}#toc-events)).
|
|
2645
2659
|
*/
|
|
@@ -2655,10 +2669,73 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
|
|
|
2655
2669
|
this.valueModified = new Subject();
|
|
2656
2670
|
this._readonly = false;
|
|
2657
2671
|
this._placeholder = '';
|
|
2672
|
+
this.inForm = false;
|
|
2658
2673
|
this.afterViewInit = new Subject();
|
|
2659
2674
|
this.contentAreaLoaded = new Subject();
|
|
2660
|
-
this.
|
|
2675
|
+
this.dispatchTransaction = (tr) => {
|
|
2676
|
+
const docChanged = tr.docChanged;
|
|
2677
|
+
if (docChanged) {
|
|
2678
|
+
const doc = tr.doc;
|
|
2679
|
+
const html = getHtml({ doc });
|
|
2680
|
+
this.trOnChange = tr;
|
|
2681
|
+
this.htmlOnChange = html;
|
|
2682
|
+
this.ngZone.run(() => {
|
|
2683
|
+
this.valueModified.next(html);
|
|
2684
|
+
});
|
|
2685
|
+
}
|
|
2686
|
+
if (!docChanged || this.inForm) {
|
|
2687
|
+
this.view.updateState(this.view.state.apply(tr));
|
|
2688
|
+
}
|
|
2689
|
+
};
|
|
2690
|
+
this.transformPastedHTML = (dirtyHtml) => {
|
|
2691
|
+
const pasteCleanupSettings = Object.assign({}, defaultPasteCleanupSettings, this.pasteCleanupSettings);
|
|
2692
|
+
const html = pipe(removeInvalidHTMLIf(pasteCleanupSettings.removeInvalidHTML), removeCommentsIf(pasteCleanupSettings.removeHtmlComments))(dirtyHtml);
|
|
2693
|
+
const clean = pasteCleanup(html, {
|
|
2694
|
+
convertMsLists: pasteCleanupSettings.convertMsLists,
|
|
2695
|
+
stripTags: pasteCleanupSettings.stripTags.join('|'),
|
|
2696
|
+
attributes: getPasteCleanupAttributes(pasteCleanupSettings)
|
|
2697
|
+
});
|
|
2698
|
+
if (hasObservers(this.paste)) {
|
|
2699
|
+
const event = new EditorPasteEvent(clean, dirtyHtml, this._pasteEvent);
|
|
2700
|
+
this.ngZone.run(() => this.paste.emit(event));
|
|
2701
|
+
return event.isDefaultPrevented() ? '' : event.cleanedHtml;
|
|
2702
|
+
}
|
|
2703
|
+
return clean;
|
|
2704
|
+
};
|
|
2705
|
+
this.changeValue = (value) => {
|
|
2706
|
+
const prev = this._value;
|
|
2707
|
+
this._value = value;
|
|
2708
|
+
if (!this._view) {
|
|
2709
|
+
return;
|
|
2710
|
+
}
|
|
2711
|
+
if (this.htmlOnChange === value && this.trOnChange) {
|
|
2712
|
+
this.view.updateState(this.view.state.apply(this.trOnChange));
|
|
2713
|
+
}
|
|
2714
|
+
else {
|
|
2715
|
+
if ((prev || '') !== (value || '')) {
|
|
2716
|
+
const iframeContentWindowNotPresent = this.iframe && !this.container.element.nativeElement.contentWindow;
|
|
2717
|
+
if (iframeContentWindowNotPresent) {
|
|
2718
|
+
return;
|
|
2719
|
+
}
|
|
2720
|
+
const state = this.view.state;
|
|
2721
|
+
const nextDoc = parseContent(value || '', state.schema, { preserveWhitespace: this.preserveWhitespace });
|
|
2722
|
+
const tr = state.tr
|
|
2723
|
+
.setSelection(new AllSelection(state.doc))
|
|
2724
|
+
.replaceSelectionWith(nextDoc);
|
|
2725
|
+
this.view.updateState(state.apply(tr));
|
|
2726
|
+
}
|
|
2727
|
+
}
|
|
2728
|
+
this.trOnChange = null;
|
|
2729
|
+
this.htmlOnChange = null;
|
|
2730
|
+
};
|
|
2731
|
+
this.onChangeCallback = (value) => {
|
|
2732
|
+
this.changeValue(value);
|
|
2733
|
+
};
|
|
2661
2734
|
this.onTouchedCallback = (_) => { }; // tslint:disable-line:no-empty
|
|
2735
|
+
this.onPaste = (_view, nativeEvent) => {
|
|
2736
|
+
this._pasteEvent = nativeEvent;
|
|
2737
|
+
return false;
|
|
2738
|
+
};
|
|
2662
2739
|
validatePackage(packageMetadata);
|
|
2663
2740
|
this.direction = localization.rtl ? 'rtl' : 'ltr';
|
|
2664
2741
|
// https://stackoverflow.com/questions/56572483/chrome-is-synchronously-handling-iframe-loading-whereas-firefox-handles-it-asyn
|
|
@@ -2668,25 +2745,12 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
|
|
|
2668
2745
|
* Sets the value of the Editor ([see example]({% slug overview_editor %}#toc-basic-usage)).
|
|
2669
2746
|
*/
|
|
2670
2747
|
set value(value) {
|
|
2671
|
-
|
|
2672
|
-
return;
|
|
2673
|
-
}
|
|
2674
|
-
this._value = value;
|
|
2675
|
-
this._previousValue = value;
|
|
2676
|
-
if (this._view) {
|
|
2677
|
-
const iframeContentWindowNotPresent = this.iframe && !this.container.element.nativeElement.contentWindow;
|
|
2678
|
-
if (iframeContentWindowNotPresent) {
|
|
2679
|
-
return;
|
|
2680
|
-
}
|
|
2681
|
-
this.exec('setHTML', {
|
|
2682
|
-
content: this._value || '',
|
|
2683
|
-
parseOptions: {
|
|
2684
|
-
preserveWhitespace: this.preserveWhitespace
|
|
2685
|
-
}
|
|
2686
|
-
});
|
|
2687
|
-
}
|
|
2748
|
+
this.changeValue(value);
|
|
2688
2749
|
}
|
|
2689
2750
|
get value() {
|
|
2751
|
+
if (this.trOnChange) {
|
|
2752
|
+
return this.htmlOnChange;
|
|
2753
|
+
}
|
|
2690
2754
|
let value = this._view ? this.getSource() : this._value;
|
|
2691
2755
|
if (value === EMPTY_PARAGRAPH) {
|
|
2692
2756
|
return this._value ? '' : this._value;
|
|
@@ -2876,6 +2940,9 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
|
|
|
2876
2940
|
}
|
|
2877
2941
|
}
|
|
2878
2942
|
ngOnChanges(changes) {
|
|
2943
|
+
if (changes.value && this.view) {
|
|
2944
|
+
this.changeValue(changes.value.currentValue);
|
|
2945
|
+
}
|
|
2879
2946
|
if (changes.iframe && !changes.iframe.isFirstChange()) {
|
|
2880
2947
|
this.ngZone.onStable.pipe(take(1)).subscribe(() => this.initialize());
|
|
2881
2948
|
}
|
|
@@ -2961,8 +3028,6 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
|
|
|
2961
3028
|
const command = editorCommands[commandName](attr);
|
|
2962
3029
|
// Executes a ProseMirror command.
|
|
2963
3030
|
command(this._view.state, this._view.dispatch, this._view);
|
|
2964
|
-
// See the `dispatchTransaction` comments.
|
|
2965
|
-
// this.stateChange.emit(updateToolBar(this.view));
|
|
2966
3031
|
}
|
|
2967
3032
|
/**
|
|
2968
3033
|
* Opens a dialog.
|
|
@@ -3047,6 +3112,7 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
|
|
|
3047
3112
|
* @hidden
|
|
3048
3113
|
*/
|
|
3049
3114
|
writeValue(value) {
|
|
3115
|
+
this.inForm = true;
|
|
3050
3116
|
// To avoid confusion, non-existent values are always undefined.
|
|
3051
3117
|
this.value = value === null ? undefined : value;
|
|
3052
3118
|
}
|
|
@@ -3074,7 +3140,6 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
|
|
|
3074
3140
|
return;
|
|
3075
3141
|
}
|
|
3076
3142
|
const currentSchema = this.schema || schema;
|
|
3077
|
-
const that = this;
|
|
3078
3143
|
const containerNativeElement = this.container.element.nativeElement;
|
|
3079
3144
|
const contentNode = parseContent((this.value || '').trim(), currentSchema, { preserveWhitespace: this.preserveWhitespace });
|
|
3080
3145
|
if (this.iframe) {
|
|
@@ -3118,7 +3183,7 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
|
|
|
3118
3183
|
}),
|
|
3119
3184
|
new Plugin({
|
|
3120
3185
|
key: new PluginKey('editor-filter-disabled-state'),
|
|
3121
|
-
filterTransaction: () => !this.disabled
|
|
3186
|
+
filterTransaction: () => !this.disabled || this.inForm
|
|
3122
3187
|
}),
|
|
3123
3188
|
history(),
|
|
3124
3189
|
keymap(buildListKeymap(currentSchema)),
|
|
@@ -3145,31 +3210,10 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
|
|
|
3145
3210
|
this._view = new EditorView({ mount: this.viewMountElement }, {
|
|
3146
3211
|
state,
|
|
3147
3212
|
editable: () => !this.readonly,
|
|
3148
|
-
dispatchTransaction:
|
|
3149
|
-
|
|
3150
|
-
|
|
3151
|
-
|
|
3152
|
-
// When the user utilizes keyboard shortcuts—for example, `Ctrl`+`b`—
|
|
3153
|
-
// `tr.docChanged` is `true` and the toolbar is not updated.
|
|
3154
|
-
// A possible future solution is to move the keymaps to the service.
|
|
3155
|
-
// if (!tr.docChanged) {
|
|
3156
|
-
// that.stateChange.emit(updateToolBar(that.view));
|
|
3157
|
-
// }
|
|
3158
|
-
const value = that.value;
|
|
3159
|
-
if (!hasSameMarkup(value, that._previousValue, this.state.schema)) {
|
|
3160
|
-
that._previousValue = value;
|
|
3161
|
-
that.ngZone.run(() => that.valueModified.next(value));
|
|
3162
|
-
}
|
|
3163
|
-
},
|
|
3164
|
-
transformPastedHTML: (html) => {
|
|
3165
|
-
const pasteCleanupSettings = Object.assign({}, defaultPasteCleanupSettings, this.pasteCleanupSettings);
|
|
3166
|
-
const clean = pipe(removeCommentsIf(pasteCleanupSettings.removeHtmlComments), removeInvalidHTMLIf(pasteCleanupSettings.removeInvalidHTML))(html);
|
|
3167
|
-
const attributes = getPasteCleanupAttributes(pasteCleanupSettings);
|
|
3168
|
-
return pasteCleanup(clean, {
|
|
3169
|
-
convertMsLists: pasteCleanupSettings.convertMsLists,
|
|
3170
|
-
stripTags: pasteCleanupSettings.stripTags.join('|'),
|
|
3171
|
-
attributes
|
|
3172
|
-
});
|
|
3213
|
+
dispatchTransaction: this.dispatchTransaction,
|
|
3214
|
+
transformPastedHTML: this.transformPastedHTML,
|
|
3215
|
+
handleDOMEvents: {
|
|
3216
|
+
paste: this.onPaste
|
|
3173
3217
|
}
|
|
3174
3218
|
});
|
|
3175
3219
|
});
|
|
@@ -3210,7 +3254,7 @@ let EditorComponent = EditorComponent_1 = class EditorComponent {
|
|
|
3210
3254
|
this.cdr.detectChanges();
|
|
3211
3255
|
}
|
|
3212
3256
|
}));
|
|
3213
|
-
this.subs.add(
|
|
3257
|
+
this.subs.add(this.valueModified.subscribe((value) => {
|
|
3214
3258
|
this.onChangeCallback(value);
|
|
3215
3259
|
this.valueChange.emit(value);
|
|
3216
3260
|
this.cdr.markForCheck();
|
|
@@ -3303,10 +3347,6 @@ __decorate([
|
|
|
3303
3347
|
__metadata("design:type", String),
|
|
3304
3348
|
__metadata("design:paramtypes", [String])
|
|
3305
3349
|
], EditorComponent.prototype, "placeholder", null);
|
|
3306
|
-
__decorate([
|
|
3307
|
-
Input(),
|
|
3308
|
-
__metadata("design:type", Number)
|
|
3309
|
-
], EditorComponent.prototype, "updateInterval", void 0);
|
|
3310
3350
|
__decorate([
|
|
3311
3351
|
Input(),
|
|
3312
3352
|
__metadata("design:type", Object)
|
|
@@ -3327,6 +3367,10 @@ __decorate([
|
|
|
3327
3367
|
Output('focus'),
|
|
3328
3368
|
__metadata("design:type", EventEmitter)
|
|
3329
3369
|
], EditorComponent.prototype, "onFocus", void 0);
|
|
3370
|
+
__decorate([
|
|
3371
|
+
Output(),
|
|
3372
|
+
__metadata("design:type", EventEmitter)
|
|
3373
|
+
], EditorComponent.prototype, "paste", void 0);
|
|
3330
3374
|
__decorate([
|
|
3331
3375
|
Output('blur'),
|
|
3332
3376
|
__metadata("design:type", EventEmitter)
|
|
@@ -3574,7 +3618,7 @@ EditorComponent = EditorComponent_1 = __decorate([
|
|
|
3574
3618
|
<div *ngIf="!iframe" #content [attr.dir]="direction" class="k-editor-content"></div>
|
|
3575
3619
|
|
|
3576
3620
|
<div class="k-editor-content" *ngIf="iframe">
|
|
3577
|
-
<iframe #content frameborder="0" class="k-iframe" (load)="iframeOnLoad()"></iframe>
|
|
3621
|
+
<iframe #content srcdoc="<!DOCTYPE html>" frameborder="0" class="k-iframe" (load)="iframeOnLoad()"></iframe>
|
|
3578
3622
|
</div>
|
|
3579
3623
|
|
|
3580
3624
|
<ng-container #dialogsContainer></ng-container>
|
|
@@ -7062,4 +7106,4 @@ EditorModule = __decorate([
|
|
|
7062
7106
|
* Generated bundle index. Do not edit.
|
|
7063
7107
|
*/
|
|
7064
7108
|
|
|
7065
|
-
export { ColorPickerDialogComponent, FileLinkDialogComponent, FontFamilyDialogComponent, FontSizeDialogComponent, FormatDialogComponent, ImageDialogComponent, InsertTableDialogComponent, SourceDialogComponent, CustomMessagesComponent, EditorLocalizationService, LocalizedMessagesDirective, Messages, EditorAlignCenterButtonDirective, EditorAlignJustifyButtonDirective, EditorAlignLeftButtonDirective, EditorAlignRightButtonDirective, EditorBackColorDirective, EditorColorPickerComponent, EditorForeColorDirective, EditorCleanFormattingButtonDirective, FontFamilyDropDownListComponent, EditorFontFamilyComponent, FontSizeDropDownListComponent, EditorFontSizeComponent, FormatDropDownListComponent, EditorFormatComponent, EditorRedoButtonDirective, EditorUndoButtonDirective, EditorInsertImageButtonDirective, EditorIndentButtonDirective, EditorOutdentButtonDirective, EditorCreateLinkButtonDirective, EditorInsertFileButtonDirective, EditorUnlinkButtonDirective, EditorInsertOrderedListButtonDirective, EditorInsertUnorderedListButtonDirective, EditorPrintDirective, EditorSelectAllButtonDirective, DropDownToolDirective, EditorCommandBase, EditorCommandButton, EditorCommandDialog, EditorViewSourceButtonDirective, EditorAddColumnAfterButtonDirective, EditorAddColumnBeforeButtonDirective, EditorAddRowAfterButtonDirective, EditorAddRowBeforeButtonDirective, EditorDeleteColumnButtonDirective, EditorDeleteRowButtonDirective, EditorDeleteTableButtonDirective, EditorInsertTableButtonComponent, EditorMergeCellsButtonDirective, EditorSplitCellButtonDirective, PopupTableGridComponent, EditorToolsService, EditorBoldButtonDirective, EditorItalicButtonDirective, EditorStrikethroughButtonDirective, EditorSubscriptButtonDirective, EditorSuperscriptButtonDirective, EditorUnderlineButtonDirective, EditorComponent, EditorModule, schema };
|
|
7109
|
+
export { ColorPickerDialogComponent, FileLinkDialogComponent, FontFamilyDialogComponent, FontSizeDialogComponent, FormatDialogComponent, ImageDialogComponent, InsertTableDialogComponent, SourceDialogComponent, CustomMessagesComponent, EditorLocalizationService, LocalizedMessagesDirective, Messages, EditorAlignCenterButtonDirective, EditorAlignJustifyButtonDirective, EditorAlignLeftButtonDirective, EditorAlignRightButtonDirective, EditorBackColorDirective, EditorColorPickerComponent, EditorForeColorDirective, EditorCleanFormattingButtonDirective, FontFamilyDropDownListComponent, EditorFontFamilyComponent, FontSizeDropDownListComponent, EditorFontSizeComponent, FormatDropDownListComponent, EditorFormatComponent, EditorRedoButtonDirective, EditorUndoButtonDirective, EditorInsertImageButtonDirective, EditorIndentButtonDirective, EditorOutdentButtonDirective, EditorCreateLinkButtonDirective, EditorInsertFileButtonDirective, EditorUnlinkButtonDirective, EditorInsertOrderedListButtonDirective, EditorInsertUnorderedListButtonDirective, EditorPrintDirective, EditorSelectAllButtonDirective, DropDownToolDirective, EditorCommandBase, EditorCommandButton, EditorCommandDialog, EditorViewSourceButtonDirective, EditorAddColumnAfterButtonDirective, EditorAddColumnBeforeButtonDirective, EditorAddRowAfterButtonDirective, EditorAddRowBeforeButtonDirective, EditorDeleteColumnButtonDirective, EditorDeleteRowButtonDirective, EditorDeleteTableButtonDirective, EditorInsertTableButtonComponent, EditorMergeCellsButtonDirective, EditorSplitCellButtonDirective, PopupTableGridComponent, EditorToolsService, EditorBoldButtonDirective, EditorItalicButtonDirective, EditorStrikethroughButtonDirective, EditorSubscriptButtonDirective, EditorSuperscriptButtonDirective, EditorUnderlineButtonDirective, EditorComponent, EditorModule, schema, EditorPasteEvent };
|