@portabletext/editor 1.46.0 → 1.47.1

package/src/converters/converter.text-html.deserialize.test.ts

@@ -1,17 +1,17 @@
 import {describe, expect, test} from 'vitest'
 import {
   compileSchemaDefinition,
+  compileSchemaDefinitionToLegacySchema,
   defineSchema,
   type SchemaDefinition,
-} from '../editor/define-schema'
+} from '../editor/editor-schema'
 import {createTestSnapshot} from '../internal-utils/create-test-snapshot'
-import {converterTextHtml} from './converter.text-html'
-import {coreConverters} from './converters.core'
+import {createConverterTextHtml} from './converter.text-html'
 
 function createSnapshot(schema: SchemaDefinition) {
   return createTestSnapshot({
     context: {
-      converters: coreConverters,
+      converters: [],
       schema: compileSchemaDefinition(schema),
     },
   })
@@ -25,8 +25,12 @@ const unorderedList = '<ul><li>foo</li><li>bar</li></ul>'
 const orderedList = '<ol><li>foo</li><li>bar</li></ol>'
 const nestedList = '<ol><li>foo<ul><li>bar</li></ul></li></ol>'
 
-describe(converterTextHtml.deserialize.name, () => {
+describe(createConverterTextHtml.name, () => {
   test('paragraph with unknown decorators', () => {
+    const converterTextHtml = createConverterTextHtml(
+      compileSchemaDefinitionToLegacySchema(defineSchema({})),
+    )
+
     expect(
       converterTextHtml.deserialize({
         snapshot: createSnapshot(defineSchema({})),
@@ -56,6 +60,14 @@ describe(converterTextHtml.deserialize.name, () => {
   })
 
   test('paragraph with known decorators', () => {
+    const converterTextHtml = createConverterTextHtml(
+      compileSchemaDefinitionToLegacySchema(
+        defineSchema({
+          decorators: [{name: 'strong'}, {name: 'em'}, {name: 'code'}],
+        }),
+      ),
+    )
+
     expect(
       converterTextHtml.deserialize({
         snapshot: createSnapshot(
@@ -101,6 +113,13 @@ describe(converterTextHtml.deserialize.name, () => {
   })
 
   test('image', () => {
+    const converterTextHtml = createConverterTextHtml(
+      compileSchemaDefinitionToLegacySchema(
+        defineSchema({
+          blockObjects: [{name: 'image'}],
+        }),
+      ),
+    )
     expect(
       converterTextHtml.deserialize({
         snapshot: createSnapshot(
@@ -119,6 +138,10 @@ describe(converterTextHtml.deserialize.name, () => {
   })
 
   test('paragraph with unknown link', () => {
+    const converterTextHtml = createConverterTextHtml(
+      compileSchemaDefinitionToLegacySchema(defineSchema({})),
+    )
+
     expect(
       converterTextHtml.deserialize({
         snapshot: createSnapshot(defineSchema({})),
@@ -148,6 +171,16 @@ describe(converterTextHtml.deserialize.name, () => {
   })
 
   test('paragraph with known link', () => {
+    const converterTextHtml = createConverterTextHtml(
+      compileSchemaDefinitionToLegacySchema(
+        defineSchema({
+          annotations: [
+            {name: 'link', fields: [{name: 'href', type: 'string'}]},
+          ],
+        }),
+      ),
+    )
+
     expect(
       converterTextHtml.deserialize({
         snapshot: createSnapshot(
@@ -195,6 +228,14 @@ describe(converterTextHtml.deserialize.name, () => {
   })
 
   test('unordered list', () => {
+    const converterTextHtml = createConverterTextHtml(
+      compileSchemaDefinitionToLegacySchema(
+        defineSchema({
+          lists: [{name: 'bullet'}],
+        }),
+      ),
+    )
+
     expect(
       converterTextHtml.deserialize({
         snapshot: createSnapshot(
@@ -246,6 +287,14 @@ describe(converterTextHtml.deserialize.name, () => {
   })
 
   test('ordered list', () => {
+    const converterTextHtml = createConverterTextHtml(
+      compileSchemaDefinitionToLegacySchema(
+        defineSchema({
+          lists: [{name: 'number'}],
+        }),
+      ),
+    )
+
     expect(
       converterTextHtml.deserialize({
         snapshot: createSnapshot(
@@ -297,6 +346,14 @@ describe(converterTextHtml.deserialize.name, () => {
   })
 
   test('nested list', () => {
+    const converterTextHtml = createConverterTextHtml(
+      compileSchemaDefinitionToLegacySchema(
+        defineSchema({
+          lists: [{name: 'bullet'}, {name: 'number'}],
+        }),
+      ),
+    )
+
     expect(
       converterTextHtml.deserialize({
         snapshot: createSnapshot(

package/src/converters/converter.text-html.serialize.test.ts

@@ -3,12 +3,12 @@ import {describe, expect, test} from 'vitest'
 import type {EditorSelection} from '..'
 import {
   compileSchemaDefinition,
+  compileSchemaDefinitionToLegacySchema,
   defineSchema,
   type SchemaDefinition,
-} from '../editor/define-schema'
+} from '../editor/editor-schema'
 import {createTestSnapshot} from '../internal-utils/create-test-snapshot'
-import {converterTextHtml} from './converter.text-html'
-import {coreConverters} from './converters.core'
+import {createConverterTextHtml} from './converter.text-html'
 
 const decoratedParagraph: PortableTextTextBlock = {
   _key: 'k0',
@@ -78,7 +78,7 @@ const paragraphWithInlineBlock: PortableTextTextBlock = {
 function createSnapshot(schema: SchemaDefinition, selection: EditorSelection) {
   return createTestSnapshot({
     context: {
-      converters: coreConverters,
+      converters: [],
       schema: compileSchemaDefinition(schema),
       selection,
       value: [decoratedParagraph, image, b2, paragraphWithInlineBlock],
@@ -86,6 +86,10 @@ function createSnapshot(schema: SchemaDefinition, selection: EditorSelection) {
   })
 }
 
+const converterTextHtml = createConverterTextHtml(
+  compileSchemaDefinitionToLegacySchema(defineSchema({})),
+)
+
 describe(converterTextHtml.serialize.name, () => {
   test('paragraph with decorators', () => {
     expect(
@@ -177,7 +181,7 @@ describe(converterTextHtml.serialize.name, () => {
       converterTextHtml.serialize({
         snapshot: createTestSnapshot({
           context: {
-            converters: coreConverters,
+            converters: [],
             value: [
               {
                 _key: 'k0',

package/src/converters/converter.text-html.ts

@@ -2,87 +2,89 @@ import {htmlToBlocks} from '@portabletext/block-tools'
 import {toHTML} from '@portabletext/to-html'
 import type {PortableTextBlock} from '@sanity/types'
 import {parseBlock} from '../internal-utils/parse-blocks'
+import type {PortableTextMemberSchemaTypes} from '../types/editor'
 import {sliceBlocks} from '../utils'
 import {defineConverter} from './converter.types'
 
-export const converterTextHtml = defineConverter({
-  mimeType: 'text/html',
-  serialize: ({snapshot, event}) => {
-    const selection =
-      snapshot.beta.internalDrag?.origin.selection ?? snapshot.context.selection
+export function createConverterTextHtml(
+  legacySchema: PortableTextMemberSchemaTypes,
+) {
+  return defineConverter({
+    mimeType: 'text/html',
+    serialize: ({snapshot, event}) => {
+      const selection =
+        snapshot.beta.internalDrag?.origin.selection ??
+        snapshot.context.selection
 
-    if (!selection) {
-      return {
-        type: 'serialization.failure',
-        mimeType: 'text/html',
-        originEvent: event.originEvent,
-        reason: 'No selection',
+      if (!selection) {
+        return {
+          type: 'serialization.failure',
+          mimeType: 'text/html',
+          originEvent: event.originEvent,
+          reason: 'No selection',
+        }
       }
-    }
 
-    const blocks = sliceBlocks({
-      blocks: snapshot.context.value,
-      selection,
-    })
+      const blocks = sliceBlocks({
+        blocks: snapshot.context.value,
+        selection,
+      })
 
-    const html = toHTML(blocks, {
-      onMissingComponent: false,
-      components: {
-        unknownType: ({children}) =>
-          children !== undefined ? `${children}` : '',
-      },
-    })
+      const html = toHTML(blocks, {
+        onMissingComponent: false,
+        components: {
+          unknownType: ({children}) =>
+            children !== undefined ? `${children}` : '',
+        },
+      })
+
+      if (html === '') {
+        return {
+          type: 'serialization.failure',
+          mimeType: 'text/html',
+          originEvent: event.originEvent,
+          reason: 'Serialized HTML is empty',
+        }
+      }
 
-    if (html === '') {
       return {
-        type: 'serialization.failure',
+        type: 'serialization.success',
+        data: html,
         mimeType: 'text/html',
         originEvent: event.originEvent,
-        reason: 'Serialized HTML is empty',
       }
-    }
-
-    return {
-      type: 'serialization.success',
-      data: html,
-      mimeType: 'text/html',
-      originEvent: event.originEvent,
-    }
-  },
-  deserialize: ({snapshot, event}) => {
-    const blocks = htmlToBlocks(
-      event.data,
-      snapshot.context.schema.portableText,
-      {
+    },
+    deserialize: ({snapshot, event}) => {
+      const blocks = htmlToBlocks(event.data, legacySchema.portableText, {
         keyGenerator: snapshot.context.keyGenerator,
         unstable_whitespaceOnPasteMode:
-          snapshot.context.schema.block.options.unstable_whitespaceOnPasteMode,
-      },
-    ) as Array<PortableTextBlock>
+          legacySchema.block.options.unstable_whitespaceOnPasteMode,
+      }) as Array<PortableTextBlock>
 
-    const parsedBlocks = blocks.flatMap((block) => {
-      const parsedBlock = parseBlock({
-        context: snapshot.context,
-        block,
-        options: {
-          refreshKeys: false,
-        },
+      const parsedBlocks = blocks.flatMap((block) => {
+        const parsedBlock = parseBlock({
+          context: snapshot.context,
+          block,
+          options: {
+            refreshKeys: false,
+          },
+        })
+        return parsedBlock ? [parsedBlock] : []
       })
-      return parsedBlock ? [parsedBlock] : []
-    })
 
-    if (parsedBlocks.length === 0) {
+      if (parsedBlocks.length === 0) {
+        return {
+          type: 'deserialization.failure',
+          mimeType: 'text/html',
+          reason: 'No blocks deserialized',
+        }
+      }
+
       return {
-        type: 'deserialization.failure',
+        type: 'deserialization.success',
+        data: parsedBlocks,
         mimeType: 'text/html',
-        reason: 'No blocks deserialized',
       }
-    }
-
-    return {
-      type: 'deserialization.success',
-      data: parsedBlocks,
-      mimeType: 'text/html',
-    }
-  },
-})
+    },
+  })
+}

package/src/converters/converter.text-plain.test.ts

@@ -1,14 +1,15 @@
 import type {PortableTextBlock, PortableTextTextBlock} from '@sanity/types'
 import {expect, test} from 'vitest'
 import type {EditorSelection} from '..'
+import {schemaType} from '../editor/__tests__/PortableTextEditorTester'
 import {
   compileSchemaDefinition,
   defineSchema,
   type SchemaDefinition,
-} from '../editor/define-schema'
+} from '../editor/editor-schema'
+import {createLegacySchema} from '../editor/legacy-schema'
 import {createTestSnapshot} from '../internal-utils/create-test-snapshot'
-import {converterTextPlain} from './converter.text-plain'
-import {coreConverters} from './converters.core'
+import {createConverterTextPlain} from './converter.text-plain'
 
 const b1: PortableTextTextBlock = {
   _type: 'block',
@@ -74,7 +75,7 @@ function createSnapshot({
 }) {
   return createTestSnapshot({
     context: {
-      converters: coreConverters,
+      converters: [],
       schema: compileSchemaDefinition(schema),
       selection,
       value: [b1, b2, b3, b4],
@@ -82,6 +83,10 @@ function createSnapshot({
   })
 }
 
+const converterTextPlain = createConverterTextPlain(
+  createLegacySchema(schemaType),
+)
+
 test(converterTextPlain.serialize.name, () => {
   expect(
     converterTextPlain.serialize({

package/src/converters/converter.text-plain.ts

@@ -1,112 +1,116 @@
 import {htmlToBlocks} from '@portabletext/block-tools'
 import {isPortableTextTextBlock, type PortableTextBlock} from '@sanity/types'
 import {parseBlock} from '../internal-utils/parse-blocks'
+import type {PortableTextMemberSchemaTypes} from '../types/editor'
 import {sliceBlocks} from '../utils'
 import {defineConverter} from './converter.types'
 
-export const converterTextPlain = defineConverter({
-  mimeType: 'text/plain',
-  serialize: ({snapshot, event}) => {
-    const selection =
-      snapshot.beta.internalDrag?.origin.selection ?? snapshot.context.selection
+export function createConverterTextPlain(
+  legacySchema: PortableTextMemberSchemaTypes,
+) {
+  return defineConverter({
+    mimeType: 'text/plain',
+    serialize: ({snapshot, event}) => {
+      const selection =
+        snapshot.beta.internalDrag?.origin.selection ??
+        snapshot.context.selection
 
-    if (!selection) {
-      return {
-        type: 'serialization.failure',
-        mimeType: 'text/plain',
-        originEvent: event.originEvent,
-        reason: 'No selection',
+      if (!selection) {
+        return {
+          type: 'serialization.failure',
+          mimeType: 'text/plain',
+          originEvent: event.originEvent,
+          reason: 'No selection',
+        }
       }
-    }
 
-    const blocks = sliceBlocks({
-      blocks: snapshot.context.value,
-      selection,
-    })
+      const blocks = sliceBlocks({
+        blocks: snapshot.context.value,
+        selection,
+      })
 
-    const data = blocks
-      .map((block) => {
-        if (isPortableTextTextBlock(block)) {
-          return block.children
-            .map((child) => {
-              if (child._type === snapshot.context.schema.span.name) {
-                return child.text
-              }
+      const data = blocks
+        .map((block) => {
+          if (isPortableTextTextBlock(block)) {
+            return block.children
+              .map((child) => {
+                if (child._type === snapshot.context.schema.span.name) {
+                  return child.text
+                }
 
-              return snapshot.beta.hasTag('dragging internally')
-                ? `[${
-                    snapshot.context.schema.inlineObjects.find(
-                      (inlineObjectType) =>
-                        inlineObjectType.name === child._type,
-                    )?.title ?? 'Object'
-                  }]`
-                : ''
-            })
-            .join('')
-        }
+                return snapshot.beta.hasTag('dragging internally')
+                  ? `[${
+                      snapshot.context.schema.inlineObjects.find(
+                        (inlineObjectType) =>
+                          inlineObjectType.name === child._type,
+                      )?.title ?? 'Object'
+                    }]`
+                  : ''
+              })
+              .join('')
+          }
 
-        return snapshot.beta.hasTag('dragging internally')
-          ? `[${
-              snapshot.context.schema.blockObjects.find(
-                (blockObjectType) => blockObjectType.name === block._type,
-              )?.title ?? 'Object'
-            }]`
-          : ''
-      })
-      .filter((block) => block !== '')
-      .join('\n\n')
+          return snapshot.beta.hasTag('dragging internally')
+            ? `[${
+                snapshot.context.schema.blockObjects.find(
+                  (blockObjectType) => blockObjectType.name === block._type,
+                )?.title ?? 'Object'
+              }]`
+            : ''
+        })
+        .filter((block) => block !== '')
+        .join('\n\n')
 
-    return {
-      type: 'serialization.success',
-      data,
-      mimeType: 'text/plain',
-      originEvent: event.originEvent,
-    }
-  },
-  deserialize: ({snapshot, event}) => {
-    const html = escapeHtml(event.data)
-      .split(/\n{2,}/)
-      .map((line) =>
-        line ? `<p>${line.replace(/(?:\r\n|\r|\n)/g, '<br/>')}</p>` : '<p></p>',
-      )
-      .join('')
+      return {
+        type: 'serialization.success',
+        data,
+        mimeType: 'text/plain',
+        originEvent: event.originEvent,
+      }
+    },
+    deserialize: ({snapshot, event}) => {
+      const html = escapeHtml(event.data)
+        .split(/\n{2,}/)
+        .map((line) =>
+          line
+            ? `<p>${line.replace(/(?:\r\n|\r|\n)/g, '<br/>')}</p>`
+            : '<p></p>',
+        )
+        .join('')
 
-    const textToHtml = `<html><body>${html}</body></html>`
+      const textToHtml = `<html><body>${html}</body></html>`
 
-    const blocks = htmlToBlocks(
-      textToHtml,
-      snapshot.context.schema.portableText,
-      {
+      const blocks = htmlToBlocks(textToHtml, legacySchema.portableText, {
         keyGenerator: snapshot.context.keyGenerator,
-      },
-    ) as Array<PortableTextBlock>
+      }) as Array<PortableTextBlock>
 
-    const parsedBlocks = blocks.flatMap((block) => {
-      const parsedBlock = parseBlock({
-        context: snapshot.context,
-        block,
-        options: {
-          refreshKeys: false,
-        },
+      const parsedBlocks = blocks.flatMap((block) => {
+        const parsedBlock = parseBlock({
+          context: snapshot.context,
+          block,
+          options: {
+            refreshKeys: false,
+          },
+        })
+        return parsedBlock ? [parsedBlock] : []
       })
-      return parsedBlock ? [parsedBlock] : []
-    })
 
-    if (parsedBlocks.length === 0) {
+      if (parsedBlocks.length === 0) {
+        return {
+          type: 'deserialization.failure',
+          mimeType: 'text/plain',
+          reason: 'No blocks deserialized',
+        }
+      }
+
       return {
-        type: 'deserialization.failure',
+        type: 'deserialization.success',
+        data: parsedBlocks,
         mimeType: 'text/plain',
-        reason: 'No blocks deserialized',
       }
-    }
-
-    return {
-      type: 'deserialization.success',
-      data: parsedBlocks,
-      mimeType: 'text/plain',
-    }
-  },
-})
+    },
+  })
+}
 
 const entityMap: Record<string, string> = {
   '&': '&amp;',

package/src/converters/converters.core.ts

@@ -1,11 +1,16 @@
+import type {PortableTextMemberSchemaTypes} from '../types/editor'
 import {converterJson} from './converter.json'
 import {converterPortableText} from './converter.portable-text'
-import {converterTextHtml} from './converter.text-html'
-import {converterTextPlain} from './converter.text-plain'
+import {createConverterTextHtml} from './converter.text-html'
+import {createConverterTextPlain} from './converter.text-plain'
 
-export const coreConverters = [
-  converterJson,
-  converterPortableText,
-  converterTextHtml,
-  converterTextPlain,
-]
+export function createCoreConverters(
+  legacySchema: PortableTextMemberSchemaTypes,
+) {
+  return [
+    converterJson,
+    converterPortableText,
+    createConverterTextHtml(legacySchema),
+    createConverterTextPlain(legacySchema),
+  ]
+}

package/src/editor/Editable.tsx

@@ -232,12 +232,12 @@ export const PortableTextEditable = forwardRef<
         renderChild={renderChild}
         renderListItem={renderListItem}
         renderStyle={renderStyle}
-        schemaTypes={schemaTypes}
+        schemaTypes={portableTextEditor.schemaTypes}
         spellCheck={spellCheck}
       />
     ),
     [
-      schemaTypes,
+      portableTextEditor,
       spellCheck,
       readOnly,
       renderBlock,
@@ -258,7 +258,7 @@ export const PortableTextEditable = forwardRef<
           <Leaf
             {...lProps}
             editorActor={editorActor}
-            schemaTypes={schemaTypes}
+            schemaTypes={portableTextEditor.schemaTypes}
             renderAnnotation={renderAnnotation}
             renderChild={renderChild}
             renderDecorator={renderDecorator}
@@ -289,12 +289,12 @@ export const PortableTextEditable = forwardRef<
     },
     [
       editorActor,
+      portableTextEditor.schemaTypes,
       readOnly,
       renderAnnotation,
       renderChild,
       renderDecorator,
       renderPlaceholder,
-      schemaTypes,
     ],
   )
 
@@ -453,7 +453,12 @@ export const PortableTextEditable = forwardRef<
           })
         : null
       const path = ptRange?.focus.path || []
-      const onPasteResult = onPaste?.({event, value, path, schemaTypes})
+      const onPasteResult = onPaste?.({
+        event,
+        value,
+        path,
+        schemaTypes: portableTextEditor.schemaTypes,
+      })
 
       if (onPasteResult || !slateEditor.selection) {
         event.preventDefault()