@portabletext/editor 1.52.4 → 1.52.6
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/lib/index.cjs +113 -101
- package/lib/index.cjs.map +1 -1
- package/lib/index.js +115 -103
- package/lib/index.js.map +1 -1
- package/package.json +3 -3
- package/src/editor/Editable.tsx +1 -16
- package/src/editor/plugins/createWithEditableAPI.ts +13 -64
- package/src/editor/plugins/slate-plugin.update-selection.ts +51 -0
- package/src/editor/plugins/with-plugins.ts +8 -9
- package/src/editor/relay-machine.ts +49 -2
- package/src/internal-utils/mark-state.ts +28 -6
- package/src/internal-utils/slate-utils.ts +0 -21
- package/src/editor/plugins/createWithPortableTextSelections.ts +0 -60
package/lib/index.cjs
CHANGED
|
@@ -166,20 +166,6 @@ function getFocusSpan({
|
|
|
166
166
|
}
|
|
167
167
|
return [void 0, void 0];
|
|
168
168
|
}
|
|
169
|
-
function getSelectedSpans({
|
|
170
|
-
editor
|
|
171
|
-
}) {
|
|
172
|
-
if (!editor.selection)
|
|
173
|
-
return [];
|
|
174
|
-
try {
|
|
175
|
-
return Array.from(slate.Editor.nodes(editor, {
|
|
176
|
-
at: editor.selection,
|
|
177
|
-
match: (node) => editor.isTextSpan(node)
|
|
178
|
-
}));
|
|
179
|
-
} catch {
|
|
180
|
-
return [];
|
|
181
|
-
}
|
|
182
|
-
}
|
|
183
169
|
function getSelectionStartBlock({
|
|
184
170
|
editor
|
|
185
171
|
}) {
|
|
@@ -4542,40 +4528,6 @@ function createWithPlaceholderBlock(editorActor) {
|
|
|
4542
4528
|
}, editor;
|
|
4543
4529
|
};
|
|
4544
4530
|
}
|
|
4545
|
-
debugWithName("plugin:withPortableTextSelections");
|
|
4546
|
-
function createWithPortableTextSelections(editorActor) {
|
|
4547
|
-
let prevSelection = null;
|
|
4548
|
-
return function(editor) {
|
|
4549
|
-
const emitPortableTextSelection = () => {
|
|
4550
|
-
if (prevSelection !== editor.selection) {
|
|
4551
|
-
let ptRange = null;
|
|
4552
|
-
if (editor.selection) {
|
|
4553
|
-
const existing = SLATE_TO_PORTABLE_TEXT_RANGE.get(editor.selection);
|
|
4554
|
-
existing ? ptRange = existing : (ptRange = slateRangeToSelection({
|
|
4555
|
-
schema: editorActor.getSnapshot().context.schema,
|
|
4556
|
-
editor,
|
|
4557
|
-
range: editor.selection
|
|
4558
|
-
}), SLATE_TO_PORTABLE_TEXT_RANGE.set(editor.selection, ptRange));
|
|
4559
|
-
}
|
|
4560
|
-
ptRange ? editorActor.send({
|
|
4561
|
-
type: "update selection",
|
|
4562
|
-
selection: ptRange
|
|
4563
|
-
}) : editorActor.send({
|
|
4564
|
-
type: "update selection",
|
|
4565
|
-
selection: null
|
|
4566
|
-
});
|
|
4567
|
-
}
|
|
4568
|
-
prevSelection = editor.selection;
|
|
4569
|
-
}, {
|
|
4570
|
-
onChange
|
|
4571
|
-
} = editor;
|
|
4572
|
-
return editor.onChange = () => {
|
|
4573
|
-
onChange(), editorActor.getSnapshot().matches({
|
|
4574
|
-
setup: "setting up"
|
|
4575
|
-
}) || emitPortableTextSelection();
|
|
4576
|
-
}, editor;
|
|
4577
|
-
};
|
|
4578
|
-
}
|
|
4579
4531
|
const debug$b = debugWithName("plugin:withSchemaTypes");
|
|
4580
4532
|
function createWithSchemaTypes({
|
|
4581
4533
|
editorActor
|
|
@@ -4663,12 +4615,23 @@ function getMarkState({
|
|
|
4663
4615
|
if (!block || !editor.isTextBlock(block) || !span)
|
|
4664
4616
|
return;
|
|
4665
4617
|
if (slate.Range.isExpanded(editor.selection)) {
|
|
4666
|
-
const
|
|
4667
|
-
|
|
4618
|
+
const selection = editor.selection ? slateRangeToSelection({
|
|
4619
|
+
schema: schema2,
|
|
4620
|
+
editor,
|
|
4621
|
+
range: editor.selection
|
|
4622
|
+
}) : null, selectedSpans = selector_isSelectingEntireBlocks.getSelectedSpans({
|
|
4623
|
+
context: {
|
|
4624
|
+
value: editor.value,
|
|
4625
|
+
selection,
|
|
4626
|
+
schema: schema2,
|
|
4627
|
+
converters: [],
|
|
4628
|
+
keyGenerator: () => "",
|
|
4629
|
+
readOnly: !1
|
|
4630
|
+
}
|
|
4668
4631
|
});
|
|
4669
4632
|
let index = 0, marks2 = [];
|
|
4670
|
-
for (const
|
|
4671
|
-
index === 0 ? marks2 = span2.marks ?? [] : (span2.marks?.length === 0 || (span2.marks ?? [])?.some((mark) => !marks2.includes(mark))) && (marks2 = []), index++;
|
|
4633
|
+
for (const span2 of selectedSpans)
|
|
4634
|
+
index === 0 ? marks2 = span2.node.marks ?? [] : (span2.node.marks?.length === 0 || (span2.node.marks ?? [])?.some((mark) => !marks2.includes(mark))) && (marks2 = []), index++;
|
|
4672
4635
|
return {
|
|
4673
4636
|
state: "unchanged",
|
|
4674
4637
|
marks: marks2
|
|
@@ -4741,6 +4704,43 @@ function pluginUpdateMarkState(context, editor) {
|
|
|
4741
4704
|
});
|
|
4742
4705
|
}, editor;
|
|
4743
4706
|
}
|
|
4707
|
+
function pluginUpdateSelection({
|
|
4708
|
+
editor,
|
|
4709
|
+
editorActor
|
|
4710
|
+
}) {
|
|
4711
|
+
const updateSelection = () => {
|
|
4712
|
+
if (editor.selection) {
|
|
4713
|
+
const existingSelection = SLATE_TO_PORTABLE_TEXT_RANGE.get(editor.selection);
|
|
4714
|
+
if (existingSelection)
|
|
4715
|
+
editorActor.send({
|
|
4716
|
+
type: "update selection",
|
|
4717
|
+
selection: existingSelection
|
|
4718
|
+
});
|
|
4719
|
+
else {
|
|
4720
|
+
const selection = slateRangeToSelection({
|
|
4721
|
+
schema: editorActor.getSnapshot().context.schema,
|
|
4722
|
+
editor,
|
|
4723
|
+
range: editor.selection
|
|
4724
|
+
});
|
|
4725
|
+
SLATE_TO_PORTABLE_TEXT_RANGE.set(editor.selection, selection), editorActor.send({
|
|
4726
|
+
type: "update selection",
|
|
4727
|
+
selection
|
|
4728
|
+
});
|
|
4729
|
+
}
|
|
4730
|
+
} else
|
|
4731
|
+
editorActor.send({
|
|
4732
|
+
type: "update selection",
|
|
4733
|
+
selection: null
|
|
4734
|
+
});
|
|
4735
|
+
}, {
|
|
4736
|
+
onChange
|
|
4737
|
+
} = editor;
|
|
4738
|
+
return editor.onChange = () => {
|
|
4739
|
+
onChange(), editorActor.getSnapshot().matches({
|
|
4740
|
+
setup: "setting up"
|
|
4741
|
+
}) || updateSelection();
|
|
4742
|
+
}, editor;
|
|
4743
|
+
}
|
|
4744
4744
|
function isEditorNode(node) {
|
|
4745
4745
|
return typeof node == "object" && node !== null ? !("_type" in node) && "children" in node && Array.isArray(node.children) : !1;
|
|
4746
4746
|
}
|
|
@@ -5036,8 +5036,11 @@ const withPlugins = (editor, options) => {
|
|
|
5036
5036
|
subscriptions: options.subscriptions
|
|
5037
5037
|
}), withPortableTextMarkModel = createWithPortableTextMarkModel(editorActor), withPlaceholderBlock = createWithPlaceholderBlock(editorActor), withUtils = createWithUtils({
|
|
5038
5038
|
editorActor
|
|
5039
|
-
})
|
|
5040
|
-
return createWithEventListeners(editorActor)(withSchemaTypes(withObjectKeys(withPortableTextMarkModel(withPlaceholderBlock(withUtils(withMaxBlocks(withUndoRedo(withPatches(
|
|
5039
|
+
});
|
|
5040
|
+
return createWithEventListeners(editorActor)(withSchemaTypes(withObjectKeys(withPortableTextMarkModel(withPlaceholderBlock(withUtils(withMaxBlocks(withUndoRedo(withPatches(pluginUpdateValue(editorActor.getSnapshot().context, pluginUpdateMarkState(editorActor.getSnapshot().context, pluginUpdateSelection({
|
|
5041
|
+
editorActor,
|
|
5042
|
+
editor: e
|
|
5043
|
+
}))))))))))));
|
|
5041
5044
|
}, debug$a = debugWithName("setup");
|
|
5042
5045
|
function createSlateEditor(config) {
|
|
5043
5046
|
debug$a("Creating new Slate editor instance");
|
|
@@ -8305,12 +8308,13 @@ function createEditableAPI(editor, editorActor) {
|
|
|
8305
8308
|
return [];
|
|
8306
8309
|
}
|
|
8307
8310
|
},
|
|
8308
|
-
isAnnotationActive: (annotationType) =>
|
|
8309
|
-
|
|
8310
|
-
|
|
8311
|
-
|
|
8312
|
-
}
|
|
8313
|
-
|
|
8311
|
+
isAnnotationActive: (annotationType) => {
|
|
8312
|
+
const snapshot = getEditorSnapshot({
|
|
8313
|
+
editorActorSnapshot: editorActor.getSnapshot(),
|
|
8314
|
+
slateEditorInstance: editor
|
|
8315
|
+
});
|
|
8316
|
+
return selector_isSelectingEntireBlocks.isActiveAnnotation(annotationType)(snapshot);
|
|
8317
|
+
},
|
|
8314
8318
|
addAnnotation: (type, value) => {
|
|
8315
8319
|
let paths;
|
|
8316
8320
|
return slate.Editor.withoutNormalizing(editor, () => {
|
|
@@ -8397,41 +8401,60 @@ function createEditableAPI(editor, editorActor) {
|
|
|
8397
8401
|
}
|
|
8398
8402
|
};
|
|
8399
8403
|
}
|
|
8400
|
-
function isAnnotationActive({
|
|
8401
|
-
editor,
|
|
8402
|
-
annotation
|
|
8403
|
-
}) {
|
|
8404
|
-
if (!editor.selection || editor.selection.focus.path.length < 2)
|
|
8405
|
-
return !1;
|
|
8406
|
-
try {
|
|
8407
|
-
const spans = [...slate.Editor.nodes(editor, {
|
|
8408
|
-
at: editor.selection,
|
|
8409
|
-
match: (node) => slate.Text.isText(node)
|
|
8410
|
-
})];
|
|
8411
|
-
if (spans.length === 0 || spans.some(([span]) => !types.isPortableTextSpan(span) || !span.marks || span.marks?.length === 0)) return !1;
|
|
8412
|
-
const selectionMarkDefs = spans.reduce((accMarkDefs, [, path]) => {
|
|
8413
|
-
const [block] = slate.Editor.node(editor, path, {
|
|
8414
|
-
depth: 1
|
|
8415
|
-
});
|
|
8416
|
-
return editor.isTextBlock(block) && block.markDefs ? [...accMarkDefs, ...block.markDefs] : accMarkDefs;
|
|
8417
|
-
}, []);
|
|
8418
|
-
return spans.every(([span]) => types.isPortableTextSpan(span) ? span.marks?.map((markKey) => selectionMarkDefs.find((def) => def?._key === markKey)?._type)?.includes(annotation.name) : !1);
|
|
8419
|
-
} catch {
|
|
8420
|
-
return !1;
|
|
8421
|
-
}
|
|
8422
|
-
}
|
|
8423
8404
|
const relayMachine = xstate.setup({
|
|
8424
8405
|
types: {
|
|
8406
|
+
context: {},
|
|
8425
8407
|
events: {},
|
|
8426
8408
|
emitted: {}
|
|
8427
8409
|
}
|
|
8428
8410
|
}).createMachine({
|
|
8429
8411
|
id: "relay",
|
|
8412
|
+
context: {
|
|
8413
|
+
prevSelection: null,
|
|
8414
|
+
lastEventWasFocused: !1
|
|
8415
|
+
},
|
|
8430
8416
|
on: {
|
|
8417
|
+
focused: {
|
|
8418
|
+
actions: [xstate.assign({
|
|
8419
|
+
lastEventWasFocused: !0
|
|
8420
|
+
}), xstate.emit(({
|
|
8421
|
+
event
|
|
8422
|
+
}) => event)]
|
|
8423
|
+
},
|
|
8424
|
+
selection: [{
|
|
8425
|
+
guard: ({
|
|
8426
|
+
context
|
|
8427
|
+
}) => context.lastEventWasFocused,
|
|
8428
|
+
actions: [xstate.assign({
|
|
8429
|
+
prevSelection: ({
|
|
8430
|
+
event
|
|
8431
|
+
}) => event.selection
|
|
8432
|
+
}), xstate.emit(({
|
|
8433
|
+
event
|
|
8434
|
+
}) => event), xstate.assign({
|
|
8435
|
+
lastEventWasFocused: !1
|
|
8436
|
+
})]
|
|
8437
|
+
}, {
|
|
8438
|
+
guard: ({
|
|
8439
|
+
context,
|
|
8440
|
+
event
|
|
8441
|
+
}) => context.prevSelection !== event.selection,
|
|
8442
|
+
actions: [xstate.assign({
|
|
8443
|
+
prevSelection: ({
|
|
8444
|
+
event
|
|
8445
|
+
}) => event.selection
|
|
8446
|
+
}), xstate.emit(({
|
|
8447
|
+
event
|
|
8448
|
+
}) => event), xstate.assign({
|
|
8449
|
+
lastEventWasFocused: !1
|
|
8450
|
+
})]
|
|
8451
|
+
}],
|
|
8431
8452
|
"*": {
|
|
8432
|
-
actions: xstate.emit(({
|
|
8453
|
+
actions: [xstate.emit(({
|
|
8433
8454
|
event
|
|
8434
|
-
}) => event)
|
|
8455
|
+
}) => event), xstate.assign({
|
|
8456
|
+
lastEventWasFocused: !1
|
|
8457
|
+
})]
|
|
8435
8458
|
}
|
|
8436
8459
|
}
|
|
8437
8460
|
});
|
|
@@ -10719,22 +10742,11 @@ const debug = debugWithName("component:Editable"), PortableTextEditable = React.
|
|
|
10719
10742
|
}
|
|
10720
10743
|
debug("No result from custom paste handler, pasting normally");
|
|
10721
10744
|
}, [editorActor, onPaste, portableTextEditor, relayActor, slateEditor]), handleOnFocus = React.useCallback((event_2) => {
|
|
10722
|
-
|
|
10723
|
-
|
|
10724
|
-
|
|
10725
|
-
|
|
10726
|
-
|
|
10727
|
-
const selection_3 = slateEditor.selection ? slateRangeToSelection({
|
|
10728
|
-
schema: editorActor.getSnapshot().context.schema,
|
|
10729
|
-
editor: slateEditor,
|
|
10730
|
-
range: slateEditor.selection
|
|
10731
|
-
}) : null;
|
|
10732
|
-
selection_3 && editorActor.send({
|
|
10733
|
-
type: "update selection",
|
|
10734
|
-
selection: selection_3
|
|
10735
|
-
});
|
|
10736
|
-
}
|
|
10737
|
-
}, [editorActor, onFocus, slateEditor, relayActor]), handleClick = React.useCallback((event_3) => {
|
|
10745
|
+
onFocus && onFocus(event_2), event_2.isDefaultPrevented() || relayActor.send({
|
|
10746
|
+
type: "focused",
|
|
10747
|
+
event: event_2
|
|
10748
|
+
});
|
|
10749
|
+
}, [onFocus, relayActor]), handleClick = React.useCallback((event_3) => {
|
|
10738
10750
|
if (onClick && onClick(event_3), event_3.isDefaultPrevented() || event_3.isPropagationStopped())
|
|
10739
10751
|
return;
|
|
10740
10752
|
const position_3 = getEventPosition({
|