@portabletext/editor 1.5.1 → 1.5.3

package/README.md

@@ -57,7 +57,7 @@ Use `useEditor` to create an `editor` and pass that into `PortableTextEditor`. U
 
 ```tsx
 function App() {
-  // Creata an editor
+  // Create an editor
   const editor = useEditor({
     schemaDefinition,
   })

package/lib/index.d.mts

@@ -297,6 +297,76 @@ export declare type ConnectionChange = {
   value: 'online' | 'offline'
 }
 
+/**
+ * @alpha
+ */
+export declare const coreBehavior: {
+  softReturn: Behavior<
+    | 'insert break'
+    | 'insert soft break'
+    | 'delete backward'
+    | 'delete forward'
+    | 'insert text',
+    true
+  >
+  blockObjects: {
+    breakingBlockObject: Behavior<
+      | 'insert break'
+      | 'insert soft break'
+      | 'delete backward'
+      | 'delete forward'
+      | 'insert text',
+      true
+    >
+    deletingEmptyTextBlockAfterBlockObject: Behavior<
+      | 'insert break'
+      | 'insert soft break'
+      | 'delete backward'
+      | 'delete forward'
+      | 'insert text',
+      true
+    >
+    deletingEmptyTextBlockBeforeBlockObject: Behavior<
+      | 'insert break'
+      | 'insert soft break'
+      | 'delete backward'
+      | 'delete forward'
+      | 'insert text',
+      true
+    >
+  }
+  lists: {
+    clearListOnBackspace: Behavior<
+      | 'insert break'
+      | 'insert soft break'
+      | 'delete backward'
+      | 'delete forward'
+      | 'insert text',
+      true
+    >
+    unindentListOnBackspace: Behavior<
+      | 'insert break'
+      | 'insert soft break'
+      | 'delete backward'
+      | 'delete forward'
+      | 'insert text',
+      true
+    >
+  }
+}
+
+/**
+ * @alpha
+ */
+export declare const coreBehaviors: Behavior<
+  | 'insert break'
+  | 'insert soft break'
+  | 'delete backward'
+  | 'delete forward'
+  | 'insert text',
+  true
+>[]
+
 /**
  * @internal
  */
@@ -313,10 +383,10 @@ export declare type createEditorOptions = {
 export declare function createMarkdownBehaviors(
   config: MarkdownBehaviorsConfig,
 ): Behavior<
+  | 'insert break'
+  | 'insert soft break'
   | 'delete backward'
   | 'delete forward'
-  | 'insert soft break'
-  | 'insert break'
   | 'insert text',
   true
 >[]
@@ -909,14 +979,7 @@ export declare const editorMachine: StateMachine<
         AnyEventObject
       >
     }) => {
-      behaviors: Behavior<
-        | 'delete backward'
-        | 'delete forward'
-        | 'insert soft break'
-        | 'insert break'
-        | 'insert text',
-        true
-      >[]
+      behaviors: Behavior[]
       keyGenerator: () => string
       pendingEvents: never[]
       schema: PortableTextMemberSchemaTypes
@@ -4091,14 +4154,7 @@ export declare function useEditor(config: EditorConfig): Actor<
           AnyEventObject
         >
       }) => {
-        behaviors: Behavior<
-          | 'delete backward'
-          | 'delete forward'
-          | 'insert soft break'
-          | 'insert break'
-          | 'insert text',
-          true
-        >[]
+        behaviors: Behavior[]
         keyGenerator: () => string
         pendingEvents: never[]
         schema: PortableTextMemberSchemaTypes

package/lib/index.d.ts

@@ -297,6 +297,76 @@ export declare type ConnectionChange = {
   value: 'online' | 'offline'
 }
 
+/**
+ * @alpha
+ */
+export declare const coreBehavior: {
+  softReturn: Behavior<
+    | 'insert break'
+    | 'insert soft break'
+    | 'delete backward'
+    | 'delete forward'
+    | 'insert text',
+    true
+  >
+  blockObjects: {
+    breakingBlockObject: Behavior<
+      | 'insert break'
+      | 'insert soft break'
+      | 'delete backward'
+      | 'delete forward'
+      | 'insert text',
+      true
+    >
+    deletingEmptyTextBlockAfterBlockObject: Behavior<
+      | 'insert break'
+      | 'insert soft break'
+      | 'delete backward'
+      | 'delete forward'
+      | 'insert text',
+      true
+    >
+    deletingEmptyTextBlockBeforeBlockObject: Behavior<
+      | 'insert break'
+      | 'insert soft break'
+      | 'delete backward'
+      | 'delete forward'
+      | 'insert text',
+      true
+    >
+  }
+  lists: {
+    clearListOnBackspace: Behavior<
+      | 'insert break'
+      | 'insert soft break'
+      | 'delete backward'
+      | 'delete forward'
+      | 'insert text',
+      true
+    >
+    unindentListOnBackspace: Behavior<
+      | 'insert break'
+      | 'insert soft break'
+      | 'delete backward'
+      | 'delete forward'
+      | 'insert text',
+      true
+    >
+  }
+}
+
+/**
+ * @alpha
+ */
+export declare const coreBehaviors: Behavior<
+  | 'insert break'
+  | 'insert soft break'
+  | 'delete backward'
+  | 'delete forward'
+  | 'insert text',
+  true
+>[]
+
 /**
  * @internal
  */
@@ -313,10 +383,10 @@ export declare type createEditorOptions = {
 export declare function createMarkdownBehaviors(
   config: MarkdownBehaviorsConfig,
 ): Behavior<
+  | 'insert break'
+  | 'insert soft break'
   | 'delete backward'
   | 'delete forward'
-  | 'insert soft break'
-  | 'insert break'
   | 'insert text',
   true
 >[]
@@ -909,14 +979,7 @@ export declare const editorMachine: StateMachine<
         AnyEventObject
       >
     }) => {
-      behaviors: Behavior<
-        | 'delete backward'
-        | 'delete forward'
-        | 'insert soft break'
-        | 'insert break'
-        | 'insert text',
-        true
-      >[]
+      behaviors: Behavior[]
       keyGenerator: () => string
       pendingEvents: never[]
       schema: PortableTextMemberSchemaTypes
@@ -4091,14 +4154,7 @@ export declare function useEditor(config: EditorConfig): Actor<
           AnyEventObject
         >
       }) => {
-        behaviors: Behavior<
-          | 'delete backward'
-          | 'delete forward'
-          | 'insert soft break'
-          | 'insert break'
-          | 'insert text',
-          true
-        >[]
+        behaviors: Behavior[]
         keyGenerator: () => string
         pendingEvents: never[]
         schema: PortableTextMemberSchemaTypes

package/lib/index.esm.js

@@ -140,6 +140,148 @@ function getNextBlock(context) {
 function isEmptyTextBlock(block) {
   return block.children.length === 1 && block.children[0].text === "";
 }
+const breakingBlockObject = {
+  on: "insert break",
+  guard: ({
+    context
+  }) => !!getFocusBlockObject(context),
+  actions: [() => [{
+    type: "insert text block",
+    decorators: []
+  }]]
+}, deletingEmptyTextBlockAfterBlockObject = {
+  on: "delete backward",
+  guard: ({
+    context
+  }) => {
+    const focusTextBlock = getFocusTextBlock(context), selectionCollapsed = selectionIsCollapsed(context), previousBlock = getPreviousBlock(context);
+    return !focusTextBlock || !selectionCollapsed || !previousBlock ? !1 : isEmptyTextBlock(focusTextBlock.node) && !isPortableTextTextBlock(previousBlock.node) ? {
+      focusTextBlock,
+      previousBlock
+    } : !1;
+  },
+  actions: [(_, {
+    focusTextBlock,
+    previousBlock
+  }) => [{
+    type: "delete",
+    selection: {
+      anchor: {
+        path: focusTextBlock.path,
+        offset: 0
+      },
+      focus: {
+        path: focusTextBlock.path,
+        offset: 0
+      }
+    }
+  }, {
+    type: "select",
+    selection: {
+      anchor: {
+        path: previousBlock.path,
+        offset: 0
+      },
+      focus: {
+        path: previousBlock.path,
+        offset: 0
+      }
+    }
+  }]]
+}, deletingEmptyTextBlockBeforeBlockObject = {
+  on: "delete forward",
+  guard: ({
+    context
+  }) => {
+    const focusTextBlock = getFocusTextBlock(context), selectionCollapsed = selectionIsCollapsed(context), nextBlock = getNextBlock(context);
+    return !focusTextBlock || !selectionCollapsed || !nextBlock ? !1 : isEmptyTextBlock(focusTextBlock.node) && !isPortableTextTextBlock(nextBlock.node) ? {
+      focusTextBlock,
+      nextBlock
+    } : !1;
+  },
+  actions: [(_, {
+    focusTextBlock,
+    nextBlock
+  }) => [{
+    type: "delete",
+    selection: {
+      anchor: {
+        path: focusTextBlock.path,
+        offset: 0
+      },
+      focus: {
+        path: focusTextBlock.path,
+        offset: 0
+      }
+    }
+  }, {
+    type: "select",
+    selection: {
+      anchor: {
+        path: nextBlock.path,
+        offset: 0
+      },
+      focus: {
+        path: nextBlock.path,
+        offset: 0
+      }
+    }
+  }]]
+}, coreBlockObjectBehaviors = {
+  breakingBlockObject,
+  deletingEmptyTextBlockAfterBlockObject,
+  deletingEmptyTextBlockBeforeBlockObject
+}, clearListOnBackspace = {
+  on: "delete backward",
+  guard: ({
+    context
+  }) => {
+    const selectionCollapsed = selectionIsCollapsed(context), focusTextBlock = getFocusTextBlock(context), focusSpan = getFocusSpan(context);
+    return !selectionCollapsed || !focusTextBlock || !focusSpan ? !1 : focusTextBlock.node.children[0]._key === focusSpan.node._key && context.selection.focus.offset === 0 && focusTextBlock.node.level === 1 ? {
+      focusTextBlock
+    } : !1;
+  },
+  actions: [(_, {
+    focusTextBlock
+  }) => [{
+    type: "unset block",
+    props: ["listItem", "level"],
+    paths: [focusTextBlock.path]
+  }]]
+}, unindentListOnBackspace = {
+  on: "delete backward",
+  guard: ({
+    context
+  }) => {
+    const selectionCollapsed = selectionIsCollapsed(context), focusTextBlock = getFocusTextBlock(context), focusSpan = getFocusSpan(context);
+    return !selectionCollapsed || !focusTextBlock || !focusSpan ? !1 : focusTextBlock.node.children[0]._key === focusSpan.node._key && context.selection.focus.offset === 0 && focusTextBlock.node.level !== void 0 && focusTextBlock.node.level > 1 ? {
+      focusTextBlock,
+      level: focusTextBlock.node.level - 1
+    } : !1;
+  },
+  actions: [(_, {
+    focusTextBlock,
+    level
+  }) => [{
+    type: "set block",
+    level,
+    paths: [focusTextBlock.path]
+  }]]
+}, coreListBehaviors = {
+  clearListOnBackspace,
+  unindentListOnBackspace
+}, softReturn = {
+  on: "insert soft break",
+  actions: [() => [{
+    type: "insert text",
+    text: `
+`
+  }]]
+}, coreBehaviors = [softReturn, coreBlockObjectBehaviors.breakingBlockObject, coreBlockObjectBehaviors.deletingEmptyTextBlockAfterBlockObject, coreBlockObjectBehaviors.deletingEmptyTextBlockBeforeBlockObject, coreListBehaviors.clearListOnBackspace, coreListBehaviors.unindentListOnBackspace], coreBehavior = {
+  softReturn,
+  blockObjects: coreBlockObjectBehaviors,
+  lists: coreListBehaviors
+};
 function createMarkdownBehaviors(config) {
   const automaticStyleOnSpace = {
     on: "insert text",
@@ -171,6 +313,10 @@ function createMarkdownBehaviors(config) {
       focusSpan,
       style
     }) => [{
+      type: "unset block",
+      props: ["listItem", "level"],
+      paths: [focusTextBlock.path]
+    }, {
       type: "set block",
       style,
       paths: [focusTextBlock.path]
@@ -324,7 +470,9 @@ function defineSchema(definition) {
 function compileSchemaDefinition(definition) {
   const blockObjects = definition?.blockObjects?.map((blockObject) => defineType({
     type: "object",
-    name: blockObject.name,
+    // Very naive way to work around `SanitySchema.compile` adding default
+    // fields to objects with the name `image`
+    name: blockObject.name === "image" ? "tmp-image" : blockObject.name,
     title: blockObject.title,
     icon: blockObject.icon,
     fields: []
@@ -371,8 +519,18 @@ function compileSchemaDefinition(definition) {
     }]
   }), schema = Schema.compile({
     types: [portableTextSchema, ...blockObjects, ...inlineObjects]
-  }).get("portable-text");
-  return getPortableTextMemberSchemaTypes(schema);
+  }).get("portable-text"), pteSchema = getPortableTextMemberSchemaTypes(schema);
+  return {
+    ...pteSchema,
+    blockObjects: pteSchema.blockObjects.map((blockObject) => blockObject.name === "tmp-image" ? {
+      ...blockObject,
+      name: "image",
+      type: {
+        ...blockObject.type,
+        name: "image"
+      }
+    } : blockObject)
+  };
 }
 const rootName = "sanity-pte:";
 debug$m(rootName);
@@ -3547,22 +3705,30 @@ function createWithPortableTextMarkModel(editorActor, types) {
             editor,
             blockPath,
             spanPath: [op.path[0], op.path[1] - 1]
-          }), nextSpanAnnotations = nextSpan ? nextSpan.marks?.filter((mark) => !decorators.includes(mark)) : [], annotationsEnding = previousSpanAnnotations?.filter((annotation) => !nextSpanAnnotations?.includes(annotation)) ?? [];
-          if (annotationsEnding.length > 0 && isPortableTextSpan(op.node) && op.node.marks?.some((mark) => annotationsEnding.includes(mark))) {
+          }), nextSpanAnnotations = nextSpan ? nextSpan.marks?.filter((mark) => !decorators.includes(mark)) : [], annotationsEnding = previousSpanAnnotations?.filter((annotation) => !nextSpanAnnotations?.includes(annotation)) ?? [], atTheEndOfAnnotation = annotationsEnding.length > 0;
+          if (atTheEndOfAnnotation && isPortableTextSpan(op.node) && op.node.marks?.some((mark) => annotationsEnding.includes(mark))) {
             Transforms.insertNodes(editor, {
               ...op.node,
               marks: op.node.marks?.filter((mark) => !annotationsEnding.includes(mark)) ?? []
             });
             return;
           }
-          const annotationsStarting = nextSpanAnnotations?.filter((annotation) => !previousSpanAnnotations?.includes(annotation)) ?? [];
-          if (annotationsStarting.length > 0 && isPortableTextSpan(op.node) && op.node.marks?.some((mark) => annotationsStarting.includes(mark))) {
+          const annotationsStarting = nextSpanAnnotations?.filter((annotation) => !previousSpanAnnotations?.includes(annotation)) ?? [], atTheStartOfAnnotation = annotationsStarting.length > 0;
+          if (atTheStartOfAnnotation && isPortableTextSpan(op.node) && op.node.marks?.some((mark) => annotationsStarting.includes(mark))) {
             Transforms.insertNodes(editor, {
               ...op.node,
               marks: op.node.marks?.filter((mark) => !annotationsStarting.includes(mark)) ?? []
             });
             return;
           }
+          const nextSpanDecorators = nextSpan?.marks?.filter((mark) => decorators.includes(mark)) ?? [];
+          if (nextSpanDecorators.length > 0 && atTheEndOfAnnotation && !atTheStartOfAnnotation && isPortableTextSpan(op.node) && op.node.marks?.length === 0) {
+            Transforms.insertNodes(editor, {
+              ...op.node,
+              marks: nextSpanDecorators
+            });
+            return;
+          }
         }
       }
       if (op.type === "insert_text") {
@@ -5339,137 +5505,7 @@ function performDefaultAction({
       });
   }
 }
-const breakingVoidBlock = {
-  on: "insert break",
-  guard: ({
-    context
-  }) => !!getFocusBlockObject(context),
-  actions: [() => [{
-    type: "insert text block",
-    decorators: []
-  }]]
-}, deletingEmptyTextBlockAfterBlockObject = {
-  on: "delete backward",
-  guard: ({
-    context
-  }) => {
-    const focusTextBlock = getFocusTextBlock(context), selectionCollapsed = selectionIsCollapsed(context), previousBlock = getPreviousBlock(context);
-    return !focusTextBlock || !selectionCollapsed || !previousBlock ? !1 : isEmptyTextBlock(focusTextBlock.node) && !isPortableTextTextBlock(previousBlock.node) ? {
-      focusTextBlock,
-      previousBlock
-    } : !1;
-  },
-  actions: [(_, {
-    focusTextBlock,
-    previousBlock
-  }) => [{
-    type: "delete",
-    selection: {
-      anchor: {
-        path: focusTextBlock.path,
-        offset: 0
-      },
-      focus: {
-        path: focusTextBlock.path,
-        offset: 0
-      }
-    }
-  }, {
-    type: "select",
-    selection: {
-      anchor: {
-        path: previousBlock.path,
-        offset: 0
-      },
-      focus: {
-        path: previousBlock.path,
-        offset: 0
-      }
-    }
-  }]]
-}, deletingEmptyTextBlockBeforeBlockObject = {
-  on: "delete forward",
-  guard: ({
-    context
-  }) => {
-    const focusTextBlock = getFocusTextBlock(context), selectionCollapsed = selectionIsCollapsed(context), nextBlock = getNextBlock(context);
-    return !focusTextBlock || !selectionCollapsed || !nextBlock ? !1 : isEmptyTextBlock(focusTextBlock.node) && !isPortableTextTextBlock(nextBlock.node) ? {
-      focusTextBlock,
-      nextBlock
-    } : !1;
-  },
-  actions: [(_, {
-    focusTextBlock,
-    nextBlock
-  }) => [{
-    type: "delete",
-    selection: {
-      anchor: {
-        path: focusTextBlock.path,
-        offset: 0
-      },
-      focus: {
-        path: focusTextBlock.path,
-        offset: 0
-      }
-    }
-  }, {
-    type: "select",
-    selection: {
-      anchor: {
-        path: nextBlock.path,
-        offset: 0
-      },
-      focus: {
-        path: nextBlock.path,
-        offset: 0
-      }
-    }
-  }]]
-}, coreBlockObjectBehaviors = [breakingVoidBlock, deletingEmptyTextBlockAfterBlockObject, deletingEmptyTextBlockBeforeBlockObject], clearListOnBackspace = {
-  on: "delete backward",
-  guard: ({
-    context
-  }) => {
-    const selectionCollapsed = selectionIsCollapsed(context), focusTextBlock = getFocusTextBlock(context), focusSpan = getFocusSpan(context);
-    return !selectionCollapsed || !focusTextBlock || !focusSpan ? !1 : focusTextBlock.node.children[0]._key === focusSpan.node._key && context.selection.focus.offset === 0 && focusTextBlock.node.level === 1 ? {
-      focusTextBlock
-    } : !1;
-  },
-  actions: [(_, {
-    focusTextBlock
-  }) => [{
-    type: "unset block",
-    props: ["listItem", "level"],
-    paths: [focusTextBlock.path]
-  }]]
-}, unindentListOnBackspace = {
-  on: "delete backward",
-  guard: ({
-    context
-  }) => {
-    const selectionCollapsed = selectionIsCollapsed(context), focusTextBlock = getFocusTextBlock(context), focusSpan = getFocusSpan(context);
-    return !selectionCollapsed || !focusTextBlock || !focusSpan ? !1 : focusTextBlock.node.children[0]._key === focusSpan.node._key && context.selection.focus.offset === 0 && focusTextBlock.node.level !== void 0 && focusTextBlock.node.level > 1 ? {
-      focusTextBlock,
-      level: focusTextBlock.node.level - 1
-    } : !1;
-  },
-  actions: [(_, {
-    focusTextBlock,
-    level
-  }) => [{
-    type: "set block",
-    level,
-    paths: [focusTextBlock.path]
-  }]]
-}, coreListBehaviors = [clearListOnBackspace, unindentListOnBackspace], softReturn = {
-  on: "insert soft break",
-  actions: [() => [{
-    type: "insert text",
-    text: `
-`
-  }]]
-}, coreBehaviors = [softReturn, ...coreBlockObjectBehaviors, ...coreListBehaviors], networkLogic = fromCallback(({
+const networkLogic = fromCallback(({
   sendBack
 }) => {
   const onlineHandler = () => {
@@ -5495,7 +5531,7 @@ const breakingVoidBlock = {
     "assign behaviors": assign({
       behaviors: ({
         event
-      }) => (assertEvent(event, "update behaviors"), [...coreBehaviors, ...event.behaviors])
+      }) => (assertEvent(event, "update behaviors"), event.behaviors)
     }),
     "assign schema": assign({
       schema: ({
@@ -5589,7 +5625,7 @@ const breakingVoidBlock = {
   context: ({
     input
   }) => ({
-    behaviors: input.behaviors ? [...coreBehaviors, ...input.behaviors] : coreBehaviors,
+    behaviors: input.behaviors ?? coreBehaviors,
     keyGenerator: input.keyGenerator,
     pendingEvents: [],
     schema: input.schema
@@ -6289,6 +6325,8 @@ function useEditor(config) {
 export {
   PortableTextEditable,
   PortableTextEditor,
+  coreBehavior,
+  coreBehaviors,
   createMarkdownBehaviors,
   defineBehavior,
   defineSchema,