@portabletext/editor 3.0.7 → 3.0.9

package/lib/utils/index.d.ts

@@ -115,7 +115,7 @@ declare function getTextBlockText(block: PortableTextTextBlock): string;
 /**
  * @public
  */
-declare function isEmptyTextBlock(context: Pick<EditorContext, 'schema'>, block: PortableTextBlock): boolean;
+declare function isEmptyTextBlock(context: Pick<EditorContext, 'schema'>, block: PortableTextBlock | unknown): boolean;
 /**
  * @public
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@portabletext/editor",
-  "version": "3.0.7",
+  "version": "3.0.9",
   "description": "Portable Text Editor made in React",
   "keywords": [
     "sanity",
@@ -73,7 +73,7 @@
     "slate-dom": "^0.119.0",
     "slate-react": "0.119.0",
     "xstate": "^5.24.0",
-    "@portabletext/block-tools": "^4.1.2",
+    "@portabletext/block-tools": "^4.1.3",
     "@portabletext/keyboard-shortcuts": "^2.1.0",
     "@portabletext/patches": "^2.0.0",
     "@portabletext/schema": "^2.0.0"
@@ -81,8 +81,8 @@
   "devDependencies": {
     "@sanity/diff-match-patch": "^3.2.0",
     "@sanity/pkg-utils": "^9.0.3",
-    "@sanity/schema": "^4.18.0",
-    "@sanity/types": "^4.18.0",
+    "@sanity/schema": "^4.19.0",
+    "@sanity/types": "^4.19.0",
     "@types/debug": "^4.1.12",
     "@types/lodash": "^4.17.20",
     "@types/lodash.startcase": "^4.4.9",
@@ -106,14 +106,14 @@
     "vite": "^7.1.12",
     "vitest": "^4.0.9",
     "vitest-browser-react": "^2.0.2",
-    "@portabletext/sanity-bridge": "1.2.5",
+    "@portabletext/sanity-bridge": "1.2.6",
     "@portabletext/test": "^1.0.0",
     "racejar": "2.0.0"
   },
   "peerDependencies": {
-    "@portabletext/sanity-bridge": "^1.2.5",
-    "@sanity/schema": "^4.18.0",
-    "@sanity/types": "^4.18.0",
+    "@portabletext/sanity-bridge": "^1.2.6",
+    "@sanity/schema": "^4.19.0",
+    "@sanity/types": "^4.19.0",
     "react": "^18.3 || ^19",
     "rxjs": "^7.8.2"
   },

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

@@ -81,7 +81,6 @@ describe(converterPortableText.deserialize, () => {
               marks: [],
             },
           ],
-          markDefs: [],
         },
       ],
     })
@@ -117,7 +116,6 @@ describe(converterPortableText.deserialize, () => {
               marks: [],
             },
           ],
-          markDefs: [],
         },
       ],
     })
@@ -263,8 +261,6 @@ describe(converterPortableText.deserialize, () => {
             marks: [],
           },
         ],
-        markDefs: [],
-        style: 'normal',
       },
     ])
   })
@@ -299,8 +295,6 @@ describe(converterPortableText.deserialize, () => {
             marks: [],
           },
         ],
-        markDefs: [],
-        style: 'normal',
       },
     ])
   })
@@ -336,8 +330,6 @@ describe(converterPortableText.deserialize, () => {
             marks: [],
           },
         ],
-        markDefs: [],
-        style: 'normal',
       },
     ])
   })
@@ -377,7 +369,6 @@ describe(converterPortableText.deserialize, () => {
             marks: [],
           },
         ],
-        markDefs: [],
         style: 'h1',
       },
     ])
@@ -415,9 +406,7 @@ describe(converterPortableText.deserialize, () => {
             marks: [],
           },
         ],
-        markDefs: [],
         level: 1,
-        style: 'normal',
       },
     ])
   })
@@ -458,10 +447,8 @@ describe(converterPortableText.deserialize, () => {
             marks: [],
           },
         ],
-        markDefs: [],
         listItem: 'bullet',
         level: 1,
-        style: 'normal',
       },
     ])
   })

package/src/editor/Editable.tsx

@@ -25,7 +25,6 @@ import {getEventPosition} from '../internal-utils/event-position'
 import {normalizeSelection} from '../internal-utils/selection'
 import {slateRangeToSelection} from '../internal-utils/slate-utils'
 import {toSlateRange} from '../internal-utils/to-slate-range'
-import {isEqualToEmptyEditor} from '../internal-utils/values'
 import type {
   EditorSelection,
   OnCopyFn,
@@ -41,6 +40,7 @@ import type {
   ScrollSelectionIntoViewFunction,
 } from '../types/editor'
 import type {HotkeyOptions} from '../types/options'
+import {isEmptyTextBlock} from '../utils'
 import {parseBlocks} from '../utils/parse-blocks'
 import {RenderElement} from './components/render-element'
 import {RenderLeaf} from './components/render-leaf'
@@ -526,9 +526,10 @@ export const PortableTextEditable = forwardRef<
 
         if (
           !slateEditor.selection &&
-          isEqualToEmptyEditor(
-            slateEditor.children,
-            editorActor.getSnapshot().context.schema,
+          slateEditor.children.length === 1 &&
+          isEmptyTextBlock(
+            editorActor.getSnapshot().context,
+            slateEditor.value.at(0),
           )
         ) {
           Transforms.select(slateEditor, Editor.start(slateEditor, []))

package/src/editor/plugins/createWithPortableTextMarkModel.ts

@@ -30,6 +30,9 @@ export function createWithPortableTextMarkModel(
     const decorators = editorActor
       .getSnapshot()
       .context.schema.decorators.map((t) => t.name)
+    const defaultStyle = editorActor
+      .getSnapshot()
+      .context.schema.styles.at(0)?.name
 
     // Extend Slate's default normalization. Merge spans with same set of .marks when doing merge_node operations, and clean up markDefs / marks
     editor.normalizeNode = (nodeEntry) => {
@@ -74,6 +77,22 @@ export function createWithPortableTextMarkModel(
         return
       }
 
+      /**
+       * Add missing .style to block nodes
+       */
+      if (
+        defaultStyle &&
+        editor.isTextBlock(node) &&
+        typeof node.style === 'undefined'
+      ) {
+        debug('Adding .style to block node')
+
+        withNormalizeNode(editor, () => {
+          Transforms.setNodes(editor, {style: defaultStyle}, {at: path})
+        })
+        return
+      }
+
       /**
        * Add missing .marks to span nodes
        */

package/src/internal-utils/__tests__/values.test.ts

@@ -51,7 +51,6 @@ describe(toSlateBlock.name, () => {
           text: '123',
         },
       ],
-      style: 'normal',
     })
   })
 
@@ -106,7 +105,6 @@ describe(toSlateBlock.name, () => {
           },
         },
       ],
-      style: 'normal',
     })
   })
 })

package/src/internal-utils/values.test.ts

@@ -32,7 +32,6 @@ describe(toSlateBlock.name, () => {
               text: 'foo',
             },
           ],
-          style: 'normal',
         })
       })
 
@@ -62,7 +61,6 @@ describe(toSlateBlock.name, () => {
               text: 'foo',
             },
           ],
-          style: 'normal',
         })
       })
 
@@ -101,7 +99,6 @@ describe(toSlateBlock.name, () => {
               __inline: true,
             },
           ],
-          style: 'normal',
         })
       })
     })
@@ -148,7 +145,6 @@ describe(toSlateBlock.name, () => {
               },
             },
           ],
-          style: 'normal',
         })
       })
 
@@ -191,7 +187,6 @@ describe(toSlateBlock.name, () => {
               },
             },
           ],
-          style: 'normal',
         })
       })
     })
@@ -238,7 +233,6 @@ describe(toSlateBlock.name, () => {
               },
             },
           ],
-          style: 'normal',
         })
       })
 
@@ -281,7 +275,6 @@ describe(toSlateBlock.name, () => {
               },
             },
           ],
-          style: 'normal',
         })
       })
     })

package/src/internal-utils/values.ts

@@ -35,7 +35,6 @@ export function toSlateBlock(
   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'
 
@@ -86,7 +85,6 @@ export function toSlateBlock(
 
     // Return original block
     if (
-      !hasMissingStyle &&
       !hasMissingMarkDefs &&
       !hasMissingChildren &&
       !hasInlines &&
@@ -96,11 +94,6 @@ export function toSlateBlock(
       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,
@@ -176,25 +169,76 @@ export function fromSlateBlock(
 }
 
 export function isEqualToEmptyEditor(
-  children: Descendant[] | PortableTextBlock[],
+  blocks: Array<Descendant> | Array<PortableTextBlock>,
   schemaTypes: EditorSchema,
 ): boolean {
-  return (
-    children === undefined ||
-    (children && Array.isArray(children) && children.length === 0) ||
-    (children &&
-      Array.isArray(children) &&
-      children.length === 1 &&
-      Element.isElement(children[0]) &&
-      children[0]._type === schemaTypes.block.name &&
-      'style' in children[0] &&
-      children[0].style === schemaTypes.styles[0].name &&
-      !('listItem' in children[0]) &&
-      Array.isArray(children[0].children) &&
-      children[0].children.length === 1 &&
-      Text.isText(children[0].children[0]) &&
-      children[0].children[0]._type === 'span' &&
-      !children[0].children[0].marks?.join('') &&
-      children[0].children[0].text === '')
-  )
+  // Must have exactly one block
+  if (blocks.length !== 1) {
+    return false
+  }
+
+  const firstBlock = blocks.at(0)
+
+  if (!firstBlock) {
+    return true
+  }
+
+  if (!Element.isElement(firstBlock)) {
+    return false
+  }
+
+  // Must be a text block
+  if (firstBlock._type !== schemaTypes.block.name) {
+    return false
+  }
+
+  // Must not be a list item
+  if ('listItem' in firstBlock) {
+    return false
+  }
+
+  // Style must exist and be the default style
+  if (
+    !('style' in firstBlock) ||
+    firstBlock.style !== schemaTypes.styles.at(0)?.name
+  ) {
+    return false
+  }
+
+  // Must have children array
+  if (!Array.isArray(firstBlock.children)) {
+    return false
+  }
+
+  // Must have exactly one child
+  if (firstBlock.children.length !== 1) {
+    return false
+  }
+
+  const firstChild = firstBlock.children.at(0)
+
+  if (!firstChild) {
+    return false
+  }
+
+  if (!Text.isText(firstChild)) {
+    return false
+  }
+
+  // Must be a span type
+  if (!('_type' in firstChild) || firstChild._type !== schemaTypes.span.name) {
+    return false
+  }
+
+  // Must have empty text
+  if (firstChild.text !== '') {
+    return false
+  }
+
+  // Must have no marks (marks can be undefined or empty array)
+  if (firstChild.marks?.join('')) {
+    return false
+  }
+
+  return true
 }

package/src/operations/behavior.operation.block.set.ts

@@ -1,6 +1,7 @@
-import {Transforms, type Element as SlateElement} from 'slate'
-import {toSlateBlock} from '../internal-utils/values'
-import {parseBlock} from '../utils/parse-blocks'
+import {applyAll, set} from '@portabletext/patches'
+import {isTextBlock} from '@portabletext/schema'
+import {Transforms, type Node} from 'slate'
+import {parseMarkDefs} from '../utils/parse-blocks'
 import type {BehaviorOperationImplementation} from './behavior.operations'
 
 export const blockSetOperationImplementation: BehaviorOperationImplementation<
@@ -14,36 +15,90 @@ export const blockSetOperationImplementation: BehaviorOperationImplementation<
     )
   }
 
-  const block = operation.editor.value.at(blockIndex)
+  const slateBlock = operation.editor.children.at(blockIndex)
 
-  if (!block) {
+  if (!slateBlock) {
     throw new Error(`Unable to find block at ${JSON.stringify(operation.at)}`)
   }
 
-  const {_type, ...filteredProps} = operation.props
+  if (isTextBlock(context, slateBlock)) {
+    const filteredProps: Record<string, unknown> = {}
 
-  const updatedBlock = {
-    ...block,
-    ...filteredProps,
-  }
+    for (const key of Object.keys(operation.props)) {
+      if (key === '_type' || key === 'children') {
+        continue
+      }
 
-  const parsedBlock = parseBlock({
-    context,
-    block: updatedBlock,
-    options: {
-      normalize: false,
-      removeUnusedMarkDefs: false,
-      validateFields: true,
-    },
-  })
-
-  if (!parsedBlock) {
-    throw new Error(`Unable to update block at ${JSON.stringify(operation.at)}`)
-  }
+      if (key === 'style') {
+        if (
+          context.schema.styles.some(
+            (style) => style.name === operation.props[key],
+          )
+        ) {
+          filteredProps[key] = operation.props[key]
+        }
+        continue
+      }
+
+      if (key === 'listItem') {
+        if (
+          context.schema.lists.some(
+            (list) => list.name === operation.props[key],
+          )
+        ) {
+          filteredProps[key] = operation.props[key]
+        }
+        continue
+      }
+
+      if (key === 'level') {
+        filteredProps[key] = operation.props[key]
+        continue
+      }
+
+      if (key === 'markDefs') {
+        const {markDefs} = parseMarkDefs({
+          context,
+          markDefs: operation.props[key],
+          options: {validateFields: true},
+        })
+        filteredProps[key] = markDefs
+        continue
+      }
+
+      if (context.schema.block.fields?.some((field) => field.name === key)) {
+        filteredProps[key] = operation.props[key]
+      }
+    }
+
+    Transforms.setNodes(operation.editor, filteredProps, {at: [blockIndex]})
+  } else {
+    const schemaDefinition = context.schema.blockObjects.find(
+      (definition) => definition.name === slateBlock._type,
+    )
+    const filteredProps: Record<string, unknown> = {}
+
+    for (const key of Object.keys(operation.props)) {
+      if (key === '_type') {
+        continue
+      }
 
-  const slateBlock = toSlateBlock(parsedBlock, {
-    schemaTypes: context.schema,
-  }) as SlateElement
+      if (key === '_key') {
+        filteredProps[key] = operation.props[key]
+        continue
+      }
 
-  Transforms.setNodes(operation.editor, slateBlock, {at: [blockIndex]})
+      if (schemaDefinition?.fields.some((field) => field.name === key)) {
+        filteredProps[key] = operation.props[key]
+      }
+    }
+
+    const patches = Object.entries(filteredProps).map(([key, value]) =>
+      key === '_key' ? set(value, ['_key']) : set(value, ['value', key]),
+    )
+
+    const updatedSlateBlock = applyAll(slateBlock, patches) as Partial<Node>
+
+    Transforms.setNodes(operation.editor, updatedSlateBlock, {at: [blockIndex]})
+  }
 }

package/src/operations/behavior.operation.block.unset.ts

@@ -1,7 +1,6 @@
+import {applyAll, set, unset} from '@portabletext/patches'
 import {isTextBlock} from '@portabletext/schema'
-import {omit} from 'lodash'
-import {Transforms} from 'slate'
-import {parseBlock} from '../utils/parse-blocks'
+import {Transforms, type Node} from 'slate'
 import type {BehaviorOperationImplementation} from './behavior.operations'
 
 export const blockUnsetOperationImplementation: BehaviorOperationImplementation<
@@ -14,73 +13,42 @@ export const blockUnsetOperationImplementation: BehaviorOperationImplementation<
     throw new Error(`Unable to find block index for block key ${blockKey}`)
   }
 
-  const block =
-    blockIndex !== undefined ? operation.editor.value.at(blockIndex) : undefined
+  const slateBlock =
+    blockIndex !== undefined
+      ? operation.editor.children.at(blockIndex)
+      : undefined
 
-  if (!block) {
+  if (!slateBlock) {
     throw new Error(`Unable to find block at ${JSON.stringify(operation.at)}`)
   }
 
-  if (isTextBlock(context, block)) {
-    const propsToRemove = operation.props.filter((prop) => prop !== '_type')
+  if (isTextBlock(context, slateBlock)) {
+    const propsToRemove = operation.props.filter(
+      (prop) => prop !== '_type' && prop !== '_key' && prop !== 'children',
+    )
 
-    const updatedTextBlock = parseBlock({
-      context,
-      block: omit(block, propsToRemove),
-      options: {
-        normalize: false,
-        removeUnusedMarkDefs: true,
-        validateFields: true,
-      },
-    })
+    Transforms.unsetNodes(operation.editor, propsToRemove, {at: [blockIndex]})
 
-    if (!updatedTextBlock) {
-      throw new Error(
-        `Unable to update block at ${JSON.stringify(operation.at)}`,
+    if (operation.props.includes('_key')) {
+      Transforms.setNodes(
+        operation.editor,
+        {_key: context.keyGenerator()},
+        {at: [blockIndex]},
       )
     }
 
-    const propsToSet: Record<string, unknown> = {}
-
-    for (const prop of propsToRemove) {
-      if (!(prop in updatedTextBlock)) {
-        propsToSet[prop] = undefined
-      } else {
-        propsToSet[prop] = (updatedTextBlock as Record<string, unknown>)[prop]
-      }
-    }
-
-    Transforms.setNodes(operation.editor, propsToSet, {at: [blockIndex]})
-
     return
   }
 
-  const updatedBlockObject = parseBlock({
-    context,
-    block: omit(
-      block,
-      operation.props.filter((prop) => prop !== '_type'),
-    ),
-    options: {
-      normalize: false,
-      removeUnusedMarkDefs: true,
-      validateFields: true,
-    },
-  })
-
-  if (!updatedBlockObject) {
-    throw new Error(`Unable to update block at ${JSON.stringify(operation.at)}`)
-  }
+  const patches = operation.props.flatMap((key) =>
+    key === '_type'
+      ? []
+      : key === '_key'
+        ? set(context.keyGenerator(), ['_key'])
+        : unset(['value', key]),
+  )
 
-  const {_type, _key, ...props} = updatedBlockObject
+  const updatedSlateBlock = applyAll(slateBlock, patches) as Partial<Node>
 
-  Transforms.setNodes(
-    operation.editor,
-    {
-      _type,
-      _key,
-      value: props,
-    },
-    {at: [blockIndex]},
-  )
+  Transforms.setNodes(operation.editor, updatedSlateBlock, {at: [blockIndex]})
 }

package/src/operations/behavior.operation.insert.block.ts

@@ -12,7 +12,7 @@ import {
 import {DOMEditor} from 'slate-dom'
 import {getFocusBlock, getFocusChild} from '../internal-utils/slate-utils'
 import {toSlateRange} from '../internal-utils/to-slate-range'
-import {isEqualToEmptyEditor, toSlateBlock} from '../internal-utils/values'
+import {toSlateBlock} from '../internal-utils/values'
 import type {EditorSelection, PortableTextSlateEditor} from '../types/editor'
 import {parseBlock} from '../utils/parse-blocks'
 import {isEmptyTextBlock} from '../utils/util.is-empty-text-block'
@@ -121,7 +121,7 @@ export function insertBlock(options: {
     } else {
       // placement === 'auto'
 
-      if (endBlock && isEqualToEmptyEditor([endBlock], context.schema)) {
+      if (isEmptyTextBlock(context, endBlock)) {
         Transforms.insertNodes(editor, [block], {
           at: endBlockPath,
           select: false,
@@ -234,7 +234,7 @@ export function insertBlock(options: {
         Transforms.select(editor, atAfterInsert)
       }
 
-      if (focusBlock && isEqualToEmptyEditor([focusBlock], context.schema)) {
+      if (isEmptyTextBlock(context, focusBlock)) {
         Transforms.removeNodes(editor, {at: focusBlockPath})
       }
 
@@ -244,7 +244,7 @@ export function insertBlock(options: {
     if (editor.isTextBlock(endBlock) && editor.isTextBlock(block)) {
       const selectionStartPoint = Range.start(at)
 
-      if (isEqualToEmptyEditor([endBlock], context.schema)) {
+      if (isEmptyTextBlock(context, endBlock)) {
         Transforms.insertNodes(editor, [block], {
           at: endBlockPath,
           select: false,