@portabletext/editor 1.31.2 → 1.33.0

package/src/editor/plugins/createWithUndoRedo.ts

@@ -20,6 +20,7 @@ import {
   type Descendant,
   type SelectionOperation,
 } from 'slate'
+import type {BehaviorActionImplementation} from '../../behavior-actions/behavior.actions'
 import {debugWithName} from '../../internal-utils/debug'
 import {fromSlateValue} from '../../internal-utils/values'
 import {isChangingRemotely} from '../../internal-utils/withChanges'
@@ -33,6 +34,7 @@ import {
 } from '../../internal-utils/withUndoRedo'
 import type {PortableTextSlateEditor} from '../../types/editor'
 import type {EditorActor} from '../editor-machine'
+import {getCurrentBehaviorActionSetId} from '../with-applying-behavior-actions'
 
 const debug = debugWithName('plugin:withUndoRedo')
 const debugVerbose = debug.enabled && false
@@ -78,6 +80,8 @@ export function createWithUndoRedo(
       blockSchemaType.name,
     )
     const remotePatches = getRemotePatches(editor)
+    let previousBehaviorActionIntendSetId =
+      getCurrentBehaviorActionSetId(editor)
 
     options.subscriptions.push(() => {
       debug('Subscribing to patches')
@@ -112,7 +116,9 @@ export function createWithUndoRedo(
     })
 
     editor.history = {undos: [], redos: []}
+
     const {apply} = editor
+
     editor.apply = (op: Operation) => {
       if (editorActor.getSnapshot().matches({'edit mode': 'read only'})) {
         apply(op)
@@ -145,12 +151,28 @@ export function createWithUndoRedo(
       const overwrite = shouldOverwrite(op, lastOp)
       const save = isSaving(editor)
 
-      let merge = true
+      const currentBehaviorActionIntendSetId =
+        getCurrentBehaviorActionSetId(editor)
+
+      let merge =
+        currentBehaviorActionIntendSetId !== undefined &&
+        previousBehaviorActionIntendSetId === undefined
+          ? false
+          : currentBehaviorActionIntendSetId !== undefined &&
+              previousBehaviorActionIntendSetId !== undefined
+            ? currentBehaviorActionIntendSetId ===
+              previousBehaviorActionIntendSetId
+            : true
+
       if (save) {
         if (!step) {
           merge = false
         } else if (operations.length === 0) {
-          merge = shouldMerge(op, lastOp) || overwrite
+          merge =
+            currentBehaviorActionIntendSetId === undefined &&
+            previousBehaviorActionIntendSetId === undefined
+              ? shouldMerge(op, lastOp) || overwrite
+              : merge
         }
 
         if (step && merge) {
@@ -177,123 +199,126 @@ export function createWithUndoRedo(
           history.redos = []
         }
       }
+
+      previousBehaviorActionIntendSetId = currentBehaviorActionIntendSetId
+
       apply(op)
     }
 
-    editor.undo = () => {
-      if (editorActor.getSnapshot().matches({'edit mode': 'read only'})) {
-        return
-      }
-      const {undos} = editor.history
-      if (undos.length > 0) {
-        const step = undos[undos.length - 1]
-        debug('Undoing', step)
-        if (step.operations.length > 0) {
-          const otherPatches = remotePatches.filter(
-            (item) => item.time >= step.timestamp,
-          )
-          let transformedOperations = step.operations
-          otherPatches.forEach((item) => {
-            transformedOperations = flatten(
-              transformedOperations.map((op) =>
-                transformOperation(
-                  editor,
-                  item.patch,
-                  op,
-                  item.snapshot,
-                  item.previousSnapshot,
-                ),
-              ),
-            )
-          })
-          const reversedOperations = transformedOperations
-            .map(Operation.inverse)
-            .reverse()
-
-          try {
-            Editor.withoutNormalizing(editor, () => {
-              withUndoing(editor, () => {
-                withoutSaving(editor, () => {
-                  reversedOperations.forEach((op) => {
-                    editor.apply(op)
-                  })
-                })
+    // Plugin return
+    return editor
+  }
+}
+
+export const historyUndoActionImplementation: BehaviorActionImplementation<
+  'history.undo'
+> = ({action}) => {
+  const editor = action.editor
+  const {undos} = editor.history
+  const remotePatches = getRemotePatches(editor)
+
+  if (undos.length > 0) {
+    const step = undos[undos.length - 1]
+    debug('Undoing', step)
+    if (step.operations.length > 0) {
+      const otherPatches = remotePatches.filter(
+        (item) => item.time >= step.timestamp,
+      )
+      let transformedOperations = step.operations
+      otherPatches.forEach((item) => {
+        transformedOperations = flatten(
+          transformedOperations.map((op) =>
+            transformOperation(
+              editor,
+              item.patch,
+              op,
+              item.snapshot,
+              item.previousSnapshot,
+            ),
+          ),
+        )
+      })
+      const reversedOperations = transformedOperations
+        .map(Operation.inverse)
+        .reverse()
+
+      try {
+        Editor.withoutNormalizing(editor, () => {
+          withUndoing(editor, () => {
+            withoutSaving(editor, () => {
+              reversedOperations.forEach((op) => {
+                editor.apply(op)
               })
             })
-            editor.normalize()
-            editor.onChange()
-          } catch (err) {
-            debug('Could not perform undo step', err)
-            remotePatches.splice(0, remotePatches.length)
-            Transforms.deselect(editor)
-            editor.history = {undos: [], redos: []}
-            SAVING.set(editor, true)
-            setIsUndoing(editor, false)
-            editor.onChange()
-            return
-          }
-          editor.history.redos.push(step)
-          editor.history.undos.pop()
-        }
+          })
+        })
+      } catch (err) {
+        debug('Could not perform undo step', err)
+        remotePatches.splice(0, remotePatches.length)
+        Transforms.deselect(editor)
+        editor.history = {undos: [], redos: []}
+        SAVING.set(editor, true)
+        setIsUndoing(editor, false)
+        editor.onChange()
+        return
       }
+      editor.history.redos.push(step)
+      editor.history.undos.pop()
     }
+  }
+}
 
-    editor.redo = () => {
-      if (editorActor.getSnapshot().matches({'edit mode': 'read only'})) {
-        return
-      }
-      const {redos} = editor.history
-      if (redos.length > 0) {
-        const step = redos[redos.length - 1]
-        debug('Redoing', step)
-        if (step.operations.length > 0) {
-          const otherPatches = remotePatches.filter(
-            (item) => item.time >= step.timestamp,
-          )
-          let transformedOperations = step.operations
-          otherPatches.forEach((item) => {
-            transformedOperations = flatten(
-              transformedOperations.map((op) =>
-                transformOperation(
-                  editor,
-                  item.patch,
-                  op,
-                  item.snapshot,
-                  item.previousSnapshot,
-                ),
-              ),
-            )
-          })
-          try {
-            Editor.withoutNormalizing(editor, () => {
-              withRedoing(editor, () => {
-                withoutSaving(editor, () => {
-                  transformedOperations.forEach((op) => {
-                    editor.apply(op)
-                  })
-                })
+export const historyRedoActionImplementation: BehaviorActionImplementation<
+  'history.redo'
+> = ({action}) => {
+  const editor = action.editor
+  const {redos} = editor.history
+  const remotePatches = getRemotePatches(editor)
+
+  if (redos.length > 0) {
+    const step = redos[redos.length - 1]
+    debug('Redoing', step)
+    if (step.operations.length > 0) {
+      const otherPatches = remotePatches.filter(
+        (item) => item.time >= step.timestamp,
+      )
+      let transformedOperations = step.operations
+      otherPatches.forEach((item) => {
+        transformedOperations = flatten(
+          transformedOperations.map((op) =>
+            transformOperation(
+              editor,
+              item.patch,
+              op,
+              item.snapshot,
+              item.previousSnapshot,
+            ),
+          ),
+        )
+      })
+      try {
+        Editor.withoutNormalizing(editor, () => {
+          withRedoing(editor, () => {
+            withoutSaving(editor, () => {
+              transformedOperations.forEach((op) => {
+                editor.apply(op)
               })
             })
-            editor.normalize()
-            editor.onChange()
-          } catch (err) {
-            debug('Could not perform redo step', err)
-            remotePatches.splice(0, remotePatches.length)
-            Transforms.deselect(editor)
-            editor.history = {undos: [], redos: []}
-            SAVING.set(editor, true)
-            setIsRedoing(editor, false)
-            editor.onChange()
-            return
-          }
-          editor.history.undos.push(step)
-          editor.history.redos.pop()
-        }
+          })
+        })
+      } catch (err) {
+        debug('Could not perform redo step', err)
+        remotePatches.splice(0, remotePatches.length)
+        Transforms.deselect(editor)
+        editor.history = {undos: [], redos: []}
+        SAVING.set(editor, true)
+        setIsRedoing(editor, false)
+        editor.onChange()
+        return
       }
+      editor.history.undos.push(step)
+      editor.history.redos.pop()
     }
-
-    // Plugin return
-    return editor
   }
 }
 

package/src/editor/with-applying-behavior-actions.ts

@@ -1,15 +1,39 @@
-import type {Editor} from 'slate'
+import {Editor} from 'slate'
+import {defaultKeyGenerator} from './key-generator'
 
 const IS_APPLYING_BEHAVIOR_ACTIONS: WeakMap<Editor, boolean | undefined> =
   new WeakMap()
 
 export function withApplyingBehaviorActions(editor: Editor, fn: () => void) {
-  const prev = isApplyingBehaviorActions(editor)
+  const prev = IS_APPLYING_BEHAVIOR_ACTIONS.get(editor)
   IS_APPLYING_BEHAVIOR_ACTIONS.set(editor, true)
-  fn()
+  Editor.withoutNormalizing(editor, fn)
   IS_APPLYING_BEHAVIOR_ACTIONS.set(editor, prev)
 }
 
 export function isApplyingBehaviorActions(editor: Editor) {
   return IS_APPLYING_BEHAVIOR_ACTIONS.get(editor) ?? false
 }
+
+////////
+
+const CURRENT_BEHAVIOR_ACTION_INTEND_SET: WeakMap<
+  Editor,
+  {actionSetId: string} | undefined
+> = new WeakMap()
+
+export function withApplyingBehaviorActionIntendSet(
+  editor: Editor,
+  fn: () => void,
+) {
+  const current = CURRENT_BEHAVIOR_ACTION_INTEND_SET.get(editor)
+  CURRENT_BEHAVIOR_ACTION_INTEND_SET.set(editor, {
+    actionSetId: defaultKeyGenerator(),
+  })
+  withApplyingBehaviorActions(editor, fn)
+  CURRENT_BEHAVIOR_ACTION_INTEND_SET.set(editor, current)
+}
+
+export function getCurrentBehaviorActionSetId(editor: Editor) {
+  return CURRENT_BEHAVIOR_ACTION_INTEND_SET.get(editor)?.actionSetId
+}

package/src/plugins/plugin.markdown.tsx

@@ -3,12 +3,17 @@ import {
   createMarkdownBehaviors,
   type MarkdownBehaviorsConfig,
 } from '../behaviors/behavior.markdown'
+import {
+  useMarkdownEmphasisBehaviors,
+  type MarkdownEmphasisBehaviorsConfig,
+} from '../behaviors/behavior.markdown-emphasis'
 import {useEditor} from '../editor/editor-provider'
 
 /**
  * @beta
  */
-export type MarkdownPluginConfig = MarkdownBehaviorsConfig
+export type MarkdownPluginConfig = MarkdownBehaviorsConfig &
+  MarkdownEmphasisBehaviorsConfig
 
 /**
  * @beta
@@ -25,6 +30,10 @@ export type MarkdownPluginConfig = MarkdownBehaviorsConfig
  *    <EditorProvider>
  *      <MarkdownPlugin
  *        config={{
+ *          boldDecorator: ({schema}) =>
+ *            schema.decorators.find((decorator) => decorator.value === 'strong')?.value,
+ *          italicDecorator: ({schema}) =>
+ *            schema.decorators.find((decorator) => decorator.value === 'em')?.value,
  *          horizontalRuleObject: ({schema}) => {
  *            const name = schema.blockObjects.find(
  *              (object) => object.name === 'break',
@@ -51,6 +60,7 @@ export type MarkdownPluginConfig = MarkdownBehaviorsConfig
  */
 export function MarkdownPlugin(props: {config: MarkdownPluginConfig}) {
   const editor = useEditor()
+  useMarkdownEmphasisBehaviors({config: props.config})
 
   useEffect(() => {
     const behaviors = createMarkdownBehaviors(props.config)

package/src/selectors/index.ts

@@ -9,6 +9,10 @@ export type {
 export {getActiveAnnotations} from './selector.get-active-annotations'
 export {getActiveListItem} from './selector.get-active-list-item'
 export {getActiveStyle} from './selector.get-active-style'
+export {getAnchorBlock} from './selector.get-anchor-block'
+export {getAnchorChild} from './selector.get-anchor-child'
+export {getAnchorSpan} from './selector.get-anchor-span'
+export {getAnchorTextBlock} from './selector.get-anchor-text-block'
 export {getBlockOffsets} from './selector.get-block-offsets'
 export {getCaretWordSelection} from './selector.get-caret-word-selection'
 export {getNextInlineObject} from './selector.get-next-inline-object'
@@ -20,6 +24,7 @@ export {getSelectionEndPoint} from './selector.get-selection-end-point'
 export {getSelectionStartPoint} from './selector.get-selection-start-point'
 export {getSelectionText} from './selector.get-selection-text'
 export {getBlockTextBefore} from './selector.get-text-before'
+export {getTrimmedSelection} from './selector.get-trimmed-selection'
 export {getValue} from './selector.get-value'
 export {isActiveAnnotation} from './selector.is-active-annotation'
 export {isActiveDecorator} from './selector.is-active-decorator'

package/src/selectors/selector.get-anchor-block.ts

@@ -0,0 +1,22 @@
+import type {KeyedSegment, PortableTextBlock} from '@sanity/types'
+import type {EditorSelector} from '../editor/editor-selector'
+import {isKeyedSegment} from '../utils'
+
+/**
+ * @public
+ */
+export const getAnchorBlock: EditorSelector<
+  {node: PortableTextBlock; path: [KeyedSegment]} | undefined
+> = ({context}) => {
+  const key = context.selection
+    ? isKeyedSegment(context.selection.anchor.path[0])
+      ? context.selection.anchor.path[0]._key
+      : undefined
+    : undefined
+
+  const node = key
+    ? context.value.find((block) => block._key === key)
+    : undefined
+
+  return node && key ? {node, path: [{_key: key}]} : undefined
+}

package/src/selectors/selector.get-anchor-child.ts

@@ -0,0 +1,36 @@
+import type {KeyedSegment} from '@portabletext/patches'
+import type {PortableTextObject, PortableTextSpan} from '@sanity/types'
+import type {EditorSelector} from '../editor/editor-selector'
+import {isKeyedSegment} from '../utils'
+import {getAnchorTextBlock} from './selector.get-anchor-text-block'
+
+/**
+ * @public
+ */
+export const getAnchorChild: EditorSelector<
+  | {
+      node: PortableTextObject | PortableTextSpan
+      path: [KeyedSegment, 'children', KeyedSegment]
+    }
+  | undefined
+> = ({context}) => {
+  const anchorBlock = getAnchorTextBlock({context})
+
+  if (!anchorBlock) {
+    return undefined
+  }
+
+  const key = context.selection
+    ? isKeyedSegment(context.selection.anchor.path[2])
+      ? context.selection.anchor.path[2]._key
+      : undefined
+    : undefined
+
+  const node = key
+    ? anchorBlock.node.children.find((span) => span._key === key)
+    : undefined
+
+  return node && key
+    ? {node, path: [...anchorBlock.path, 'children', {_key: key}]}
+    : undefined
+}

package/src/selectors/selector.get-anchor-span.ts

@@ -0,0 +1,18 @@
+import type {KeyedSegment} from '@portabletext/patches'
+import {isPortableTextSpan, type PortableTextSpan} from '@sanity/types'
+import type {EditorSelector} from '../editor/editor-selector'
+import {getAnchorChild} from './selector.get-anchor-child'
+
+/**
+ * @public
+ */
+export const getAnchorSpan: EditorSelector<
+  | {node: PortableTextSpan; path: [KeyedSegment, 'children', KeyedSegment]}
+  | undefined
+> = ({context}) => {
+  const anchorChild = getAnchorChild({context})
+
+  return anchorChild && isPortableTextSpan(anchorChild.node)
+    ? {node: anchorChild.node, path: anchorChild.path}
+    : undefined
+}

package/src/selectors/selector.get-anchor-text-block.ts

@@ -0,0 +1,20 @@
+import {
+  isPortableTextTextBlock,
+  type KeyedSegment,
+  type PortableTextTextBlock,
+} from '@sanity/types'
+import type {EditorSelector} from '../editor/editor-selector'
+import {getAnchorBlock} from './selector.get-anchor-block'
+
+/**
+ * @public
+ */
+export const getAnchorTextBlock: EditorSelector<
+  {node: PortableTextTextBlock; path: [KeyedSegment]} | undefined
+> = ({context}) => {
+  const anchorBlock = getAnchorBlock({context})
+
+  return anchorBlock && isPortableTextTextBlock(anchorBlock.node)
+    ? {node: anchorBlock.node, path: anchorBlock.path}
+    : undefined
+}