slate-react 0.133.0 → 0.133.2-20261011005715
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/components/editable.d.ts.map +1 -1
- package/dist/hooks/android-input-manager/android-input-manager.d.ts.map +1 -1
- package/dist/hooks/use-composition-dom.d.ts +8 -0
- package/dist/hooks/use-composition-dom.d.ts.map +1 -0
- package/dist/index.es.js +109 -46
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +115 -48
- package/dist/index.js.map +1 -1
- package/dist/slate-react.js +117 -48
- package/dist/slate-react.min.js +1 -1
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"editable.d.ts","sourceRoot":"","sources":["../../../../packages/slate-react/src/components/editable.tsx"],"names":[],"mappings":"AAGA,OAAO,KASN,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAE3B,OAAO,EAEL,OAAO,EAEP,SAAS,EAIT,IAAI,EAEJ,cAAc,EACd,YAAY,EACb,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"editable.d.ts","sourceRoot":"","sources":["../../../../packages/slate-react/src/components/editable.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"android-input-manager.d.ts","sourceRoot":"","sources":["../../../../../packages/slate-react/src/hooks/android-input-manager/android-input-manager.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAA;AAItC,OAAO,EAAgC,KAAK,EAAE,KAAK,EAAc,MAAM,OAAO,CAAA;AAC9E,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AAyBvD,MAAM,MAAM,MAAM,GAAG;IAAE,EAAE,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IAAC,GAAG,EAAE,MAAM,IAAI,CAAA;CAAE,CAAA;AA0B5D,MAAM,MAAM,gCAAgC,GAAG;IAC7C,MAAM,EAAE,WAAW,CAAA;IAEnB,4BAA4B,EAAE,aAAa,CAAC,MAAM,IAAI,CAAC,CAAA;IACvD,oBAAoB,EAAE,aAAa,CAAC,MAAM,IAAI,CAAC,CAAA;CAChD,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,aAAa,EAAE,MAAM,IAAI,CAAA;IAEzB,eAAe,EAAE,MAAM,OAAO,CAAA;IAC9B,gBAAgB,EAAE,MAAM,OAAO,CAAA;IAC/B,iBAAiB,EAAE,MAAM,OAAO,CAAA;IAChC,UAAU,EAAE,MAAM,OAAO,GAAG,QAAQ,CAAA;IAEpC,gBAAgB,EAAE,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,KAAK,IAAI,CAAA;IAC/C,oBAAoB,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,KAAK,IAAI,CAAA;IAC7E,sBAAsB,EAAE,CACtB,KAAK,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,KAC1C,IAAI,CAAA;IACT,oBAAoB,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;IACjD,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,KAAK,IAAI,CAAA;IAEnE,kBAAkB,EAAE,CAAC,SAAS,EAAE,cAAc,EAAE,KAAK,IAAI,CAAA;IACzD,WAAW,EAAE,MAAM,IAAI,CAAA;CACxB,CAAA;AAED,wBAAgB,yBAAyB,CAAC,EACxC,MAAM,EACN,4BAA4B,EAC5B,oBAAoB,GACrB,EAAE,gCAAgC,GAAG,mBAAmB,
|
|
1
|
+
{"version":3,"file":"android-input-manager.d.ts","sourceRoot":"","sources":["../../../../../packages/slate-react/src/hooks/android-input-manager/android-input-manager.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAA;AAItC,OAAO,EAAgC,KAAK,EAAE,KAAK,EAAc,MAAM,OAAO,CAAA;AAC9E,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AAyBvD,MAAM,MAAM,MAAM,GAAG;IAAE,EAAE,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IAAC,GAAG,EAAE,MAAM,IAAI,CAAA;CAAE,CAAA;AA0B5D,MAAM,MAAM,gCAAgC,GAAG;IAC7C,MAAM,EAAE,WAAW,CAAA;IAEnB,4BAA4B,EAAE,aAAa,CAAC,MAAM,IAAI,CAAC,CAAA;IACvD,oBAAoB,EAAE,aAAa,CAAC,MAAM,IAAI,CAAC,CAAA;CAChD,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,aAAa,EAAE,MAAM,IAAI,CAAA;IAEzB,eAAe,EAAE,MAAM,OAAO,CAAA;IAC9B,gBAAgB,EAAE,MAAM,OAAO,CAAA;IAC/B,iBAAiB,EAAE,MAAM,OAAO,CAAA;IAChC,UAAU,EAAE,MAAM,OAAO,GAAG,QAAQ,CAAA;IAEpC,gBAAgB,EAAE,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,KAAK,IAAI,CAAA;IAC/C,oBAAoB,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,KAAK,IAAI,CAAA;IAC7E,sBAAsB,EAAE,CACtB,KAAK,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,KAC1C,IAAI,CAAA;IACT,oBAAoB,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;IACjD,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,KAAK,IAAI,CAAA;IAEnE,kBAAkB,EAAE,CAAC,SAAS,EAAE,cAAc,EAAE,KAAK,IAAI,CAAA;IACzD,WAAW,EAAE,MAAM,IAAI,CAAA;CACxB,CAAA;AAED,wBAAgB,yBAAyB,CAAC,EACxC,MAAM,EACN,4BAA4B,EAC5B,oBAAoB,GACrB,EAAE,gCAAgC,GAAG,mBAAmB,CAq2BxD"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { ReactEditor } from '../plugin/react-editor';
|
|
2
|
+
export declare const useCompositionDOM: (editor: ReactEditor) => {
|
|
3
|
+
track: (text: string | null) => void;
|
|
4
|
+
pause: () => void;
|
|
5
|
+
restore: () => void;
|
|
6
|
+
clear: () => void;
|
|
7
|
+
};
|
|
8
|
+
//# sourceMappingURL=use-composition-dom.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-composition-dom.d.ts","sourceRoot":"","sources":["../../../../packages/slate-react/src/hooks/use-composition-dom.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AAGpD,eAAO,MAAM,iBAAiB,WAAY,WAAW;kBAW5B,MAAM,GAAG,IAAI;;;;CA4BrC,CAAA"}
|
package/dist/index.es.js
CHANGED
|
@@ -4,7 +4,7 @@ import throttle from 'lodash/throttle';
|
|
|
4
4
|
import React, { useContext, createContext, useRef, useEffect, useLayoutEffect, useState, memo, forwardRef, useCallback, useReducer, useMemo, Fragment, Component } from 'react';
|
|
5
5
|
import scrollIntoView from 'scroll-into-view-if-needed';
|
|
6
6
|
import { Node, Range, Editor, Path, Transforms, Location, Text as Text$1, Point, Scrubber } from 'slate';
|
|
7
|
-
import { DOMEditor, isTrackedMutation, EDITOR_TO_FORCE_RENDER, IS_NODE_MAP_DIRTY, EDITOR_TO_PENDING_DIFFS, EDITOR_TO_PENDING_SELECTION, applyStringDiff, EDITOR_TO_PENDING_INSERTION_MARKS, isDOMSelection, IS_COMPOSING, EDITOR_TO_PENDING_ACTION, EDITOR_TO_USER_MARKS, targetRange, verifyDiffState, EDITOR_TO_PLACEHOLDER_ELEMENT, normalizeStringDiff, mergeStringDiffs, normalizeRange, normalizePoint, CAN_USE_DOM, IS_ANDROID, EDITOR_TO_SCHEDULE_FLUSH, MARK_PLACEHOLDER_SYMBOL, PLACEHOLDER_SYMBOL, IS_WEBKIT, isTextDecorationsEqual, isElementDecorationsEqual, EDITOR_TO_KEY_TO_ELEMENT, NODE_TO_ELEMENT, ELEMENT_TO_NODE, NODE_TO_INDEX, NODE_TO_PARENT, Key, splitDecorationsByChild, IS_READ_ONLY, getActiveElement, getSelection, IS_FOCUSED, isDOMNode, getDefaultView, EDITOR_TO_WINDOW, EDITOR_TO_ELEMENT, IS_FIREFOX, containsShadowAware, EDITOR_TO_USER_SELECTION, HAS_BEFORE_INPUT_SUPPORT, isPlainTextOnlyPaste, Hotkeys,
|
|
7
|
+
import { DOMEditor, isTrackedMutation, EDITOR_TO_FORCE_RENDER, IS_NODE_MAP_DIRTY, EDITOR_TO_PENDING_DIFFS, EDITOR_TO_PENDING_SELECTION, applyStringDiff, EDITOR_TO_PENDING_INSERTION_MARKS, isDOMSelection, IS_COMPOSING, EDITOR_TO_PENDING_ACTION, EDITOR_TO_USER_MARKS, targetRange, verifyDiffState, EDITOR_TO_PLACEHOLDER_ELEMENT, normalizeStringDiff, mergeStringDiffs, normalizeRange, normalizePoint, CAN_USE_DOM, IS_ANDROID, EDITOR_TO_SCHEDULE_FLUSH, MARK_PLACEHOLDER_SYMBOL, PLACEHOLDER_SYMBOL, IS_WEBKIT, isTextDecorationsEqual, isElementDecorationsEqual, EDITOR_TO_KEY_TO_ELEMENT, NODE_TO_ELEMENT, ELEMENT_TO_NODE, NODE_TO_INDEX, NODE_TO_PARENT, Key, splitDecorationsByChild, IS_READ_ONLY, getActiveElement, getSelection, IS_FOCUSED, isDOMNode, getDefaultView, EDITOR_TO_WINDOW, EDITOR_TO_ELEMENT, IS_FIREFOX, containsShadowAware, IS_CHROME, EDITOR_TO_USER_SELECTION, HAS_BEFORE_INPUT_SUPPORT, isPlainTextOnlyPaste, Hotkeys, IS_FIREFOX_LEGACY, IS_IOS, IS_WECHATBROWSER, IS_UC_MOBILE, TRIPLE_CLICK, isDOMElement, EDITOR_TO_ON_CHANGE, withDOM } from 'slate-dom';
|
|
8
8
|
export { NODE_TO_INDEX, NODE_TO_PARENT } from 'slate-dom';
|
|
9
9
|
import ReactDOM from 'react-dom';
|
|
10
10
|
import { ResizeObserver } from '@juggle/resize-observer';
|
|
@@ -279,7 +279,7 @@ function createAndroidInputManager({
|
|
|
279
279
|
applyPendingSelection();
|
|
280
280
|
const userMarks = EDITOR_TO_USER_MARKS.get(editor);
|
|
281
281
|
EDITOR_TO_USER_MARKS.delete(editor);
|
|
282
|
-
if (userMarks !== undefined) {
|
|
282
|
+
if (userMarks !== undefined && userMarks !== editor.marks) {
|
|
283
283
|
editor.marks = userMarks;
|
|
284
284
|
editor.onChange();
|
|
285
285
|
}
|
|
@@ -371,6 +371,9 @@ function createAndroidInputManager({
|
|
|
371
371
|
if (hasPendingAction()) {
|
|
372
372
|
flush();
|
|
373
373
|
}
|
|
374
|
+
if (actionTimeoutId) {
|
|
375
|
+
clearTimeout(actionTimeoutId);
|
|
376
|
+
}
|
|
374
377
|
EDITOR_TO_PENDING_ACTION.set(editor, {
|
|
375
378
|
at,
|
|
376
379
|
run
|
|
@@ -505,11 +508,15 @@ function createAndroidInputManager({
|
|
|
505
508
|
};
|
|
506
509
|
const range = Editor.range(editor, point, point);
|
|
507
510
|
handleUserSelect(range);
|
|
508
|
-
|
|
511
|
+
storeDiff(targetRange.anchor.path, {
|
|
509
512
|
text: '',
|
|
510
513
|
end: end.offset,
|
|
511
514
|
start: start.offset
|
|
512
515
|
});
|
|
516
|
+
if (type === 'deleteContentBackward') {
|
|
517
|
+
scheduleFlush();
|
|
518
|
+
}
|
|
519
|
+
return;
|
|
513
520
|
}
|
|
514
521
|
return scheduleAction(() => Editor.deleteFragment(editor, {
|
|
515
522
|
direction
|
|
@@ -558,11 +565,13 @@ function createAndroidInputManager({
|
|
|
558
565
|
// as an action to ensure correct behavior (mostly happens with mark placeholders)
|
|
559
566
|
const nativeCollapsed = isDOMSelection(nativeTargetRange) ? nativeTargetRange.isCollapsed : !!((_nativeTargetRange = nativeTargetRange) !== null && _nativeTargetRange !== void 0 && _nativeTargetRange.collapsed);
|
|
560
567
|
if (canStoreDiff && nativeCollapsed && Range.isCollapsed(targetRange) && anchor.offset > 0) {
|
|
561
|
-
|
|
568
|
+
storeDiff(anchor.path, {
|
|
562
569
|
text: '',
|
|
563
570
|
start: anchor.offset - 1,
|
|
564
571
|
end: anchor.offset
|
|
565
572
|
});
|
|
573
|
+
scheduleFlush();
|
|
574
|
+
return;
|
|
566
575
|
}
|
|
567
576
|
return scheduleAction(() => Editor.deleteBackward(editor), {
|
|
568
577
|
at: targetRange
|
|
@@ -798,6 +807,9 @@ function createAndroidInputManager({
|
|
|
798
807
|
};
|
|
799
808
|
const scheduleFlush = () => {
|
|
800
809
|
if (!hasPendingAction()) {
|
|
810
|
+
if (actionTimeoutId) {
|
|
811
|
+
clearTimeout(actionTimeoutId);
|
|
812
|
+
}
|
|
801
813
|
actionTimeoutId = setTimeout(flush);
|
|
802
814
|
}
|
|
803
815
|
};
|
|
@@ -2493,6 +2505,86 @@ function useTrackUserInput() {
|
|
|
2493
2505
|
};
|
|
2494
2506
|
}
|
|
2495
2507
|
|
|
2508
|
+
const createRestoreDomManager = (editor, receivedUserInput) => {
|
|
2509
|
+
let bufferedMutations = [];
|
|
2510
|
+
const clear = () => {
|
|
2511
|
+
bufferedMutations = [];
|
|
2512
|
+
};
|
|
2513
|
+
const registerMutations = mutations => {
|
|
2514
|
+
if (!receivedUserInput.current) {
|
|
2515
|
+
return;
|
|
2516
|
+
}
|
|
2517
|
+
const trackedMutations = mutations.filter(mutation => isTrackedMutation(editor, mutation, mutations));
|
|
2518
|
+
bufferedMutations.push(...trackedMutations);
|
|
2519
|
+
};
|
|
2520
|
+
function restoreDOM() {
|
|
2521
|
+
if (bufferedMutations.length > 0) {
|
|
2522
|
+
bufferedMutations.reverse().forEach(mutation => {
|
|
2523
|
+
if (mutation.type === 'characterData') {
|
|
2524
|
+
// We don't want to restore the DOM for characterData mutations
|
|
2525
|
+
// because this interrupts the composition.
|
|
2526
|
+
return;
|
|
2527
|
+
}
|
|
2528
|
+
mutation.removedNodes.forEach(node => {
|
|
2529
|
+
mutation.target.insertBefore(node, mutation.nextSibling);
|
|
2530
|
+
});
|
|
2531
|
+
mutation.addedNodes.forEach(node => {
|
|
2532
|
+
mutation.target.removeChild(node);
|
|
2533
|
+
});
|
|
2534
|
+
});
|
|
2535
|
+
// Clear buffered mutations to ensure we don't undo them twice
|
|
2536
|
+
clear();
|
|
2537
|
+
}
|
|
2538
|
+
}
|
|
2539
|
+
return {
|
|
2540
|
+
registerMutations,
|
|
2541
|
+
restoreDOM,
|
|
2542
|
+
clear
|
|
2543
|
+
};
|
|
2544
|
+
};
|
|
2545
|
+
|
|
2546
|
+
const useCompositionDOM = editor => {
|
|
2547
|
+
const compositionDOM = useMemo(() => {
|
|
2548
|
+
const manager = createRestoreDomManager(editor, {
|
|
2549
|
+
current: true
|
|
2550
|
+
});
|
|
2551
|
+
let observer = null;
|
|
2552
|
+
const clear = () => {
|
|
2553
|
+
var _observer;
|
|
2554
|
+
(_observer = observer) === null || _observer === void 0 || _observer.disconnect();
|
|
2555
|
+
observer = null;
|
|
2556
|
+
manager.clear();
|
|
2557
|
+
};
|
|
2558
|
+
const track = text => {
|
|
2559
|
+
if (!observer) {
|
|
2560
|
+
if (!(text !== null && text !== void 0 && text.includes('\n'))) return;
|
|
2561
|
+
observer = new MutationObserver(manager.registerMutations);
|
|
2562
|
+
}
|
|
2563
|
+
observer.observe(ReactEditor.toDOMNode(editor, editor), {
|
|
2564
|
+
childList: true,
|
|
2565
|
+
subtree: true
|
|
2566
|
+
});
|
|
2567
|
+
};
|
|
2568
|
+
const pause = () => {
|
|
2569
|
+
if (!observer) return;
|
|
2570
|
+
manager.registerMutations(observer.takeRecords());
|
|
2571
|
+
observer.disconnect();
|
|
2572
|
+
};
|
|
2573
|
+
const restore = () => {
|
|
2574
|
+
pause();
|
|
2575
|
+
manager.restoreDOM();
|
|
2576
|
+
};
|
|
2577
|
+
return {
|
|
2578
|
+
track,
|
|
2579
|
+
pause,
|
|
2580
|
+
restore,
|
|
2581
|
+
clear
|
|
2582
|
+
};
|
|
2583
|
+
}, [editor]);
|
|
2584
|
+
useEffect(() => () => compositionDOM.clear(), [compositionDOM]);
|
|
2585
|
+
return compositionDOM;
|
|
2586
|
+
};
|
|
2587
|
+
|
|
2496
2588
|
const blockPathAt = (editor, point) => {
|
|
2497
2589
|
var _Editor$above;
|
|
2498
2590
|
return (_Editor$above = Editor.above(editor, {
|
|
@@ -2536,44 +2628,6 @@ const deleteMovedRange = (editor, range) => {
|
|
|
2536
2628
|
}
|
|
2537
2629
|
};
|
|
2538
2630
|
|
|
2539
|
-
const createRestoreDomManager = (editor, receivedUserInput) => {
|
|
2540
|
-
let bufferedMutations = [];
|
|
2541
|
-
const clear = () => {
|
|
2542
|
-
bufferedMutations = [];
|
|
2543
|
-
};
|
|
2544
|
-
const registerMutations = mutations => {
|
|
2545
|
-
if (!receivedUserInput.current) {
|
|
2546
|
-
return;
|
|
2547
|
-
}
|
|
2548
|
-
const trackedMutations = mutations.filter(mutation => isTrackedMutation(editor, mutation, mutations));
|
|
2549
|
-
bufferedMutations.push(...trackedMutations);
|
|
2550
|
-
};
|
|
2551
|
-
function restoreDOM() {
|
|
2552
|
-
if (bufferedMutations.length > 0) {
|
|
2553
|
-
bufferedMutations.reverse().forEach(mutation => {
|
|
2554
|
-
if (mutation.type === 'characterData') {
|
|
2555
|
-
// We don't want to restore the DOM for characterData mutations
|
|
2556
|
-
// because this interrupts the composition.
|
|
2557
|
-
return;
|
|
2558
|
-
}
|
|
2559
|
-
mutation.removedNodes.forEach(node => {
|
|
2560
|
-
mutation.target.insertBefore(node, mutation.nextSibling);
|
|
2561
|
-
});
|
|
2562
|
-
mutation.addedNodes.forEach(node => {
|
|
2563
|
-
mutation.target.removeChild(node);
|
|
2564
|
-
});
|
|
2565
|
-
});
|
|
2566
|
-
// Clear buffered mutations to ensure we don't undo them twice
|
|
2567
|
-
clear();
|
|
2568
|
-
}
|
|
2569
|
-
}
|
|
2570
|
-
return {
|
|
2571
|
-
registerMutations,
|
|
2572
|
-
restoreDOM,
|
|
2573
|
-
clear
|
|
2574
|
-
};
|
|
2575
|
-
};
|
|
2576
|
-
|
|
2577
2631
|
const MUTATION_OBSERVER_CONFIG = {
|
|
2578
2632
|
subtree: true,
|
|
2579
2633
|
childList: true,
|
|
@@ -2693,6 +2747,7 @@ const Editable = /*#__PURE__*/forwardRef((props, forwardedRef) => {
|
|
|
2693
2747
|
const deferredOperations = useRef([]);
|
|
2694
2748
|
const [placeholderHeight, setPlaceholderHeight] = useState();
|
|
2695
2749
|
const processing = useRef(false);
|
|
2750
|
+
const compositionDOM = useCompositionDOM(editor);
|
|
2696
2751
|
const {
|
|
2697
2752
|
onUserInput,
|
|
2698
2753
|
receivedUserInput
|
|
@@ -3015,6 +3070,9 @@ const Editable = /*#__PURE__*/forwardRef((props, forwardedRef) => {
|
|
|
3015
3070
|
// COMPAT: use composition change events as a hint to where we should insert
|
|
3016
3071
|
// composition text if we aren't composing to work around https://github.com/ianstormtaylor/slate/issues/5038
|
|
3017
3072
|
if (isCompositionChange && ReactEditor.isComposing(editor)) {
|
|
3073
|
+
if (IS_CHROME) {
|
|
3074
|
+
compositionDOM.track(event.data);
|
|
3075
|
+
}
|
|
3018
3076
|
return;
|
|
3019
3077
|
}
|
|
3020
3078
|
let native = false;
|
|
@@ -3232,7 +3290,7 @@ const Editable = /*#__PURE__*/forwardRef((props, forwardedRef) => {
|
|
|
3232
3290
|
Transforms.select(editor, toRestore);
|
|
3233
3291
|
}
|
|
3234
3292
|
}
|
|
3235
|
-
}, [editor, onDOMSelectionChange, onUserInput, propsOnDOMBeforeInput, readOnly, scheduleOnDOMSelectionChange]);
|
|
3293
|
+
}, [editor, onDOMSelectionChange, onUserInput, propsOnDOMBeforeInput, compositionDOM, readOnly, scheduleOnDOMSelectionChange]);
|
|
3236
3294
|
const callbackRef = useCallback(node => {
|
|
3237
3295
|
if (node == null) {
|
|
3238
3296
|
onDOMSelectionChange.cancel();
|
|
@@ -3444,6 +3502,7 @@ const Editable = /*#__PURE__*/forwardRef((props, forwardedRef) => {
|
|
|
3444
3502
|
}
|
|
3445
3503
|
}, [attributes.onBeforeInput, editor, readOnly]),
|
|
3446
3504
|
onInput: useCallback(event => {
|
|
3505
|
+
compositionDOM.pause();
|
|
3447
3506
|
if (isEventHandled(event, attributes.onInput)) {
|
|
3448
3507
|
return;
|
|
3449
3508
|
}
|
|
@@ -3466,7 +3525,7 @@ const Editable = /*#__PURE__*/forwardRef((props, forwardedRef) => {
|
|
|
3466
3525
|
if (!ReactEditor.isFocused(editor)) {
|
|
3467
3526
|
handleNativeHistoryEvents(editor, event.nativeEvent);
|
|
3468
3527
|
}
|
|
3469
|
-
}, [attributes.onInput, editor]),
|
|
3528
|
+
}, [attributes.onInput, editor, compositionDOM]),
|
|
3470
3529
|
onBlur: useCallback(event => {
|
|
3471
3530
|
if (readOnly || state.isUpdatingSelection || !ReactEditor.hasSelectableTarget(editor, event.target) || isEventHandled(event, attributes.onBlur)) {
|
|
3472
3531
|
return;
|
|
@@ -3579,6 +3638,7 @@ const Editable = /*#__PURE__*/forwardRef((props, forwardedRef) => {
|
|
|
3579
3638
|
}
|
|
3580
3639
|
(_androidInputManagerR3 = androidInputManagerRef.current) === null || _androidInputManagerR3 === void 0 || _androidInputManagerR3.handleCompositionEnd(event);
|
|
3581
3640
|
if (isEventHandled(event, attributes.onCompositionEnd) || IS_ANDROID) {
|
|
3641
|
+
compositionDOM.clear();
|
|
3582
3642
|
return;
|
|
3583
3643
|
}
|
|
3584
3644
|
// COMPAT: In Chrome, `beforeinput` events for compositions
|
|
@@ -3593,6 +3653,7 @@ const Editable = /*#__PURE__*/forwardRef((props, forwardedRef) => {
|
|
|
3593
3653
|
EDITOR_TO_USER_MARKS.set(editor, editor.marks);
|
|
3594
3654
|
editor.marks = placeholderMarks;
|
|
3595
3655
|
}
|
|
3656
|
+
compositionDOM.restore();
|
|
3596
3657
|
Editor.insertText(editor, event.data);
|
|
3597
3658
|
const userMarks = EDITOR_TO_USER_MARKS.get(editor);
|
|
3598
3659
|
EDITOR_TO_USER_MARKS.delete(editor);
|
|
@@ -3600,8 +3661,9 @@ const Editable = /*#__PURE__*/forwardRef((props, forwardedRef) => {
|
|
|
3600
3661
|
editor.marks = userMarks;
|
|
3601
3662
|
}
|
|
3602
3663
|
}
|
|
3664
|
+
compositionDOM.clear();
|
|
3603
3665
|
}
|
|
3604
|
-
}, [attributes.onCompositionEnd, editor]),
|
|
3666
|
+
}, [attributes.onCompositionEnd, editor, compositionDOM]),
|
|
3605
3667
|
onCompositionUpdate: useCallback(event => {
|
|
3606
3668
|
if (ReactEditor.hasSelectableTarget(editor, event.target) && !isEventHandled(event, attributes.onCompositionUpdate) && !isDOMEventTargetInput(event)) {
|
|
3607
3669
|
if (!ReactEditor.isComposing(editor)) {
|
|
@@ -3620,6 +3682,7 @@ const Editable = /*#__PURE__*/forwardRef((props, forwardedRef) => {
|
|
|
3620
3682
|
if (isEventHandled(event, attributes.onCompositionStart) || IS_ANDROID) {
|
|
3621
3683
|
return;
|
|
3622
3684
|
}
|
|
3685
|
+
compositionDOM.clear();
|
|
3623
3686
|
setIsComposing(true);
|
|
3624
3687
|
const {
|
|
3625
3688
|
selection
|
|
@@ -3629,7 +3692,7 @@ const Editable = /*#__PURE__*/forwardRef((props, forwardedRef) => {
|
|
|
3629
3692
|
return;
|
|
3630
3693
|
}
|
|
3631
3694
|
}
|
|
3632
|
-
}, [attributes.onCompositionStart, editor]),
|
|
3695
|
+
}, [attributes.onCompositionStart, editor, compositionDOM]),
|
|
3633
3696
|
onCopy: useCallback(event => {
|
|
3634
3697
|
if (ReactEditor.hasSelectableTarget(editor, event.target) && !isEventHandled(event, attributes.onCopy) && !isDOMEventTargetInput(event)) {
|
|
3635
3698
|
event.preventDefault();
|