@portabletext/editor 1.50.2 → 1.50.4

package/lib/plugins/index.d.cts

@@ -617,6 +617,9 @@ declare type EditorEmittedEvent =
       event: FocusEvent_2<HTMLDivElement, Element>
     }
   | {
+      /**
+       * @deprecated
+       */
       type: 'done loading'
     }
   | {
@@ -633,6 +636,9 @@ declare type EditorEmittedEvent =
       value: Array<PortableTextBlock> | undefined
     }
   | {
+      /**
+       * @deprecated
+       */
       type: 'loading'
     }
   | MutationEvent
@@ -2944,6 +2950,7 @@ declare interface PortableTextSlateEditor extends ReactEditor {
   isTextBlock: (value: unknown) => value is PortableTextTextBlock
   isTextSpan: (value: unknown) => value is PortableTextSpan
   isListBlock: (value: unknown) => value is PortableTextListBlock
+  value: Array<PortableTextBlock>
   /**
    * Use hotkeys
    */

package/lib/plugins/index.d.ts

@@ -617,6 +617,9 @@ declare type EditorEmittedEvent =
       event: FocusEvent_2<HTMLDivElement, Element>
     }
   | {
+      /**
+       * @deprecated
+       */
       type: 'done loading'
     }
   | {
@@ -633,6 +636,9 @@ declare type EditorEmittedEvent =
       value: Array<PortableTextBlock> | undefined
     }
   | {
+      /**
+       * @deprecated
+       */
       type: 'loading'
     }
   | MutationEvent
@@ -2944,6 +2950,7 @@ declare interface PortableTextSlateEditor extends ReactEditor {
   isTextBlock: (value: unknown) => value is PortableTextTextBlock
   isTextSpan: (value: unknown) => value is PortableTextSpan
   isListBlock: (value: unknown) => value is PortableTextListBlock
+  value: Array<PortableTextBlock>
   /**
    * Use hotkeys
    */

package/lib/selectors/index.d.cts

@@ -3049,6 +3049,7 @@ declare interface PortableTextSlateEditor extends ReactEditor {
   isTextBlock: (value: unknown) => value is PortableTextTextBlock
   isTextSpan: (value: unknown) => value is PortableTextSpan
   isListBlock: (value: unknown) => value is PortableTextListBlock
+  value: Array<PortableTextBlock>
   /**
    * Use hotkeys
    */

package/lib/selectors/index.d.ts

@@ -3049,6 +3049,7 @@ declare interface PortableTextSlateEditor extends ReactEditor {
   isTextBlock: (value: unknown) => value is PortableTextTextBlock
   isTextSpan: (value: unknown) => value is PortableTextSpan
   isListBlock: (value: unknown) => value is PortableTextListBlock
+  value: Array<PortableTextBlock>
   /**
    * Use hotkeys
    */

package/lib/utils/index.d.cts

@@ -2810,6 +2810,7 @@ declare interface PortableTextSlateEditor extends ReactEditor {
   isTextBlock: (value: unknown) => value is PortableTextTextBlock
   isTextSpan: (value: unknown) => value is PortableTextSpan
   isListBlock: (value: unknown) => value is PortableTextListBlock
+  value: Array<PortableTextBlock>
   /**
    * Use hotkeys
    */

package/lib/utils/index.d.ts

@@ -2810,6 +2810,7 @@ declare interface PortableTextSlateEditor extends ReactEditor {
   isTextBlock: (value: unknown) => value is PortableTextTextBlock
   isTextSpan: (value: unknown) => value is PortableTextSpan
   isListBlock: (value: unknown) => value is PortableTextListBlock
+  value: Array<PortableTextBlock>
   /**
    * Use hotkeys
    */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@portabletext/editor",
-  "version": "1.50.2",
+  "version": "1.50.4",
   "description": "Portable Text Editor made in React",
   "keywords": [
     "sanity",
@@ -68,9 +68,10 @@
   ],
   "dependencies": {
     "@portabletext/to-html": "^2.0.14",
-    "@xstate/react": "^5.0.3",
-    "debug": "^4.4.0",
+    "@xstate/react": "^5.0.4",
+    "debug": "^4.4.1",
     "get-random-values-esm": "^1.0.2",
+    "immer": "^10.1.1",
     "lodash": "^4.17.21",
     "lodash.startcase": "^4.4.0",
     "react-compiler-runtime": "19.1.0-rc.1",
@@ -78,23 +79,23 @@
     "slate-dom": "^0.114.0",
     "slate-react": "0.114.2",
     "use-effect-event": "^1.0.2",
-    "xstate": "^5.19.2",
-    "@portabletext/block-tools": "1.1.26",
-    "@portabletext/patches": "1.1.3"
+    "xstate": "^5.19.3",
+    "@portabletext/patches": "1.1.3",
+    "@portabletext/block-tools": "1.1.27"
   },
   "devDependencies": {
     "@portabletext/toolkit": "^2.0.17",
     "@sanity/diff-match-patch": "^3.2.0",
     "@sanity/pkg-utils": "^7.2.2",
-    "@sanity/schema": "^3.88.3",
-    "@sanity/types": "^3.88.3",
+    "@sanity/schema": "^3.89.0",
+    "@sanity/types": "^3.89.0",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.3.0",
     "@types/debug": "^4.1.12",
     "@types/lodash": "^4.17.16",
     "@types/lodash.startcase": "^4.4.9",
-    "@types/react": "^19.1.3",
-    "@types/react-dom": "^19.1.3",
+    "@types/react": "^19.1.4",
+    "@types/react-dom": "^19.1.5",
     "@typescript-eslint/eslint-plugin": "^8.32.1",
     "@typescript-eslint/parser": "^8.32.1",
     "@vitejs/plugin-react": "^4.4.1",
@@ -110,12 +111,12 @@
     "typescript": "5.8.3",
     "vite": "^6.2.5",
     "vitest": "^3.1.3",
-    "vitest-browser-react": "^0.1.1",
+    "vitest-browser-react": "^0.2.0",
     "racejar": "1.2.5"
   },
   "peerDependencies": {
-    "@sanity/schema": "^3.88.3",
-    "@sanity/types": "^3.88.3",
+    "@sanity/schema": "^3.89.0",
+    "@sanity/types": "^3.89.0",
     "react": "^16.9 || ^17 || ^18 || ^19",
     "rxjs": "^7.8.2"
   },

package/src/editor/PortableTextEditor.tsx

@@ -138,6 +138,7 @@ export class PortableTextEditor extends Component<
     syncActor: SyncActor
   }
 
+  private subscriptions: Array<() => () => void> = []
   private unsubscribers: Array<() => void> = []
 
   constructor(props: PortableTextEditorProps) {
@@ -160,28 +161,7 @@ export class PortableTextEditor extends Component<
         schema: props.schemaType,
       })
 
-      this.unsubscribers.push(
-        (() => {
-          const subscription = actors.relayActor.on('*', (event) => {
-            const change = eventToChange(event)
-
-            if (change) {
-              props.onChange(change)
-
-              this.change$.next(change)
-            }
-          })
-
-          return () => {
-            subscription.unsubscribe()
-          }
-        })(),
-      )
-
-      for (const subscription of subscriptions) {
-        this.unsubscribers.push(subscription())
-      }
-
+      this.subscriptions = subscriptions
       this.actors = actors
 
       this.editor = editor
@@ -198,6 +178,26 @@ export class PortableTextEditor extends Component<
       return
     }
 
+    for (const subscription of this.subscriptions) {
+      this.unsubscribers.push(subscription())
+    }
+
+    const relayActorSubscription = this.actors.relayActor.on('*', (event) => {
+      const change = eventToChange(event)
+
+      if (!change) {
+        return
+      }
+
+      if (!this.props.editor) {
+        this.props.onChange(change)
+      }
+
+      this.change$.next(change)
+    })
+
+    this.unsubscribers.push(relayActorSubscription.unsubscribe)
+
     this.actors.editorActor.start()
     this.actors.mutationActor.start()
     this.actors.relayActor.start()

package/src/editor/create-slate-editor.tsx

@@ -1,6 +1,8 @@
 import {createEditor, type Descendant} from 'slate'
 import {withReact} from 'slate-react'
+import {createPlaceholderBlock} from '../internal-utils/create-placeholder-block'
 import {debugWithName} from '../internal-utils/debug'
+import {toSlateValue} from '../internal-utils/values'
 import {
   KEY_TO_SLATE_ELEMENT,
   KEY_TO_VALUE_ELEMENT,
@@ -35,7 +37,13 @@ export function createSlateEditor(config: SlateEditorConfig): SlateEditor {
   KEY_TO_VALUE_ELEMENT.set(instance, {})
   KEY_TO_SLATE_ELEMENT.set(instance, {})
 
-  const initialValue = [instance.pteCreateTextBlock({decorators: []})]
+  instance.value = [
+    createPlaceholderBlock(config.editorActor.getSnapshot().context),
+  ]
+
+  const initialValue = toSlateValue(instance.value, {
+    schemaTypes: config.editorActor.getSnapshot().context.schema,
+  })
 
   const slateEditor: SlateEditor = {
     instance,

package/src/editor/editor-selector.ts

@@ -1,6 +1,5 @@
 import {useSelector} from '@xstate/react'
 import type {Editor} from '../editor'
-import {slateChildrenToBlocks} from '../internal-utils/slate-children-to-blocks'
 import type {PortableTextSlateEditor} from '../types/editor'
 import type {InternalEditor} from './create-editor'
 import type {EditorActor} from './editor-machine'
@@ -78,10 +77,7 @@ export function getEditorSnapshot({
       readOnly: editorActorSnapshot.matches({'edit mode': 'read only'}),
       schema: editorActorSnapshot.context.schema,
       selection: editorActorSnapshot.context.selection,
-      value: slateChildrenToBlocks(
-        editorActorSnapshot.context.schema,
-        slateEditorInstance.children,
-      ),
+      value: slateEditorInstance.value,
     },
     beta: {
       hasTag: (tag) => editorActorSnapshot.hasTag(tag),

package/src/editor/editor-snapshot.ts

@@ -1,7 +1,6 @@
 import type {PortableTextBlock} from '@sanity/types'
 import type {Converter} from '../converters/converter.types'
 import type {EventPosition} from '../internal-utils/event-position'
-import {slateChildrenToBlocks} from '../internal-utils/slate-children-to-blocks'
 import {slateRangeToSelection} from '../internal-utils/slate-utils'
 import type {EditorSelection, PortableTextSlateEditor} from '../types/editor'
 import type {HasTag} from './editor-machine'
@@ -61,7 +60,6 @@ export function createEditorSnapshot({
       }
     | undefined
 }) {
-  const value = slateChildrenToBlocks(schema, editor.children)
   const selection = editor.selection
     ? slateRangeToSelection({
         schema,
@@ -80,7 +78,7 @@ export function createEditorSnapshot({
     readOnly,
     schema,
     selection,
-    value,
+    value: editor.value,
   } satisfies EditorContext
 
   return {

package/src/editor/plugins/createWithPatches.ts

@@ -1,19 +1,17 @@
 import {insert, setIfMissing, unset, type Patch} from '@portabletext/patches'
-import {
-  Editor,
-  type Descendant,
-  type InsertNodeOperation,
-  type InsertTextOperation,
-  type MergeNodeOperation,
-  type MoveNodeOperation,
-  type Operation,
-  type RemoveNodeOperation,
-  type RemoveTextOperation,
-  type SetNodeOperation,
-  type SplitNodeOperation,
-} from 'slate'
+import {Editor, type Descendant, type Operation} from 'slate'
 import {createApplyPatch} from '../../internal-utils/applyPatch'
 import {debugWithName} from '../../internal-utils/debug'
+import {
+  insertNodePatch,
+  insertTextPatch,
+  mergeNodePatch,
+  moveNodePatch,
+  removeNodePatch,
+  removeTextPatch,
+  setNodePatch,
+  splitNodePatch,
+} from '../../internal-utils/operation-to-patches'
 import {fromSlateValue, isEqualToEmptyEditor} from '../../internal-utils/values'
 import {
   IS_PROCESSING_REMOTE_CHANGES,
@@ -34,60 +32,15 @@ import {withoutSaving} from './createWithUndoRedo'
 const debug = debugWithName('plugin:withPatches')
 const debugVerbose = false
 
-export interface PatchFunctions {
-  insertNodePatch: (
-    editor: PortableTextSlateEditor,
-    operation: InsertNodeOperation,
-    previousChildren: Descendant[],
-  ) => Patch[]
-  insertTextPatch: (
-    editor: PortableTextSlateEditor,
-    operation: InsertTextOperation,
-    previousChildren: Descendant[],
-  ) => Patch[]
-  mergeNodePatch: (
-    editor: PortableTextSlateEditor,
-    operation: MergeNodeOperation,
-    previousChildren: Descendant[],
-  ) => Patch[]
-  moveNodePatch: (
-    editor: PortableTextSlateEditor,
-    operation: MoveNodeOperation,
-    previousChildren: Descendant[],
-  ) => Patch[]
-  removeNodePatch: (
-    editor: PortableTextSlateEditor,
-    operation: RemoveNodeOperation,
-    previousChildren: Descendant[],
-  ) => Patch[]
-  removeTextPatch: (
-    editor: PortableTextSlateEditor,
-    operation: RemoveTextOperation,
-    previousChildren: Descendant[],
-  ) => Patch[]
-  setNodePatch: (
-    editor: PortableTextSlateEditor,
-    operation: SetNodeOperation,
-    previousChildren: Descendant[],
-  ) => Patch[]
-  splitNodePatch: (
-    editor: PortableTextSlateEditor,
-    operation: SplitNodeOperation,
-    previousChildren: Descendant[],
-  ) => Patch[]
-}
-
 interface Options {
   editorActor: EditorActor
   relayActor: RelayActor
-  patchFunctions: PatchFunctions
   subscriptions: Array<() => () => void>
 }
 
 export function createWithPatches({
   editorActor,
   relayActor,
-  patchFunctions,
   subscriptions,
 }: Options): (editor: PortableTextSlateEditor) => PortableTextSlateEditor {
   // The previous editor children are needed to figure out the _key of deleted nodes
@@ -197,8 +150,9 @@ export function createWithPatches({
         case 'insert_text':
           patches = [
             ...patches,
-            ...patchFunctions.insertTextPatch(
-              editor,
+            ...insertTextPatch(
+              editorActor.getSnapshot().context.schema,
+              editor.children,
               operation,
               previousChildren,
             ),
@@ -207,8 +161,9 @@ export function createWithPatches({
         case 'remove_text':
           patches = [
             ...patches,
-            ...patchFunctions.removeTextPatch(
-              editor,
+            ...removeTextPatch(
+              editorActor.getSnapshot().context.schema,
+              editor.children,
               operation,
               previousChildren,
             ),
@@ -217,18 +172,19 @@ export function createWithPatches({
         case 'remove_node':
           patches = [
             ...patches,
-            ...patchFunctions.removeNodePatch(
-              editor,
-              operation,
+            ...removeNodePatch(
+              editorActor.getSnapshot().context.schema,
               previousChildren,
+              operation,
             ),
           ]
           break
         case 'split_node':
           patches = [
             ...patches,
-            ...patchFunctions.splitNodePatch(
-              editor,
+            ...splitNodePatch(
+              editorActor.getSnapshot().context.schema,
+              editor.children,
               operation,
               previousChildren,
             ),
@@ -237,8 +193,9 @@ export function createWithPatches({
         case 'insert_node':
           patches = [
             ...patches,
-            ...patchFunctions.insertNodePatch(
-              editor,
+            ...insertNodePatch(
+              editorActor.getSnapshot().context.schema,
+              editor.children,
               operation,
               previousChildren,
             ),
@@ -247,14 +204,19 @@ export function createWithPatches({
         case 'set_node':
           patches = [
             ...patches,
-            ...patchFunctions.setNodePatch(editor, operation, previousChildren),
+            ...setNodePatch(
+              editorActor.getSnapshot().context.schema,
+              editor.children,
+              operation,
+            ),
           ]
           break
         case 'merge_node':
           patches = [
             ...patches,
-            ...patchFunctions.mergeNodePatch(
-              editor,
+            ...mergeNodePatch(
+              editorActor.getSnapshot().context.schema,
+              editor.children,
               operation,
               previousChildren,
             ),
@@ -263,10 +225,10 @@ export function createWithPatches({
         case 'move_node':
           patches = [
             ...patches,
-            ...patchFunctions.moveNodePatch(
-              editor,
-              operation,
+            ...moveNodePatch(
+              editorActor.getSnapshot().context.schema,
               previousChildren,
+              operation,
             ),
           ]
           break

package/src/editor/plugins/slate-plugin.update-value.ts

@@ -0,0 +1,30 @@
+import {applyOperationToPortableText} from '../../internal-utils/apply-operation-to-portable-text'
+import type {PortableTextSlateEditor} from '../../types/editor'
+import type {EditorContext} from '../editor-snapshot'
+
+export function pluginUpdateValue(
+  context: Pick<EditorContext, 'keyGenerator' | 'schema'>,
+  editor: PortableTextSlateEditor,
+) {
+  const {apply} = editor
+
+  editor.apply = (operation) => {
+    if (operation.type === 'set_selection') {
+      apply(operation)
+      return
+    }
+
+    editor.value = applyOperationToPortableText(
+      {
+        keyGenerator: context.keyGenerator,
+        schema: context.schema,
+      },
+      editor.value,
+      operation,
+    )
+
+    apply(operation)
+  }
+
+  return editor
+}

package/src/editor/plugins/with-plugins.ts

@@ -1,5 +1,4 @@
 import type {BaseOperation, Editor, Node, NodeEntry} from 'slate'
-import {createOperationToPatches} from '../../internal-utils/operationToPatches'
 import type {PortableTextSlateEditor} from '../../types/editor'
 import type {EditorActor} from '../editor-machine'
 import type {RelayActor} from '../relay-machine'
@@ -14,6 +13,7 @@ import {createWithPortableTextSelections} from './createWithPortableTextSelectio
 import {createWithSchemaTypes} from './createWithSchemaTypes'
 import {createWithUndoRedo} from './createWithUndoRedo'
 import {createWithUtils} from './createWithUtils'
+import {pluginUpdateValue} from './slate-plugin.update-value'
 
 export interface OriginalEditorFunctions {
   apply: (operation: BaseOperation) => void
@@ -33,7 +33,6 @@ export const withPlugins = <T extends Editor>(
 ): PortableTextSlateEditor => {
   const e = editor as T & PortableTextSlateEditor
   const {editorActor, relayActor} = options
-  const operationToPatches = createOperationToPatches(editorActor)
   const withObjectKeys = createWithObjectKeys(editorActor)
   const withSchemaTypes = createWithSchemaTypes({
     editorActor,
@@ -41,7 +40,6 @@ export const withPlugins = <T extends Editor>(
   const withPatches = createWithPatches({
     editorActor,
     relayActor,
-    patchFunctions: operationToPatches,
     subscriptions: options.subscriptions,
   })
   const withMaxBlocks = createWithMaxBlocks(editorActor)
@@ -71,7 +69,13 @@ export const withPlugins = <T extends Editor>(
             withPlaceholderBlock(
               withUtils(
                 withMaxBlocks(
-                  withUndoRedo(withPatches(withPortableTextSelections(e))),
+                  withUndoRedo(
+                    withPatches(
+                      withPortableTextSelections(
+                        pluginUpdateValue(editorActor.getSnapshot().context, e),
+                      ),
+                    ),
+                  ),
                 ),
               ),
             ),

package/src/editor/relay-machine.ts

@@ -13,6 +13,9 @@ export type EditorEmittedEvent =
       event: FocusEvent<HTMLDivElement, Element>
     }
   | {
+      /**
+       * @deprecated
+       */
       type: 'done loading'
     }
   | {
@@ -29,6 +32,9 @@ export type EditorEmittedEvent =
       value: Array<PortableTextBlock> | undefined
     }
   | {
+      /**
+       * @deprecated
+       */
       type: 'loading'
     }
   | MutationEvent
@@ -79,6 +85,9 @@ export type PatchEvent = {
 }
 
 export type UnsetEvent = {
+  /**
+   * @deprecated Use `'patch'` events instead
+   */
   type: 'unset'
   previousValue: Array<PortableTextBlock>
 }