@portabletext/editor 1.1.1 → 1.1.3

package/src/editor/plugins/createWithPortableTextMarkModel.ts

@@ -7,19 +7,8 @@
 import {isPortableTextBlock, isPortableTextSpan} from '@portabletext/toolkit'
 import type {PortableTextObject} from '@sanity/types'
 import {isEqual, uniq} from 'lodash'
-import type {Subject} from 'rxjs'
-import {
-  Editor,
-  Element,
-  Node,
-  Path,
-  Range,
-  Text,
-  Transforms,
-  type Descendant,
-} from 'slate'
+import {Editor, Element, Node, Path, Range, Text, Transforms} from 'slate'
 import type {
-  EditorChange,
   PortableTextMemberSchemaTypes,
   PortableTextSlateEditor,
 } from '../../types/editor'
@@ -27,12 +16,13 @@ import {debugWithName} from '../../utils/debug'
 import {toPortableTextRange} from '../../utils/ranges'
 import {isChangingRemotely} from '../../utils/withChanges'
 import {isRedoing, isUndoing} from '../../utils/withUndoRedo'
+import type {EditorActor} from '../editor-machine'
 
 const debug = debugWithName('plugin:withPortableTextMarkModel')
 
 export function createWithPortableTextMarkModel(
+  editorActor: EditorActor,
   types: PortableTextMemberSchemaTypes,
-  change$: Subject<EditorChange>,
   keyGenerator: () => string,
 ): (editor: PortableTextSlateEditor) => PortableTextSlateEditor {
   return function withPortableTextMarkModel(editor: PortableTextSlateEditor) {
@@ -59,7 +49,7 @@ export function createWithPortableTextMarkModel(
         editor.selection,
         types,
       )
-      change$.next({type: 'selection', selection: ptRange})
+      editorActor.send({type: 'selection', selection: ptRange})
     }
 
     // Extend Slate's default normalization. Merge spans with same set of .marks when doing merge_node operations, and clean up markDefs / marks
@@ -82,10 +72,12 @@ export function createWithPortableTextMarkModel(
               JSON.stringify(child, null, 2),
               JSON.stringify(nextNode, null, 2),
             )
+            editorActor.send({type: 'normalizing'})
             Transforms.mergeNodes(editor, {
               at: [childPath[0], childPath[1] + 1],
               voids: true,
             })
+            editorActor.send({type: 'done normalizing'})
             return
           }
         }
@@ -96,7 +88,9 @@ export function createWithPortableTextMarkModel(
        */
       if (editor.isTextBlock(node) && !Array.isArray(node.markDefs)) {
         debug('Adding .markDefs to block node')
+        editorActor.send({type: 'normalizing'})
         Transforms.setNodes(editor, {markDefs: []}, {at: path})
+        editorActor.send({type: 'done normalizing'})
         return
       }
 
@@ -105,7 +99,9 @@ export function createWithPortableTextMarkModel(
        */
       if (editor.isTextSpan(node) && !Array.isArray(node.marks)) {
         debug('Adding .marks to span node')
+        editorActor.send({type: 'normalizing'})
         Transforms.setNodes(editor, {marks: []}, {at: path})
+        editorActor.send({type: 'done normalizing'})
         return
       }
 
@@ -123,11 +119,13 @@ export function createWithPortableTextMarkModel(
         if (editor.isTextBlock(block)) {
           if (node.text === '' && annotations && annotations.length > 0) {
             debug('Removing annotations from empty span node')
+            editorActor.send({type: 'normalizing'})
             Transforms.setNodes(
               editor,
               {marks: node.marks?.filter((mark) => decorators.includes(mark))},
               {at: path},
             )
+            editorActor.send({type: 'done normalizing'})
             return
           }
         }
@@ -151,6 +149,7 @@ export function createWithPortableTextMarkModel(
 
             if (orphanedAnnotations.length > 0) {
               debug('Removing orphaned annotations from span node')
+              editorActor.send({type: 'normalizing'})
               Transforms.setNodes(
                 editor,
                 {
@@ -160,6 +159,7 @@ export function createWithPortableTextMarkModel(
                 },
                 {at: childPath},
               )
+              editorActor.send({type: 'done normalizing'})
               return
             }
           }
@@ -187,6 +187,7 @@ export function createWithPortableTextMarkModel(
 
           if (orphanedAnnotations.length > 0) {
             debug('Removing orphaned annotations from span node')
+            editorActor.send({type: 'normalizing'})
             Transforms.setNodes(
               editor,
               {
@@ -196,6 +197,7 @@ export function createWithPortableTextMarkModel(
               },
               {at: path},
             )
+            editorActor.send({type: 'done normalizing'})
             return
           }
         }
@@ -216,7 +218,10 @@ export function createWithPortableTextMarkModel(
 
         if (markDefs.length !== newMarkDefs.length) {
           debug('Removing duplicate markDefs')
+          editorActor.send({type: 'normalizing'})
           Transforms.setNodes(editor, {markDefs: newMarkDefs}, {at: path})
+          editorActor.send({type: 'done normalizing'})
+          return
         }
       }
 
@@ -241,6 +246,7 @@ export function createWithPortableTextMarkModel(
         })
         if (node.markDefs && !isEqual(newMarkDefs, node.markDefs)) {
           debug('Removing markDef not in use')
+          editorActor.send({type: 'normalizing'})
           Transforms.setNodes(
             editor,
             {
@@ -248,6 +254,7 @@ export function createWithPortableTextMarkModel(
             },
             {at: path},
           )
+          editorActor.send({type: 'done normalizing'})
           return
         }
       }
@@ -274,41 +281,38 @@ export function createWithPortableTextMarkModel(
         return
       }
 
-      // Special hook before inserting text at the end of an annotation.
       if (op.type === 'insert_text') {
         const {selection} = editor
-        if (
-          selection &&
-          Range.isCollapsed(selection) &&
-          Editor.marks(editor)?.marks?.some(
-            (mark) => !decorators.includes(mark),
-          )
-        ) {
-          const [node] = Array.from(
+        const collapsedSelection = selection
+          ? Range.isCollapsed(selection)
+          : false
+
+        if (selection && collapsedSelection) {
+          const [span] = Array.from(
             Editor.nodes(editor, {
               mode: 'lowest',
               at: selection.focus,
-              match: (n) =>
-                (n as unknown as Descendant)._type === types.span.name,
+              match: (n) => editor.isTextSpan(n),
               voids: false,
             }),
-          )[0] || [undefined]
+          )[0]
+          const marks = span.marks ?? []
+          const marksWithoutAnnotations = marks.filter((mark) =>
+            decorators.includes(mark),
+          )
+          const spanHasAnnotations =
+            marks.length > marksWithoutAnnotations.length
+
           if (
-            Text.isText(node) &&
-            node.text.length === selection.focus.offset &&
-            Array.isArray(node.marks) &&
-            node.marks.length > 0
+            spanHasAnnotations &&
+            (selection.anchor.offset === 0 ||
+              span.text.length === selection.focus.offset)
           ) {
-            const marksWithoutAnnotationMarks: string[] = (
-              {
-                ...(Editor.marks(editor) || {}),
-              }.marks || []
-            ).filter((mark) => decorators.includes(mark))
             Transforms.insertNodes(editor, {
               _type: 'span',
               _key: keyGenerator(),
               text: op.text,
-              marks: marksWithoutAnnotationMarks,
+              marks: marksWithoutAnnotations,
             })
             debug('Inserting text at end of annotation')
             return

package/src/editor/plugins/createWithPortableTextSelections.ts

@@ -1,7 +1,5 @@
-import type {Subject} from 'rxjs'
 import type {BaseRange} from 'slate'
 import type {
-  EditorChange,
   EditorSelection,
   PortableTextMemberSchemaTypes,
   PortableTextSlateEditor,
@@ -12,13 +10,14 @@ import {
   type ObjectWithKeyAndType,
 } from '../../utils/ranges'
 import {SLATE_TO_PORTABLE_TEXT_RANGE} from '../../utils/weakMaps'
+import type {EditorActor} from '../editor-machine'
 
 const debug = debugWithName('plugin:withPortableTextSelections')
 const debugVerbose = debug.enabled && false
 
 // This plugin will make sure that we emit a PT selection whenever the editor has changed.
 export function createWithPortableTextSelections(
-  change$: Subject<EditorChange>,
+  editorActor: EditorActor,
   types: PortableTextMemberSchemaTypes,
 ): (editor: PortableTextSlateEditor) => PortableTextSlateEditor {
   let prevSelection: BaseRange | null = null
@@ -46,9 +45,9 @@ export function createWithPortableTextSelections(
           )
         }
         if (ptRange) {
-          change$.next({type: 'selection', selection: ptRange})
+          editorActor.send({type: 'selection', selection: ptRange})
         } else {
-          change$.next({type: 'selection', selection: null})
+          editorActor.send({type: 'selection', selection: null})
         }
       }
       prevSelection = editor.selection

package/src/editor/plugins/createWithSchemaTypes.ts

@@ -12,6 +12,7 @@ import type {
   PortableTextSlateEditor,
 } from '../../types/editor'
 import {debugWithName} from '../../utils/debug'
+import type {EditorActor} from '../editor-machine'
 
 const debug = debugWithName('plugin:withSchemaTypes')
 /**
@@ -19,9 +20,11 @@ const debug = debugWithName('plugin:withSchemaTypes')
  *
  */
 export function createWithSchemaTypes({
+  editorActor,
   schemaTypes,
   keyGenerator,
 }: {
+  editorActor: EditorActor
   schemaTypes: PortableTextMemberSchemaTypes
   keyGenerator: () => string
 }) {
@@ -71,18 +74,24 @@ export function createWithSchemaTypes({
         debug('Setting span type on text node without a type')
         const span = node as PortableTextSpan
         const key = span._key || keyGenerator()
+        editorActor.send({type: 'normalizing'})
         Transforms.setNodes(
           editor,
           {...span, _type: schemaTypes.span.name, _key: key},
           {at: path},
         )
+        editorActor.send({type: 'done normalizing'})
+        return
       }
 
       // catches cases when the children are missing keys but excludes it when the normalize is running the node as the editor object
       if (node._key === undefined && (path.length === 1 || path.length === 2)) {
         debug('Setting missing key on child node without a key')
         const key = keyGenerator()
+        editorActor.send({type: 'normalizing'})
         Transforms.setNodes(editor, {_key: key}, {at: path})
+        editorActor.send({type: 'done normalizing'})
+        return
       }
 
       normalizeNode(entry)

package/src/editor/plugins/index.ts

@@ -49,7 +49,7 @@ export const withPlugins = <T extends Editor>(
   const e = editor as T & PortableTextSlateEditor
   const {keyGenerator, portableTextEditor, patches$, readOnly, maxBlocks} =
     options
-  const {schemaTypes, change$} = portableTextEditor
+  const {editorActor, schemaTypes} = portableTextEditor
   e.subscriptions = []
   if (e.destroy) {
     e.destroy()
@@ -63,15 +63,23 @@ export const withPlugins = <T extends Editor>(
     })
   }
   const operationToPatches = createOperationToPatches(schemaTypes)
-  const withObjectKeys = createWithObjectKeys(schemaTypes, keyGenerator)
-  const withSchemaTypes = createWithSchemaTypes({schemaTypes, keyGenerator})
+  const withObjectKeys = createWithObjectKeys(
+    editorActor,
+    schemaTypes,
+    keyGenerator,
+  )
+  const withSchemaTypes = createWithSchemaTypes({
+    editorActor,
+    schemaTypes,
+    keyGenerator,
+  })
   const withEditableAPI = createWithEditableAPI(
     portableTextEditor,
     schemaTypes,
     keyGenerator,
   )
   const withPatches = createWithPatches({
-    change$,
+    editorActor,
     keyGenerator,
     patches$,
     patchFunctions: operationToPatches,
@@ -86,12 +94,14 @@ export const withPlugins = <T extends Editor>(
     blockSchemaType: schemaTypes.block,
   })
   const withPortableTextMarkModel = createWithPortableTextMarkModel(
+    editorActor,
     schemaTypes,
-    change$,
     keyGenerator,
   )
-  const withPortableTextBlockStyle =
-    createWithPortableTextBlockStyle(schemaTypes)
+  const withPortableTextBlockStyle = createWithPortableTextBlockStyle(
+    editorActor,
+    schemaTypes,
+  )
 
   const withPlaceholderBlock = createWithPlaceholderBlock()
 
@@ -103,7 +113,7 @@ export const withPlugins = <T extends Editor>(
     portableTextEditor,
   })
   const withPortableTextSelections = createWithPortableTextSelections(
-    change$,
+    editorActor,
     schemaTypes,
   )
 

package/src/index.ts

@@ -1,10 +1,16 @@
-export type {PortableTextEditableProps} from './editor/Editable'
+export {type Patch} from '@portabletext/patches'
 export {PortableTextEditable} from './editor/Editable'
+export type {PortableTextEditableProps} from './editor/Editable'
+export {
+  editorMachine,
+  type EditorActor,
+  type MutationEvent,
+  type PatchEvent,
+} from './editor/editor-machine'
 export {usePortableTextEditor} from './editor/hooks/usePortableTextEditor'
 export {defaultKeyGenerator as keyGenerator} from './editor/hooks/usePortableTextEditorKeyGenerator'
 export {usePortableTextEditorSelection} from './editor/hooks/usePortableTextEditorSelection'
-export type {PortableTextEditorProps} from './editor/PortableTextEditor'
 export {PortableTextEditor} from './editor/PortableTextEditor'
+export type {PortableTextEditorProps} from './editor/PortableTextEditor'
 export * from './types/editor'
 export * from './types/options'
-export {type Patch} from '@portabletext/patches'

package/src/utils/__tests__/dmpToOperations.test.ts

@@ -1,4 +1,3 @@
-import {describe, expect, test} from '@jest/globals'
 import type {DiffMatchPatch} from '@portabletext/patches'
 import {makeDiff, makePatches, stringifyPatches} from '@sanity/diff-match-patch'
 import {
@@ -10,6 +9,7 @@ import {
   type PortableTextTextBlock,
 } from '@sanity/types'
 import type {Descendant, Operation} from 'slate'
+import {describe, expect, test} from 'vitest'
 import type {PortableTextSlateEditor} from '../../types/editor'
 import {diffMatchPatch} from '../applyPatch'
 

package/src/utils/__tests__/operationToPatches.test.ts

@@ -1,6 +1,6 @@
-import {beforeEach, describe, expect, it} from '@jest/globals'
 import type {PortableTextTextBlock} from '@sanity/types'
 import {createEditor, type Descendant} from 'slate'
+import {beforeEach, describe, expect, it} from 'vitest'
 import {PortableTextEditor, type PortableTextEditorProps} from '../..'
 import {schemaType} from '../../editor/__tests__/PortableTextEditorTester'
 import {defaultKeyGenerator} from '../../editor/hooks/usePortableTextEditorKeyGenerator'
@@ -61,34 +61,34 @@ describe('operationToPatches', () => {
         createDefaultValue(),
       ),
     ).toMatchInlineSnapshot(`
-      Array [
-        Object {
-          "items": Array [
-            Object {
+      [
+        {
+          "items": [
+            {
               "_key": "773866318fa8",
               "_type": "someObject",
               "title": "The Object",
             },
           ],
-          "path": Array [
-            Object {
+          "path": [
+            {
               "_key": "1f2e64b47787",
             },
             "children",
-            Object {
+            {
               "_key": "c130395c640c",
             },
           ],
           "position": "after",
           "type": "insert",
         },
-        Object {
-          "path": Array [
-            Object {
+        {
+          "path": [
+            {
               "_key": "1f2e64b47787",
             },
             "children",
-            Object {
+            {
               "_key": "c130395c640c",
             },
             "text",
@@ -118,17 +118,17 @@ describe('operationToPatches', () => {
         createDefaultValue(),
       ),
     ).toMatchInlineSnapshot(`
-      Array [
-        Object {
-          "items": Array [
-            Object {
+      [
+        {
+          "items": [
+            {
               "_key": "c130395c640c",
               "_type": "someObject",
               "title": "The Object",
             },
           ],
-          "path": Array [
-            Object {
+          "path": [
+            {
               "_key": "1f2e64b47787",
             },
           ],
@@ -160,20 +160,20 @@ describe('operationToPatches', () => {
         [],
       ),
     ).toMatchInlineSnapshot(`
-      Array [
-        Object {
-          "path": Array [],
+      [
+        {
+          "path": [],
           "type": "setIfMissing",
-          "value": Array [],
+          "value": [],
         },
-        Object {
-          "items": Array [
-            Object {
+        {
+          "items": [
+            {
               "_key": "c130395c640c",
               "_type": "someObject",
             },
           ],
-          "path": Array [
+          "path": [
             0,
           ],
           "position": "before",
@@ -202,21 +202,21 @@ describe('operationToPatches', () => {
         createDefaultValue(),
       ),
     ).toMatchInlineSnapshot(`
-      Array [
-        Object {
-          "items": Array [
-            Object {
+      [
+        {
+          "items": [
+            {
               "_key": "c130395c640c",
               "_type": "someObject",
               "title": "The Object",
             },
           ],
-          "path": Array [
-            Object {
+          "path": [
+            {
               "_key": "1f2e64b47787",
             },
             "children",
-            Object {
+            {
               "_key": "fd9b4a4e6c0b",
             },
           ],
@@ -243,14 +243,14 @@ describe('operationToPatches', () => {
         createDefaultValue(),
       ),
     ).toMatchInlineSnapshot(`
-      Array [
-        Object {
-          "path": Array [
-            Object {
+      [
+        {
+          "path": [
+            {
               "_key": "1f2e64b47787",
             },
             "children",
-            Object {
+            {
               "_key": "fd9b4a4e6c0b",
             },
             "text",
@@ -280,14 +280,14 @@ describe('operationToPatches', () => {
         before,
       ),
     ).toMatchInlineSnapshot(`
-      Array [
-        Object {
-          "path": Array [
-            Object {
+      [
+        {
+          "path": [
+            {
               "_key": "1f2e64b47787",
             },
             "children",
-            Object {
+            {
               "_key": "fd9b4a4e6c0b",
             },
             "text",
@@ -320,14 +320,14 @@ describe('operationToPatches', () => {
         createDefaultValue(),
       ),
     ).toMatchInlineSnapshot(`
-      Array [
-        Object {
-          "path": Array [
-            Object {
+      [
+        {
+          "path": [
+            {
               "_key": "1f2e64b47787",
             },
             "children",
-            Object {
+            {
               "_key": "773866318fa8",
             },
           ],
@@ -351,10 +351,10 @@ describe('operationToPatches', () => {
         val,
       ),
     ).toMatchInlineSnapshot(`
-      Array [
-        Object {
-          "path": Array [
-            Object {
+      [
+        {
+          "path": [
+            {
               "_key": "1f2e64b47787",
             },
           ],
@@ -389,14 +389,14 @@ describe('operationToPatches', () => {
         val,
       ),
     ).toMatchInlineSnapshot(`
-      Array [
-        Object {
-          "path": Array [
-            Object {
+      [
+        {
+          "path": [
+            {
               "_key": "1f2e64b47787",
             },
             "children",
-            Object {
+            {
               "_key": "fd9b4a4e6c0b",
             },
             "text",
@@ -404,13 +404,13 @@ describe('operationToPatches', () => {
           "type": "set",
           "value": "1234",
         },
-        Object {
-          "path": Array [
-            Object {
+        {
+          "path": [
+            {
               "_key": "1f2e64b47787",
             },
             "children",
-            Object {
+            {
               "_key": "r4wr323432",
             },
           ],