slate-angular 15.0.0 → 15.1.0-next.0
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/components/block-card/block-card.component.d.ts +1 -1
- package/components/block-card/block-card.component.scss +3 -2
- package/components/children/children.component.d.ts +4 -4
- package/components/descendant/descendant.component.d.ts +5 -5
- package/components/element/default-element.component.token.d.ts +3 -3
- package/components/leaf/default-leaf.component.d.ts +2 -2
- package/components/leaf/leaf.component.d.ts +5 -5
- package/components/leaves/leaves.component.d.ts +4 -4
- package/components/string/default-string.component.d.ts +13 -0
- package/components/string/string.component.d.ts +2 -1
- package/components/string/template.component.d.ts +0 -1
- package/esm2020/components/block-card/block-card.component.mjs +5 -5
- package/esm2020/components/children/children.component.mjs +22 -19
- package/esm2020/components/descendant/descendant.component.mjs +19 -17
- package/esm2020/components/editable/editable.component.mjs +129 -48
- package/esm2020/components/element/default-element.component.mjs +1 -1
- package/esm2020/components/element/default-element.component.token.mjs +2 -2
- package/esm2020/components/element/element.component.mjs +1 -1
- package/esm2020/components/leaf/default-leaf.component.mjs +5 -5
- package/esm2020/components/leaf/leaf.component.mjs +6 -6
- package/esm2020/components/leaves/leaves.component.mjs +15 -13
- package/esm2020/components/string/default-string.component.mjs +31 -0
- package/esm2020/components/string/string.component.mjs +7 -3
- package/esm2020/components/string/template.component.mjs +8 -8
- package/esm2020/components/text/default-text.component.mjs +1 -1
- package/esm2020/components/text/void-text.component.mjs +3 -3
- package/esm2020/custom-event/BeforeInputEventPlugin.mjs +1 -1
- package/esm2020/custom-event/before-input-polyfill.mjs +2 -2
- package/esm2020/module.mjs +21 -6
- package/esm2020/plugins/angular-editor.mjs +33 -50
- package/esm2020/plugins/with-angular.mjs +11 -8
- package/esm2020/public-api.mjs +2 -1
- package/esm2020/types/error.mjs +1 -1
- package/esm2020/types/feature.mjs +1 -1
- package/esm2020/types/view.mjs +1 -1
- package/esm2020/utils/block-card.mjs +1 -1
- package/esm2020/utils/dom.mjs +4 -8
- package/esm2020/utils/environment.mjs +5 -9
- package/esm2020/utils/global-normalize.mjs +5 -8
- package/esm2020/utils/hotkeys.mjs +1 -1
- package/esm2020/utils/index.mjs +1 -1
- package/esm2020/utils/lines.mjs +1 -1
- package/esm2020/utils/range-list.mjs +1 -1
- package/esm2020/utils/restore-dom.mjs +33 -0
- package/esm2020/utils/view.mjs +2 -2
- package/esm2020/utils/weak-maps.mjs +1 -1
- package/esm2020/view/base.mjs +4 -4
- package/esm2020/view/before-context-change.mjs +1 -1
- package/esm2020/view/container-item.mjs +13 -7
- package/esm2020/view/container.mjs +5 -5
- package/esm2020/view/context.mjs +1 -1
- package/fesm2015/slate-angular.mjs +327 -181
- package/fesm2015/slate-angular.mjs.map +1 -1
- package/fesm2020/slate-angular.mjs +327 -182
- package/fesm2020/slate-angular.mjs.map +1 -1
- package/module.d.ts +3 -2
- package/package.json +1 -1
- package/plugins/angular-editor.d.ts +4 -4
- package/public-api.d.ts +1 -0
- package/styles/index.scss +3 -4
- package/types/error.d.ts +1 -1
- package/types/feature.d.ts +1 -1
- package/types/view.d.ts +1 -1
- package/utils/block-card.d.ts +1 -1
- package/utils/dom.d.ts +3 -3
- package/utils/global-normalize.d.ts +1 -1
- package/utils/restore-dom.d.ts +2 -0
- package/utils/view.d.ts +2 -2
- package/view/base.d.ts +4 -4
- package/view/container-item.d.ts +5 -5
- package/view/container.d.ts +3 -3
- package/view/context.d.ts +5 -5
|
@@ -66,7 +66,7 @@ var DOMStaticRange = globalThis.StaticRange;
|
|
|
66
66
|
* Returns the host window of a DOM node
|
|
67
67
|
*/
|
|
68
68
|
const getDefaultView = (value) => {
|
|
69
|
-
return (
|
|
69
|
+
return (value && value.ownerDocument && value.ownerDocument.defaultView) || null;
|
|
70
70
|
};
|
|
71
71
|
/**
|
|
72
72
|
* Check if a DOM node is a comment node.
|
|
@@ -104,9 +104,7 @@ const isDOMText = (value) => {
|
|
|
104
104
|
* Checks whether a paste event is a plaintext-only event.
|
|
105
105
|
*/
|
|
106
106
|
const isPlainTextOnlyPaste = (event) => {
|
|
107
|
-
return (event.clipboardData
|
|
108
|
-
event.clipboardData.getData('text/plain') !== '' &&
|
|
109
|
-
event.clipboardData.types.length === 1);
|
|
107
|
+
return event.clipboardData && event.clipboardData.getData('text/plain') !== '' && event.clipboardData.types.length === 1;
|
|
110
108
|
};
|
|
111
109
|
/**
|
|
112
110
|
* Normalize a DOM point so that it always refers to a text node.
|
|
@@ -118,7 +116,6 @@ const normalizeDOMPoint = (domPoint) => {
|
|
|
118
116
|
if (isDOMElement(node) && node.childNodes.length) {
|
|
119
117
|
let isLast = offset === node.childNodes.length;
|
|
120
118
|
let index = isLast ? offset - 1 : offset;
|
|
121
|
-
;
|
|
122
119
|
[node, index] = getEditableChildAndIndex(node, index, isLast ? 'backward' : 'forward');
|
|
123
120
|
// If the editable child found is in front of input offset, we instead seek to its end
|
|
124
121
|
isLast = index < offset;
|
|
@@ -129,8 +126,7 @@ const normalizeDOMPoint = (domPoint) => {
|
|
|
129
126
|
node = getEditableChild(node, i, isLast ? 'backward' : 'forward');
|
|
130
127
|
}
|
|
131
128
|
// Determine the new offset inside the text node.
|
|
132
|
-
offset =
|
|
133
|
-
isLast && node.textContent != null ? node.textContent.length : 0;
|
|
129
|
+
offset = isLast && node.textContent != null ? node.textContent.length : 0;
|
|
134
130
|
}
|
|
135
131
|
// Return the node and offset.
|
|
136
132
|
return [node, offset];
|
|
@@ -255,13 +251,10 @@ const IS_IOS = typeof navigator !== 'undefined' &&
|
|
|
255
251
|
!window.MSStream;
|
|
256
252
|
const IS_APPLE = typeof navigator !== 'undefined' && /Mac OS X/.test(navigator.userAgent);
|
|
257
253
|
const IS_ANDROID = typeof navigator !== 'undefined' && /Android/.test(navigator.userAgent);
|
|
258
|
-
const IS_FIREFOX = typeof navigator !== 'undefined' &&
|
|
259
|
-
|
|
260
|
-
const IS_SAFARI = typeof navigator !== 'undefined' &&
|
|
261
|
-
/Version\/[\d\.]+.*Safari/.test(navigator.userAgent);
|
|
254
|
+
const IS_FIREFOX = typeof navigator !== 'undefined' && /^(?!.*Seamonkey)(?=.*Firefox).*/i.test(navigator.userAgent);
|
|
255
|
+
const IS_SAFARI = typeof navigator !== 'undefined' && /Version\/[\d\.]+.*Safari/.test(navigator.userAgent);
|
|
262
256
|
// "modern" Edge was released at 79.x
|
|
263
|
-
const IS_EDGE_LEGACY = typeof navigator !== 'undefined' &&
|
|
264
|
-
/Edge?\/(?:[0-6][0-9]|[0-7][0-8])(?:\.)/i.test(navigator.userAgent);
|
|
257
|
+
const IS_EDGE_LEGACY = typeof navigator !== 'undefined' && /Edge?\/(?:[0-6][0-9]|[0-7][0-8])(?:\.)/i.test(navigator.userAgent);
|
|
265
258
|
const IS_CHROME = typeof navigator !== 'undefined' && /Chrome/i.test(navigator.userAgent);
|
|
266
259
|
// Native beforeInput events don't work well with react on Chrome 75 and older, Chrome 76+ can use beforeInput
|
|
267
260
|
const IS_CHROME_LEGACY = typeof navigator !== 'undefined' &&
|
|
@@ -269,8 +262,7 @@ const IS_CHROME_LEGACY = typeof navigator !== 'undefined' &&
|
|
|
269
262
|
// Exclude Chrome version greater than 3 bits,Chrome releases v100 on 2022.03.29
|
|
270
263
|
!/Chrome?\/(?:\d{3,})/i.test(navigator.userAgent);
|
|
271
264
|
// Firefox did not support `beforeInput` until `v87`.
|
|
272
|
-
const IS_FIREFOX_LEGACY = typeof navigator !== 'undefined' &&
|
|
273
|
-
/^(?!.*Seamonkey)(?=.*Firefox\/(?:[0-7][0-9]|[0-8][0-6])(?:\.)).*/i.test(navigator.userAgent);
|
|
265
|
+
const IS_FIREFOX_LEGACY = typeof navigator !== 'undefined' && /^(?!.*Seamonkey)(?=.*Firefox\/(?:[0-7][0-9]|[0-8][0-6])(?:\.)).*/i.test(navigator.userAgent);
|
|
274
266
|
// qq browser
|
|
275
267
|
const IS_QQBROWSER = typeof navigator !== 'undefined' && /.*QQBrowser/.test(navigator.userAgent);
|
|
276
268
|
// UC mobile browser
|
|
@@ -373,8 +365,7 @@ const AngularEditor = {
|
|
|
373
365
|
findDocumentOrShadowRoot(editor) {
|
|
374
366
|
const el = AngularEditor.toDOMNode(editor, editor);
|
|
375
367
|
const root = el.getRootNode();
|
|
376
|
-
if ((root instanceof Document || root instanceof ShadowRoot) &&
|
|
377
|
-
root.getSelection != null) {
|
|
368
|
+
if ((root instanceof Document || root instanceof ShadowRoot) && root.getSelection != null) {
|
|
378
369
|
return root;
|
|
379
370
|
}
|
|
380
371
|
return el.ownerDocument;
|
|
@@ -403,7 +394,10 @@ const AngularEditor = {
|
|
|
403
394
|
return false;
|
|
404
395
|
}
|
|
405
396
|
const [start, end] = Range.edges(selection);
|
|
406
|
-
const endBlock = Editor.above(editor, {
|
|
397
|
+
const endBlock = Editor.above(editor, {
|
|
398
|
+
at: end,
|
|
399
|
+
match: node => Editor.isBlock(editor, node)
|
|
400
|
+
});
|
|
407
401
|
return Editor.isStart(editor, end, endBlock[1]);
|
|
408
402
|
},
|
|
409
403
|
/**
|
|
@@ -464,9 +458,8 @@ const AngularEditor = {
|
|
|
464
458
|
if (!targetEl) {
|
|
465
459
|
return false;
|
|
466
460
|
}
|
|
467
|
-
return targetEl.closest(`[data-slate-editor]`) === editorEl &&
|
|
468
|
-
(!editable || targetEl.isContentEditable ||
|
|
469
|
-
!!targetEl.getAttribute('data-slate-zero-width'));
|
|
461
|
+
return (targetEl.closest(`[data-slate-editor]`) === editorEl &&
|
|
462
|
+
(!editable || targetEl.isContentEditable || !!targetEl.getAttribute('data-slate-zero-width')));
|
|
470
463
|
},
|
|
471
464
|
/**
|
|
472
465
|
* Insert data from a `DataTransfer` into the editor.
|
|
@@ -475,8 +468,8 @@ const AngularEditor = {
|
|
|
475
468
|
editor.insertData(data);
|
|
476
469
|
},
|
|
477
470
|
/**
|
|
478
|
-
|
|
479
|
-
|
|
471
|
+
* Insert fragment data from a `DataTransfer` into the editor.
|
|
472
|
+
*/
|
|
480
473
|
insertFragmentData(editor, data) {
|
|
481
474
|
return editor.insertFragmentData(data);
|
|
482
475
|
},
|
|
@@ -493,8 +486,8 @@ const AngularEditor = {
|
|
|
493
486
|
editor.onKeydown(data);
|
|
494
487
|
},
|
|
495
488
|
/**
|
|
496
|
-
|
|
497
|
-
|
|
489
|
+
* onClick hook.
|
|
490
|
+
*/
|
|
498
491
|
onClick(editor, data) {
|
|
499
492
|
editor.onClick(data);
|
|
500
493
|
},
|
|
@@ -511,9 +504,7 @@ const AngularEditor = {
|
|
|
511
504
|
* Find the native DOM element from a Slate node.
|
|
512
505
|
*/
|
|
513
506
|
toDOMNode(editor, node) {
|
|
514
|
-
const domNode = Editor.isEditor(node)
|
|
515
|
-
? EDITOR_TO_ELEMENT.get(editor)
|
|
516
|
-
: NODE_TO_ELEMENT.get(node);
|
|
507
|
+
const domNode = Editor.isEditor(node) ? EDITOR_TO_ELEMENT.get(editor) : NODE_TO_ELEMENT.get(node);
|
|
517
508
|
if (!domNode) {
|
|
518
509
|
throw new Error(`Cannot resolve a DOM node from Slate node: ${JSON.stringify(node)}`);
|
|
519
510
|
}
|
|
@@ -589,13 +580,9 @@ const AngularEditor = {
|
|
|
589
580
|
// A slate Point at zero-width Leaf always has an offset of 0 but a native DOM selection at
|
|
590
581
|
// zero-width node has an offset of 1 so we have to check if we are in a zero-width node and
|
|
591
582
|
// adjust the offset accordingly.
|
|
592
|
-
const startEl = (isDOMElement(startNode)
|
|
593
|
-
? startNode
|
|
594
|
-
: startNode.parentElement);
|
|
583
|
+
const startEl = (isDOMElement(startNode) ? startNode : startNode.parentElement);
|
|
595
584
|
const isStartAtZeroWidth = !!startEl.getAttribute('data-slate-zero-width');
|
|
596
|
-
const endEl = (isDOMElement(endNode)
|
|
597
|
-
? endNode
|
|
598
|
-
: endNode.parentElement);
|
|
585
|
+
const endEl = (isDOMElement(endNode) ? endNode : endNode.parentElement);
|
|
599
586
|
const isEndAtZeroWidth = !!endEl.getAttribute('data-slate-zero-width');
|
|
600
587
|
domRange.setStart(startNode, isStartAtZeroWidth ? 1 : startOffset);
|
|
601
588
|
domRange.setEnd(endNode, isEndAtZeroWidth ? 1 : endOffset);
|
|
@@ -633,9 +620,7 @@ const AngularEditor = {
|
|
|
633
620
|
// coordinates are closest to.
|
|
634
621
|
if (Editor.isVoid(editor, node)) {
|
|
635
622
|
const rect = target.getBoundingClientRect();
|
|
636
|
-
const isPrev = editor.isInline(node)
|
|
637
|
-
? x - rect.left < rect.left + rect.width - x
|
|
638
|
-
: y - rect.top < rect.top + rect.height - y;
|
|
623
|
+
const isPrev = editor.isInline(node) ? x - rect.left < rect.left + rect.width - x : y - rect.top < rect.top + rect.height - y;
|
|
639
624
|
const edge = Editor.point(editor, path, {
|
|
640
625
|
edge: isPrev ? 'start' : 'end'
|
|
641
626
|
});
|
|
@@ -694,15 +679,11 @@ const AngularEditor = {
|
|
|
694
679
|
// forward
|
|
695
680
|
// and to the end of previous node
|
|
696
681
|
if (isCardLeftByTargetAttr(cardTargetAttr) && !isBackward) {
|
|
697
|
-
const endPath = blockPath[blockPath.length - 1] <= 0
|
|
698
|
-
? blockPath
|
|
699
|
-
: Path.previous(blockPath);
|
|
682
|
+
const endPath = blockPath[blockPath.length - 1] <= 0 ? blockPath : Path.previous(blockPath);
|
|
700
683
|
return Editor.end(editor, endPath);
|
|
701
684
|
}
|
|
702
685
|
// to the of current node
|
|
703
|
-
if ((isCardCenterByTargetAttr(cardTargetAttr) ||
|
|
704
|
-
isCardRightByTargetAttr(cardTargetAttr)) &&
|
|
705
|
-
!isBackward) {
|
|
686
|
+
if ((isCardCenterByTargetAttr(cardTargetAttr) || isCardRightByTargetAttr(cardTargetAttr)) && !isBackward) {
|
|
706
687
|
return Editor.end(editor, blockPath);
|
|
707
688
|
}
|
|
708
689
|
// backward
|
|
@@ -711,9 +692,7 @@ const AngularEditor = {
|
|
|
711
692
|
return Editor.start(editor, Path.next(blockPath));
|
|
712
693
|
}
|
|
713
694
|
// and to the start of current node
|
|
714
|
-
if ((isCardCenterByTargetAttr(cardTargetAttr) ||
|
|
715
|
-
isCardLeftByTargetAttr(cardTargetAttr)) &&
|
|
716
|
-
isBackward) {
|
|
695
|
+
if ((isCardCenterByTargetAttr(cardTargetAttr) || isCardLeftByTargetAttr(cardTargetAttr)) && isBackward) {
|
|
717
696
|
return Editor.start(editor, blockPath);
|
|
718
697
|
}
|
|
719
698
|
}
|
|
@@ -732,7 +711,7 @@ const AngularEditor = {
|
|
|
732
711
|
const contents = range.cloneContents();
|
|
733
712
|
const removals = [
|
|
734
713
|
...Array.prototype.slice.call(contents.querySelectorAll('[data-slate-zero-width]')),
|
|
735
|
-
...Array.prototype.slice.call(contents.querySelectorAll('[contenteditable=false]'))
|
|
714
|
+
...Array.prototype.slice.call(contents.querySelectorAll('[contenteditable=false]'))
|
|
736
715
|
];
|
|
737
716
|
removals.forEach(el => {
|
|
738
717
|
el.parentNode.removeChild(el);
|
|
@@ -759,9 +738,7 @@ const AngularEditor = {
|
|
|
759
738
|
// composition the ASCII characters will be prepended to the zero-width
|
|
760
739
|
// space, so subtract 1 from the offset to account for the zero-width
|
|
761
740
|
// space character.
|
|
762
|
-
if (domNode &&
|
|
763
|
-
offset === domNode.textContent.length &&
|
|
764
|
-
(parentNode && parentNode.hasAttribute('data-slate-zero-width'))) {
|
|
741
|
+
if (domNode && offset === domNode.textContent.length && parentNode && parentNode.hasAttribute('data-slate-zero-width')) {
|
|
765
742
|
offset--;
|
|
766
743
|
}
|
|
767
744
|
}
|
|
@@ -796,9 +773,7 @@ const AngularEditor = {
|
|
|
796
773
|
// (2020/08/08)
|
|
797
774
|
// https://bugs.chromium.org/p/chromium/issues/detail?id=447523
|
|
798
775
|
if (IS_CHROME && hasShadowRoot()) {
|
|
799
|
-
isCollapsed =
|
|
800
|
-
domRange.anchorNode === domRange.focusNode &&
|
|
801
|
-
domRange.anchorOffset === domRange.focusOffset;
|
|
776
|
+
isCollapsed = domRange.anchorNode === domRange.focusNode && domRange.anchorOffset === domRange.focusOffset;
|
|
802
777
|
}
|
|
803
778
|
else {
|
|
804
779
|
isCollapsed = domRange.isCollapsed;
|
|
@@ -823,22 +798,20 @@ const AngularEditor = {
|
|
|
823
798
|
return Element.isElement(node) && !editor.isInline(node) && Editor.hasInlines(editor, node);
|
|
824
799
|
},
|
|
825
800
|
isBlockCardLeftCursor(editor) {
|
|
826
|
-
return editor.selection.anchor.offset === FAKE_LEFT_BLOCK_CARD_OFFSET && editor.selection.focus.offset === FAKE_LEFT_BLOCK_CARD_OFFSET;
|
|
801
|
+
return (editor.selection.anchor.offset === FAKE_LEFT_BLOCK_CARD_OFFSET && editor.selection.focus.offset === FAKE_LEFT_BLOCK_CARD_OFFSET);
|
|
827
802
|
},
|
|
828
803
|
isBlockCardRightCursor(editor) {
|
|
829
|
-
return editor.selection.anchor.offset === FAKE_RIGHT_BLOCK_CARD_OFFSET &&
|
|
804
|
+
return (editor.selection.anchor.offset === FAKE_RIGHT_BLOCK_CARD_OFFSET &&
|
|
805
|
+
editor.selection.focus.offset === FAKE_RIGHT_BLOCK_CARD_OFFSET);
|
|
830
806
|
},
|
|
831
807
|
getCardCursorNode(editor, blockCardNode, options) {
|
|
832
808
|
const blockCardElement = AngularEditor.toDOMNode(editor, blockCardNode);
|
|
833
809
|
const cardCenter = blockCardElement.parentElement;
|
|
834
|
-
return options.direction === 'left'
|
|
835
|
-
? cardCenter.previousElementSibling
|
|
836
|
-
: cardCenter.nextElementSibling;
|
|
810
|
+
return options.direction === 'left' ? cardCenter.previousElementSibling : cardCenter.nextElementSibling;
|
|
837
811
|
},
|
|
838
812
|
toSlateCardEntry(editor, node) {
|
|
839
813
|
var _a;
|
|
840
|
-
const element = (_a = node.parentElement
|
|
841
|
-
.closest('.slate-block-card')) === null || _a === void 0 ? void 0 : _a.querySelector('[card-target="card-center"]').firstElementChild;
|
|
814
|
+
const element = (_a = node.parentElement.closest('.slate-block-card')) === null || _a === void 0 ? void 0 : _a.querySelector('[card-target="card-center"]').firstElementChild;
|
|
842
815
|
const slateNode = AngularEditor.toSlateNode(editor, element);
|
|
843
816
|
const path = AngularEditor.findPath(editor, slateNode);
|
|
844
817
|
return [slateNode, path];
|
|
@@ -862,13 +835,16 @@ const AngularEditor = {
|
|
|
862
835
|
* @param options
|
|
863
836
|
*/
|
|
864
837
|
moveBlockCardCursor(editor, path, options) {
|
|
865
|
-
const cursor = {
|
|
838
|
+
const cursor = {
|
|
839
|
+
path,
|
|
840
|
+
offset: options.direction === 'left' ? FAKE_LEFT_BLOCK_CARD_OFFSET : FAKE_RIGHT_BLOCK_CARD_OFFSET
|
|
841
|
+
};
|
|
866
842
|
Transforms.select(editor, { anchor: cursor, focus: cursor });
|
|
867
843
|
},
|
|
868
844
|
hasRange(editor, range) {
|
|
869
845
|
const { anchor, focus } = range;
|
|
870
|
-
return
|
|
871
|
-
}
|
|
846
|
+
return Editor.hasPath(editor, anchor.path) && Editor.hasPath(editor, focus.path);
|
|
847
|
+
}
|
|
872
848
|
};
|
|
873
849
|
|
|
874
850
|
/**
|
|
@@ -1000,16 +976,13 @@ const isDecoratorRangeListEqual = (list, another) => {
|
|
|
1000
976
|
return true;
|
|
1001
977
|
};
|
|
1002
978
|
|
|
1003
|
-
const isValid = (value) => (Element.isElement(value) &&
|
|
1004
|
-
value.children.length > 0 &&
|
|
1005
|
-
value.children.every((child) => isValid(child))) ||
|
|
979
|
+
const isValid = (value) => (Element.isElement(value) && value.children.length > 0 && value.children.every(child => isValid(child))) ||
|
|
1006
980
|
Text$1.isText(value);
|
|
1007
981
|
const check = (document) => {
|
|
1008
|
-
return document.every(
|
|
1009
|
-
;
|
|
982
|
+
return document.every(value => Element.isElement(value) && isValid(value));
|
|
1010
983
|
};
|
|
1011
984
|
function normalize(document) {
|
|
1012
|
-
return document.filter(
|
|
985
|
+
return document.filter(value => Element.isElement(value) && isValid(value));
|
|
1013
986
|
}
|
|
1014
987
|
|
|
1015
988
|
/**
|
|
@@ -1066,7 +1039,7 @@ const withAngular = (editor, clipboardFormatKey = 'x-slate-fragment') => {
|
|
|
1066
1039
|
if (editor.selection && Range.isCollapsed(editor.selection)) {
|
|
1067
1040
|
const parentBlockEntry = Editor.above(editor, {
|
|
1068
1041
|
match: n => Editor.isBlock(editor, n),
|
|
1069
|
-
at: editor.selection
|
|
1042
|
+
at: editor.selection
|
|
1070
1043
|
});
|
|
1071
1044
|
if (parentBlockEntry) {
|
|
1072
1045
|
const [, parentBlockPath] = parentBlockEntry;
|
|
@@ -1095,7 +1068,7 @@ const withAngular = (editor, clipboardFormatKey = 'x-slate-fragment') => {
|
|
|
1095
1068
|
case 'merge_node':
|
|
1096
1069
|
case 'split_node': {
|
|
1097
1070
|
for (const [node, path] of Editor.levels(e, {
|
|
1098
|
-
at: Path.parent(op.path)
|
|
1071
|
+
at: Path.parent(op.path)
|
|
1099
1072
|
})) {
|
|
1100
1073
|
const key = AngularEditor.findKey(e, node);
|
|
1101
1074
|
matches.push([path, key]);
|
|
@@ -1104,11 +1077,15 @@ const withAngular = (editor, clipboardFormatKey = 'x-slate-fragment') => {
|
|
|
1104
1077
|
}
|
|
1105
1078
|
case 'move_node': {
|
|
1106
1079
|
const commonPath = Path.common(Path.parent(op.path), Path.parent(op.newPath));
|
|
1107
|
-
for (const [node, path] of Editor.levels(e, {
|
|
1080
|
+
for (const [node, path] of Editor.levels(e, {
|
|
1081
|
+
at: Path.parent(op.path)
|
|
1082
|
+
})) {
|
|
1108
1083
|
const key = AngularEditor.findKey(e, node);
|
|
1109
1084
|
matches.push([Editor.pathRef(editor, path), key]);
|
|
1110
1085
|
}
|
|
1111
|
-
for (const [node, path] of Editor.levels(e, {
|
|
1086
|
+
for (const [node, path] of Editor.levels(e, {
|
|
1087
|
+
at: Path.parent(op.newPath)
|
|
1088
|
+
})) {
|
|
1112
1089
|
if (path.length > commonPath.length) {
|
|
1113
1090
|
const key = AngularEditor.findKey(e, node);
|
|
1114
1091
|
matches.push([Editor.pathRef(editor, path), key]);
|
|
@@ -1226,8 +1203,7 @@ const withAngular = (editor, clipboardFormatKey = 'x-slate-fragment') => {
|
|
|
1226
1203
|
/**
|
|
1227
1204
|
* Checking copied fragment from application/x-slate-fragment or data-slate-fragment
|
|
1228
1205
|
*/
|
|
1229
|
-
const fragment = data.getData(`application/${clipboardFormatKey}`) ||
|
|
1230
|
-
getSlateFragmentAttribute(data);
|
|
1206
|
+
const fragment = data.getData(`application/${clipboardFormatKey}`) || getSlateFragmentAttribute(data);
|
|
1231
1207
|
if (fragment) {
|
|
1232
1208
|
const decoded = decodeURIComponent(window.atob(fragment));
|
|
1233
1209
|
const parsed = JSON.parse(decoded);
|
|
@@ -1254,7 +1230,7 @@ const withAngular = (editor, clipboardFormatKey = 'x-slate-fragment') => {
|
|
|
1254
1230
|
};
|
|
1255
1231
|
e.onKeydown = () => { };
|
|
1256
1232
|
e.onClick = () => { };
|
|
1257
|
-
e.isBlockCard =
|
|
1233
|
+
e.isBlockCard = element => false;
|
|
1258
1234
|
e.onError = (errorData) => {
|
|
1259
1235
|
if (errorData.nativeError) {
|
|
1260
1236
|
console.error(errorData.nativeError);
|
|
@@ -1598,7 +1574,7 @@ const BEFORE_INPUT_EVENTS = [
|
|
|
1598
1574
|
{ name: 'keypress', handler: null, isTriggerBeforeInput: true },
|
|
1599
1575
|
{ name: 'keyup', handler: 'onKeyUp', isTriggerBeforeInput: true },
|
|
1600
1576
|
{ name: 'mousedown', handler: 'onMouseDown', isTriggerBeforeInput: true },
|
|
1601
|
-
{ name: 'textInput', handler: null, isTriggerBeforeInput: true }
|
|
1577
|
+
{ name: 'textInput', handler: null, isTriggerBeforeInput: true }
|
|
1602
1578
|
// { name: 'paste', handler: 'onPaste', isTriggerBeforeInput: true }
|
|
1603
1579
|
];
|
|
1604
1580
|
|
|
@@ -1614,17 +1590,46 @@ var SlateErrorCode;
|
|
|
1614
1590
|
SlateErrorCode[SlateErrorCode["InvalidValueError"] = 4100] = "InvalidValueError";
|
|
1615
1591
|
})(SlateErrorCode || (SlateErrorCode = {}));
|
|
1616
1592
|
|
|
1593
|
+
function restoreDom(editor, execute) {
|
|
1594
|
+
const editable = EDITOR_TO_ELEMENT.get(editor);
|
|
1595
|
+
let observer = new MutationObserver(mutations => {
|
|
1596
|
+
mutations.reverse().forEach(mutation => {
|
|
1597
|
+
if (mutation.type === 'characterData') {
|
|
1598
|
+
// We don't want to restore the DOM for characterData mutations
|
|
1599
|
+
// because this interrupts the composition.
|
|
1600
|
+
return;
|
|
1601
|
+
}
|
|
1602
|
+
mutation.removedNodes.forEach(node => {
|
|
1603
|
+
mutation.target.insertBefore(node, mutation.nextSibling);
|
|
1604
|
+
});
|
|
1605
|
+
mutation.addedNodes.forEach(node => {
|
|
1606
|
+
mutation.target.removeChild(node);
|
|
1607
|
+
});
|
|
1608
|
+
});
|
|
1609
|
+
disconnect();
|
|
1610
|
+
execute();
|
|
1611
|
+
});
|
|
1612
|
+
const disconnect = () => {
|
|
1613
|
+
observer.disconnect();
|
|
1614
|
+
observer = null;
|
|
1615
|
+
};
|
|
1616
|
+
observer.observe(editable, { subtree: true, childList: true, characterData: true, characterDataOldValue: true });
|
|
1617
|
+
setTimeout(() => {
|
|
1618
|
+
if (observer) {
|
|
1619
|
+
disconnect();
|
|
1620
|
+
execute();
|
|
1621
|
+
}
|
|
1622
|
+
}, 0);
|
|
1623
|
+
}
|
|
1624
|
+
|
|
1617
1625
|
class SlateStringTemplateComponent {
|
|
1618
1626
|
}
|
|
1619
1627
|
SlateStringTemplateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateStringTemplateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1620
|
-
SlateStringTemplateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SlateStringTemplateComponent, selector: "slate-string-template", viewQueries: [{ propertyName: "
|
|
1628
|
+
SlateStringTemplateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SlateStringTemplateComponent, selector: "slate-string-template", viewQueries: [{ propertyName: "compatStringTemplate", first: true, predicate: ["compatStringTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "emptyStringTemplate", first: true, predicate: ["emptyStringTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "emptyTextTemplate", first: true, predicate: ["emptyTextTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "lineBreakEmptyStringTemplate", first: true, predicate: ["lineBreakEmptyStringTemplate"], descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: "<ng-template #compatStringTemplate let-context=\"context\" let-viewContext=\"viewContext\">\n <!-- Compatible with Chinese input in Chrome with \\n -->\n <span editable-text data-slate-string=\"true\"\n >{{ context.text }}<span data-slate-zero-width>{{ '\\uFEFF' }}</span></span\n >\n</ng-template>\n<ng-template #emptyStringTemplate let-context=\"context\" let-viewContext=\"viewContext\">\n <span editable-text data-slate-zero-width=\"z\" attr.data-slate-length=\"{{ context.elementStringLength }}\">{{ '\\uFEFF' }}</span>\n</ng-template>\n<ng-template #emptyTextTemplate let-context=\"context\" let-viewContext=\"viewContext\">\n <span editable-text data-slate-zero-width=\"z\" data-slate-length=\"0\">{{ '\\uFEFF' }}</span>\n</ng-template>\n<ng-template #lineBreakEmptyStringTemplate let-context=\"context\" let-viewContext=\"viewContext\">\n <span editable-text data-slate-zero-width=\"n\" attr.data-slate-length=\"{{ context.elementStringLength }}\">{{ '\\uFEFF' }}<br /></span>\n</ng-template>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1621
1629
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateStringTemplateComponent, decorators: [{
|
|
1622
1630
|
type: Component,
|
|
1623
|
-
args: [{ selector: 'slate-string-template', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #
|
|
1624
|
-
}], propDecorators: {
|
|
1625
|
-
type: ViewChild,
|
|
1626
|
-
args: ['stringTemplate', { read: TemplateRef, static: true }]
|
|
1627
|
-
}], compatStringTemplate: [{
|
|
1631
|
+
args: [{ selector: 'slate-string-template', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #compatStringTemplate let-context=\"context\" let-viewContext=\"viewContext\">\n <!-- Compatible with Chinese input in Chrome with \\n -->\n <span editable-text data-slate-string=\"true\"\n >{{ context.text }}<span data-slate-zero-width>{{ '\\uFEFF' }}</span></span\n >\n</ng-template>\n<ng-template #emptyStringTemplate let-context=\"context\" let-viewContext=\"viewContext\">\n <span editable-text data-slate-zero-width=\"z\" attr.data-slate-length=\"{{ context.elementStringLength }}\">{{ '\\uFEFF' }}</span>\n</ng-template>\n<ng-template #emptyTextTemplate let-context=\"context\" let-viewContext=\"viewContext\">\n <span editable-text data-slate-zero-width=\"z\" data-slate-length=\"0\">{{ '\\uFEFF' }}</span>\n</ng-template>\n<ng-template #lineBreakEmptyStringTemplate let-context=\"context\" let-viewContext=\"viewContext\">\n <span editable-text data-slate-zero-width=\"n\" attr.data-slate-length=\"{{ context.elementStringLength }}\">{{ '\\uFEFF' }}<br /></span>\n</ng-template>\n" }]
|
|
1632
|
+
}], propDecorators: { compatStringTemplate: [{
|
|
1628
1633
|
type: ViewChild,
|
|
1629
1634
|
args: ['compatStringTemplate', { read: TemplateRef, static: true }]
|
|
1630
1635
|
}], emptyStringTemplate: [{
|
|
@@ -1635,7 +1640,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImpor
|
|
|
1635
1640
|
args: ['emptyTextTemplate', { read: TemplateRef, static: true }]
|
|
1636
1641
|
}], lineBreakEmptyStringTemplate: [{
|
|
1637
1642
|
type: ViewChild,
|
|
1638
|
-
args: ['lineBreakEmptyStringTemplate', {
|
|
1643
|
+
args: ['lineBreakEmptyStringTemplate', {
|
|
1644
|
+
read: TemplateRef,
|
|
1645
|
+
static: true
|
|
1646
|
+
}]
|
|
1639
1647
|
}] } });
|
|
1640
1648
|
|
|
1641
1649
|
class SlateBlockCardComponent {
|
|
@@ -1653,17 +1661,17 @@ class SlateBlockCardComponent {
|
|
|
1653
1661
|
this.nativeElement.classList.add(`slate-block-card`);
|
|
1654
1662
|
}
|
|
1655
1663
|
append() {
|
|
1656
|
-
this.centerRootNodes.forEach(
|
|
1664
|
+
this.centerRootNodes.forEach(rootNode => !this.centerContainerElement.contains(rootNode) && this.centerContainerElement.appendChild(rootNode));
|
|
1657
1665
|
}
|
|
1658
1666
|
initializeCenter(rootNodes) {
|
|
1659
1667
|
this.centerRootNodes = rootNodes;
|
|
1660
1668
|
}
|
|
1661
1669
|
}
|
|
1662
1670
|
SlateBlockCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateBlockCardComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1663
|
-
SlateBlockCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SlateBlockCardComponent, selector: "slate-block-card, [slateBlockCard]", viewQueries: [{ propertyName: "centerContianer", first: true, predicate: ["centerContianer"], descendants: true, static: true }], ngImport: i0, template: "<span card-target=\"card-left\" class=\"card-left\">{{
|
|
1671
|
+
SlateBlockCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SlateBlockCardComponent, selector: "slate-block-card, [slateBlockCard]", viewQueries: [{ propertyName: "centerContianer", first: true, predicate: ["centerContianer"], descendants: true, static: true }], ngImport: i0, template: "<span card-target=\"card-left\" class=\"card-left\">{{ '\\uFEFF' }}</span>\n<div card-target=\"card-center\" #centerContianer></div>\n<span card-target=\"card-right\" class=\"card-right\">{{ '\\uFEFF' }}</span>\n" });
|
|
1664
1672
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateBlockCardComponent, decorators: [{
|
|
1665
1673
|
type: Component,
|
|
1666
|
-
args: [{ selector: 'slate-block-card, [slateBlockCard]', template: "<span card-target=\"card-left\" class=\"card-left\">{{
|
|
1674
|
+
args: [{ selector: 'slate-block-card, [slateBlockCard]', template: "<span card-target=\"card-left\" class=\"card-left\">{{ '\\uFEFF' }}</span>\n<div card-target=\"card-center\" #centerContianer></div>\n<span card-target=\"card-right\" class=\"card-right\">{{ '\\uFEFF' }}</span>\n" }]
|
|
1667
1675
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { centerContianer: [{
|
|
1668
1676
|
type: ViewChild,
|
|
1669
1677
|
args: ['centerContianer', { static: true }]
|
|
@@ -1680,7 +1688,7 @@ class ViewContainerItem {
|
|
|
1680
1688
|
}
|
|
1681
1689
|
getRootNodes() {
|
|
1682
1690
|
if (this.embeddedViewRef) {
|
|
1683
|
-
return this.embeddedViewRef.rootNodes.filter(
|
|
1691
|
+
return this.embeddedViewRef.rootNodes.filter(rootNode => isDOMElement(rootNode));
|
|
1684
1692
|
}
|
|
1685
1693
|
if (this.componentRef) {
|
|
1686
1694
|
return [this.componentRef.instance.nativeElement];
|
|
@@ -1706,7 +1714,10 @@ class ViewContainerItem {
|
|
|
1706
1714
|
this.viewType = this.getViewType();
|
|
1707
1715
|
const context = this.getContext();
|
|
1708
1716
|
if (isTemplateRef(this.viewType)) {
|
|
1709
|
-
this.embeddedViewContext = {
|
|
1717
|
+
this.embeddedViewContext = {
|
|
1718
|
+
context,
|
|
1719
|
+
viewContext: this.viewContext
|
|
1720
|
+
};
|
|
1710
1721
|
const embeddedViewRef = this.viewContainerRef.createEmbeddedView(this.viewType, this.embeddedViewContext);
|
|
1711
1722
|
this.embeddedViewRef = embeddedViewRef;
|
|
1712
1723
|
}
|
|
@@ -1738,9 +1749,12 @@ class ViewContainerItem {
|
|
|
1738
1749
|
this.viewType = viewType;
|
|
1739
1750
|
const firstRootNode = this.rootNodes[0];
|
|
1740
1751
|
if (isTemplateRef(this.viewType)) {
|
|
1741
|
-
this.embeddedViewContext = {
|
|
1752
|
+
this.embeddedViewContext = {
|
|
1753
|
+
context,
|
|
1754
|
+
viewContext: this.viewContext
|
|
1755
|
+
};
|
|
1742
1756
|
const embeddedViewRef = this.viewContainerRef.createEmbeddedView(this.viewType, this.embeddedViewContext);
|
|
1743
|
-
firstRootNode.replaceWith(...embeddedViewRef.rootNodes.filter(
|
|
1757
|
+
firstRootNode.replaceWith(...embeddedViewRef.rootNodes.filter(rootNode => isDOMElement(rootNode)));
|
|
1744
1758
|
this.destroyView();
|
|
1745
1759
|
this.embeddedViewRef = embeddedViewRef;
|
|
1746
1760
|
}
|
|
@@ -2008,7 +2022,7 @@ class ViewContainer {
|
|
|
2008
2022
|
parentElement.insertBefore(this.createFragment(), this.elementRef.nativeElement);
|
|
2009
2023
|
this.elementRef.nativeElement.remove();
|
|
2010
2024
|
}
|
|
2011
|
-
this.childrenComponent.changes.subscribe(
|
|
2025
|
+
this.childrenComponent.changes.subscribe(value => {
|
|
2012
2026
|
const iterableChanges = differ.diff(this.childrenComponent);
|
|
2013
2027
|
if (iterableChanges) {
|
|
2014
2028
|
iterableChanges.forEachOperation((record, previousIndex, currentIndex) => {
|
|
@@ -2061,7 +2075,7 @@ class ViewContainer {
|
|
|
2061
2075
|
// insert afterend of previous component end
|
|
2062
2076
|
let previousRootNode = this.getPreviousRootNode(record.currentIndex);
|
|
2063
2077
|
if (previousRootNode) {
|
|
2064
|
-
record.item.rootNodes.forEach(
|
|
2078
|
+
record.item.rootNodes.forEach(rootNode => {
|
|
2065
2079
|
previousRootNode.insertAdjacentElement('afterend', rootNode);
|
|
2066
2080
|
previousRootNode = rootNode;
|
|
2067
2081
|
});
|
|
@@ -2086,6 +2100,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImpor
|
|
|
2086
2100
|
type: Input
|
|
2087
2101
|
}] } });
|
|
2088
2102
|
|
|
2103
|
+
class SlateDefaultStringComponent extends BaseComponent {
|
|
2104
|
+
constructor(elementRef, cdr) {
|
|
2105
|
+
super(elementRef, cdr);
|
|
2106
|
+
this.elementRef = elementRef;
|
|
2107
|
+
this.cdr = cdr;
|
|
2108
|
+
}
|
|
2109
|
+
onContextChange() {
|
|
2110
|
+
// Avoid breaking some browser default behaviors, such as spellCheck, android composition input state
|
|
2111
|
+
if (this.nativeElement.textContent !== this.context.text) {
|
|
2112
|
+
this.nativeElement.textContent = this.context.text;
|
|
2113
|
+
}
|
|
2114
|
+
}
|
|
2115
|
+
ngOnInit() {
|
|
2116
|
+
this.nativeElement.setAttribute('editable-text', '');
|
|
2117
|
+
this.nativeElement.setAttribute('data-slate-string', 'true');
|
|
2118
|
+
}
|
|
2119
|
+
}
|
|
2120
|
+
SlateDefaultStringComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateDefaultStringComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2121
|
+
SlateDefaultStringComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SlateDefaultStringComponent, selector: "span[slateDefaultString]", usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2122
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateDefaultStringComponent, decorators: [{
|
|
2123
|
+
type: Component,
|
|
2124
|
+
args: [{
|
|
2125
|
+
selector: 'span[slateDefaultString]',
|
|
2126
|
+
template: '',
|
|
2127
|
+
changeDetection: ChangeDetectionStrategy.OnPush
|
|
2128
|
+
}]
|
|
2129
|
+
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; } });
|
|
2130
|
+
|
|
2089
2131
|
class SlateStringComponent extends ViewContainerItem {
|
|
2090
2132
|
constructor(elementRef, viewContainerRef) {
|
|
2091
2133
|
super(viewContainerRef);
|
|
@@ -2132,10 +2174,13 @@ class SlateStringComponent extends ViewContainerItem {
|
|
|
2132
2174
|
if (this.context.isLast && this.context.leaf.text.slice(-1) === '\n') {
|
|
2133
2175
|
return this.viewContext.templateComponent.compatStringTemplate;
|
|
2134
2176
|
}
|
|
2135
|
-
return
|
|
2177
|
+
return SlateDefaultStringComponent;
|
|
2136
2178
|
}
|
|
2137
2179
|
getContext() {
|
|
2138
|
-
return {
|
|
2180
|
+
return {
|
|
2181
|
+
text: this.context.leaf.text,
|
|
2182
|
+
elementStringLength: Node.string(this.context.parent).length
|
|
2183
|
+
};
|
|
2139
2184
|
}
|
|
2140
2185
|
memoizedContext(prev, next) {
|
|
2141
2186
|
return false;
|
|
@@ -2165,12 +2210,12 @@ class SlateDefaultLeafComponent extends BaseLeafComponent {
|
|
|
2165
2210
|
}
|
|
2166
2211
|
}
|
|
2167
2212
|
SlateDefaultLeafComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateDefaultLeafComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2168
|
-
SlateDefaultLeafComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SlateDefaultLeafComponent, selector: "span[slateDefaultLeaf]", host: { attributes: { "data-slate-leaf": "true" } }, usesInheritance: true, ngImport: i0, template: `<span slateString [context]="context" [viewContext]="viewContext"><span>`, isInline: true, dependencies: [{ kind: "component", type: SlateStringComponent, selector: "span[slateString]", inputs: ["context"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2213
|
+
SlateDefaultLeafComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SlateDefaultLeafComponent, selector: "span[slateDefaultLeaf]", host: { attributes: { "data-slate-leaf": "true" } }, usesInheritance: true, ngImport: i0, template: `<span slateString [context]="context" [viewContext]="viewContext"><span></span></span>`, isInline: true, dependencies: [{ kind: "component", type: SlateStringComponent, selector: "span[slateString]", inputs: ["context"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2169
2214
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateDefaultLeafComponent, decorators: [{
|
|
2170
2215
|
type: Component,
|
|
2171
2216
|
args: [{
|
|
2172
2217
|
selector: 'span[slateDefaultLeaf]',
|
|
2173
|
-
template: `<span slateString [context]="context" [viewContext]="viewContext"><span>`,
|
|
2218
|
+
template: `<span slateString [context]="context" [viewContext]="viewContext"><span></span></span>`,
|
|
2174
2219
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
2175
2220
|
host: {
|
|
2176
2221
|
'data-slate-leaf': 'true'
|
|
@@ -2186,7 +2231,7 @@ class SlateLeafComponent extends ViewContainerItem {
|
|
|
2186
2231
|
return this.context;
|
|
2187
2232
|
}
|
|
2188
2233
|
getViewType() {
|
|
2189
|
-
return this.viewContext.renderLeaf && this.viewContext.renderLeaf(this.context.leaf) || SlateDefaultLeafComponent;
|
|
2234
|
+
return (this.viewContext.renderLeaf && this.viewContext.renderLeaf(this.context.leaf)) || SlateDefaultLeafComponent;
|
|
2190
2235
|
}
|
|
2191
2236
|
memoizedContext(prev, next) {
|
|
2192
2237
|
return false;
|
|
@@ -2205,7 +2250,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImpor
|
|
|
2205
2250
|
args: [{
|
|
2206
2251
|
selector: 'slate-leaf',
|
|
2207
2252
|
template: '',
|
|
2208
|
-
changeDetection: ChangeDetectionStrategy.OnPush
|
|
2253
|
+
changeDetection: ChangeDetectionStrategy.OnPush
|
|
2209
2254
|
}]
|
|
2210
2255
|
}], propDecorators: { context: [{
|
|
2211
2256
|
type: Input
|
|
@@ -2250,19 +2295,21 @@ class SlateLeavesComponent extends ViewContainer {
|
|
|
2250
2295
|
}
|
|
2251
2296
|
SlateLeavesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateLeavesComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2252
2297
|
SlateLeavesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SlateLeavesComponent, selector: "slate-leaves", inputs: { context: "context" }, viewQueries: [{ propertyName: "childrenComponent", predicate: SlateLeafComponent, descendants: true, read: SlateLeafComponent }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `<slate-leaf
|
|
2253
|
-
|
|
2254
|
-
|
|
2255
|
-
|
|
2256
|
-
|
|
2298
|
+
[context]="context"
|
|
2299
|
+
[viewContext]="viewContext"
|
|
2300
|
+
[viewContext]="viewContext"
|
|
2301
|
+
*ngFor="let context of leafContexts; trackBy: trackBy"
|
|
2302
|
+
></slate-leaf>`, isInline: true, dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: SlateLeafComponent, selector: "slate-leaf", inputs: ["context"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2257
2303
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateLeavesComponent, decorators: [{
|
|
2258
2304
|
type: Component,
|
|
2259
2305
|
args: [{
|
|
2260
2306
|
selector: 'slate-leaves',
|
|
2261
2307
|
template: `<slate-leaf
|
|
2262
|
-
|
|
2263
|
-
|
|
2264
|
-
|
|
2265
|
-
|
|
2308
|
+
[context]="context"
|
|
2309
|
+
[viewContext]="viewContext"
|
|
2310
|
+
[viewContext]="viewContext"
|
|
2311
|
+
*ngFor="let context of leafContexts; trackBy: trackBy"
|
|
2312
|
+
></slate-leaf>`,
|
|
2266
2313
|
changeDetection: ChangeDetectionStrategy.OnPush
|
|
2267
2314
|
}]
|
|
2268
2315
|
}], propDecorators: { context: [{
|
|
@@ -2310,8 +2357,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImpor
|
|
|
2310
2357
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
2311
2358
|
host: {
|
|
2312
2359
|
'[attr.contenteditable]': 'isLeafBlock',
|
|
2313
|
-
'data-slate-spacer':
|
|
2314
|
-
|
|
2360
|
+
'data-slate-spacer': 'true',
|
|
2361
|
+
class: 'slate-spacer',
|
|
2315
2362
|
'data-slate-node': 'text'
|
|
2316
2363
|
}
|
|
2317
2364
|
}]
|
|
@@ -2393,7 +2440,10 @@ class SlateDescendantComponent extends ViewContainerItem {
|
|
|
2393
2440
|
return { selection: sel, decorations: ds };
|
|
2394
2441
|
}
|
|
2395
2442
|
catch (error) {
|
|
2396
|
-
this.viewContext.editor.onError({
|
|
2443
|
+
this.viewContext.editor.onError({
|
|
2444
|
+
code: SlateErrorCode.GetStartPointError,
|
|
2445
|
+
nativeError: error
|
|
2446
|
+
});
|
|
2397
2447
|
return { selection: null, decorations: [] };
|
|
2398
2448
|
}
|
|
2399
2449
|
}
|
|
@@ -2434,7 +2484,9 @@ class SlateDescendantComponent extends ViewContainerItem {
|
|
|
2434
2484
|
}
|
|
2435
2485
|
else {
|
|
2436
2486
|
const isVoid = this.viewContext.editor.isVoid(this.context.parent);
|
|
2437
|
-
return isVoid
|
|
2487
|
+
return isVoid
|
|
2488
|
+
? SlateVoidTextComponent
|
|
2489
|
+
: (this.viewContext.renderText && this.viewContext.renderText(this.descendant)) || SlateDefaultTextComponent;
|
|
2438
2490
|
}
|
|
2439
2491
|
}
|
|
2440
2492
|
memoizedElementContext(prev, next) {
|
|
@@ -2442,10 +2494,7 @@ class SlateDescendantComponent extends ViewContainerItem {
|
|
|
2442
2494
|
(!this.viewContext.isStrictDecorate || prev.decorate === next.decorate) &&
|
|
2443
2495
|
prev.readonly === next.readonly &&
|
|
2444
2496
|
isDecoratorRangeListEqual(prev.decorations, next.decorations) &&
|
|
2445
|
-
(prev.selection === next.selection ||
|
|
2446
|
-
(!!prev.selection &&
|
|
2447
|
-
!!next.selection &&
|
|
2448
|
-
Range.equals(prev.selection, next.selection))));
|
|
2497
|
+
(prev.selection === next.selection || (!!prev.selection && !!next.selection && Range.equals(prev.selection, next.selection))));
|
|
2449
2498
|
}
|
|
2450
2499
|
memoizedTextContext(prev, next) {
|
|
2451
2500
|
return (next.parent === prev.parent &&
|
|
@@ -2493,26 +2542,29 @@ class SlateChildrenComponent extends ViewContainer {
|
|
|
2493
2542
|
return this.viewContext.trackBy(node) || AngularEditor.findKey(this.viewContext.editor, node);
|
|
2494
2543
|
};
|
|
2495
2544
|
}
|
|
2496
|
-
ngOnInit() {
|
|
2497
|
-
}
|
|
2545
|
+
ngOnInit() { }
|
|
2498
2546
|
}
|
|
2499
2547
|
SlateChildrenComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateChildrenComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2500
|
-
SlateChildrenComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SlateChildrenComponent, selector: "slate-children", inputs: { children: "children", context: "context", viewContext: "viewContext" }, viewQueries: [{ propertyName: "childrenComponent", predicate: SlateDescendantComponent, descendants: true, read: SlateDescendantComponent }], usesInheritance: true, ngImport: i0, template: `<slate-descendant
|
|
2501
|
-
|
|
2502
|
-
|
|
2503
|
-
|
|
2504
|
-
|
|
2505
|
-
|
|
2548
|
+
SlateChildrenComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SlateChildrenComponent, selector: "slate-children", inputs: { children: "children", context: "context", viewContext: "viewContext" }, viewQueries: [{ propertyName: "childrenComponent", predicate: SlateDescendantComponent, descendants: true, read: SlateDescendantComponent }], usesInheritance: true, ngImport: i0, template: `<slate-descendant
|
|
2549
|
+
[descendant]="descendant"
|
|
2550
|
+
[context]="context"
|
|
2551
|
+
[viewContext]="viewContext"
|
|
2552
|
+
[viewContext]="viewContext"
|
|
2553
|
+
[index]="index"
|
|
2554
|
+
*ngFor="let descendant of children; let index = index; trackBy: trackBy"
|
|
2555
|
+
></slate-descendant>`, isInline: true, dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: SlateDescendantComponent, selector: "slate-descendant", inputs: ["descendant", "context", "viewContext", "index"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2506
2556
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateChildrenComponent, decorators: [{
|
|
2507
2557
|
type: Component,
|
|
2508
2558
|
args: [{
|
|
2509
2559
|
selector: 'slate-children',
|
|
2510
|
-
template: `<slate-descendant
|
|
2511
|
-
|
|
2512
|
-
|
|
2513
|
-
|
|
2514
|
-
|
|
2515
|
-
|
|
2560
|
+
template: `<slate-descendant
|
|
2561
|
+
[descendant]="descendant"
|
|
2562
|
+
[context]="context"
|
|
2563
|
+
[viewContext]="viewContext"
|
|
2564
|
+
[viewContext]="viewContext"
|
|
2565
|
+
[index]="index"
|
|
2566
|
+
*ngFor="let descendant of children; let index = index; trackBy: trackBy"
|
|
2567
|
+
></slate-descendant>`,
|
|
2516
2568
|
changeDetection: ChangeDetectionStrategy.OnPush
|
|
2517
2569
|
}]
|
|
2518
2570
|
}], propDecorators: { children: [{
|
|
@@ -2581,7 +2633,7 @@ class SlateEditableComponent {
|
|
|
2581
2633
|
// remove unused DOM, just keep templateComponent instance
|
|
2582
2634
|
this.templateElementRef.nativeElement.remove();
|
|
2583
2635
|
// add browser class
|
|
2584
|
-
let browserClass = IS_FIREFOX ? 'firefox' :
|
|
2636
|
+
let browserClass = IS_FIREFOX ? 'firefox' : IS_SAFARI ? 'safari' : '';
|
|
2585
2637
|
browserClass && this.elementRef.nativeElement.classList.add(browserClass);
|
|
2586
2638
|
}
|
|
2587
2639
|
ngOnChanges(simpleChanges) {
|
|
@@ -2658,7 +2710,7 @@ class SlateEditableComponent {
|
|
|
2658
2710
|
const root = AngularEditor.findDocumentOrShadowRoot(this.editor);
|
|
2659
2711
|
const { activeElement } = root;
|
|
2660
2712
|
const domSelection = root.getSelection();
|
|
2661
|
-
if (this.isComposing || !domSelection || !AngularEditor.isFocused(this.editor)) {
|
|
2713
|
+
if ((this.isComposing && !IS_ANDROID) || !domSelection || !AngularEditor.isFocused(this.editor)) {
|
|
2662
2714
|
return;
|
|
2663
2715
|
}
|
|
2664
2716
|
const hasDomSelection = domSelection.type !== 'None';
|
|
@@ -2722,17 +2774,19 @@ class SlateEditableComponent {
|
|
|
2722
2774
|
});
|
|
2723
2775
|
}
|
|
2724
2776
|
catch (error) {
|
|
2725
|
-
this.editor.onError({
|
|
2777
|
+
this.editor.onError({
|
|
2778
|
+
code: SlateErrorCode.ToNativeSelectionError,
|
|
2779
|
+
nativeError: error
|
|
2780
|
+
});
|
|
2781
|
+
this.isUpdatingSelection = false;
|
|
2726
2782
|
}
|
|
2727
2783
|
}
|
|
2728
2784
|
onChange() {
|
|
2729
2785
|
this.forceFlush();
|
|
2730
2786
|
this.onChangeCallback(this.editor.children);
|
|
2731
2787
|
}
|
|
2732
|
-
ngAfterViewChecked() {
|
|
2733
|
-
}
|
|
2734
|
-
ngDoCheck() {
|
|
2735
|
-
}
|
|
2788
|
+
ngAfterViewChecked() { }
|
|
2789
|
+
ngDoCheck() { }
|
|
2736
2790
|
forceFlush() {
|
|
2737
2791
|
this.detectContext();
|
|
2738
2792
|
this.cdr.detectChanges();
|
|
@@ -2752,7 +2806,7 @@ class SlateEditableComponent {
|
|
|
2752
2806
|
const textDOMNode = AngularEditor.toDOMNode(this.editor, textNode);
|
|
2753
2807
|
let textContent = '';
|
|
2754
2808
|
// skip decorate text
|
|
2755
|
-
textDOMNode.querySelectorAll('[editable-text]').forEach(
|
|
2809
|
+
textDOMNode.querySelectorAll('[editable-text]').forEach(stringDOMNode => {
|
|
2756
2810
|
let text = stringDOMNode.textContent;
|
|
2757
2811
|
const zeroChar = '\uFEFF';
|
|
2758
2812
|
// remove zero with char
|
|
@@ -2810,17 +2864,14 @@ class SlateEditableComponent {
|
|
|
2810
2864
|
if (this.placeholderDecorate) {
|
|
2811
2865
|
return this.placeholderDecorate(editor) || [];
|
|
2812
2866
|
}
|
|
2813
|
-
if (this.placeholder &&
|
|
2814
|
-
editor.children.length === 1 &&
|
|
2815
|
-
Array.from(Node.texts(editor)).length === 1 &&
|
|
2816
|
-
Node.string(editor) === '') {
|
|
2867
|
+
if (this.placeholder && editor.children.length === 1 && Array.from(Node.texts(editor)).length === 1 && Node.string(editor) === '') {
|
|
2817
2868
|
const start = Editor.start(editor, []);
|
|
2818
2869
|
return [
|
|
2819
2870
|
{
|
|
2820
2871
|
placeholder: this.placeholder,
|
|
2821
2872
|
anchor: start,
|
|
2822
|
-
focus: start
|
|
2823
|
-
}
|
|
2873
|
+
focus: start
|
|
2874
|
+
}
|
|
2824
2875
|
];
|
|
2825
2876
|
}
|
|
2826
2877
|
else {
|
|
@@ -2829,9 +2880,7 @@ class SlateEditableComponent {
|
|
|
2829
2880
|
}
|
|
2830
2881
|
generateDecorations() {
|
|
2831
2882
|
const decorations = this.decorate([this.editor, []]);
|
|
2832
|
-
const placeholderDecorations = this.isComposing
|
|
2833
|
-
? []
|
|
2834
|
-
: this.composePlaceholderDecorate(this.editor);
|
|
2883
|
+
const placeholderDecorations = this.isComposing ? [] : this.composePlaceholderDecorate(this.editor);
|
|
2835
2884
|
decorations.push(...placeholderDecorations);
|
|
2836
2885
|
return decorations;
|
|
2837
2886
|
}
|
|
@@ -2846,7 +2895,7 @@ class SlateEditableComponent {
|
|
|
2846
2895
|
}));
|
|
2847
2896
|
}
|
|
2848
2897
|
toSlateSelection() {
|
|
2849
|
-
if (!this.isComposing && !this.isUpdatingSelection && !this.isDraggingInternally) {
|
|
2898
|
+
if ((!this.isComposing || IS_ANDROID) && !this.isUpdatingSelection && !this.isDraggingInternally) {
|
|
2850
2899
|
try {
|
|
2851
2900
|
const root = AngularEditor.findDocumentOrShadowRoot(this.editor);
|
|
2852
2901
|
const { activeElement } = root;
|
|
@@ -2882,7 +2931,10 @@ class SlateEditableComponent {
|
|
|
2882
2931
|
}
|
|
2883
2932
|
}
|
|
2884
2933
|
catch (error) {
|
|
2885
|
-
this.editor.onError({
|
|
2934
|
+
this.editor.onError({
|
|
2935
|
+
code: SlateErrorCode.ToSlateSelectionError,
|
|
2936
|
+
nativeError: error
|
|
2937
|
+
});
|
|
2886
2938
|
}
|
|
2887
2939
|
}
|
|
2888
2940
|
}
|
|
@@ -2890,11 +2942,61 @@ class SlateEditableComponent {
|
|
|
2890
2942
|
const editor = this.editor;
|
|
2891
2943
|
const root = AngularEditor.findDocumentOrShadowRoot(this.editor);
|
|
2892
2944
|
const { activeElement } = root;
|
|
2893
|
-
|
|
2945
|
+
const { selection } = editor;
|
|
2946
|
+
const { inputType: type } = event;
|
|
2947
|
+
const data = event.dataTransfer || event.data || undefined;
|
|
2948
|
+
if (IS_ANDROID) {
|
|
2949
|
+
if (type === 'insertCompositionText') {
|
|
2950
|
+
if (data && data.toString().includes('\n')) {
|
|
2951
|
+
restoreDom(editor, () => {
|
|
2952
|
+
Editor.insertBreak(editor);
|
|
2953
|
+
});
|
|
2954
|
+
}
|
|
2955
|
+
else {
|
|
2956
|
+
let [nativeTargetRange] = event.getTargetRanges();
|
|
2957
|
+
if (nativeTargetRange) {
|
|
2958
|
+
const targetRange = AngularEditor.toSlateRange(editor, nativeTargetRange);
|
|
2959
|
+
if (data) {
|
|
2960
|
+
restoreDom(editor, () => {
|
|
2961
|
+
Transforms.insertText(editor, data.toString(), { at: targetRange });
|
|
2962
|
+
});
|
|
2963
|
+
}
|
|
2964
|
+
else {
|
|
2965
|
+
restoreDom(editor, () => {
|
|
2966
|
+
Transforms.delete(editor, { at: targetRange });
|
|
2967
|
+
});
|
|
2968
|
+
}
|
|
2969
|
+
}
|
|
2970
|
+
}
|
|
2971
|
+
return;
|
|
2972
|
+
}
|
|
2973
|
+
if (type === 'deleteContentBackward') {
|
|
2974
|
+
let [nativeTargetRange] = event.getTargetRanges();
|
|
2975
|
+
const targetRange = AngularEditor.toSlateRange(editor, nativeTargetRange);
|
|
2976
|
+
// gboard can not prevent default action, so must use restoreDom,
|
|
2977
|
+
// sougou Keyboard can prevent default action(only in Chinese input mode).
|
|
2978
|
+
// In order to avoid weird action in Sougou Keyboard, use resotreDom only range's isCollapsed is false (recognize gboard)
|
|
2979
|
+
if (!Range.isCollapsed(targetRange)) {
|
|
2980
|
+
restoreDom(editor, () => {
|
|
2981
|
+
Transforms.delete(editor, { at: targetRange });
|
|
2982
|
+
});
|
|
2983
|
+
return;
|
|
2984
|
+
}
|
|
2985
|
+
}
|
|
2986
|
+
if (type === 'insertText') {
|
|
2987
|
+
restoreDom(editor, () => {
|
|
2988
|
+
if (typeof data === 'string') {
|
|
2989
|
+
Editor.insertText(editor, data);
|
|
2990
|
+
}
|
|
2991
|
+
});
|
|
2992
|
+
return;
|
|
2993
|
+
}
|
|
2994
|
+
}
|
|
2995
|
+
if (!this.readonly &&
|
|
2996
|
+
hasEditableTarget(editor, event.target) &&
|
|
2997
|
+
!isTargetInsideVoid(editor, activeElement) &&
|
|
2998
|
+
!this.isDOMEventHandled(event, this.beforeInput)) {
|
|
2894
2999
|
try {
|
|
2895
|
-
const { selection } = editor;
|
|
2896
|
-
const { inputType: type } = event;
|
|
2897
|
-
const data = event.dataTransfer || event.data || undefined;
|
|
2898
3000
|
event.preventDefault();
|
|
2899
3001
|
// COMPAT: If the selection is expanded, even if the command seems like
|
|
2900
3002
|
// a delete forward/backward command it should delete the selection.
|
|
@@ -2982,7 +3084,10 @@ class SlateEditableComponent {
|
|
|
2982
3084
|
}
|
|
2983
3085
|
}
|
|
2984
3086
|
catch (error) {
|
|
2985
|
-
this.editor.onError({
|
|
3087
|
+
this.editor.onError({
|
|
3088
|
+
code: SlateErrorCode.OnDOMBeforeInputError,
|
|
3089
|
+
nativeError: error
|
|
3090
|
+
});
|
|
2986
3091
|
}
|
|
2987
3092
|
}
|
|
2988
3093
|
}
|
|
@@ -3052,7 +3157,7 @@ class SlateEditableComponent {
|
|
|
3052
3157
|
// aren't correct and never fire the "insertFromComposition"
|
|
3053
3158
|
// type that we need. So instead, insert whenever a composition
|
|
3054
3159
|
// ends since it will already have been committed to the DOM.
|
|
3055
|
-
if (this.isComposing === true && !IS_SAFARI && event.data) {
|
|
3160
|
+
if (this.isComposing === true && !IS_SAFARI && !IS_ANDROID && event.data) {
|
|
3056
3161
|
preventInsertFromComposition(event, this.editor);
|
|
3057
3162
|
Editor.insertText(this.editor, event.data);
|
|
3058
3163
|
}
|
|
@@ -3111,8 +3216,7 @@ class SlateEditableComponent {
|
|
|
3111
3216
|
if (!this.readonly && hasTarget(this.editor, event.target) && !this.isDOMEventHandled(event, this.dragStart)) {
|
|
3112
3217
|
const node = AngularEditor.toSlateNode(this.editor, event.target);
|
|
3113
3218
|
const path = AngularEditor.findPath(this.editor, node);
|
|
3114
|
-
const voidMatch = Editor.isVoid(this.editor, node) ||
|
|
3115
|
-
Editor.void(this.editor, { at: path, voids: true });
|
|
3219
|
+
const voidMatch = Editor.isVoid(this.editor, node) || Editor.void(this.editor, { at: path, voids: true });
|
|
3116
3220
|
// If starting a drag on a void node, make sure it is selected
|
|
3117
3221
|
// so that it shows up in the selection's fragment.
|
|
3118
3222
|
if (voidMatch) {
|
|
@@ -3136,7 +3240,7 @@ class SlateEditableComponent {
|
|
|
3136
3240
|
if (this.isDraggingInternally) {
|
|
3137
3241
|
if (draggedRange) {
|
|
3138
3242
|
Transforms.delete(editor, {
|
|
3139
|
-
at: draggedRange
|
|
3243
|
+
at: draggedRange
|
|
3140
3244
|
});
|
|
3141
3245
|
}
|
|
3142
3246
|
this.isDraggingInternally = false;
|
|
@@ -3150,7 +3254,10 @@ class SlateEditableComponent {
|
|
|
3150
3254
|
}
|
|
3151
3255
|
}
|
|
3152
3256
|
onDOMDragEnd(event) {
|
|
3153
|
-
if (!this.readonly &&
|
|
3257
|
+
if (!this.readonly &&
|
|
3258
|
+
this.isDraggingInternally &&
|
|
3259
|
+
hasTarget(this.editor, event.target) &&
|
|
3260
|
+
!this.isDOMEventHandled(event, this.dragEnd)) {
|
|
3154
3261
|
this.isDraggingInternally = false;
|
|
3155
3262
|
}
|
|
3156
3263
|
}
|
|
@@ -3291,7 +3398,9 @@ class SlateEditableComponent {
|
|
|
3291
3398
|
if (hotkeys.isDeleteBackward(nativeEvent)) {
|
|
3292
3399
|
event.preventDefault();
|
|
3293
3400
|
if (selection && Range.isExpanded(selection)) {
|
|
3294
|
-
Editor.deleteFragment(editor, {
|
|
3401
|
+
Editor.deleteFragment(editor, {
|
|
3402
|
+
direction: 'backward'
|
|
3403
|
+
});
|
|
3295
3404
|
}
|
|
3296
3405
|
else {
|
|
3297
3406
|
Editor.deleteBackward(editor);
|
|
@@ -3301,7 +3410,9 @@ class SlateEditableComponent {
|
|
|
3301
3410
|
if (hotkeys.isDeleteForward(nativeEvent)) {
|
|
3302
3411
|
event.preventDefault();
|
|
3303
3412
|
if (selection && Range.isExpanded(selection)) {
|
|
3304
|
-
Editor.deleteFragment(editor, {
|
|
3413
|
+
Editor.deleteFragment(editor, {
|
|
3414
|
+
direction: 'forward'
|
|
3415
|
+
});
|
|
3305
3416
|
}
|
|
3306
3417
|
else {
|
|
3307
3418
|
Editor.deleteForward(editor);
|
|
@@ -3311,7 +3422,9 @@ class SlateEditableComponent {
|
|
|
3311
3422
|
if (hotkeys.isDeleteLineBackward(nativeEvent)) {
|
|
3312
3423
|
event.preventDefault();
|
|
3313
3424
|
if (selection && Range.isExpanded(selection)) {
|
|
3314
|
-
Editor.deleteFragment(editor, {
|
|
3425
|
+
Editor.deleteFragment(editor, {
|
|
3426
|
+
direction: 'backward'
|
|
3427
|
+
});
|
|
3315
3428
|
}
|
|
3316
3429
|
else {
|
|
3317
3430
|
Editor.deleteBackward(editor, { unit: 'line' });
|
|
@@ -3321,7 +3434,9 @@ class SlateEditableComponent {
|
|
|
3321
3434
|
if (hotkeys.isDeleteLineForward(nativeEvent)) {
|
|
3322
3435
|
event.preventDefault();
|
|
3323
3436
|
if (selection && Range.isExpanded(selection)) {
|
|
3324
|
-
Editor.deleteFragment(editor, {
|
|
3437
|
+
Editor.deleteFragment(editor, {
|
|
3438
|
+
direction: 'forward'
|
|
3439
|
+
});
|
|
3325
3440
|
}
|
|
3326
3441
|
else {
|
|
3327
3442
|
Editor.deleteForward(editor, { unit: 'line' });
|
|
@@ -3331,7 +3446,9 @@ class SlateEditableComponent {
|
|
|
3331
3446
|
if (hotkeys.isDeleteWordBackward(nativeEvent)) {
|
|
3332
3447
|
event.preventDefault();
|
|
3333
3448
|
if (selection && Range.isExpanded(selection)) {
|
|
3334
|
-
Editor.deleteFragment(editor, {
|
|
3449
|
+
Editor.deleteFragment(editor, {
|
|
3450
|
+
direction: 'backward'
|
|
3451
|
+
});
|
|
3335
3452
|
}
|
|
3336
3453
|
else {
|
|
3337
3454
|
Editor.deleteBackward(editor, { unit: 'word' });
|
|
@@ -3341,7 +3458,9 @@ class SlateEditableComponent {
|
|
|
3341
3458
|
if (hotkeys.isDeleteWordForward(nativeEvent)) {
|
|
3342
3459
|
event.preventDefault();
|
|
3343
3460
|
if (selection && Range.isExpanded(selection)) {
|
|
3344
|
-
Editor.deleteFragment(editor, {
|
|
3461
|
+
Editor.deleteFragment(editor, {
|
|
3462
|
+
direction: 'forward'
|
|
3463
|
+
});
|
|
3345
3464
|
}
|
|
3346
3465
|
else {
|
|
3347
3466
|
Editor.deleteForward(editor, { unit: 'word' });
|
|
@@ -3354,15 +3473,16 @@ class SlateEditableComponent {
|
|
|
3354
3473
|
// COMPAT: Chrome and Safari support `beforeinput` event but do not fire
|
|
3355
3474
|
// an event when deleting backwards in a selected void inline node
|
|
3356
3475
|
if (selection &&
|
|
3357
|
-
(hotkeys.isDeleteBackward(nativeEvent) ||
|
|
3358
|
-
hotkeys.isDeleteForward(nativeEvent)) &&
|
|
3476
|
+
(hotkeys.isDeleteBackward(nativeEvent) || hotkeys.isDeleteForward(nativeEvent)) &&
|
|
3359
3477
|
Range.isCollapsed(selection)) {
|
|
3360
3478
|
const currentNode = Node.parent(editor, selection.anchor.path);
|
|
3361
3479
|
if (Element.isElement(currentNode) &&
|
|
3362
3480
|
Editor.isVoid(editor, currentNode) &&
|
|
3363
3481
|
Editor.isInline(editor, currentNode)) {
|
|
3364
3482
|
event.preventDefault();
|
|
3365
|
-
Editor.deleteBackward(editor, {
|
|
3483
|
+
Editor.deleteBackward(editor, {
|
|
3484
|
+
unit: 'block'
|
|
3485
|
+
});
|
|
3366
3486
|
return;
|
|
3367
3487
|
}
|
|
3368
3488
|
}
|
|
@@ -3370,7 +3490,10 @@ class SlateEditableComponent {
|
|
|
3370
3490
|
}
|
|
3371
3491
|
}
|
|
3372
3492
|
catch (error) {
|
|
3373
|
-
this.editor.onError({
|
|
3493
|
+
this.editor.onError({
|
|
3494
|
+
code: SlateErrorCode.OnDOMKeydownError,
|
|
3495
|
+
nativeError: error
|
|
3496
|
+
});
|
|
3374
3497
|
}
|
|
3375
3498
|
}
|
|
3376
3499
|
}
|
|
@@ -3408,7 +3531,10 @@ class SlateEditableComponent {
|
|
|
3408
3531
|
}
|
|
3409
3532
|
}
|
|
3410
3533
|
catch (error) {
|
|
3411
|
-
this.editor.onError({
|
|
3534
|
+
this.editor.onError({
|
|
3535
|
+
code: SlateErrorCode.ToNativeSelectionError,
|
|
3536
|
+
nativeError: error
|
|
3537
|
+
});
|
|
3412
3538
|
}
|
|
3413
3539
|
}
|
|
3414
3540
|
}
|
|
@@ -3430,11 +3556,13 @@ class SlateEditableComponent {
|
|
|
3430
3556
|
}
|
|
3431
3557
|
}
|
|
3432
3558
|
SlateEditableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateEditableComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
|
|
3433
|
-
SlateEditableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SlateEditableComponent, selector: "slate-editable", inputs: { editor: "editor", renderElement: "renderElement", renderLeaf: "renderLeaf", renderText: "renderText", decorate: "decorate", placeholderDecorate: "placeholderDecorate", isStrictDecorate: "isStrictDecorate", trackBy: "trackBy", readonly: "readonly", placeholder: "placeholder", beforeInput: "beforeInput", blur: "blur", click: "click", compositionEnd: "compositionEnd", compositionStart: "compositionStart", copy: "copy", cut: "cut", dragOver: "dragOver", dragStart: "dragStart", dragEnd: "dragEnd", drop: "drop", focus: "focus", keydown: "keydown", paste: "paste", spellCheck: "spellCheck", autoCorrect: "autoCorrect", autoCapitalize: "autoCapitalize" }, host: { properties: { "attr.contenteditable": "readonly ? undefined : true", "attr.role": "readonly ? undefined : 'textbox'", "attr.spellCheck": "!hasBeforeInputSupport ? false : spellCheck", "attr.autoCorrect": "!hasBeforeInputSupport ? 'false' : autoCorrect", "attr.autoCapitalize": "!hasBeforeInputSupport ? 'false' : autoCapitalize", "attr.data-slate-editor": "this.dataSlateEditor", "attr.data-slate-node": "this.dataSlateNode", "attr.data-gramm": "this.dataGramm" }, classAttribute: "slate-editable-container" }, providers: [
|
|
3559
|
+
SlateEditableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SlateEditableComponent, selector: "slate-editable", inputs: { editor: "editor", renderElement: "renderElement", renderLeaf: "renderLeaf", renderText: "renderText", decorate: "decorate", placeholderDecorate: "placeholderDecorate", isStrictDecorate: "isStrictDecorate", trackBy: "trackBy", readonly: "readonly", placeholder: "placeholder", beforeInput: "beforeInput", blur: "blur", click: "click", compositionEnd: "compositionEnd", compositionStart: "compositionStart", copy: "copy", cut: "cut", dragOver: "dragOver", dragStart: "dragStart", dragEnd: "dragEnd", drop: "drop", focus: "focus", keydown: "keydown", paste: "paste", spellCheck: "spellCheck", autoCorrect: "autoCorrect", autoCapitalize: "autoCapitalize" }, host: { properties: { "attr.contenteditable": "readonly ? undefined : true", "attr.role": "readonly ? undefined : 'textbox'", "attr.spellCheck": "!hasBeforeInputSupport ? false : spellCheck", "attr.autoCorrect": "!hasBeforeInputSupport ? 'false' : autoCorrect", "attr.autoCapitalize": "!hasBeforeInputSupport ? 'false' : autoCapitalize", "attr.data-slate-editor": "this.dataSlateEditor", "attr.data-slate-node": "this.dataSlateNode", "attr.data-gramm": "this.dataGramm" }, classAttribute: "slate-editable-container" }, providers: [
|
|
3560
|
+
{
|
|
3434
3561
|
provide: NG_VALUE_ACCESSOR,
|
|
3435
3562
|
useExisting: forwardRef(() => SlateEditableComponent),
|
|
3436
3563
|
multi: true
|
|
3437
|
-
}
|
|
3564
|
+
}
|
|
3565
|
+
], viewQueries: [{ propertyName: "templateComponent", first: true, predicate: ["templateComponent"], descendants: true, static: true }, { propertyName: "templateElementRef", first: true, predicate: ["templateComponent"], descendants: true, read: ElementRef, static: true }], usesOnChanges: true, ngImport: i0, template: "<slate-children [children]=\"editor.children\" [context]=\"context\" [viewContext]=\"viewContext\"></slate-children>\n<slate-string-template #templateComponent></slate-string-template>\n", dependencies: [{ kind: "component", type: SlateStringTemplateComponent, selector: "slate-string-template" }, { kind: "component", type: SlateChildrenComponent, selector: "slate-children", inputs: ["children", "context", "viewContext"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3438
3566
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateEditableComponent, decorators: [{
|
|
3439
3567
|
type: Component,
|
|
3440
3568
|
args: [{ selector: 'slate-editable', host: {
|
|
@@ -3444,11 +3572,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImpor
|
|
|
3444
3572
|
'[attr.spellCheck]': `!hasBeforeInputSupport ? false : spellCheck`,
|
|
3445
3573
|
'[attr.autoCorrect]': `!hasBeforeInputSupport ? 'false' : autoCorrect`,
|
|
3446
3574
|
'[attr.autoCapitalize]': `!hasBeforeInputSupport ? 'false' : autoCapitalize`
|
|
3447
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
3575
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
3576
|
+
{
|
|
3448
3577
|
provide: NG_VALUE_ACCESSOR,
|
|
3449
3578
|
useExisting: forwardRef(() => SlateEditableComponent),
|
|
3450
3579
|
multi: true
|
|
3451
|
-
}
|
|
3580
|
+
}
|
|
3581
|
+
], template: "<slate-children [children]=\"editor.children\" [context]=\"context\" [viewContext]=\"viewContext\"></slate-children>\n<slate-string-template #templateComponent></slate-string-template>\n" }]
|
|
3452
3582
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i0.Injector }]; }, propDecorators: { editor: [{
|
|
3453
3583
|
type: Input
|
|
3454
3584
|
}], renderElement: [{
|
|
@@ -3552,8 +3682,10 @@ const isTargetInsideVoid = (editor, target) => {
|
|
|
3552
3682
|
return Editor.isVoid(editor, slateNode);
|
|
3553
3683
|
};
|
|
3554
3684
|
const hasStringTarget = (domSelection) => {
|
|
3555
|
-
return (domSelection.anchorNode.parentElement.hasAttribute('data-slate-string') ||
|
|
3556
|
-
|
|
3685
|
+
return ((domSelection.anchorNode.parentElement.hasAttribute('data-slate-string') ||
|
|
3686
|
+
domSelection.anchorNode.parentElement.hasAttribute('data-slate-zero-width')) &&
|
|
3687
|
+
(domSelection.focusNode.parentElement.hasAttribute('data-slate-string') ||
|
|
3688
|
+
domSelection.focusNode.parentElement.hasAttribute('data-slate-zero-width')));
|
|
3557
3689
|
};
|
|
3558
3690
|
/**
|
|
3559
3691
|
* remove default insert from composition
|
|
@@ -3615,12 +3747,18 @@ SlateModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
|
|
|
3615
3747
|
SlateBlockCardComponent,
|
|
3616
3748
|
SlateLeafComponent,
|
|
3617
3749
|
SlateLeavesComponent,
|
|
3618
|
-
SlateDefaultLeafComponent
|
|
3750
|
+
SlateDefaultLeafComponent,
|
|
3751
|
+
SlateDefaultStringComponent], imports: [CommonModule], exports: [SlateEditableComponent,
|
|
3752
|
+
SlateChildrenComponent,
|
|
3753
|
+
SlateElementComponent,
|
|
3754
|
+
SlateLeavesComponent,
|
|
3755
|
+
SlateStringComponent,
|
|
3756
|
+
SlateDefaultStringComponent] });
|
|
3619
3757
|
SlateModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateModule, providers: [
|
|
3620
3758
|
{
|
|
3621
3759
|
provide: SLATE_DEFAULT_ELEMENT_COMPONENT_TOKEN,
|
|
3622
3760
|
useValue: SlateDefaultElementComponent
|
|
3623
|
-
}
|
|
3761
|
+
}
|
|
3624
3762
|
], imports: [CommonModule] });
|
|
3625
3763
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SlateModule, decorators: [{
|
|
3626
3764
|
type: NgModule,
|
|
@@ -3638,15 +3776,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImpor
|
|
|
3638
3776
|
SlateBlockCardComponent,
|
|
3639
3777
|
SlateLeafComponent,
|
|
3640
3778
|
SlateLeavesComponent,
|
|
3641
|
-
SlateDefaultLeafComponent
|
|
3779
|
+
SlateDefaultLeafComponent,
|
|
3780
|
+
SlateDefaultStringComponent
|
|
3642
3781
|
],
|
|
3643
3782
|
imports: [CommonModule],
|
|
3644
|
-
exports: [
|
|
3783
|
+
exports: [
|
|
3784
|
+
SlateEditableComponent,
|
|
3785
|
+
SlateChildrenComponent,
|
|
3786
|
+
SlateElementComponent,
|
|
3787
|
+
SlateLeavesComponent,
|
|
3788
|
+
SlateStringComponent,
|
|
3789
|
+
SlateDefaultStringComponent
|
|
3790
|
+
],
|
|
3645
3791
|
providers: [
|
|
3646
3792
|
{
|
|
3647
3793
|
provide: SLATE_DEFAULT_ELEMENT_COMPONENT_TOKEN,
|
|
3648
3794
|
useValue: SlateDefaultElementComponent
|
|
3649
|
-
}
|
|
3795
|
+
}
|
|
3650
3796
|
]
|
|
3651
3797
|
}]
|
|
3652
3798
|
}] });
|
|
@@ -3659,5 +3805,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImpor
|
|
|
3659
3805
|
* Generated bundle index. Do not edit.
|
|
3660
3806
|
*/
|
|
3661
3807
|
|
|
3662
|
-
export { AngularEditor, BaseComponent, BaseElementComponent, BaseLeafComponent, BaseTextComponent, DOMComment, DOMElement, DOMNode, DOMRange, DOMSelection, DOMStaticRange, DOMText, EDITOR_TO_ELEMENT, EDITOR_TO_ON_CHANGE, EDITOR_TO_PLACEHOLDER, EDITOR_TO_WINDOW, ELEMENT_TO_COMPONENT, ELEMENT_TO_NODE, FAKE_LEFT_BLOCK_CARD_OFFSET, FAKE_RIGHT_BLOCK_CARD_OFFSET, HAS_BEFORE_INPUT_SUPPORT, IS_ANDROID, IS_APPLE, IS_CHROME, IS_CHROME_LEGACY, IS_CLICKING, IS_DRAGGING, IS_EDGE_LEGACY, IS_FIREFOX, IS_FIREFOX_LEGACY, IS_FOCUSED, IS_IOS, IS_QQBROWSER, IS_READONLY, IS_SAFARI, IS_UC_MOBILE, IS_WECHATBROWSER, KEY_TO_ELEMENT, Key, NODE_TO_ELEMENT, NODE_TO_INDEX, NODE_TO_KEY, NODE_TO_PARENT, PLACEHOLDER_SYMBOL, SlateChildrenComponent, SlateEditableComponent, SlateElementComponent, SlateErrorCode, SlateLeavesComponent, SlateModule, SlateStringComponent, check, getCardTargetAttribute, getClipboardData, getDefaultView, getEditableChild, getEditableChildAndIndex, getPlainText, getSlateFragmentAttribute, hasBeforeContextChange, hasBlockCard, hasBlockCardWithNode, hasShadowRoot, hotkeys, isCardCenterByTargetAttr, isCardLeft, isCardLeftByTargetAttr, isCardRightByTargetAttr, isComponentType, isDOMComment, isDOMElement, isDOMNode, isDOMSelection, isDOMText, isDecoratorRangeListEqual, isPlainTextOnlyPaste, isTemplateRef, isValid, normalize, normalizeDOMPoint, shallowCompare, withAngular };
|
|
3808
|
+
export { AngularEditor, BaseComponent, BaseElementComponent, BaseLeafComponent, BaseTextComponent, DOMComment, DOMElement, DOMNode, DOMRange, DOMSelection, DOMStaticRange, DOMText, EDITOR_TO_ELEMENT, EDITOR_TO_ON_CHANGE, EDITOR_TO_PLACEHOLDER, EDITOR_TO_WINDOW, ELEMENT_TO_COMPONENT, ELEMENT_TO_NODE, FAKE_LEFT_BLOCK_CARD_OFFSET, FAKE_RIGHT_BLOCK_CARD_OFFSET, HAS_BEFORE_INPUT_SUPPORT, IS_ANDROID, IS_APPLE, IS_CHROME, IS_CHROME_LEGACY, IS_CLICKING, IS_DRAGGING, IS_EDGE_LEGACY, IS_FIREFOX, IS_FIREFOX_LEGACY, IS_FOCUSED, IS_IOS, IS_QQBROWSER, IS_READONLY, IS_SAFARI, IS_UC_MOBILE, IS_WECHATBROWSER, KEY_TO_ELEMENT, Key, NODE_TO_ELEMENT, NODE_TO_INDEX, NODE_TO_KEY, NODE_TO_PARENT, PLACEHOLDER_SYMBOL, SlateChildrenComponent, SlateDefaultStringComponent, SlateEditableComponent, SlateElementComponent, SlateErrorCode, SlateLeavesComponent, SlateModule, SlateStringComponent, check, getCardTargetAttribute, getClipboardData, getDefaultView, getEditableChild, getEditableChildAndIndex, getPlainText, getSlateFragmentAttribute, hasBeforeContextChange, hasBlockCard, hasBlockCardWithNode, hasShadowRoot, hotkeys, isCardCenterByTargetAttr, isCardLeft, isCardLeftByTargetAttr, isCardRightByTargetAttr, isComponentType, isDOMComment, isDOMElement, isDOMNode, isDOMSelection, isDOMText, isDecoratorRangeListEqual, isPlainTextOnlyPaste, isTemplateRef, isValid, normalize, normalizeDOMPoint, shallowCompare, withAngular };
|
|
3663
3809
|
//# sourceMappingURL=slate-angular.mjs.map
|