@portabletext/editor 2.14.2 → 2.14.3

package/lib/plugins/index.d.ts

@@ -1,5 +1,5 @@
 import { Behavior, Editor, EditorEmittedEvent, EditorSchema } from "../_chunks-dts/behavior.types.action.js";
-import * as react22 from "react";
+import * as react21 from "react";
 import React from "react";
 /**
  * @beta
@@ -181,7 +181,7 @@ type MarkdownPluginConfig = MarkdownBehaviorsConfig & {
  */
 declare function MarkdownPlugin(props: {
   config: MarkdownPluginConfig;
-}): react22.JSX.Element;
+}): react21.JSX.Element;
 /**
  * @beta
  * Restrict the editor to one line. The plugin takes care of blocking
@@ -192,5 +192,5 @@ declare function MarkdownPlugin(props: {
  *
  * @deprecated Install the plugin from `@portabletext/plugin-one-line`
  */
-declare function OneLinePlugin(): react22.JSX.Element;
+declare function OneLinePlugin(): react21.JSX.Element;
 export { BehaviorPlugin, DecoratorShortcutPlugin, EditorRefPlugin, EventListenerPlugin, MarkdownPlugin, MarkdownPluginConfig, OneLinePlugin };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@portabletext/editor",
-  "version": "2.14.2",
+  "version": "2.14.3",
   "description": "Portable Text Editor made in React",
   "keywords": [
     "sanity",

package/src/editor/sync-machine.ts

@@ -24,7 +24,7 @@ import {
 import type {ActorRefFrom} from 'xstate'
 import {debugWithName} from '../internal-utils/debug'
 import {validateValue} from '../internal-utils/validateValue'
-import {toSlateValue, VOID_CHILD_KEY} from '../internal-utils/values'
+import {toSlateBlock, VOID_CHILD_KEY} from '../internal-utils/values'
 import type {PickFromUnion} from '../type-utils'
 import type {
   InvalidValueResolution,
@@ -467,10 +467,6 @@ async function updateValue({
   }
   // Remove, replace or add nodes according to what is changed.
   if (value && value.length > 0) {
-    const slateValueFromProps = toSlateValue(value, {
-      schemaTypes: context.schema,
-    })
-
     if (streamBlocks) {
       await new Promise<void>((resolve) => {
         Editor.withoutNormalizing(slateEditor, () => {
@@ -483,7 +479,7 @@ async function updateValue({
 
               isChanged = removeExtraBlocks({
                 slateEditor,
-                slateValueFromProps,
+                value,
               })
 
               const processBlocks = async () => {
@@ -491,7 +487,7 @@ async function updateValue({
                   currentBlock,
                   currentBlockIndex,
                 ] of getStreamedBlocks({
-                  slateValue: slateValueFromProps,
+                  value,
                 })) {
                   const {blockChanged, blockValid} = syncBlock({
                     context,
@@ -528,12 +524,12 @@ async function updateValue({
 
             isChanged = removeExtraBlocks({
               slateEditor,
-              slateValueFromProps,
+              value,
             })
 
             let index = 0
 
-            for (const currentBlock of slateValueFromProps) {
+            for (const currentBlock of value) {
               const {blockChanged, blockValid} = syncBlock({
                 context,
                 sendBack,
@@ -598,17 +594,17 @@ async function updateValue({
 
 function removeExtraBlocks({
   slateEditor,
-  slateValueFromProps,
+  value,
 }: {
   slateEditor: PortableTextSlateEditor
-  slateValueFromProps: Array<Descendant>
+  value: Array<PortableTextBlock>
 }) {
   let isChanged = false
   const childrenLength = slateEditor.children.length
 
   // Remove blocks that have become superfluous
-  if (slateValueFromProps.length < childrenLength) {
-    for (let i = childrenLength - 1; i > slateValueFromProps.length - 1; i--) {
+  if (value.length < childrenLength) {
+    for (let i = childrenLength - 1; i > value.length - 1; i--) {
       Transforms.removeNodes(slateEditor, {
         at: [i],
       })
@@ -618,13 +614,9 @@ function removeExtraBlocks({
   return isChanged
 }
 
-async function* getStreamedBlocks({
-  slateValue,
-}: {
-  slateValue: Array<Descendant>
-}) {
+async function* getStreamedBlocks({value}: {value: Array<PortableTextBlock>}) {
   let index = 0
-  for await (const block of slateValue) {
+  for await (const block of value) {
     if (index % 10 === 0) {
       await new Promise<void>((resolve) => setTimeout(resolve, 0))
     }
@@ -648,7 +640,7 @@ function syncBlock({
     schema: EditorSchema
   }
   sendBack: (event: SyncValueEvent) => void
-  block: Descendant
+  block: PortableTextBlock
   index: number
   slateEditor: PortableTextSlateEditor
   value: Array<PortableTextBlock>
@@ -692,18 +684,17 @@ function syncBlock({
             }
           }
           if (validation.valid || validation.resolution?.autoResolve) {
+            const slateBlock = toSlateBlock(currentBlock, {
+              schemaTypes: context.schema,
+            })
+
             if (oldBlock._key === currentBlock._key) {
               if (debug.enabled) debug('Updating block', oldBlock, currentBlock)
-              _updateBlock(
-                slateEditor,
-                currentBlock,
-                oldBlock,
-                currentBlockIndex,
-              )
+              _updateBlock(slateEditor, slateBlock, oldBlock, currentBlockIndex)
             } else {
               if (debug.enabled)
                 debug('Replacing block', oldBlock, currentBlock)
-              _replaceBlock(slateEditor, currentBlock, currentBlockIndex)
+              _replaceBlock(slateEditor, slateBlock, currentBlockIndex)
             }
             blockChanged = true
           } else {
@@ -717,7 +708,7 @@ function syncBlock({
         }
 
         if (!oldBlock && blockValid) {
-          const validationValue = [value[currentBlockIndex]]
+          const validationValue = [currentBlock]
           const validation = validateValue(
             validationValue,
             context.schema,
@@ -729,7 +720,10 @@ function syncBlock({
               currentBlock,
             )
           if (validation.valid || validation.resolution?.autoResolve) {
-            Transforms.insertNodes(slateEditor, currentBlock, {
+            const slateBlock = toSlateBlock(currentBlock, {
+              schemaTypes: context.schema,
+            })
+            Transforms.insertNodes(slateEditor, slateBlock, {
               at: [currentBlockIndex],
             })
           } else {

package/src/internal-utils/validateValue.ts

@@ -1,5 +1,5 @@
 import {insert, set, setIfMissing, unset} from '@portabletext/patches'
-import {isTextBlock} from '@portabletext/schema'
+import {isSpan, isTextBlock} from '@portabletext/schema'
 import type {
   PortableTextBlock,
   PortableTextSpan,
@@ -228,9 +228,9 @@ export function validateValue(
         const allUsedMarks = uniq(
           flatten(
             textBlock.children
-              .filter((cld) => cld._type === types.span.name)
+              .filter((child) => isSpan({schema: types}, child))
               .map((cld) => cld.marks || []),
-          ) as string[],
+          ),
         )
 
         // Test that all markDefs are in use (remove orphaned markDefs)

package/src/internal-utils/values.ts

@@ -30,82 +30,92 @@ export function toSlateValue(
   keyMap: Record<string, any> = {},
 ): Descendant[] {
   if (value && Array.isArray(value)) {
-    return value.map((block) => {
-      const {_type, _key, ...rest} = block
-      const isPortableText = block && block._type === schemaTypes.block.name
-      if (isPortableText) {
-        const textBlock = block as PortableTextTextBlock
-        let hasInlines = false
-        const hasMissingStyle = typeof textBlock.style === 'undefined'
-        const hasMissingMarkDefs = typeof textBlock.markDefs === 'undefined'
-        const hasMissingChildren = typeof textBlock.children === 'undefined'
+    return value.map((block) => toSlateBlock(block, {schemaTypes}, keyMap))
+  }
+  return []
+}
+
+export function toSlateBlock(
+  block: PortableTextBlock,
+  {schemaTypes}: {schemaTypes: EditorSchema},
+  keyMap: Record<string, any> = {},
+): Descendant {
+  const {_type, _key, ...rest} = block
+  const isPortableText = block && block._type === schemaTypes.block.name
+  if (isPortableText) {
+    const textBlock = block as PortableTextTextBlock
+    let hasInlines = false
+    const hasMissingStyle = typeof textBlock.style === 'undefined'
+    const hasMissingMarkDefs = typeof textBlock.markDefs === 'undefined'
+    const hasMissingChildren = typeof textBlock.children === 'undefined'
 
-        const children = (textBlock.children || []).map((child) => {
-          const {_type: cType, _key: cKey, ...cRest} = child
-          // Return 'slate' version of inline object where the actual
-          // value is stored in the `value` property.
-          // In slate, inline objects are represented as regular
-          // children with actual text node in order to be able to
-          // be selected the same way as the rest of the (text) content.
-          if (cType !== 'span') {
-            hasInlines = true
-            return keepObjectEquality(
+    const children = (textBlock.children || []).map((child) => {
+      const {_type: cType, _key: cKey, ...cRest} = child
+      // Return 'slate' version of inline object where the actual
+      // value is stored in the `value` property.
+      // In slate, inline objects are represented as regular
+      // children with actual text node in order to be able to
+      // be selected the same way as the rest of the (text) content.
+      if (cType !== 'span') {
+        hasInlines = true
+        return keepObjectEquality(
+          {
+            _type: cType,
+            _key: cKey,
+            children: [
               {
-                _type: cType,
-                _key: cKey,
-                children: [
-                  {
-                    _key: VOID_CHILD_KEY,
-                    _type: 'span',
-                    text: '',
-                    marks: [],
-                  },
-                ],
-                value: cRest,
-                __inline: true,
+                _key: VOID_CHILD_KEY,
+                _type: 'span',
+                text: '',
+                marks: [],
               },
-              keyMap,
-            )
-          }
-          // Original child object (span)
-          return child
-        })
-        // Return original block
-        if (
-          !hasMissingStyle &&
-          !hasMissingMarkDefs &&
-          !hasMissingChildren &&
-          !hasInlines &&
-          Element.isElement(block)
-        ) {
-          // Original object
-          return block
-        }
-        // TODO: remove this when we have a better way to handle missing style
-        if (hasMissingStyle) {
-          rest.style = schemaTypes.styles[0].name
-        }
-        return keepObjectEquality({_type, _key, ...rest, children}, keyMap)
+            ],
+            value: cRest,
+            __inline: true,
+          },
+          keyMap,
+        )
       }
-      return keepObjectEquality(
+      // Original child object (span)
+      return child
+    })
+    // Return original block
+    if (
+      !hasMissingStyle &&
+      !hasMissingMarkDefs &&
+      !hasMissingChildren &&
+      !hasInlines &&
+      Element.isElement(block)
+    ) {
+      // Original object
+      return block
+    }
+    // TODO: remove this when we have a better way to handle missing style
+    if (hasMissingStyle) {
+      rest.style = schemaTypes.styles[0].name
+    }
+    return keepObjectEquality(
+      {_type, _key, ...rest, children},
+      keyMap,
+    ) as Descendant
+  }
+
+  return keepObjectEquality(
+    {
+      _type,
+      _key,
+      children: [
         {
-          _type,
-          _key,
-          children: [
-            {
-              _key: VOID_CHILD_KEY,
-              _type: 'span',
-              text: '',
-              marks: [],
-            },
-          ],
-          value: rest,
+          _key: VOID_CHILD_KEY,
+          _type: 'span',
+          text: '',
+          marks: [],
         },
-        keyMap,
-      )
-    }) as Descendant[]
-  }
-  return []
+      ],
+      value: rest,
+    },
+    keyMap,
+  ) as Descendant
 }
 
 export function fromSlateValue(