@blocknote/core 0.13.2 → 0.13.3

package/src/api/nodeConversions/__snapshots__/nodeConversions.test.ts.snap

@@ -217,6 +217,134 @@ exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert
 }
 `;
 
+exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert file/basic to/from prosemirror 1`] = `
+{
+  "attrs": {
+    "backgroundColor": "default",
+    "id": "1",
+    "textColor": "default",
+  },
+  "content": [
+    {
+      "attrs": {
+        "caption": "Caption",
+        "name": "example",
+        "url": "exampleURL",
+      },
+      "type": "file",
+    },
+  ],
+  "type": "blockContainer",
+}
+`;
+
+exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert file/button to/from prosemirror 1`] = `
+{
+  "attrs": {
+    "backgroundColor": "default",
+    "id": "1",
+    "textColor": "default",
+  },
+  "content": [
+    {
+      "attrs": {
+        "caption": "",
+        "name": "",
+        "url": "",
+      },
+      "type": "file",
+    },
+  ],
+  "type": "blockContainer",
+}
+`;
+
+exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert file/nested to/from prosemirror 1`] = `
+{
+  "attrs": {
+    "backgroundColor": "default",
+    "id": "1",
+    "textColor": "default",
+  },
+  "content": [
+    {
+      "attrs": {
+        "caption": "Caption",
+        "name": "example",
+        "url": "exampleURL",
+      },
+      "type": "file",
+    },
+    {
+      "content": [
+        {
+          "attrs": {
+            "backgroundColor": "default",
+            "id": "2",
+            "textColor": "default",
+          },
+          "content": [
+            {
+              "attrs": {
+                "caption": "Caption",
+                "name": "example",
+                "url": "exampleURL",
+              },
+              "type": "file",
+            },
+          ],
+          "type": "blockContainer",
+        },
+      ],
+      "type": "blockGroup",
+    },
+  ],
+  "type": "blockContainer",
+}
+`;
+
+exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert file/noCaption to/from prosemirror 1`] = `
+{
+  "attrs": {
+    "backgroundColor": "default",
+    "id": "1",
+    "textColor": "default",
+  },
+  "content": [
+    {
+      "attrs": {
+        "caption": "",
+        "name": "example",
+        "url": "exampleURL",
+      },
+      "type": "file",
+    },
+  ],
+  "type": "blockContainer",
+}
+`;
+
+exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert file/noName to/from prosemirror 1`] = `
+{
+  "attrs": {
+    "backgroundColor": "default",
+    "id": "1",
+    "textColor": "default",
+  },
+  "content": [
+    {
+      "attrs": {
+        "caption": "Caption",
+        "name": "",
+        "url": "exampleURL",
+      },
+      "type": "file",
+    },
+  ],
+  "type": "blockContainer",
+}
+`;
+
 exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert hardbreak/basic to/from prosemirror 1`] = `
 {
   "attrs": {
@@ -524,9 +652,11 @@ exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert
     {
       "attrs": {
         "caption": "Caption",
+        "name": "example",
+        "previewWidth": 256,
+        "showPreview": true,
         "textAlignment": "left",
         "url": "exampleURL",
-        "width": 256,
       },
       "type": "image",
     },
@@ -546,9 +676,11 @@ exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert
     {
       "attrs": {
         "caption": "",
+        "name": "",
+        "previewWidth": 512,
+        "showPreview": true,
         "textAlignment": "left",
         "url": "",
-        "width": 512,
       },
       "type": "image",
     },
@@ -568,9 +700,11 @@ exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert
     {
       "attrs": {
         "caption": "Caption",
+        "name": "",
+        "previewWidth": 256,
+        "showPreview": true,
         "textAlignment": "left",
         "url": "exampleURL",
-        "width": 256,
       },
       "type": "image",
     },
@@ -586,9 +720,11 @@ exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert
             {
               "attrs": {
                 "caption": "Caption",
+                "name": "",
+                "previewWidth": 256,
+                "showPreview": true,
                 "textAlignment": "left",
                 "url": "exampleURL",
-                "width": 256,
               },
               "type": "image",
             },
@@ -603,6 +739,78 @@ exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert
 }
 `;
 
+exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert image/noCaption to/from prosemirror 1`] = `
+{
+  "attrs": {
+    "backgroundColor": "default",
+    "id": "1",
+    "textColor": "default",
+  },
+  "content": [
+    {
+      "attrs": {
+        "caption": "",
+        "name": "example",
+        "previewWidth": 256,
+        "showPreview": true,
+        "textAlignment": "left",
+        "url": "exampleURL",
+      },
+      "type": "image",
+    },
+  ],
+  "type": "blockContainer",
+}
+`;
+
+exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert image/noName to/from prosemirror 1`] = `
+{
+  "attrs": {
+    "backgroundColor": "default",
+    "id": "1",
+    "textColor": "default",
+  },
+  "content": [
+    {
+      "attrs": {
+        "caption": "Caption",
+        "name": "",
+        "previewWidth": 256,
+        "showPreview": true,
+        "textAlignment": "left",
+        "url": "exampleURL",
+      },
+      "type": "image",
+    },
+  ],
+  "type": "blockContainer",
+}
+`;
+
+exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert image/noPreview to/from prosemirror 1`] = `
+{
+  "attrs": {
+    "backgroundColor": "default",
+    "id": "1",
+    "textColor": "default",
+  },
+  "content": [
+    {
+      "attrs": {
+        "caption": "Caption",
+        "name": "example",
+        "previewWidth": 256,
+        "showPreview": false,
+        "textAlignment": "left",
+        "url": "exampleURL",
+      },
+      "type": "image",
+    },
+  ],
+  "type": "blockContainer",
+}
+`;
+
 exports[`Test BlockNote-Prosemirror conversion > Case: default schema > Convert link/adjacent to/from prosemirror 1`] = `
 {
   "attrs": {

package/src/api/parsers/html/__snapshots__/paste/parse-basic-block-types.json

@@ -76,9 +76,11 @@
     "props": {
       "backgroundColor": "default",
       "textAlignment": "left",
+      "name": "",
       "url": "exampleURL",
       "caption": "Image Caption",
-      "width": 512
+      "showPreview": true,
+      "previewWidth": 512
     },
     "children": []
   },

package/src/api/parsers/html/__snapshots__/paste/parse-fake-image-caption.json

@@ -5,9 +5,11 @@
     "props": {
       "backgroundColor": "default",
       "textAlignment": "left",
+      "name": "",
       "url": "exampleURL",
       "caption": "",
-      "width": 512
+      "showPreview": true,
+      "previewWidth": 512
     },
     "children": []
   },

package/src/api/testUtil/cases/customBlocks.ts

@@ -1,10 +1,6 @@
 import { EditorTestCases } from "../index";
 
-import {
-  imagePropSchema,
-  renderImage,
-} from "../../../blocks/ImageBlockContent/ImageBlockContent";
-import { uploadToTmpFilesDotOrg_DEV_ONLY } from "../../../blocks/ImageBlockContent/uploadToTmpFilesDotOrg_DEV_ONLY";
+import { uploadToTmpFilesDotOrg_DEV_ONLY } from "../../../blocks/FileBlockContent/uploadToTmpFilesDotOrg_DEV_ONLY";
 import {
   DefaultInlineContentSchema,
   DefaultStyleSchema,
@@ -13,23 +9,29 @@ import {
 import { defaultProps } from "../../../blocks/defaultProps";
 import { BlockNoteEditor } from "../../../editor/BlockNoteEditor";
 import { BlockNoteSchema } from "../../../editor/BlockNoteSchema";
-import { createBlockSpec } from "../../../schema/blocks/createSpec";
+import { createBlockSpec } from "../../../schema";
+import {
+  imagePropSchema,
+  imageRender,
+} from "../../../blocks/ImageBlockContent/ImageBlockContent";
 
 // This is a modified version of the default image block that does not implement
-// a `serialize` function. It's used to test if the custom serializer by default
-// serializes custom blocks using their `render` function.
+// a `toExternalHTML` function. It's used to test if the custom serializer by
+// default serializes custom blocks using their `render` function.
 const SimpleImage = createBlockSpec(
   {
-    type: "simpleImage" as const,
+    type: "simpleImage",
     propSchema: imagePropSchema,
     content: "none",
   },
-  { render: renderImage as any }
+  {
+    render: (block, editor) => imageRender(block as any, editor as any),
+  }
 );
 
 const CustomParagraph = createBlockSpec(
   {
-    type: "customParagraph" as const,
+    type: "customParagraph",
     propSchema: defaultProps,
     content: "inline",
   },
@@ -57,7 +59,7 @@ const CustomParagraph = createBlockSpec(
 
 const SimpleCustomParagraph = createBlockSpec(
   {
-    type: "simpleCustomParagraph" as const,
+    type: "simpleCustomParagraph",
     propSchema: defaultProps,
     content: "inline",
   },
@@ -108,12 +110,54 @@ export const customBlocksTestCases: EditorTestCases<
       name: "simpleImage/basic",
       blocks: [
         {
-          type: "simpleImage" as const,
+          type: "simpleImage",
+          props: {
+            name: "example",
+            url: "exampleURL",
+            caption: "Caption",
+            previewWidth: 256,
+          },
+        },
+      ],
+    },
+    {
+      name: "simpleImage/noName",
+      blocks: [
+        {
+          type: "simpleImage",
+          props: {
+            url: "exampleURL",
+            caption: "Caption",
+            previewWidth: 256,
+          },
+        },
+      ],
+    },
+    {
+      name: "simpleImage/noCaption",
+      blocks: [
+        {
+          type: "simpleImage",
+          props: {
+            name: "example",
+            url: "exampleURL",
+            previewWidth: 256,
+          },
+        },
+      ],
+    },
+    {
+      name: "simpleImage/noPreview",
+      blocks: [
+        {
+          type: "simpleImage",
           props: {
+            name: "example",
             url: "exampleURL",
             caption: "Caption",
-            width: 256,
-          } as const,
+            showPreview: false,
+            previewWidth: 256,
+          },
         },
       ],
     },
@@ -121,20 +165,22 @@ export const customBlocksTestCases: EditorTestCases<
       name: "simpleImage/nested",
       blocks: [
         {
-          type: "simpleImage" as const,
+          type: "simpleImage",
           props: {
+            name: "example",
             url: "exampleURL",
             caption: "Caption",
-            width: 256,
-          } as const,
+            previewWidth: 256,
+          },
           children: [
             {
-              type: "simpleImage" as const,
+              type: "simpleImage",
               props: {
+                name: "example",
                 url: "exampleURL",
                 caption: "Caption",
-                width: 256,
-              } as const,
+                previewWidth: 256,
+              },
             },
           ],
         },
@@ -144,7 +190,7 @@ export const customBlocksTestCases: EditorTestCases<
       name: "customParagraph/basic",
       blocks: [
         {
-          type: "customParagraph" as const,
+          type: "customParagraph",
           content: "Custom Paragraph",
         },
       ],
@@ -153,12 +199,12 @@ export const customBlocksTestCases: EditorTestCases<
       name: "customParagraph/styled",
       blocks: [
         {
-          type: "customParagraph" as const,
+          type: "customParagraph",
           props: {
             textAlignment: "center",
             textColor: "orange",
             backgroundColor: "pink",
-          } as const,
+          },
           content: [
             {
               type: "text",
@@ -195,15 +241,15 @@ export const customBlocksTestCases: EditorTestCases<
       name: "customParagraph/nested",
       blocks: [
         {
-          type: "customParagraph" as const,
+          type: "customParagraph",
           content: "Custom Paragraph",
           children: [
             {
-              type: "customParagraph" as const,
+              type: "customParagraph",
               content: "Nested Custom Paragraph 1",
             },
             {
-              type: "customParagraph" as const,
+              type: "customParagraph",
               content: "Nested Custom Paragraph 2",
             },
           ],
@@ -214,7 +260,7 @@ export const customBlocksTestCases: EditorTestCases<
       name: "simpleCustomParagraph/basic",
       blocks: [
         {
-          type: "simpleCustomParagraph" as const,
+          type: "simpleCustomParagraph",
           content: "Custom Paragraph",
         },
       ],
@@ -223,12 +269,12 @@ export const customBlocksTestCases: EditorTestCases<
       name: "simpleCustomParagraph/styled",
       blocks: [
         {
-          type: "simpleCustomParagraph" as const,
+          type: "simpleCustomParagraph",
           props: {
             textAlignment: "center",
             textColor: "orange",
             backgroundColor: "pink",
-          } as const,
+          },
           content: [
             {
               type: "text",
@@ -265,15 +311,15 @@ export const customBlocksTestCases: EditorTestCases<
       name: "simpleCustomParagraph/nested",
       blocks: [
         {
-          type: "simpleCustomParagraph" as const,
+          type: "simpleCustomParagraph",
           content: "Custom Paragraph",
           children: [
             {
-              type: "simpleCustomParagraph" as const,
+              type: "simpleCustomParagraph",
               content: "Nested Custom Paragraph 1",
             },
             {
-              type: "simpleCustomParagraph" as const,
+              type: "simpleCustomParagraph",
               content: "Nested Custom Paragraph 2",
             },
           ],

package/src/api/testUtil/cases/customInlineContent.ts

@@ -1,6 +1,6 @@
 import { EditorTestCases } from "../index";
 
-import { uploadToTmpFilesDotOrg_DEV_ONLY } from "../../../blocks/ImageBlockContent/uploadToTmpFilesDotOrg_DEV_ONLY";
+import { uploadToTmpFilesDotOrg_DEV_ONLY } from "../../../blocks/FileBlockContent/uploadToTmpFilesDotOrg_DEV_ONLY";
 import {
   DefaultBlockSchema,
   DefaultStyleSchema,

package/src/api/testUtil/cases/customStyles.ts

@@ -1,6 +1,6 @@
 import { EditorTestCases } from "../index";
 
-import { uploadToTmpFilesDotOrg_DEV_ONLY } from "../../../blocks/ImageBlockContent/uploadToTmpFilesDotOrg_DEV_ONLY";
+import { uploadToTmpFilesDotOrg_DEV_ONLY } from "../../../blocks/FileBlockContent/uploadToTmpFilesDotOrg_DEV_ONLY";
 import {
   DefaultBlockSchema,
   DefaultInlineContentSchema,

package/src/api/testUtil/cases/defaultSchema.ts

@@ -6,7 +6,7 @@ import {
   DefaultInlineContentSchema,
   DefaultStyleSchema,
 } from "../../../blocks/defaultBlocks";
-import { uploadToTmpFilesDotOrg_DEV_ONLY } from "../../../blocks/ImageBlockContent/uploadToTmpFilesDotOrg_DEV_ONLY";
+import { uploadToTmpFilesDotOrg_DEV_ONLY } from "../../../blocks/FileBlockContent/uploadToTmpFilesDotOrg_DEV_ONLY";
 
 export const defaultSchemaTestCases: EditorTestCases<
   DefaultBlockSchema,
@@ -98,6 +98,74 @@ export const defaultSchemaTestCases: EditorTestCases<
         },
       ],
     },
+    {
+      name: "file/button",
+      blocks: [
+        {
+          type: "file",
+        },
+      ],
+    },
+    {
+      name: "file/basic",
+      blocks: [
+        {
+          type: "file",
+          props: {
+            name: "example",
+            url: "exampleURL",
+            caption: "Caption",
+          },
+        },
+      ],
+    },
+    {
+      name: "file/noName",
+      blocks: [
+        {
+          type: "file",
+          props: {
+            url: "exampleURL",
+            caption: "Caption",
+          },
+        },
+      ],
+    },
+    {
+      name: "file/noCaption",
+      blocks: [
+        {
+          type: "file",
+          props: {
+            name: "example",
+            url: "exampleURL",
+          },
+        },
+      ],
+    },
+    {
+      name: "file/nested",
+      blocks: [
+        {
+          type: "file",
+          props: {
+            name: "example",
+            url: "exampleURL",
+            caption: "Caption",
+          },
+          children: [
+            {
+              type: "file",
+              props: {
+                name: "example",
+                url: "exampleURL",
+                caption: "Caption",
+              },
+            },
+          ],
+        },
+      ],
+    },
     {
       name: "image/button",
       blocks: [
@@ -112,9 +180,51 @@ export const defaultSchemaTestCases: EditorTestCases<
         {
           type: "image",
           props: {
+            name: "example",
+            url: "exampleURL",
+            caption: "Caption",
+            previewWidth: 256,
+          },
+        },
+      ],
+    },
+    {
+      name: "image/noName",
+      blocks: [
+        {
+          type: "image",
+          props: {
+            url: "exampleURL",
+            caption: "Caption",
+            previewWidth: 256,
+          },
+        },
+      ],
+    },
+    {
+      name: "image/noCaption",
+      blocks: [
+        {
+          type: "image",
+          props: {
+            name: "example",
+            url: "exampleURL",
+            previewWidth: 256,
+          },
+        },
+      ],
+    },
+    {
+      name: "image/noPreview",
+      blocks: [
+        {
+          type: "image",
+          props: {
+            name: "example",
             url: "exampleURL",
             caption: "Caption",
-            width: 256,
+            showPreview: false,
+            previewWidth: 256,
           },
         },
       ],
@@ -127,7 +237,7 @@ export const defaultSchemaTestCases: EditorTestCases<
           props: {
             url: "exampleURL",
             caption: "Caption",
-            width: 256,
+            previewWidth: 256,
           },
           children: [
             {
@@ -135,7 +245,7 @@ export const defaultSchemaTestCases: EditorTestCases<
               props: {
                 url: "exampleURL",
                 caption: "Caption",
-                width: 256,
+                previewWidth: 256,
               },
             },
           ],