@sendbird/actionbook-core 0.10.2 → 0.10.3

package/dist/ui/index.d.ts

@@ -346,6 +346,8 @@ declare function DocumentTreeView({ doc, className, onNavigate }: DocumentTreeVi
  * get clipped by overflow:hidden ancestors.
  */
 
+/** Custom event name for triggering the insert-link dialog from outside. */
+declare const INSERT_LINK_EVENT = "ab-insert-link";
 interface FloatingMenuProps {
     view: EditorView | null;
     editorState: EditorState | null;
@@ -432,4 +434,4 @@ declare function astNodesToJSONContent(nodes: (InlineNode | BlockNode)[]): JSONC
  */
 declare function hasInvalidJinjaConditions(state: EditorState): boolean;
 
-export { type ActionbookPlugin, ActionbookRenderer, type ActionbookRendererProps, DocumentTreeView, type DocumentTreeViewProps, EditorShell, type EditorShellProps, type EditorViewConfig, type EditorViewHandle, FloatingMenu, type FloatingMenuProps, type InlineSuggestContext, type InlineSuggestProvider, type InlineSuggestState, JUMP_POINT_ADJACENT_SPEC, JinjaTreeView, type JinjaTreeViewProps, type NodeViewFactory, type ReactNodeViewOptions, type ReactNodeViewProps, type SlashCommandItem, SlashCommandMenu, type SlashCommandMenuProps, type SlashCommandState, actionbookSchema, astNodesToJSONContent, convertBlock, convertInline, createDragHandlePlugin, createHistoryPlugin, createInlineSuggestPlugin, createInlineToolTagNodeViewPlugin, createInputRulesPlugin, createJinjaDecorationPlugin, createJinjaIfBlockPlugin, createJumpPointAdjacentPlugin, createJumpPointNodeViewPlugin, createJumpPointValidationPlugin, createKeymapPlugin, createLinkPlugin, createMarkdownClipboardPlugin, createNoteBlockPlugin, createPlaceholderPlugin, createPluginArray, createReactNodeView, createSlashCommandPlugin, createTodoNodeViewPlugin, hasBrokenAnchorRefs, hasDuplicateJumpPoints, hasInvalidJinjaConditions, inlineSuggestKey, slashCommandKey, toProseMirrorJSON, useEditorView };
+export { type ActionbookPlugin, ActionbookRenderer, type ActionbookRendererProps, DocumentTreeView, type DocumentTreeViewProps, EditorShell, type EditorShellProps, type EditorViewConfig, type EditorViewHandle, FloatingMenu, type FloatingMenuProps, INSERT_LINK_EVENT, type InlineSuggestContext, type InlineSuggestProvider, type InlineSuggestState, JUMP_POINT_ADJACENT_SPEC, JinjaTreeView, type JinjaTreeViewProps, type NodeViewFactory, type ReactNodeViewOptions, type ReactNodeViewProps, type SlashCommandItem, SlashCommandMenu, type SlashCommandMenuProps, type SlashCommandState, actionbookSchema, astNodesToJSONContent, convertBlock, convertInline, createDragHandlePlugin, createHistoryPlugin, createInlineSuggestPlugin, createInlineToolTagNodeViewPlugin, createInputRulesPlugin, createJinjaDecorationPlugin, createJinjaIfBlockPlugin, createJumpPointAdjacentPlugin, createJumpPointNodeViewPlugin, createJumpPointValidationPlugin, createKeymapPlugin, createLinkPlugin, createMarkdownClipboardPlugin, createNoteBlockPlugin, createPlaceholderPlugin, createPluginArray, createReactNodeView, createSlashCommandPlugin, createTodoNodeViewPlugin, hasBrokenAnchorRefs, hasDuplicateJumpPoints, hasInvalidJinjaConditions, inlineSuggestKey, slashCommandKey, toProseMirrorJSON, useEditorView };

package/dist/ui/index.js

@@ -6430,16 +6430,18 @@ var JINJA_STYLES = `
   letter-spacing: -0.3px;
 }
 
-.jinja-branch-condition-invalid {
-  text-decoration: wavy underline #D9352C;
-  text-underline-offset: 3px;
+.jinja-branch-header-invalid {
+  border: 1px solid #D9352C;
+  border-radius: 4px;
 }
 
-.jinja-condition-error-icon {
+.jinja-condition-error {
+  display: flex;
+  align-items: center;
+  padding: 4px 0 4px 52px;
   color: #D9352C;
-  margin-left: 4px;
   font-size: 12px;
-  flex-shrink: 0;
+  line-height: 16px;
 }
 
 .jinja-token-variable {
@@ -6827,7 +6829,8 @@ function ConditionDisplay({
   condition,
   editable = true,
   onConditionChange,
-  onBackspaceEmpty
+  onBackspaceEmpty,
+  onConditionBlur
 }) {
   const [isEditing, setIsEditing] = useState3(false);
   const [draftValue, setDraftValue] = useState3(condition);
@@ -6855,6 +6858,7 @@ function ConditionDisplay({
   }
   const commit = () => {
     setIsEditing(false);
+    onConditionBlur?.();
     if (draftValue !== condition) {
       onConditionChange(draftValue);
     }
@@ -6890,14 +6894,11 @@ function ConditionDisplay({
       }
     );
   }
-  const validation = condition.length > 0 ? validateCondition(condition) : null;
-  const isInvalid = validation != null && !validation.valid;
   return /* @__PURE__ */ jsx6(
     "button",
     {
       type: "button",
-      className: `jinja-branch-condition${isInvalid ? " jinja-branch-condition-invalid" : ""}`,
-      title: isInvalid ? validation.error : void 0,
+      className: "jinja-branch-condition",
       onMouseDown: (event) => event.preventDefault(),
       onClick: () => {
         if (editable) {
@@ -6905,10 +6906,7 @@ function ConditionDisplay({
           setIsEditing(true);
         }
       },
-      children: condition.length > 0 ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
-        renderCondition(condition),
-        isInvalid && /* @__PURE__ */ jsx6("span", { className: "jinja-condition-error-icon", children: "\u26A0" })
-      ] }) : /* @__PURE__ */ jsx6("span", { className: "jinja-condition-placeholder", children: CONDITION_PLACEHOLDER })
+      children: condition.length > 0 ? renderCondition(condition) : /* @__PURE__ */ jsx6("span", { className: "jinja-condition-placeholder", children: CONDITION_PLACEHOLDER })
     }
   );
 }
@@ -7002,8 +7000,17 @@ function JinjaBranchHeader({
   }
   const canOpenFooterMenu = editable && isLastBranch && branchType !== "else";
   const isMenuOpen = (source) => menuSource === source && menuItems.length > 0;
+  const [conditionTouched, setConditionTouched] = useState3(false);
+  const conditionError = (() => {
+    if (branchType === "else") return null;
+    if (condition.length === 0) {
+      return conditionTouched ? "This field is required." : null;
+    }
+    const result = validateCondition(condition);
+    return result.valid ? null : result.error || "Invalid condition";
+  })();
   return /* @__PURE__ */ jsxs5(Fragment2, { children: [
-    /* @__PURE__ */ jsxs5("div", { className: "jinja-branch-header", children: [
+    /* @__PURE__ */ jsxs5("div", { className: `jinja-branch-header${conditionError ? " jinja-branch-header-invalid" : ""}`, children: [
       /* @__PURE__ */ jsx6("span", { className: `jinja-branch-badge jinja-branch-badge-${branchType}`, children: branchType === "elif" ? "ELSE IF" : branchType.toUpperCase() }),
       /* @__PURE__ */ jsx6(
         ConditionDisplay,
@@ -7012,7 +7019,8 @@ function JinjaBranchHeader({
           condition,
           editable,
           onConditionChange,
-          onBackspaceEmpty: onDelete
+          onBackspaceEmpty: onDelete,
+          onConditionBlur: () => setConditionTouched(true)
         }
       ),
       editable ? /* @__PURE__ */ jsxs5("div", { className: "jinja-branch-actions", ref: kebabRef, children: [
@@ -7050,6 +7058,7 @@ function JinjaBranchHeader({
         ) : null
       ] }) : null
     ] }),
+    conditionError && /* @__PURE__ */ jsx6("div", { className: "jinja-condition-error", children: conditionError }),
     isLastBranch && editable ? /* @__PURE__ */ jsx6("div", { className: "jinja-add-footer", children: /* @__PURE__ */ jsx6("div", { className: "jinja-add-footer-col", children: /* @__PURE__ */ jsxs5("div", { className: "jinja-add-footer-actions", ref: footerRef, children: [
       /* @__PURE__ */ jsx6(
         "button",
@@ -7359,17 +7368,17 @@ function createLinkEditPlugin() {
         if (match) {
           const [, label, href, title] = match;
           const linkMarkType = newState.schema.marks.link;
-          if (linkMarkType && href) {
+          if (!label) {
+            reconvertTr.delete(safeFrom, safeTo);
+          } else if (linkMarkType && href) {
             const attrs = title ? { href, title: title.trim() } : { href };
             reconvertTr.delete(safeFrom, safeTo);
-            if (label.length > 0) {
-              reconvertTr.insertText(label, safeFrom);
-              reconvertTr.addMark(
-                safeFrom,
-                safeFrom + label.length,
-                linkMarkType.create(attrs)
-              );
-            }
+            reconvertTr.insertText(label, safeFrom);
+            reconvertTr.addMark(
+              safeFrom,
+              safeFrom + label.length,
+              linkMarkType.create(attrs)
+            );
           }
         }
       }
@@ -7383,12 +7392,17 @@ function createLinkInputRule() {
     (state, match, start, end) => {
       const [, label, href, title] = match;
       const linkMarkType = state.schema.marks.link;
-      if (!linkMarkType || !href) return null;
-      const displayText = label || href;
-      const attrs = title ? { href, title: title.trim() } : { href };
+      if (!linkMarkType) return null;
       const { tr } = state;
-      tr.replaceWith(start, end, state.schema.text(displayText));
-      tr.addMark(start, start + displayText.length, linkMarkType.create(attrs));
+      if (!label) {
+        tr.delete(start, end);
+        tr.setMeta(linkEditKey, null);
+        return tr;
+      }
+      if (!href) return null;
+      const attrs = title ? { href, title: title.trim() } : { href };
+      tr.replaceWith(start, end, state.schema.text(label));
+      tr.addMark(start, start + label.length, linkMarkType.create(attrs));
       tr.setMeta(linkEditKey, null);
       return tr;
     }
@@ -8455,14 +8469,12 @@ function injectScrollbarStyle() {
   const style = document.createElement("style");
   style.id = SCROLLBAR_STYLE_ID;
   style.textContent = `
-.ab-slash-menu::-webkit-scrollbar { width: 6px; }
-.ab-slash-menu::-webkit-scrollbar-track { background: transparent; }
-.ab-slash-menu::-webkit-scrollbar-thumb { background: #c4c4c4; border-radius: 3px; }
-.ab-slash-menu::-webkit-scrollbar-thumb:hover { background: #999; }
+.ab-slash-menu::-webkit-scrollbar { display: none; }
+.ab-slash-menu { scrollbar-width: none; }
 `;
   document.head.appendChild(style);
 }
-var POPUP_SHADOW = "0 8px 10px rgba(13,13,13,0.12), 0 3px 14px rgba(13,13,13,0.08), 0 3px 5px rgba(13,13,13,0.04)";
+var POPUP_SHADOW = "0 0 0 1px #CCCCCC, 0 4px 16px rgba(0, 0, 0, 0.12)";
 var BTN_RESET = {
   border: "none",
   padding: 0,
@@ -8544,12 +8556,10 @@ function SlashCommandMenu({ view, editorState, items }) {
           width: MENU_WIDTH,
           maxHeight: MAX_MENU_H,
           overflowY: "auto",
-          scrollbarWidth: "thin",
-          scrollbarColor: "#c4c4c4 transparent",
           background: "#fff",
-          borderRadius: 4,
+          borderRadius: 8,
           boxShadow: POPUP_SHADOW,
-          padding: "8px 0",
+          padding: "4px",
           zIndex: 1100,
           animation: "ab-float-in 0.12s ease"
         },
@@ -8615,8 +8625,8 @@ function SlashMenuItem({ item, index, selected, onMouseEnter, onMouseDown }) {
         display: "flex",
         alignItems: "center",
         gap: 12,
-        padding: "6px 16px",
-        background: selected ? "rgba(13,13,13,0.04)" : "transparent",
+        padding: "6px 8px",
+        background: selected ? "rgba(0, 0, 0, 0.04)" : "transparent",
         transition: "background 0.08s"
       },
       onMouseEnter,
@@ -9037,7 +9047,7 @@ function getSelectionDOMRect() {
   if (rect.width === 0 && rect.height === 0) return null;
   return rect;
 }
-var POPUP_SHADOW2 = "0 0 0 1px rgba(0,0,0,0.07), 0 4px 20px rgba(0,0,0,0.11), 0 1px 4px rgba(0,0,0,0.05)";
+var POPUP_SHADOW2 = "0 0 0 1px #CCCCCC, 0 4px 16px rgba(0, 0, 0, 0.12)";
 var BTN_RESET2 = {
   border: "none",
   padding: 0,
@@ -9069,8 +9079,8 @@ function TBtn({ children, active, title, onMouseDown, style }) {
         borderRadius: 6,
         fontSize: 13,
         fontWeight: 600,
-        color: active ? "#6366f1" : "#3f3f46",
-        background: active ? "rgba(99,102,241,0.1)" : hover ? "rgba(0,0,0,0.05)" : "transparent",
+        color: active ? "#6210CC" : "#0D0D0D",
+        background: active ? "rgba(98,16,204,0.08)" : hover ? "rgba(0,0,0,0.05)" : "transparent",
         transition: "background 0.1s, color 0.1s",
         ...style
       },
@@ -9164,8 +9174,8 @@ function BlockTypeDropdown({ view, state, label }) {
           borderRadius: 6,
           fontSize: 11,
           fontWeight: 600,
-          color: open ? "#6366f1" : "#3f3f46",
-          background: open ? "rgba(99,102,241,0.1)" : hover ? "rgba(0,0,0,0.05)" : "transparent",
+          color: open ? "#6210CC" : "#0D0D0D",
+          background: open ? "rgba(98,16,204,0.08)" : hover ? "rgba(0,0,0,0.04)" : "transparent",
           transition: "background 0.1s, color 0.1s",
           whiteSpace: "nowrap"
         },
@@ -9186,9 +9196,9 @@ function BlockTypeDropdown({ view, state, label }) {
             left: btnRect.left,
             top: btnRect.bottom + 4,
             background: "#fff",
-            borderRadius: 10,
+            borderRadius: 8,
             boxShadow: POPUP_SHADOW2,
-            padding: 6,
+            padding: 4,
             minWidth: 168,
             animation: "ab-float-in 0.12s ease"
           },
@@ -9219,16 +9229,16 @@ function DropdownItem({ item, onRun }) {
         gap: 10,
         width: "100%",
         padding: "6px 8px",
-        borderRadius: 6,
+        borderRadius: 4,
         textAlign: "left",
         fontSize: 13,
-        color: item.active ? "#6366f1" : "#3f3f46",
+        color: item.active ? "#6210CC" : "#0D0D0D",
         fontWeight: item.active ? 600 : 400,
         background: hover ? "rgba(0,0,0,0.04)" : "transparent",
         transition: "background 0.1s"
       },
       children: [
-        /* @__PURE__ */ jsx10("span", { style: { width: 24, flexShrink: 0, textAlign: "center", fontWeight: 700, fontSize: 12, fontFamily: "monospace", color: "#6366f1" }, children: item.shortLabel }),
+        /* @__PURE__ */ jsx10("span", { style: { width: 24, flexShrink: 0, textAlign: "center", fontWeight: 700, fontSize: 12, fontFamily: "monospace", color: "#6210CC" }, children: item.shortLabel }),
         item.label
       ]
     }
@@ -9305,7 +9315,7 @@ function SelectionToolbar({ view, state, selectionRect }) {
         gap: 2,
         padding: "0 6px",
         background: "#fff",
-        borderRadius: 10,
+        borderRadius: 8,
         boxShadow: POPUP_SHADOW2,
         userSelect: "none",
         animation: "ab-float-in 0.12s ease"
@@ -9353,7 +9363,7 @@ function SelectionToolbar({ view, state, selectionRect }) {
                 e.preventDefault();
                 applyLink();
               },
-              style: { color: "#6366f1", width: 24, fontSize: 14 },
+              style: { color: "#6210CC", width: 24, fontSize: 14 },
               children: "\u21B5"
             }
           ),
@@ -9602,8 +9612,8 @@ function LinkEditDialog({ view, link: link2, onClose }) {
     top = Math.min(anchorBottom + 12, window.innerHeight - estimatedDialogH - VPORT_MARGIN2);
   }
   const finalHref = normalizeLinkHref(hrefValue);
-  const finalText = textValue.trim() ? textValue : finalHref;
-  const canSave = Boolean(finalHref) && (finalHref !== link2.href || finalText !== link2.text);
+  const finalText = textValue.trim() ? textValue : "";
+  const canSave = !textValue.trim() || Boolean(finalHref) && (finalHref !== link2.href || finalText !== link2.text);
   const currentLink = () => {
     const activeLink = getLinkAtCursor(view.state);
     if (activeLink && activeLink.from === link2.from && activeLink.to === link2.to) {
@@ -9614,7 +9624,14 @@ function LinkEditDialog({ view, link: link2, onClose }) {
   const saveLink = () => {
     const activeLink = currentLink();
     const nextHref = normalizeLinkHref(hrefValue);
-    const nextText = textValue.trim() ? textValue : nextHref;
+    if (!textValue.trim()) {
+      const tr2 = view.state.tr.delete(activeLink.from, activeLink.to);
+      view.dispatch(tr2);
+      onClose();
+      view.focus();
+      return;
+    }
+    const nextText = textValue;
     if (!nextHref) return;
     if (nextHref === activeLink.href && nextText === activeLink.text) return;
     const cursorOffset = Math.max(0, view.state.selection.from - activeLink.from);
@@ -9674,8 +9691,8 @@ function LinkEditDialog({ view, link: link2, onClose }) {
           gap: 16,
           padding: 16,
           background: "#FFFFFF",
-          borderRadius: 4,
-          boxShadow: "0px 8px 10px rgba(13,13,13,0.12), 0px 3px 14px rgba(13,13,13,0.08), 0px 3px 5px rgba(13,13,13,0.04)",
+          borderRadius: 8,
+          boxShadow: "0 0 0 1px #CCCCCC, 0 4px 16px rgba(0, 0, 0, 0.12)",
           boxSizing: "border-box",
           animation: "ab-float-in 0.12s ease"
         },
@@ -9843,6 +9860,189 @@ function LinkEditDialog({ view, link: link2, onClose }) {
     document.body
   );
 }
+var INSERT_LINK_EVENT = "ab-insert-link";
+function LinkInsertDialog({ view, cursorPos, onClose }) {
+  const [textValue, setTextValue] = useState7("");
+  const [hrefValue, setHrefValue] = useState7("");
+  const textInputRef = useRef4(null);
+  useEffect4(() => {
+    setTimeout(() => textInputRef.current?.focus(), 0);
+  }, []);
+  useEffect4(() => {
+    const onDown = (e) => {
+      if (!e.target.closest(`[${FLOAT_ATTR}]`)) {
+        onClose();
+      }
+    };
+    document.addEventListener("mousedown", onDown, true);
+    return () => document.removeEventListener("mousedown", onDown, true);
+  }, [onClose]);
+  let coords;
+  try {
+    coords = view.coordsAtPos(cursorPos);
+  } catch {
+    onClose();
+    return null;
+  }
+  const dialogW = 280;
+  const left = Math.max(
+    VPORT_MARGIN2,
+    Math.min(coords.left - dialogW / 2, window.innerWidth - dialogW - VPORT_MARGIN2)
+  );
+  const top = Math.min(coords.bottom + 8, window.innerHeight - 220 - VPORT_MARGIN2);
+  const finalHref = normalizeLinkHref(hrefValue);
+  const canSave = Boolean(finalHref);
+  const saveLink = () => {
+    if (!finalHref) return;
+    const displayText = textValue.trim() || finalHref;
+    const tr = view.state.tr;
+    const linkMarkType = view.state.schema.marks.link;
+    if (!linkMarkType) return;
+    tr.insertText(displayText, cursorPos);
+    tr.addMark(cursorPos, cursorPos + displayText.length, linkMarkType.create({ href: finalHref }));
+    view.dispatch(tr);
+    onClose();
+    view.focus();
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Escape") {
+      e.preventDefault();
+      onClose();
+      view.focus();
+    }
+    if (e.key === "Enter") {
+      e.preventDefault();
+      saveLink();
+    }
+  };
+  return createPortal2(
+    /* @__PURE__ */ jsxs9(
+      "div",
+      {
+        ...{ [FLOAT_ATTR]: "" },
+        style: {
+          position: "fixed",
+          left,
+          top,
+          zIndex: 1001,
+          width: dialogW,
+          display: "flex",
+          flexDirection: "column",
+          gap: 16,
+          padding: 16,
+          background: "#FFFFFF",
+          borderRadius: 8,
+          boxShadow: POPUP_SHADOW2,
+          boxSizing: "border-box",
+          animation: "ab-float-in 0.12s ease"
+        },
+        children: [
+          /* @__PURE__ */ jsxs9("div", { ...{ [FLOAT_ATTR]: "" }, style: { display: "flex", flexDirection: "column", gap: 6 }, children: [
+            /* @__PURE__ */ jsxs9("div", { ...{ [FLOAT_ATTR]: "" }, style: { fontSize: 12, lineHeight: "16px", fontWeight: 600, color: "#0D0D0D" }, children: [
+              "Text ",
+              /* @__PURE__ */ jsx10("span", { style: { color: "#858585" }, children: "(optional)" })
+            ] }),
+            /* @__PURE__ */ jsx10(
+              "input",
+              {
+                ref: textInputRef,
+                ...{ [FLOAT_ATTR]: "" },
+                value: textValue,
+                placeholder: "",
+                onChange: (e) => setTextValue(e.target.value),
+                onKeyDown: handleKeyDown,
+                style: {
+                  height: 32,
+                  border: "1px solid #CCCCCC",
+                  borderRadius: 4,
+                  padding: "0 16px",
+                  fontSize: 14,
+                  color: "#0D0D0D",
+                  outline: "none",
+                  boxSizing: "border-box"
+                }
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs9("div", { ...{ [FLOAT_ATTR]: "" }, style: { display: "flex", flexDirection: "column", gap: 6 }, children: [
+            /* @__PURE__ */ jsx10("div", { ...{ [FLOAT_ATTR]: "" }, style: { fontSize: 12, lineHeight: "16px", fontWeight: 600, color: "#0D0D0D" }, children: "Link" }),
+            /* @__PURE__ */ jsx10(
+              "input",
+              {
+                ...{ [FLOAT_ATTR]: "" },
+                value: hrefValue,
+                onChange: (e) => setHrefValue(e.target.value),
+                onKeyDown: handleKeyDown,
+                style: {
+                  height: 32,
+                  border: "1px solid #CCCCCC",
+                  borderRadius: 4,
+                  padding: "0 16px",
+                  fontSize: 14,
+                  color: "#0D0D0D",
+                  outline: "none",
+                  boxSizing: "border-box"
+                }
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs9("div", { ...{ [FLOAT_ATTR]: "" }, style: { display: "flex", alignItems: "center", justifyContent: "flex-end", gap: 8 }, children: [
+            /* @__PURE__ */ jsx10(
+              "button",
+              {
+                type: "button",
+                ...{ [FLOAT_ATTR]: "" },
+                onMouseDown: (e) => {
+                  e.preventDefault();
+                  onClose();
+                  view.focus();
+                },
+                style: {
+                  ...BTN_RESET2,
+                  height: 32,
+                  padding: "0 13px",
+                  border: "1px solid #CCCCCC",
+                  borderRadius: 4,
+                  fontSize: 14,
+                  lineHeight: "20px",
+                  fontWeight: 600,
+                  color: "#0D0D0D"
+                },
+                children: "Cancel"
+              }
+            ),
+            /* @__PURE__ */ jsx10(
+              "button",
+              {
+                type: "button",
+                disabled: !canSave,
+                ...{ [FLOAT_ATTR]: "" },
+                onMouseDown: (e) => {
+                  e.preventDefault();
+                  if (canSave) saveLink();
+                },
+                style: {
+                  ...BTN_RESET2,
+                  height: 32,
+                  padding: "0 13px",
+                  borderRadius: 4,
+                  fontSize: 14,
+                  lineHeight: "20px",
+                  fontWeight: 600,
+                  background: canSave ? "#6210CC" : "#ECECEC",
+                  color: canSave ? "#FFFFFF" : "#A6A6A6",
+                  cursor: canSave ? "pointer" : "default"
+                },
+                children: "Save"
+              }
+            )
+          ] })
+        ]
+      }
+    ),
+    document.body
+  );
+}
 var BLOCK_ITEMS = [
   {
     shortLabel: "\xB6",
@@ -9965,12 +10165,12 @@ function EmptyParaHandle({ view, cursorPos }) {
           height: btnSize,
           border: "1px solid rgba(0,0,0,0.1)",
           borderRadius: 5,
-          background: menuOpen ? "rgba(99,102,241,0.08)" : "#fff",
+          background: menuOpen ? "rgba(98,16,204,0.08)" : "#fff",
           boxShadow: "0 1px 3px rgba(0,0,0,0.06)",
           display: "flex",
           alignItems: "center",
           justifyContent: "center",
-          color: menuOpen ? "#6366f1" : "#9ca3af",
+          color: menuOpen ? "#6210CC" : "#9ca3af",
           fontSize: 16,
           animation: "ab-float-in 0.15s ease",
           transition: "color 0.1s, background 0.1s, border-color 0.1s"
@@ -9988,9 +10188,9 @@ function EmptyParaHandle({ view, cursorPos }) {
           left: menuLeft,
           top: menuTop,
           background: "#fff",
-          borderRadius: 10,
+          borderRadius: 8,
           boxShadow: POPUP_SHADOW2,
-          padding: 6,
+          padding: 4,
           minWidth: 168,
           animation: "ab-float-in 0.12s ease"
         },
@@ -10034,7 +10234,7 @@ function BlockMenuItem({
         borderRadius: 6,
         textAlign: "left",
         fontSize: 13,
-        color: "#3f3f46",
+        color: "#0D0D0D",
         background: hover ? "rgba(0,0,0,0.04)" : "transparent",
         transition: "background 0.1s"
       },
@@ -10049,7 +10249,7 @@ function BlockMenuItem({
               fontWeight: 700,
               fontSize: 12,
               fontFamily: "monospace",
-              color: "#6366f1"
+              color: "#6210CC"
             },
             children: item.shortLabel
           }
@@ -10062,8 +10262,19 @@ function BlockMenuItem({
 function FloatingMenu({ view, editorState }) {
   const [showEmptyHandle, setShowEmptyHandle] = useState7(false);
   const [editingLink, setEditingLink] = useState7(null);
+  const [insertLinkPos, setInsertLinkPos] = useState7(null);
   const dwellTimerRef = useRef4(null);
   const lastEmptyPosRef = useRef4(null);
+  useEffect4(() => {
+    const dom = view?.dom;
+    if (!dom) return;
+    const handler = () => {
+      const pos = view.state.selection.from;
+      setInsertLinkPos(pos);
+    };
+    dom.addEventListener(INSERT_LINK_EVENT, handler);
+    return () => dom.removeEventListener(INSERT_LINK_EVENT, handler);
+  }, [view]);
   const [, setScrollTick] = useState7(0);
   useEffect4(() => {
     const editorDom = view?.dom;
@@ -10136,7 +10347,15 @@ function FloatingMenu({ view, editorState }) {
           onClose: () => setEditingLink(null)
         }
       ),
-      !hasSelection && !linkAtCursor && showEmptyHandle && emptyPos !== null && /* @__PURE__ */ jsx10(EmptyParaHandle, { view, cursorPos: emptyPos })
+      insertLinkPos !== null && /* @__PURE__ */ jsx10(
+        LinkInsertDialog,
+        {
+          view,
+          cursorPos: insertLinkPos,
+          onClose: () => setInsertLinkPos(null)
+        }
+      ),
+      !hasSelection && !linkAtCursor && !insertLinkPos && showEmptyHandle && emptyPos !== null && /* @__PURE__ */ jsx10(EmptyParaHandle, { view, cursorPos: emptyPos })
     ] }),
     document.body
   );
@@ -10324,6 +10543,7 @@ export {
   DocumentTreeView,
   EditorShell,
   FloatingMenu,
+  INSERT_LINK_EVENT,
   JUMP_POINT_ADJACENT_SPEC,
   JinjaTreeView,
   SlashCommandMenu,