@portabletext/editor 1.1.4 → 1.1.5

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.
Files changed (32) hide show
  1. package/lib/index.d.mts +228 -30
  2. package/lib/index.d.ts +228 -30
  3. package/lib/index.esm.js +88 -100
  4. package/lib/index.esm.js.map +1 -1
  5. package/lib/index.js +88 -100
  6. package/lib/index.js.map +1 -1
  7. package/lib/index.mjs +88 -100
  8. package/lib/index.mjs.map +1 -1
  9. package/package.json +24 -19
  10. package/src/editor/Editable.tsx +6 -11
  11. package/src/editor/PortableTextEditor.tsx +26 -30
  12. package/src/editor/__tests__/self-solving.test.tsx +1 -1
  13. package/src/editor/components/SlateContainer.tsx +2 -13
  14. package/src/editor/components/Synchronizer.tsx +0 -3
  15. package/src/editor/editor-machine.ts +7 -2
  16. package/src/editor/hooks/useSyncValue.ts +3 -5
  17. package/src/editor/key-generator.ts +6 -0
  18. package/src/editor/plugins/createWithEditableAPI.ts +8 -5
  19. package/src/editor/plugins/createWithHotKeys.ts +1 -0
  20. package/src/editor/plugins/createWithInsertBreak.ts +6 -2
  21. package/src/editor/plugins/createWithInsertData.ts +7 -4
  22. package/src/editor/plugins/createWithObjectKeys.ts +12 -5
  23. package/src/editor/plugins/createWithPatches.ts +0 -1
  24. package/src/editor/plugins/createWithPortableTextMarkModel.ts +4 -5
  25. package/src/editor/plugins/createWithSchemaTypes.ts +3 -4
  26. package/src/editor/plugins/createWithUtils.ts +5 -4
  27. package/src/editor/plugins/index.ts +5 -13
  28. package/src/index.ts +2 -2
  29. package/src/types/options.ts +0 -1
  30. package/src/utils/__tests__/operationToPatches.test.ts +0 -2
  31. package/src/utils/__tests__/patchToOperations.test.ts +1 -2
  32. package/src/editor/hooks/usePortableTextEditorKeyGenerator.ts +0 -27
package/lib/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: !0 });
3
- var jsxRuntime = require("react/jsx-runtime"), isEqual = require("lodash/isEqual.js"), noop = require("lodash/noop.js"), react = require("react"), slate = require("slate"), slateReact = require("slate-react"), debug$m = require("debug"), types = require("@sanity/types"), styledComponents = require("styled-components"), uniq = require("lodash/uniq.js"), rxjs = require("rxjs"), xstate = require("xstate"), schema = require("@sanity/schema"), patches = require("@portabletext/patches"), get = require("lodash/get.js"), isUndefined = require("lodash/isUndefined.js"), omitBy = require("lodash/omitBy.js"), flatten = require("lodash/flatten.js"), isHotkeyEsm = require("is-hotkey-esm"), blockTools = require("@sanity/block-tools"), isPlainObject = require("lodash/isPlainObject.js"), throttle = require("lodash/throttle.js"), content = require("@sanity/util/content"), debounce = require("lodash/debounce.js");
3
+ var jsxRuntime = require("react/jsx-runtime"), isEqual = require("lodash/isEqual.js"), noop = require("lodash/noop.js"), react = require("react"), slate = require("slate"), slateReact = require("slate-react"), debug$m = require("debug"), types = require("@sanity/types"), styledComponents = require("styled-components"), uniq = require("lodash/uniq.js"), rxjs = require("rxjs"), xstate = require("xstate"), schema = require("@sanity/schema"), patches = require("@portabletext/patches"), get = require("lodash/get.js"), isUndefined = require("lodash/isUndefined.js"), omitBy = require("lodash/omitBy.js"), flatten = require("lodash/flatten.js"), isHotkeyEsm = require("is-hotkey-esm"), blockTools = require("@sanity/block-tools"), isPlainObject = require("lodash/isPlainObject.js"), throttle = require("lodash/throttle.js"), debounce = require("lodash/debounce.js"), content = require("@sanity/util/content");
4
4
  function _interopDefaultCompat(e) {
5
5
  return e && typeof e == "object" && "default" in e ? e : { default: e };
6
6
  }
@@ -1067,7 +1067,7 @@ function createOperationToPatches(types2) {
1067
1067
  };
1068
1068
  }
1069
1069
  const debug$j = debugWithName("API:editable");
1070
- function createWithEditableAPI(portableTextEditor, types$1, keyGenerator) {
1070
+ function createWithEditableAPI(editorActor, portableTextEditor, types$1) {
1071
1071
  return function(editor) {
1072
1072
  return portableTextEditor.setEditable({
1073
1073
  focus: () => {
@@ -1147,11 +1147,11 @@ function createWithEditableAPI(portableTextEditor, types$1, keyGenerator) {
1147
1147
  const child = toSlateValue(
1148
1148
  [
1149
1149
  {
1150
- _key: keyGenerator(),
1150
+ _key: editorActor.getSnapshot().context.keyGenerator(),
1151
1151
  _type: types$1.block.name,
1152
1152
  children: [
1153
1153
  {
1154
- _key: keyGenerator(),
1154
+ _key: editorActor.getSnapshot().context.keyGenerator(),
1155
1155
  _type: type.name,
1156
1156
  ...value || {}
1157
1157
  }
@@ -1179,7 +1179,7 @@ function createWithEditableAPI(portableTextEditor, types$1, keyGenerator) {
1179
1179
  const block = toSlateValue(
1180
1180
  [
1181
1181
  {
1182
- _key: keyGenerator(),
1182
+ _key: editorActor.getSnapshot().context.keyGenerator(),
1183
1183
  _type: type.name,
1184
1184
  ...value || {}
1185
1185
  }
@@ -1343,7 +1343,7 @@ function createWithEditableAPI(portableTextEditor, types$1, keyGenerator) {
1343
1343
  for (const [block, blockPath] of selectedBlocks) {
1344
1344
  if (block.children.length === 0 || block.children.length === 1 && block.children[0].text === "")
1345
1345
  continue;
1346
- const annotationKey = keyGenerator(), markDefs = block.markDefs ?? [];
1346
+ const annotationKey = editorActor.getSnapshot().context.keyGenerator(), markDefs = block.markDefs ?? [];
1347
1347
  markDefs.find(
1348
1348
  (markDef) => markDef._type === type.name && markDef._key === annotationKey
1349
1349
  ) === void 0 && (slate.Transforms.setNodes(
@@ -1552,7 +1552,7 @@ function createWithEditableAPI(portableTextEditor, types$1, keyGenerator) {
1552
1552
  }), editor;
1553
1553
  };
1554
1554
  }
1555
- function createWithInsertBreak(types2, keyGenerator) {
1555
+ function createWithInsertBreak(editorActor, types2) {
1556
1556
  return function(editor) {
1557
1557
  const { insertBreak } = editor;
1558
1558
  return editor.insertBreak = () => {
@@ -1641,7 +1641,10 @@ function createWithInsertBreak(types2, keyGenerator) {
1641
1641
  (decorator) => decorator.value === mark
1642
1642
  ) || prevNodeSpans.some(
1643
1643
  (prevNodeSpan) => prevNodeSpan.marks?.includes(mark)
1644
- ) && !newMarkDefKeys.has(mark) && newMarkDefKeys.set(mark, keyGenerator());
1644
+ ) && !newMarkDefKeys.has(mark) && newMarkDefKeys.set(
1645
+ mark,
1646
+ editorActor.getSnapshot().context.keyGenerator()
1647
+ );
1645
1648
  const newMarks = marks.map(
1646
1649
  (mark) => newMarkDefKeys.get(mark) ?? mark
1647
1650
  );
@@ -1722,7 +1725,7 @@ function createWithMaxBlocks(maxBlocks) {
1722
1725
  }, editor;
1723
1726
  };
1724
1727
  }
1725
- function createWithObjectKeys(editorActor, schemaTypes, keyGenerator) {
1728
+ function createWithObjectKeys(editorActor, schemaTypes) {
1726
1729
  return function(editor) {
1727
1730
  const { apply: apply2, normalizeNode } = editor;
1728
1731
  return editor.apply = (operation) => {
@@ -1739,7 +1742,7 @@ function createWithObjectKeys(editorActor, schemaTypes, keyGenerator) {
1739
1742
  ...operation,
1740
1743
  properties: {
1741
1744
  ...operation.properties,
1742
- _key: keyGenerator()
1745
+ _key: editorActor.getSnapshot().context.keyGenerator()
1743
1746
  }
1744
1747
  });
1745
1748
  return;
@@ -1749,7 +1752,7 @@ function createWithObjectKeys(editorActor, schemaTypes, keyGenerator) {
1749
1752
  ...operation,
1750
1753
  node: {
1751
1754
  ...operation.node,
1752
- _key: keyGenerator()
1755
+ _key: editorActor.getSnapshot().context.keyGenerator()
1753
1756
  }
1754
1757
  });
1755
1758
  return;
@@ -1759,12 +1762,20 @@ function createWithObjectKeys(editorActor, schemaTypes, keyGenerator) {
1759
1762
  const [node, path] = entry;
1760
1763
  if (slate.Element.isElement(node) && node._type === schemaTypes.block.name) {
1761
1764
  if (!node._key) {
1762
- editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(editor, { _key: keyGenerator() }, { at: path }), editorActor.send({ type: "done normalizing" });
1765
+ editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(
1766
+ editor,
1767
+ { _key: editorActor.getSnapshot().context.keyGenerator() },
1768
+ { at: path }
1769
+ ), editorActor.send({ type: "done normalizing" });
1763
1770
  return;
1764
1771
  }
1765
1772
  for (const [child, childPath] of slate.Node.children(editor, path))
1766
1773
  if (!child._key) {
1767
- editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(editor, { _key: keyGenerator() }, { at: childPath }), editorActor.send({ type: "done normalizing" });
1774
+ editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(
1775
+ editor,
1776
+ { _key: editorActor.getSnapshot().context.keyGenerator() },
1777
+ { at: childPath }
1778
+ ), editorActor.send({ type: "done normalizing" });
1768
1779
  return;
1769
1780
  }
1770
1781
  }
@@ -3256,7 +3267,7 @@ function isPortableTextBlock(node) {
3256
3267
  );
3257
3268
  }
3258
3269
  const debug$c = debugWithName("plugin:withPortableTextMarkModel");
3259
- function createWithPortableTextMarkModel(editorActor, types2, keyGenerator) {
3270
+ function createWithPortableTextMarkModel(editorActor, types2) {
3260
3271
  return function(editor) {
3261
3272
  const { apply: apply2, normalizeNode } = editor, decorators = types2.decorators.map((t) => t.value), forceNewSelection = () => {
3262
3273
  editor.selection && (slate.Transforms.select(editor, { ...editor.selection }), editor.selection = { ...editor.selection });
@@ -3417,12 +3428,12 @@ function createWithPortableTextMarkModel(editorActor, types2, keyGenerator) {
3417
3428
  if (atTheBeginningOfSpan) {
3418
3429
  previousSpanHasSameMarks ? slate.Transforms.insertNodes(editor, {
3419
3430
  _type: "span",
3420
- _key: keyGenerator(),
3431
+ _key: editorActor.getSnapshot().context.keyGenerator(),
3421
3432
  text: op.text,
3422
3433
  marks: previousSpan?.marks ?? []
3423
3434
  }) : previousSpanHasSameAnnotation ? apply2(op) : slate.Transforms.insertNodes(editor, {
3424
3435
  _type: "span",
3425
- _key: keyGenerator(),
3436
+ _key: editorActor.getSnapshot().context.keyGenerator(),
3426
3437
  text: op.text,
3427
3438
  marks: []
3428
3439
  });
@@ -3431,12 +3442,12 @@ function createWithPortableTextMarkModel(editorActor, types2, keyGenerator) {
3431
3442
  if (atTheEndOfSpan) {
3432
3443
  nextSpanHasSameMarks ? slate.Transforms.insertNodes(editor, {
3433
3444
  _type: "span",
3434
- _key: keyGenerator(),
3445
+ _key: editorActor.getSnapshot().context.keyGenerator(),
3435
3446
  text: op.text,
3436
3447
  marks: nextSpan?.marks ?? []
3437
3448
  }) : nextSpanHasSameAnnotation ? apply2(op) : slate.Transforms.insertNodes(editor, {
3438
3449
  _type: "span",
3439
- _key: keyGenerator(),
3450
+ _key: editorActor.getSnapshot().context.keyGenerator(),
3440
3451
  text: op.text,
3441
3452
  marks: []
3442
3453
  });
@@ -3669,8 +3680,7 @@ function createWithPortableTextSelections(editorActor, types2) {
3669
3680
  const debug$a = debugWithName("plugin:withSchemaTypes");
3670
3681
  function createWithSchemaTypes({
3671
3682
  editorActor,
3672
- schemaTypes,
3673
- keyGenerator
3683
+ schemaTypes
3674
3684
  }) {
3675
3685
  return function(editor) {
3676
3686
  editor.isTextBlock = (value) => types.isPortableTextTextBlock(value) && value._type === schemaTypes.block.name, editor.isTextSpan = (value) => types.isPortableTextSpan(value) && value._type === schemaTypes.span.name, editor.isListBlock = (value) => types.isPortableTextListBlock(value) && value._type === schemaTypes.block.name, editor.isVoid = (element) => schemaTypes.block.name !== element._type && (schemaTypes.blockObjects.map((obj) => obj.name).includes(element._type) || schemaTypes.inlineObjects.map((obj) => obj.name).includes(element._type)), editor.isInline = (element) => schemaTypes.inlineObjects.map((obj) => obj.name).includes(element._type) && "__inline" in element && element.__inline === !0;
@@ -3679,7 +3689,7 @@ function createWithSchemaTypes({
3679
3689
  const [node, path] = entry;
3680
3690
  if (node._type === void 0 && path.length === 2) {
3681
3691
  debug$a("Setting span type on text node without a type");
3682
- const span = node, key = span._key || keyGenerator();
3692
+ const span = node, key = span._key || editorActor.getSnapshot().context.keyGenerator();
3683
3693
  editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(
3684
3694
  editor,
3685
3695
  { ...span, _type: schemaTypes.span.name, _key: key },
@@ -3689,7 +3699,7 @@ function createWithSchemaTypes({
3689
3699
  }
3690
3700
  if (node._key === void 0 && (path.length === 1 || path.length === 2)) {
3691
3701
  debug$a("Setting missing key on child node without a key");
3692
- const key = keyGenerator();
3702
+ const key = editorActor.getSnapshot().context.keyGenerator();
3693
3703
  editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(editor, { _key: key }, { at: path }), editorActor.send({ type: "done normalizing" });
3694
3704
  return;
3695
3705
  }
@@ -3699,8 +3709,8 @@ function createWithSchemaTypes({
3699
3709
  }
3700
3710
  const debug$9 = debugWithName("plugin:withUtils");
3701
3711
  function createWithUtils({
3712
+ editorActor,
3702
3713
  schemaTypes,
3703
- keyGenerator,
3704
3714
  portableTextEditor
3705
3715
  }) {
3706
3716
  return function(editor) {
@@ -3726,13 +3736,13 @@ function createWithUtils({
3726
3736
  [
3727
3737
  {
3728
3738
  _type: schemaTypes.block.name,
3729
- _key: keyGenerator(),
3739
+ _key: editorActor.getSnapshot().context.keyGenerator(),
3730
3740
  style: schemaTypes.styles[0].value || "normal",
3731
3741
  markDefs: [],
3732
3742
  children: [
3733
3743
  {
3734
3744
  _type: "span",
3735
- _key: keyGenerator(),
3745
+ _key: editorActor.getSnapshot().context.keyGenerator(),
3736
3746
  text: "",
3737
3747
  marks: options.decorators.filter(
3738
3748
  (decorator) => schemaTypes.decorators.find(({ value }) => value === decorator)
@@ -3800,7 +3810,7 @@ function createWithHotkeys(types$1, portableTextEditor, hotkeysFromOptions) {
3800
3810
  {
3801
3811
  at: nextPath
3802
3812
  }
3803
- ), editor.onChange();
3813
+ ), slate.Transforms.select(editor, { path: [...nextPath, 0], offset: 0 }), editor.onChange();
3804
3814
  return;
3805
3815
  }
3806
3816
  }
@@ -4143,7 +4153,7 @@ function validateValue(value, types$1, keyGenerator) {
4143
4153
  }) && (valid = !1), { valid, resolution, value });
4144
4154
  }
4145
4155
  const debug$7 = debugWithName("plugin:withInsertData");
4146
- function createWithInsertData(editorActor, schemaTypes, keyGenerator) {
4156
+ function createWithInsertData(editorActor, schemaTypes) {
4147
4157
  return function(editor) {
4148
4158
  const blockTypeName = schemaTypes.block.name, spanTypeName = schemaTypes.span.name, whitespaceOnPasteMode = schemaTypes.block.options.unstable_whitespaceOnPasteMode, toPlainText = (blocks) => blocks.map((block) => editor.isTextBlock(block) ? block.children.map((child) => child._type === spanTypeName ? child.text : `[${schemaTypes.inlineObjects.find((t) => t.name === child._type)?.title || "Object"}]`).join("") : `[${schemaTypes.blockObjects.find((t) => t.name === block._type)?.title || "Object"}]`).join(`
4149
4159
 
@@ -4191,10 +4201,14 @@ function createWithInsertData(editorActor, schemaTypes, keyGenerator) {
4191
4201
  const slateValue = _regenerateKeys(
4192
4202
  editor,
4193
4203
  toSlateValue(parsed, { schemaTypes }),
4194
- keyGenerator,
4204
+ editorActor.getSnapshot().context.keyGenerator,
4195
4205
  spanTypeName,
4196
4206
  schemaTypes
4197
- ), validation = validateValue(parsed, schemaTypes, keyGenerator);
4207
+ ), validation = validateValue(
4208
+ parsed,
4209
+ schemaTypes,
4210
+ editorActor.getSnapshot().context.keyGenerator
4211
+ );
4198
4212
  if (!validation.valid && !validation.resolution?.autoResolve) {
4199
4213
  const errorDescription = `${validation.resolution?.description}`;
4200
4214
  return editorActor.send({
@@ -4235,7 +4249,7 @@ function createWithInsertData(editorActor, schemaTypes, keyGenerator) {
4235
4249
  const validation = validateValue(
4236
4250
  portableText,
4237
4251
  schemaTypes,
4238
- keyGenerator
4252
+ editorActor.getSnapshot().context.keyGenerator
4239
4253
  );
4240
4254
  if (!validation.valid) {
4241
4255
  const errorDescription = `Could not validate the resulting portable text to insert.
@@ -4339,27 +4353,21 @@ function _insertFragment(editor, fragment, schemaTypes) {
4339
4353
  }), editor.onChange();
4340
4354
  }
4341
4355
  const originalFnMap = /* @__PURE__ */ new WeakMap(), withPlugins = (editor, options) => {
4342
- const e = editor, { keyGenerator, portableTextEditor, patches$, readOnly, maxBlocks } = options, { editorActor, schemaTypes } = portableTextEditor;
4356
+ const e = editor, { portableTextEditor, patches$, readOnly, maxBlocks } = options, { editorActor, schemaTypes } = portableTextEditor;
4343
4357
  e.subscriptions = [], e.destroy ? e.destroy() : originalFnMap.set(e, {
4344
4358
  apply: e.apply,
4345
4359
  onChange: e.onChange,
4346
4360
  normalizeNode: e.normalizeNode
4347
4361
  });
4348
- const operationToPatches = createOperationToPatches(schemaTypes), withObjectKeys = createWithObjectKeys(
4349
- editorActor,
4350
- schemaTypes,
4351
- keyGenerator
4352
- ), withSchemaTypes = createWithSchemaTypes({
4362
+ const operationToPatches = createOperationToPatches(schemaTypes), withObjectKeys = createWithObjectKeys(editorActor, schemaTypes), withSchemaTypes = createWithSchemaTypes({
4353
4363
  editorActor,
4354
- schemaTypes,
4355
- keyGenerator
4364
+ schemaTypes
4356
4365
  }), withEditableAPI = createWithEditableAPI(
4366
+ editorActor,
4357
4367
  portableTextEditor,
4358
- schemaTypes,
4359
- keyGenerator
4368
+ schemaTypes
4360
4369
  ), withPatches = createWithPatches({
4361
4370
  editorActor,
4362
- keyGenerator,
4363
4371
  patches$,
4364
4372
  patchFunctions: operationToPatches,
4365
4373
  readOnly,
@@ -4370,13 +4378,12 @@ const originalFnMap = /* @__PURE__ */ new WeakMap(), withPlugins = (editor, opti
4370
4378
  blockSchemaType: schemaTypes.block
4371
4379
  }), withPortableTextMarkModel = createWithPortableTextMarkModel(
4372
4380
  editorActor,
4373
- schemaTypes,
4374
- keyGenerator
4381
+ schemaTypes
4375
4382
  ), withPortableTextBlockStyle = createWithPortableTextBlockStyle(
4376
4383
  editorActor,
4377
4384
  schemaTypes
4378
- ), withPlaceholderBlock = createWithPlaceholderBlock(), withInsertBreak = createWithInsertBreak(schemaTypes, keyGenerator), withUtils = createWithUtils({
4379
- keyGenerator,
4385
+ ), withPlaceholderBlock = createWithPlaceholderBlock(), withInsertBreak = createWithInsertBreak(editorActor, schemaTypes), withUtils = createWithUtils({
4386
+ editorActor,
4380
4387
  schemaTypes,
4381
4388
  portableTextEditor
4382
4389
  }), withPortableTextSelections = createWithPortableTextSelections(
@@ -4444,10 +4451,9 @@ const originalFnMap = /* @__PURE__ */ new WeakMap(), withPlugins = (editor, opti
4444
4451
  };
4445
4452
  }, debug$6 = debugWithName("component:PortableTextEditor:SlateContainer");
4446
4453
  function SlateContainer(props) {
4447
- const { patches$, portableTextEditor, readOnly, maxBlocks, keyGenerator } = props, [[slateEditor, subscribe]] = react.useState(() => {
4454
+ const { patches$, portableTextEditor, readOnly, maxBlocks } = props, [[slateEditor, subscribe]] = react.useState(() => {
4448
4455
  debug$6("Creating new Slate editor instance");
4449
4456
  const { editor, subscribe: _sub } = withPlugins(slateReact.withReact(slate.createEditor()), {
4450
- keyGenerator,
4451
4457
  maxBlocks,
4452
4458
  patches$,
4453
4459
  portableTextEditor,
@@ -4462,33 +4468,18 @@ function SlateContainer(props) {
4462
4468
  };
4463
4469
  }, [subscribe]), react.useEffect(() => {
4464
4470
  debug$6("Re-initializing plugin chain"), withPlugins(slateEditor, {
4465
- keyGenerator,
4466
4471
  maxBlocks,
4467
4472
  patches$,
4468
4473
  portableTextEditor,
4469
4474
  readOnly
4470
4475
  });
4471
- }, [
4472
- keyGenerator,
4473
- portableTextEditor,
4474
- maxBlocks,
4475
- readOnly,
4476
- patches$,
4477
- slateEditor
4478
- ]);
4476
+ }, [portableTextEditor, maxBlocks, readOnly, patches$, slateEditor]);
4479
4477
  const initialValue = react.useMemo(() => [slateEditor.pteCreateTextBlock({ decorators: [] })], [slateEditor]);
4480
4478
  return react.useEffect(() => () => {
4481
4479
  debug$6("Destroying Slate editor"), slateEditor.destroy();
4482
4480
  }, [slateEditor]), /* @__PURE__ */ jsxRuntime.jsx(slateReact.Slate, { editor: slateEditor, initialValue, children: props.children });
4483
4481
  }
4484
- const defaultKeyGenerator = () => content.randomKey(12), PortableTextEditorKeyGeneratorContext = react.createContext(defaultKeyGenerator), usePortableTextEditorKeyGenerator = () => {
4485
- const keyGenerator = react.useContext(PortableTextEditorKeyGeneratorContext);
4486
- if (keyGenerator === void 0)
4487
- throw new Error(
4488
- "The `usePortableTextEditorKeyGenerator` hook must be used inside the <PortableTextEditor> component's context."
4489
- );
4490
- return keyGenerator;
4491
- }, PortableTextEditorReadOnlyContext = react.createContext(!1), usePortableTextEditorReadOnlyStatus = () => {
4482
+ const PortableTextEditorReadOnlyContext = react.createContext(!1), usePortableTextEditorReadOnlyStatus = () => {
4492
4483
  const readOnly = react.useContext(PortableTextEditorReadOnlyContext);
4493
4484
  if (readOnly === void 0)
4494
4485
  throw new Error(
@@ -4497,7 +4488,7 @@ const defaultKeyGenerator = () => content.randomKey(12), PortableTextEditorKeyGe
4497
4488
  return readOnly;
4498
4489
  }, debug$5 = debugWithName("hook:useSyncValue"), CURRENT_VALUE = /* @__PURE__ */ new WeakMap();
4499
4490
  function useSyncValue(props) {
4500
- const { editorActor, portableTextEditor, readOnly, keyGenerator } = props, { schemaTypes } = portableTextEditor, previousValue = react.useRef(), slateEditor = slateReact.useSlate(), updateValueFunctionRef = react.useRef(), updateFromCurrentValue = react.useCallback(() => {
4491
+ const { editorActor, portableTextEditor, readOnly } = props, { schemaTypes } = portableTextEditor, previousValue = react.useRef(), slateEditor = slateReact.useSlate(), updateValueFunctionRef = react.useRef(), updateFromCurrentValue = react.useCallback(() => {
4501
4492
  const currentValue = CURRENT_VALUE.get(portableTextEditor);
4502
4493
  if (previousValue.current === currentValue) {
4503
4494
  debug$5("Value is the same object as previous, not need to sync");
@@ -4563,7 +4554,7 @@ function useSyncValue(props) {
4563
4554
  const validationValue = [value[currentBlockIndex]], validation = validateValue(
4564
4555
  validationValue,
4565
4556
  schemaTypes,
4566
- keyGenerator
4557
+ editorActor.getSnapshot().context.keyGenerator
4567
4558
  );
4568
4559
  !validation.valid && validation.resolution?.autoResolve && validation.resolution?.patches.length > 0 && !readOnly && previousValue.current && previousValue.current !== value && (console.warn(
4569
4560
  `${validation.resolution.action} for block with _key '${validationValue[0]._key}'. ${validation.resolution?.description}`
@@ -4588,7 +4579,7 @@ function useSyncValue(props) {
4588
4579
  const validationValue = [value[currentBlockIndex]], validation = validateValue(
4589
4580
  validationValue,
4590
4581
  schemaTypes,
4591
- keyGenerator
4582
+ editorActor.getSnapshot().context.keyGenerator
4592
4583
  );
4593
4584
  debug$5.enabled && debug$5(
4594
4585
  "Validating and inserting new block in the end of the value",
@@ -4635,7 +4626,6 @@ function useSyncValue(props) {
4635
4626
  return updateValueFunctionRef.current = updateFunction, updateFunction;
4636
4627
  }, [
4637
4628
  editorActor,
4638
- keyGenerator,
4639
4629
  portableTextEditor,
4640
4630
  readOnly,
4641
4631
  schemaTypes,
@@ -4703,9 +4693,8 @@ function _updateBlock(slateEditor, currentBlock, oldBlock, currentBlockIndex) {
4703
4693
  }
4704
4694
  const debug$4 = debugWithName("component:PortableTextEditor:Synchronizer"), debugVerbose$1 = debug$4.enabled && !1, FLUSH_PATCHES_THROTTLED_MS = process.env.NODE_ENV === "test" ? 500 : 1e3;
4705
4695
  function Synchronizer(props) {
4706
- const portableTextEditor = usePortableTextEditor(), keyGenerator = usePortableTextEditorKeyGenerator(), readOnly = usePortableTextEditorReadOnlyStatus(), { editorActor, getValue, onChange, value } = props, pendingPatches = react.useRef([]), syncValue = useSyncValue({
4696
+ const portableTextEditor = usePortableTextEditor(), readOnly = usePortableTextEditorReadOnlyStatus(), { editorActor, getValue, onChange, value } = props, pendingPatches = react.useRef([]), syncValue = useSyncValue({
4707
4697
  editorActor,
4708
- keyGenerator,
4709
4698
  portableTextEditor,
4710
4699
  readOnly
4711
4700
  }), slateEditor = slateReact.useSlate();
@@ -4819,7 +4808,8 @@ const networkLogic = xstate.fromCallback(({ sendBack }) => {
4819
4808
  types: {
4820
4809
  context: {},
4821
4810
  events: {},
4822
- emitted: {}
4811
+ emitted: {},
4812
+ input: {}
4823
4813
  },
4824
4814
  actions: {
4825
4815
  "emit patch event": xstate.emit(({ event }) => (xstate.assertEvent(event, "patch"), event)),
@@ -4840,9 +4830,10 @@ const networkLogic = xstate.fromCallback(({ sendBack }) => {
4840
4830
  }
4841
4831
  }).createMachine({
4842
4832
  id: "editor",
4843
- context: {
4833
+ context: ({ input }) => ({
4834
+ keyGenerator: input.keyGenerator,
4844
4835
  pendingEvents: []
4845
- },
4836
+ }),
4846
4837
  invoke: {
4847
4838
  id: "networkLogic",
4848
4839
  src: "networkLogic"
@@ -4930,7 +4921,7 @@ function PortableTextEditorSelectionProvider(props) {
4930
4921
  };
4931
4922
  }, [props.editorActor]), /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorSelectionContext.Provider, { value: selection, children: props.children });
4932
4923
  }
4933
- const debug$2 = debugWithName("component:PortableTextEditor");
4924
+ const defaultKeyGenerator = () => content.randomKey(12), debug$2 = debugWithName("component:PortableTextEditor");
4934
4925
  class PortableTextEditor extends react.Component {
4935
4926
  /**
4936
4927
  * @internal
@@ -4954,7 +4945,11 @@ class PortableTextEditor extends react.Component {
4954
4945
  throw new Error('PortableTextEditor: missing "schemaType" property');
4955
4946
  props.incomingPatches$ && console.warn(
4956
4947
  "The prop 'incomingPatches$' is deprecated and renamed to 'patches$'"
4957
- ), this.editorActor = xstate.createActor(editorMachine), this.editorActor.start(), this.schemaTypes = getPortableTextMemberSchemaTypes(
4948
+ ), this.editorActor = xstate.createActor(editorMachine, {
4949
+ input: {
4950
+ keyGenerator: props.keyGenerator || defaultKeyGenerator
4951
+ }
4952
+ }), this.editorActor.start(), this.schemaTypes = getPortableTextMemberSchemaTypes(
4958
4953
  props.schemaType.hasOwnProperty("jsonType") ? props.schemaType : compileType(props.schemaType)
4959
4954
  );
4960
4955
  }
@@ -4971,35 +4966,28 @@ class PortableTextEditor extends react.Component {
4971
4966
  return this.editable.getValue();
4972
4967
  };
4973
4968
  render() {
4974
- const { value, children, patches$, incomingPatches$ } = this.props, _patches$ = incomingPatches$ || patches$, maxBlocks = typeof this.props.maxBlocks > "u" ? void 0 : Number.parseInt(this.props.maxBlocks.toString(), 10) || void 0, readOnly = !!this.props.readOnly, keyGenerator = this.props.keyGenerator || defaultKeyGenerator;
4969
+ const { value, children, patches$, incomingPatches$ } = this.props, _patches$ = incomingPatches$ || patches$, maxBlocks = typeof this.props.maxBlocks > "u" ? void 0 : Number.parseInt(this.props.maxBlocks.toString(), 10) || void 0, readOnly = !!this.props.readOnly;
4975
4970
  return /* @__PURE__ */ jsxRuntime.jsx(
4976
4971
  SlateContainer,
4977
4972
  {
4978
- keyGenerator,
4979
4973
  maxBlocks,
4980
4974
  patches$: _patches$,
4981
4975
  portableTextEditor: this,
4982
4976
  readOnly,
4983
- children: /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorKeyGeneratorContext.Provider, { value: keyGenerator, children: /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorContext.Provider, { value: this, children: /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorReadOnlyContext.Provider, { value: readOnly, children: /* @__PURE__ */ jsxRuntime.jsxs(
4984
- PortableTextEditorSelectionProvider,
4985
- {
4986
- editorActor: this.editorActor,
4987
- children: [
4988
- /* @__PURE__ */ jsxRuntime.jsx(
4989
- Synchronizer,
4990
- {
4991
- editorActor: this.editorActor,
4992
- getValue: this.getValue,
4993
- onChange: (change) => {
4994
- this.props.onChange(change), this.change$.next(change);
4995
- },
4996
- value
4997
- }
4998
- ),
4999
- children
5000
- ]
5001
- }
5002
- ) }) }) })
4977
+ children: /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorContext.Provider, { value: this, children: /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorReadOnlyContext.Provider, { value: readOnly, children: /* @__PURE__ */ jsxRuntime.jsxs(PortableTextEditorSelectionProvider, { editorActor: this.editorActor, children: [
4978
+ /* @__PURE__ */ jsxRuntime.jsx(
4979
+ Synchronizer,
4980
+ {
4981
+ editorActor: this.editorActor,
4982
+ getValue: this.getValue,
4983
+ onChange: (change) => {
4984
+ this.props.onChange(change), this.change$.next(change);
4985
+ },
4986
+ value
4987
+ }
4988
+ ),
4989
+ children
4990
+ ] }) }) })
5003
4991
  }
5004
4992
  );
5005
4993
  }
@@ -5265,7 +5253,7 @@ const debug$1 = debugWithName("components:Leaf"), EMPTY_MARKS = [], Leaf = (prop
5265
5253
  scrollSelectionIntoView,
5266
5254
  spellCheck,
5267
5255
  ...restProps
5268
- } = props, portableTextEditor = usePortableTextEditor(), readOnly = usePortableTextEditorReadOnlyStatus(), keyGenerator = usePortableTextEditorKeyGenerator(), ref = react.useRef(null), [editableElement, setEditableElement] = react.useState(
5256
+ } = props, portableTextEditor = usePortableTextEditor(), readOnly = usePortableTextEditorReadOnlyStatus(), ref = react.useRef(null), [editableElement, setEditableElement] = react.useState(
5269
5257
  null
5270
5258
  ), [hasInvalidValue, setHasInvalidValue] = react.useState(!1), [rangeDecorationState, setRangeDecorationsState] = react.useState([]);
5271
5259
  react.useImperativeHandle(
@@ -5273,8 +5261,8 @@ const debug$1 = debugWithName("components:Leaf"), EMPTY_MARKS = [], Leaf = (prop
5273
5261
  () => ref.current
5274
5262
  );
5275
5263
  const rangeDecorationsRef = react.useRef(rangeDecorations), { editorActor, schemaTypes } = portableTextEditor, slateEditor = slateReact.useSlate(), blockTypeName = schemaTypes.block.name, withInsertData = react.useMemo(
5276
- () => createWithInsertData(editorActor, schemaTypes, keyGenerator),
5277
- [editorActor, keyGenerator, schemaTypes]
5264
+ () => createWithInsertData(editorActor, schemaTypes),
5265
+ [editorActor, schemaTypes]
5278
5266
  ), withHotKeys = react.useMemo(
5279
5267
  () => createWithHotkeys(schemaTypes, portableTextEditor, hotkeys),
5280
5268
  [hotkeys, portableTextEditor, schemaTypes]