@blocknote/core 0.1.1 → 0.2.0

package/types/src/BlockNoteEditor.d.ts

@@ -0,0 +1,13 @@
+import { Editor, EditorOptions } from "@tiptap/core";
+import { UiFactories } from "./BlockNoteExtensions";
+export declare type BlockNoteEditorOptions = EditorOptions & {
+    enableBlockNoteExtensions: boolean;
+    disableHistoryExtension: boolean;
+    uiFactories: UiFactories;
+};
+export declare class BlockNoteEditor {
+    readonly tiptapEditor: Editor & {
+        contentComponent: any;
+    };
+    constructor(options?: Partial<BlockNoteEditorOptions>);
+}

package/types/src/BlockNoteExtensions.d.ts

@@ -1,7 +1,18 @@
 import { Extensions } from "@tiptap/core";
 import { Node } from "@tiptap/core";
+import { FormattingToolbarFactory } from "./extensions/FormattingToolbar/FormattingToolbarFactoryTypes";
+import { HyperlinkToolbarFactory } from "./extensions/HyperlinkToolbar/HyperlinkToolbarFactoryTypes";
+import { SuggestionsMenuFactory } from "./shared/plugins/suggestion/SuggestionsMenuFactoryTypes";
+import { BlockSideMenuFactory } from "./extensions/DraggableBlocks/BlockSideMenuFactoryTypes";
+import { SlashMenuItem } from "./extensions/SlashMenu/SlashMenuItem";
 export declare const Document: Node<any, any>;
+export declare type UiFactories = Partial<{
+    formattingToolbarFactory: FormattingToolbarFactory;
+    hyperlinkToolbarFactory: HyperlinkToolbarFactory;
+    slashMenuFactory: SuggestionsMenuFactory<SlashMenuItem>;
+    blockSideMenuFactory: BlockSideMenuFactory;
+}>;
 /**
  * Get all the Tiptap extensions BlockNote is configured with by default
  */
-export declare const getBlockNoteExtensions: () => Extensions;
+export declare const getBlockNoteExtensions: (uiFactories: UiFactories) => Extensions;

package/types/src/EditorElement.d.ts

@@ -0,0 +1,7 @@
+export declare type EditorElement<ElementParams extends Record<string, any>> = {
+    element: HTMLElement | undefined;
+    show: (params: ElementParams) => void;
+    hide: () => void;
+    update: (params: ElementParams) => void;
+};
+export declare type ElementFactory<ElementParams extends Record<string, any>> = (params: ElementParams) => EditorElement<ElementParams>;

package/types/src/extensions/Blocks/PreviousBlockTypePlugin.d.ts

@@ -2,7 +2,7 @@ import { Plugin } from "prosemirror-state";
 /**
  * This plugin tracks transformation of Block node attributes, so we can support CSS transitions.
  *
- * Problem it solves: Prosemirror recreates the DOM when transactions happen. So when a transaction changes an Node attribute,
+ * Problem it solves: ProseMirror recreates the DOM when transactions happen. So when a transaction changes a Node attribute,
  * it results in a completely new DOM element. This means CSS transitions don't work.
  *
  * Solution: When attributes change on a node, this plugin sets a data-* attribute with the "previous" value. This way we can still use CSS transitions. (See block.module.css)

package/types/src/extensions/Blocks/helpers/getBlockInfoFromPos.d.ts

@@ -0,0 +1,19 @@
+import { Node, NodeType } from "prosemirror-model";
+export declare type BlockInfo = {
+    id: string;
+    node: Node;
+    contentNode: Node;
+    contentType: NodeType;
+    numChildBlocks: number;
+    startPos: number;
+    endPos: number;
+    depth: number;
+};
+/**
+ * Retrieves information regarding the most nested block node in a ProseMirror doc, that a given position lies in.
+ * @param doc The ProseMirror doc.
+ * @param posInBlock A position somewhere within a block node.
+ * @returns A BlockInfo object for the block the given position is in, or undefined if the position is not in a block
+ * for the given doc.
+ */
+export declare function getBlockInfoFromPos(doc: Node, posInBlock: number): BlockInfo | undefined;

package/types/src/extensions/Blocks/nodes/Block.d.ts

@@ -1,28 +1,20 @@
 import { Node } from "@tiptap/core";
+import { TextContentType } from "./BlockTypes/TextBlock/TextContent";
+import { HeadingContentType } from "./BlockTypes/HeadingBlock/HeadingContent";
+import { ListItemContentType } from "./BlockTypes/ListItemBlock/ListItemContent";
 export interface IBlock {
     HTMLAttributes: Record<string, any>;
 }
-export declare type Level = "1" | "2" | "3";
-export declare type ListType = "li" | "oli";
+export declare type BlockContentType = TextContentType | HeadingContentType | ListItemContentType;
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
-        blockHeading: {
-            /**
-             * Set a heading node
-             */
-            setBlockHeading: (attributes: {
-                level: Level;
-            }) => ReturnType;
-            /**
-             * Unset a heading node
-             */
-            unsetBlockHeading: () => ReturnType;
-            unsetList: () => ReturnType;
-            addNewBlockAsSibling: (attributes?: {
-                headingType?: Level;
-                listType?: ListType;
-            }) => ReturnType;
-            setBlockList: (type: ListType) => ReturnType;
+        block: {
+            BNCreateBlock: (pos: number) => ReturnType;
+            BNDeleteBlock: (posInBlock: number) => ReturnType;
+            BNMergeBlocks: (posBetweenBlocks: number) => ReturnType;
+            BNSplitBlock: (posInBlock: number, keepType: boolean) => ReturnType;
+            BNSetContentType: (posInBlock: number, type: BlockContentType) => ReturnType;
+            BNCreateBlockOrSetContentType: (posInBlock: number, type: BlockContentType) => ReturnType;
         };
     }
 }

package/types/src/extensions/Blocks/nodes/BlockTypes/HeadingBlock/HeadingContent.d.ts

@@ -0,0 +1,8 @@
+import { Node } from "@tiptap/core";
+export declare type HeadingContentType = {
+    name: "headingContent";
+    attrs?: {
+        headingLevel: string;
+    };
+};
+export declare const HeadingContent: Node<any, any>;

package/types/src/extensions/Blocks/nodes/BlockTypes/ListItemBlock/ListItemContent.d.ts

@@ -0,0 +1,8 @@
+import { Node } from "@tiptap/core";
+export declare type ListItemContentType = {
+    name: "listItemContent";
+    attrs?: {
+        listItemType: string;
+    };
+};
+export declare const ListItemContent: Node<any, any>;

package/types/src/extensions/Blocks/nodes/BlockTypes/ListItemBlock/OrderedListItemIndexPlugin.d.ts

@@ -0,0 +1,2 @@
+import { Plugin } from "prosemirror-state";
+export declare const OrderedListItemIndexPlugin: () => Plugin<any>;

package/types/src/extensions/Blocks/nodes/BlockTypes/TextBlock/TextContent.d.ts

@@ -0,0 +1,6 @@
+import { Node } from "@tiptap/core";
+export declare type TextContentType = {
+    name: "textContent";
+    attrs?: {};
+};
+export declare const TextContent: Node<any, any>;

package/types/src/extensions/BubbleMenu/BubbleMenuExtension.d.ts

@@ -1,5 +1,8 @@
 import { Extension } from "@tiptap/core";
+import { BubbleMenuFactory } from "./BubbleMenuFactoryTypes";
 /**
  * The menu that is displayed when selecting a piece of text.
  */
-export declare const BubbleMenuExtension: Extension<{}, any>;
+export declare const BubbleMenuExtension: Extension<{
+    bubbleMenuFactory: BubbleMenuFactory;
+}, any>;

package/types/src/extensions/BubbleMenu/BubbleMenuFactoryTypes.d.ts

@@ -0,0 +1,27 @@
+import { EditorElement, ElementFactory } from "../../shared/EditorElement";
+export declare type BubbleMenuParams = {
+    boldIsActive: boolean;
+    toggleBold: () => void;
+    italicIsActive: boolean;
+    toggleItalic: () => void;
+    underlineIsActive: boolean;
+    toggleUnderline: () => void;
+    strikeIsActive: boolean;
+    toggleStrike: () => void;
+    hyperlinkIsActive: boolean;
+    activeHyperlinkUrl: string;
+    activeHyperlinkText: string;
+    setHyperlink: (url: string, text?: string) => void;
+    paragraphIsActive: boolean;
+    setParagraph: () => void;
+    headingIsActive: boolean;
+    activeHeadingLevel: string;
+    setHeading: (level: string) => void;
+    setListItem: (type: string) => void;
+    listItemIsActive: boolean;
+    activeListItemType: string;
+    selectionBoundingBox: DOMRect;
+    editorElement: Element;
+};
+export declare type BubbleMenu = EditorElement<BubbleMenuParams>;
+export declare type BubbleMenuFactory = ElementFactory<BubbleMenuParams>;

package/types/src/extensions/BubbleMenu/BubbleMenuPlugin.d.ts

@@ -1,12 +1,11 @@
 import { Editor } from "@tiptap/core";
 import { EditorState, Plugin, PluginKey } from "prosemirror-state";
 import { EditorView } from "prosemirror-view";
-import { Instance, Props } from "tippy.js";
+import { BubbleMenu, BubbleMenuFactory, BubbleMenuParams } from "./BubbleMenuFactoryTypes";
 export interface BubbleMenuPluginProps {
-    pluginKey: PluginKey | string;
+    pluginKey: PluginKey;
     editor: Editor;
-    element: HTMLElement;
-    tippyOptions?: Partial<Props>;
+    bubbleMenuFactory: BubbleMenuFactory;
     shouldShow?: ((props: {
         editor: Editor;
         view: EditorView;
@@ -21,15 +20,14 @@ export declare type BubbleMenuViewProps = BubbleMenuPluginProps & {
 };
 export declare class BubbleMenuView {
     editor: Editor;
-    element: HTMLElement;
     view: EditorView;
+    bubbleMenuParams: BubbleMenuParams;
+    bubbleMenu: BubbleMenu;
     preventHide: boolean;
     preventShow: boolean;
-    tippy: Instance | undefined;
-    tippyOptions?: Partial<Props>;
+    menuIsOpen: boolean;
     shouldShow: Exclude<BubbleMenuPluginProps["shouldShow"], null>;
-    constructor({ editor, element, view, tippyOptions, shouldShow, }: BubbleMenuViewProps);
-    mousedownHandler: () => void;
+    constructor({ editor, bubbleMenuFactory, view, shouldShow, }: BubbleMenuViewProps);
     viewMousedownHandler: () => void;
     viewMouseupHandler: () => void;
     dragstartHandler: () => void;
@@ -37,10 +35,10 @@ export declare class BubbleMenuView {
     blurHandler: ({ event }: {
         event: FocusEvent;
     }) => void;
-    createTooltip(): void;
     update(view: EditorView, oldState?: EditorState): void;
-    show(): void;
-    hide(): void;
     destroy(): void;
+    getSelectionBoundingBox(): DOMRect;
+    initBubbleMenuParams(): BubbleMenuParams;
+    updateBubbleMenuParams(): void;
 }
 export declare const createBubbleMenuPlugin: (options: BubbleMenuPluginProps) => Plugin<any>;

package/types/src/extensions/DraggableBlocks/BlockMenuFactoryTypes.d.ts

@@ -0,0 +1,12 @@
+import { EditorElement, ElementFactory } from "../../shared/EditorElement";
+export declare type BlockMenuParams = {
+    addBlock: () => void;
+    deleteBlock: () => void;
+    blockDragStart: (event: DragEvent) => void;
+    blockDragEnd: () => void;
+    freezeMenu: () => void;
+    unfreezeMenu: () => void;
+    blockBoundingBox: DOMRect;
+};
+export declare type BlockMenu = EditorElement<BlockMenuParams>;
+export declare type BlockMenuFactory = ElementFactory<BlockMenuParams>;

package/types/src/extensions/DraggableBlocks/BlockSideMenuFactoryTypes.d.ts

@@ -0,0 +1,14 @@
+import { EditorElement, ElementFactory } from "../../shared/EditorElement";
+export declare type BlockSideMenuStaticParams = {
+    addBlock: () => void;
+    deleteBlock: () => void;
+    blockDragStart: (event: DragEvent) => void;
+    blockDragEnd: () => void;
+    freezeMenu: () => void;
+    unfreezeMenu: () => void;
+};
+export declare type BlockSideMenuDynamicParams = {
+    blockBoundingBox: DOMRect;
+};
+export declare type BlockSideMenu = EditorElement<BlockSideMenuDynamicParams>;
+export declare type BlockSideMenuFactory = ElementFactory<BlockSideMenuStaticParams, BlockSideMenuDynamicParams>;

package/types/src/extensions/DraggableBlocks/DragMenuFactoryTypes.d.ts

@@ -0,0 +1,18 @@
+import { EditorElement, ElementFactory } from "../../shared/EditorElement";
+export declare type AddBlockButtonParams = {
+    addBlock: () => void;
+    blockBoundingBox: DOMRect;
+};
+export declare type AddBlockButton = EditorElement<AddBlockButtonParams>;
+export declare type AddBlockButtonFactory = ElementFactory<AddBlockButtonParams>;
+export declare type DragHandleParams = {
+    blockBoundingBox: DOMRect;
+};
+export declare type DragHandle = EditorElement<DragHandleParams>;
+export declare type DragHandleFactory = ElementFactory<DragHandleParams>;
+export declare type DragHandleMenuParams = {
+    deleteBlock: () => void;
+    dragHandleBoundingBox: DOMRect;
+};
+export declare type DragHandleMenu = EditorElement<DragHandleMenuParams>;
+export declare type DragHandleMenuFactory = ElementFactory<DragHandleMenuParams>;

package/types/src/extensions/DraggableBlocks/DraggableBlocksExtension.d.ts

@@ -1,7 +1,13 @@
-import { Extension } from "@tiptap/core";
+import { Editor, Extension } from "@tiptap/core";
+import { BlockSideMenuFactory } from "./BlockSideMenuFactoryTypes";
+export declare type DraggableBlocksOptions = {
+    editor: Editor;
+    blockSideMenuFactory: BlockSideMenuFactory;
+};
 /**
- * This extension adds a drag handle in front of all nodes with a "data-id" attribute
+ * This extension adds a menu to the side of blocks which features various BlockNote functions such as adding and
+ * removing blocks. More importantly, it adds a drag handle which allows the user to drag and drop blocks.
  *
  * code based on https://github.com/ueberdosis/tiptap/issues/323#issuecomment-506637799
  */
-export declare const DraggableBlocksExtension: Extension<{}, any>;
+export declare const DraggableBlocksExtension: Extension<DraggableBlocksOptions, any>;

package/types/src/extensions/DraggableBlocks/DraggableBlocksPlugin.d.ts

@@ -1,4 +1,7 @@
+import { Editor } from "@tiptap/core";
 import { Plugin } from "prosemirror-state";
+import { DraggableBlocksOptions } from "./DraggableBlocksExtension";
+import { BlockSideMenu, BlockSideMenuDynamicParams, BlockSideMenuFactory, BlockSideMenuStaticParams } from "./BlockSideMenuFactoryTypes";
 export declare function createRect(rect: DOMRect): {
     left: number;
     top: number;
@@ -15,4 +18,23 @@ export declare function absoluteRect(element: HTMLElement): {
     bottom: number;
     right: number;
 };
-export declare const createDraggableBlocksPlugin: () => Plugin<any>;
+export declare type BlockMenuViewProps = {
+    editor: Editor;
+    blockMenuFactory: BlockSideMenuFactory;
+    horizontalPosAnchoredAtRoot: boolean;
+};
+export declare class BlockMenuView {
+    editor: Editor;
+    horizontalPosAnchoredAtRoot: boolean;
+    blockMenu: BlockSideMenu;
+    hoveredBlock: HTMLElement | undefined;
+    menuOpen: boolean;
+    menuFrozen: boolean;
+    constructor({ editor, blockMenuFactory, horizontalPosAnchoredAtRoot, }: BlockMenuViewProps);
+    destroy(): void;
+    addBlock(): void;
+    deleteBlock(): void;
+    getStaticParams(): BlockSideMenuStaticParams;
+    getDynamicParams(): BlockSideMenuDynamicParams;
+}
+export declare const createDraggableBlocksPlugin: (options: DraggableBlocksOptions) => Plugin<any>;

package/types/src/extensions/FormattingToolbar/FormattingToolbarExtension.d.ts

@@ -0,0 +1,8 @@
+import { Extension } from "@tiptap/core";
+import { FormattingToolbarFactory } from "./FormattingToolbarFactoryTypes";
+/**
+ * The menu that is displayed when selecting a piece of text.
+ */
+export declare const FormattingToolbarExtension: Extension<{
+    formattingToolbarFactory: FormattingToolbarFactory;
+}, any>;

package/types/src/extensions/FormattingToolbar/FormattingToolbarFactoryTypes.d.ts

@@ -0,0 +1,23 @@
+import { EditorElement, ElementFactory } from "../../shared/EditorElement";
+import { BlockContentType } from "../Blocks/nodes/Block";
+export declare type FormattingToolbarStaticParams = {
+    toggleBold: () => void;
+    toggleItalic: () => void;
+    toggleUnderline: () => void;
+    toggleStrike: () => void;
+    setHyperlink: (url: string, text?: string) => void;
+    setBlockType: (type: BlockContentType) => void;
+};
+export declare type FormattingToolbarDynamicParams = {
+    boldIsActive: boolean;
+    italicIsActive: boolean;
+    underlineIsActive: boolean;
+    strikeIsActive: boolean;
+    hyperlinkIsActive: boolean;
+    activeHyperlinkUrl: string;
+    activeHyperlinkText: string;
+    activeBlockType: Required<BlockContentType>;
+    selectionBoundingBox: DOMRect;
+};
+export declare type FormattingToolbar = EditorElement<FormattingToolbarDynamicParams>;
+export declare type FormattingToolbarFactory = ElementFactory<FormattingToolbarStaticParams, FormattingToolbarDynamicParams>;

package/types/src/extensions/FormattingToolbar/FormattingToolbarPlugin.d.ts

@@ -0,0 +1,43 @@
+import { Editor } from "@tiptap/core";
+import { EditorState, Plugin, PluginKey } from "prosemirror-state";
+import { EditorView } from "prosemirror-view";
+import { FormattingToolbar, FormattingToolbarDynamicParams, FormattingToolbarFactory, FormattingToolbarStaticParams } from "./FormattingToolbarFactoryTypes";
+export interface FormattingToolbarPluginProps {
+    pluginKey: PluginKey;
+    editor: Editor;
+    formattingToolbarFactory: FormattingToolbarFactory;
+    shouldShow?: ((props: {
+        editor: Editor;
+        view: EditorView;
+        state: EditorState;
+        oldState?: EditorState;
+        from: number;
+        to: number;
+    }) => boolean) | null;
+}
+export declare type FormattingToolbarViewProps = FormattingToolbarPluginProps & {
+    view: EditorView;
+};
+export declare class FormattingToolbarView {
+    editor: Editor;
+    view: EditorView;
+    formattingToolbar: FormattingToolbar;
+    preventHide: boolean;
+    preventShow: boolean;
+    toolbarIsOpen: boolean;
+    shouldShow: Exclude<FormattingToolbarPluginProps["shouldShow"], null>;
+    constructor({ editor, formattingToolbarFactory, view, shouldShow, }: FormattingToolbarViewProps);
+    viewMousedownHandler: () => void;
+    viewMouseupHandler: () => void;
+    dragstartHandler: () => void;
+    focusHandler: () => void;
+    blurHandler: ({ event }: {
+        event: FocusEvent;
+    }) => void;
+    update(view: EditorView, oldState?: EditorState): void;
+    destroy(): void;
+    getSelectionBoundingBox(): DOMRect;
+    getStaticParams(): FormattingToolbarStaticParams;
+    getDynamicParams(): FormattingToolbarDynamicParams;
+}
+export declare const createFormattingToolbarPlugin: (options: FormattingToolbarPluginProps) => Plugin<any>;

package/types/src/extensions/HyperlinkToolbar/HyperlinkMark.d.ts

@@ -0,0 +1,8 @@
+import { HyperlinkToolbarPluginProps } from "./HyperlinkToolbarPlugin";
+/**
+ * This custom link includes a special menu for editing/deleting/opening the link.
+ * The menu will be triggered by hovering over the link with the mouse,
+ * or by moving the cursor inside the link text
+ */
+declare const Hyperlink: import("@tiptap/core").Mark<HyperlinkToolbarPluginProps, any>;
+export default Hyperlink;

package/types/src/extensions/HyperlinkToolbar/HyperlinkToolbarFactoryTypes.d.ts

@@ -0,0 +1,12 @@
+import { EditorElement, ElementFactory } from "../../shared/EditorElement";
+export declare type HyperlinkToolbarStaticParams = {
+    editHyperlink: (url: string, text: string) => void;
+    deleteHyperlink: () => void;
+};
+export declare type HyperlinkToolbarDynamicParams = {
+    url: string;
+    text: string;
+    boundingBox: DOMRect;
+};
+export declare type HyperlinkToolbar = EditorElement<HyperlinkToolbarDynamicParams>;
+export declare type HyperlinkToolbarFactory = ElementFactory<HyperlinkToolbarStaticParams, HyperlinkToolbarDynamicParams>;

package/types/src/extensions/HyperlinkToolbar/HyperlinkToolbarPlugin.d.ts

@@ -0,0 +1,11 @@
+import { Editor } from "@tiptap/core";
+import { Plugin } from "prosemirror-state";
+import { HyperlinkToolbarFactory } from "./HyperlinkToolbarFactoryTypes";
+export declare type HyperlinkToolbarPluginProps = {
+    hyperlinkToolbarFactory: HyperlinkToolbarFactory;
+};
+export declare type HyperlinkToolbarViewProps = {
+    editor: Editor;
+    hyperlinkToolbarFactory: HyperlinkToolbarFactory;
+};
+export declare const createHyperlinkToolbarPlugin: (editor: Editor, options: HyperlinkToolbarPluginProps) => Plugin<any>;

package/types/src/extensions/Hyperlinks/HyperlinkMark.d.ts

@@ -1,7 +1,8 @@
+import { HyperlinkMenuPluginProps } from "./HyperlinkMenuPlugin";
 /**
  * This custom link includes a special menu for editing/deleting/opening the link.
  * The menu will be triggered by hovering over the link with the mouse,
  * or by moving the cursor inside the link text
  */
-declare const Hyperlink: import("@tiptap/core").Mark<import("@tiptap/extension-link").LinkOptions, any>;
+declare const Hyperlink: import("@tiptap/core").Mark<HyperlinkMenuPluginProps, any>;
 export default Hyperlink;

package/types/src/extensions/Hyperlinks/HyperlinkMenuFactoryTypes.d.ts

@@ -0,0 +1,11 @@
+import { EditorElement, ElementFactory } from "../../shared/EditorElement";
+export declare type HyperlinkMenuParams = {
+    url: string;
+    text: string;
+    editHyperlink: (url: string, text: string) => void;
+    deleteHyperlink: () => void;
+    boundingBox: DOMRect;
+    editorElement: Element;
+};
+export declare type HyperlinkMenu = EditorElement<HyperlinkMenuParams>;
+export declare type HyperlinkMenuFactory = ElementFactory<HyperlinkMenuParams>;

package/types/src/extensions/Hyperlinks/HyperlinkMenuPlugin.d.ts

@@ -1,2 +1,11 @@
+import { Editor } from "@tiptap/core";
 import { Plugin } from "prosemirror-state";
-export declare const createHyperlinkMenuPlugin: () => Plugin<any>;
+import { HyperlinkMenuFactory } from "./HyperlinkMenuFactoryTypes";
+export declare type HyperlinkMenuPluginProps = {
+    hyperlinkMenuFactory: HyperlinkMenuFactory;
+};
+export declare type HyperlinkMenuViewProps = {
+    editor: Editor;
+    hyperlinkMenuFactory: HyperlinkMenuFactory;
+};
+export declare const createHyperlinkMenuPlugin: (editor: Editor, options: HyperlinkMenuPluginProps) => Plugin<any>;

package/types/src/extensions/SlashMenu/SlashMenuExtension.d.ts

@@ -1,10 +1,12 @@
 import { Extension } from "@tiptap/core";
-import { SlashMenuItem } from "./SlashMenuItem";
 import { PluginKey } from "prosemirror-state";
+import { SuggestionsMenuFactory } from "../../shared/plugins/suggestion/SuggestionsMenuFactoryTypes";
+import { SlashMenuItem } from "./SlashMenuItem";
 export declare type SlashMenuOptions = {
     commands: {
         [key: string]: SlashMenuItem;
     };
+    slashMenuFactory: SuggestionsMenuFactory<any> | undefined;
 };
 export declare const SlashMenuPluginKey: PluginKey<any>;
 export declare const SlashMenuExtension: Extension<SlashMenuOptions, any>;

package/types/src/extensions/SlashMenu/SlashMenuItem.d.ts

@@ -1,6 +1,5 @@
 import { Editor, Range } from "@tiptap/core";
-import SuggestionItem from "../../shared/plugins/suggestion/SuggestionItem";
-import { IconType } from "react-icons";
+import { SuggestionItem } from "../../shared/plugins/suggestion/SuggestionItem";
 export declare type SlashMenuCallback = (editor: Editor, range: Range) => boolean;
 export declare enum SlashMenuGroups {
     HEADINGS = "Headings",
@@ -20,7 +19,6 @@ export declare class SlashMenuItem implements SuggestionItem {
     readonly group: SlashMenuGroups;
     readonly execute: SlashMenuCallback;
     readonly aliases: string[];
-    readonly icon?: IconType | undefined;
     readonly hint?: string | undefined;
     readonly shortcut?: string | undefined;
     groupName: string;
@@ -35,6 +33,6 @@ export declare class SlashMenuItem implements SuggestionItem {
      * @param hint Short description of command
      * @param shortcut Info about keyboard shortcut that would activate this command
      */
-    constructor(name: string, group: SlashMenuGroups, execute: SlashMenuCallback, aliases?: string[], icon?: IconType | undefined, hint?: string | undefined, shortcut?: string | undefined);
+    constructor(name: string, group: SlashMenuGroups, execute: SlashMenuCallback, aliases?: string[], hint?: string | undefined, shortcut?: string | undefined);
     match(query: string): boolean;
 }

package/types/src/index.d.ts

@@ -1,4 +1,9 @@
-import "./globals.css";
+export * from "./BlockNoteEditor";
 export * from "./BlockNoteExtensions";
-export * from "./EditorContent";
-export * from "./useEditor";
+export type { BlockContentType } from "./extensions/Blocks/nodes/Block";
+export * from "./extensions/FormattingToolbar/FormattingToolbarFactoryTypes";
+export * from "./extensions/DraggableBlocks/BlockSideMenuFactoryTypes";
+export * from "./extensions/HyperlinkToolbar/HyperlinkToolbarFactoryTypes";
+export * from "./extensions/SlashMenu/SlashMenuItem";
+export type { SuggestionItem } from "./shared/plugins/suggestion/SuggestionItem";
+export * from "./shared/plugins/suggestion/SuggestionsMenuFactoryTypes";

package/types/src/shared/EditorElement.d.ts

@@ -0,0 +1,6 @@
+export declare type EditorElement<ElementDynamicParams extends Record<string, any>> = {
+    element: HTMLElement | undefined;
+    render: (params: ElementDynamicParams, isHidden: boolean) => void;
+    hide: () => void;
+};
+export declare type ElementFactory<ElementStaticParams extends Record<string, any>, ElementDynamicParams extends Record<string, any>> = (staticParams: ElementStaticParams) => EditorElement<ElementDynamicParams>;

package/types/src/shared/plugins/suggestion/SuggestionItem.d.ts

@@ -1,8 +1,7 @@
-import { IconType } from "react-icons";
 /**
  * A generic interface used in all suggestion menus (slash menu, mentions, etc)
  */
-export default interface SuggestionItem {
+export interface SuggestionItem {
     /**
      * The name of the item
      */
@@ -11,10 +10,6 @@ export default interface SuggestionItem {
      * The name of the group to which this item belongs
      */
     groupName: string;
-    /**
-     * The react icon
-     */
-    icon?: IconType;
     hint?: string;
     shortcut?: string;
     /**

package/types/src/shared/plugins/suggestion/SuggestionPlugin.d.ts

@@ -1,6 +1,7 @@
 import { Editor, Range } from "@tiptap/core";
 import { Plugin, PluginKey, Selection } from "prosemirror-state";
-import SuggestionItem from "./SuggestionItem";
+import { SuggestionsMenuFactory } from "./SuggestionsMenuFactoryTypes";
+import { SuggestionItem } from "./SuggestionItem";
 export declare type SuggestionPluginOptions<T extends SuggestionItem> = {
     /**
      * The name of the plugin.
@@ -16,6 +17,7 @@ export declare type SuggestionPluginOptions<T extends SuggestionItem> = {
      * The character that should trigger the suggestion menu to pop up (e.g. a '/' for commands)
      */
     char: string;
+    suggestionsMenuFactory: SuggestionsMenuFactory<T>;
     /**
      * The callback that gets executed when an item is selected by the user.
      *
@@ -37,6 +39,16 @@ export declare type SuggestionPluginOptions<T extends SuggestionItem> = {
         range: Range;
     }) => boolean;
 };
+declare type SuggestionPluginState<T extends SuggestionItem> = {
+    active: boolean;
+    range: Range | null;
+    query: string | null;
+    notFoundCount: number;
+    items: T[];
+    selectedItemIndex: number;
+    type: string;
+    decorationId: string | null;
+};
 export declare type MenuType = "slash" | "drag";
 /**
  * Finds a command: a specified character (e.g. '/') followed by a string of characters (all characters except the specified character are allowed).
@@ -63,12 +75,5 @@ export declare function findCommandBeforeCursor(char: string, selection: Selecti
  * @param options options for configuring the plugin
  * @returns the prosemirror plugin
  */
-export declare function createSuggestionPlugin<T extends SuggestionItem>({ pluginKey, editor, char, onSelectItem: selectItemCallback, items, }: SuggestionPluginOptions<T>): Plugin<{
-    active: boolean;
-    range: any;
-    query: string | null;
-    notFoundCount: number;
-    items: T[];
-    type: string;
-    decorationId: string | null;
-}>;
+export declare function createSuggestionPlugin<T extends SuggestionItem>({ pluginKey, editor, char, suggestionsMenuFactory, onSelectItem: selectItemCallback, items, }: SuggestionPluginOptions<T>): Plugin<SuggestionPluginState<T>>;
+export {};

package/types/src/shared/plugins/suggestion/SuggestionsMenuFactoryTypes.d.ts

@@ -0,0 +1,12 @@
+import { EditorElement, ElementFactory } from "../../EditorElement";
+import { SuggestionItem } from "./SuggestionItem";
+export declare type SuggestionsMenuStaticParams<T extends SuggestionItem> = {
+    itemCallback: (item: T) => void;
+};
+export declare type SuggestionsMenuDynamicParams<T extends SuggestionItem> = {
+    items: T[];
+    selectedItemIndex: number;
+    queryStartBoundingBox: DOMRect;
+};
+export declare type SuggestionsMenu<T extends SuggestionItem> = EditorElement<SuggestionsMenuDynamicParams<T>>;
+export declare type SuggestionsMenuFactory<T extends SuggestionItem> = ElementFactory<SuggestionsMenuStaticParams<T>, SuggestionsMenuDynamicParams<T>>;

package/types/src/shared/utils.d.ts

@@ -0,0 +1,2 @@
+export declare const isAppleOS: () => boolean;
+export declare function formatKeyboardShortcut(shortcut: string): string;