@blocknote/core 0.13.2 → 0.13.4

package/src/i18n/locales/zh.ts

@@ -48,6 +48,21 @@ export const zh: Dictionary = {
       ],
       group: "基础",
     },
+    check_list: {
+      title: "检查清单",
+      subtext: "用于显示带有复选框的列表",
+      aliases: [
+        "ul",
+        "li",
+        "checklist",
+        "checked list",
+        "列表",
+        "检查清单",
+        "勾选列表",
+        "复选框",
+      ],
+      group: "基本块",
+    },
     paragraph: {
       title: "段落",
       subtext: "用于文档正文",
@@ -75,15 +90,67 @@ export const zh: Dictionary = {
       ],
       group: "媒体",
     },
+    video: {
+      title: "视频",
+      subtext: "插入视频",
+      aliases: [
+        "视频",
+        "视频上传",
+        "上传",
+        "video",
+        "mp4",
+        "电影",
+        "媒体",
+        "url",
+        "驱动",
+        "dropbox",
+      ],
+      group: "媒体",
+    },
+    audio: {
+      title: "音频",
+      subtext: "插入音频",
+      aliases: [
+        "音频",
+        "音频上传",
+        "上传",
+        "audio",
+        "mp3",
+        "声音",
+        "媒体",
+        "url",
+        "驱动",
+        "dropbox",
+      ],
+      group: "媒体",
+    },
+    file: {
+      title: "文件",
+      subtext: "插入文件",
+      aliases: ["文件", "上传", "file", "嵌入", "媒体", "url"],
+      group: "媒体",
+    },
   },
   placeholders: {
     default: "输入 '/' 以使用命令",
     heading: "标题",
     bulletListItem: "列表",
     numberedListItem: "列表",
+    checkListItem: "列表",
   },
-  image: {
-    add_button: "添加图片",
+  file_blocks: {
+    image: {
+      add_button_text: "添加图片",
+    },
+    video: {
+      add_button_text: "添加视频",
+    },
+    audio: {
+      add_button_text: "添加音频",
+    },
+    file: {
+      add_button_text: "添加文件",
+    },
   },
   // from react package:
   side_menu: {
@@ -151,12 +218,50 @@ export const zh: Dictionary = {
       tooltip: "添加链接",
       secondary_tooltip: "Mod+K",
     },
-    image_caption: {
+    file_caption: {
       tooltip: "编辑标题",
       input_placeholder: "编辑标题",
     },
-    image_replace: {
-      tooltip: "替换图片",
+    file_replace: {
+      tooltip: {
+        image: "替换图片",
+        video: "替换视频",
+        audio: "替换音频",
+        file: "替换文件",
+      },
+    },
+    file_rename: {
+      tooltip: {
+        image: "重命名图片",
+        video: "重命名视频",
+        audio: "重命名音频",
+        file: "重命名文件",
+      },
+      input_placeholder: {
+        image: "重命名图片",
+        video: "重命名视频",
+        audio: "重命名音频",
+        file: "重命名文件",
+      },
+    },
+    file_download: {
+      tooltip: {
+        image: "下载图片",
+        video: "下载视频",
+        audio: "下载音频",
+        file: "下载文件",
+      },
+    },
+    file_delete: {
+      tooltip: {
+        image: "删除图片",
+        video: "删除视频",
+        audio: "删除音频",
+        file: "删除文件",
+      },
+    },
+    file_preview_toggle: {
+      tooltip: "切换预览",
     },
     nest: {
       tooltip: "嵌套",
@@ -179,15 +284,25 @@ export const zh: Dictionary = {
       tooltip: "文本对齐",
     },
   },
-  image_panel: {
+  file_panel: {
     upload: {
       title: "上传",
-      file_placeholder: "上传图片",
+      file_placeholder: {
+        image: "上传图片",
+        video: "上传视频",
+        audio: "上传音频",
+        file: "上传文件",
+      },
       upload_error: "Error：上传失败",
     },
     embed: {
       title: "嵌入",
-      embed_button: "嵌入图片",
+      embed_button: {
+        image: "嵌入图片",
+        video: "嵌入视频",
+        audio: "嵌入音频",
+        file: "嵌入文件",
+      },
       url_placeholder: "输入图片地址",
     },
   },

package/src/index.ts

@@ -2,7 +2,13 @@ import * as locales from "./i18n/locales";
 export * from "./api/exporters/html/externalHTMLExporter";
 export * from "./api/exporters/html/internalHTMLSerializer";
 export * from "./api/testUtil";
-export * from "./blocks/ImageBlockContent/uploadToTmpFilesDotOrg_DEV_ONLY";
+export * from "./blocks/FileBlockContent/FileBlockContent";
+export * from "./blocks/ImageBlockContent/ImageBlockContent";
+export * from "./blocks/VideoBlockContent/VideoBlockContent";
+export * from "./blocks/AudioBlockContent/AudioBlockContent";
+
+export * from "./blocks/FileBlockContent/fileBlockHelpers";
+export * from "./blocks/FileBlockContent/uploadToTmpFilesDotOrg_DEV_ONLY";
 export * from "./blocks/defaultBlockTypeGuards";
 export * from "./blocks/defaultBlocks";
 export * from "./blocks/defaultProps";
@@ -11,8 +17,8 @@ export * from "./editor/BlockNoteExtensions";
 export * from "./editor/BlockNoteSchema";
 export * from "./editor/selectionTypes";
 export * from "./extensions-shared/UiElementPosition";
+export * from "./extensions/FilePanel/FilePanelPlugin";
 export * from "./extensions/FormattingToolbar/FormattingToolbarPlugin";
-export * from "./extensions/ImagePanel/ImageToolbarPlugin";
 export * from "./extensions/LinkToolbar/LinkToolbarPlugin";
 export * from "./extensions/SideMenu/SideMenuPlugin";
 export * from "./extensions/SuggestionMenu/DefaultSuggestionItem";
@@ -29,3 +35,4 @@ export * from "./extensions/UniqueID/UniqueID";
 export * from "./i18n/dictionary";
 export { UnreachableCaseError, assertEmpty } from "./util/typescript";
 export { locales };
+export { parseImageElement } from "./blocks/ImageBlockContent/imageBlockHelpers";

package/src/pm-nodes/BlockContainer.ts

@@ -36,7 +36,11 @@ declare module "@tiptap/core" {
       BNCreateBlock: (pos: number) => ReturnType;
       BNDeleteBlock: (posInBlock: number) => ReturnType;
       BNMergeBlocks: (posBetweenBlocks: number) => ReturnType;
-      BNSplitBlock: (posInBlock: number, keepType: boolean) => ReturnType;
+      BNSplitBlock: (
+        posInBlock: number,
+        keepType?: boolean,
+        keepProps?: boolean
+      ) => ReturnType;
       BNUpdateBlock: <
         BSchema extends BlockSchema,
         I extends InlineContentSchema,
@@ -402,8 +406,12 @@ export const BlockContainer = Node.create<{
         },
       // Splits a block at a given position. Content after the position is moved to a new block below, at the same
       // nesting level.
+      // - `keepType` is usually false, unless the selection is at the start of
+      // a block.
+      // - `keepProps` is usually true when `keepType` is true, except for when
+      // creating new list item blocks with Enter.
       BNSplitBlock:
-        (posInBlock, keepType) =>
+        (posInBlock, keepType, keepProps) =>
         ({ state, dispatch }) => {
           const blockInfo = getBlockInfoFromPos(state.doc, posInBlock);
           if (blockInfo === undefined) {
@@ -448,7 +456,7 @@ export const BlockContainer = Node.create<{
                 newBlockContentPos,
                 newBlockContentPos,
                 state.schema.node(contentType).type,
-                contentNode.attrs
+                keepProps ? contentNode.attrs : undefined
               );
             }
 
@@ -671,7 +679,11 @@ export const BlockContainer = Node.create<{
             if (!blockEmpty) {
               chain()
                 .deleteSelection()
-                .BNSplitBlock(state.selection.from, selectionAtBlockStart)
+                .BNSplitBlock(
+                  state.selection.from,
+                  selectionAtBlockStart,
+                  selectionAtBlockStart
+                )
                 .run();
 
               return true;
@@ -691,7 +703,7 @@ export const BlockContainer = Node.create<{
         if (
           this.options.editor.formattingToolbar?.shown ||
           this.options.editor.linkToolbar?.shown ||
-          this.options.editor.imagePanel?.shown
+          this.options.editor.filePanel?.shown
         ) {
           // don't handle tabs if a toolbar is shown, so we can tab into / out of it
           return false;
@@ -703,7 +715,7 @@ export const BlockContainer = Node.create<{
         if (
           this.options.editor.formattingToolbar?.shown ||
           this.options.editor.linkToolbar?.shown ||
-          this.options.editor.imagePanel?.shown
+          this.options.editor.filePanel?.shown
         ) {
           // don't handle tabs if a toolbar is shown, so we can tab into / out of it
           return false;

package/src/schema/blocks/createSpec.ts

@@ -193,6 +193,7 @@ export function createBlockSpec<
         block.type,
         block.props,
         blockConfig.propSchema,
+        blockConfig.isFileBlock,
         blockContentDOMAttributes
       );
     },

package/src/schema/blocks/internal.ts

@@ -109,6 +109,11 @@ export function getBlockFromPos<
   const blockContainer = tipTapEditor.state.doc.resolve(pos!).node();
   // Gets block identifier
   const blockIdentifier = blockContainer.attrs.id;
+
+  if (!blockIdentifier) {
+    throw new Error("Block doesn't have id");
+  }
+
   // Gets the block
   const block = editor.getBlock(blockIdentifier)! as SpecificBlock<
     BSchema,
@@ -139,6 +144,7 @@ export function wrapInBlockStructure<
   blockType: BType,
   blockProps: Props<PSchema>,
   propSchema: PSchema,
+  isFileBlock = false,
   domAttributes?: Record<string, string>
 ): {
   dom: HTMLElement;
@@ -171,6 +177,10 @@ export function wrapInBlockStructure<
       blockContent.setAttribute(camelToDataKebab(prop), value);
     }
   }
+  // Adds file block attribute
+  if (isFileBlock) {
+    blockContent.setAttribute("data-file-block", "");
+  }
 
   blockContent.appendChild(element.dom);
 

package/src/schema/blocks/types.ts

@@ -21,14 +21,49 @@ export type BlockNoteDOMAttributes = Partial<{
   [DOMElement in BlockNoteDOMElement]: Record<string, string>;
 }>;
 
-// BlockConfig contains the "schema" info about a Block type
-// i.e. what props it supports, what content it supports, etc.
-export type BlockConfig = {
+export type FileBlockConfig = {
   type: string;
-  readonly propSchema: PropSchema;
-  content: "inline" | "none" | "table";
+  readonly propSchema: PropSchema & {
+    caption: {
+      default: "";
+    };
+    name: {
+      default: "";
+    };
+
+    // URL is optional, as we also want to accept files with no URL, but for example ids
+    // (ids can be used for files that are resolved on the backend)
+    url?: {
+      default: "";
+    };
+
+    // Whether to show the file preview or the name only.
+    // This is useful for some file blocks, but not all
+    // (e.g.: not relevant for default "file" block which doesn;'t show previews)
+    showPreview?: {
+      default: boolean;
+    };
+    // File preview width in px.
+    previewWidth?: {
+      default: number;
+    };
+  };
+  content: "none";
+  isFileBlock: true;
+  fileBlockAcceptMimeTypes?: string[];
 };
 
+// BlockConfig contains the "schema" info about a Block type
+// i.e. what props it supports, what content it supports, etc.
+export type BlockConfig =
+  | {
+      type: string;
+      readonly propSchema: PropSchema;
+      content: "inline" | "none" | "table";
+      isFileBlock?: false;
+    }
+  | FileBlockConfig;
+
 // Block implementation contains the "implementation" info about a Block
 // such as the functions / Nodes required to render and / or serialize it
 export type TiptapBlockImplementation<

package/src/util/string.ts

@@ -1,3 +1,15 @@
 export function camelToDataKebab(str: string): string {
   return "data-" + str.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
 }
+
+export function filenameFromURL(url: string): string {
+  const parts = url.split("/");
+  if (
+    !parts.length || // invalid?
+    parts[parts.length - 1] === "" // for example, URL ends in a directory-like trailing slash
+  ) {
+    // in this case just return the original url
+    return url;
+  }
+  return parts[parts.length - 1];
+}

package/types/src/api/exporters/markdown/util/addSpacesToCheckboxesRehypePlugin.d.ts

@@ -0,0 +1,7 @@
+import { Parent as HASTParent } from "hast";
+/**
+ * Rehype plugin which adds a space after each checkbox input element. This is
+ * because remark doesn't add any spaces between the checkbox input and the text
+ * itself, but these are needed for correct Markdown syntax.
+ */
+export declare function addSpacesToCheckboxes(): (tree: HASTParent) => void;