@portabletext/editor 1.10.2 → 1.11.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/README.md +21 -27
- package/lib/index.d.mts +531 -206
- package/lib/index.d.ts +531 -206
- package/lib/index.esm.js +415 -367
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +458 -410
- package/lib/index.js.map +1 -1
- package/lib/index.mjs +415 -367
- package/lib/index.mjs.map +1 -1
- package/package.json +10 -10
- package/src/editor/Editable.tsx +1 -1
- package/src/editor/PortableTextEditor.tsx +122 -95
- package/src/editor/behavior/behavior.types.ts +9 -0
- package/src/editor/components/Synchronizer.tsx +13 -68
- package/src/editor/create-slate-editor.tsx +2 -14
- package/src/editor/editor-event-listener.tsx +24 -0
- package/src/editor/editor-machine.ts +34 -4
- package/src/editor/editor-provider.tsx +81 -0
- package/src/editor/hooks/useSyncValue.ts +2 -3
- package/src/editor/plugins/with-plugins.ts +0 -27
- package/src/editor/use-editor.ts +89 -20
- package/src/index.ts +12 -4
- package/src/types/editor.ts +0 -1
package/lib/index.esm.js
CHANGED
|
@@ -5,25 +5,25 @@ import { jsx, Fragment, jsxs } from "react/jsx-runtime";
|
|
|
5
5
|
import { useSelector, useActorRef } from "@xstate/react";
|
|
6
6
|
import isEqual from "lodash/isEqual.js";
|
|
7
7
|
import noop from "lodash/noop.js";
|
|
8
|
-
import { useRef, useState, useEffect, useMemo, createContext, useContext, useCallback, startTransition, Component, forwardRef, useImperativeHandle } from "react";
|
|
9
|
-
import { Editor, Element as Element$1, Range, Point, Text, Path, Transforms, Operation, Node, createEditor, deleteBackward, deleteForward, insertText } from "slate";
|
|
10
|
-
import { useSlateStatic, ReactEditor, useSelected,
|
|
8
|
+
import React, { useRef, useState, useEffect, useMemo, createContext, useContext, useCallback, startTransition, Component, forwardRef, useImperativeHandle } from "react";
|
|
9
|
+
import { Editor, Element as Element$1, Range, Point, Text, Path, Transforms, Operation, Node, createEditor as createEditor$1, deleteBackward, deleteForward, insertText } from "slate";
|
|
10
|
+
import { useSlateStatic, ReactEditor, useSelected, withReact, Slate, useSlate, Editable } from "slate-react";
|
|
11
11
|
import debug$m from "debug";
|
|
12
12
|
import { c } from "react-compiler-runtime";
|
|
13
13
|
import { styled } from "styled-components";
|
|
14
14
|
import uniq from "lodash/uniq.js";
|
|
15
15
|
import { Subject } from "rxjs";
|
|
16
|
-
import { setup, assign, assertEvent, emit, enqueueActions, createActor } from "xstate";
|
|
17
|
-
import throttle from "lodash/throttle.js";
|
|
18
16
|
import { useEffectEvent } from "use-effect-event";
|
|
17
|
+
import throttle from "lodash/throttle.js";
|
|
19
18
|
import debounce from "lodash/debounce.js";
|
|
20
19
|
import { unset, set, setIfMissing, insert, diffMatchPatch as diffMatchPatch$1, applyAll } from "@portabletext/patches";
|
|
21
20
|
import flatten from "lodash/flatten.js";
|
|
22
21
|
import isPlainObject from "lodash/isPlainObject.js";
|
|
22
|
+
import getRandomValues from "get-random-values-esm";
|
|
23
|
+
import { setup, assign, assertEvent, emit, enqueueActions, createActor } from "xstate";
|
|
23
24
|
import get from "lodash/get.js";
|
|
24
25
|
import isUndefined from "lodash/isUndefined.js";
|
|
25
26
|
import omitBy from "lodash/omitBy.js";
|
|
26
|
-
import getRandomValues from "get-random-values-esm";
|
|
27
27
|
import { isHotkey } from "is-hotkey-esm";
|
|
28
28
|
import { htmlToBlocks, normalizeBlock } from "@sanity/block-tools";
|
|
29
29
|
function defineBehavior(behavior) {
|
|
@@ -317,6 +317,65 @@ const breakingBlockObject = {
|
|
|
317
317
|
blockObjects: coreBlockObjectBehaviors,
|
|
318
318
|
lists: coreListBehaviors
|
|
319
319
|
};
|
|
320
|
+
function createLinkBehaviors(config) {
|
|
321
|
+
const pasteLinkOnSelection = {
|
|
322
|
+
on: "paste",
|
|
323
|
+
guard: ({
|
|
324
|
+
context,
|
|
325
|
+
event
|
|
326
|
+
}) => {
|
|
327
|
+
const selectionCollapsed = selectionIsCollapsed(context), text = event.clipboardData.getData("text/plain"), url = looksLikeUrl(text) ? text : void 0, annotation = url !== void 0 ? config.linkAnnotation?.({
|
|
328
|
+
url,
|
|
329
|
+
schema: context.schema
|
|
330
|
+
}) : void 0;
|
|
331
|
+
return annotation && !selectionCollapsed ? {
|
|
332
|
+
annotation
|
|
333
|
+
} : !1;
|
|
334
|
+
},
|
|
335
|
+
actions: [(_, {
|
|
336
|
+
annotation
|
|
337
|
+
}) => [{
|
|
338
|
+
type: "annotation.add",
|
|
339
|
+
annotation
|
|
340
|
+
}]]
|
|
341
|
+
}, pasteLinkAtCaret = {
|
|
342
|
+
on: "paste",
|
|
343
|
+
guard: ({
|
|
344
|
+
context,
|
|
345
|
+
event
|
|
346
|
+
}) => {
|
|
347
|
+
const focusSpan = getFocusSpan(context), selectionCollapsed = selectionIsCollapsed(context);
|
|
348
|
+
if (!focusSpan || !selectionCollapsed)
|
|
349
|
+
return !1;
|
|
350
|
+
const text = event.clipboardData.getData("text/plain"), url = looksLikeUrl(text) ? text : void 0, annotation = url !== void 0 ? config.linkAnnotation?.({
|
|
351
|
+
url,
|
|
352
|
+
schema: context.schema
|
|
353
|
+
}) : void 0;
|
|
354
|
+
return url && annotation && selectionCollapsed ? {
|
|
355
|
+
focusSpan,
|
|
356
|
+
annotation,
|
|
357
|
+
url
|
|
358
|
+
} : !1;
|
|
359
|
+
},
|
|
360
|
+
actions: [(_, {
|
|
361
|
+
annotation,
|
|
362
|
+
url
|
|
363
|
+
}) => [{
|
|
364
|
+
type: "insert span",
|
|
365
|
+
text: url,
|
|
366
|
+
annotations: [annotation]
|
|
367
|
+
}]]
|
|
368
|
+
};
|
|
369
|
+
return [pasteLinkOnSelection, pasteLinkAtCaret];
|
|
370
|
+
}
|
|
371
|
+
function looksLikeUrl(text) {
|
|
372
|
+
let looksLikeUrl2 = !1;
|
|
373
|
+
try {
|
|
374
|
+
new URL(text), looksLikeUrl2 = !0;
|
|
375
|
+
} catch {
|
|
376
|
+
}
|
|
377
|
+
return looksLikeUrl2;
|
|
378
|
+
}
|
|
320
379
|
function isPortableTextSpan(node) {
|
|
321
380
|
return node._type === "span" && "text" in node && typeof node.text == "string" && (typeof node.marks > "u" || Array.isArray(node.marks) && node.marks.every((mark) => typeof mark == "string"));
|
|
322
381
|
}
|
|
@@ -573,65 +632,6 @@ function createMarkdownBehaviors(config) {
|
|
|
573
632
|
};
|
|
574
633
|
return [automaticBlockquoteOnSpace, automaticBreak, automaticHeadingOnSpace, clearStyleOnBackspace, automaticListOnSpace];
|
|
575
634
|
}
|
|
576
|
-
function createLinkBehaviors(config) {
|
|
577
|
-
const pasteLinkOnSelection = {
|
|
578
|
-
on: "paste",
|
|
579
|
-
guard: ({
|
|
580
|
-
context,
|
|
581
|
-
event
|
|
582
|
-
}) => {
|
|
583
|
-
const selectionCollapsed = selectionIsCollapsed(context), text = event.clipboardData.getData("text/plain"), url = looksLikeUrl(text) ? text : void 0, annotation = url !== void 0 ? config.linkAnnotation?.({
|
|
584
|
-
url,
|
|
585
|
-
schema: context.schema
|
|
586
|
-
}) : void 0;
|
|
587
|
-
return annotation && !selectionCollapsed ? {
|
|
588
|
-
annotation
|
|
589
|
-
} : !1;
|
|
590
|
-
},
|
|
591
|
-
actions: [(_, {
|
|
592
|
-
annotation
|
|
593
|
-
}) => [{
|
|
594
|
-
type: "annotation.add",
|
|
595
|
-
annotation
|
|
596
|
-
}]]
|
|
597
|
-
}, pasteLinkAtCaret = {
|
|
598
|
-
on: "paste",
|
|
599
|
-
guard: ({
|
|
600
|
-
context,
|
|
601
|
-
event
|
|
602
|
-
}) => {
|
|
603
|
-
const focusSpan = getFocusSpan(context), selectionCollapsed = selectionIsCollapsed(context);
|
|
604
|
-
if (!focusSpan || !selectionCollapsed)
|
|
605
|
-
return !1;
|
|
606
|
-
const text = event.clipboardData.getData("text/plain"), url = looksLikeUrl(text) ? text : void 0, annotation = url !== void 0 ? config.linkAnnotation?.({
|
|
607
|
-
url,
|
|
608
|
-
schema: context.schema
|
|
609
|
-
}) : void 0;
|
|
610
|
-
return url && annotation && selectionCollapsed ? {
|
|
611
|
-
focusSpan,
|
|
612
|
-
annotation,
|
|
613
|
-
url
|
|
614
|
-
} : !1;
|
|
615
|
-
},
|
|
616
|
-
actions: [(_, {
|
|
617
|
-
annotation,
|
|
618
|
-
url
|
|
619
|
-
}) => [{
|
|
620
|
-
type: "insert span",
|
|
621
|
-
text: url,
|
|
622
|
-
annotations: [annotation]
|
|
623
|
-
}]]
|
|
624
|
-
};
|
|
625
|
-
return [pasteLinkOnSelection, pasteLinkAtCaret];
|
|
626
|
-
}
|
|
627
|
-
function looksLikeUrl(text) {
|
|
628
|
-
let looksLikeUrl2 = !1;
|
|
629
|
-
try {
|
|
630
|
-
new URL(text), looksLikeUrl2 = !0;
|
|
631
|
-
} catch {
|
|
632
|
-
}
|
|
633
|
-
return looksLikeUrl2;
|
|
634
|
-
}
|
|
635
635
|
function getPortableTextMemberSchemaTypes(portableTextType) {
|
|
636
636
|
if (!portableTextType)
|
|
637
637
|
throw new Error("Parameter 'portabletextType' missing (required)");
|
|
@@ -2773,8 +2773,9 @@ function useSyncValue(props) {
|
|
|
2773
2773
|
const {
|
|
2774
2774
|
editorActor,
|
|
2775
2775
|
portableTextEditor,
|
|
2776
|
-
readOnly
|
|
2777
|
-
|
|
2776
|
+
readOnly,
|
|
2777
|
+
slateEditor
|
|
2778
|
+
} = props, schemaTypes = editorActor.getSnapshot().context.schema, previousValue = useRef(), updateValueFunctionRef = useRef(), updateFromCurrentValue = useCallback(() => {
|
|
2778
2779
|
const currentValue = CURRENT_VALUE.get(portableTextEditor);
|
|
2779
2780
|
if (previousValue.current === currentValue) {
|
|
2780
2781
|
debug$j("Value is the same object as previous, not need to sync");
|
|
@@ -2957,27 +2958,29 @@ function _updateBlock(slateEditor, currentBlock, oldBlock, currentBlockIndex) {
|
|
|
2957
2958
|
}
|
|
2958
2959
|
const debug$i = debugWithName("component:PortableTextEditor:Synchronizer"), debugVerbose$3 = debug$i.enabled && !1, FLUSH_PATCHES_THROTTLED_MS = process.env.NODE_ENV === "test" ? 500 : 1e3;
|
|
2959
2960
|
function Synchronizer(props) {
|
|
2960
|
-
const $ = c(
|
|
2961
|
+
const $ = c(26), readOnly = useSelector(props.editorActor, _temp), value = useSelector(props.editorActor, _temp2), {
|
|
2961
2962
|
editorActor,
|
|
2962
2963
|
getValue,
|
|
2963
|
-
|
|
2964
|
+
portableTextEditor,
|
|
2965
|
+
slateEditor
|
|
2964
2966
|
} = props;
|
|
2965
2967
|
let t0;
|
|
2966
2968
|
$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = [], $[0] = t0) : t0 = $[0];
|
|
2967
2969
|
const pendingPatches = useRef(t0);
|
|
2968
2970
|
let t1;
|
|
2969
|
-
$[1] !== editorActor || $[2] !== portableTextEditor || $[3] !== readOnly ? (t1 = {
|
|
2971
|
+
$[1] !== editorActor || $[2] !== portableTextEditor || $[3] !== readOnly || $[4] !== slateEditor ? (t1 = {
|
|
2970
2972
|
editorActor,
|
|
2971
2973
|
portableTextEditor,
|
|
2972
|
-
readOnly
|
|
2973
|
-
|
|
2974
|
-
|
|
2974
|
+
readOnly,
|
|
2975
|
+
slateEditor
|
|
2976
|
+
}, $[1] = editorActor, $[2] = portableTextEditor, $[3] = readOnly, $[4] = slateEditor, $[5] = t1) : t1 = $[5];
|
|
2977
|
+
const syncValue = useSyncValue(t1);
|
|
2975
2978
|
let t2, t3;
|
|
2976
|
-
$[
|
|
2979
|
+
$[6] !== slateEditor ? (t2 = () => {
|
|
2977
2980
|
IS_PROCESSING_LOCAL_CHANGES.set(slateEditor, !1);
|
|
2978
|
-
}, t3 = [slateEditor], $[
|
|
2981
|
+
}, t3 = [slateEditor], $[6] = slateEditor, $[7] = t2, $[8] = t3) : (t2 = $[7], t3 = $[8]), useEffect(t2, t3);
|
|
2979
2982
|
let t4;
|
|
2980
|
-
$[
|
|
2983
|
+
$[9] !== editorActor || $[10] !== getValue || $[11] !== slateEditor ? (t4 = () => {
|
|
2981
2984
|
if (pendingPatches.current.length > 0) {
|
|
2982
2985
|
debug$i("Flushing pending patches"), debugVerbose$3 && debug$i(`Patches:
|
|
2983
2986
|
${JSON.stringify(pendingPatches.current, null, 2)}`);
|
|
@@ -2989,17 +2992,14 @@ ${JSON.stringify(pendingPatches.current, null, 2)}`);
|
|
|
2989
2992
|
}), pendingPatches.current = [];
|
|
2990
2993
|
}
|
|
2991
2994
|
IS_PROCESSING_LOCAL_CHANGES.set(slateEditor, !1);
|
|
2992
|
-
}, $[
|
|
2995
|
+
}, $[9] = editorActor, $[10] = getValue, $[11] = slateEditor, $[12] = t4) : t4 = $[12];
|
|
2993
2996
|
const onFlushPendingPatches = t4;
|
|
2994
2997
|
let t5, t6;
|
|
2995
|
-
$[
|
|
2998
|
+
$[13] !== onFlushPendingPatches ? (t5 = () => () => {
|
|
2996
2999
|
onFlushPendingPatches();
|
|
2997
|
-
}, t6 = [onFlushPendingPatches], $[
|
|
2998
|
-
let t7;
|
|
2999
|
-
$[
|
|
3000
|
-
const handleChange = useEffectEvent(t7);
|
|
3001
|
-
let t8, t9;
|
|
3002
|
-
$[17] !== editorActor || $[18] !== handleChange || $[19] !== onFlushPendingPatches || $[20] !== slateEditor ? (t8 = () => {
|
|
3000
|
+
}, t6 = [onFlushPendingPatches], $[13] = onFlushPendingPatches, $[14] = t5, $[15] = t6) : (t5 = $[14], t6 = $[15]), useEffect(t5, t6);
|
|
3001
|
+
let t7, t8;
|
|
3002
|
+
$[16] !== editorActor || $[17] !== onFlushPendingPatches || $[18] !== slateEditor ? (t7 = () => {
|
|
3003
3003
|
const onFlushPendingPatchesThrottled = throttle(() => {
|
|
3004
3004
|
if (Editor.isNormalizing(slateEditor)) {
|
|
3005
3005
|
onFlushPendingPatches();
|
|
@@ -3010,90 +3010,76 @@ ${JSON.stringify(pendingPatches.current, null, 2)}`);
|
|
|
3010
3010
|
leading: !1,
|
|
3011
3011
|
trailing: !0
|
|
3012
3012
|
});
|
|
3013
|
-
debug$i("Subscribing to
|
|
3014
|
-
const sub = editorActor.on("
|
|
3015
|
-
|
|
3016
|
-
case "patch": {
|
|
3017
|
-
IS_PROCESSING_LOCAL_CHANGES.set(slateEditor, !0), pendingPatches.current.push(event.patch), onFlushPendingPatchesThrottled(), handleChange(event);
|
|
3018
|
-
break bb22;
|
|
3019
|
-
}
|
|
3020
|
-
case "loading": {
|
|
3021
|
-
handleChange({
|
|
3022
|
-
type: "loading",
|
|
3023
|
-
isLoading: !0
|
|
3024
|
-
});
|
|
3025
|
-
break bb22;
|
|
3026
|
-
}
|
|
3027
|
-
case "done loading": {
|
|
3028
|
-
handleChange({
|
|
3029
|
-
type: "loading",
|
|
3030
|
-
isLoading: !1
|
|
3031
|
-
});
|
|
3032
|
-
break bb22;
|
|
3033
|
-
}
|
|
3034
|
-
case "focused": {
|
|
3035
|
-
handleChange({
|
|
3036
|
-
type: "focus",
|
|
3037
|
-
event: event.event
|
|
3038
|
-
});
|
|
3039
|
-
break bb22;
|
|
3040
|
-
}
|
|
3041
|
-
case "value changed": {
|
|
3042
|
-
handleChange({
|
|
3043
|
-
type: "value",
|
|
3044
|
-
value: event.value
|
|
3045
|
-
});
|
|
3046
|
-
break bb22;
|
|
3047
|
-
}
|
|
3048
|
-
case "invalid value": {
|
|
3049
|
-
handleChange({
|
|
3050
|
-
type: "invalidValue",
|
|
3051
|
-
resolution: event.resolution,
|
|
3052
|
-
value: event.value
|
|
3053
|
-
});
|
|
3054
|
-
break bb22;
|
|
3055
|
-
}
|
|
3056
|
-
case "error": {
|
|
3057
|
-
handleChange({
|
|
3058
|
-
...event,
|
|
3059
|
-
level: "warning"
|
|
3060
|
-
});
|
|
3061
|
-
break bb22;
|
|
3062
|
-
}
|
|
3063
|
-
case "annotation.add":
|
|
3064
|
-
case "annotation.remove":
|
|
3065
|
-
case "annotation.toggle":
|
|
3066
|
-
case "focus":
|
|
3067
|
-
case "patches":
|
|
3068
|
-
break bb22;
|
|
3069
|
-
default:
|
|
3070
|
-
handleChange(event);
|
|
3071
|
-
}
|
|
3013
|
+
debug$i("Subscribing to patch events");
|
|
3014
|
+
const sub = editorActor.on("patch", (event) => {
|
|
3015
|
+
IS_PROCESSING_LOCAL_CHANGES.set(slateEditor, !0), pendingPatches.current.push(event.patch), onFlushPendingPatchesThrottled();
|
|
3072
3016
|
});
|
|
3073
3017
|
return () => {
|
|
3074
|
-
debug$i("Unsubscribing to
|
|
3018
|
+
debug$i("Unsubscribing to patch events"), sub.unsubscribe();
|
|
3075
3019
|
};
|
|
3076
|
-
},
|
|
3020
|
+
}, t8 = [editorActor, onFlushPendingPatches, slateEditor], $[16] = editorActor, $[17] = onFlushPendingPatches, $[18] = slateEditor, $[19] = t7, $[20] = t8) : (t7 = $[19], t8 = $[20]), useEffect(t7, t8);
|
|
3077
3021
|
const isInitialValueFromProps = useRef(!0);
|
|
3078
|
-
let t10,
|
|
3079
|
-
return $[
|
|
3022
|
+
let t10, t9;
|
|
3023
|
+
return $[21] !== editorActor || $[22] !== syncValue || $[23] !== value ? (t9 = () => {
|
|
3080
3024
|
debug$i("Value from props changed, syncing new value"), syncValue(value), isInitialValueFromProps.current && (editorActor.send({
|
|
3081
3025
|
type: "ready"
|
|
3082
3026
|
}), isInitialValueFromProps.current = !1);
|
|
3083
|
-
},
|
|
3027
|
+
}, t10 = [editorActor, syncValue, value], $[21] = editorActor, $[22] = syncValue, $[23] = value, $[24] = t10, $[25] = t9) : (t10 = $[24], t9 = $[25]), useEffect(t9, t10), null;
|
|
3084
3028
|
}
|
|
3085
3029
|
function _temp2(s_0) {
|
|
3086
3030
|
return s_0.context.value;
|
|
3087
3031
|
}
|
|
3088
|
-
function _temp
|
|
3032
|
+
function _temp(s) {
|
|
3089
3033
|
return s.context.readOnly;
|
|
3090
3034
|
}
|
|
3091
3035
|
Synchronizer.displayName = "Synchronizer";
|
|
3092
|
-
const
|
|
3036
|
+
const EditorActorContext = createContext({}), PortableTextEditorSelectionContext = createContext(null), usePortableTextEditorSelection = () => {
|
|
3037
|
+
const selection = useContext(PortableTextEditorSelectionContext);
|
|
3038
|
+
if (selection === void 0)
|
|
3039
|
+
throw new Error("The `usePortableTextEditorSelection` hook must be used inside the <PortableTextEditor> component's context.");
|
|
3040
|
+
return selection;
|
|
3041
|
+
}, debug$h = debugWithName("component:PortableTextEditor:SelectionProvider"), debugVerbose$2 = debug$h.enabled && !1;
|
|
3042
|
+
function PortableTextEditorSelectionProvider(props) {
|
|
3043
|
+
const $ = c(6), [selection, setSelection] = useState(null);
|
|
3044
|
+
let t0, t1;
|
|
3045
|
+
$[0] !== props.editorActor ? (t0 = () => {
|
|
3046
|
+
debug$h("Subscribing to selection changes");
|
|
3047
|
+
const subscription = props.editorActor.on("selection", (event) => {
|
|
3048
|
+
startTransition(() => {
|
|
3049
|
+
debugVerbose$2 && debug$h("Setting selection"), setSelection(event.selection);
|
|
3050
|
+
});
|
|
3051
|
+
});
|
|
3052
|
+
return () => {
|
|
3053
|
+
debug$h("Unsubscribing to selection changes"), subscription.unsubscribe();
|
|
3054
|
+
};
|
|
3055
|
+
}, t1 = [props.editorActor], $[0] = props.editorActor, $[1] = t0, $[2] = t1) : (t0 = $[1], t1 = $[2]), useEffect(t0, t1);
|
|
3056
|
+
let t2;
|
|
3057
|
+
return $[3] !== props.children || $[4] !== selection ? (t2 = /* @__PURE__ */ jsx(PortableTextEditorSelectionContext.Provider, { value: selection, children: props.children }), $[3] = props.children, $[4] = selection, $[5] = t2) : t2 = $[5], t2;
|
|
3058
|
+
}
|
|
3059
|
+
const defaultKeyGenerator = () => randomKey(12), getByteHexTable = /* @__PURE__ */ (() => {
|
|
3060
|
+
let table;
|
|
3061
|
+
return () => {
|
|
3062
|
+
if (table)
|
|
3063
|
+
return table;
|
|
3064
|
+
table = [];
|
|
3065
|
+
for (let i = 0; i < 256; ++i)
|
|
3066
|
+
table[i] = (i + 256).toString(16).slice(1);
|
|
3067
|
+
return table;
|
|
3068
|
+
};
|
|
3069
|
+
})();
|
|
3070
|
+
function whatwgRNG(length = 16) {
|
|
3071
|
+
const rnds8 = new Uint8Array(length);
|
|
3072
|
+
return getRandomValues(rnds8), rnds8;
|
|
3073
|
+
}
|
|
3074
|
+
function randomKey(length) {
|
|
3075
|
+
const table = getByteHexTable();
|
|
3076
|
+
return whatwgRNG(length).reduce((str, n) => str + table[n], "").slice(0, length);
|
|
3077
|
+
}
|
|
3078
|
+
const debug$g = debugWithName("operationToPatches");
|
|
3093
3079
|
function createOperationToPatches(types) {
|
|
3094
3080
|
const textBlockName = types.block.name;
|
|
3095
3081
|
function insertTextPatch(editor, operation, beforeValue) {
|
|
3096
|
-
debug$
|
|
3082
|
+
debug$g.enabled && debug$g("Operation", JSON.stringify(operation, null, 2));
|
|
3097
3083
|
const block = editor.isTextBlock(editor.children[operation.path[0]]) && editor.children[operation.path[0]];
|
|
3098
3084
|
if (!block)
|
|
3099
3085
|
throw new Error("Could not find block");
|
|
@@ -3186,7 +3172,7 @@ function createOperationToPatches(types) {
|
|
|
3186
3172
|
_key: block.children[operation.path[1] - 1]._key
|
|
3187
3173
|
}])];
|
|
3188
3174
|
}
|
|
3189
|
-
return debug$
|
|
3175
|
+
return debug$g("Something was inserted into a void block. Not producing editor patches."), [];
|
|
3190
3176
|
}
|
|
3191
3177
|
function splitNodePatch(editor, operation, beforeValue) {
|
|
3192
3178
|
const patches = [], splitBlock = editor.children[operation.path[0]];
|
|
@@ -3244,9 +3230,9 @@ function createOperationToPatches(types) {
|
|
|
3244
3230
|
_key: block._key
|
|
3245
3231
|
}, "children", {
|
|
3246
3232
|
_key: spanToRemove._key
|
|
3247
|
-
}])] : (debug$
|
|
3233
|
+
}])] : (debug$g("Span not found in editor trying to remove node"), []);
|
|
3248
3234
|
} else
|
|
3249
|
-
return debug$
|
|
3235
|
+
return debug$g("Not creating patch inside object block"), [];
|
|
3250
3236
|
}
|
|
3251
3237
|
function mergeNodePatch(editor, operation, beforeValue) {
|
|
3252
3238
|
const patches = [], block = beforeValue[operation.path[0]], updatedBlock = editor.children[operation.path[0]];
|
|
@@ -3272,7 +3258,7 @@ function createOperationToPatches(types) {
|
|
|
3272
3258
|
_key: removedSpan._key
|
|
3273
3259
|
}])) : console.warn(`Multiple spans have \`_key\` ${removedSpan._key}. It's ambiguous which one to remove.`, JSON.stringify(block, null, 2)));
|
|
3274
3260
|
} else
|
|
3275
|
-
debug$
|
|
3261
|
+
debug$g("Void nodes can't be merged, not creating any patches");
|
|
3276
3262
|
return patches;
|
|
3277
3263
|
}
|
|
3278
3264
|
function moveNodePatch(editor, operation, beforeValue) {
|
|
@@ -3517,13 +3503,13 @@ function createWithObjectKeys(editorActor, schemaTypes) {
|
|
|
3517
3503
|
}, editor;
|
|
3518
3504
|
};
|
|
3519
3505
|
}
|
|
3520
|
-
const debug$
|
|
3506
|
+
const debug$f = debugWithName("applyPatches"), debugVerbose$1 = debug$f.enabled && !0;
|
|
3521
3507
|
function createApplyPatch(schemaTypes) {
|
|
3522
3508
|
return (editor, patch) => {
|
|
3523
3509
|
let changed = !1;
|
|
3524
|
-
debugVerbose$
|
|
3510
|
+
debugVerbose$1 && (debug$f(`
|
|
3525
3511
|
|
|
3526
|
-
NEW PATCH =============================================================`), debug$
|
|
3512
|
+
NEW PATCH =============================================================`), debug$f(JSON.stringify(patch, null, 2)));
|
|
3527
3513
|
try {
|
|
3528
3514
|
switch (patch.type) {
|
|
3529
3515
|
case "insert":
|
|
@@ -3539,7 +3525,7 @@ NEW PATCH =============================================================`), debug
|
|
|
3539
3525
|
changed = diffMatchPatch(editor, patch);
|
|
3540
3526
|
break;
|
|
3541
3527
|
default:
|
|
3542
|
-
debug$
|
|
3528
|
+
debug$f("Unhandled patch", patch.type);
|
|
3543
3529
|
}
|
|
3544
3530
|
} catch (err) {
|
|
3545
3531
|
console.error(err);
|
|
@@ -3554,9 +3540,9 @@ function diffMatchPatch(editor, patch) {
|
|
|
3554
3540
|
childPath
|
|
3555
3541
|
} = findBlockAndChildFromPath(editor, patch.path);
|
|
3556
3542
|
if (!block)
|
|
3557
|
-
return debug$
|
|
3543
|
+
return debug$f("Block not found"), !1;
|
|
3558
3544
|
if (!child || !childPath)
|
|
3559
|
-
return debug$
|
|
3545
|
+
return debug$f("Child not found"), !1;
|
|
3560
3546
|
if (!(block && editor.isTextBlock(block) && patch.path.length === 4 && patch.path[1] === "children" && patch.path[3] === "text") || !Text.isText(child))
|
|
3561
3547
|
return !1;
|
|
3562
3548
|
const patches = parse(patch.value), [newValue] = apply(patches, child.text, {
|
|
@@ -3586,9 +3572,9 @@ function insertPatch(editor, patch, schemaTypes) {
|
|
|
3586
3572
|
childPath: targetChildPath
|
|
3587
3573
|
} = findBlockAndChildFromPath(editor, patch.path);
|
|
3588
3574
|
if (!targetBlock || !targetBlockPath)
|
|
3589
|
-
return debug$
|
|
3575
|
+
return debug$f("Block not found"), !1;
|
|
3590
3576
|
if (patch.path.length > 1 && patch.path[1] !== "children")
|
|
3591
|
-
return debug$
|
|
3577
|
+
return debug$f("Ignoring patch targeting void value"), !1;
|
|
3592
3578
|
if (patch.path.length === 1) {
|
|
3593
3579
|
const {
|
|
3594
3580
|
items: items2,
|
|
@@ -3596,7 +3582,7 @@ function insertPatch(editor, patch, schemaTypes) {
|
|
|
3596
3582
|
} = patch, blocksToInsert = toSlateValue(items2, {
|
|
3597
3583
|
schemaTypes
|
|
3598
3584
|
}, KEY_TO_SLATE_ELEMENT.get(editor)), targetBlockIndex = targetBlockPath[0], normalizedIdx2 = position2 === "after" ? targetBlockIndex + 1 : targetBlockIndex;
|
|
3599
|
-
return debug$
|
|
3585
|
+
return debug$f(`Inserting blocks at path [${normalizedIdx2}]`), debugState(editor, "before"), Transforms.insertNodes(editor, blocksToInsert, {
|
|
3600
3586
|
at: [normalizedIdx2]
|
|
3601
3587
|
}), debugState(editor, "after"), !0;
|
|
3602
3588
|
}
|
|
@@ -3605,14 +3591,14 @@ function insertPatch(editor, patch, schemaTypes) {
|
|
|
3605
3591
|
position
|
|
3606
3592
|
} = patch;
|
|
3607
3593
|
if (!targetChild || !targetChildPath)
|
|
3608
|
-
return debug$
|
|
3594
|
+
return debug$f("Child not found"), !1;
|
|
3609
3595
|
const childrenToInsert = targetBlock && toSlateValue([{
|
|
3610
3596
|
...targetBlock,
|
|
3611
3597
|
children: items
|
|
3612
3598
|
}], {
|
|
3613
3599
|
schemaTypes
|
|
3614
3600
|
}, KEY_TO_SLATE_ELEMENT.get(editor)), targetChildIndex = targetChildPath[1], normalizedIdx = position === "after" ? targetChildIndex + 1 : targetChildIndex, childInsertPath = [targetChildPath[0], normalizedIdx];
|
|
3615
|
-
return debug$
|
|
3601
|
+
return debug$f(`Inserting children at path ${childInsertPath}`), debugState(editor, "before"), childrenToInsert && Element$1.isElement(childrenToInsert[0]) && Transforms.insertNodes(editor, childrenToInsert[0].children, {
|
|
3616
3602
|
at: childInsertPath
|
|
3617
3603
|
}), debugState(editor, "after"), !0;
|
|
3618
3604
|
}
|
|
@@ -3626,14 +3612,14 @@ function setPatch(editor, patch) {
|
|
|
3626
3612
|
childPath
|
|
3627
3613
|
} = findBlockAndChildFromPath(editor, patch.path);
|
|
3628
3614
|
if (!block)
|
|
3629
|
-
return debug$
|
|
3615
|
+
return debug$f("Block not found"), !1;
|
|
3630
3616
|
const isTextBlock = editor.isTextBlock(block);
|
|
3631
3617
|
if (isTextBlock && patch.path.length > 1 && patch.path[1] !== "children")
|
|
3632
|
-
return debug$
|
|
3618
|
+
return debug$f("Ignoring setting void value"), !1;
|
|
3633
3619
|
if (debugState(editor, "before"), isTextBlock && child && childPath) {
|
|
3634
3620
|
if (Text.isText(value) && Text.isText(child)) {
|
|
3635
3621
|
const newText = child.text;
|
|
3636
|
-
value.text !== newText && (debug$
|
|
3622
|
+
value.text !== newText && (debug$f("Setting text property"), editor.apply({
|
|
3637
3623
|
type: "remove_text",
|
|
3638
3624
|
path: childPath,
|
|
3639
3625
|
offset: 0,
|
|
@@ -3645,7 +3631,7 @@ function setPatch(editor, patch) {
|
|
|
3645
3631
|
text: value.text
|
|
3646
3632
|
}), editor.onChange());
|
|
3647
3633
|
} else
|
|
3648
|
-
debug$
|
|
3634
|
+
debug$f("Setting non-text property"), editor.apply({
|
|
3649
3635
|
type: "set_node",
|
|
3650
3636
|
path: childPath,
|
|
3651
3637
|
properties: {},
|
|
@@ -3653,7 +3639,7 @@ function setPatch(editor, patch) {
|
|
|
3653
3639
|
});
|
|
3654
3640
|
return !0;
|
|
3655
3641
|
} else if (Element$1.isElement(block) && patch.path.length === 1 && blockPath) {
|
|
3656
|
-
debug$
|
|
3642
|
+
debug$f("Setting block property");
|
|
3657
3643
|
const {
|
|
3658
3644
|
children,
|
|
3659
3645
|
...nextRest
|
|
@@ -3670,7 +3656,7 @@ function setPatch(editor, patch) {
|
|
|
3670
3656
|
...prevRest
|
|
3671
3657
|
},
|
|
3672
3658
|
newProperties: nextRest
|
|
3673
|
-
}), debug$
|
|
3659
|
+
}), debug$f("Setting children"), block.children.forEach((c2, cIndex) => {
|
|
3674
3660
|
editor.apply({
|
|
3675
3661
|
type: "remove_node",
|
|
3676
3662
|
path: blockPath.concat(block.children.length - 1 - cIndex),
|
|
@@ -3696,7 +3682,7 @@ function setPatch(editor, patch) {
|
|
|
3696
3682
|
}
|
|
3697
3683
|
function unsetPatch(editor, patch) {
|
|
3698
3684
|
if (patch.path.length === 0) {
|
|
3699
|
-
debug$
|
|
3685
|
+
debug$f("Removing everything"), debugState(editor, "before");
|
|
3700
3686
|
const previousSelection = editor.selection;
|
|
3701
3687
|
return Transforms.deselect(editor), editor.children.forEach((_child, i) => {
|
|
3702
3688
|
Transforms.removeNodes(editor, {
|
|
@@ -3723,13 +3709,13 @@ function unsetPatch(editor, patch) {
|
|
|
3723
3709
|
} = findBlockAndChildFromPath(editor, patch.path);
|
|
3724
3710
|
if (patch.path.length === 1) {
|
|
3725
3711
|
if (!block || !blockPath)
|
|
3726
|
-
return debug$
|
|
3712
|
+
return debug$f("Block not found"), !1;
|
|
3727
3713
|
const blockIndex = blockPath[0];
|
|
3728
|
-
return debug$
|
|
3714
|
+
return debug$f(`Removing block at path [${blockIndex}]`), debugState(editor, "before"), Transforms.removeNodes(editor, {
|
|
3729
3715
|
at: [blockIndex]
|
|
3730
3716
|
}), debugState(editor, "after"), !0;
|
|
3731
3717
|
}
|
|
3732
|
-
return editor.isTextBlock(block) && patch.path[1] === "children" && patch.path.length === 3 ? !child || !childPath ? (debug$
|
|
3718
|
+
return editor.isTextBlock(block) && patch.path[1] === "children" && patch.path.length === 3 ? !child || !childPath ? (debug$f("Child not found"), !1) : (debug$f(`Unsetting child at path ${JSON.stringify(childPath)}`), debugState(editor, "before"), debugVerbose$1 && debug$f(`Removing child at path ${JSON.stringify(childPath)}`), Transforms.removeNodes(editor, {
|
|
3733
3719
|
at: childPath
|
|
3734
3720
|
}), debugState(editor, "after"), !0) : !1;
|
|
3735
3721
|
}
|
|
@@ -3737,7 +3723,7 @@ function isKeyedSegment(segment) {
|
|
|
3737
3723
|
return typeof segment == "object" && "_key" in segment;
|
|
3738
3724
|
}
|
|
3739
3725
|
function debugState(editor, stateName) {
|
|
3740
|
-
debugVerbose$
|
|
3726
|
+
debugVerbose$1 && (debug$f(`Children ${stateName}:`, JSON.stringify(editor.children, null, 2)), debug$f(`Selection ${stateName}: `, JSON.stringify(editor.selection, null, 2)));
|
|
3741
3727
|
}
|
|
3742
3728
|
function findBlockFromPath(editor, path) {
|
|
3743
3729
|
let blockIndex = -1;
|
|
@@ -3779,7 +3765,7 @@ function findBlockAndChildFromPath(editor, path) {
|
|
|
3779
3765
|
childPath: void 0
|
|
3780
3766
|
};
|
|
3781
3767
|
}
|
|
3782
|
-
const debug$
|
|
3768
|
+
const debug$e = debugWithName("plugin:withPatches");
|
|
3783
3769
|
function createWithPatches({
|
|
3784
3770
|
editorActor,
|
|
3785
3771
|
patchFunctions,
|
|
@@ -3805,7 +3791,7 @@ function createWithPatches({
|
|
|
3805
3791
|
withoutPatching(editor, () => {
|
|
3806
3792
|
withoutSaving(editor, () => {
|
|
3807
3793
|
patches.forEach((patch) => {
|
|
3808
|
-
debug$
|
|
3794
|
+
debug$e.enabled && debug$e(`Handling remote patch ${JSON.stringify(patch)}`), changed = applyPatch(editor, patch);
|
|
3809
3795
|
});
|
|
3810
3796
|
});
|
|
3811
3797
|
});
|
|
@@ -3818,10 +3804,10 @@ function createWithPatches({
|
|
|
3818
3804
|
remotePatches.length !== 0 && (bufferedPatches = bufferedPatches.concat(remotePatches), handleBufferedRemotePatches());
|
|
3819
3805
|
};
|
|
3820
3806
|
return subscriptions.push(() => {
|
|
3821
|
-
debug$
|
|
3807
|
+
debug$e("Subscribing to remote patches");
|
|
3822
3808
|
const sub = editorActor.on("patches", handlePatches);
|
|
3823
3809
|
return () => {
|
|
3824
|
-
debug$
|
|
3810
|
+
debug$e("Unsubscribing to remote patches"), sub.unsubscribe();
|
|
3825
3811
|
};
|
|
3826
3812
|
}), editor.apply = (operation) => {
|
|
3827
3813
|
if (editorActor.getSnapshot().context.readOnly)
|
|
@@ -3874,7 +3860,7 @@ function createWithPatches({
|
|
|
3874
3860
|
}, editor;
|
|
3875
3861
|
};
|
|
3876
3862
|
}
|
|
3877
|
-
const debug$
|
|
3863
|
+
const debug$d = debugWithName("plugin:withPlaceholderBlock");
|
|
3878
3864
|
function createWithPlaceholderBlock(editorActor) {
|
|
3879
3865
|
return function(editor) {
|
|
3880
3866
|
const {
|
|
@@ -3894,7 +3880,7 @@ function createWithPlaceholderBlock(editorActor) {
|
|
|
3894
3880
|
const node = op.node;
|
|
3895
3881
|
if (op.path[0] === 0 && Editor.isVoid(editor, node)) {
|
|
3896
3882
|
const nextPath = Path.next(op.path);
|
|
3897
|
-
editor.children[nextPath[0]] || (debug$
|
|
3883
|
+
editor.children[nextPath[0]] || (debug$d("Adding placeholder block"), Editor.insertNode(editor, editor.pteCreateTextBlock({
|
|
3898
3884
|
decorators: []
|
|
3899
3885
|
})));
|
|
3900
3886
|
}
|
|
@@ -3904,7 +3890,7 @@ function createWithPlaceholderBlock(editorActor) {
|
|
|
3904
3890
|
}, editor;
|
|
3905
3891
|
};
|
|
3906
3892
|
}
|
|
3907
|
-
const debug$
|
|
3893
|
+
const debug$c = debugWithName("plugin:withPortableTextBlockStyle");
|
|
3908
3894
|
function createWithPortableTextBlockStyle(editorActor, types) {
|
|
3909
3895
|
const defaultStyle = types.styles[0].value;
|
|
3910
3896
|
return function(editor) {
|
|
@@ -3917,7 +3903,7 @@ function createWithPortableTextBlockStyle(editorActor, types) {
|
|
|
3917
3903
|
if (op.type === "split_node" && op.path.length === 1 && editor.isTextBlock(op.properties) && op.properties.style !== defaultStyle && op.path[0] === path[0] && !Path.equals(path, op.path)) {
|
|
3918
3904
|
const [child] = Editor.node(editor, [op.path[0] + 1, 0]);
|
|
3919
3905
|
if (Text.isText(child) && child.text === "") {
|
|
3920
|
-
debug$
|
|
3906
|
+
debug$c(`Normalizing split node to ${defaultStyle} style`, op), editorActor.send({
|
|
3921
3907
|
type: "normalizing"
|
|
3922
3908
|
}), Transforms.setNodes(editor, {
|
|
3923
3909
|
style: defaultStyle
|
|
@@ -3939,12 +3925,12 @@ function createWithPortableTextBlockStyle(editorActor, types) {
|
|
|
3939
3925
|
at: editor.selection,
|
|
3940
3926
|
match: (node) => editor.isTextBlock(node)
|
|
3941
3927
|
})].forEach(([node, path]) => {
|
|
3942
|
-
editor.isTextBlock(node) && node.style === blockStyle ? (debug$
|
|
3928
|
+
editor.isTextBlock(node) && node.style === blockStyle ? (debug$c(`Unsetting block style '${blockStyle}'`), Transforms.setNodes(editor, {
|
|
3943
3929
|
...node,
|
|
3944
3930
|
style: defaultStyle
|
|
3945
3931
|
}, {
|
|
3946
3932
|
at: path
|
|
3947
|
-
})) : (blockStyle ? debug$
|
|
3933
|
+
})) : (blockStyle ? debug$c(`Setting style '${blockStyle}'`) : debug$c("Setting default style", defaultStyle), Transforms.setNodes(editor, {
|
|
3948
3934
|
...node,
|
|
3949
3935
|
style: blockStyle || defaultStyle
|
|
3950
3936
|
}, {
|
|
@@ -3954,11 +3940,11 @@ function createWithPortableTextBlockStyle(editorActor, types) {
|
|
|
3954
3940
|
}, editor;
|
|
3955
3941
|
};
|
|
3956
3942
|
}
|
|
3957
|
-
const debug$
|
|
3943
|
+
const debug$b = debugWithName("plugin:withPortableTextLists"), MAX_LIST_LEVEL = 10;
|
|
3958
3944
|
function createWithPortableTextLists(types) {
|
|
3959
3945
|
return function(editor) {
|
|
3960
3946
|
return editor.pteToggleListItem = (listItemStyle) => {
|
|
3961
|
-
editor.pteHasListStyle(listItemStyle) ? (debug$
|
|
3947
|
+
editor.pteHasListStyle(listItemStyle) ? (debug$b(`Remove list item '${listItemStyle}'`), editor.pteUnsetListItem(listItemStyle)) : (debug$b(`Add list item '${listItemStyle}'`), editor.pteSetListItem(listItemStyle));
|
|
3962
3948
|
}, editor.pteUnsetListItem = (listItemStyle) => {
|
|
3963
3949
|
editor.selection && [...Editor.nodes(editor, {
|
|
3964
3950
|
at: editor.selection,
|
|
@@ -3974,7 +3960,7 @@ function createWithPortableTextLists(types) {
|
|
|
3974
3960
|
listItem: void 0,
|
|
3975
3961
|
level: void 0
|
|
3976
3962
|
};
|
|
3977
|
-
debug$
|
|
3963
|
+
debug$b(`Unsetting list '${listItemStyle}'`), Transforms.setNodes(editor, newNode, {
|
|
3978
3964
|
at: path
|
|
3979
3965
|
});
|
|
3980
3966
|
}
|
|
@@ -3984,7 +3970,7 @@ function createWithPortableTextLists(types) {
|
|
|
3984
3970
|
at: editor.selection,
|
|
3985
3971
|
match: (node) => editor.isTextBlock(node)
|
|
3986
3972
|
})].forEach(([node, path]) => {
|
|
3987
|
-
debug$
|
|
3973
|
+
debug$b(`Setting list '${listItemStyle}'`), Transforms.setNodes(editor, {
|
|
3988
3974
|
...node,
|
|
3989
3975
|
level: 1,
|
|
3990
3976
|
listItem: listItemStyle || types.lists[0] && types.lists[0].value
|
|
@@ -4000,7 +3986,7 @@ function createWithPortableTextLists(types) {
|
|
|
4000
3986
|
match: (node) => Element$1.isElement(node) && editor.isListBlock(node) && node.children.length === 1 && Text.isText(node.children[0]) && node.children[0].text === ""
|
|
4001
3987
|
})];
|
|
4002
3988
|
return selectedBlocks.length === 0 ? !1 : (selectedBlocks.forEach(([node, path]) => {
|
|
4003
|
-
Element$1.isElement(node) && (debug$
|
|
3989
|
+
Element$1.isElement(node) && (debug$b("Unset list"), Transforms.setNodes(editor, {
|
|
4004
3990
|
...node,
|
|
4005
3991
|
level: void 0,
|
|
4006
3992
|
listItem: void 0
|
|
@@ -4018,7 +4004,7 @@ function createWithPortableTextLists(types) {
|
|
|
4018
4004
|
return selectedBlocks.length === 0 ? !1 : (selectedBlocks.forEach(([node, path]) => {
|
|
4019
4005
|
if (editor.isListBlock(node)) {
|
|
4020
4006
|
let level = node.level || 1;
|
|
4021
|
-
reverse ? (level--, debug$
|
|
4007
|
+
reverse ? (level--, debug$b("Decrementing list level", Math.min(MAX_LIST_LEVEL, Math.max(1, level)))) : (level++, debug$b("Incrementing list level", Math.min(MAX_LIST_LEVEL, Math.max(1, level)))), Transforms.setNodes(editor, {
|
|
4022
4008
|
level: Math.min(MAX_LIST_LEVEL, Math.max(1, level))
|
|
4023
4009
|
}, {
|
|
4024
4010
|
at: path
|
|
@@ -4064,7 +4050,7 @@ function getNextSpan({
|
|
|
4064
4050
|
}
|
|
4065
4051
|
return nextSpan;
|
|
4066
4052
|
}
|
|
4067
|
-
const debug$
|
|
4053
|
+
const debug$a = debugWithName("plugin:withPortableTextMarkModel");
|
|
4068
4054
|
function createWithPortableTextMarkModel(editorActor, types) {
|
|
4069
4055
|
return function(editor) {
|
|
4070
4056
|
const {
|
|
@@ -4078,7 +4064,7 @@ function createWithPortableTextMarkModel(editorActor, types) {
|
|
|
4078
4064
|
for (const [child, childPath] of children) {
|
|
4079
4065
|
const nextNode = node.children[childPath[1] + 1];
|
|
4080
4066
|
if (editor.isTextSpan(child) && editor.isTextSpan(nextNode) && child.marks?.every((mark) => nextNode.marks?.includes(mark)) && nextNode.marks?.every((mark) => child.marks?.includes(mark))) {
|
|
4081
|
-
debug$
|
|
4067
|
+
debug$a("Merging spans", JSON.stringify(child, null, 2), JSON.stringify(nextNode, null, 2)), editorActor.send({
|
|
4082
4068
|
type: "normalizing"
|
|
4083
4069
|
}), Transforms.mergeNodes(editor, {
|
|
4084
4070
|
at: [childPath[0], childPath[1] + 1],
|
|
@@ -4091,7 +4077,7 @@ function createWithPortableTextMarkModel(editorActor, types) {
|
|
|
4091
4077
|
}
|
|
4092
4078
|
}
|
|
4093
4079
|
if (editor.isTextBlock(node) && !Array.isArray(node.markDefs)) {
|
|
4094
|
-
debug$
|
|
4080
|
+
debug$a("Adding .markDefs to block node"), editorActor.send({
|
|
4095
4081
|
type: "normalizing"
|
|
4096
4082
|
}), Transforms.setNodes(editor, {
|
|
4097
4083
|
markDefs: []
|
|
@@ -4103,7 +4089,7 @@ function createWithPortableTextMarkModel(editorActor, types) {
|
|
|
4103
4089
|
return;
|
|
4104
4090
|
}
|
|
4105
4091
|
if (editor.isTextSpan(node) && !Array.isArray(node.marks)) {
|
|
4106
|
-
debug$
|
|
4092
|
+
debug$a("Adding .marks to span node"), editorActor.send({
|
|
4107
4093
|
type: "normalizing"
|
|
4108
4094
|
}), Transforms.setNodes(editor, {
|
|
4109
4095
|
marks: []
|
|
@@ -4117,7 +4103,7 @@ function createWithPortableTextMarkModel(editorActor, types) {
|
|
|
4117
4103
|
if (editor.isTextSpan(node)) {
|
|
4118
4104
|
const blockPath = Path.parent(path), [block] = Editor.node(editor, blockPath), decorators2 = types.decorators.map((decorator) => decorator.value), annotations = node.marks?.filter((mark) => !decorators2.includes(mark));
|
|
4119
4105
|
if (editor.isTextBlock(block) && node.text === "" && annotations && annotations.length > 0) {
|
|
4120
|
-
debug$
|
|
4106
|
+
debug$a("Removing annotations from empty span node"), editorActor.send({
|
|
4121
4107
|
type: "normalizing"
|
|
4122
4108
|
}), Transforms.setNodes(editor, {
|
|
4123
4109
|
marks: node.marks?.filter((mark) => decorators2.includes(mark))
|
|
@@ -4135,7 +4121,7 @@ function createWithPortableTextMarkModel(editorActor, types) {
|
|
|
4135
4121
|
if (editor.isTextSpan(child)) {
|
|
4136
4122
|
const marks = child.marks ?? [], orphanedAnnotations = marks.filter((mark) => !decorators2.includes(mark) && !node.markDefs?.find((def) => def._key === mark));
|
|
4137
4123
|
if (orphanedAnnotations.length > 0) {
|
|
4138
|
-
debug$
|
|
4124
|
+
debug$a("Removing orphaned annotations from span node"), editorActor.send({
|
|
4139
4125
|
type: "normalizing"
|
|
4140
4126
|
}), Transforms.setNodes(editor, {
|
|
4141
4127
|
marks: marks.filter((mark) => !orphanedAnnotations.includes(mark))
|
|
@@ -4153,7 +4139,7 @@ function createWithPortableTextMarkModel(editorActor, types) {
|
|
|
4153
4139
|
if (editor.isTextBlock(block)) {
|
|
4154
4140
|
const decorators2 = types.decorators.map((decorator) => decorator.value), marks = node.marks ?? [], orphanedAnnotations = marks.filter((mark) => !decorators2.includes(mark) && !block.markDefs?.find((def) => def._key === mark));
|
|
4155
4141
|
if (orphanedAnnotations.length > 0) {
|
|
4156
|
-
debug$
|
|
4142
|
+
debug$a("Removing orphaned annotations from span node"), editorActor.send({
|
|
4157
4143
|
type: "normalizing"
|
|
4158
4144
|
}), Transforms.setNodes(editor, {
|
|
4159
4145
|
marks: marks.filter((mark) => !orphanedAnnotations.includes(mark))
|
|
@@ -4171,7 +4157,7 @@ function createWithPortableTextMarkModel(editorActor, types) {
|
|
|
4171
4157
|
for (const markDef of markDefs)
|
|
4172
4158
|
markDefKeys.has(markDef._key) || (markDefKeys.add(markDef._key), newMarkDefs.push(markDef));
|
|
4173
4159
|
if (markDefs.length !== newMarkDefs.length) {
|
|
4174
|
-
debug$
|
|
4160
|
+
debug$a("Removing duplicate markDefs"), editorActor.send({
|
|
4175
4161
|
type: "normalizing"
|
|
4176
4162
|
}), Transforms.setNodes(editor, {
|
|
4177
4163
|
markDefs: newMarkDefs
|
|
@@ -4186,7 +4172,7 @@ function createWithPortableTextMarkModel(editorActor, types) {
|
|
|
4186
4172
|
if (editor.isTextBlock(node) && !editor.operations.some((op) => op.type === "merge_node" && "markDefs" in op.properties && op.path.length === 1)) {
|
|
4187
4173
|
const newMarkDefs = (node.markDefs || []).filter((def) => node.children.find((child) => Text.isText(child) && Array.isArray(child.marks) && child.marks.includes(def._key)));
|
|
4188
4174
|
if (node.markDefs && !isEqual(newMarkDefs, node.markDefs)) {
|
|
4189
|
-
debug$
|
|
4175
|
+
debug$a("Removing markDef not in use"), editorActor.send({
|
|
4190
4176
|
type: "normalizing"
|
|
4191
4177
|
}), Transforms.setNodes(editor, {
|
|
4192
4178
|
markDefs: newMarkDefs
|
|
@@ -4403,7 +4389,7 @@ function createWithPortableTextMarkModel(editorActor, types) {
|
|
|
4403
4389
|
const [targetBlock, targetPath] = Editor.node(editor, [op.path[0] - 1]);
|
|
4404
4390
|
if (editor.isTextBlock(targetBlock)) {
|
|
4405
4391
|
const oldDefs = Array.isArray(targetBlock.markDefs) && targetBlock.markDefs || [], newMarkDefs = uniq([...oldDefs, ...op.properties.markDefs]);
|
|
4406
|
-
debug$
|
|
4392
|
+
debug$a("Copying markDefs over to merged block", op), Transforms.setNodes(editor, {
|
|
4407
4393
|
markDefs: newMarkDefs
|
|
4408
4394
|
}, {
|
|
4409
4395
|
at: targetPath,
|
|
@@ -4555,7 +4541,7 @@ const toggleDecoratorActionImplementation = ({
|
|
|
4555
4541
|
decorator: action.decorator
|
|
4556
4542
|
}
|
|
4557
4543
|
});
|
|
4558
|
-
}, debug$
|
|
4544
|
+
}, debug$9 = debugWithName("plugin:withPortableTextSelections"), debugVerbose = debug$9.enabled && !1;
|
|
4559
4545
|
function createWithPortableTextSelections(editorActor, types) {
|
|
4560
4546
|
let prevSelection = null;
|
|
4561
4547
|
return function(editor) {
|
|
@@ -4571,7 +4557,7 @@ function createWithPortableTextSelections(editorActor, types) {
|
|
|
4571
4557
|
ptRange = toPortableTextRange(value, editor.selection, types), SLATE_TO_PORTABLE_TEXT_RANGE.set(editor.selection, ptRange);
|
|
4572
4558
|
}
|
|
4573
4559
|
}
|
|
4574
|
-
debugVerbose
|
|
4560
|
+
debugVerbose && debug$9(`Emitting selection ${JSON.stringify(ptRange || null)} (${JSON.stringify(editor.selection)})`), ptRange ? editorActor.send({
|
|
4575
4561
|
type: "selection",
|
|
4576
4562
|
selection: ptRange
|
|
4577
4563
|
}) : editorActor.send({
|
|
@@ -4589,7 +4575,7 @@ function createWithPortableTextSelections(editorActor, types) {
|
|
|
4589
4575
|
}, editor;
|
|
4590
4576
|
};
|
|
4591
4577
|
}
|
|
4592
|
-
const debug$
|
|
4578
|
+
const debug$8 = debugWithName("plugin:withSchemaTypes");
|
|
4593
4579
|
function createWithSchemaTypes({
|
|
4594
4580
|
editorActor,
|
|
4595
4581
|
schemaTypes
|
|
@@ -4602,7 +4588,7 @@ function createWithSchemaTypes({
|
|
|
4602
4588
|
return editor.normalizeNode = (entry) => {
|
|
4603
4589
|
const [node, path] = entry;
|
|
4604
4590
|
if (node._type === void 0 && path.length === 2) {
|
|
4605
|
-
debug$
|
|
4591
|
+
debug$8("Setting span type on text node without a type");
|
|
4606
4592
|
const span = node, key = span._key || editorActor.getSnapshot().context.keyGenerator();
|
|
4607
4593
|
editorActor.send({
|
|
4608
4594
|
type: "normalizing"
|
|
@@ -4618,7 +4604,7 @@ function createWithSchemaTypes({
|
|
|
4618
4604
|
return;
|
|
4619
4605
|
}
|
|
4620
4606
|
if (node._key === void 0 && (path.length === 1 || path.length === 2)) {
|
|
4621
|
-
debug$
|
|
4607
|
+
debug$8("Setting missing key on child node without a key");
|
|
4622
4608
|
const key = editorActor.getSnapshot().context.keyGenerator();
|
|
4623
4609
|
editorActor.send({
|
|
4624
4610
|
type: "normalizing"
|
|
@@ -4635,7 +4621,7 @@ function createWithSchemaTypes({
|
|
|
4635
4621
|
}, editor;
|
|
4636
4622
|
};
|
|
4637
4623
|
}
|
|
4638
|
-
const debug$
|
|
4624
|
+
const debug$7 = debugWithName("plugin:withUtils");
|
|
4639
4625
|
function createWithUtils({
|
|
4640
4626
|
editorActor,
|
|
4641
4627
|
schemaTypes
|
|
@@ -4650,14 +4636,14 @@ function createWithUtils({
|
|
|
4650
4636
|
depth: 2
|
|
4651
4637
|
});
|
|
4652
4638
|
if (!textNode || !Text.isText(textNode) || textNode.text.length === 0) {
|
|
4653
|
-
debug$
|
|
4639
|
+
debug$7("pteExpandToWord: Can't expand to word here");
|
|
4654
4640
|
return;
|
|
4655
4641
|
}
|
|
4656
4642
|
const {
|
|
4657
4643
|
focus
|
|
4658
4644
|
} = selection, focusOffset = focus.offset, charsBefore = textNode.text.slice(0, focusOffset), charsAfter = textNode.text.slice(focusOffset, -1), isEmpty = (str) => str.match(/\s/g), whiteSpaceBeforeIndex = charsBefore.split("").reverse().findIndex((str) => isEmpty(str)), newStartOffset = whiteSpaceBeforeIndex > -1 ? charsBefore.length - whiteSpaceBeforeIndex : 0, whiteSpaceAfterIndex = charsAfter.split("").findIndex((obj) => isEmpty(obj)), newEndOffset = charsBefore.length + (whiteSpaceAfterIndex > -1 ? whiteSpaceAfterIndex : charsAfter.length + 1);
|
|
4659
4645
|
if (!(newStartOffset === newEndOffset || Number.isNaN(newStartOffset) || Number.isNaN(newEndOffset))) {
|
|
4660
|
-
debug$
|
|
4646
|
+
debug$7("pteExpandToWord: Expanding to focused word"), Transforms.setSelection(editor, {
|
|
4661
4647
|
anchor: {
|
|
4662
4648
|
...selection.anchor,
|
|
4663
4649
|
offset: newStartOffset
|
|
@@ -4669,7 +4655,7 @@ function createWithUtils({
|
|
|
4669
4655
|
});
|
|
4670
4656
|
return;
|
|
4671
4657
|
}
|
|
4672
|
-
debug$
|
|
4658
|
+
debug$7("pteExpandToWord: Can't expand to word here");
|
|
4673
4659
|
}
|
|
4674
4660
|
}, editor.pteCreateTextBlock = (options) => toSlateValue([{
|
|
4675
4661
|
_type: schemaTypes.block.name,
|
|
@@ -4695,16 +4681,10 @@ function createWithUtils({
|
|
|
4695
4681
|
})[0], editor;
|
|
4696
4682
|
};
|
|
4697
4683
|
}
|
|
4698
|
-
const
|
|
4684
|
+
const withPlugins = (editor, options) => {
|
|
4699
4685
|
const e = editor, {
|
|
4700
4686
|
editorActor
|
|
4701
|
-
} = options, schemaTypes = editorActor.getSnapshot().context.schema
|
|
4702
|
-
e.destroy ? e.destroy() : originalFnMap.set(e, {
|
|
4703
|
-
apply: e.apply,
|
|
4704
|
-
onChange: e.onChange,
|
|
4705
|
-
normalizeNode: e.normalizeNode
|
|
4706
|
-
});
|
|
4707
|
-
const operationToPatches = createOperationToPatches(schemaTypes), withObjectKeys = createWithObjectKeys(editorActor, schemaTypes), withSchemaTypes = createWithSchemaTypes({
|
|
4687
|
+
} = options, schemaTypes = editorActor.getSnapshot().context.schema, operationToPatches = createOperationToPatches(schemaTypes), withObjectKeys = createWithObjectKeys(editorActor, schemaTypes), withSchemaTypes = createWithSchemaTypes({
|
|
4708
4688
|
editorActor,
|
|
4709
4689
|
schemaTypes
|
|
4710
4690
|
}), withPatches = createWithPatches({
|
|
@@ -4719,38 +4699,21 @@ const originalFnMap = /* @__PURE__ */ new WeakMap(), withPlugins = (editor, opti
|
|
|
4719
4699
|
}), withPortableTextMarkModel = createWithPortableTextMarkModel(editorActor, schemaTypes), withPortableTextBlockStyle = createWithPortableTextBlockStyle(editorActor, schemaTypes), withPlaceholderBlock = createWithPlaceholderBlock(editorActor), withUtils = createWithUtils({
|
|
4720
4700
|
editorActor,
|
|
4721
4701
|
schemaTypes
|
|
4722
|
-
}), withPortableTextSelections = createWithPortableTextSelections(editorActor, schemaTypes)
|
|
4723
|
-
return
|
|
4724
|
-
|
|
4725
|
-
if (!originalFunctions)
|
|
4726
|
-
throw new Error("Could not find pristine versions of editor functions");
|
|
4727
|
-
e.apply = originalFunctions.apply, e.history = {
|
|
4728
|
-
undos: [],
|
|
4729
|
-
redos: []
|
|
4730
|
-
}, e.normalizeNode = originalFunctions.normalizeNode, e.onChange = originalFunctions.onChange;
|
|
4731
|
-
}, withEventListeners(withSchemaTypes(withObjectKeys(withPortableTextMarkModel(withPortableTextBlockStyle(withPortableTextLists(withPlaceholderBlock(withUtils(withMaxBlocks(withUndoRedo(withPatches(withPortableTextSelections(e))))))))))));
|
|
4732
|
-
}, debug$7 = debugWithName("component:PortableTextEditor:SlateContainer"), slateEditors = /* @__PURE__ */ new WeakMap();
|
|
4702
|
+
}), withPortableTextSelections = createWithPortableTextSelections(editorActor, schemaTypes);
|
|
4703
|
+
return createWithEventListeners(editorActor, options.subscriptions)(withSchemaTypes(withObjectKeys(withPortableTextMarkModel(withPortableTextBlockStyle(withPortableTextLists(withPlaceholderBlock(withUtils(withMaxBlocks(withUndoRedo(withPatches(withPortableTextSelections(e))))))))))));
|
|
4704
|
+
}, debug$6 = debugWithName("component:PortableTextEditor:SlateContainer"), slateEditors = /* @__PURE__ */ new WeakMap();
|
|
4733
4705
|
function createSlateEditor(config) {
|
|
4734
4706
|
const existingSlateEditor = slateEditors.get(config.editorActor);
|
|
4735
4707
|
if (existingSlateEditor)
|
|
4736
|
-
return debug$
|
|
4737
|
-
debug$
|
|
4738
|
-
|
|
4739
|
-
const instance = withPlugins(withReact(createEditor()), {
|
|
4708
|
+
return debug$6("Reusing existing Slate editor instance", config.editorActor.id), existingSlateEditor;
|
|
4709
|
+
debug$6("Creating new Slate editor instance", config.editorActor.id);
|
|
4710
|
+
const unsubscriptions = [], subscriptions = [], instance = withPlugins(withReact(createEditor$1()), {
|
|
4740
4711
|
editorActor: config.editorActor,
|
|
4741
4712
|
subscriptions
|
|
4742
4713
|
});
|
|
4743
4714
|
KEY_TO_VALUE_ELEMENT.set(instance, {}), KEY_TO_SLATE_ELEMENT.set(instance, {});
|
|
4744
4715
|
for (const subscription of subscriptions)
|
|
4745
4716
|
unsubscriptions.push(subscription());
|
|
4746
|
-
config.editorActor.subscribe((snapshot) => {
|
|
4747
|
-
if (snapshot.status !== "active") {
|
|
4748
|
-
debug$7("Destroying Slate editor"), instance.destroy();
|
|
4749
|
-
for (const unsubscribe of unsubscriptions)
|
|
4750
|
-
unsubscribe();
|
|
4751
|
-
subscriptions = [], unsubscriptions = [];
|
|
4752
|
-
}
|
|
4753
|
-
});
|
|
4754
4717
|
const initialValue = [instance.pteCreateTextBlock({
|
|
4755
4718
|
decorators: []
|
|
4756
4719
|
})], slateEditor = {
|
|
@@ -4759,7 +4722,7 @@ function createSlateEditor(config) {
|
|
|
4759
4722
|
};
|
|
4760
4723
|
return slateEditors.set(config.editorActor, slateEditor), slateEditor;
|
|
4761
4724
|
}
|
|
4762
|
-
const
|
|
4725
|
+
const debug$5 = debugWithName("API:editable");
|
|
4763
4726
|
function createEditableAPI(editor, editorActor) {
|
|
4764
4727
|
const types = editorActor.getSnapshot().context.schema;
|
|
4765
4728
|
return {
|
|
@@ -4840,7 +4803,7 @@ function createEditableAPI(editor, editorActor) {
|
|
|
4840
4803
|
}], {
|
|
4841
4804
|
schemaTypes: editorActor.getSnapshot().context.schema
|
|
4842
4805
|
})[0].children[0], focusChildPath = editor.selection.focus.path.slice(0, 2), isSpanNode = child._type === types.span.name, focusNode = Node.get(editor, focusChildPath);
|
|
4843
|
-
return isSpanNode && focusNode._type !== types.span.name && (debug$
|
|
4806
|
+
return isSpanNode && focusNode._type !== types.span.name && (debug$5("Inserting span child next to inline object child, moving selection + 1"), editor.move({
|
|
4844
4807
|
distance: 1,
|
|
4845
4808
|
unit: "character"
|
|
4846
4809
|
})), Transforms.insertNodes(editor, child, {
|
|
@@ -4972,18 +4935,18 @@ function createEditableAPI(editor, editorActor) {
|
|
|
4972
4935
|
throw new Error("Invalid range");
|
|
4973
4936
|
if (range) {
|
|
4974
4937
|
if (!options?.mode || options?.mode === "selected") {
|
|
4975
|
-
debug$
|
|
4938
|
+
debug$5("Deleting content in selection"), Transforms.delete(editor, {
|
|
4976
4939
|
at: range,
|
|
4977
4940
|
hanging: !0,
|
|
4978
4941
|
voids: !0
|
|
4979
4942
|
}), editor.onChange();
|
|
4980
4943
|
return;
|
|
4981
4944
|
}
|
|
4982
|
-
options?.mode === "blocks" && (debug$
|
|
4945
|
+
options?.mode === "blocks" && (debug$5("Deleting blocks touched by selection"), Transforms.removeNodes(editor, {
|
|
4983
4946
|
at: range,
|
|
4984
4947
|
voids: !0,
|
|
4985
4948
|
match: (node) => editor.isTextBlock(node) || !editor.isTextBlock(node) && Element$1.isElement(node)
|
|
4986
|
-
})), options?.mode === "children" && (debug$
|
|
4949
|
+
})), options?.mode === "children" && (debug$5("Deleting children touched by selection"), Transforms.removeNodes(editor, {
|
|
4987
4950
|
at: range,
|
|
4988
4951
|
voids: !0,
|
|
4989
4952
|
match: (node) => node._type === types.span.name || // Text children
|
|
@@ -5146,7 +5109,7 @@ const addAnnotationActionImplementation = ({
|
|
|
5146
5109
|
action
|
|
5147
5110
|
}) => {
|
|
5148
5111
|
const editor = action.editor;
|
|
5149
|
-
if (debug$
|
|
5112
|
+
if (debug$5("Removing annotation", action.annotation.name), !!editor.selection)
|
|
5150
5113
|
if (Range.isCollapsed(editor.selection)) {
|
|
5151
5114
|
const [block, blockPath] = Editor.node(editor, editor.selection, {
|
|
5152
5115
|
depth: 1
|
|
@@ -5799,8 +5762,8 @@ const editorMachine = setup({
|
|
|
5799
5762
|
keyGenerator: input.keyGenerator,
|
|
5800
5763
|
pendingEvents: [],
|
|
5801
5764
|
schema: input.schema,
|
|
5802
|
-
readOnly: !1,
|
|
5803
|
-
maxBlocks:
|
|
5765
|
+
readOnly: input.readOnly ?? !1,
|
|
5766
|
+
maxBlocks: input.maxBlocks,
|
|
5804
5767
|
value: input.value
|
|
5805
5768
|
}),
|
|
5806
5769
|
on: {
|
|
@@ -5905,11 +5868,16 @@ const editorMachine = setup({
|
|
|
5905
5868
|
})
|
|
5906
5869
|
},
|
|
5907
5870
|
"toggle readOnly": {
|
|
5908
|
-
actions: assign({
|
|
5871
|
+
actions: [assign({
|
|
5909
5872
|
readOnly: ({
|
|
5910
5873
|
context
|
|
5911
5874
|
}) => !context.readOnly
|
|
5912
|
-
})
|
|
5875
|
+
}), emit(({
|
|
5876
|
+
context
|
|
5877
|
+
}) => ({
|
|
5878
|
+
type: "readOnly toggled",
|
|
5879
|
+
readOnly: context.readOnly
|
|
5880
|
+
}))]
|
|
5913
5881
|
},
|
|
5914
5882
|
"update maxBlocks": {
|
|
5915
5883
|
actions: assign({
|
|
@@ -6000,47 +5968,62 @@ const editorMachine = setup({
|
|
|
6000
5968
|
}
|
|
6001
5969
|
}
|
|
6002
5970
|
}
|
|
6003
|
-
})
|
|
6004
|
-
|
|
6005
|
-
|
|
6006
|
-
|
|
6007
|
-
|
|
6008
|
-
|
|
6009
|
-
|
|
6010
|
-
|
|
6011
|
-
|
|
6012
|
-
|
|
6013
|
-
|
|
6014
|
-
|
|
6015
|
-
|
|
6016
|
-
|
|
6017
|
-
|
|
6018
|
-
|
|
6019
|
-
|
|
6020
|
-
|
|
6021
|
-
|
|
6022
|
-
|
|
6023
|
-
|
|
6024
|
-
|
|
6025
|
-
}
|
|
6026
|
-
const defaultKeyGenerator = () => randomKey(12), getByteHexTable = /* @__PURE__ */ (() => {
|
|
6027
|
-
let table;
|
|
6028
|
-
return () => {
|
|
6029
|
-
if (table)
|
|
6030
|
-
return table;
|
|
6031
|
-
table = [];
|
|
6032
|
-
for (let i = 0; i < 256; ++i)
|
|
6033
|
-
table[i] = (i + 256).toString(16).slice(1);
|
|
6034
|
-
return table;
|
|
5971
|
+
});
|
|
5972
|
+
function createEditor(config) {
|
|
5973
|
+
const editorActor = createActor(editorMachine, {
|
|
5974
|
+
input: editorConfigToMachineInput(config)
|
|
5975
|
+
});
|
|
5976
|
+
editorActor.start();
|
|
5977
|
+
const slateEditor = createSlateEditor({
|
|
5978
|
+
editorActor
|
|
5979
|
+
}), editable = createEditableAPI(slateEditor.instance, editorActor);
|
|
5980
|
+
return {
|
|
5981
|
+
send: (event) => {
|
|
5982
|
+
editorActor.send(event);
|
|
5983
|
+
},
|
|
5984
|
+
on: (event, listener) => editorActor.on(
|
|
5985
|
+
event,
|
|
5986
|
+
// @ts-ignore
|
|
5987
|
+
listener
|
|
5988
|
+
),
|
|
5989
|
+
editable,
|
|
5990
|
+
_internal: {
|
|
5991
|
+
editorActor,
|
|
5992
|
+
slateEditor
|
|
5993
|
+
}
|
|
6035
5994
|
};
|
|
6036
|
-
})();
|
|
6037
|
-
function whatwgRNG(length = 16) {
|
|
6038
|
-
const rnds8 = new Uint8Array(length);
|
|
6039
|
-
return getRandomValues(rnds8), rnds8;
|
|
6040
5995
|
}
|
|
6041
|
-
function
|
|
6042
|
-
const
|
|
6043
|
-
|
|
5996
|
+
function useEditor(config) {
|
|
5997
|
+
const editorActor = useActorRef(editorMachine, {
|
|
5998
|
+
input: editorConfigToMachineInput(config)
|
|
5999
|
+
}), slateEditor = createSlateEditor({
|
|
6000
|
+
editorActor
|
|
6001
|
+
}), editable = useMemo(() => createEditableAPI(slateEditor.instance, editorActor), [slateEditor.instance, editorActor]), send = useCallback((event) => {
|
|
6002
|
+
editorActor.send(event);
|
|
6003
|
+
}, [editorActor]), on = useCallback((event_0, listener) => editorActor.on(
|
|
6004
|
+
event_0,
|
|
6005
|
+
// @ts-ignore
|
|
6006
|
+
listener
|
|
6007
|
+
), [editorActor]);
|
|
6008
|
+
return useMemo(() => ({
|
|
6009
|
+
send,
|
|
6010
|
+
on,
|
|
6011
|
+
editable,
|
|
6012
|
+
_internal: {
|
|
6013
|
+
editorActor,
|
|
6014
|
+
slateEditor
|
|
6015
|
+
}
|
|
6016
|
+
}), [send, on, editable, editorActor, slateEditor]);
|
|
6017
|
+
}
|
|
6018
|
+
function editorConfigToMachineInput(config) {
|
|
6019
|
+
return {
|
|
6020
|
+
behaviors: config.behaviors,
|
|
6021
|
+
keyGenerator: config.keyGenerator ?? defaultKeyGenerator,
|
|
6022
|
+
maxBlocks: config.maxBlocks,
|
|
6023
|
+
readOnly: config.readOnly,
|
|
6024
|
+
schema: config.schemaDefinition ? compileSchemaDefinition(config.schemaDefinition) : getPortableTextMemberSchemaTypes(config.schema.hasOwnProperty("jsonType") ? config.schema : compileType(config.schema)),
|
|
6025
|
+
value: config.initialValue
|
|
6026
|
+
};
|
|
6044
6027
|
}
|
|
6045
6028
|
const debug$4 = debugWithName("component:PortableTextEditor");
|
|
6046
6029
|
class PortableTextEditor extends Component {
|
|
@@ -6053,66 +6036,49 @@ class PortableTextEditor extends Component {
|
|
|
6053
6036
|
* A lookup table for all the relevant schema types for this portable text type.
|
|
6054
6037
|
*/
|
|
6055
6038
|
/**
|
|
6039
|
+
* The editor instance
|
|
6040
|
+
*/
|
|
6041
|
+
/*
|
|
6056
6042
|
* The editor API (currently implemented with Slate).
|
|
6057
6043
|
*/
|
|
6058
6044
|
constructor(props) {
|
|
6059
|
-
|
|
6060
|
-
|
|
6061
|
-
|
|
6062
|
-
|
|
6063
|
-
|
|
6064
|
-
|
|
6065
|
-
|
|
6066
|
-
input: {
|
|
6067
|
-
keyGenerator: props.keyGenerator || defaultKeyGenerator,
|
|
6068
|
-
schema: this.schemaTypes,
|
|
6069
|
-
value: props.value
|
|
6070
|
-
}
|
|
6071
|
-
}), this.editorActor.start(), this.slateEditor = createSlateEditor({
|
|
6072
|
-
editorActor: this.editorActor
|
|
6073
|
-
}), props.readOnly && this.editorActor.send({
|
|
6074
|
-
type: "toggle readOnly"
|
|
6075
|
-
}), props.maxBlocks && this.editorActor.send({
|
|
6076
|
-
type: "update maxBlocks",
|
|
6077
|
-
maxBlocks: props.maxBlocks === void 0 ? void 0 : Number.parseInt(props.maxBlocks.toString(), 10)
|
|
6078
|
-
});
|
|
6079
|
-
}
|
|
6080
|
-
this.editable = createEditableAPI(this.slateEditor.instance, this.editorActor);
|
|
6045
|
+
super(props), props.editor ? this.editor = props.editor : this.editor = createEditor({
|
|
6046
|
+
keyGenerator: props.keyGenerator ?? defaultKeyGenerator,
|
|
6047
|
+
schema: props.schemaType,
|
|
6048
|
+
initialValue: props.value,
|
|
6049
|
+
maxBlocks: props.maxBlocks === void 0 ? void 0 : Number.parseInt(props.maxBlocks.toString(), 10),
|
|
6050
|
+
readOnly: props.readOnly
|
|
6051
|
+
}), this.schemaTypes = this.editor._internal.editorActor.getSnapshot().context.schema, this.editable = this.editor.editable;
|
|
6081
6052
|
}
|
|
6082
6053
|
componentDidUpdate(prevProps) {
|
|
6083
|
-
!this.props.editor && !prevProps.editor && this.props.schemaType !== prevProps.schemaType && (this.schemaTypes = getPortableTextMemberSchemaTypes(this.props.schemaType.hasOwnProperty("jsonType") ? this.props.schemaType : compileType(this.props.schemaType)), this.editorActor.send({
|
|
6054
|
+
!this.props.editor && !prevProps.editor && this.props.schemaType !== prevProps.schemaType && (this.schemaTypes = getPortableTextMemberSchemaTypes(this.props.schemaType.hasOwnProperty("jsonType") ? this.props.schemaType : compileType(this.props.schemaType)), this.editor._internal.editorActor.send({
|
|
6084
6055
|
type: "update schema",
|
|
6085
6056
|
schema: this.schemaTypes
|
|
6086
|
-
})), !this.props.editor && !prevProps.editor && (this.props.readOnly !== prevProps.readOnly && this.editorActor.send({
|
|
6057
|
+
})), !this.props.editor && !prevProps.editor && (this.props.readOnly !== prevProps.readOnly && this.editor._internal.editorActor.send({
|
|
6087
6058
|
type: "toggle readOnly"
|
|
6088
|
-
}), this.props.maxBlocks !== prevProps.maxBlocks && this.editorActor.send({
|
|
6059
|
+
}), this.props.maxBlocks !== prevProps.maxBlocks && this.editor._internal.editorActor.send({
|
|
6089
6060
|
type: "update maxBlocks",
|
|
6090
6061
|
maxBlocks: this.props.maxBlocks === void 0 ? void 0 : Number.parseInt(this.props.maxBlocks.toString(), 10)
|
|
6091
|
-
}), this.props.value !== prevProps.value && this.editorActor.send({
|
|
6062
|
+
}), this.props.value !== prevProps.value && this.editor._internal.editorActor.send({
|
|
6092
6063
|
type: "update value",
|
|
6093
6064
|
value: this.props.value
|
|
6094
6065
|
}), this.props.editorRef !== prevProps.editorRef && this.props.editorRef && (this.props.editorRef.current = this));
|
|
6095
6066
|
}
|
|
6096
6067
|
setEditable = (editable) => {
|
|
6097
|
-
this.editable = {
|
|
6098
|
-
...this.editable,
|
|
6068
|
+
this.editor.editable = {
|
|
6069
|
+
...this.editor.editable,
|
|
6099
6070
|
...editable
|
|
6100
6071
|
};
|
|
6101
6072
|
};
|
|
6102
|
-
getValue = () => {
|
|
6103
|
-
if (this.editable)
|
|
6104
|
-
return this.editable.getValue();
|
|
6105
|
-
};
|
|
6106
6073
|
render() {
|
|
6107
6074
|
const legacyPatches = this.props.editor ? void 0 : this.props.incomingPatches$ ?? this.props.patches$;
|
|
6108
6075
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
6109
|
-
legacyPatches ? /* @__PURE__ */ jsx(RoutePatchesObservableToEditorActor, { editorActor: this.editorActor, patches$: legacyPatches }) : null,
|
|
6110
|
-
/* @__PURE__ */ jsx(
|
|
6111
|
-
|
|
6112
|
-
|
|
6113
|
-
|
|
6114
|
-
|
|
6115
|
-
] }) }) }) })
|
|
6076
|
+
legacyPatches ? /* @__PURE__ */ jsx(RoutePatchesObservableToEditorActor, { editorActor: this.editor._internal.editorActor, patches$: legacyPatches }) : null,
|
|
6077
|
+
/* @__PURE__ */ jsx(RouteEventsToChanges, { editorActor: this.editor._internal.editorActor, onChange: (change) => {
|
|
6078
|
+
this.props.editor || this.props.onChange(change), this.change$.next(change);
|
|
6079
|
+
} }),
|
|
6080
|
+
/* @__PURE__ */ jsx(Synchronizer, { editorActor: this.editor._internal.editorActor, getValue: this.editor.editable.getValue, portableTextEditor: this, slateEditor: this.editor._internal.slateEditor.instance }),
|
|
6081
|
+
/* @__PURE__ */ jsx(EditorActorContext.Provider, { value: this.editor._internal.editorActor, children: /* @__PURE__ */ jsx(Slate, { editor: this.editor._internal.slateEditor.instance, initialValue: this.editor._internal.slateEditor.initialValue, children: /* @__PURE__ */ jsx(PortableTextEditorContext.Provider, { value: this, children: /* @__PURE__ */ jsx(PortableTextEditorSelectionProvider, { editorActor: this.editor._internal.editorActor, children: this.props.children }) }) }) })
|
|
6116
6082
|
] });
|
|
6117
6083
|
}
|
|
6118
6084
|
// Static API methods
|
|
@@ -6180,6 +6146,79 @@ function RoutePatchesObservableToEditorActor(props) {
|
|
|
6180
6146
|
};
|
|
6181
6147
|
}, t1 = [props.editorActor, props.patches$], $[0] = props.editorActor, $[1] = props.patches$, $[2] = t0, $[3] = t1) : (t0 = $[2], t1 = $[3]), useEffect(t0, t1), null;
|
|
6182
6148
|
}
|
|
6149
|
+
function RouteEventsToChanges(props) {
|
|
6150
|
+
const $ = c(6);
|
|
6151
|
+
let t0;
|
|
6152
|
+
$[0] !== props ? (t0 = (change) => props.onChange(change), $[0] = props, $[1] = t0) : t0 = $[1];
|
|
6153
|
+
const handleChange = useEffectEvent(t0);
|
|
6154
|
+
let t1, t2;
|
|
6155
|
+
return $[2] !== handleChange || $[3] !== props.editorActor ? (t1 = () => {
|
|
6156
|
+
debug$4("Subscribing to editor changes");
|
|
6157
|
+
const sub = props.editorActor.on("*", (event) => {
|
|
6158
|
+
bb5: switch (event.type) {
|
|
6159
|
+
case "patch": {
|
|
6160
|
+
handleChange(event);
|
|
6161
|
+
break bb5;
|
|
6162
|
+
}
|
|
6163
|
+
case "loading": {
|
|
6164
|
+
handleChange({
|
|
6165
|
+
type: "loading",
|
|
6166
|
+
isLoading: !0
|
|
6167
|
+
});
|
|
6168
|
+
break bb5;
|
|
6169
|
+
}
|
|
6170
|
+
case "done loading": {
|
|
6171
|
+
handleChange({
|
|
6172
|
+
type: "loading",
|
|
6173
|
+
isLoading: !1
|
|
6174
|
+
});
|
|
6175
|
+
break bb5;
|
|
6176
|
+
}
|
|
6177
|
+
case "focused": {
|
|
6178
|
+
handleChange({
|
|
6179
|
+
type: "focus",
|
|
6180
|
+
event: event.event
|
|
6181
|
+
});
|
|
6182
|
+
break bb5;
|
|
6183
|
+
}
|
|
6184
|
+
case "value changed": {
|
|
6185
|
+
handleChange({
|
|
6186
|
+
type: "value",
|
|
6187
|
+
value: event.value
|
|
6188
|
+
});
|
|
6189
|
+
break bb5;
|
|
6190
|
+
}
|
|
6191
|
+
case "invalid value": {
|
|
6192
|
+
handleChange({
|
|
6193
|
+
type: "invalidValue",
|
|
6194
|
+
resolution: event.resolution,
|
|
6195
|
+
value: event.value
|
|
6196
|
+
});
|
|
6197
|
+
break bb5;
|
|
6198
|
+
}
|
|
6199
|
+
case "error": {
|
|
6200
|
+
handleChange({
|
|
6201
|
+
...event,
|
|
6202
|
+
level: "warning"
|
|
6203
|
+
});
|
|
6204
|
+
break bb5;
|
|
6205
|
+
}
|
|
6206
|
+
case "annotation.add":
|
|
6207
|
+
case "annotation.remove":
|
|
6208
|
+
case "annotation.toggle":
|
|
6209
|
+
case "focus":
|
|
6210
|
+
case "patches":
|
|
6211
|
+
case "readOnly toggled":
|
|
6212
|
+
break bb5;
|
|
6213
|
+
default:
|
|
6214
|
+
handleChange(event);
|
|
6215
|
+
}
|
|
6216
|
+
});
|
|
6217
|
+
return () => {
|
|
6218
|
+
debug$4("Unsubscribing to changes"), sub.unsubscribe();
|
|
6219
|
+
};
|
|
6220
|
+
}, t2 = [props.editorActor, handleChange], $[2] = handleChange, $[3] = props.editorActor, $[4] = t1, $[5] = t2) : (t1 = $[4], t2 = $[5]), useEffect(t1, t2), null;
|
|
6221
|
+
}
|
|
6183
6222
|
const debug$3 = debugWithName("components:Leaf"), EMPTY_MARKS = [], Leaf = (props) => {
|
|
6184
6223
|
const {
|
|
6185
6224
|
editorActor,
|
|
@@ -6637,9 +6676,7 @@ const debug = debugWithName("component:Editable"), PLACEHOLDER_STYLE = {
|
|
|
6637
6676
|
...restProps
|
|
6638
6677
|
} = props, portableTextEditor = usePortableTextEditor(), ref = useRef(null), [editableElement, setEditableElement] = useState(null), [hasInvalidValue, setHasInvalidValue] = useState(!1), [rangeDecorationState, setRangeDecorationsState] = useState([]);
|
|
6639
6678
|
useImperativeHandle(forwardedRef, () => ref.current);
|
|
6640
|
-
const rangeDecorationsRef = useRef(rangeDecorations), editorActor = useContext(EditorActorContext), readOnly = useSelector(editorActor, (s) => s.context.readOnly),
|
|
6641
|
-
schemaTypes
|
|
6642
|
-
} = portableTextEditor, slateEditor = useSlate(), blockTypeName = schemaTypes.block.name;
|
|
6679
|
+
const rangeDecorationsRef = useRef(rangeDecorations), editorActor = useContext(EditorActorContext), readOnly = useSelector(editorActor, (s) => s.context.readOnly), schemaTypes = useSelector(editorActor, (s_0) => s_0.context.schema), slateEditor = useSlate(), blockTypeName = schemaTypes.block.name;
|
|
6643
6680
|
useMemo(() => {
|
|
6644
6681
|
const withInsertData = createWithInsertData(editorActor, schemaTypes);
|
|
6645
6682
|
if (readOnly)
|
|
@@ -6875,46 +6912,56 @@ const debug = debugWithName("component:Editable"), PLACEHOLDER_STYLE = {
|
|
|
6875
6912
|
) : null;
|
|
6876
6913
|
});
|
|
6877
6914
|
PortableTextEditable.displayName = "ForwardRef(PortableTextEditable)";
|
|
6878
|
-
|
|
6879
|
-
|
|
6880
|
-
|
|
6881
|
-
|
|
6915
|
+
const EditorContext = React.createContext(void 0);
|
|
6916
|
+
function EditorProvider(props) {
|
|
6917
|
+
const $ = c(30), editor = useEditor(props.config), editorActor = editor._internal.editorActor, slateEditor = editor._internal.slateEditor, editable = editor.editable;
|
|
6918
|
+
let t0, t1;
|
|
6919
|
+
$[0] !== editor ? (t1 = new PortableTextEditor({
|
|
6920
|
+
editor
|
|
6921
|
+
}), $[0] = editor, $[1] = t1) : t1 = $[1], t0 = t1;
|
|
6922
|
+
const portableTextEditor = t0;
|
|
6882
6923
|
let t2;
|
|
6883
|
-
$[
|
|
6884
|
-
|
|
6885
|
-
|
|
6886
|
-
keyGenerator: t0,
|
|
6887
|
-
schema: t1,
|
|
6888
|
-
value: config.initialValue
|
|
6889
|
-
}
|
|
6890
|
-
}, $[3] = config.behaviors, $[4] = config.initialValue, $[5] = t0, $[6] = t1, $[7] = t2) : t2 = $[7];
|
|
6891
|
-
const editorActor = useActorRef(editorMachine, t2);
|
|
6924
|
+
$[2] !== portableTextEditor.change$ ? (t2 = (change) => {
|
|
6925
|
+
portableTextEditor.change$.next(change);
|
|
6926
|
+
}, $[2] = portableTextEditor.change$, $[3] = t2) : t2 = $[3];
|
|
6892
6927
|
let t3;
|
|
6893
|
-
$[
|
|
6894
|
-
|
|
6895
|
-
}), $[8] = editorActor, $[9] =
|
|
6896
|
-
|
|
6897
|
-
|
|
6898
|
-
$[10] !== editorActor ? (t4 = (event) => {
|
|
6899
|
-
editorActor.send(event);
|
|
6900
|
-
}, t5 = (event_0, listener) => editorActor.on(event_0, listener), $[10] = editorActor, $[11] = t4, $[12] = t5) : (t4 = $[11], t5 = $[12]);
|
|
6928
|
+
$[4] !== editorActor || $[5] !== t2 ? (t3 = /* @__PURE__ */ jsx(RouteEventsToChanges, { editorActor, onChange: t2 }), $[4] = editorActor, $[5] = t2, $[6] = t3) : t3 = $[6];
|
|
6929
|
+
let t4;
|
|
6930
|
+
$[7] !== editable.getValue || $[8] !== editorActor || $[9] !== portableTextEditor || $[10] !== slateEditor.instance ? (t4 = /* @__PURE__ */ jsx(Synchronizer, { editorActor, getValue: editable.getValue, portableTextEditor, slateEditor: slateEditor.instance }), $[7] = editable.getValue, $[8] = editorActor, $[9] = portableTextEditor, $[10] = slateEditor.instance, $[11] = t4) : t4 = $[11];
|
|
6931
|
+
let t5;
|
|
6932
|
+
$[12] !== editorActor || $[13] !== props.children ? (t5 = /* @__PURE__ */ jsx(PortableTextEditorSelectionProvider, { editorActor, children: props.children }), $[12] = editorActor, $[13] = props.children, $[14] = t5) : t5 = $[14];
|
|
6901
6933
|
let t6;
|
|
6902
|
-
$[
|
|
6903
|
-
editorActor,
|
|
6904
|
-
slateEditor
|
|
6905
|
-
}, $[13] = editorActor, $[14] = slateEditor, $[15] = t6) : t6 = $[15];
|
|
6934
|
+
$[15] !== portableTextEditor || $[16] !== t5 ? (t6 = /* @__PURE__ */ jsx(PortableTextEditorContext.Provider, { value: portableTextEditor, children: t5 }), $[15] = portableTextEditor, $[16] = t5, $[17] = t6) : t6 = $[17];
|
|
6906
6935
|
let t7;
|
|
6907
|
-
|
|
6908
|
-
|
|
6909
|
-
|
|
6910
|
-
|
|
6911
|
-
|
|
6912
|
-
|
|
6936
|
+
$[18] !== slateEditor.initialValue || $[19] !== slateEditor.instance || $[20] !== t6 ? (t7 = /* @__PURE__ */ jsx(Slate, { editor: slateEditor.instance, initialValue: slateEditor.initialValue, children: t6 }), $[18] = slateEditor.initialValue, $[19] = slateEditor.instance, $[20] = t6, $[21] = t7) : t7 = $[21];
|
|
6937
|
+
let t8;
|
|
6938
|
+
$[22] !== editorActor || $[23] !== t7 ? (t8 = /* @__PURE__ */ jsx(EditorActorContext.Provider, { value: editorActor, children: t7 }), $[22] = editorActor, $[23] = t7, $[24] = t8) : t8 = $[24];
|
|
6939
|
+
let t9;
|
|
6940
|
+
return $[25] !== editor || $[26] !== t3 || $[27] !== t4 || $[28] !== t8 ? (t9 = /* @__PURE__ */ jsxs(EditorContext.Provider, { value: editor, children: [
|
|
6941
|
+
t3,
|
|
6942
|
+
t4,
|
|
6943
|
+
t8
|
|
6944
|
+
] }), $[25] = editor, $[26] = t3, $[27] = t4, $[28] = t8, $[29] = t9) : t9 = $[29], t9;
|
|
6945
|
+
}
|
|
6946
|
+
function useEditorContext() {
|
|
6947
|
+
const editor = React.useContext(EditorContext);
|
|
6948
|
+
if (!editor)
|
|
6949
|
+
throw new Error("No Editor set. Use EditorProvider to set one.");
|
|
6950
|
+
return editor;
|
|
6913
6951
|
}
|
|
6914
|
-
function
|
|
6915
|
-
|
|
6952
|
+
function EditorEventListener(props) {
|
|
6953
|
+
const $ = c(4), editor = useEditorContext(), on = useEffectEvent(props.on);
|
|
6954
|
+
let t0, t1;
|
|
6955
|
+
return $[0] !== editor || $[1] !== on ? (t0 = () => {
|
|
6956
|
+
const subscription = editor.on("*", on);
|
|
6957
|
+
return () => {
|
|
6958
|
+
subscription.unsubscribe();
|
|
6959
|
+
};
|
|
6960
|
+
}, t1 = [editor, on], $[0] = editor, $[1] = on, $[2] = t0, $[3] = t1) : (t0 = $[2], t1 = $[3]), useEffect(t0, t1), null;
|
|
6916
6961
|
}
|
|
6917
6962
|
export {
|
|
6963
|
+
EditorEventListener,
|
|
6964
|
+
EditorProvider,
|
|
6918
6965
|
PortableTextEditable,
|
|
6919
6966
|
PortableTextEditor,
|
|
6920
6967
|
coreBehavior,
|
|
@@ -6926,6 +6973,7 @@ export {
|
|
|
6926
6973
|
editorMachine,
|
|
6927
6974
|
defaultKeyGenerator as keyGenerator,
|
|
6928
6975
|
useEditor,
|
|
6976
|
+
useEditorContext,
|
|
6929
6977
|
usePortableTextEditor,
|
|
6930
6978
|
usePortableTextEditorSelection
|
|
6931
6979
|
};
|