@portabletext/editor 1.34.1 → 1.35.1

package/src/behaviors/behavior.markdown.ts

@@ -1,7 +1,6 @@
 import {isPortableTextTextBlock} from '@sanity/types'
 import type {EditorSchema} from '../editor/define-schema'
 import * as selectors from '../selectors'
-import {getBlockTextBefore} from '../selectors/selector.get-text-before'
 import {spanSelectionPointToBlockOffset} from '../utils/util.block-offset'
 import {getTextBlockText} from '../utils/util.get-text-block-text'
 import {defineBehavior} from './behavior.types'
@@ -71,31 +70,31 @@ export type MarkdownBehaviorsConfig = {
 export function createMarkdownBehaviors(config: MarkdownBehaviorsConfig) {
   const automaticBlockquoteOnSpace = defineBehavior({
     on: 'insert.text',
-    guard: ({context, event}) => {
+    guard: ({snapshot, event}) => {
       const isSpace = event.text === ' '
 
       if (!isSpace) {
         return false
       }
 
-      const selectionCollapsed = selectors.isSelectionCollapsed({context})
-      const focusTextBlock = selectors.getFocusTextBlock({context})
-      const focusSpan = selectors.getFocusSpan({context})
+      const selectionCollapsed = selectors.isSelectionCollapsed(snapshot)
+      const focusTextBlock = selectors.getFocusTextBlock(snapshot)
+      const focusSpan = selectors.getFocusSpan(snapshot)
 
       if (!selectionCollapsed || !focusTextBlock || !focusSpan) {
         return false
       }
 
-      const previousInlineObject = selectors.getPreviousInlineObject({context})
+      const previousInlineObject = selectors.getPreviousInlineObject(snapshot)
       const blockOffset = spanSelectionPointToBlockOffset({
-        value: context.value,
+        value: snapshot.context.value,
         selectionPoint: {
           path: [
             {_key: focusTextBlock.node._key},
             'children',
             {_key: focusSpan.node._key},
           ],
-          offset: context.selection?.focus.offset ?? 0,
+          offset: snapshot.context.selection?.focus.offset ?? 0,
         },
       })
 
@@ -106,7 +105,7 @@ export function createMarkdownBehaviors(config: MarkdownBehaviorsConfig) {
       const blockText = getTextBlockText(focusTextBlock.node)
       const caretAtTheEndOfQuote = blockOffset.offset === 1
       const looksLikeMarkdownQuote = /^>/.test(blockText)
-      const blockquoteStyle = config.blockquoteStyle?.(context)
+      const blockquoteStyle = config.blockquoteStyle?.(snapshot.context)
 
       if (
         caretAtTheEndOfQuote &&
@@ -152,7 +151,7 @@ export function createMarkdownBehaviors(config: MarkdownBehaviorsConfig) {
   })
   const automaticHr = defineBehavior({
     on: 'insert.text',
-    guard: ({context, event}) => {
+    guard: ({snapshot, event}) => {
       const hrCharacter =
         event.text === '-'
           ? '-'
@@ -166,16 +165,16 @@ export function createMarkdownBehaviors(config: MarkdownBehaviorsConfig) {
         return false
       }
 
-      const hrObject = config.horizontalRuleObject?.(context)
-      const focusBlock = selectors.getFocusTextBlock({context})
-      const selectionCollapsed = selectors.isSelectionCollapsed({context})
+      const hrObject = config.horizontalRuleObject?.(snapshot.context)
+      const focusBlock = selectors.getFocusTextBlock(snapshot)
+      const selectionCollapsed = selectors.isSelectionCollapsed(snapshot)
 
       if (!hrObject || !focusBlock || !selectionCollapsed) {
         return false
       }
 
-      const previousInlineObject = selectors.getPreviousInlineObject({context})
-      const textBefore = getBlockTextBefore({context})
+      const previousInlineObject = selectors.getPreviousInlineObject(snapshot)
+      const textBefore = selectors.getBlockTextBefore(snapshot)
       const hrBlockOffsets = {
         anchor: {
           path: focusBlock.path,
@@ -218,12 +217,12 @@ export function createMarkdownBehaviors(config: MarkdownBehaviorsConfig) {
   })
   const automaticHrOnPaste = defineBehavior({
     on: 'paste',
-    guard: ({context, event}) => {
+    guard: ({snapshot, event}) => {
       const text = event.data.getData('text/plain')
       const hrRegExp = /^(---)$|(___)$|(\*\*\*)$/gm
       const hrCharacters = text.match(hrRegExp)?.[0]
-      const hrObject = config.horizontalRuleObject?.(context)
-      const focusBlock = selectors.getFocusBlock({context})
+      const hrObject = config.horizontalRuleObject?.(snapshot.context)
+      const focusBlock = selectors.getFocusBlock(snapshot)
 
       if (!hrCharacters || !hrObject || !focusBlock) {
         return false
@@ -264,30 +263,30 @@ export function createMarkdownBehaviors(config: MarkdownBehaviorsConfig) {
   })
   const automaticHeadingOnSpace = defineBehavior({
     on: 'insert.text',
-    guard: ({context, event}) => {
+    guard: ({snapshot, event}) => {
       const isSpace = event.text === ' '
 
       if (!isSpace) {
         return false
       }
 
-      const selectionCollapsed = selectors.isSelectionCollapsed({context})
-      const focusTextBlock = selectors.getFocusTextBlock({context})
-      const focusSpan = selectors.getFocusSpan({context})
+      const selectionCollapsed = selectors.isSelectionCollapsed(snapshot)
+      const focusTextBlock = selectors.getFocusTextBlock(snapshot)
+      const focusSpan = selectors.getFocusSpan(snapshot)
 
       if (!selectionCollapsed || !focusTextBlock || !focusSpan) {
         return false
       }
 
       const blockOffset = spanSelectionPointToBlockOffset({
-        value: context.value,
+        value: snapshot.context.value,
         selectionPoint: {
           path: [
             {_key: focusTextBlock.node._key},
             'children',
             {_key: focusSpan.node._key},
           ],
-          offset: context.selection?.focus.offset ?? 0,
+          offset: snapshot.context.selection?.focus.offset ?? 0,
         },
       })
 
@@ -295,7 +294,7 @@ export function createMarkdownBehaviors(config: MarkdownBehaviorsConfig) {
         return false
       }
 
-      const previousInlineObject = selectors.getPreviousInlineObject({context})
+      const previousInlineObject = selectors.getPreviousInlineObject(snapshot)
       const blockText = getTextBlockText(focusTextBlock.node)
       const markdownHeadingSearch = /^#+/.exec(blockText)
       const level = markdownHeadingSearch
@@ -309,7 +308,7 @@ export function createMarkdownBehaviors(config: MarkdownBehaviorsConfig) {
 
       const style =
         level !== undefined
-          ? config.headingStyle?.({schema: context.schema, level})
+          ? config.headingStyle?.({schema: snapshot.context.schema, level})
           : undefined
 
       if (level !== undefined && style !== undefined) {
@@ -351,10 +350,10 @@ export function createMarkdownBehaviors(config: MarkdownBehaviorsConfig) {
   })
   const clearStyleOnBackspace = defineBehavior({
     on: 'delete.backward',
-    guard: ({context}) => {
-      const selectionCollapsed = selectors.isSelectionCollapsed({context})
-      const focusTextBlock = selectors.getFocusTextBlock({context})
-      const focusSpan = selectors.getFocusSpan({context})
+    guard: ({snapshot}) => {
+      const selectionCollapsed = selectors.isSelectionCollapsed(snapshot)
+      const focusTextBlock = selectors.getFocusTextBlock(snapshot)
+      const focusSpan = selectors.getFocusSpan(snapshot)
 
       if (!selectionCollapsed || !focusTextBlock || !focusSpan) {
         return false
@@ -362,9 +361,9 @@ export function createMarkdownBehaviors(config: MarkdownBehaviorsConfig) {
 
       const atTheBeginningOfBLock =
         focusTextBlock.node.children[0]._key === focusSpan.node._key &&
-        context.selection?.focus.offset === 0
+        snapshot.context.selection?.focus.offset === 0
 
-      const defaultStyle = config.defaultStyle?.(context)
+      const defaultStyle = config.defaultStyle?.(snapshot.context)
 
       if (
         atTheBeginningOfBLock &&
@@ -388,31 +387,31 @@ export function createMarkdownBehaviors(config: MarkdownBehaviorsConfig) {
   })
   const automaticListOnSpace = defineBehavior({
     on: 'insert.text',
-    guard: ({context, event}) => {
+    guard: ({snapshot, event}) => {
       const isSpace = event.text === ' '
 
       if (!isSpace) {
         return false
       }
 
-      const selectionCollapsed = selectors.isSelectionCollapsed({context})
-      const focusTextBlock = selectors.getFocusTextBlock({context})
-      const focusSpan = selectors.getFocusSpan({context})
+      const selectionCollapsed = selectors.isSelectionCollapsed(snapshot)
+      const focusTextBlock = selectors.getFocusTextBlock(snapshot)
+      const focusSpan = selectors.getFocusSpan(snapshot)
 
       if (!selectionCollapsed || !focusTextBlock || !focusSpan) {
         return false
       }
 
-      const previousInlineObject = selectors.getPreviousInlineObject({context})
+      const previousInlineObject = selectors.getPreviousInlineObject(snapshot)
       const blockOffset = spanSelectionPointToBlockOffset({
-        value: context.value,
+        value: snapshot.context.value,
         selectionPoint: {
           path: [
             {_key: focusTextBlock.node._key},
             'children',
             {_key: focusSpan.node._key},
           ],
-          offset: context.selection?.focus.offset ?? 0,
+          offset: snapshot.context.selection?.focus.offset ?? 0,
         },
       })
 
@@ -421,9 +420,9 @@ export function createMarkdownBehaviors(config: MarkdownBehaviorsConfig) {
       }
 
       const blockText = getTextBlockText(focusTextBlock.node)
-      const defaultStyle = config.defaultStyle?.(context)
+      const defaultStyle = config.defaultStyle?.(snapshot.context)
       const looksLikeUnorderedList = /^(-|\*)/.test(blockText)
-      const unorderedListStyle = config.unorderedListStyle?.(context)
+      const unorderedListStyle = config.unorderedListStyle?.(snapshot.context)
       const caretAtTheEndOfUnorderedList = blockOffset.offset === 1
 
       if (
@@ -441,7 +440,7 @@ export function createMarkdownBehaviors(config: MarkdownBehaviorsConfig) {
       }
 
       const looksLikeOrderedList = /^1\./.test(blockText)
-      const orderedListStyle = config.orderedListStyle?.(context)
+      const orderedListStyle = config.orderedListStyle?.(snapshot.context)
       const caretAtTheEndOfOrderedList = blockOffset.offset === 2
 
       if (

package/src/behaviors/behavior.types.ts

@@ -6,9 +6,10 @@ import type {
 import type {TextUnit} from 'slate'
 import type {TextInsertTextOptions} from 'slate/dist/interfaces/transforms/text'
 import type {ConverterEvent} from '../converters/converter.types'
-import type {EditorContext} from '../editor/editor-snapshot'
+import type {EditorContext, EditorSnapshot} from '../editor/editor-snapshot'
 import type {MIMEType} from '../internal-utils/mime-type'
 import type {OmitFromUnion, PickFromUnion} from '../type-utils'
+import type {BlockOffset} from '../types/block-offset'
 import type {EditorSelection, PortableTextSlateEditor} from '../types/editor'
 
 /**
@@ -333,11 +334,13 @@ export type Behavior<
 /**
  * @beta
  */
-export type BehaviorGuard<TBehaviorEvent, TGuardResponse> = ({
-  context,
-  event,
-}: {
+export type BehaviorGuard<TBehaviorEvent, TGuardResponse> = (payload: {
+  /**
+   * @deprecated
+   * Use `snapshot` instead
+   */
   context: EditorContext
+  snapshot: EditorSnapshot
   event: TBehaviorEvent
 }) => TGuardResponse | false
 
@@ -345,11 +348,13 @@ export type BehaviorGuard<TBehaviorEvent, TGuardResponse> = ({
  * @beta
  */
 export type BehaviorActionIntendSet<TBehaviorEvent, TGuardResponse> = (
-  {
-    context,
-    event,
-  }: {
+  payload: {
+    /**
+     * @deprecated
+     * Use `snapshot` instead
+     */
     context: EditorContext
+    snapshot: EditorSnapshot
     event: TBehaviorEvent
   },
   guardResponse: TGuardResponse,
@@ -400,11 +405,3 @@ export function defineBehavior<
 ): Behavior {
   return behavior as unknown as Behavior
 }
-
-/**
- * @beta
- */
-export type BlockOffset = {
-  path: [KeyedSegment]
-  offset: number
-}

package/src/behaviors/index.ts

@@ -28,7 +28,6 @@ export {
   type BehaviorActionIntendSet,
   type BehaviorEvent,
   type BehaviorGuard,
-  type BlockOffset,
   type CustomBehaviorEvent,
   type NativeBehaviorEvent,
   type SyntheticBehaviorEvent,

package/src/converters/converter.json.ts

@@ -2,8 +2,8 @@ import {defineConverter} from './converter.types'
 
 export const converterJson = defineConverter({
   mimeType: 'application/json',
-  serialize: ({context, event}) => {
-    const portableTextConverter = context.converters.find(
+  serialize: ({snapshot, event}) => {
+    const portableTextConverter = snapshot.context.converters.find(
       (converter) => converter.mimeType === 'application/x-portable-text',
     )
 
@@ -17,7 +17,7 @@ export const converterJson = defineConverter({
     }
 
     const serializationEvent = portableTextConverter.serialize({
-      context,
+      snapshot,
       event,
     })
 
@@ -27,8 +27,8 @@ export const converterJson = defineConverter({
       originEvent: event.originEvent,
     }
   },
-  deserialize: ({context, event}) => {
-    const portableTextConverter = context.converters.find(
+  deserialize: ({snapshot, event}) => {
+    const portableTextConverter = snapshot.context.converters.find(
       (converter) => converter.mimeType === 'application/x-portable-text',
     )
 
@@ -41,7 +41,7 @@ export const converterJson = defineConverter({
     }
 
     const deserializationEvent = portableTextConverter.deserialize({
-      context,
+      snapshot,
       event,
     })
 

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

@@ -4,26 +4,24 @@ import {
   defineSchema,
   type SchemaDefinition,
 } from '../editor/define-schema'
-import {createTestKeyGenerator} from '../internal-utils/test-key-generator'
+import {createTestSnapshot} from '../internal-utils/create-test-snapshot'
 import {converterPortableText} from './converter.portable-text'
 import {coreConverters} from './converters.core'
 
-function createContext(schema: SchemaDefinition) {
-  return {
-    converters: coreConverters,
-    activeDecorators: [],
-    keyGenerator: createTestKeyGenerator(),
-    schema: compileSchemaDefinition(schema),
-    value: [],
-    selection: null,
-  }
+function createSnapshot(schema: SchemaDefinition) {
+  return createTestSnapshot({
+    context: {
+      converters: coreConverters,
+      schema: compileSchemaDefinition(schema),
+    },
+  })
 }
 
 describe(converterPortableText.deserialize, () => {
   test('non-array', () => {
     expect(
       converterPortableText.deserialize({
-        context: createContext(defineSchema({})),
+        snapshot: createSnapshot(defineSchema({})),
         event: {
           type: 'deserialize',
           data: JSON.stringify(''),
@@ -37,7 +35,7 @@ describe(converterPortableText.deserialize, () => {
   test('empty array', () => {
     expect(
       converterPortableText.deserialize({
-        context: createContext(defineSchema({})),
+        snapshot: createSnapshot(defineSchema({})),
         event: {
           type: 'deserialize',
           data: JSON.stringify([]),
@@ -51,7 +49,7 @@ describe(converterPortableText.deserialize, () => {
   test('no known array entries', () => {
     expect(
       converterPortableText.deserialize({
-        context: createContext(defineSchema({})),
+        snapshot: createSnapshot(defineSchema({})),
         event: {
           type: 'deserialize',
           data: JSON.stringify([{foo: 'bar'}]),
@@ -65,7 +63,7 @@ describe(converterPortableText.deserialize, () => {
   test('some known array entries', () => {
     expect(
       converterPortableText.deserialize({
-        context: createContext(defineSchema({})),
+        snapshot: createSnapshot(defineSchema({})),
         event: {
           type: 'deserialize',
           data: JSON.stringify([{_type: 'block', children: []}, {foo: 'bar'}]),
@@ -93,7 +91,7 @@ describe(converterPortableText.deserialize, () => {
   test('no marks or markDefs', () => {
     expect(
       converterPortableText.deserialize({
-        context: createContext(defineSchema({})),
+        snapshot: createSnapshot(defineSchema({})),
         event: {
           type: 'deserialize',
           data: JSON.stringify([
@@ -129,7 +127,7 @@ describe(converterPortableText.deserialize, () => {
   test('unknown block object', () => {
     expect(
       converterPortableText.deserialize({
-        context: createContext(defineSchema({})),
+        snapshot: createSnapshot(defineSchema({})),
         event: {
           type: 'deserialize',
           data: JSON.stringify([{_type: 'foo'}]),
@@ -143,7 +141,7 @@ describe(converterPortableText.deserialize, () => {
   test('known block object', () => {
     expect(
       converterPortableText.deserialize({
-        context: createContext(
+        snapshot: createSnapshot(
           defineSchema({
             blockObjects: [{name: 'image'}],
           }),
@@ -173,7 +171,7 @@ describe(converterPortableText.deserialize, () => {
   test('unknown inline object', () => {
     expect(
       converterPortableText.deserialize({
-        context: createContext(defineSchema({})),
+        snapshot: createSnapshot(defineSchema({})),
         event: {
           type: 'deserialize',
           data: JSON.stringify([
@@ -204,7 +202,7 @@ describe(converterPortableText.deserialize, () => {
   test('known inline object', () => {
     expect(
       converterPortableText.deserialize({
-        context: createContext(
+        snapshot: createSnapshot(
           defineSchema({
             inlineObjects: [{name: 'stock-ticker'}],
           }),
@@ -231,7 +229,7 @@ describe(converterPortableText.deserialize, () => {
 
   test('no style', () => {
     const deserializedEvent = converterPortableText.deserialize({
-      context: createContext(defineSchema({})),
+      snapshot: createSnapshot(defineSchema({})),
       event: {
         type: 'deserialize',
         data: JSON.stringify([
@@ -267,7 +265,7 @@ describe(converterPortableText.deserialize, () => {
 
   test('default style', () => {
     const deserializedEvent = converterPortableText.deserialize({
-      context: createContext(defineSchema({styles: [{name: 'h1'}]})),
+      snapshot: createSnapshot(defineSchema({styles: [{name: 'h1'}]})),
       event: {
         type: 'deserialize',
         data: JSON.stringify([
@@ -303,7 +301,7 @@ describe(converterPortableText.deserialize, () => {
 
   test('unknown style', () => {
     const deserializedEvent = converterPortableText.deserialize({
-      context: createContext(defineSchema({})),
+      snapshot: createSnapshot(defineSchema({})),
       event: {
         type: 'deserialize',
         data: JSON.stringify([
@@ -340,7 +338,7 @@ describe(converterPortableText.deserialize, () => {
 
   test('known style', () => {
     const deserializedEvent = converterPortableText.deserialize({
-      context: createContext(
+      snapshot: createSnapshot(
         defineSchema({
           styles: [{name: 'h1'}],
         }),
@@ -381,7 +379,7 @@ describe(converterPortableText.deserialize, () => {
 
   test('unknown listItem', () => {
     const deserializedEvent = converterPortableText.deserialize({
-      context: createContext(defineSchema({})),
+      snapshot: createSnapshot(defineSchema({})),
       event: {
         type: 'deserialize',
         data: JSON.stringify([
@@ -420,7 +418,7 @@ describe(converterPortableText.deserialize, () => {
 
   test('known listItem', () => {
     const deserializedEvent = converterPortableText.deserialize({
-      context: createContext(
+      snapshot: createSnapshot(
         defineSchema({
           lists: [{name: 'bullet'}],
         }),
@@ -465,7 +463,7 @@ describe(converterPortableText.deserialize, () => {
   test('unknown annotations', () => {
     expect(
       converterPortableText.deserialize({
-        context: createContext(defineSchema({})),
+        snapshot: createSnapshot(defineSchema({})),
         event: {
           type: 'deserialize',
           data: JSON.stringify([
@@ -523,7 +521,7 @@ describe(converterPortableText.deserialize, () => {
   test('known annotations', () => {
     expect(
       converterPortableText.deserialize({
-        context: createContext(
+        snapshot: createSnapshot(
           defineSchema({
             annotations: [{name: 'link'}],
           }),
@@ -592,7 +590,7 @@ describe(converterPortableText.deserialize, () => {
   test('unknown decorators', () => {
     expect(
       converterPortableText.deserialize({
-        context: createContext(defineSchema({})),
+        snapshot: createSnapshot(defineSchema({})),
         event: {
           type: 'deserialize',
           data: JSON.stringify([
@@ -638,7 +636,7 @@ describe(converterPortableText.deserialize, () => {
   test('known decorators', () => {
     expect(
       converterPortableText.deserialize({
-        context: createContext(
+        snapshot: createSnapshot(
           defineSchema({
             decorators: [{name: 'strong'}],
           }),

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

@@ -4,8 +4,8 @@ import {defineConverter} from './converter.types'
 
 export const converterPortableText = defineConverter({
   mimeType: 'application/x-portable-text',
-  serialize: ({context, event}) => {
-    if (!context.selection) {
+  serialize: ({snapshot, event}) => {
+    if (!snapshot.context.selection) {
       return {
         type: 'serialization.failure',
         mimeType: 'application/x-portable-text',
@@ -15,8 +15,8 @@ export const converterPortableText = defineConverter({
     }
 
     const blocks = sliceBlocks({
-      blocks: context.value,
-      selection: context.selection,
+      blocks: snapshot.context.value,
+      selection: snapshot.context.selection,
     })
 
     return {
@@ -26,7 +26,7 @@ export const converterPortableText = defineConverter({
       originEvent: event.originEvent,
     }
   },
-  deserialize: ({context, event}) => {
+  deserialize: ({snapshot, event}) => {
     const blocks = JSON.parse(event.data)
 
     if (!Array.isArray(blocks)) {
@@ -39,9 +39,15 @@ export const converterPortableText = defineConverter({
 
     const parsedBlocks = blocks.flatMap((block) => {
       const parsedBlock = parseBlock({
-        context,
+        context: snapshot.context,
         block,
-        options: {refreshKeys: true},
+        options: {
+          /**
+           * If we are dragging internally then we would like to keep the
+           * dropped portable text as is.
+           */
+          refreshKeys: !snapshot.beta.hasTag?.('dragging internally'),
+        },
       })
       return parsedBlock ? [parsedBlock] : []
     })