@portabletext/editor 1.1.1 → 1.1.2

package/src/editor/hooks/useSyncValue.test.tsx

@@ -1,6 +1,6 @@
-import {describe, expect, it, jest} from '@jest/globals'
 import {render, waitFor} from '@testing-library/react'
 import {createRef, type RefObject} from 'react'
+import {describe, expect, it, vi} from 'vitest'
 import {
   PortableTextEditorTester,
   schemaType,
@@ -27,7 +27,7 @@ const initialValue = [
 describe('useSyncValue', () => {
   it('updates span text', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
     const syncedValue = [
       {
         _key: '77071c3af231',
@@ -70,7 +70,7 @@ describe('useSyncValue', () => {
   })
   it('replaces span nodes with different keys inside the same children array', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
     const syncedValue = [
       {
         _key: '77071c3af231',
@@ -107,19 +107,19 @@ describe('useSyncValue', () => {
       if (editorRef.current) {
         expect(PortableTextEditor.getValue(editorRef.current))
           .toMatchInlineSnapshot(`
-          Array [
-            Object {
+          [
+            {
               "_key": "77071c3af231",
               "_type": "myTestBlockType",
-              "children": Array [
-                Object {
+              "children": [
+                {
                   "_key": "c001f0e92c1f0__NEW_KEY_YA!",
                   "_type": "span",
-                  "marks": Array [],
+                  "marks": [],
                   "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. ",
                 },
               ],
-              "markDefs": Array [],
+              "markDefs": [],
               "style": "normal",
             },
           ]

package/src/editor/hooks/useSyncValue.ts

@@ -3,7 +3,7 @@ import {debounce, isEqual} from 'lodash'
 import {useCallback, useMemo, useRef} from 'react'
 import {Editor, Text, Transforms, type Descendant, type Node} from 'slate'
 import {useSlate} from 'slate-react'
-import type {EditorChange, PortableTextSlateEditor} from '../../types/editor'
+import type {PortableTextSlateEditor} from '../../types/editor'
 import {debugWithName} from '../../utils/debug'
 import {validateValue} from '../../utils/validateValue'
 import {toSlateValue, VOID_CHILD_KEY} from '../../utils/values'
@@ -13,6 +13,7 @@ import {
   withRemoteChanges,
 } from '../../utils/withChanges'
 import {withoutPatching} from '../../utils/withoutPatching'
+import type {EditorActor} from '../editor-machine'
 import {withoutSaving} from '../plugins/createWithUndoRedo'
 import type {PortableTextEditor} from '../PortableTextEditor'
 
@@ -22,8 +23,8 @@ const debug = debugWithName('hook:useSyncValue')
  * @internal
  */
 export interface UseSyncValueProps {
+  editorActor: EditorActor
   keyGenerator: () => string
-  onChange: (change: EditorChange) => void
   portableTextEditor: PortableTextEditor
   readOnly: boolean
 }
@@ -51,8 +52,8 @@ export function useSyncValue(
   value: PortableTextBlock[] | undefined,
   userCallbackFn?: () => void,
 ) => void {
-  const {portableTextEditor, readOnly, keyGenerator} = props
-  const {change$, schemaTypes} = portableTextEditor
+  const {editorActor, portableTextEditor, readOnly, keyGenerator} = props
+  const {schemaTypes} = portableTextEditor
   const previousValue = useRef<PortableTextBlock[] | undefined>()
   const slateEditor = useSlate()
   const updateValueFunctionRef =
@@ -180,7 +181,7 @@ export function useSyncValue(
                             `${validation.resolution.action} for block with _key '${validationValue[0]._key}'. ${validation.resolution?.description}`,
                           )
                           validation.resolution.patches.forEach((patch) => {
-                            change$.next({type: 'patch', patch})
+                            editorActor.send({type: 'patch', patch})
                           })
                         }
                       }
@@ -208,8 +209,8 @@ export function useSyncValue(
                         }
                         isChanged = true
                       } else {
-                        change$.next({
-                          type: 'invalidValue',
+                        editorActor.send({
+                          type: 'invalid value',
                           resolution: validation.resolution,
                           value,
                         })
@@ -237,8 +238,8 @@ export function useSyncValue(
                         })
                       } else {
                         debug('Invalid', validation)
-                        change$.next({
-                          type: 'invalidValue',
+                        editorActor.send({
+                          type: 'invalid value',
                           resolution: validation.resolution,
                           value,
                         })
@@ -263,8 +264,8 @@ export function useSyncValue(
           slateEditor.onChange()
         } catch (err) {
           console.error(err)
-          change$.next({
-            type: 'invalidValue',
+          editorActor.send({
+            type: 'invalid value',
             resolution: null,
             value,
           })
@@ -277,7 +278,7 @@ export function useSyncValue(
           })
           slateEditor.onChange()
         }
-        change$.next({type: 'value', value})
+        editorActor.send({type: 'value changed', value})
       } else {
         debug('Server value and editor value is equal, no need to sync.')
       }
@@ -286,7 +287,7 @@ export function useSyncValue(
     updateValueFunctionRef.current = updateFunction
     return updateFunction
   }, [
-    change$,
+    editorActor,
     keyGenerator,
     portableTextEditor,
     readOnly,

package/src/editor/plugins/__tests__/createWithInsertData.test.tsx

@@ -1,6 +1,6 @@
-import {describe, expect, it} from '@jest/globals'
 import {isPortableTextSpan, isPortableTextTextBlock} from '@sanity/types'
 import type {Descendant} from 'slate'
+import {describe, expect, it} from 'vitest'
 import {exportedForTesting} from '../createWithInsertData'
 
 const initialValue = [

package/src/editor/plugins/__tests__/withEditableAPIDelete.test.tsx

@@ -1,6 +1,6 @@
-import {describe, expect, it, jest} from '@jest/globals'
 import {render, waitFor} from '@testing-library/react'
 import {createRef, type RefObject} from 'react'
+import {describe, expect, it, vi} from 'vitest'
 import {
   PortableTextEditorTester,
   schemaType,
@@ -46,7 +46,7 @@ const initialSelection = {
 describe('plugin:withEditableAPI: .delete()', () => {
   it('deletes block', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
     render(
       <PortableTextEditorTester
         onChange={onChange}
@@ -77,19 +77,19 @@ describe('plugin:withEditableAPI: .delete()', () => {
         )
         expect(PortableTextEditor.getValue(editorRef.current))
           .toMatchInlineSnapshot(`
-          Array [
-            Object {
+          [
+            {
               "_key": "a",
               "_type": "myTestBlockType",
-              "children": Array [
-                Object {
+              "children": [
+                {
                   "_key": "a1",
                   "_type": "span",
-                  "marks": Array [],
+                  "marks": [],
                   "text": "Block A",
                 },
               ],
-              "markDefs": Array [],
+              "markDefs": [],
               "style": "normal",
             },
           ]
@@ -100,7 +100,7 @@ describe('plugin:withEditableAPI: .delete()', () => {
 
   it('deletes all the blocks, but leaves a placeholder block', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
     render(
       <PortableTextEditorTester
         onChange={onChange}
@@ -135,19 +135,19 @@ describe('plugin:withEditableAPI: .delete()', () => {
         // New keys here confirms that a placeholder block has been created
         expect(PortableTextEditor.getValue(editorRef.current))
           .toMatchInlineSnapshot(`
-          Array [
-            Object {
+          [
+            {
               "_key": "1",
               "_type": "myTestBlockType",
-              "children": Array [
-                Object {
+              "children": [
+                {
                   "_key": "2",
                   "_type": "span",
-                  "marks": Array [],
+                  "marks": [],
                   "text": "",
                 },
               ],
-              "markDefs": Array [],
+              "markDefs": [],
               "style": "normal",
             },
           ]
@@ -158,7 +158,7 @@ describe('plugin:withEditableAPI: .delete()', () => {
 
   it('deletes children', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
 
     render(
       <PortableTextEditorTester
@@ -202,33 +202,33 @@ describe('plugin:withEditableAPI: .delete()', () => {
       if (editorRef.current) {
         expect(PortableTextEditor.getValue(editorRef.current))
           .toMatchInlineSnapshot(`
-                  Array [
-                    Object {
+                  [
+                    {
                       "_key": "a",
                       "_type": "myTestBlockType",
-                      "children": Array [
-                        Object {
+                      "children": [
+                        {
                           "_key": "a1",
                           "_type": "span",
-                          "marks": Array [],
+                          "marks": [],
                           "text": "Block A",
                         },
                       ],
-                      "markDefs": Array [],
+                      "markDefs": [],
                       "style": "normal",
                     },
-                    Object {
+                    {
                       "_key": "b",
                       "_type": "myTestBlockType",
-                      "children": Array [
-                        Object {
+                      "children": [
+                        {
                           "_key": "1",
                           "_type": "span",
-                          "marks": Array [],
+                          "marks": [],
                           "text": "",
                         },
                       ],
-                      "markDefs": Array [],
+                      "markDefs": [],
                       "style": "normal",
                     },
                   ]
@@ -239,7 +239,7 @@ describe('plugin:withEditableAPI: .delete()', () => {
 
   it('deletes selected', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
 
     render(
       <PortableTextEditorTester

package/src/editor/plugins/__tests__/withEditableAPIGetFragment.test.tsx

@@ -1,7 +1,7 @@
-import {describe, expect, it, jest} from '@jest/globals'
 import {isPortableTextTextBlock} from '@sanity/types'
 import {render, waitFor} from '@testing-library/react'
 import {createRef, type RefObject} from 'react'
+import {describe, expect, it, vi} from 'vitest'
 import {
   PortableTextEditorTester,
   schemaType,
@@ -52,7 +52,7 @@ const initialValue = [
 describe('plugin:withEditableAPI: .getFragment()', () => {
   it('can get a Portable Text fragment of the current selection in a single block', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
 
     render(
       <PortableTextEditorTester
@@ -93,7 +93,7 @@ describe('plugin:withEditableAPI: .getFragment()', () => {
 
   it('can get a Portable Text fragment of the current selection in multiple blocks', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
 
     render(
       <PortableTextEditorTester
@@ -124,43 +124,43 @@ describe('plugin:withEditableAPI: .getFragment()', () => {
         PortableTextEditor.select(editorRef.current, initialSelection)
         const fragment = PortableTextEditor.getFragment(editorRef.current)
         expect(fragment).toMatchInlineSnapshot(`
-          Array [
-            Object {
+          [
+            {
               "_key": "a",
               "_type": "myTestBlockType",
-              "children": Array [
-                Object {
+              "children": [
+                {
                   "_key": "a1",
                   "_type": "span",
-                  "marks": Array [],
+                  "marks": [],
                   "text": "A",
                 },
               ],
-              "markDefs": Array [],
+              "markDefs": [],
               "style": "normal",
             },
-            Object {
+            {
               "_key": "b",
               "_type": "myTestBlockType",
-              "children": Array [
-                Object {
+              "children": [
+                {
                   "_key": "b1",
                   "_type": "span",
-                  "marks": Array [],
+                  "marks": [],
                   "text": "Block B ",
                 },
-                Object {
+                {
                   "_key": "b2",
                   "_type": "someObject",
                 },
-                Object {
+                {
                   "_key": "b3",
                   "_type": "span",
-                  "marks": Array [],
+                  "marks": [],
                   "text": " contains",
                 },
               ],
-              "markDefs": Array [],
+              "markDefs": [],
               "style": "normal",
             },
           ]

package/src/editor/plugins/__tests__/withEditableAPIInsert.test.tsx

@@ -1,6 +1,6 @@
-import {describe, expect, it, jest} from '@jest/globals'
 import {render, waitFor} from '@testing-library/react'
 import {createRef, type RefObject} from 'react'
+import {describe, expect, it, vi} from 'vitest'
 import {
   PortableTextEditorTester,
   schemaType,
@@ -58,7 +58,7 @@ const emptyBlockSelection = {
 describe('plugin:withEditableAPI: .insertChild()', () => {
   it('inserts child nodes correctly', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
 
     render(
       <PortableTextEditorTester
@@ -200,7 +200,7 @@ describe('plugin:withEditableAPI: .insertBlock()', () => {
         style: 'normal',
       },
     ]
-    const onChange = jest.fn()
+    const onChange = vi.fn()
 
     render(
       <PortableTextEditorTester
@@ -248,7 +248,7 @@ describe('plugin:withEditableAPI: .insertBlock()', () => {
 
   it('should not add empty blank blocks: non-empty block', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
 
     render(
       <PortableTextEditorTester
@@ -300,7 +300,7 @@ describe('plugin:withEditableAPI: .insertBlock()', () => {
 
   it('should be inserted before if focus is on start of block', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
 
     render(
       <PortableTextEditorTester
@@ -358,7 +358,7 @@ describe('plugin:withEditableAPI: .insertBlock()', () => {
       ...initialValue,
       {_key: 'b', _type: 'someObject', color: 'red'},
     ]
-    const onChange = jest.fn()
+    const onChange = vi.fn()
 
     render(
       <PortableTextEditorTester
@@ -414,7 +414,7 @@ describe('plugin:withEditableAPI: .insertBlock()', () => {
       ...initialValue,
       {_key: 'b', _type: 'someObject', color: 'red'},
     ]
-    const onChange = jest.fn()
+    const onChange = vi.fn()
 
     render(
       <PortableTextEditorTester
@@ -465,7 +465,7 @@ describe('plugin:withEditableAPI: .insertBlock()', () => {
   it('should not add empty blank blocks: in new empty text block', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
     const value = [...initialValue, ...emptyTextBlock]
-    const onChange = jest.fn()
+    const onChange = vi.fn()
 
     render(
       <PortableTextEditorTester

package/src/editor/plugins/__tests__/withEditableAPISelectionsOverlapping.test.tsx

@@ -1,7 +1,7 @@
-import {describe, expect, it, jest} from '@jest/globals'
 import type {PortableTextBlock} from '@sanity/types'
 import {render, waitFor} from '@testing-library/react'
 import {createRef, type RefObject} from 'react'
+import {describe, expect, it, vi} from 'vitest'
 import {
   PortableTextEditorTester,
   schemaType,
@@ -28,7 +28,7 @@ const INITIAL_VALUE: PortableTextBlock[] = [
 describe('plugin:withEditableAPI: .isSelectionsOverlapping', () => {
   it('returns true if the selections are partially overlapping', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
     render(
       <PortableTextEditorTester
         onChange={onChange}
@@ -62,7 +62,7 @@ describe('plugin:withEditableAPI: .isSelectionsOverlapping', () => {
 
   it('returns true if the selections are fully overlapping', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
     render(
       <PortableTextEditorTester
         onChange={onChange}
@@ -96,7 +96,7 @@ describe('plugin:withEditableAPI: .isSelectionsOverlapping', () => {
 
   it('return true if selection is fully inside another selection', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
     render(
       <PortableTextEditorTester
         onChange={onChange}
@@ -130,7 +130,7 @@ describe('plugin:withEditableAPI: .isSelectionsOverlapping', () => {
 
   it('returns false if the selections are not overlapping', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
-    const onChange = jest.fn()
+    const onChange = vi.fn()
     render(
       <PortableTextEditorTester
         onChange={onChange}

package/src/editor/plugins/__tests__/withPortableTextLists.test.tsx

@@ -1,6 +1,6 @@
-import {describe, expect, it, jest} from '@jest/globals'
 import {render, waitFor} from '@testing-library/react'
 import {createRef, type RefObject} from 'react'
+import {describe, expect, it, vi} from 'vitest'
 import {
   PortableTextEditorTester,
   schemaType,
@@ -42,7 +42,7 @@ describe('plugin:withPortableTextLists', () => {
         style: 'normal',
       },
     ]
-    const onChange = jest.fn()
+    const onChange = vi.fn()
     await waitFor(() => {
       render(
         <PortableTextEditorTester