@react-email/editor 0.0.0-experimental.37 → 0.0.0-experimental.39

package/dist/{root-CNVO39XG.cjs → root-Gu08xybW.cjs}

@@ -1,13 +1,13 @@
 const require_event_bus = require('./event-bus-fb8U7hrl.cjs');
-const require_set_text_alignment = require('./set-text-alignment-aNb7Ml9N.cjs');
+const require_set_text_alignment = require('./set-text-alignment-Cv72txmv.cjs');
 let _tiptap_react = require("@tiptap/react");
 let react = require("react");
 react = require_event_bus.__toESM(react);
 let react_jsx_runtime = require("react/jsx-runtime");
 let _tiptap_pm_state = require("@tiptap/pm/state");
+let _tiptap_react_menus = require("@tiptap/react/menus");
 let _radix_ui_react_popover = require("@radix-ui/react-popover");
 _radix_ui_react_popover = require_event_bus.__toESM(_radix_ui_react_popover);
-let _tiptap_react_menus = require("@tiptap/react/menus");
 let _floating_ui_react_dom = require("@floating-ui/react-dom");
 let _tiptap_suggestion = require("@tiptap/suggestion");
 _tiptap_suggestion = require_event_bus.__toESM(_tiptap_suggestion);
@@ -746,137 +746,28 @@ function useBubbleMenuContext() {
 }
 
 //#endregion
-//#region src/ui/bubble-menu/item.tsx
-function BubbleMenuItem({ name, isActive, onCommand, className, children, ...rest }) {
+//#region src/ui/bubble-menu/button-edit-link.tsx
+function BubbleMenuButtonEditLink({ className, children, onClick, onMouseDown, ...rest }) {
+	const { setIsEditing } = useBubbleMenuContext();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-		type: "button",
-		"aria-label": name,
-		"aria-pressed": isActive,
-		className,
-		"data-re-bubble-menu-item": "",
-		"data-item": name,
-		...isActive ? { "data-active": "" } : {},
-		onMouseDown: (e) => e.preventDefault(),
-		onClick: onCommand,
 		...rest,
-		children
-	});
-}
-
-//#endregion
-//#region src/ui/bubble-menu/align-center.tsx
-function BubbleMenuAlignCenter({ className, children }) {
-	const { editor } = useBubbleMenuContext();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuItem, {
-		name: "align-center",
-		isActive: (0, _tiptap_react.useEditorState)({
-			editor,
-			selector: ({ editor: editor$1 }) => editor$1?.isActive({ alignment: "center" }) ?? false
-		}),
-		onCommand: () => require_set_text_alignment.setTextAlignment(editor, "center"),
-		className,
-		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AlignCenterIcon, {})
-	});
-}
-
-//#endregion
-//#region src/ui/bubble-menu/align-left.tsx
-function BubbleMenuAlignLeft({ className, children }) {
-	const { editor } = useBubbleMenuContext();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuItem, {
-		name: "align-left",
-		isActive: (0, _tiptap_react.useEditorState)({
-			editor,
-			selector: ({ editor: editor$1 }) => editor$1?.isActive({ alignment: "left" }) ?? false
-		}),
-		onCommand: () => require_set_text_alignment.setTextAlignment(editor, "left"),
-		className,
-		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AlignLeftIcon, {})
-	});
-}
-
-//#endregion
-//#region src/ui/bubble-menu/align-right.tsx
-function BubbleMenuAlignRight({ className, children }) {
-	const { editor } = useBubbleMenuContext();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuItem, {
-		name: "align-right",
-		isActive: (0, _tiptap_react.useEditorState)({
-			editor,
-			selector: ({ editor: editor$1 }) => editor$1?.isActive({ alignment: "right" }) ?? false
-		}),
-		onCommand: () => require_set_text_alignment.setTextAlignment(editor, "right"),
-		className,
-		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AlignRightIcon, {})
-	});
-}
-
-//#endregion
-//#region src/ui/bubble-menu/create-mark-bubble-item.tsx
-function createMarkBubbleItem(config) {
-	function MarkBubbleItem({ className, children }) {
-		const { editor } = useBubbleMenuContext();
-		const isActive = (0, _tiptap_react.useEditorState)({
-			editor,
-			selector: ({ editor: editor$1 }) => {
-				if (config.activeParams) return editor$1?.isActive(config.activeName, config.activeParams) ?? false;
-				return editor$1?.isActive(config.activeName) ?? false;
-			}
-		});
-		const handleCommand = () => {
-			const chain = editor.chain().focus();
-			const method = chain[config.command];
-			if (method) method.call(chain).run();
-		};
-		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuItem, {
-			name: config.name,
-			isActive,
-			onCommand: handleCommand,
-			className,
-			children: children ?? config.icon
-		});
-	}
-	MarkBubbleItem.displayName = `BubbleMenu${config.name.charAt(0).toUpperCase() + config.name.slice(1)}`;
-	return MarkBubbleItem;
-}
-
-//#endregion
-//#region src/ui/bubble-menu/bold.tsx
-const BubbleMenuBold = createMarkBubbleItem({
-	name: "bold",
-	activeName: "bold",
-	command: "toggleBold",
-	icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BoldIcon, {})
-});
-
-//#endregion
-//#region src/ui/bubble-menu/code.tsx
-const BubbleMenuCode = createMarkBubbleItem({
-	name: "code",
-	activeName: "code",
-	command: "toggleCode",
-	icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CodeIcon, {})
-});
-
-//#endregion
-//#region src/ui/bubble-menu/group.tsx
-function BubbleMenuItemGroup({ className, children }) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("fieldset", {
+		type: "button",
+		"aria-label": "Edit link",
+		"data-re-btn-bm-item": "",
+		"data-item": "edit-link",
 		className,
-		"data-re-bubble-menu-group": "",
-		children
+		onMouseDown: (e) => {
+			e.preventDefault();
+			onMouseDown?.(e);
+		},
+		onClick: (e) => {
+			onClick?.(e);
+			setIsEditing(true);
+		},
+		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PencilIcon, {})
 	});
 }
 
-//#endregion
-//#region src/ui/bubble-menu/italic.tsx
-const BubbleMenuItalic = createMarkBubbleItem({
-	name: "italic",
-	activeName: "italic",
-	command: "toggleItalic",
-	icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ItalicIcon, {})
-});
-
 //#endregion
 //#region src/ui/bubble-menu/utils.ts
 const SAFE_PROTOCOLS = new Set([
@@ -924,81 +815,27 @@ function focusEditor(editor) {
 }
 
 //#endregion
-//#region src/ui/bubble-menu/link-selector.tsx
-function BubbleMenuLinkSelector({ className, showToggle = true, validateUrl, onLinkApply, onLinkRemove, children, open: controlledOpen, onOpenChange }) {
-	const { editor } = useBubbleMenuContext();
-	const [uncontrolledOpen, setUncontrolledOpen] = react.useState(false);
-	const isControlled = controlledOpen !== void 0;
-	const isOpen = isControlled ? controlledOpen : uncontrolledOpen;
-	const setIsOpen = react.useCallback((value) => {
-		if (!isControlled) setUncontrolledOpen(value);
-		onOpenChange?.(value);
-	}, [isControlled, onOpenChange]);
-	const editorState = (0, _tiptap_react.useEditorState)({
-		editor,
-		selector: ({ editor: editor$1 }) => ({
-			isLinkActive: editor$1?.isActive("link") ?? false,
-			hasLink: Boolean(editor$1?.getAttributes("link").href),
-			currentHref: editor$1?.getAttributes("link").href || ""
-		})
-	});
-	const setIsOpenRef = react.useRef(setIsOpen);
-	setIsOpenRef.current = setIsOpen;
-	react.useEffect(() => {
-		const subscription = require_event_bus.editorEventBus.on("bubble-menu:add-link", () => {
-			setIsOpenRef.current(true);
-		});
-		return () => {
-			setIsOpenRef.current(false);
-			subscription.unsubscribe();
-		};
-	}, []);
-	if (!editorState) return null;
-	const handleOpenLink = () => {
-		setIsOpen(!isOpen);
-	};
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		"data-re-link-selector": "",
-		...isOpen ? { "data-open": "" } : {},
-		...editorState.hasLink ? { "data-has-link": "" } : {},
-		className,
-		children: [showToggle && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-			type: "button",
-			"aria-expanded": isOpen,
-			"aria-haspopup": "true",
-			"aria-label": "Add link",
-			"aria-pressed": editorState.isLinkActive && editorState.hasLink,
-			"data-re-link-selector-trigger": "",
-			onClick: handleOpenLink,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkIcon, {})
-		}), isOpen && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkForm, {
-			editor,
-			currentHref: editorState.currentHref,
-			validateUrl,
-			onLinkApply,
-			onLinkRemove,
-			setIsOpen,
-			children
-		})]
-	});
-}
-function LinkForm({ editor, currentHref, validateUrl, onLinkApply, onLinkRemove, setIsOpen, children }) {
+//#region src/ui/bubble-menu/button-form.tsx
+function BubbleMenuButtonForm({ className, validateUrl, onLinkApply, onLinkRemove }) {
+	const { editor, isEditing, setIsEditing } = useBubbleMenuContext();
 	const inputRef = react.useRef(null);
 	const formRef = react.useRef(null);
-	const displayHref = currentHref === "#" ? "" : currentHref;
+	const buttonHref = editor.getAttributes("button").href ?? "";
+	const displayHref = buttonHref === "#" ? "" : buttonHref;
 	const [inputValue, setInputValue] = react.useState(displayHref);
 	react.useEffect(() => {
+		if (!isEditing) return;
+		const currentHref = editor.getAttributes("button").href ?? "";
+		setInputValue(currentHref === "#" ? "" : currentHref);
 		const timeoutId = setTimeout(() => {
 			inputRef.current?.focus();
 		}, 0);
 		return () => clearTimeout(timeoutId);
-	}, []);
+	}, [isEditing, editor]);
 	react.useEffect(() => {
+		if (!isEditing) return;
 		const handleKeyDown = (event) => {
-			if (event.key === "Escape") {
-				if (editor.getAttributes("link").href === "#") editor.chain().unsetLink().run();
-				setIsOpen(false);
-			}
+			if (event.key === "Escape") setIsEditing(false);
 		};
 		const handleClickOutside = (event) => {
 			if (formRef.current && !formRef.current.contains(event.target)) {
@@ -1008,7 +845,7 @@ function LinkForm({ editor, currentHref, validateUrl, onLinkApply, onLinkRemove,
 					cancelable: true
 				});
 				form.dispatchEvent(submitEvent);
-				setIsOpen(false);
+				setIsEditing(false);
 			}
 		};
 		document.addEventListener("mousedown", handleClickOutside);
@@ -1017,391 +854,403 @@ function LinkForm({ editor, currentHref, validateUrl, onLinkApply, onLinkRemove,
 			window.removeEventListener("keydown", handleKeyDown);
 			document.removeEventListener("mousedown", handleClickOutside);
 		};
-	}, [editor, setIsOpen]);
+	}, [isEditing, setIsEditing]);
+	if (!isEditing) return null;
 	function handleSubmit(e) {
 		e.preventDefault();
 		const value = inputValue.trim();
 		if (value === "") {
-			setLinkHref(editor, "");
-			setIsOpen(false);
+			editor.commands.updateButton({ href: "#" });
+			setIsEditing(false);
 			focusEditor(editor);
 			onLinkRemove?.();
 			return;
 		}
 		const finalValue = (validateUrl ?? getUrlFromString)(value);
 		if (!finalValue) {
-			setLinkHref(editor, "");
-			setIsOpen(false);
+			editor.commands.updateButton({ href: "#" });
+			setIsEditing(false);
 			focusEditor(editor);
 			onLinkRemove?.();
 			return;
 		}
-		setLinkHref(editor, finalValue);
-		setIsOpen(false);
+		editor.commands.updateButton({ href: finalValue });
+		setIsEditing(false);
 		focusEditor(editor);
 		onLinkApply?.(finalValue);
 	}
 	function handleUnlink(e) {
 		e.stopPropagation();
-		setLinkHref(editor, "");
-		setIsOpen(false);
+		editor.commands.updateButton({ href: "#" });
+		setIsEditing(false);
 		focusEditor(editor);
 		onLinkRemove?.();
 	}
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("form", {
 		ref: formRef,
-		"data-re-link-selector-form": "",
+		"data-re-btn-bm-form": "",
+		className,
 		onMouseDown: (e) => e.stopPropagation(),
 		onClick: (e) => e.stopPropagation(),
 		onKeyDown: (e) => e.stopPropagation(),
 		onSubmit: handleSubmit,
-		children: [
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
-				ref: inputRef,
-				"data-re-link-selector-input": "",
-				value: inputValue,
-				onFocus: (e) => e.stopPropagation(),
-				onChange: (e) => setInputValue(e.target.value),
-				placeholder: "Paste a link",
-				type: "text"
-			}),
-			children,
-			displayHref ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-				type: "button",
-				"aria-label": "Remove link",
-				"data-re-link-selector-unlink": "",
-				onClick: handleUnlink,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnlinkIcon, {})
-			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-				type: "submit",
-				"aria-label": "Apply link",
-				"data-re-link-selector-apply": "",
-				onMouseDown: (e) => e.stopPropagation(),
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Check, {})
-			})
-		]
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+			ref: inputRef,
+			"data-re-btn-bm-input": "",
+			value: inputValue,
+			onFocus: (e) => e.stopPropagation(),
+			onChange: (e) => setInputValue(e.target.value),
+			placeholder: "Paste a link",
+			type: "text"
+		}), displayHref ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			"aria-label": "Remove link",
+			"data-re-btn-bm-unlink": "",
+			onClick: handleUnlink,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnlinkIcon, {})
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "submit",
+			"aria-label": "Apply link",
+			"data-re-btn-bm-apply": "",
+			onMouseDown: (e) => e.stopPropagation(),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Check, {})
+		})]
 	});
 }
 
 //#endregion
-//#region src/ui/bubble-menu/node-selector.tsx
-const NodeSelectorContext = react.createContext(null);
-function useNodeSelectorContext() {
-	const context = react.useContext(NodeSelectorContext);
-	if (!context) throw new Error("NodeSelector compound components must be used within <NodeSelector.Root>");
-	return context;
+//#region src/ui/bubble-menu/button-toolbar.tsx
+function BubbleMenuButtonToolbar({ children, ...rest }) {
+	const { isEditing } = useBubbleMenuContext();
+	if (isEditing) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		"data-re-btn-bm-toolbar": "",
+		...rest,
+		children
+	});
 }
-function NodeSelectorRoot({ omit = [], open: controlledOpen, onOpenChange, className, children }) {
+
+//#endregion
+//#region src/ui/bubble-menu/button-unlink.tsx
+function BubbleMenuButtonUnlink({ className, children, onClick, onMouseDown, onLinkRemove, ...rest }) {
 	const { editor } = useBubbleMenuContext();
-	const [uncontrolledOpen, setUncontrolledOpen] = react.useState(false);
-	const isControlled = controlledOpen !== void 0;
-	const isOpen = isControlled ? controlledOpen : uncontrolledOpen;
-	const setIsOpen = react.useCallback((value) => {
-		if (!isControlled) setUncontrolledOpen(value);
-		onOpenChange?.(value);
-	}, [isControlled, onOpenChange]);
-	const editorState = (0, _tiptap_react.useEditorState)({
-		editor,
-		selector: ({ editor: editor$1 }) => ({
-			isParagraphActive: (editor$1?.isActive("paragraph") ?? false) && !editor$1?.isActive("bulletList") && !editor$1?.isActive("orderedList"),
-			isHeading1Active: editor$1?.isActive("heading", { level: 1 }) ?? false,
-			isHeading2Active: editor$1?.isActive("heading", { level: 2 }) ?? false,
-			isHeading3Active: editor$1?.isActive("heading", { level: 3 }) ?? false,
-			isBulletListActive: editor$1?.isActive("bulletList") ?? false,
-			isOrderedListActive: editor$1?.isActive("orderedList") ?? false,
-			isBlockquoteActive: editor$1?.isActive("blockquote") ?? false,
-			isCodeBlockActive: editor$1?.isActive("codeBlock") ?? false
-		})
-	});
-	const allItems = react.useMemo(() => [
-		{
-			name: "Text",
-			icon: TextIcon,
-			command: () => editor.chain().focus().clearNodes().toggleNode("paragraph", "paragraph").run(),
-			isActive: editorState?.isParagraphActive ?? false
-		},
-		{
-			name: "Title",
-			icon: Heading1,
-			command: () => editor.chain().focus().clearNodes().toggleHeading({ level: 1 }).run(),
-			isActive: editorState?.isHeading1Active ?? false
-		},
-		{
-			name: "Subtitle",
-			icon: Heading2,
-			command: () => editor.chain().focus().clearNodes().toggleHeading({ level: 2 }).run(),
-			isActive: editorState?.isHeading2Active ?? false
-		},
-		{
-			name: "Heading",
-			icon: Heading3,
-			command: () => editor.chain().focus().clearNodes().toggleHeading({ level: 3 }).run(),
-			isActive: editorState?.isHeading3Active ?? false
-		},
-		{
-			name: "Bullet List",
-			icon: List,
-			command: () => editor.chain().focus().clearNodes().toggleBulletList().run(),
-			isActive: editorState?.isBulletListActive ?? false
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		...rest,
+		type: "button",
+		"aria-label": "Remove link",
+		"data-re-btn-bm-item": "",
+		"data-item": "unlink",
+		className,
+		onMouseDown: (e) => {
+			e.preventDefault();
+			onMouseDown?.(e);
 		},
-		{
-			name: "Numbered List",
-			icon: ListOrdered,
-			command: () => editor.chain().focus().clearNodes().toggleOrderedList().run(),
-			isActive: editorState?.isOrderedListActive ?? false
+		onClick: (e) => {
+			onClick?.(e);
+			editor.commands.updateButton({ href: "#" });
+			focusEditor(editor);
+			onLinkRemove?.();
 		},
-		{
-			name: "Quote",
-			icon: TextQuote,
-			command: () => editor.chain().focus().clearNodes().toggleNode("paragraph", "paragraph").toggleBlockquote().run(),
-			isActive: editorState?.isBlockquoteActive ?? false
+		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnlinkIcon, {})
+	});
+}
+
+//#endregion
+//#region src/ui/bubble-menu/triggers.ts
+const bubbleMenuTriggers = {
+	textSelection(hideWhenActiveNodes = [], hideWhenActiveMarks = []) {
+		return ({ editor, state }) => {
+			for (const node of hideWhenActiveNodes) {
+				if (editor.isActive(node)) return false;
+				const { $from } = state.selection;
+				for (let d = $from.depth; d > 0; d--) if ($from.node(d).type.name === node) return false;
+			}
+			for (const mark of hideWhenActiveMarks) if (editor.isActive(mark)) return false;
+			return editor.view.state.selection.content().size > 0;
+		};
+	},
+	node(name) {
+		return ({ editor }) => editor.isActive(name);
+	},
+	nodeWithoutSelection(name) {
+		return ({ editor }) => editor.isActive(name) && editor.view.state.selection.content().size === 0;
+	}
+};
+
+//#endregion
+//#region src/ui/bubble-menu/root.tsx
+const defaultPluginKey = new _tiptap_pm_state.PluginKey("bubbleMenu");
+function BubbleMenuRoot({ shouldShow, pluginKey: pluginKey$1 = defaultPluginKey, hideWhenActiveNodes = [], hideWhenActiveMarks = [], placement = "bottom", offset: offset$1 = 8, onHide, className, children, ...rest }) {
+	const { editor } = (0, _tiptap_react.useCurrentEditor)();
+	const [isEditing, setIsEditing] = react.useState(false);
+	const resolvedShouldShow = shouldShow ?? bubbleMenuTriggers.textSelection(hideWhenActiveNodes, hideWhenActiveMarks);
+	if (!editor) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_tiptap_react_menus.BubbleMenu, {
+		editor,
+		pluginKey: pluginKey$1,
+		"data-re-bubble-menu": "",
+		shouldShow: resolvedShouldShow,
+		options: {
+			placement,
+			offset: offset$1,
+			onHide: () => {
+				setIsEditing(false);
+				onHide?.();
+			}
 		},
-		{
-			name: "Code",
-			icon: Code,
-			command: () => editor.chain().focus().clearNodes().toggleCodeBlock().run(),
-			isActive: editorState?.isCodeBlockActive ?? false
-		}
-	], [editor, editorState]);
-	const items = react.useMemo(() => allItems.filter((item) => !omit.includes(item.name)), [allItems, omit]);
-	const activeItem = react.useMemo(() => items.find((item) => item.isActive) ?? { name: "Multiple" }, [items]);
-	const contextValue = react.useMemo(() => ({
-		items,
-		activeItem,
-		isOpen,
-		setIsOpen
-	}), [
-		items,
-		activeItem,
-		isOpen,
-		setIsOpen
-	]);
-	if (!editorState || items.length === 0) return null;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NodeSelectorContext.Provider, {
-		value: contextValue,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_popover.Root, {
-			open: isOpen,
-			onOpenChange: setIsOpen,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				"data-re-node-selector": "",
-				...isOpen ? { "data-open": "" } : {},
-				className,
-				children
-			})
+		className,
+		...rest,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuContext.Provider, {
+			value: {
+				editor,
+				isEditing,
+				setIsEditing
+			},
+			children
 		})
 	});
 }
-function NodeSelectorTrigger({ className, children }) {
-	const { activeItem, isOpen, setIsOpen } = useNodeSelectorContext();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_popover.Trigger, {
-		"data-re-node-selector-trigger": "",
-		className,
-		onClick: () => setIsOpen(!isOpen),
-		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: activeItem.name }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronDown, {})] })
+
+//#endregion
+//#region src/ui/bubble-menu/button-default.tsx
+const buttonPluginKey = new _tiptap_pm_state.PluginKey("buttonBubbleMenu");
+function BubbleMenuButtonDefaultInner({ validateUrl, onLinkApply, onLinkRemove }) {
+	const { editor } = useBubbleMenuContext();
+	const buttonHref = (0, _tiptap_react.useEditorState)({
+		editor,
+		selector: ({ editor: e }) => e?.getAttributes("button").href ?? ""
 	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(BubbleMenuButtonToolbar, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuButtonEditLink, {}), (buttonHref ?? "") !== "" && buttonHref !== "#" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuButtonUnlink, { onLinkRemove })] }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuButtonForm, {
+		validateUrl,
+		onLinkApply,
+		onLinkRemove
+	})] });
 }
-function NodeSelectorContent({ className, align = "start", children }) {
-	const { items, setIsOpen } = useNodeSelectorContext();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_popover.Content, {
-		align,
-		"data-re-node-selector-content": "",
+function BubbleMenuButtonDefault({ placement = "top", offset: offset$1, onHide, className, validateUrl, onLinkApply, onLinkRemove, ...rest }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuRoot, {
+		shouldShow: bubbleMenuTriggers.node("button"),
+		pluginKey: buttonPluginKey,
+		placement,
+		offset: offset$1,
+		onHide,
 		className,
-		children: children ? children(items, () => setIsOpen(false)) : items.map((item) => {
-			const Icon = item.icon;
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-				type: "button",
-				"data-re-node-selector-item": "",
-				...item.isActive ? { "data-active": "" } : {},
-				onClick: () => {
-					item.command();
-					setIsOpen(false);
-				},
-				children: [
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: item.name }),
-					item.isActive && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Check, {})
-				]
-			}, item.name);
+		...rest,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuButtonDefaultInner, {
+			validateUrl,
+			onLinkApply,
+			onLinkRemove
 		})
 	});
 }
-function BubbleMenuNodeSelector({ omit = [], className, triggerContent, open, onOpenChange }) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(NodeSelectorRoot, {
-		omit,
-		open,
-		onOpenChange,
+
+//#endregion
+//#region src/ui/bubble-menu/item.tsx
+function BubbleMenuItem({ name, isActive, onCommand, className, children, ...rest }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		type: "button",
+		"aria-label": name,
+		"aria-pressed": isActive,
+		className,
+		"data-re-bubble-menu-item": "",
+		"data-item": name,
+		...isActive ? { "data-active": "" } : {},
+		onMouseDown: (e) => e.preventDefault(),
+		onClick: onCommand,
+		...rest,
+		children
+	});
+}
+
+//#endregion
+//#region src/ui/bubble-menu/align-center.tsx
+function BubbleMenuAlignCenter({ className, children }) {
+	const { editor } = useBubbleMenuContext();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuItem, {
+		name: "align-center",
+		isActive: (0, _tiptap_react.useEditorState)({
+			editor,
+			selector: ({ editor: editor$1 }) => editor$1?.isActive({ alignment: "center" }) ?? false
+		}),
+		onCommand: () => require_set_text_alignment.setTextAlignment(editor, "center"),
+		className,
+		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AlignCenterIcon, {})
+	});
+}
+
+//#endregion
+//#region src/ui/bubble-menu/align-left.tsx
+function BubbleMenuAlignLeft({ className, children }) {
+	const { editor } = useBubbleMenuContext();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuItem, {
+		name: "align-left",
+		isActive: (0, _tiptap_react.useEditorState)({
+			editor,
+			selector: ({ editor: editor$1 }) => editor$1?.isActive({ alignment: "left" }) ?? false
+		}),
+		onCommand: () => require_set_text_alignment.setTextAlignment(editor, "left"),
 		className,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(NodeSelectorTrigger, { children: triggerContent }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NodeSelectorContent, {})]
+		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AlignLeftIcon, {})
 	});
 }
 
 //#endregion
-//#region src/ui/bubble-menu/root.tsx
-function BubbleMenuRoot({ excludeNodes = [], excludeMarks = [], placement = "bottom", offset: offset$1 = 8, onHide, className, children, ...rest }) {
-	const { editor } = (0, _tiptap_react.useCurrentEditor)();
-	if (!editor) return null;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_tiptap_react_menus.BubbleMenu, {
-		editor,
-		pluginKey: "textBubbleMenu",
-		"data-re-bubble-menu": "",
-		shouldShow: ({ editor: editor$1, view, state }) => {
-			for (const node of excludeNodes) {
-				if (editor$1.isActive(node)) return false;
-				const { $from } = state.selection;
-				for (let d = $from.depth; d > 0; d--) if ($from.node(d).type.name === node) return false;
-			}
-			for (const mark of excludeMarks) if (editor$1.isActive(mark)) return false;
-			if (view.dom.classList.contains("dragging")) return false;
-			return editor$1.view.state.selection.content().size > 0;
-		},
-		options: {
-			placement,
-			offset: offset$1,
-			onHide
-		},
+//#region src/ui/bubble-menu/align-right.tsx
+function BubbleMenuAlignRight({ className, children }) {
+	const { editor } = useBubbleMenuContext();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuItem, {
+		name: "align-right",
+		isActive: (0, _tiptap_react.useEditorState)({
+			editor,
+			selector: ({ editor: editor$1 }) => editor$1?.isActive({ alignment: "right" }) ?? false
+		}),
+		onCommand: () => require_set_text_alignment.setTextAlignment(editor, "right"),
 		className,
-		...rest,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuContext.Provider, {
-			value: { editor },
-			children
-		})
+		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AlignRightIcon, {})
 	});
 }
 
 //#endregion
-//#region src/ui/bubble-menu/strike.tsx
-const BubbleMenuStrike = createMarkBubbleItem({
-	name: "strike",
-	activeName: "strike",
-	command: "toggleStrike",
-	icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StrikethroughIcon, {})
-});
+//#region src/ui/bubble-menu/create-mark-bubble-item.tsx
+function createMarkBubbleItem(config) {
+	function MarkBubbleItem({ className, children }) {
+		const { editor } = useBubbleMenuContext();
+		const isActive = (0, _tiptap_react.useEditorState)({
+			editor,
+			selector: ({ editor: editor$1 }) => {
+				if (config.activeParams) return editor$1?.isActive(config.activeName, config.activeParams) ?? false;
+				return editor$1?.isActive(config.activeName) ?? false;
+			}
+		});
+		const handleCommand = () => {
+			const chain = editor.chain().focus();
+			const method = chain[config.command];
+			if (method) method.call(chain).run();
+		};
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuItem, {
+			name: config.name,
+			isActive,
+			onCommand: handleCommand,
+			className,
+			children: children ?? config.icon
+		});
+	}
+	MarkBubbleItem.displayName = `BubbleMenu${config.name.charAt(0).toUpperCase() + config.name.slice(1)}`;
+	return MarkBubbleItem;
+}
 
 //#endregion
-//#region src/ui/bubble-menu/underline.tsx
-const BubbleMenuUnderline = createMarkBubbleItem({
-	name: "underline",
-	activeName: "underline",
-	command: "toggleUnderline",
-	icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnderlineIcon, {})
+//#region src/ui/bubble-menu/bold.tsx
+const BubbleMenuBold = createMarkBubbleItem({
+	name: "bold",
+	activeName: "bold",
+	command: "toggleBold",
+	icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BoldIcon, {})
 });
 
 //#endregion
-//#region src/ui/bubble-menu/uppercase.tsx
-const BubbleMenuUppercase = createMarkBubbleItem({
-	name: "uppercase",
-	activeName: "uppercase",
-	command: "toggleUppercase",
-	icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CaseUpperIcon, {})
+//#region src/ui/bubble-menu/code.tsx
+const BubbleMenuCode = createMarkBubbleItem({
+	name: "code",
+	activeName: "code",
+	command: "toggleCode",
+	icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CodeIcon, {})
 });
 
 //#endregion
-//#region src/ui/bubble-menu/default.tsx
-function BubbleMenuDefault({ excludeItems = [], excludeNodes, excludeMarks, placement, offset: offset$1, onHide, className, ...rest }) {
-	const [isNodeSelectorOpen, setIsNodeSelectorOpen] = react.useState(false);
-	const [isLinkSelectorOpen, setIsLinkSelectorOpen] = react.useState(false);
-	const has = (item) => !excludeItems.includes(item);
-	const handleNodeSelectorOpenChange = react.useCallback((open) => {
-		setIsNodeSelectorOpen(open);
-		if (open) setIsLinkSelectorOpen(false);
-	}, []);
-	const handleLinkSelectorOpenChange = react.useCallback((open) => {
-		setIsLinkSelectorOpen(open);
-		if (open) setIsNodeSelectorOpen(false);
-	}, []);
-	const handleHide = react.useCallback(() => {
-		setIsNodeSelectorOpen(false);
-		setIsLinkSelectorOpen(false);
-		onHide?.();
-	}, [onHide]);
-	const hasFormattingItems = has("bold") || has("italic") || has("underline") || has("strike") || has("code") || has("uppercase");
-	const hasAlignmentItems = has("align-left") || has("align-center") || has("align-right");
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(BubbleMenuRoot, {
-		excludeNodes,
-		excludeMarks,
-		placement,
-		offset: offset$1,
-		onHide: handleHide,
+//#region src/ui/bubble-menu/group.tsx
+function BubbleMenuItemGroup({ className, children }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("fieldset", {
 		className,
-		...rest,
-		children: [
-			has("node-selector") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuNodeSelector, {
-				open: isNodeSelectorOpen,
-				onOpenChange: handleNodeSelectorOpenChange
-			}),
-			has("link-selector") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuLinkSelector, {
-				open: isLinkSelectorOpen,
-				onOpenChange: handleLinkSelectorOpenChange
-			}),
-			hasFormattingItems && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(BubbleMenuItemGroup, { children: [
-				has("bold") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuBold, {}),
-				has("italic") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuItalic, {}),
-				has("underline") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuUnderline, {}),
-				has("strike") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuStrike, {}),
-				has("code") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuCode, {}),
-				has("uppercase") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuUppercase, {})
-			] }),
-			hasAlignmentItems && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(BubbleMenuItemGroup, { children: [
-				has("align-left") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuAlignLeft, {}),
-				has("align-center") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuAlignCenter, {}),
-				has("align-right") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuAlignRight, {})
-			] })
-		]
+		"data-re-bubble-menu-group": "",
+		children
 	});
 }
 
 //#endregion
-//#region src/ui/button-bubble-menu/context.tsx
-const ButtonBubbleMenuContext = react.createContext(null);
-function useButtonBubbleMenuContext() {
-	const context = react.useContext(ButtonBubbleMenuContext);
-	if (!context) throw new Error("ButtonBubbleMenu compound components must be used within <ButtonBubbleMenu.Root>");
-	return context;
-}
+//#region src/ui/bubble-menu/italic.tsx
+const BubbleMenuItalic = createMarkBubbleItem({
+	name: "italic",
+	activeName: "italic",
+	command: "toggleItalic",
+	icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ItalicIcon, {})
+});
 
 //#endregion
-//#region src/ui/button-bubble-menu/edit-link.tsx
-function ButtonBubbleMenuEditLink({ className, children, onClick, onMouseDown, ...rest }) {
-	const { setIsEditing } = useButtonBubbleMenuContext();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-		...rest,
-		type: "button",
-		"aria-label": "Edit link",
-		"data-re-btn-bm-item": "",
-		"data-item": "edit-link",
+//#region src/ui/bubble-menu/link-selector.tsx
+function BubbleMenuLinkSelector({ className, showToggle = true, validateUrl, onLinkApply, onLinkRemove, children, open: controlledOpen, onOpenChange }) {
+	const { editor } = useBubbleMenuContext();
+	const [uncontrolledOpen, setUncontrolledOpen] = react.useState(false);
+	const isControlled = controlledOpen !== void 0;
+	const isOpen = isControlled ? controlledOpen : uncontrolledOpen;
+	const setIsOpen = react.useCallback((value) => {
+		if (!isControlled) setUncontrolledOpen(value);
+		onOpenChange?.(value);
+	}, [isControlled, onOpenChange]);
+	const editorState = (0, _tiptap_react.useEditorState)({
+		editor,
+		selector: ({ editor: editor$1 }) => ({
+			isLinkActive: editor$1?.isActive("link") ?? false,
+			hasLink: Boolean(editor$1?.getAttributes("link").href),
+			currentHref: editor$1?.getAttributes("link").href || ""
+		})
+	});
+	const setIsOpenRef = react.useRef(setIsOpen);
+	setIsOpenRef.current = setIsOpen;
+	react.useEffect(() => {
+		const subscription = require_event_bus.editorEventBus.on("bubble-menu:add-link", () => {
+			setIsOpenRef.current(true);
+		});
+		return () => {
+			setIsOpenRef.current(false);
+			subscription.unsubscribe();
+		};
+	}, []);
+	if (!editorState) return null;
+	const handleOpenLink = () => {
+		setIsOpen(!isOpen);
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		"data-re-link-selector": "",
+		...isOpen ? { "data-open": "" } : {},
+		...editorState.hasLink ? { "data-has-link": "" } : {},
 		className,
-		onMouseDown: (e) => {
-			e.preventDefault();
-			onMouseDown?.(e);
-		},
-		onClick: (e) => {
-			onClick?.(e);
-			setIsEditing(true);
-		},
-		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PencilIcon, {})
+		children: [showToggle && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			"aria-expanded": isOpen,
+			"aria-haspopup": "true",
+			"aria-label": "Add link",
+			"aria-pressed": editorState.isLinkActive && editorState.hasLink,
+			"data-re-link-selector-trigger": "",
+			onClick: handleOpenLink,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkIcon, {})
+		}), isOpen && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkForm, {
+			editor,
+			currentHref: editorState.currentHref,
+			validateUrl,
+			onLinkApply,
+			onLinkRemove,
+			setIsOpen,
+			children
+		})]
 	});
 }
-
-//#endregion
-//#region src/ui/button-bubble-menu/form.tsx
-function ButtonBubbleMenuForm({ className, validateUrl, onLinkApply, onLinkRemove }) {
-	const { editor, buttonHref, isEditing, setIsEditing } = useButtonBubbleMenuContext();
+function LinkForm({ editor, currentHref, validateUrl, onLinkApply, onLinkRemove, setIsOpen, children }) {
 	const inputRef = react.useRef(null);
 	const formRef = react.useRef(null);
-	const displayHref = buttonHref === "#" ? "" : buttonHref;
+	const displayHref = currentHref === "#" ? "" : currentHref;
 	const [inputValue, setInputValue] = react.useState(displayHref);
 	react.useEffect(() => {
-		if (!isEditing) return;
-		setInputValue(displayHref);
 		const timeoutId = setTimeout(() => {
 			inputRef.current?.focus();
 		}, 0);
 		return () => clearTimeout(timeoutId);
-	}, [isEditing, displayHref]);
+	}, []);
 	react.useEffect(() => {
-		if (!isEditing) return;
 		const handleKeyDown = (event) => {
-			if (event.key === "Escape") setIsEditing(false);
+			if (event.key === "Escape") {
+				if (editor.getAttributes("link").href === "#") editor.chain().unsetLink().run();
+				setIsOpen(false);
+			}
 		};
 		const handleClickOutside = (event) => {
 			if (formRef.current && !formRef.current.contains(event.target)) {
@@ -1411,7 +1260,7 @@ function ButtonBubbleMenuForm({ className, validateUrl, onLinkApply, onLinkRemov
 					cancelable: true
 				});
 				form.dispatchEvent(submitEvent);
-				setIsEditing(false);
+				setIsOpen(false);
 			}
 		};
 		document.addEventListener("mousedown", handleClickOutside);
@@ -1420,182 +1269,312 @@ function ButtonBubbleMenuForm({ className, validateUrl, onLinkApply, onLinkRemov
 			window.removeEventListener("keydown", handleKeyDown);
 			document.removeEventListener("mousedown", handleClickOutside);
 		};
-	}, [isEditing, setIsEditing]);
-	if (!isEditing) return null;
+	}, [editor, setIsOpen]);
 	function handleSubmit(e) {
 		e.preventDefault();
 		const value = inputValue.trim();
 		if (value === "") {
-			editor.commands.updateButton({ href: "#" });
-			setIsEditing(false);
+			setLinkHref(editor, "");
+			setIsOpen(false);
 			focusEditor(editor);
 			onLinkRemove?.();
 			return;
 		}
 		const finalValue = (validateUrl ?? getUrlFromString)(value);
 		if (!finalValue) {
-			editor.commands.updateButton({ href: "#" });
-			setIsEditing(false);
+			setLinkHref(editor, "");
+			setIsOpen(false);
 			focusEditor(editor);
 			onLinkRemove?.();
 			return;
 		}
-		editor.commands.updateButton({ href: finalValue });
-		setIsEditing(false);
+		setLinkHref(editor, finalValue);
+		setIsOpen(false);
 		focusEditor(editor);
 		onLinkApply?.(finalValue);
 	}
 	function handleUnlink(e) {
 		e.stopPropagation();
-		editor.commands.updateButton({ href: "#" });
-		setIsEditing(false);
+		setLinkHref(editor, "");
+		setIsOpen(false);
 		focusEditor(editor);
 		onLinkRemove?.();
 	}
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("form", {
 		ref: formRef,
-		"data-re-btn-bm-form": "",
-		className,
+		"data-re-link-selector-form": "",
 		onMouseDown: (e) => e.stopPropagation(),
 		onClick: (e) => e.stopPropagation(),
 		onKeyDown: (e) => e.stopPropagation(),
 		onSubmit: handleSubmit,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
-			ref: inputRef,
-			"data-re-btn-bm-input": "",
-			value: inputValue,
-			onFocus: (e) => e.stopPropagation(),
-			onChange: (e) => setInputValue(e.target.value),
-			placeholder: "Paste a link",
-			type: "text"
-		}), displayHref ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-			type: "button",
-			"aria-label": "Remove link",
-			"data-re-btn-bm-unlink": "",
-			onClick: handleUnlink,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnlinkIcon, {})
-		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-			type: "submit",
-			"aria-label": "Apply link",
-			"data-re-btn-bm-apply": "",
-			onMouseDown: (e) => e.stopPropagation(),
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Check, {})
-		})]
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				ref: inputRef,
+				"data-re-link-selector-input": "",
+				value: inputValue,
+				onFocus: (e) => e.stopPropagation(),
+				onChange: (e) => setInputValue(e.target.value),
+				placeholder: "Paste a link",
+				type: "text"
+			}),
+			children,
+			displayHref ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				"aria-label": "Remove link",
+				"data-re-link-selector-unlink": "",
+				onClick: handleUnlink,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnlinkIcon, {})
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "submit",
+				"aria-label": "Apply link",
+				"data-re-link-selector-apply": "",
+				onMouseDown: (e) => e.stopPropagation(),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Check, {})
+			})
+		]
 	});
 }
 
 //#endregion
-//#region src/ui/button-bubble-menu/root.tsx
-function ButtonBubbleMenuRoot({ onHide, placement = "top", offset: offset$1 = 8, className, children, ...rest }) {
-	const { editor } = (0, _tiptap_react.useCurrentEditor)();
-	const [isEditing, setIsEditing] = react.useState(false);
-	const buttonHref = (0, _tiptap_react.useEditorState)({
+//#region src/ui/bubble-menu/node-selector.tsx
+const NodeSelectorContext = react.createContext(null);
+function useNodeSelectorContext() {
+	const context = react.useContext(NodeSelectorContext);
+	if (!context) throw new Error("NodeSelector compound components must be used within <NodeSelector.Root>");
+	return context;
+}
+function NodeSelectorRoot({ omit = [], open: controlledOpen, onOpenChange, className, children }) {
+	const { editor } = useBubbleMenuContext();
+	const [uncontrolledOpen, setUncontrolledOpen] = react.useState(false);
+	const isControlled = controlledOpen !== void 0;
+	const isOpen = isControlled ? controlledOpen : uncontrolledOpen;
+	const setIsOpen = react.useCallback((value) => {
+		if (!isControlled) setUncontrolledOpen(value);
+		onOpenChange?.(value);
+	}, [isControlled, onOpenChange]);
+	const editorState = (0, _tiptap_react.useEditorState)({
 		editor,
-		selector: ({ editor: e }) => e?.getAttributes("button").href ?? ""
+		selector: ({ editor: editor$1 }) => ({
+			isParagraphActive: (editor$1?.isActive("paragraph") ?? false) && !editor$1?.isActive("bulletList") && !editor$1?.isActive("orderedList"),
+			isHeading1Active: editor$1?.isActive("heading", { level: 1 }) ?? false,
+			isHeading2Active: editor$1?.isActive("heading", { level: 2 }) ?? false,
+			isHeading3Active: editor$1?.isActive("heading", { level: 3 }) ?? false,
+			isBulletListActive: editor$1?.isActive("bulletList") ?? false,
+			isOrderedListActive: editor$1?.isActive("orderedList") ?? false,
+			isBlockquoteActive: editor$1?.isActive("blockquote") ?? false,
+			isCodeBlockActive: editor$1?.isActive("codeBlock") ?? false
+		})
 	});
-	if (!editor) return null;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_tiptap_react_menus.BubbleMenu, {
-		editor,
-		pluginKey: "buttonBubbleMenu",
-		"data-re-btn-bm": "",
-		shouldShow: ({ editor: e, view }) => e.isActive("button") && !view.dom.classList.contains("dragging"),
-		options: {
-			placement,
-			offset: offset$1,
-			onHide: () => {
-				setIsEditing(false);
-				onHide?.();
-			}
+	const allItems = react.useMemo(() => [
+		{
+			name: "Text",
+			icon: TextIcon,
+			command: () => editor.chain().focus().clearNodes().toggleNode("paragraph", "paragraph").run(),
+			isActive: editorState?.isParagraphActive ?? false
 		},
-		className,
-		...rest,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ButtonBubbleMenuContext.Provider, {
-			value: {
-				editor,
-				buttonHref: buttonHref ?? "",
-				isEditing,
-				setIsEditing
-			},
-			children
+		{
+			name: "Title",
+			icon: Heading1,
+			command: () => editor.chain().focus().clearNodes().toggleHeading({ level: 1 }).run(),
+			isActive: editorState?.isHeading1Active ?? false
+		},
+		{
+			name: "Subtitle",
+			icon: Heading2,
+			command: () => editor.chain().focus().clearNodes().toggleHeading({ level: 2 }).run(),
+			isActive: editorState?.isHeading2Active ?? false
+		},
+		{
+			name: "Heading",
+			icon: Heading3,
+			command: () => editor.chain().focus().clearNodes().toggleHeading({ level: 3 }).run(),
+			isActive: editorState?.isHeading3Active ?? false
+		},
+		{
+			name: "Bullet List",
+			icon: List,
+			command: () => editor.chain().focus().clearNodes().toggleBulletList().run(),
+			isActive: editorState?.isBulletListActive ?? false
+		},
+		{
+			name: "Numbered List",
+			icon: ListOrdered,
+			command: () => editor.chain().focus().clearNodes().toggleOrderedList().run(),
+			isActive: editorState?.isOrderedListActive ?? false
+		},
+		{
+			name: "Quote",
+			icon: TextQuote,
+			command: () => editor.chain().focus().clearNodes().toggleNode("paragraph", "paragraph").toggleBlockquote().run(),
+			isActive: editorState?.isBlockquoteActive ?? false
+		},
+		{
+			name: "Code",
+			icon: Code,
+			command: () => editor.chain().focus().clearNodes().toggleCodeBlock().run(),
+			isActive: editorState?.isCodeBlockActive ?? false
+		}
+	], [editor, editorState]);
+	const items = react.useMemo(() => allItems.filter((item) => !omit.includes(item.name)), [allItems, omit]);
+	const activeItem = react.useMemo(() => items.find((item) => item.isActive) ?? { name: "Multiple" }, [items]);
+	const contextValue = react.useMemo(() => ({
+		items,
+		activeItem,
+		isOpen,
+		setIsOpen
+	}), [
+		items,
+		activeItem,
+		isOpen,
+		setIsOpen
+	]);
+	if (!editorState || items.length === 0) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NodeSelectorContext.Provider, {
+		value: contextValue,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_popover.Root, {
+			open: isOpen,
+			onOpenChange: setIsOpen,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				"data-re-node-selector": "",
+				...isOpen ? { "data-open": "" } : {},
+				className,
+				children
+			})
 		})
 	});
 }
-
-//#endregion
-//#region src/ui/button-bubble-menu/toolbar.tsx
-function ButtonBubbleMenuToolbar({ children, ...rest }) {
-	const { isEditing } = useButtonBubbleMenuContext();
-	if (isEditing) return null;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		"data-re-btn-bm-toolbar": "",
-		...rest,
-		children
+function NodeSelectorTrigger({ className, children }) {
+	const { activeItem, isOpen, setIsOpen } = useNodeSelectorContext();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_popover.Trigger, {
+		"data-re-node-selector-trigger": "",
+		className,
+		onClick: () => setIsOpen(!isOpen),
+		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: activeItem.name }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronDown, {})] })
 	});
 }
-
-//#endregion
-//#region src/ui/button-bubble-menu/unlink.tsx
-function ButtonBubbleMenuUnlink({ className, children, onClick, onMouseDown, onLinkRemove, ...rest }) {
-	const { editor } = useButtonBubbleMenuContext();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-		...rest,
-		type: "button",
-		"aria-label": "Remove link",
-		"data-re-btn-bm-item": "",
-		"data-item": "unlink",
+function NodeSelectorContent({ className, align = "start", children }) {
+	const { items, setIsOpen } = useNodeSelectorContext();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_popover.Content, {
+		align,
+		"data-re-node-selector-content": "",
 		className,
-		onMouseDown: (e) => {
-			e.preventDefault();
-			onMouseDown?.(e);
-		},
-		onClick: (e) => {
-			onClick?.(e);
-			editor.commands.updateButton({ href: "#" });
-			focusEditor(editor);
-			onLinkRemove?.();
-		},
-		children: children ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnlinkIcon, {})
+		children: children ? children(items, () => setIsOpen(false)) : items.map((item) => {
+			const Icon = item.icon;
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+				type: "button",
+				"data-re-node-selector-item": "",
+				...item.isActive ? { "data-active": "" } : {},
+				onClick: () => {
+					item.command();
+					setIsOpen(false);
+				},
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: item.name }),
+					item.isActive && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Check, {})
+				]
+			}, item.name);
+		})
+	});
+}
+function BubbleMenuNodeSelector({ omit = [], className, triggerContent, open, onOpenChange }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(NodeSelectorRoot, {
+		omit,
+		open,
+		onOpenChange,
+		className,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(NodeSelectorTrigger, { children: triggerContent }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NodeSelectorContent, {})]
 	});
 }
 
 //#endregion
-//#region src/ui/button-bubble-menu/default.tsx
-function ButtonBubbleMenuDefaultInner({ validateUrl, onLinkApply, onLinkRemove }) {
-	const { buttonHref } = useButtonBubbleMenuContext();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(ButtonBubbleMenuToolbar, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ButtonBubbleMenuEditLink, {}), buttonHref !== "" && buttonHref !== "#" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ButtonBubbleMenuUnlink, { onLinkRemove })] }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ButtonBubbleMenuForm, {
-		validateUrl,
-		onLinkApply,
-		onLinkRemove
-	})] });
-}
-function ButtonBubbleMenuDefault({ placement, offset: offset$1, onHide, className, validateUrl, onLinkApply, onLinkRemove, ...rest }) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ButtonBubbleMenuRoot, {
+//#region src/ui/bubble-menu/strike.tsx
+const BubbleMenuStrike = createMarkBubbleItem({
+	name: "strike",
+	activeName: "strike",
+	command: "toggleStrike",
+	icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StrikethroughIcon, {})
+});
+
+//#endregion
+//#region src/ui/bubble-menu/underline.tsx
+const BubbleMenuUnderline = createMarkBubbleItem({
+	name: "underline",
+	activeName: "underline",
+	command: "toggleUnderline",
+	icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnderlineIcon, {})
+});
+
+//#endregion
+//#region src/ui/bubble-menu/uppercase.tsx
+const BubbleMenuUppercase = createMarkBubbleItem({
+	name: "uppercase",
+	activeName: "uppercase",
+	command: "toggleUppercase",
+	icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CaseUpperIcon, {})
+});
+
+//#endregion
+//#region src/ui/bubble-menu/default.tsx
+const textPluginKey = new _tiptap_pm_state.PluginKey("textBubbleMenu");
+function BubbleMenuDefault({ excludeItems = [], hideWhenActiveNodes, hideWhenActiveMarks, placement, offset: offset$1, onHide, className, ...rest }) {
+	const [isNodeSelectorOpen, setIsNodeSelectorOpen] = react.useState(false);
+	const [isLinkSelectorOpen, setIsLinkSelectorOpen] = react.useState(false);
+	const has = (item) => !excludeItems.includes(item);
+	const handleNodeSelectorOpenChange = react.useCallback((open) => {
+		setIsNodeSelectorOpen(open);
+		if (open) setIsLinkSelectorOpen(false);
+	}, []);
+	const handleLinkSelectorOpenChange = react.useCallback((open) => {
+		setIsLinkSelectorOpen(open);
+		if (open) setIsNodeSelectorOpen(false);
+	}, []);
+	const handleHide = react.useCallback(() => {
+		setIsNodeSelectorOpen(false);
+		setIsLinkSelectorOpen(false);
+		onHide?.();
+	}, [onHide]);
+	const hasFormattingItems = has("bold") || has("italic") || has("underline") || has("strike") || has("code") || has("uppercase");
+	const hasAlignmentItems = has("align-left") || has("align-center") || has("align-right");
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(BubbleMenuRoot, {
+		pluginKey: textPluginKey,
+		hideWhenActiveNodes,
+		hideWhenActiveMarks,
 		placement,
 		offset: offset$1,
-		onHide,
+		onHide: handleHide,
 		className,
 		...rest,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ButtonBubbleMenuDefaultInner, {
-			validateUrl,
-			onLinkApply,
-			onLinkRemove
-		})
+		children: [
+			has("node-selector") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuNodeSelector, {
+				open: isNodeSelectorOpen,
+				onOpenChange: handleNodeSelectorOpenChange
+			}),
+			has("link-selector") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuLinkSelector, {
+				open: isLinkSelectorOpen,
+				onOpenChange: handleLinkSelectorOpenChange
+			}),
+			hasFormattingItems && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(BubbleMenuItemGroup, { children: [
+				has("bold") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuBold, {}),
+				has("italic") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuItalic, {}),
+				has("underline") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuUnderline, {}),
+				has("strike") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuStrike, {}),
+				has("code") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuCode, {}),
+				has("uppercase") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuUppercase, {})
+			] }),
+			hasAlignmentItems && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(BubbleMenuItemGroup, { children: [
+				has("align-left") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuAlignLeft, {}),
+				has("align-center") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuAlignCenter, {}),
+				has("align-right") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuAlignRight, {})
+			] })
+		]
 	});
 }
 
 //#endregion
-//#region src/ui/image-bubble-menu/context.tsx
-const ImageBubbleMenuContext = react.createContext(null);
-function useImageBubbleMenuContext() {
-	const context = react.useContext(ImageBubbleMenuContext);
-	if (!context) throw new Error("ImageBubbleMenu compound components must be used within <ImageBubbleMenu.Root>");
-	return context;
-}
-
-//#endregion
-//#region src/ui/image-bubble-menu/edit-link.tsx
-function ImageBubbleMenuEditLink({ className, children, onClick, onMouseDown, ...rest }) {
-	const { setIsEditing } = useImageBubbleMenuContext();
+//#region src/ui/bubble-menu/image-edit-link.tsx
+function BubbleMenuImageEditLink({ className, children, onClick, onMouseDown, ...rest }) {
+	const { setIsEditing } = useBubbleMenuContext();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 		...rest,
 		type: "button",
@@ -1616,41 +1595,9 @@ function ImageBubbleMenuEditLink({ className, children, onClick, onMouseDown, ..
 }
 
 //#endregion
-//#region src/ui/image-bubble-menu/root.tsx
-function ImageBubbleMenuRoot({ onHide, placement = "top", offset: offset$1 = 8, className, children, ...rest }) {
-	const { editor } = (0, _tiptap_react.useCurrentEditor)();
-	const [isEditing, setIsEditing] = react.useState(false);
-	if (!editor) return null;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_tiptap_react_menus.BubbleMenu, {
-		editor,
-		pluginKey: "imageBubbleMenu",
-		"data-re-img-bm": "",
-		shouldShow: ({ editor: e, view }) => e.isActive("image") && !view.dom.classList.contains("dragging"),
-		options: {
-			placement,
-			offset: offset$1,
-			onHide: () => {
-				setIsEditing(false);
-				onHide?.();
-			}
-		},
-		className,
-		...rest,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ImageBubbleMenuContext.Provider, {
-			value: {
-				editor,
-				isEditing,
-				setIsEditing
-			},
-			children
-		})
-	});
-}
-
-//#endregion
-//#region src/ui/image-bubble-menu/toolbar.tsx
-function ImageBubbleMenuToolbar({ children, ...rest }) {
-	const { isEditing } = useImageBubbleMenuContext();
+//#region src/ui/bubble-menu/image-toolbar.tsx
+function BubbleMenuImageToolbar({ children, ...rest }) {
+	const { isEditing } = useBubbleMenuContext();
 	if (isEditing) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		"data-re-img-bm-toolbar": "",
@@ -1660,32 +1607,26 @@ function ImageBubbleMenuToolbar({ children, ...rest }) {
 }
 
 //#endregion
-//#region src/ui/image-bubble-menu/default.tsx
-function ImageBubbleMenuDefault({ excludeItems = [], placement, offset: offset$1, onHide, className, ...rest }) {
+//#region src/ui/bubble-menu/image-default.tsx
+const imagePluginKey = new _tiptap_pm_state.PluginKey("imageBubbleMenu");
+function BubbleMenuImageDefault({ excludeItems = [], placement = "top", offset: offset$1, onHide, className, ...rest }) {
 	const hasEditLink = !excludeItems.includes("edit-link");
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ImageBubbleMenuRoot, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuRoot, {
+		shouldShow: bubbleMenuTriggers.node("image"),
+		pluginKey: imagePluginKey,
 		placement,
 		offset: offset$1,
 		onHide,
 		className,
 		...rest,
-		children: hasEditLink && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ImageBubbleMenuToolbar, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ImageBubbleMenuEditLink, {}) })
+		children: hasEditLink && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuImageToolbar, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuImageEditLink, {}) })
 	});
 }
 
 //#endregion
-//#region src/ui/link-bubble-menu/context.tsx
-const LinkBubbleMenuContext = react.createContext(null);
-function useLinkBubbleMenuContext() {
-	const context = react.useContext(LinkBubbleMenuContext);
-	if (!context) throw new Error("LinkBubbleMenu compound components must be used within <LinkBubbleMenu.Root>");
-	return context;
-}
-
-//#endregion
-//#region src/ui/link-bubble-menu/edit-link.tsx
-function LinkBubbleMenuEditLink({ className, children, onClick, onMouseDown, ...rest }) {
-	const { setIsEditing } = useLinkBubbleMenuContext();
+//#region src/ui/bubble-menu/link-edit-link.tsx
+function BubbleMenuLinkEditLink({ className, children, onClick, onMouseDown, ...rest }) {
+	const { setIsEditing } = useBubbleMenuContext();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 		type: "button",
 		"aria-label": "Edit link",
@@ -1706,12 +1647,16 @@ function LinkBubbleMenuEditLink({ className, children, onClick, onMouseDown, ...
 }
 
 //#endregion
-//#region src/ui/link-bubble-menu/form.tsx
-function LinkBubbleMenuForm({ className, validateUrl, onLinkApply, onLinkRemove, children }) {
-	const { editor, linkHref, isEditing, setIsEditing } = useLinkBubbleMenuContext();
+//#region src/ui/bubble-menu/link-form.tsx
+function BubbleMenuLinkForm({ className, validateUrl, onLinkApply, onLinkRemove, children }) {
+	const { editor, isEditing, setIsEditing } = useBubbleMenuContext();
 	const inputRef = react.useRef(null);
 	const formRef = react.useRef(null);
-	const displayHref = linkHref === "#" ? "" : linkHref;
+	const linkHref = (0, _tiptap_react.useEditorState)({
+		editor,
+		selector: ({ editor: e }) => e?.getAttributes("link").href ?? ""
+	});
+	const displayHref = (linkHref ?? "") === "#" ? "" : linkHref ?? "";
 	const [inputValue, setInputValue] = react.useState(displayHref);
 	react.useEffect(() => {
 		if (!isEditing) return;
@@ -1812,12 +1757,16 @@ function LinkBubbleMenuForm({ className, validateUrl, onLinkApply, onLinkRemove,
 }
 
 //#endregion
-//#region src/ui/link-bubble-menu/open-link.tsx
-function LinkBubbleMenuOpenLink({ className, children, ...rest }) {
-	const { linkHref } = useLinkBubbleMenuContext();
+//#region src/ui/bubble-menu/link-open-link.tsx
+function BubbleMenuLinkOpenLink({ className, children, ...rest }) {
+	const { editor } = useBubbleMenuContext();
+	const linkHref = (0, _tiptap_react.useEditorState)({
+		editor,
+		selector: ({ editor: e }) => e?.getAttributes("link").href ?? ""
+	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
 		...rest,
-		href: linkHref,
+		href: linkHref ?? "",
 		target: "_blank",
 		rel: "noopener noreferrer",
 		"aria-label": "Open link",
@@ -1829,46 +1778,9 @@ function LinkBubbleMenuOpenLink({ className, children, ...rest }) {
 }
 
 //#endregion
-//#region src/ui/link-bubble-menu/root.tsx
-function LinkBubbleMenuRoot({ onHide, placement = "top", offset: offset$1 = 8, className, children, ...rest }) {
-	const { editor } = (0, _tiptap_react.useCurrentEditor)();
-	const [isEditing, setIsEditing] = react.useState(false);
-	const linkHref = (0, _tiptap_react.useEditorState)({
-		editor,
-		selector: ({ editor: e }) => e?.getAttributes("link").href ?? ""
-	});
-	if (!editor) return null;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_tiptap_react_menus.BubbleMenu, {
-		editor,
-		pluginKey: "linkBubbleMenu",
-		"data-re-link-bm": "",
-		shouldShow: ({ editor: e }) => e.isActive("link") && e.view.state.selection.content().size === 0,
-		options: {
-			placement,
-			offset: offset$1,
-			onHide: () => {
-				setIsEditing(false);
-				onHide?.();
-			}
-		},
-		className,
-		...rest,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkBubbleMenuContext.Provider, {
-			value: {
-				editor,
-				linkHref: linkHref ?? "",
-				isEditing,
-				setIsEditing
-			},
-			children
-		})
-	});
-}
-
-//#endregion
-//#region src/ui/link-bubble-menu/toolbar.tsx
-function LinkBubbleMenuToolbar({ children, ...rest }) {
-	const { isEditing } = useLinkBubbleMenuContext();
+//#region src/ui/bubble-menu/link-toolbar.tsx
+function BubbleMenuLinkToolbar({ children, ...rest }) {
+	const { isEditing } = useBubbleMenuContext();
 	if (isEditing) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		"data-re-link-bm-toolbar": "",
@@ -1878,9 +1790,9 @@ function LinkBubbleMenuToolbar({ children, ...rest }) {
 }
 
 //#endregion
-//#region src/ui/link-bubble-menu/unlink.tsx
-function LinkBubbleMenuUnlink({ className, children, onClick, onMouseDown, ...rest }) {
-	const { editor } = useLinkBubbleMenuContext();
+//#region src/ui/bubble-menu/link-unlink.tsx
+function BubbleMenuLinkUnlink({ className, children, onClick, onMouseDown, ...rest }) {
+	const { editor } = useBubbleMenuContext();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 		type: "button",
 		"aria-label": "Remove link",
@@ -1901,21 +1813,24 @@ function LinkBubbleMenuUnlink({ className, children, onClick, onMouseDown, ...re
 }
 
 //#endregion
-//#region src/ui/link-bubble-menu/default.tsx
-function LinkBubbleMenuDefault({ excludeItems = [], placement, offset: offset$1, onHide, className, validateUrl, onLinkApply, onLinkRemove, ...rest }) {
+//#region src/ui/bubble-menu/link-default.tsx
+const linkPluginKey = new _tiptap_pm_state.PluginKey("linkBubbleMenu");
+function BubbleMenuLinkDefault({ excludeItems = [], placement = "top", offset: offset$1, onHide, className, validateUrl, onLinkApply, onLinkRemove, ...rest }) {
 	const has = (item) => !excludeItems.includes(item);
 	const hasToolbarItems = has("edit-link") || has("open-link") || has("unlink");
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(LinkBubbleMenuRoot, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(BubbleMenuRoot, {
+		shouldShow: bubbleMenuTriggers.nodeWithoutSelection("link"),
+		pluginKey: linkPluginKey,
 		placement,
 		offset: offset$1,
 		onHide,
 		className,
 		...rest,
-		children: [hasToolbarItems && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(LinkBubbleMenuToolbar, { children: [
-			has("edit-link") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkBubbleMenuEditLink, {}),
-			has("open-link") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkBubbleMenuOpenLink, {}),
-			has("unlink") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkBubbleMenuUnlink, {})
-		] }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkBubbleMenuForm, {
+		children: [hasToolbarItems && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(BubbleMenuLinkToolbar, { children: [
+			has("edit-link") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuLinkEditLink, {}),
+			has("open-link") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuLinkOpenLink, {}),
+			has("unlink") && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuLinkUnlink, {})
+		] }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BubbleMenuLinkForm, {
 			validateUrl,
 			onLinkApply,
 			onLinkRemove
@@ -2459,6 +2374,36 @@ Object.defineProperty(exports, 'BubbleMenuBold', {
     return BubbleMenuBold;
   }
 });
+Object.defineProperty(exports, 'BubbleMenuButtonDefault', {
+  enumerable: true,
+  get: function () {
+    return BubbleMenuButtonDefault;
+  }
+});
+Object.defineProperty(exports, 'BubbleMenuButtonEditLink', {
+  enumerable: true,
+  get: function () {
+    return BubbleMenuButtonEditLink;
+  }
+});
+Object.defineProperty(exports, 'BubbleMenuButtonForm', {
+  enumerable: true,
+  get: function () {
+    return BubbleMenuButtonForm;
+  }
+});
+Object.defineProperty(exports, 'BubbleMenuButtonToolbar', {
+  enumerable: true,
+  get: function () {
+    return BubbleMenuButtonToolbar;
+  }
+});
+Object.defineProperty(exports, 'BubbleMenuButtonUnlink', {
+  enumerable: true,
+  get: function () {
+    return BubbleMenuButtonUnlink;
+  }
+});
 Object.defineProperty(exports, 'BubbleMenuCode', {
   enumerable: true,
   get: function () {
@@ -2471,6 +2416,24 @@ Object.defineProperty(exports, 'BubbleMenuDefault', {
     return BubbleMenuDefault;
   }
 });
+Object.defineProperty(exports, 'BubbleMenuImageDefault', {
+  enumerable: true,
+  get: function () {
+    return BubbleMenuImageDefault;
+  }
+});
+Object.defineProperty(exports, 'BubbleMenuImageEditLink', {
+  enumerable: true,
+  get: function () {
+    return BubbleMenuImageEditLink;
+  }
+});
+Object.defineProperty(exports, 'BubbleMenuImageToolbar', {
+  enumerable: true,
+  get: function () {
+    return BubbleMenuImageToolbar;
+  }
+});
 Object.defineProperty(exports, 'BubbleMenuItalic', {
   enumerable: true,
   get: function () {
@@ -2489,76 +2452,76 @@ Object.defineProperty(exports, 'BubbleMenuItemGroup', {
     return BubbleMenuItemGroup;
   }
 });
-Object.defineProperty(exports, 'BubbleMenuLinkSelector', {
+Object.defineProperty(exports, 'BubbleMenuLinkDefault', {
   enumerable: true,
   get: function () {
-    return BubbleMenuLinkSelector;
+    return BubbleMenuLinkDefault;
   }
 });
-Object.defineProperty(exports, 'BubbleMenuNodeSelector', {
+Object.defineProperty(exports, 'BubbleMenuLinkEditLink', {
   enumerable: true,
   get: function () {
-    return BubbleMenuNodeSelector;
+    return BubbleMenuLinkEditLink;
   }
 });
-Object.defineProperty(exports, 'BubbleMenuRoot', {
+Object.defineProperty(exports, 'BubbleMenuLinkForm', {
   enumerable: true,
   get: function () {
-    return BubbleMenuRoot;
+    return BubbleMenuLinkForm;
   }
 });
-Object.defineProperty(exports, 'BubbleMenuStrike', {
+Object.defineProperty(exports, 'BubbleMenuLinkOpenLink', {
   enumerable: true,
   get: function () {
-    return BubbleMenuStrike;
+    return BubbleMenuLinkOpenLink;
   }
 });
-Object.defineProperty(exports, 'BubbleMenuUnderline', {
+Object.defineProperty(exports, 'BubbleMenuLinkSelector', {
   enumerable: true,
   get: function () {
-    return BubbleMenuUnderline;
+    return BubbleMenuLinkSelector;
   }
 });
-Object.defineProperty(exports, 'BubbleMenuUppercase', {
+Object.defineProperty(exports, 'BubbleMenuLinkToolbar', {
   enumerable: true,
   get: function () {
-    return BubbleMenuUppercase;
+    return BubbleMenuLinkToolbar;
   }
 });
-Object.defineProperty(exports, 'ButtonBubbleMenuDefault', {
+Object.defineProperty(exports, 'BubbleMenuLinkUnlink', {
   enumerable: true,
   get: function () {
-    return ButtonBubbleMenuDefault;
+    return BubbleMenuLinkUnlink;
   }
 });
-Object.defineProperty(exports, 'ButtonBubbleMenuEditLink', {
+Object.defineProperty(exports, 'BubbleMenuNodeSelector', {
   enumerable: true,
   get: function () {
-    return ButtonBubbleMenuEditLink;
+    return BubbleMenuNodeSelector;
   }
 });
-Object.defineProperty(exports, 'ButtonBubbleMenuForm', {
+Object.defineProperty(exports, 'BubbleMenuRoot', {
   enumerable: true,
   get: function () {
-    return ButtonBubbleMenuForm;
+    return BubbleMenuRoot;
   }
 });
-Object.defineProperty(exports, 'ButtonBubbleMenuRoot', {
+Object.defineProperty(exports, 'BubbleMenuStrike', {
   enumerable: true,
   get: function () {
-    return ButtonBubbleMenuRoot;
+    return BubbleMenuStrike;
   }
 });
-Object.defineProperty(exports, 'ButtonBubbleMenuToolbar', {
+Object.defineProperty(exports, 'BubbleMenuUnderline', {
   enumerable: true,
   get: function () {
-    return ButtonBubbleMenuToolbar;
+    return BubbleMenuUnderline;
   }
 });
-Object.defineProperty(exports, 'ButtonBubbleMenuUnlink', {
+Object.defineProperty(exports, 'BubbleMenuUppercase', {
   enumerable: true,
   get: function () {
-    return ButtonBubbleMenuUnlink;
+    return BubbleMenuUppercase;
   }
 });
 Object.defineProperty(exports, 'CODE', {
@@ -2675,78 +2638,12 @@ Object.defineProperty(exports, 'Heading3', {
     return Heading3;
   }
 });
-Object.defineProperty(exports, 'ImageBubbleMenuDefault', {
-  enumerable: true,
-  get: function () {
-    return ImageBubbleMenuDefault;
-  }
-});
-Object.defineProperty(exports, 'ImageBubbleMenuEditLink', {
-  enumerable: true,
-  get: function () {
-    return ImageBubbleMenuEditLink;
-  }
-});
-Object.defineProperty(exports, 'ImageBubbleMenuRoot', {
-  enumerable: true,
-  get: function () {
-    return ImageBubbleMenuRoot;
-  }
-});
-Object.defineProperty(exports, 'ImageBubbleMenuToolbar', {
-  enumerable: true,
-  get: function () {
-    return ImageBubbleMenuToolbar;
-  }
-});
 Object.defineProperty(exports, 'ItalicIcon', {
   enumerable: true,
   get: function () {
     return ItalicIcon;
   }
 });
-Object.defineProperty(exports, 'LinkBubbleMenuDefault', {
-  enumerable: true,
-  get: function () {
-    return LinkBubbleMenuDefault;
-  }
-});
-Object.defineProperty(exports, 'LinkBubbleMenuEditLink', {
-  enumerable: true,
-  get: function () {
-    return LinkBubbleMenuEditLink;
-  }
-});
-Object.defineProperty(exports, 'LinkBubbleMenuForm', {
-  enumerable: true,
-  get: function () {
-    return LinkBubbleMenuForm;
-  }
-});
-Object.defineProperty(exports, 'LinkBubbleMenuOpenLink', {
-  enumerable: true,
-  get: function () {
-    return LinkBubbleMenuOpenLink;
-  }
-});
-Object.defineProperty(exports, 'LinkBubbleMenuRoot', {
-  enumerable: true,
-  get: function () {
-    return LinkBubbleMenuRoot;
-  }
-});
-Object.defineProperty(exports, 'LinkBubbleMenuToolbar', {
-  enumerable: true,
-  get: function () {
-    return LinkBubbleMenuToolbar;
-  }
-});
-Object.defineProperty(exports, 'LinkBubbleMenuUnlink', {
-  enumerable: true,
-  get: function () {
-    return LinkBubbleMenuUnlink;
-  }
-});
 Object.defineProperty(exports, 'LinkIcon', {
   enumerable: true,
   get: function () {
@@ -2891,6 +2788,12 @@ Object.defineProperty(exports, 'UnlinkIcon', {
     return UnlinkIcon;
   }
 });
+Object.defineProperty(exports, 'bubbleMenuTriggers', {
+  enumerable: true,
+  get: function () {
+    return bubbleMenuTriggers;
+  }
+});
 Object.defineProperty(exports, 'defaultSlashCommands', {
   enumerable: true,
   get: function () {
@@ -2921,21 +2824,9 @@ Object.defineProperty(exports, 'scoreItem', {
     return scoreItem;
   }
 });
-Object.defineProperty(exports, 'useButtonBubbleMenuContext', {
-  enumerable: true,
-  get: function () {
-    return useButtonBubbleMenuContext;
-  }
-});
-Object.defineProperty(exports, 'useImageBubbleMenuContext', {
-  enumerable: true,
-  get: function () {
-    return useImageBubbleMenuContext;
-  }
-});
-Object.defineProperty(exports, 'useLinkBubbleMenuContext', {
+Object.defineProperty(exports, 'useBubbleMenuContext', {
   enumerable: true,
   get: function () {
-    return useLinkBubbleMenuContext;
+    return useBubbleMenuContext;
   }
 });