@sendbird/actionbook-core 0.10.2 → 0.10.4

package/dist/ui/index.js

@@ -3008,7 +3008,7 @@ function createHistoryPlugin() {
 
 // src/ui/plugin/keymapPlugin.ts
 import { baseKeymap, chainCommands, newlineInCode, createParagraphNear, liftEmptyBlock, splitBlock, toggleMark, setBlockType, joinBackward } from "prosemirror-commands";
-import { TextSelection as TextSelection2 } from "prosemirror-state";
+import { Plugin as Plugin2, TextSelection as TextSelection2 } from "prosemirror-state";
 import { keymap as keymap3 } from "prosemirror-keymap";
 import { liftListItem, sinkListItem, splitListItem, wrapInList } from "prosemirror-schema-list";
 
@@ -3104,6 +3104,10 @@ function createNoteBlockPlugin() {
 // src/ui/plugin/keymapPlugin.ts
 var TAB_CHAR = "	";
 var { listItem, bulletList, orderedList, hardBreak, heading, paragraph, horizontalRule, blockquote } = actionbookSchema.nodes;
+function isEffectivelyEmpty(node) {
+  if (node.content.size === 0) return true;
+  return node.textContent.trim().length === 0 && !node.firstChild?.isAtom;
+}
 var { bold: boldMark, italic: italicMark, underline: underlineMark, strikethrough: strikethroughMark, code: codeMark } = actionbookSchema.marks;
 function cursorDirectlyInListItem(state) {
   const { $from } = state.selection;
@@ -3112,9 +3116,8 @@ function cursorDirectlyInListItem(state) {
 var backspaceAfterList = (state, dispatch) => {
   const { $from } = state.selection;
   if (!state.selection.empty) return false;
-  if ($from.parentOffset !== 0) return false;
   if ($from.parent.type !== paragraph) return false;
-  if ($from.parent.content.size !== 0) return false;
+  if (!isEffectivelyEmpty($from.parent)) return false;
   const parentDepth = $from.depth - 1;
   if (parentDepth < 0) return false;
   const indexInParent = $from.index(parentDepth);
@@ -3133,9 +3136,8 @@ var backspaceAfterList = (state, dispatch) => {
 var backspaceAfterLeafBlock = (state, dispatch) => {
   const { $from } = state.selection;
   if (!state.selection.empty) return false;
-  if ($from.parentOffset !== 0) return false;
   if ($from.parent.type !== paragraph) return false;
-  if ($from.parent.content.size !== 0) return false;
+  if (!isEffectivelyEmpty($from.parent)) return false;
   const parentDepth = $from.depth - 1;
   if (parentDepth < 0) return false;
   const indexInParent = $from.index(parentDepth);
@@ -3150,8 +3152,8 @@ var backspaceAfterLeafBlock = (state, dispatch) => {
 };
 var backspaceDeleteEmptyBlock = (state, dispatch) => {
   const { $from } = state.selection;
-  if (!state.selection.empty || $from.parentOffset !== 0) return false;
-  if ($from.parent.type !== paragraph || $from.parent.content.size !== 0) return false;
+  if (!state.selection.empty) return false;
+  if ($from.parent.type !== paragraph || !isEffectivelyEmpty($from.parent)) return false;
   const deletableTypes = /* @__PURE__ */ new Set(["jinjaIfBlock", "jinjaIfBranch", "noteBlock", "blockquote"]);
   for (let d = $from.depth - 1; d > 0; d--) {
     const ancestor = $from.node(d);
@@ -3391,6 +3393,18 @@ var shiftEnterCommand = (state, dispatch) => {
   }
   return true;
 };
+function createEmptyDocGuardPlugin() {
+  return new Plugin2({
+    appendTransaction(_, __, newState) {
+      const { doc: doc2 } = newState;
+      if (doc2.childCount !== 1) return null;
+      const only = doc2.child(0);
+      if (only.type === paragraph) return null;
+      if (only.content.size !== 0) return null;
+      return newState.tr.setNodeMarkup(0, paragraph);
+    }
+  });
+}
 function createKeymapPlugin() {
   return {
     name: "keymapPlugin",
@@ -3408,13 +3422,13 @@ function createKeymapPlugin() {
       "Mod-Shift-7": wrapInList(bulletList),
       "Mod-Shift-8": wrapInList(orderedList)
     }),
-    plugins: () => [keymap3(baseKeymap)]
+    plugins: () => [keymap3(baseKeymap), createEmptyDocGuardPlugin()]
   };
 }
 
 // src/ui/plugin/markdownClipboard.ts
 import { DOMParser as ProseMirrorDOMParser, Fragment, Slice } from "prosemirror-model";
-import { Plugin as Plugin2, PluginKey as PluginKey2 } from "prosemirror-state";
+import { Plugin as Plugin3, PluginKey as PluginKey2 } from "prosemirror-state";
 
 // src/ast/traverse.ts
 var MAX_DEPTH3 = 128;
@@ -5691,7 +5705,7 @@ function textToSlice(text2, view) {
 }
 var URL_RE = /^https?:\/\/[^\s]+$/i;
 function createPlugin() {
-  return new Plugin2({
+  return new Plugin3({
     key,
     props: {
       handlePaste(view, event) {
@@ -5757,7 +5771,7 @@ function createMarkdownClipboardPlugin() {
 }
 
 // src/ui/plugin/jumpPointPlugin.ts
-import { Plugin as Plugin3, PluginKey as PluginKey3, TextSelection as TextSelection3 } from "prosemirror-state";
+import { Plugin as Plugin4, PluginKey as PluginKey3, TextSelection as TextSelection3 } from "prosemirror-state";
 import { Decoration, DecorationSet } from "prosemirror-view";
 var adjacentKey = new PluginKey3("jumpPointAdjacent");
 var JUMP_POINT_ADJACENT_SPEC = { jumpPointAdjacent: true };
@@ -5778,7 +5792,7 @@ function buildDecorations(state) {
 var jumpPointEditKey = new PluginKey3("jumpPointEdit");
 var JUMP_POINT_FULL_RE = /^\^([\p{L}\p{N}_-]+)\^$/u;
 function createJumpPointEditPlugin() {
-  return new Plugin3({
+  return new Plugin4({
     key: jumpPointEditKey,
     state: {
       init: () => ({ rawRange: null }),
@@ -5880,7 +5894,7 @@ function createJumpPointAdjacentPlugin() {
     }),
     plugins: () => [
       createJumpPointEditPlugin(),
-      new Plugin3({
+      new Plugin4({
         key: adjacentKey,
         state: {
           init(_, state) {
@@ -6046,7 +6060,7 @@ function createJumpPointNodeViewPlugin() {
 }
 
 // src/ui/plugin/jumpPointValidationPlugin.ts
-import { Plugin as Plugin4, PluginKey as PluginKey4 } from "prosemirror-state";
+import { Plugin as Plugin5, PluginKey as PluginKey4 } from "prosemirror-state";
 import { Decoration as Decoration2, DecorationSet as DecorationSet2 } from "prosemirror-view";
 var pluginKey = new PluginKey4("jumpPointValidation");
 function collectJumpPointIds(state) {
@@ -6098,7 +6112,7 @@ function createJumpPointValidationPlugin() {
   return {
     name: "jumpPointValidation",
     plugins: () => [
-      new Plugin4({
+      new Plugin5({
         key: pluginKey,
         state: {
           init(_, state) {
@@ -6136,9 +6150,14 @@ function buildDecorations2(state) {
         class: "broken-anchor-ref",
         "data-broken-ref": refId,
         title: `Anchor "${refId}" no longer exists`,
-        style: "color: #D9352C; text-decoration-color: #D9352C;"
+        style: "color: #D9352C; font-weight: 500; text-decoration: none;"
       })
     );
+    const icon = document.createElement("span");
+    icon.textContent = " \u26A0";
+    icon.style.cssText = "color: #D9352C; font-size: 14px; vertical-align: middle;";
+    icon.setAttribute("aria-hidden", "true");
+    decos.push(Decoration2.widget(to, icon, { side: 1 }));
   }
   if (decos.length === 0) return DecorationSet2.empty;
   return DecorationSet2.create(state.doc, decos);
@@ -6214,7 +6233,7 @@ function createInlineToolTagNodeViewPlugin() {
 }
 
 // src/ui/plugin/jinjaDecoration.ts
-import { Plugin as Plugin5, PluginKey as PluginKey5 } from "prosemirror-state";
+import { Plugin as Plugin6, PluginKey as PluginKey5 } from "prosemirror-state";
 import { Decoration as Decoration3, DecorationSet as DecorationSet3 } from "prosemirror-view";
 var jinjaPluginKey = new PluginKey5("jinjaDecoration");
 var JINJA_TAG_RE = /\{%\s*(if|elif|else|endif)\s*([^%]*?)\s*%\}/g;
@@ -6307,7 +6326,7 @@ function createJinjaDecorationPlugin() {
   return {
     name: "jinjaDecoration",
     plugins: () => [
-      new Plugin5({
+      new Plugin6({
         key: jinjaPluginKey,
         state: {
           init(_, state) {
@@ -6331,7 +6350,7 @@ function createJinjaDecorationPlugin() {
 // src/ui/plugin/jinjaIfBlockPlugin.tsx
 import { useEffect as useEffect2, useRef as useRef2, useState as useState3 } from "react";
 import { createRoot as createRoot2 } from "react-dom/client";
-import { Plugin as Plugin6, TextSelection as TextSelection4 } from "prosemirror-state";
+import { Plugin as Plugin7, TextSelection as TextSelection4 } from "prosemirror-state";
 import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
 var PLACEHOLDER_TEXT = "Describe what AI agent should do when this condition is met";
 var CONDITION_PLACEHOLDER = "Write a condition in natural language";
@@ -6430,16 +6449,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 +6848,8 @@ function ConditionDisplay({
   condition,
   editable = true,
   onConditionChange,
-  onBackspaceEmpty
+  onBackspaceEmpty,
+  onConditionBlur
 }) {
   const [isEditing, setIsEditing] = useState3(false);
   const [draftValue, setDraftValue] = useState3(condition);
@@ -6855,6 +6877,7 @@ function ConditionDisplay({
   }
   const commit = () => {
     setIsEditing(false);
+    onConditionBlur?.();
     if (draftValue !== condition) {
       onConditionChange(draftValue);
     }
@@ -6890,14 +6913,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 +6925,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 +7019,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 +7038,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 +7077,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",
@@ -7243,7 +7271,7 @@ var JinjaIfBranchView = class {
 };
 function createEditableWatcherPlugin() {
   let lastEditable = null;
-  return new Plugin6({
+  return new Plugin7({
     view(editorView) {
       lastEditable = editorView.editable;
       return {
@@ -7274,7 +7302,7 @@ function createJinjaIfBlockPlugin() {
 
 // src/ui/plugin/linkPlugin.ts
 import { InputRule as InputRule2, inputRules as inputRules2 } from "prosemirror-inputrules";
-import { Plugin as Plugin7, PluginKey as PluginKey6, TextSelection as TextSelection5 } from "prosemirror-state";
+import { Plugin as Plugin8, PluginKey as PluginKey6, TextSelection as TextSelection5 } from "prosemirror-state";
 var LINK_INPUT_RE = /\\?\[([^\]]*?)\\?\]\(([^)\s]*?)(?:\s+"([^"]*)")?\)$/;
 var LINK_FULL_RE = /^\\?\[([^\]]*?)\\?\]\(([^)\s]*?)(?:\s+"([^"]*)")?\)$/;
 var linkEditKey = new PluginKey6("linkEdit");
@@ -7325,7 +7353,7 @@ function explodeLinkToRaw(state) {
   return tr;
 }
 function createLinkEditPlugin() {
-  return new Plugin7({
+  return new Plugin8({
     key: linkEditKey,
     state: {
       init: () => ({ rawRange: null }),
@@ -7359,17 +7387,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,19 +7411,24 @@ 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;
     }
   );
 }
 function createLinkClickPlugin() {
-  return new Plugin7({
+  return new Plugin8({
     key: new PluginKey6("linkClick"),
     props: {
       handleDOMEvents: {
@@ -7448,7 +7481,7 @@ function createLinkPlugin() {
 }
 
 // src/ui/plugin/dragHandlePlugin.ts
-import { Plugin as Plugin8, PluginKey as PluginKey7 } from "prosemirror-state";
+import { Plugin as Plugin9, PluginKey as PluginKey7 } from "prosemirror-state";
 var PLUGIN_KEY = new PluginKey7("dragHandle");
 var GRIP_SVG = `<svg width="12" height="12" viewBox="0 0 12 12" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
   <circle cx="4" cy="2.5" r="1.2"/><circle cx="8" cy="2.5" r="1.2"/>
@@ -8256,7 +8289,7 @@ function createDragHandlePlugin() {
     plugins: () => {
       let controller = null;
       return [
-        new Plugin8({
+        new Plugin9({
           key: PLUGIN_KEY,
           view(editorView) {
             controller = new DragHandleController(editorView);
@@ -8379,9 +8412,8 @@ function createTodoNodeViewPlugin() {
 }
 
 // src/ui/plugin/placeholderPlugin.ts
-import { Plugin as Plugin9, PluginKey as PluginKey8 } from "prosemirror-state";
+import { Plugin as Plugin10, PluginKey as PluginKey8 } from "prosemirror-state";
 import { Decoration as Decoration4, DecorationSet as DecorationSet4 } from "prosemirror-view";
-var PLACEHOLDER_TEXT2 = "Type to start writing, or press  /  to insert an action.";
 var pluginKey2 = new PluginKey8("placeholder");
 function buildDecorations4(state) {
   const { doc: doc2, selection } = state;
@@ -8399,17 +8431,25 @@ function buildDecorations4(state) {
   }
   const pos = $from.before($from.depth);
   const deco = Decoration4.node(pos, pos + parent.nodeSize, {
-    class: "ab-empty-paragraph",
-    "data-placeholder": PLACEHOLDER_TEXT2
+    class: "ab-empty-paragraph"
   });
   return DecorationSet4.create(doc2, [deco]);
 }
 function createPlaceholderPlugin() {
+  let isEditable = true;
   return {
     name: "placeholder",
     plugins: () => [
-      new Plugin9({
+      new Plugin10({
         key: pluginKey2,
+        view(editorView) {
+          isEditable = editorView.editable;
+          return {
+            update(view) {
+              isEditable = view.editable;
+            }
+          };
+        },
         state: {
           init(_, state) {
             return buildDecorations4(state);
@@ -8423,6 +8463,7 @@ function createPlaceholderPlugin() {
         },
         props: {
           decorations(state) {
+            if (!isEditable) return DecorationSet4.empty;
             return pluginKey2.getState(state) ?? DecorationSet4.empty;
           }
         }
@@ -8455,14 +8496,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 +8583,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 +8652,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 +9074,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 +9106,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 +9201,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 +9223,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 +9256,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 +9342,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 +9390,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 +9639,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 +9651,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 +9718,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 +9887,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 +10192,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 +10215,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 +10261,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 +10276,7 @@ function BlockMenuItem({
               fontWeight: 700,
               fontSize: 12,
               fontFamily: "monospace",
-              color: "#6366f1"
+              color: "#6210CC"
             },
             children: item.shortLabel
           }
@@ -10062,8 +10289,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,14 +10374,22 @@ 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
   );
 }
 
 // src/ui/plugin/inlineSuggestPlugin.ts
-import { Plugin as Plugin10, PluginKey as PluginKey9 } from "prosemirror-state";
+import { Plugin as Plugin11, PluginKey as PluginKey9 } from "prosemirror-state";
 import { Decoration as Decoration5, DecorationSet as DecorationSet5 } from "prosemirror-view";
 var inlineSuggestKey = new PluginKey9("inlineSuggest");
 var DEBOUNCE_MS = 600;
@@ -10152,7 +10398,7 @@ function createInlineSuggestPlugin(provider, endpoint, options) {
   return {
     name: "inlineSuggest",
     plugins: () => [
-      new Plugin10({
+      new Plugin11({
         key: inlineSuggestKey,
         state: {
           init: () => ({ suggestion: null, anchorPos: null }),
@@ -10324,6 +10570,7 @@ export {
   DocumentTreeView,
   EditorShell,
   FloatingMenu,
+  INSERT_LINK_EVENT,
   JUMP_POINT_ADJACENT_SPEC,
   JinjaTreeView,
   SlashCommandMenu,