@portabletext/editor 1.49.7 → 1.49.8

package/src/editor/__tests__/pteWarningsSelfSolving.test.tsx

@@ -1,364 +0,0 @@
-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 {createTestKeyGenerator} from '../../internal-utils/test-key-generator'
-import {PortableTextEditor} from '../PortableTextEditor'
-import {PortableTextEditorTester, schemaType} from './PortableTextEditorTester'
-
-describe('when PTE would display warnings, instead it self solves', () => {
-  it('when child at index is missing required _key in block with _key', async () => {
-    const editorRef: RefObject<PortableTextEditor | null> = createRef()
-    const initialValue = [
-      {
-        _key: 'abc',
-        _type: 'myTestBlockType',
-        children: [
-          {
-            _type: 'span',
-            marks: [],
-            text: 'Hello with a new key',
-          },
-        ],
-        markDefs: [],
-        style: 'normal',
-      },
-    ]
-
-    const onChange = vi.fn()
-    render(
-      <PortableTextEditorTester
-        keyGenerator={createTestKeyGenerator()}
-        onChange={onChange}
-        ref={editorRef}
-        schemaType={schemaType}
-        value={initialValue}
-      />,
-    )
-    await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({
-        type: 'value',
-        value: initialValue,
-      })
-      expect(onChange).toHaveBeenCalledWith({type: 'ready'})
-    })
-    await waitFor(() => {
-      if (editorRef.current) {
-        expect(PortableTextEditor.getValue(editorRef.current)).toEqual([
-          {
-            _key: 'abc',
-            _type: 'myTestBlockType',
-            children: [
-              {
-                _key: 'k3',
-                _type: 'span',
-                text: 'Hello with a new key',
-                marks: [],
-              },
-            ],
-            markDefs: [],
-            style: 'normal',
-          },
-        ])
-      }
-    })
-  })
-
-  it('self-solves missing .markDefs', async () => {
-    const editorRef: RefObject<PortableTextEditor | null> = createRef()
-    const initialValue = [
-      {
-        _key: 'abc',
-        _type: 'myTestBlockType',
-        children: [
-          {
-            _key: 'def',
-            _type: 'span',
-            marks: [],
-            text: 'No markDefs',
-          },
-        ],
-        style: 'normal',
-      },
-    ]
-
-    const onChange = vi.fn()
-    render(
-      <PortableTextEditorTester
-        keyGenerator={createTestKeyGenerator()}
-        onChange={onChange}
-        ref={editorRef}
-        schemaType={schemaType}
-        value={initialValue}
-      />,
-    )
-    await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({
-        type: 'value',
-        value: initialValue,
-      })
-      expect(onChange).toHaveBeenCalledWith({type: 'ready'})
-    })
-    await waitFor(() => {
-      if (editorRef.current) {
-        PortableTextEditor.focus(editorRef.current)
-        expect(PortableTextEditor.getValue(editorRef.current)).toEqual([
-          {
-            _key: 'abc',
-            _type: 'myTestBlockType',
-            children: [
-              {
-                _key: 'def',
-                _type: 'span',
-                text: 'No markDefs',
-                marks: [],
-              },
-            ],
-            markDefs: [],
-            style: 'normal',
-          },
-        ])
-      }
-    })
-  })
-
-  it('adds missing .children', async () => {
-    const editorRef: RefObject<PortableTextEditor | null> = createRef()
-    const initialValue = [
-      {
-        _key: 'abc',
-        _type: 'myTestBlockType',
-        style: 'normal',
-        markDefs: [],
-      },
-      {
-        _key: 'def',
-        _type: 'myTestBlockType',
-        style: 'normal',
-        children: [],
-        markDefs: [],
-      },
-    ]
-
-    const onChange = vi.fn()
-    render(
-      <PortableTextEditorTester
-        keyGenerator={createTestKeyGenerator()}
-        onChange={onChange}
-        ref={editorRef}
-        schemaType={schemaType}
-        value={initialValue}
-      />,
-    )
-    await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({
-        type: 'value',
-        value: initialValue,
-      })
-      expect(onChange).toHaveBeenCalledWith({type: 'ready'})
-    })
-    await waitFor(() => {
-      if (editorRef.current) {
-        PortableTextEditor.focus(editorRef.current)
-        expect(PortableTextEditor.getValue(editorRef.current)).toEqual([
-          {
-            _key: 'abc',
-            _type: 'myTestBlockType',
-            children: [
-              {
-                _key: 'k3',
-                _type: 'span',
-                text: '',
-                marks: [],
-              },
-            ],
-            markDefs: [],
-            style: 'normal',
-          },
-          {
-            _key: 'def',
-            _type: 'myTestBlockType',
-            children: [
-              {
-                _key: 'k5',
-                _type: 'span',
-                text: '',
-                marks: [],
-              },
-            ],
-            markDefs: [],
-            style: 'normal',
-          },
-        ])
-      }
-    })
-  })
-
-  it('removes orphaned marks', async () => {
-    const editorRef: RefObject<PortableTextEditor | null> = createRef()
-    const initialValue = [
-      {
-        _key: 'abc',
-        _type: 'myTestBlockType',
-        style: 'normal',
-        markDefs: [],
-        children: [
-          {
-            _key: 'def',
-            _type: 'span',
-            marks: ['ghi'],
-            text: 'Hello',
-          },
-        ],
-      },
-    ]
-
-    const onChange = vi.fn()
-    render(
-      <PortableTextEditorTester
-        keyGenerator={createTestKeyGenerator()}
-        onChange={onChange}
-        ref={editorRef}
-        schemaType={schemaType}
-        value={initialValue}
-      />,
-    )
-    await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({
-        type: 'value',
-        value: initialValue,
-      })
-      expect(onChange).toHaveBeenCalledWith({type: 'ready'})
-    })
-    await waitFor(() => {
-      if (editorRef.current) {
-        PortableTextEditor.focus(editorRef.current)
-        expect(PortableTextEditor.getValue(editorRef.current)).toEqual([
-          {
-            _key: 'abc',
-            _type: 'myTestBlockType',
-            children: [
-              {
-                _key: 'def',
-                _type: 'span',
-                text: 'Hello',
-                marks: [],
-              },
-            ],
-            markDefs: [],
-            style: 'normal',
-          },
-        ])
-      }
-    })
-  })
-
-  it('removes orphaned marksDefs', async () => {
-    const editorRef: RefObject<PortableTextEditor | null> = createRef()
-    const initialValue = [
-      {
-        _key: 'abc',
-        _type: 'myTestBlockType',
-        style: 'normal',
-        markDefs: [
-          {
-            _key: 'ghi',
-            _type: 'link',
-            href: 'https://sanity.io',
-          },
-        ],
-        children: [
-          {
-            _key: 'def',
-            _type: 'span',
-            marks: [],
-            text: 'Hello',
-          },
-        ],
-      },
-    ]
-
-    const onChange = vi.fn()
-    render(
-      <PortableTextEditorTester
-        keyGenerator={createTestKeyGenerator()}
-        onChange={onChange}
-        ref={editorRef}
-        schemaType={schemaType}
-        value={initialValue}
-      />,
-    )
-    await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({
-        type: 'value',
-        value: initialValue,
-      })
-      expect(onChange).toHaveBeenCalledWith({type: 'ready'})
-    })
-    await waitFor(() => {
-      if (editorRef.current) {
-        PortableTextEditor.focus(editorRef.current)
-        expect(PortableTextEditor.getValue(editorRef.current)).toEqual([
-          {
-            _key: 'abc',
-            _type: 'myTestBlockType',
-            children: [
-              {
-                _key: 'def',
-                _type: 'span',
-                text: 'Hello',
-                marks: [],
-              },
-            ],
-            markDefs: [],
-            style: 'normal',
-          },
-        ])
-      }
-    })
-  })
-
-  it('allows empty array of blocks', async () => {
-    const editorRef: RefObject<PortableTextEditor | null> = createRef()
-    const initialValue = [] as PortableTextBlock[]
-
-    const onChange = vi.fn()
-    render(
-      <PortableTextEditorTester
-        keyGenerator={createTestKeyGenerator()}
-        onChange={onChange}
-        ref={editorRef}
-        schemaType={schemaType}
-        value={initialValue}
-      />,
-    )
-    await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({
-        type: 'value',
-        value: initialValue,
-      })
-      expect(onChange).toHaveBeenCalledWith({type: 'ready'})
-    })
-    await waitFor(() => {
-      if (editorRef.current) {
-        PortableTextEditor.focus(editorRef.current)
-        expect(PortableTextEditor.getValue(editorRef.current)).toEqual([
-          {
-            _key: 'k2',
-            _type: 'myTestBlockType',
-            children: [{_key: 'k3', _type: 'span', marks: [], text: ''}],
-            markDefs: [],
-            style: 'normal',
-          },
-        ])
-      }
-    })
-    await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({
-        type: 'value',
-        value: initialValue,
-      })
-      expect(onChange).toHaveBeenCalledWith({type: 'ready'})
-    })
-  })
-})

package/src/editor/components/Synchronizer.tsx

@@ -1,134 +0,0 @@
-import {useActorRef, useSelector} from '@xstate/react'
-import {useEffect} from 'react'
-import {debugWithName} from '../../internal-utils/debug'
-import {fromSlateValue} from '../../internal-utils/values'
-import {KEY_TO_VALUE_ELEMENT} from '../../internal-utils/weakMaps'
-import type {PortableTextSlateEditor} from '../../types/editor'
-import type {EditorActor} from '../editor-machine'
-import {mutationMachine} from '../mutation-machine'
-import {syncMachine} from '../sync-machine'
-
-const debug = debugWithName('component:PortableTextEditor:Synchronizer')
-
-/**
- * @internal
- */
-export interface SynchronizerProps {
-  editorActor: EditorActor
-  slateEditor: PortableTextSlateEditor
-}
-
-/**
- * Synchronizes the server value with the editor, and provides various contexts for the editor state.
- * @internal
- */
-export function Synchronizer(props: SynchronizerProps) {
-  const {editorActor, slateEditor} = props
-
-  const incomingValue = useSelector(
-    props.editorActor,
-    (s) => s.context.incomingValue,
-  )
-  const readOnly = useSelector(props.editorActor, (s) =>
-    s.matches({'edit mode': 'read only'}),
-  )
-  const syncActorRef = useActorRef(syncMachine, {
-    input: {
-      keyGenerator: props.editorActor.getSnapshot().context.keyGenerator,
-      readOnly: props.editorActor
-        .getSnapshot()
-        .matches({'edit mode': 'read only'}),
-      schema: props.editorActor.getSnapshot().context.schema,
-      slateEditor,
-    },
-  })
-  const mutationActorRef = useActorRef(mutationMachine, {
-    input: {
-      schema: props.editorActor.getSnapshot().context.schema,
-      slateEditor,
-    },
-  })
-
-  useEffect(() => {
-    const subscription = mutationActorRef.on('*', (event) => {
-      if (event.type === 'has pending patches') {
-        syncActorRef.send({type: 'has pending patches'})
-      }
-      if (event.type === 'mutation') {
-        syncActorRef.send({type: 'mutation'})
-        editorActor.send({
-          type: 'mutation',
-          patches: event.patches,
-          snapshot: event.snapshot,
-          value: event.snapshot,
-        })
-      }
-    })
-
-    return () => {
-      subscription.unsubscribe()
-    }
-  }, [mutationActorRef, syncActorRef, editorActor])
-
-  useEffect(() => {
-    const subscription = syncActorRef.on('*', (event) => {
-      switch (event.type) {
-        case 'invalid value':
-          props.editorActor.send({
-            ...event,
-            type: 'notify.invalid value',
-          })
-          break
-        case 'value changed':
-          props.editorActor.send({
-            ...event,
-            type: 'notify.value changed',
-          })
-          break
-        case 'patch':
-          props.editorActor.send({
-            ...event,
-            type: 'internal.patch',
-            value: fromSlateValue(
-              slateEditor.children,
-              props.editorActor.getSnapshot().context.schema.block.name,
-              KEY_TO_VALUE_ELEMENT.get(slateEditor),
-            ),
-          })
-          break
-
-        default:
-          props.editorActor.send(event)
-      }
-    })
-
-    return () => {
-      subscription.unsubscribe()
-    }
-  }, [props.editorActor, slateEditor, syncActorRef])
-
-  useEffect(() => {
-    syncActorRef.send({type: 'update readOnly', readOnly})
-  }, [syncActorRef, readOnly])
-
-  useEffect(() => {
-    debug('Value from props changed, syncing new value')
-    syncActorRef.send({type: 'update value', value: incomingValue})
-  }, [syncActorRef, incomingValue])
-
-  // Subscribe to, and handle changes from the editor
-  useEffect(() => {
-    debug('Subscribing to patch events')
-    const sub = editorActor.on('internal.patch', (event) => {
-      mutationActorRef.send({...event, type: 'patch'})
-    })
-    return () => {
-      debug('Unsubscribing to patch events')
-      sub.unsubscribe()
-    }
-  }, [editorActor, mutationActorRef, slateEditor])
-
-  return null
-}
-
-Synchronizer.displayName = 'Synchronizer'