refactor: export block types (and move blocks to separate sub-export)

nperez0111 · nperez0111 · commit fdcfffb4812f · 2025-09-09T15:44:38.000+02:00
diff --git a/packages/core/package.json b/packages/core/package.json
@@ -57,6 +57,11 @@
       "import": "./dist/comments.js",
       "require": "./dist/comments.cjs"
     },
+    "./blocks": {
+      "types": "./types/src/blocks/index.d.ts",
+      "import": "./dist/blocks.js",
+      "require": "./dist/blocks.cjs"
+    },
     "./locales": {
       "types": "./types/src/i18n/index.d.ts",
       "import": "./dist/locales.js",
diff --git a/packages/core/src/blocks/Audio/block.ts b/packages/core/src/blocks/Audio/block.ts
@@ -18,6 +18,8 @@ export interface AudioOptions {
   icon?: string;
 }
 
+export type AudioBlockConfig = ReturnType<typeof createAudioBlockConfig>;
+
 export const createAudioBlockConfig = createBlockConfig(
   (_ctx: AudioOptions) =>
     ({
diff --git a/packages/core/src/blocks/Code/block.ts b/packages/core/src/blocks/Code/block.ts
@@ -51,6 +51,8 @@ export type CodeBlockOptions = {
   createHighlighter?: () => Promise<HighlighterGeneric<any, any>>;
 };
 
+export type CodeBlockConfig = ReturnType<typeof createCodeBlockConfig>;
+
 export const createCodeBlockConfig = createBlockConfig(
   ({ defaultLanguage = "text" }: CodeBlockOptions) =>
     ({
diff --git a/packages/core/src/blocks/File/block.ts b/packages/core/src/blocks/File/block.ts
@@ -5,6 +5,8 @@ import { parseFigureElement } from "./helpers/parse/parseFigureElement.js";
 import { createFileBlockWrapper } from "./helpers/render/createFileBlockWrapper.js";
 import { createLinkWithCaption } from "./helpers/toExternalHTML/createLinkWithCaption.js";
 
+export type FileBlockConfig = ReturnType<typeof createFileBlockConfig>;
+
 export const createFileBlockConfig = createBlockConfig(
   () =>
     ({
diff --git a/packages/core/src/blocks/Heading/block.ts b/packages/core/src/blocks/Heading/block.ts
@@ -12,6 +12,8 @@ export interface HeadingOptions {
   allowToggleHeadings?: boolean;
 }
 
+export type HeadingBlockConfig = ReturnType<typeof createHeadingBlockConfig>;
+
 export const createHeadingBlockConfig = createBlockConfig(
   ({
     defaultLevel = 1,
diff --git a/packages/core/src/blocks/Image/block.ts b/packages/core/src/blocks/Image/block.ts
@@ -17,6 +17,9 @@ export const FILE_IMAGE_ICON_SVG =
 export interface ImageOptions {
   icon?: string;
 }
+
+export type ImageBlockConfig = ReturnType<typeof createImageBlockConfig>;
+
 export const createImageBlockConfig = createBlockConfig(
   (_ctx: ImageOptions = {}) =>
     ({
diff --git a/packages/core/src/blocks/ListItem/BulletListItem/block.ts b/packages/core/src/blocks/ListItem/BulletListItem/block.ts
@@ -4,6 +4,10 @@ import { defaultProps } from "../../defaultProps.js";
 import { handleEnter } from "../../utils/listItemEnterHandler.js";
 import { getListItemContent } from "../getListItemContent.js";
 
+export type BulletListItemBlockConfig = ReturnType<
+  typeof createBulletListItemBlockConfig
+>;
+
 export const createBulletListItemBlockConfig = createBlockConfig(
   () =>
     ({
diff --git a/packages/core/src/blocks/ListItem/CheckListItem/block.ts b/packages/core/src/blocks/ListItem/CheckListItem/block.ts
@@ -4,6 +4,10 @@ import { defaultProps } from "../../defaultProps.js";
 import { handleEnter } from "../../utils/listItemEnterHandler.js";
 import { getListItemContent } from "../getListItemContent.js";
 
+export type CheckListItemBlockConfig = ReturnType<
+  typeof createCheckListItemConfig
+>;
+
 export const createCheckListItemConfig = createBlockConfig(
   () =>
     ({
diff --git a/packages/core/src/blocks/ListItem/NumberedListItem/block.ts b/packages/core/src/blocks/ListItem/NumberedListItem/block.ts
@@ -5,6 +5,10 @@ import { handleEnter } from "../../utils/listItemEnterHandler.js";
 import { getListItemContent } from "../getListItemContent.js";
 import { NumberedListIndexingDecorationPlugin } from "./IndexingPlugin.js";
 
+export type NumberedListItemBlockConfig = ReturnType<
+  typeof createNumberedListItemBlockConfig
+>;
+
 export const createNumberedListItemBlockConfig = createBlockConfig(
   () =>
     ({
diff --git a/packages/core/src/blocks/ListItem/ToggleListItem/block.ts b/packages/core/src/blocks/ListItem/ToggleListItem/block.ts
@@ -4,6 +4,10 @@ import { defaultProps } from "../../defaultProps.js";
 import { createToggleWrapper } from "../../ToggleWrapper/createToggleWrapper.js";
 import { handleEnter } from "../../utils/listItemEnterHandler.js";
 
+export type ToggleListItemBlockConfig = ReturnType<
+  typeof createToggleListItemBlockConfig
+>;
+
 export const createToggleListItemBlockConfig = createBlockConfig(
   () =>
     ({
diff --git a/packages/core/src/blocks/PageBreak/block.ts b/packages/core/src/blocks/PageBreak/block.ts
@@ -7,6 +7,10 @@ import {
 } from "../../schema/index.js";
 import { BlockNoteSchema } from "../BlockNoteSchema.js";
 
+export type PageBreakBlockConfig = ReturnType<
+  typeof createPageBreakBlockConfig
+>;
+
 export const createPageBreakBlockConfig = createBlockConfig(
   () =>
     ({
diff --git a/packages/core/src/blocks/Paragraph/block.ts b/packages/core/src/blocks/Paragraph/block.ts
@@ -2,6 +2,10 @@ import { createBlockNoteExtension } from "../../editor/BlockNoteExtension.js";
 import { createBlockConfig, createBlockSpec } from "../../schema/index.js";
 import { defaultProps } from "../defaultProps.js";
 
+export type ParagraphBlockConfig = ReturnType<
+  typeof createParagraphBlockConfig
+>;
+
 export const createParagraphBlockConfig = createBlockConfig(
   () =>
     ({
diff --git a/packages/core/src/blocks/Quote/block.ts b/packages/core/src/blocks/Quote/block.ts
@@ -2,6 +2,8 @@ import { createBlockNoteExtension } from "../../editor/BlockNoteExtension.js";
 import { createBlockConfig, createBlockSpec } from "../../schema/index.js";
 import { defaultProps } from "../defaultProps.js";
 
+export type QuoteBlockConfig = ReturnType<typeof createQuoteBlockConfig>;
+
 export const createQuoteBlockConfig = createBlockConfig(
   () =>
     ({
diff --git a/packages/core/src/blocks/Table/block.ts b/packages/core/src/blocks/Table/block.ts
@@ -5,7 +5,10 @@ import { DOMParser, Fragment, Node as PMNode, Schema } from "prosemirror-model";
 import { TableView } from "prosemirror-tables";
 import { NodeView } from "prosemirror-view";
 import { createBlockNoteExtension } from "../../editor/BlockNoteExtension.js";
-import { createBlockSpecFromTiptapNode } from "../../schema/index.js";
+import {
+  BlockConfig,
+  createBlockSpecFromTiptapNode,
+} from "../../schema/index.js";
 import { mergeCSSClasses } from "../../util/browser.js";
 import { createDefaultBlockDOMOutputSpec } from "../defaultBlockHelpers.js";
 import { defaultProps } from "../defaultProps.js";
@@ -241,6 +244,16 @@ function parseTableContent(node: HTMLElement, schema: Schema) {
   return Fragment.fromArray(extractedContent);
 }
 
+export type TableBlockConfig = BlockConfig<
+  "table",
+  {
+    textColor: {
+      default: "default";
+    };
+  },
+  "table"
+>;
+
 export const createTableBlockSpec = () =>
   createBlockSpecFromTiptapNode(
     { node: TableNode, type: "table", content: "table" },
diff --git a/packages/core/src/blocks/Video/block.ts b/packages/core/src/blocks/Video/block.ts
@@ -12,6 +12,9 @@ export const FILE_VIDEO_ICON_SVG =
 export interface VideoOptions {
   icon?: string;
 }
+
+export type VideoBlockConfig = ReturnType<typeof createVideoBlockConfig>;
+
 export const createVideoBlockConfig = createBlockConfig(
   (_ctx: VideoOptions) => ({
     type: "video" as const,
diff --git a/packages/core/src/extensions/FilePanel/FilePanelPlugin.ts b/packages/core/src/extensions/FilePanel/FilePanelPlugin.ts
@@ -7,7 +7,6 @@ import { BlockNoteExtension } from "../../editor/BlockNoteExtension.js";
 import { UiElementPosition } from "../../extensions-shared/UiElementPosition.js";
 import type {
   BlockFromConfig,
-  // FileBlockConfig,
   InlineContentSchema,
   StyleSchema,
 } from "../../schema/index.js";
diff --git a/packages/core/src/schema/blocks/types.ts b/packages/core/src/schema/blocks/types.ts
@@ -314,47 +314,6 @@ export type SpecificBlock<
   children: BlockNoDefaults<BSchema, I, S>[];
 };
 
-export type FileBlockConfig = {
-  type: "file";
-  readonly propSchema: {
-    backgroundColor: {
-      default: "default";
-    };
-    textAlignment?: {
-      default: "left";
-    };
-    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: undefined;
-      type: "number";
-    };
-  };
-  content: "none";
-  meta: {
-    selectable?: boolean;
-    fileBlockAccept?: string[];
-  };
-};
-
 /** CODE FOR PARTIAL BLOCKS, analogous to above
  *
  * Partial blocks are convenience-wrappers to make it easier to
diff --git a/packages/core/vite.config.ts b/packages/core/vite.config.ts
@@ -19,6 +19,7 @@ export default defineConfig({
       entry: {
         blocknote: path.resolve(__dirname, "src/index.ts"),
         comments: path.resolve(__dirname, "src/comments/index.ts"),
+        blocks: path.resolve(__dirname, "src/blocks/index.ts"),
         locales: path.resolve(__dirname, "src/i18n/index.ts"),
       },
       name: "blocknote",
diff --git a/packages/react/src/blocks/File/helpers/render/AddFileButton.tsx b/packages/react/src/blocks/File/helpers/render/AddFileButton.tsx
@@ -1,4 +1,4 @@
-import { createFileBlockConfig } from "@blocknote/core";
+import { FileBlockConfig } from "@blocknote/core";
 import { ReactNode, useCallback } from "react";
 import { RiFile2Line } from "react-icons/ri";
 
@@ -8,9 +8,9 @@ import { ReactCustomBlockRenderProps } from "../../../../schema/ReactBlockSpec.j
 export const AddFileButton = (
   props: Omit<
     ReactCustomBlockRenderProps<
-      ReturnType<typeof createFileBlockConfig>["type"],
-      ReturnType<typeof createFileBlockConfig>["propSchema"],
-      ReturnType<typeof createFileBlockConfig>["content"]
+      FileBlockConfig["type"],
+      FileBlockConfig["propSchema"],
+      FileBlockConfig["content"]
     >,
     "contentRef"
   > & {
diff --git a/packages/react/src/blocks/File/helpers/render/FileBlockWrapper.tsx b/packages/react/src/blocks/File/helpers/render/FileBlockWrapper.tsx
@@ -10,7 +10,7 @@ export const FileBlockWrapper = (
   props: Omit<
     ReactCustomBlockRenderProps<
       FileBlockConfig["type"],
-      FileBlockConfig["propSchema"],
+      FileBlockConfig["propSchema"] & { showPreview?: { default: true } },
       FileBlockConfig["content"]
     >,
     "contentRef"
diff --git a/packages/react/src/blocks/File/helpers/render/FileNameWithIcon.tsx b/packages/react/src/blocks/File/helpers/render/FileNameWithIcon.tsx
@@ -1,14 +1,14 @@
-import { createFileBlockConfig } from "@blocknote/core";
+import { FileBlockConfig } from "@blocknote/core";
 import { RiFile2Line } from "react-icons/ri";
 
 import { ReactCustomBlockRenderProps } from "../../../../schema/ReactBlockSpec.js";
 
 export const FileNameWithIcon = (
   props: Omit<
     ReactCustomBlockRenderProps<
-      ReturnType<typeof createFileBlockConfig>["type"],
-      ReturnType<typeof createFileBlockConfig>["propSchema"],
-      ReturnType<typeof createFileBlockConfig>["content"]
+      FileBlockConfig["type"],
+      FileBlockConfig["propSchema"],
+      FileBlockConfig["content"]
     >,
     "editor" | "contentRef"
   >,
diff --git a/packages/react/src/blocks/File/helpers/render/ResizableFileBlockWrapper.tsx b/packages/react/src/blocks/File/helpers/render/ResizableFileBlockWrapper.tsx
@@ -9,7 +9,11 @@ export const ResizableFileBlockWrapper = (
   props: Omit<
     ReactCustomBlockRenderProps<
       FileBlockConfig["type"],
-      FileBlockConfig["propSchema"],
+      FileBlockConfig["propSchema"] & {
+        showPreview?: { default: true };
+        previewWidth?: { default: number };
+        textAlignment?: { default: "left" };
+      },
       FileBlockConfig["content"]
     >,
     "contentRef"

Original file line number	Diff line number	Diff line change
`@@ -18,6 +18,8 @@ export interface AudioOptions {`
`18`	`18`	`icon?: string;`
`19`	`19`	`}`
`20`	`20`
	`21`	`+export type AudioBlockConfig = ReturnType<typeof createAudioBlockConfig>;`
	`22`	`+`
`21`	`23`	`export const createAudioBlockConfig = createBlockConfig(`
`22`	`24`	`(_ctx: AudioOptions) =>`
`23`	`25`	`({`
Original file line number	Diff line number	Diff line change
`@@ -12,6 +12,8 @@ export interface HeadingOptions {`
`12`	`12`	`allowToggleHeadings?: boolean;`
`13`	`13`	`}`
`14`	`14`
	`15`	`+export type HeadingBlockConfig = ReturnType<typeof createHeadingBlockConfig>;`
	`16`	`+`
`15`	`17`	`export const createHeadingBlockConfig = createBlockConfig(`
`16`	`18`	`({`
`17`	`19`	`defaultLevel = 1,`