@sendbird/actionbook-core 0.10.5 → 0.10.7

package/dist/ui/index.js

@@ -55,7 +55,7 @@ var actionbookSchema = new Schema({
     },
     listItem: {
       content: "block+",
-      attrs: { checked: { default: null } },
+      attrs: { checked: { default: null }, value: { default: null } },
       parseDOM: [
         {
           tag: "li",
@@ -63,20 +63,25 @@ var actionbookSchema = new Schema({
             const el = dom;
             const checkbox = el.querySelector('input[type="checkbox"]');
             if (checkbox) {
-              return { checked: checkbox.checked };
+              return { checked: checkbox.checked, value: el.value || null };
             }
             if (el.dataset.checked != null) {
-              return { checked: el.dataset.checked === "true" };
+              return { checked: el.dataset.checked === "true", value: el.value || null };
             }
-            return { checked: null };
+            return { checked: null, value: el.value || null };
           }
         }
       ],
       toDOM(node) {
+        const liAttrs = {};
         if (node.attrs.checked != null) {
-          return ["li", { class: "todo-item", "data-checked": String(node.attrs.checked) }, 0];
+          liAttrs.class = "todo-item";
+          liAttrs["data-checked"] = String(node.attrs.checked);
         }
-        return ["li", 0];
+        if (node.attrs.value != null) {
+          liAttrs.value = String(node.attrs.value);
+        }
+        return Object.keys(liAttrs).length > 0 ? ["li", liAttrs, 0] : ["li", 0];
       },
       defining: true
     },
@@ -1250,7 +1255,7 @@ var RESOURCE_TAG_TYPES = ["tool", "manual", "agent_message_template", "handoff",
 
 // src/compat/prosemirror.ts
 var MAX_DEPTH = 128;
-var ALLOWED_URL_PROTOCOLS = /^(https?:|mailto:|tel:|#|\/)/i;
+var ALLOWED_URL_PROTOCOLS = /^(https?:|mailto:|tel:|#|\/|www\.)/i;
 var LIST_TYPES = /* @__PURE__ */ new Set(["bulletList", "orderedList"]);
 function isLooseList(items) {
   return items.some((li) => {
@@ -1425,6 +1430,10 @@ function convertPMListItem(node, depth = 0) {
   if (typeof checked === "boolean") {
     base.checked = checked;
   }
+  const value = node.attrs?.value;
+  if (value != null) {
+    base.value = value;
+  }
   return base;
 }
 function fromProseMirrorJSON(pmJSON) {
@@ -2055,7 +2064,7 @@ function jumpPointToMarkdown() {
 
 // src/markdown/mdastAdapter.ts
 var MAX_DEPTH2 = 128;
-var ALLOWED_URL_PROTOCOLS2 = /^(https?:|mailto:|tel:|#|\/)/i;
+var ALLOWED_URL_PROTOCOLS2 = /^(https?:|mailto:|tel:|#|\/|www\.)/i;
 function sanitizeUrl(url) {
   if (ALLOWED_URL_PROTOCOLS2.test(url)) return url;
   return "";
@@ -2320,13 +2329,21 @@ function blockToMdast(node, depth = 0) {
       ];
     }
     case "orderedList": {
-      const items = node.content.map((li) => listItemToMdast(li, depth + 1));
+      const spread = node.spread ?? false;
+      let counter = node.start;
+      const items = node.content.map((li) => {
+        const mdastLi = listItemToMdast(li, depth + 1);
+        if (li.value != null) counter = li.value;
+        mdastLi._ordinalValue = counter;
+        counter++;
+        return mdastLi;
+      });
       return [
         {
           type: "list",
           ordered: true,
-          start: node.start,
-          spread: node.spread ?? false,
+          start: node.content[0]?.value ?? node.start,
+          spread,
           children: items
         }
       ];
@@ -2415,10 +2432,24 @@ function linkHandler(node, parent, state, info) {
   const titlePart = title ? ` "${title.replace(/"/g, '\\"')}"` : "";
   return `[${childrenText}](${url}${titlePart})`;
 }
+function listItemHandler(node, parent, state, info) {
+  const value = node._ordinalValue;
+  if (value != null && parent && parent.ordered) {
+    const list = parent;
+    const savedStart = list.start;
+    const idx = list.children.indexOf(node);
+    list.start = value - idx;
+    const result = defaultHandlers3.listItem(node, parent, state, info);
+    list.start = savedStart;
+    return result;
+  }
+  return defaultHandlers3.listItem(node, parent, state, info);
+}
 function serializeToMarkdown(doc2) {
   const mdastTree = toMdast(doc2);
   const raw = toMarkdown(mdastTree, {
     bullet: "-",
+    bulletOrdered: ".",
     rule: "-",
     listItemIndent: "one",
     incrementListMarker: true,
@@ -2434,6 +2465,7 @@ function serializeToMarkdown(doc2) {
     handlers: {
       text: textHandler,
       link: linkHandler,
+      listItem: listItemHandler,
       ...resourceTagToMarkdown().handlers,
       ...jumpPointToMarkdown().handlers
     },
@@ -2444,7 +2476,7 @@ function serializeToMarkdown(doc2) {
 }
 
 // src/ui/bridge/toProseMirrorJSON.ts
-var ALLOWED_URL_PROTOCOLS3 = /^(https?:|mailto:|tel:|#|\/)/i;
+var ALLOWED_URL_PROTOCOLS3 = /^(https?:|mailto:|tel:|#|\/|www\.)/i;
 function assertNever(value) {
   throw new Error(`Unexpected AST node: ${JSON.stringify(value)}`);
 }
@@ -2569,8 +2601,11 @@ function convertBlock2(node) {
         type: "listItem",
         content: node.content.flatMap(convertBlockToArray)
       };
-      if (node.checked != null) {
-        result.attrs = { checked: node.checked };
+      if (node.checked != null || node.value != null) {
+        result.attrs = {
+          ...node.checked != null ? { checked: node.checked } : {},
+          ...node.value != null ? { value: node.value } : {}
+        };
       }
       return result;
     }
@@ -2627,7 +2662,184 @@ function astNodesToJSONContent(nodes) {
   return nodes.flatMap(convertBlockToArray);
 }
 
+// src/ui/styles/editorTextStyles.ts
+var EDITOR_TEXT_STYLES = `
+/* \u2500\u2500 CSS custom properties (override on .ProseMirror to customize) \u2500\u2500 */
+.ProseMirror {
+  /* Font families */
+  --ab-font-heading: 'Gellix', sans-serif;
+  --ab-font-body: 'SF Pro Text', -apple-system, BlinkMacSystemFont, sans-serif;
+  --ab-font-code: 'Roboto Mono', monospace;
+
+  /* Body text */
+  --ab-body-size: 14px;
+  --ab-body-weight: 400;
+  --ab-body-line-height: 20px;
+  --ab-body-letter-spacing: -0.1px;
+  --ab-color-body: #0d0d0d;
+
+  /* H1 */
+  --ab-h1-size: 24px;
+  --ab-h1-weight: 700;
+  --ab-h1-line-height: 32px;
+  --ab-h1-letter-spacing: -0.25px;
+
+  /* H2 */
+  --ab-h2-size: 20px;
+  --ab-h2-weight: 700;
+  --ab-h2-line-height: 24px;
+  --ab-h2-letter-spacing: -0.25px;
+
+  /* H3 */
+  --ab-h3-size: 18px;
+  --ab-h3-weight: 700;
+  --ab-h3-line-height: 24px;
+  --ab-h3-letter-spacing: -0.25px;
+
+  /* Inline code */
+  --ab-code-size: 13px;
+  --ab-code-weight: 400;
+  --ab-code-line-height: 20px;
+  --ab-code-letter-spacing: -0.3px;
+  --ab-code-bg: #ececec;
+  --ab-code-padding: 0 8px;
+  --ab-code-radius: 2px;
+
+  /* Code block */
+  --ab-pre-bg: #ececec;
+  --ab-pre-radius: 4px;
+  --ab-pre-padding: 16px 8px 16px 24px;
+
+  /* Link */
+  --ab-link-color: #6210cc;
+  --ab-link-weight: 500;
+
+  /* Blockquote */
+  --ab-blockquote-border-color: #0d0d0d;
+
+  /* HR */
+  --ab-hr-color: #e0e0e0;
+
+  /* Block spacing */
+  --ab-block-gap: 16px;
+}
+
+/* \u2500\u2500 Base text \u2500\u2500 */
+.ProseMirror {
+  font-family: var(--ab-font-body);
+  font-size: var(--ab-body-size);
+  font-weight: var(--ab-body-weight);
+  line-height: var(--ab-body-line-height);
+  letter-spacing: var(--ab-body-letter-spacing);
+  color: var(--ab-color-body);
+}
+
+.ProseMirror > * + * {
+  margin-top: var(--ab-block-gap);
+}
+
+/* \u2500\u2500 Headings \u2500\u2500 */
+.ProseMirror h1 {
+  font-family: var(--ab-font-heading);
+  font-size: var(--ab-h1-size);
+  font-weight: var(--ab-h1-weight);
+  line-height: var(--ab-h1-line-height);
+  letter-spacing: var(--ab-h1-letter-spacing);
+}
+
+.ProseMirror h2 {
+  font-family: var(--ab-font-heading);
+  font-size: var(--ab-h2-size);
+  font-weight: var(--ab-h2-weight);
+  line-height: var(--ab-h2-line-height);
+  letter-spacing: var(--ab-h2-letter-spacing);
+}
+
+.ProseMirror h3 {
+  font-family: var(--ab-font-heading);
+  font-size: var(--ab-h3-size);
+  font-weight: var(--ab-h3-weight);
+  line-height: var(--ab-h3-line-height);
+  letter-spacing: var(--ab-h3-letter-spacing);
+}
+
+/* \u2500\u2500 Inline code \u2500\u2500 */
+.ProseMirror code {
+  font-family: var(--ab-font-code);
+  font-size: var(--ab-code-size);
+  font-weight: var(--ab-code-weight);
+  line-height: var(--ab-code-line-height);
+  letter-spacing: var(--ab-code-letter-spacing);
+  background: var(--ab-code-bg);
+  padding: var(--ab-code-padding);
+  border-radius: var(--ab-code-radius);
+}
+
+/* \u2500\u2500 Code block \u2500\u2500 */
+.ProseMirror pre {
+  font-family: var(--ab-font-code);
+  font-size: var(--ab-code-size);
+  font-weight: var(--ab-code-weight);
+  line-height: var(--ab-code-line-height);
+  letter-spacing: var(--ab-code-letter-spacing);
+  color: var(--ab-color-body);
+  background: var(--ab-pre-bg);
+  border-radius: var(--ab-pre-radius);
+  padding: var(--ab-pre-padding);
+  overflow-x: auto;
+  white-space: pre;
+}
+
+.ProseMirror pre code {
+  background: transparent;
+  padding: 0;
+  border-radius: 0;
+  font-size: inherit;
+}
+
+/* \u2500\u2500 Link \u2500\u2500 */
+.ProseMirror a {
+  color: var(--ab-link-color);
+  font-weight: var(--ab-link-weight);
+  text-decoration: none;
+}
+
+.ProseMirror a:hover {
+  text-decoration: none;
+}
+
+/* \u2500\u2500 Blockquote \u2500\u2500 */
+.ProseMirror blockquote {
+  border-left: 2px solid var(--ab-blockquote-border-color);
+  border-radius: 0;
+  padding-left: 20px;
+  color: var(--ab-color-body);
+}
+
+/* \u2500\u2500 HR \u2500\u2500 */
+.ProseMirror hr {
+  border: none;
+  height: 1px;
+  background: var(--ab-hr-color);
+  margin: 8px 0;
+}
+`;
+
 // src/ui/hooks/useEditorView.ts
+var TEXT_STYLE_ID = "ab-editor-text-styles";
+var textStyleRefCount = 0;
+function acquireTextStyles() {
+  if (textStyleRefCount++ > 0) return;
+  if (document.getElementById(TEXT_STYLE_ID)) return;
+  const el = document.createElement("style");
+  el.id = TEXT_STYLE_ID;
+  el.textContent = EDITOR_TEXT_STYLES;
+  document.head.appendChild(el);
+}
+function releaseTextStyles() {
+  if (--textStyleRefCount > 0) return;
+  document.getElementById(TEXT_STYLE_ID)?.remove();
+}
 function docToState(doc2, plugins) {
   const pmJSON = doc2 ? toProseMirrorJSON(doc2) : { type: "doc", content: [{ type: "paragraph" }] };
   const pmDoc = PMNode.fromJSON(actionbookSchema, pmJSON);
@@ -2666,17 +2878,20 @@ function useEditorView(config) {
     if (viewInstanceRef.current) {
       viewInstanceRef.current.destroy();
       viewInstanceRef.current = null;
+      releaseTextStyles();
     }
     containerRef.current = container;
     if (!container) {
       forceUpdate((n) => n + 1);
       return;
     }
+    acquireTextStyles();
     const { pmPlugins, nodeViews } = createPluginArray(configRef.current.plugins ?? []);
     const state = docToState(configRef.current.content, pmPlugins);
     const view = new EditorView(container, {
       state,
       nodeViews,
+      attributes: { spellcheck: "false" },
       editable: () => configRef.current.editable === true,
       dispatchTransaction(tr) {
         const newState = view.state.apply(tr);
@@ -2714,8 +2929,11 @@ function useEditorView(config) {
     viewInstanceRef.current?.focus();
   }, []);
   const destroy = useCallback(() => {
-    viewInstanceRef.current?.destroy();
-    viewInstanceRef.current = null;
+    if (viewInstanceRef.current) {
+      viewInstanceRef.current.destroy();
+      viewInstanceRef.current = null;
+      releaseTextStyles();
+    }
   }, []);
   const getView = useCallback(() => viewInstanceRef.current, []);
   return {
@@ -2736,6 +2954,7 @@ import { TextSelection } from "prosemirror-state";
 
 // src/ui/plugin/slashCommandPlugin.ts
 import { Plugin, PluginKey } from "prosemirror-state";
+import { Decoration, DecorationSet } from "prosemirror-view";
 var slashCommandKey = new PluginKey("slashCommand");
 var TRIGGER_RE = /(?:^|\s)(\/[^\s]*)$/;
 function deriveState(state, dismissedFrom) {
@@ -2784,9 +3003,30 @@ function createSlashCommandPlugin() {
         const derived = deriveState(newState, dismissedFrom);
         return { ...derived, _dismissedFrom: dismissedFrom };
       }
+    },
+    props: {
+      decorations(state) {
+        const s = plugin.getState(state);
+        if (!s?.active || !s.range) return DecorationSet.empty;
+        const decos = [
+          // Inline highlight for the slash command text
+          Decoration.inline(s.range.from, s.range.to, {
+            class: "ab-slash-trigger"
+          })
+        ];
+        if (s.query.endsWith(":")) {
+          decos.push(
+            Decoration.widget(s.range.to, () => {
+              const span = document.createElement("span");
+              span.className = "ab-slash-trigger-placeholder";
+              span.textContent = "Type a name";
+              return span;
+            }, { side: 1 })
+          );
+        }
+        return DecorationSet.create(state.doc, decos);
+      }
     }
-    // Expose only the public fields via the key
-    // (InternalState is a superset of SlashCommandState so reads work fine)
   });
   return {
     name: "slashCommand",
@@ -2814,23 +3054,28 @@ var HR_RE = /^([-*_])\1{2,}$/;
 var BULLET_LIST_RE = /^\s*([-*])\s$/;
 var ORDERED_LIST_RE = /^(\d+)\.\s$/;
 var JUMP_POINT_RE2 = /\^([\p{L}\p{N}_-]+)\^$/u;
-var BOLD_STAR_RE = /(?:^|[^*])\*\*([^*]+)\*\*$/;
-var BOLD_UNDER_RE = /(?:^|[^_])__([^_]+)__$/;
-var ITALIC_STAR_RE = /(?:^|[^*])\*([^*]+)\*$/;
-var ITALIC_UNDER_RE = /(?:^|[^_])_([^_]+)_$/;
+var BOLD_RE = /(?:^|[^*])\*\*([^*]+)\*\*$/;
+var ITALIC_RE = /(?:^|[^_])__([^_]+)__$/;
 var STRIKE_RE = /(?:^|[^~])~~([^~]+)~~$/;
 var CODE_RE = /(?:^|[^`])`([^`]+)`$/;
 function findParentList(state, pos) {
   const $pos = state.doc.resolve(pos);
-  const { bulletList: blType, orderedList: olType } = actionbookSchema.nodes;
   for (let d = $pos.depth; d > 0; d--) {
     const node = $pos.node(d);
-    if (node.type === blType || node.type === olType) {
+    const name = node.type.name;
+    if (name === "bulletList" || name === "orderedList") {
       return { depth: d, node };
     }
   }
   return null;
 }
+function isInsideList(state, pos) {
+  const $pos = state.doc.resolve(pos);
+  for (let d = $pos.depth; d > 0; d--) {
+    if ($pos.node(d).type.name === "listItem") return true;
+  }
+  return false;
+}
 var NOOP = /* @__PURE__ */ Symbol("noop");
 function handleListInputRule(state, start, end, listType, attrs) {
   const resolvePos = Math.max(start, end - 1);
@@ -2841,27 +3086,46 @@ function handleListInputRule(state, start, end, listType, attrs) {
   const paraContentSize = $from.parent.content.size;
   const matchedLen = end - start;
   const isMarkerOnly = paraContentSize === matchedLen;
-  if (listNode.type === listType) {
-    if (isMarkerOnly && listType === actionbookSchema.nodes.orderedList && attrs?.start != null) {
-      const newStart = attrs.start;
-      const currentStart = listNode.attrs.start ?? 1;
-      if (newStart !== currentStart) {
-        const listStart = $from.before(listDepth);
+  if (listNode.type.name === listType.name) {
+    if (listType.name === "orderedList" && attrs?.start != null) {
+      const newValue = attrs.start;
+      let liDepth2 = -1;
+      for (let d = $from.depth; d > 0; d--) {
+        if ($from.node(d).type.name === "listItem") {
+          liDepth2 = d;
+          break;
+        }
+      }
+      if (liDepth2 > 0) {
+        const liIndex2 = $from.index(listDepth);
+        const listStartNum = listNode.attrs.start ?? 1;
+        const naturalNumber = listStartNum + liIndex2;
+        const currentValue = $from.node(liDepth2).attrs.value;
+        if (currentValue === newValue || currentValue == null && newValue === naturalNumber) {
+          const tr3 = state.tr.delete(start, end);
+          tr3.setSelection(TextSelection.near(tr3.doc.resolve(tr3.mapping.map(start))));
+          return tr3;
+        }
         const tr2 = state.tr.delete(start, end);
-        tr2.setNodeMarkup(tr2.mapping.map(listStart), void 0, { ...listNode.attrs, start: newStart });
-        tr2.setSelection(TextSelection.near(tr2.doc.resolve(tr2.mapping.map(start))));
-        return tr2;
+        const $afterDelete = tr2.doc.resolve(tr2.mapping.map(resolvePos));
+        for (let d = $afterDelete.depth; d > 0; d--) {
+          if ($afterDelete.node(d).type.name === "listItem") {
+            const pos = $afterDelete.before(d);
+            const node = $afterDelete.node(d);
+            tr2.setNodeMarkup(pos, void 0, { ...node.attrs, value: newValue });
+            tr2.setSelection(TextSelection.near(tr2.doc.resolve(tr2.mapping.map(start))));
+            return tr2;
+          }
+        }
       }
     }
     return NOOP;
   }
-  if (!isMarkerOnly) return NOOP;
-  const { listItem: liType } = actionbookSchema.nodes;
   const tr = state.tr.delete(start, end);
   const $pos = tr.doc.resolve(tr.mapping.map(resolvePos));
   let liDepth = -1;
   for (let d = $pos.depth; d > 0; d--) {
-    if ($pos.node(d).type === liType) {
+    if ($pos.node(d).type.name === "listItem") {
       liDepth = d;
       break;
     }
@@ -2917,9 +3181,16 @@ function createInputRulesPlugin() {
           level: match[1].length
         }))
       );
-      rules.push(wrappingInputRule(BLOCKQUOTE_RE, actionbookSchema.nodes.blockquote));
+      rules.push(
+        new InputRule(BLOCKQUOTE_RE, (state, match, start, end) => {
+          if (isInsideList(state, start)) return null;
+          const fallback = wrappingInputRule(BLOCKQUOTE_RE, actionbookSchema.nodes.blockquote);
+          return fallback.handler(state, match, start, end);
+        })
+      );
       rules.push(
         new InputRule(CODE_BLOCK_RE, (state, match, start, end) => {
+          if (isInsideList(state, start)) return null;
           const language = match[1] || null;
           const $start = state.doc.resolve(start);
           const blockStart = $start.before($start.depth);
@@ -2935,6 +3206,7 @@ function createInputRulesPlugin() {
       );
       rules.push(
         new InputRule(HR_RE, (state, _match, start, end) => {
+          if (isInsideList(state, start)) return null;
           const { horizontalRule: hrType, paragraph: pType } = actionbookSchema.nodes;
           const $start = state.doc.resolve(start);
           const blockStart = $start.before($start.depth);
@@ -2974,9 +3246,29 @@ function createInputRulesPlugin() {
         const fallback = wrappingInputRule(ORDERED_LIST_RE, olType, (m) => ({ start: +m[1] }));
         rules.push(
           new InputRule(ORDERED_LIST_RE, (state, match, start, end) => {
-            const result = handleListInputRule(state, start, end, olType, { start: +match[1] });
-            if (result === NOOP) return null;
-            if (result) return result;
+            const typedNumber = +match[1];
+            const resolvePos = Math.max(start, end - 1);
+            const parentList = findParentList(state, resolvePos);
+            if (parentList) {
+              const { node: listNode } = parentList;
+              if (listNode.type.name === "orderedList") {
+                const tr = state.tr.delete(start, end);
+                const $after = tr.doc.resolve(tr.mapping.map(resolvePos));
+                for (let d = $after.depth; d > 0; d--) {
+                  if ($after.node(d).type.name === "listItem") {
+                    const liPos = $after.before(d);
+                    const liNode = $after.node(d);
+                    tr.setNodeMarkup(liPos, void 0, { ...liNode.attrs, value: typedNumber });
+                    tr.setSelection(TextSelection.near(tr.doc.resolve(tr.mapping.map(start))));
+                    return tr;
+                  }
+                }
+                return null;
+              }
+              const result = handleListInputRule(state, start, end, olType, { start: typedNumber });
+              if (result === NOOP) return null;
+              if (result) return result;
+            }
             const handler = fallback.handler;
             return handler(state, match, start, end);
           })
@@ -2994,10 +3286,8 @@ function createInputRulesPlugin() {
           return tr;
         })
       );
-      rules.push(markInputRule(BOLD_STAR_RE, actionbookSchema.marks.bold, 2));
-      rules.push(markInputRule(BOLD_UNDER_RE, actionbookSchema.marks.bold, 2));
-      rules.push(markInputRule(ITALIC_STAR_RE, actionbookSchema.marks.italic, 1));
-      rules.push(markInputRule(ITALIC_UNDER_RE, actionbookSchema.marks.italic, 1));
+      rules.push(markInputRule(BOLD_RE, actionbookSchema.marks.bold, 2));
+      rules.push(markInputRule(ITALIC_RE, actionbookSchema.marks.italic, 2));
       rules.push(markInputRule(STRIKE_RE, actionbookSchema.marks.strikethrough, 2));
       rules.push(markInputRule(CODE_RE, actionbookSchema.marks.code, 1));
       return rules;
@@ -3020,7 +3310,7 @@ function createHistoryPlugin() {
 
 // src/ui/plugin/keymapPlugin.ts
 import { baseKeymap, chainCommands, newlineInCode, createParagraphNear, liftEmptyBlock, splitBlock, toggleMark, setBlockType, joinBackward } from "prosemirror-commands";
-import { Plugin as Plugin2, TextSelection as TextSelection2 } from "prosemirror-state";
+import { AllSelection, 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";
 
@@ -3417,6 +3707,19 @@ function createEmptyDocGuardPlugin() {
     }
   });
 }
+var selectAllCommand = (state, dispatch) => {
+  const { $from, from, to } = state.selection;
+  const depth = Math.min($from.depth, 1);
+  const blockStart = $from.start(depth);
+  const blockEnd = $from.end(depth);
+  const blockFullySelected = from <= blockStart && to >= blockEnd;
+  if (blockFullySelected) {
+    if (dispatch) dispatch(state.tr.setSelection(new AllSelection(state.doc)));
+    return true;
+  }
+  if (dispatch) dispatch(state.tr.setSelection(TextSelection2.create(state.doc, blockStart, blockEnd)));
+  return true;
+};
 function createKeymapPlugin() {
   return {
     name: "keymapPlugin",
@@ -3426,10 +3729,11 @@ function createKeymapPlugin() {
       "Shift-Tab": shiftTabCommand,
       Enter: enterCommand,
       "Shift-Enter": shiftEnterCommand,
+      "Mod-a": selectAllCommand,
       "Mod-b": toggleMark(boldMark),
       "Mod-i": toggleMark(italicMark),
       "Mod-u": toggleMark(underlineMark),
-      "Mod-Shift-x": toggleMark(strikethroughMark),
+      "Mod-Shift-s": toggleMark(strikethroughMark),
       "Mod-e": toggleMark(codeMark),
       "Mod-Shift-7": wrapInList(bulletList),
       "Mod-Shift-8": wrapInList(orderedList)
@@ -5638,7 +5942,7 @@ function buildDocumentTree(doc2) {
 
 // src/ui/plugin/markdownClipboard.ts
 var key = new PluginKey2("markdownClipboard");
-var MAX_PASTE_LIST_DEPTH = 3;
+var MAX_PASTE_LIST_DEPTH = 15;
 var MAX_FLATTEN_DEPTH = 128;
 function flattenDeepLists(node, listDepth = 0, _recurseDepth = 0) {
   if (_recurseDepth > MAX_FLATTEN_DEPTH) return node;
@@ -5716,13 +6020,47 @@ function textToSlice(text2, view) {
   }
 }
 var URL_RE = /^https?:\/\/[^\s]+$/i;
+var shiftHeld = false;
 function createPlugin() {
   return new Plugin3({
     key,
     props: {
+      handleDOMEvents: {
+        keydown(_view, event) {
+          shiftHeld = event.shiftKey;
+          return false;
+        },
+        keyup() {
+          shiftHeld = false;
+          return false;
+        },
+        paste(view, event) {
+          if (shiftHeld) return false;
+          const clipboardData = event.clipboardData;
+          const text2 = clipboardData?.getData("text/plain");
+          if (!text2 || !URL_RE.test(text2.trim())) return false;
+          const { from, to } = view.state.selection;
+          if (from >= to) return false;
+          const selectedText = view.state.doc.textBetween(from, to);
+          if (!selectedText) return false;
+          event.preventDefault();
+          const linkType = view.state.schema.marks.link;
+          if (!linkType) return false;
+          const linkMark2 = linkType.create({ href: text2.trim() });
+          view.dispatch(view.state.tr.addMark(from, to, linkMark2));
+          return true;
+        }
+      },
       handlePaste(view, event) {
-        const html = event.clipboardData?.getData("text/html");
         const text2 = event.clipboardData?.getData("text/plain");
+        if (shiftHeld) {
+          if (!text2) return false;
+          const textNode = actionbookSchema.text(text2);
+          const slice2 = new Slice(Fragment.from(textNode), 0, 0);
+          view.dispatch(view.state.tr.replaceSelection(slice2));
+          return true;
+        }
+        const html = event.clipboardData?.getData("text/html");
         if (html) {
           const htmlSlice = htmlToSlice(html);
           if (htmlSlice) {
@@ -5784,22 +6122,22 @@ function createMarkdownClipboardPlugin() {
 
 // src/ui/plugin/jumpPointPlugin.ts
 import { Plugin as Plugin4, PluginKey as PluginKey3, TextSelection as TextSelection3 } from "prosemirror-state";
-import { Decoration, DecorationSet } from "prosemirror-view";
+import { Decoration as Decoration2, DecorationSet as DecorationSet2 } from "prosemirror-view";
 var adjacentKey = new PluginKey3("jumpPointAdjacent");
 var JUMP_POINT_ADJACENT_SPEC = { jumpPointAdjacent: true };
 function buildDecorations(state) {
   const { selection } = state;
-  if (!selection.empty) return DecorationSet.empty;
+  if (!selection.empty) return DecorationSet2.empty;
   const cursorPos = selection.$from.pos;
   const decorations = [];
   state.doc.descendants((node, pos) => {
     if (node.type.name !== "jumpPoint") return;
     const nodeEnd = pos + node.nodeSize;
     if (cursorPos === pos || cursorPos === nodeEnd) {
-      decorations.push(Decoration.node(pos, nodeEnd, {}, JUMP_POINT_ADJACENT_SPEC));
+      decorations.push(Decoration2.node(pos, nodeEnd, {}, JUMP_POINT_ADJACENT_SPEC));
     }
   });
-  return DecorationSet.create(state.doc, decorations);
+  return DecorationSet2.create(state.doc, decorations);
 }
 var jumpPointEditKey = new PluginKey3("jumpPointEdit");
 var JUMP_POINT_FULL_RE = /^\^([\p{L}\p{N}_-]+)\^$/u;
@@ -5930,7 +6268,8 @@ function createJumpPointAdjacentPlugin() {
 }
 
 // src/ui/plugin/jumpPointNodeViewPlugin.tsx
-import { useCallback as useCallback2, useState as useState2 } from "react";
+import { useCallback as useCallback2, useRef as useRef2, useState as useState2 } from "react";
+import { createPortal } from "react-dom";
 import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 function IconDiamondAlert({ size = 12, fill = "#D9352C" }) {
   return /* @__PURE__ */ jsxs3("svg", { width: size, height: size, viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
@@ -5958,9 +6297,7 @@ var JUMP_POINT_STYLE = {
   // are set via CSS class .ab-jump-point for heading-level overrides
 };
 var JUMP_POINT_ADJACENT_STYLE = {
-  ...JUMP_POINT_STYLE,
-  backgroundColor: "#FFE680",
-  borderColor: "#FF9500"
+  ...JUMP_POINT_STYLE
 };
 var JUMP_POINT_DUPLICATE_STYLE = {
   ...JUMP_POINT_STYLE,
@@ -5989,64 +6326,71 @@ var CLOSE_BTN_STYLE = {
   lineHeight: 1
 };
 var TOOLTIP_STYLE = {
-  position: "absolute",
-  bottom: "calc(100% + 8px)",
-  left: "50%",
-  transform: "translateX(-50%)",
+  position: "fixed",
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "flex-start",
+  alignSelf: "stretch",
+  padding: "16px 20px",
   backgroundColor: "#fff",
   border: "1px solid #CCC",
   borderRadius: "4px",
   boxShadow: "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)",
-  padding: "16px 20px",
   fontSize: "14px",
   lineHeight: "20px",
   color: "#0D0D0D",
   maxWidth: "240px",
-  zIndex: 100,
+  zIndex: 1100,
   pointerEvents: "none"
 };
-function JumpPointNodeViewComponent({ node, view, getPos, decorations }) {
+var TOOLTIP_ARROW_STYLE = {
+  position: "absolute",
+  bottom: "-6px",
+  left: "50%",
+  transform: "translateX(-50%) rotate(45deg)",
+  width: "10px",
+  height: "10px",
+  backgroundColor: "#fff",
+  border: "1px solid #CCC",
+  borderTop: "none",
+  borderLeft: "none"
+};
+function JumpPointNodeViewComponent({ node, decorations }) {
   const id = node.attrs.id;
   const isAdjacent = decorations?.some((d) => d.spec?.jumpPointAdjacent === true) ?? false;
   const isDuplicate = decorations?.some((d) => d.spec?.jumpPointDuplicate === true) ?? false;
   const [showTooltip, setShowTooltip] = useState2(false);
-  const handleDelete2 = useCallback2(() => {
-    const pos = getPos();
-    if (pos == null) return;
-    const tr = view.state.tr.delete(pos, pos + node.nodeSize);
-    view.dispatch(tr);
-    view.focus();
-  }, [view, getPos, node.nodeSize]);
+  const spanRef = useRef2(null);
+  const [tooltipPos, setTooltipPos] = useState2(null);
+  const handleMouseEnter = useCallback2(() => {
+    if (!spanRef.current) return;
+    const rect = spanRef.current.getBoundingClientRect();
+    setTooltipPos({ top: rect.top - 8, left: rect.left + rect.width / 2 });
+    setShowTooltip(true);
+  }, []);
   if (isDuplicate) {
     return /* @__PURE__ */ jsxs3(
       "span",
       {
+        ref: spanRef,
         className: "ab-jump-point ab-jump-point-duplicate",
-        style: { ...JUMP_POINT_DUPLICATE_STYLE, position: "relative" },
+        style: JUMP_POINT_DUPLICATE_STYLE,
         id: `jp-${id}`,
-        onMouseEnter: () => setShowTooltip(true),
+        onMouseEnter: handleMouseEnter,
         onMouseLeave: () => setShowTooltip(false),
         children: [
           /* @__PURE__ */ jsx4("span", { className: "ab-jp-icon", children: /* @__PURE__ */ jsx4(IconAnchor, { size: 12, fill: "#9D091E", style: { paddingLeft: "2px", flexShrink: 0 } }) }),
           /* @__PURE__ */ jsx4("span", { className: "ab-jp-label", style: LABEL_STYLE, children: id }),
-          /* @__PURE__ */ jsx4(
-            "button",
-            {
-              style: CLOSE_BTN_STYLE,
-              onMouseDown: (e) => {
-                e.preventDefault();
-                e.stopPropagation();
-                handleDelete2();
-              },
-              title: "Remove duplicate anchor",
-              children: /* @__PURE__ */ jsx4(IconDiamondAlert, { size: 12, fill: "#D9352C" })
-            }
-          ),
-          showTooltip && /* @__PURE__ */ jsxs3("span", { style: TOOLTIP_STYLE, children: [
-            "\u201C",
-            id,
-            "\u201D is already used as an anchor"
-          ] })
+          /* @__PURE__ */ jsx4("span", { style: { ...CLOSE_BTN_STYLE, cursor: "default" }, children: /* @__PURE__ */ jsx4(IconDiamondAlert, { size: 12, fill: "#D9352C" }) }),
+          showTooltip && tooltipPos && createPortal(
+            /* @__PURE__ */ jsxs3("span", { style: { ...TOOLTIP_STYLE, top: tooltipPos.top, left: tooltipPos.left, transform: "translate(-50%, -100%)" }, children: [
+              "\u201C",
+              id,
+              "\u201D is already used as an anchor",
+              /* @__PURE__ */ jsx4("span", { style: TOOLTIP_ARROW_STYLE })
+            ] }),
+            document.body
+          )
         ]
       }
     );
@@ -6073,7 +6417,7 @@ function createJumpPointNodeViewPlugin() {
 
 // src/ui/plugin/jumpPointValidationPlugin.ts
 import { Plugin as Plugin5, PluginKey as PluginKey4 } from "prosemirror-state";
-import { Decoration as Decoration2, DecorationSet as DecorationSet2 } from "prosemirror-view";
+import { Decoration as Decoration3, DecorationSet as DecorationSet3 } from "prosemirror-view";
 var pluginKey = new PluginKey4("jumpPointValidation");
 function collectJumpPointIds(state) {
   const ids = /* @__PURE__ */ new Set();
@@ -6139,40 +6483,104 @@ function createJumpPointValidationPlugin() {
         },
         props: {
           decorations(state) {
-            return pluginKey.getState(state) ?? DecorationSet2.empty;
+            return pluginKey.getState(state) ?? DecorationSet3.empty;
           }
         }
       })
     ]
   };
 }
+function createBrokenRefIcon(refId) {
+  const wrapper = document.createElement("span");
+  wrapper.style.cssText = "position: relative; display: inline-flex; align-items: center; cursor: help;";
+  wrapper.contentEditable = "false";
+  const ns = "http://www.w3.org/2000/svg";
+  const svg = document.createElementNS(ns, "svg");
+  svg.setAttribute("width", "14");
+  svg.setAttribute("height", "14");
+  svg.setAttribute("viewBox", "0 0 16 16");
+  svg.setAttribute("fill", "none");
+  const path = document.createElementNS(ns, "path");
+  path.setAttribute("fill-rule", "evenodd");
+  path.setAttribute("clip-rule", "evenodd");
+  path.setAttribute("d", "M8.00002 0.666626L15.3334 7.99996L8.00002 15.3333L0.666687 7.99996L8.00002 0.666626ZM7.33335 8.66663V4.66663H8.66669V8.66663H7.33335ZM8.00002 11.3333C8.46026 11.3333 8.83335 10.9602 8.83335 10.5C8.83335 10.0397 8.46026 9.66663 8.00002 9.66663C7.53978 9.66663 7.16669 10.0397 7.16669 10.5C7.16669 10.9602 7.53978 11.3333 8.00002 11.3333Z");
+  path.setAttribute("fill", "#D9352C");
+  svg.appendChild(path);
+  const iconSpan = document.createElement("span");
+  iconSpan.style.cssText = "display: inline-flex; margin-left: 2px; vertical-align: middle;";
+  iconSpan.appendChild(svg);
+  const tooltip = document.createElement("span");
+  tooltip.textContent = `Anchor "${refId}" no longer exists`;
+  tooltip.style.cssText = [
+    "display:none",
+    "position:fixed",
+    "z-index:1100",
+    "pointer-events:none",
+    "padding:16px 20px",
+    "background:#fff",
+    "border:1px solid #CCC",
+    "border-radius:4px",
+    "box-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)",
+    "font-size:14px",
+    "line-height:20px",
+    "color:#0D0D0D",
+    "max-width:240px",
+    "white-space:normal"
+  ].join(";");
+  const arrow = document.createElement("span");
+  arrow.style.cssText = [
+    "position:absolute",
+    "bottom:-6px",
+    "left:50%",
+    "transform:translateX(-50%) rotate(45deg)",
+    "width:10px",
+    "height:10px",
+    "background:#fff",
+    "border:1px solid #CCC",
+    "border-top:none",
+    "border-left:none"
+  ].join(";");
+  tooltip.appendChild(arrow);
+  wrapper.addEventListener("mouseenter", () => {
+    const rect = wrapper.getBoundingClientRect();
+    tooltip.style.left = `${rect.left + rect.width / 2}px`;
+    tooltip.style.top = `${rect.top - 8}px`;
+    tooltip.style.transform = "translate(-50%, -100%)";
+    tooltip.style.display = "flex";
+    tooltip.style.flexDirection = "column";
+    tooltip.style.alignItems = "flex-start";
+    document.body.appendChild(tooltip);
+  });
+  wrapper.addEventListener("mouseleave", () => {
+    tooltip.style.display = "none";
+    if (tooltip.parentElement === document.body) document.body.removeChild(tooltip);
+  });
+  wrapper.appendChild(iconSpan);
+  return wrapper;
+}
 function buildDecorations2(state) {
   const decos = [];
   const duplicates = findDuplicatePositions(state);
   for (const { pos, size } of duplicates) {
     decos.push(
-      Decoration2.node(pos, pos + size, { class: "jump-point-duplicate" }, { jumpPointDuplicate: true })
+      Decoration3.node(pos, pos + size, { class: "jump-point-duplicate" }, { jumpPointDuplicate: true })
     );
   }
   const existingIds = collectJumpPointIds(state);
   const brokenRefs = findBrokenAnchorRefs(state, existingIds);
   for (const { from, to, refId } of brokenRefs) {
     decos.push(
-      Decoration2.inline(from, to, {
+      Decoration3.inline(from, to, {
         class: "broken-anchor-ref",
         "data-broken-ref": refId,
-        title: `Anchor "${refId}" no longer exists`,
-        style: "color: #D9352C; font-weight: 500; text-decoration: none;"
+        spellcheck: "false",
+        style: "color: #D9352C; font-weight: 500; text-decoration: none !important; text-decoration-line: none !important;"
       })
     );
-    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 }));
+    decos.push(Decoration3.widget(to, () => createBrokenRefIcon(refId), { side: -1 }));
   }
-  if (decos.length === 0) return DecorationSet2.empty;
-  return DecorationSet2.create(state.doc, decos);
+  if (decos.length === 0) return DecorationSet3.empty;
+  return DecorationSet3.create(state.doc, decos);
 }
 
 // src/ui/plugin/inlineToolTagNodeViewPlugin.tsx
@@ -6246,7 +6654,7 @@ function createInlineToolTagNodeViewPlugin() {
 
 // src/ui/plugin/jinjaDecoration.ts
 import { Plugin as Plugin6, PluginKey as PluginKey5 } from "prosemirror-state";
-import { Decoration as Decoration3, DecorationSet as DecorationSet3 } from "prosemirror-view";
+import { Decoration as Decoration4, DecorationSet as DecorationSet4 } from "prosemirror-view";
 var jinjaPluginKey = new PluginKey5("jinjaDecoration");
 var JINJA_TAG_RE = /\{%\s*(if|elif|else|endif)\s*([^%]*?)\s*%\}/g;
 function getBlockPositions(doc2) {
@@ -6269,7 +6677,7 @@ function addInlineChipDecorations(doc2, decorations) {
       const to = from + match[0].length;
       const keyword = match[1];
       decorations.push(
-        Decoration3.inline(from, to, {
+        Decoration4.inline(from, to, {
           class: `jinja-chip jinja-chip-${keyword}`
         })
       );
@@ -6310,7 +6718,7 @@ function addStructureBorderDecorations(doc2, blocks, decorations) {
       const classes = ["jinja-bar", `jinja-bar-${branchType}`];
       if (i === first || prevType !== branchType) classes.push("jinja-bar-first");
       if (i === last || nextType !== branchType) classes.push("jinja-bar-last");
-      decorations.push(Decoration3.node(block.from, block.to, { class: classes.join(" ") }));
+      decorations.push(Decoration4.node(block.from, block.to, { class: classes.join(" ") }));
     }
   }
 }
@@ -6326,13 +6734,13 @@ function hasJinjaTags(doc2) {
   return found;
 }
 function buildDecorations3(doc2) {
-  if (!hasJinjaTags(doc2)) return DecorationSet3.empty;
+  if (!hasJinjaTags(doc2)) return DecorationSet4.empty;
   const blocks = getBlockPositions(doc2);
   const decorations = [];
   addInlineChipDecorations(doc2, decorations);
   addStructureBorderDecorations(doc2, blocks, decorations);
-  if (decorations.length === 0) return DecorationSet3.empty;
-  return DecorationSet3.create(doc2, decorations);
+  if (decorations.length === 0) return DecorationSet4.empty;
+  return DecorationSet4.create(doc2, decorations);
 }
 function createJinjaDecorationPlugin() {
   return {
@@ -6360,7 +6768,7 @@ function createJinjaDecorationPlugin() {
 }
 
 // src/ui/plugin/jinjaIfBlockPlugin.tsx
-import { useEffect as useEffect2, useRef as useRef2, useState as useState3 } from "react";
+import { useEffect as useEffect2, useRef as useRef3, useState as useState3 } from "react";
 import { createRoot as createRoot2 } from "react-dom/client";
 import { Plugin as Plugin7, TextSelection as TextSelection4 } from "prosemirror-state";
 import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
@@ -6377,7 +6785,9 @@ var JINJA_STYLES = `
   display: grid;
   grid-template-areas:
     "header"
+    "error"
     "body"
+    "body-error"
     "footer";
   gap: 0;
 }
@@ -6467,6 +6877,7 @@ var JINJA_STYLES = `
 }
 
 .jinja-condition-error {
+  grid-area: error;
   display: flex;
   align-items: center;
   padding: 4px 0 4px 52px;
@@ -6475,6 +6886,16 @@ var JINJA_STYLES = `
   line-height: 16px;
 }
 
+.jinja-body-error {
+  grid-area: body-error;
+  display: flex;
+  align-items: center;
+  padding: 0 0 4px 52px;
+  color: #D9352C;
+  font-size: 12px;
+  line-height: 16px;
+}
+
 .jinja-token-variable {
   color: #4141B2;
 }
@@ -6787,60 +7208,18 @@ function deleteBranch(view, nodePos, branchType) {
   const context = getBranchContext(view, nodePos);
   if (!context) return false;
   const { branchNode, branchPos, branchIndex, blockNode, blockPos } = context;
-  const branchContent = branchNode.content;
   if (branchType === "if") {
-    if (blockNode.childCount === 1) {
-      const tr2 = view.state.tr;
-      if (isBranchBodyEmpty(branchNode)) {
-        tr2.replaceWith(blockPos, blockPos + blockNode.nodeSize, view.state.schema.nodes.paragraph.create());
-        tr2.setSelection(TextSelection4.near(tr2.doc.resolve(blockPos)));
-      } else {
-        tr2.replaceWith(blockPos, blockPos + blockNode.nodeSize, branchContent);
-        tr2.setSelection(TextSelection4.near(tr2.doc.resolve(blockPos)));
-      }
-      view.dispatch(tr2.scrollIntoView());
-      view.focus();
-      return true;
-    }
-    const nextBranch = blockNode.child(branchIndex + 1);
-    const promotedCondition = typeof nextBranch.attrs.condition === "string" ? nextBranch.attrs.condition : "";
-    const tr = view.state.tr;
-    if (!isBranchBodyEmpty(branchNode)) {
-      const nextBranchPos = branchPos + branchNode.nodeSize;
-      const nextBranchContentStart = nextBranchPos + 1;
-      for (let i = branchContent.childCount - 1; i >= 0; i--) {
-        tr.insert(nextBranchContentStart, branchContent.child(i));
-      }
-    }
-    const mappedBranchPos = tr.mapping.map(branchPos);
-    const mappedBranchEnd = tr.mapping.map(branchPos + branchNode.nodeSize);
-    tr.delete(mappedBranchPos, mappedBranchEnd);
-    tr.setNodeMarkup(mappedBranchPos, void 0, {
-      ...nextBranch.attrs,
-      branchType: "if",
-      condition: promotedCondition
-    });
-    view.dispatch(tr.scrollIntoView());
+    const tr2 = view.state.tr;
+    tr2.replaceWith(blockPos, blockPos + blockNode.nodeSize, view.state.schema.nodes.paragraph.create());
+    tr2.setSelection(TextSelection4.near(tr2.doc.resolve(blockPos)));
+    view.dispatch(tr2.scrollIntoView());
     view.focus();
     return true;
   }
-  if (!isBranchBodyEmpty(branchNode) && branchIndex > 0) {
-    const prevBranch = blockNode.child(branchIndex - 1);
-    const prevBranchPos = branchPos - prevBranch.nodeSize;
-    const prevBranchContentEnd = prevBranchPos + prevBranch.nodeSize - 1;
-    const tr = view.state.tr;
-    for (let i = 0; i < branchContent.childCount; i++) {
-      tr.insert(prevBranchContentEnd + i, branchContent.child(i));
-    }
-    const mappedBranchPos = tr.mapping.map(branchPos);
-    const mappedBranchEnd = tr.mapping.map(branchPos + branchNode.nodeSize);
-    tr.delete(mappedBranchPos, mappedBranchEnd);
-    tr.setSelection(TextSelection4.near(tr.doc.resolve(tr.mapping.map(prevBranchContentEnd)), -1));
-    view.dispatch(tr.scrollIntoView());
-    view.focus();
-    return true;
-  }
-  view.dispatch(view.state.tr.delete(branchPos, branchPos + branchNode.nodeSize).scrollIntoView());
+  const tr = view.state.tr;
+  tr.delete(branchPos, branchPos + branchNode.nodeSize);
+  tr.setSelection(TextSelection4.near(tr.doc.resolve(tr.mapping.map(branchPos)), -1));
+  view.dispatch(tr.scrollIntoView());
   view.focus();
   return true;
 }
@@ -6865,8 +7244,8 @@ function ConditionDisplay({
 }) {
   const [isEditing, setIsEditing] = useState3(false);
   const [draftValue, setDraftValue] = useState3(condition);
-  const inputRef = useRef2(null);
-  const autoFocusedRef = useRef2(false);
+  const inputRef = useRef3(null);
+  const autoFocusedRef = useRef3(false);
   useEffect2(() => {
     if (!isEditing) {
       setDraftValue(condition);
@@ -6888,11 +7267,11 @@ function ConditionDisplay({
     return /* @__PURE__ */ jsx6("span", { className: "jinja-otherwise", children: "Otherwise" });
   }
   const commit = () => {
-    setIsEditing(false);
-    onConditionBlur?.();
     if (draftValue !== condition) {
       onConditionChange(draftValue);
     }
+    setIsEditing(false);
+    onConditionBlur?.();
   };
   const cancel = () => {
     setDraftValue(condition);
@@ -6976,6 +7355,8 @@ function JinjaBranchHeader({
   branchType,
   condition,
   editable = true,
+  isBodyEmpty,
+  isBodyTouched,
   onConditionChange,
   onDelete,
   onAddBranch,
@@ -6983,8 +7364,8 @@ function JinjaBranchHeader({
   hasElseBranch
 }) {
   const [menuSource, setMenuSource] = useState3(null);
-  const kebabRef = useRef2(null);
-  const footerRef = useRef2(null);
+  const kebabRef = useRef3(null);
+  const footerRef = useRef3(null);
   useEffect2(() => {
     if (!menuSource) return;
     const handlePointerDown = (event) => {
@@ -7008,24 +7389,9 @@ function JinjaBranchHeader({
     };
   }, [menuSource]);
   const menuItems = [];
-  const isOnlyIfBranch = branchType === "if" && isLastBranch && !hasElseBranch;
-  const canAddElif = editable && branchType !== "else" && (branchType === "elif" || isLastBranch);
-  const canAddElse = editable && branchType !== "else" && isLastBranch && !hasElseBranch;
-  if (canAddElif) {
-    menuItems.push({
-      label: "Else if",
-      onSelect: () => onAddBranch("elif")
-    });
-  }
-  if (canAddElse) {
-    menuItems.push({
-      label: "Else",
-      onSelect: () => onAddBranch("else")
-    });
-  }
   if (editable) {
     menuItems.push({
-      label: isOnlyIfBranch ? "Delete all" : "Delete",
+      label: "Delete",
       onSelect: onDelete
     });
   }
@@ -7090,6 +7456,7 @@ function JinjaBranchHeader({
       ] }) : null
     ] }),
     conditionError && /* @__PURE__ */ jsx6("div", { className: "jinja-condition-error", children: conditionError }),
+    isBodyEmpty && isBodyTouched && editable && /* @__PURE__ */ jsx6("div", { className: "jinja-body-error", children: "This field is required." }),
     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",
@@ -7155,6 +7522,7 @@ var JinjaIfBranchView = class {
   node;
   view;
   getPos;
+  bodyTouched = false;
   constructor(node, view, getPos) {
     this.node = node;
     this.view = view;
@@ -7179,6 +7547,12 @@ var JinjaIfBranchView = class {
     this.contentDOM.setAttribute("data-placeholder", PLACEHOLDER_TEXT);
     body.appendChild(dividerColumn);
     body.appendChild(this.contentDOM);
+    this.contentDOM.addEventListener("focusout", () => {
+      if (!this.bodyTouched && isBranchBodyEmpty(this.node)) {
+        this.bodyTouched = true;
+        this.render();
+      }
+    });
     this.root = createRoot2(this.headerContainer);
     this._onSiblingsChanged = () => this.render();
     this.dom.addEventListener("jinja-siblings-changed", this._onSiblingsChanged);
@@ -7226,6 +7600,8 @@ var JinjaIfBranchView = class {
           branchType,
           condition,
           editable: this.view.editable && this.view.dom.getAttribute("contenteditable") !== "false",
+          isBodyEmpty: isBranchBodyEmpty(this.node),
+          isBodyTouched: this.bodyTouched,
           isLastBranch: showAddButton,
           hasElseBranch: context && nodePos != null ? getElseBranch(this.view, nodePos) : false,
           onConditionChange: (value) => {
@@ -8326,6 +8702,7 @@ function createDragHandlePlugin() {
 }
 
 // src/ui/plugin/todoNodeViewPlugin.tsx
+import { Plugin as Plugin10 } from "prosemirror-state";
 function createCheckboxDOM(checked) {
   const el = document.createElement("span");
   el.contentEditable = "false";
@@ -8408,14 +8785,63 @@ var TodoListItemView = class {
     return true;
   }
 };
+function createListItemValueResetPlugin() {
+  return new Plugin10({
+    appendTransaction(trs, oldState, newState) {
+      if (!trs.some((tr2) => tr2.docChanged)) return null;
+      const oldCount = oldState.doc.childCount;
+      let hasNewListItems = false;
+      newState.doc.descendants((node) => {
+        if (hasNewListItems) return false;
+        if (node.type.name === "listItem" && node.attrs.value != null) {
+          hasNewListItems = true;
+        }
+      });
+      if (!hasNewListItems) return null;
+      let tr = newState.tr;
+      let changed = false;
+      newState.doc.descendants((node, pos) => {
+        if (node.type.name !== "orderedList") return;
+        let prevValue = null;
+        node.forEach((li, offset) => {
+          const liValue = li.attrs.value;
+          if (liValue != null && liValue === prevValue) {
+            const liPos = pos + 1 + offset;
+            tr = tr.setNodeMarkup(liPos, void 0, { ...li.attrs, value: null });
+            changed = true;
+          }
+          prevValue = liValue;
+        });
+      });
+      return changed ? tr : null;
+    }
+  });
+}
 function createTodoNodeViewPlugin() {
   return {
     name: "todoNodeView",
+    plugins: () => [createListItemValueResetPlugin()],
     nodeViews: () => ({
       listItem: ((node, view, getPos) => {
         if (node.attrs.checked == null) {
           const li = document.createElement("li");
-          return { dom: li, contentDOM: li };
+          if (node.attrs.value != null) {
+            li.value = node.attrs.value;
+          }
+          return {
+            dom: li,
+            contentDOM: li,
+            update(updatedNode) {
+              if (updatedNode.type.name !== "listItem") return false;
+              if (updatedNode.attrs.checked != null) return false;
+              if (updatedNode.attrs.value != null) {
+                li.value = updatedNode.attrs.value;
+              } else {
+                li.removeAttribute("value");
+              }
+              return true;
+            }
+          };
         }
         return new TodoListItemView(node, view, getPos);
       })
@@ -8424,35 +8850,36 @@ function createTodoNodeViewPlugin() {
 }
 
 // src/ui/plugin/placeholderPlugin.ts
-import { Plugin as Plugin10, PluginKey as PluginKey8 } from "prosemirror-state";
-import { Decoration as Decoration4, DecorationSet as DecorationSet4 } from "prosemirror-view";
+import { Plugin as Plugin11, PluginKey as PluginKey8 } from "prosemirror-state";
+import { Decoration as Decoration5, DecorationSet as DecorationSet5 } from "prosemirror-view";
 var pluginKey2 = new PluginKey8("placeholder");
 function buildDecorations4(state) {
   const { doc: doc2, selection } = state;
-  if (!selection.empty) return DecorationSet4.empty;
+  if (!selection.empty) return DecorationSet5.empty;
   const $from = selection.$from;
   const parent = $from.parent;
   if (parent.type.name !== "paragraph" || parent.content.size !== 0) {
-    return DecorationSet4.empty;
+    return DecorationSet5.empty;
   }
   const EXCLUDED_ANCESTORS = /* @__PURE__ */ new Set(["noteBlock", "blockquote", "jinjaIfBranch"]);
   for (let d = $from.depth - 1; d > 0; d--) {
     if (EXCLUDED_ANCESTORS.has($from.node(d).type.name)) {
-      return DecorationSet4.empty;
+      return DecorationSet5.empty;
     }
   }
   const pos = $from.before($from.depth);
-  const deco = Decoration4.node(pos, pos + parent.nodeSize, {
-    class: "ab-empty-paragraph"
+  const deco = Decoration5.node(pos, pos + parent.nodeSize, {
+    class: "ab-empty-paragraph",
+    "data-placeholder": "Type to start writing, or press / to insert an action."
   });
-  return DecorationSet4.create(doc2, [deco]);
+  return DecorationSet5.create(doc2, [deco]);
 }
 function createPlaceholderPlugin() {
   let isEditable = true;
   return {
     name: "placeholder",
     plugins: () => [
-      new Plugin10({
+      new Plugin11({
         key: pluginKey2,
         view(editorView) {
           isEditable = editorView.editable;
@@ -8475,8 +8902,8 @@ function createPlaceholderPlugin() {
         },
         props: {
           decorations(state) {
-            if (!isEditable) return DecorationSet4.empty;
-            return pluginKey2.getState(state) ?? DecorationSet4.empty;
+            if (!isEditable) return DecorationSet5.empty;
+            return pluginKey2.getState(state) ?? DecorationSet5.empty;
           }
         }
       })
@@ -8485,8 +8912,8 @@ function createPlaceholderPlugin() {
 }
 
 // src/ui/components/SlashCommandMenu.tsx
-import React4, { useEffect as useEffect3, useLayoutEffect, useRef as useRef3, useState as useState4 } from "react";
-import { createPortal } from "react-dom";
+import React4, { useEffect as useEffect3, useLayoutEffect, useRef as useRef4, useState as useState4 } from "react";
+import { createPortal as createPortal2 } from "react-dom";
 import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
 function filterItems(items, query) {
   if (!query) return items;
@@ -8513,7 +8940,7 @@ function injectScrollbarStyle() {
 `;
   document.head.appendChild(style);
 }
-var POPUP_SHADOW = "0 0 0 1px #CCCCCC, 0 4px 16px rgba(0, 0, 0, 0.12)";
+var POPUP_SHADOW = "0 3px 5px -3px rgba(13,13,13,0.04), 0 3px 14px 2px rgba(13,13,13,0.08), 0 8px 10px 1px rgba(13,13,13,0.12)";
 var BTN_RESET = {
   border: "none",
   padding: 0,
@@ -8530,7 +8957,7 @@ var MENU_WIDTH = 440;
 var MAX_MENU_H = 400;
 function SlashCommandMenu({ view, editorState, items }) {
   const [selectedIndex, setSelectedIndex] = useState4(0);
-  const listRef = useRef3(null);
+  const listRef = useRef4(null);
   useLayoutEffect(() => {
     injectScrollbarStyle();
   }, []);
@@ -8549,7 +8976,7 @@ function SlashCommandMenu({ view, editorState, items }) {
     item?.scrollIntoView({ block: "nearest" });
   }, [selectedIndex]);
   useEffect3(() => {
-    if (!active || !view) return;
+    if (!active || !view || filtered.length === 0) return;
     const onKeyDown = (e) => {
       if (e.key === "ArrowDown") {
         e.preventDefault();
@@ -8571,66 +8998,76 @@ function SlashCommandMenu({ view, editorState, items }) {
           view.focus();
         }
       }
+      if (e.key === "Escape") {
+        e.preventDefault();
+        e.stopPropagation();
+        if (range) {
+          view.dispatch(view.state.tr.delete(range.from, range.to));
+        }
+        view.focus();
+      }
     };
     document.addEventListener("keydown", onKeyDown, true);
     return () => document.removeEventListener("keydown", onKeyDown, true);
   }, [active, view, filtered, selectedIndex, range]);
-  if (!active || !view || !range) return null;
-  const coords = view.coordsAtPos(range.from);
-  let top = coords.bottom + 4;
-  let left = coords.left;
-  left = Math.max(VPORT_MARGIN, Math.min(left, window.innerWidth - MENU_WIDTH - VPORT_MARGIN));
-  if (top + MAX_MENU_H > window.innerHeight - VPORT_MARGIN) {
-    top = coords.top - MAX_MENU_H - 4;
-  }
-  return createPortal(
+  const [menuPos, setMenuPos] = useState4(null);
+  const menuRef = useRef4(null);
+  useLayoutEffect(() => {
+    if (!active || !view || !range || filtered.length === 0) {
+      setMenuPos(null);
+      return;
+    }
+    try {
+      const coords = view.coordsAtPos(range.to);
+      let left = coords.left;
+      left = Math.max(VPORT_MARGIN, Math.min(left, window.innerWidth - MENU_WIDTH - VPORT_MARGIN));
+      const menuHeight = menuRef.current?.offsetHeight ?? MAX_MENU_H;
+      let top = coords.bottom + 4;
+      if (top + menuHeight > window.innerHeight - VPORT_MARGIN) {
+        top = coords.top - menuHeight - 4;
+      }
+      setMenuPos({ top, left });
+    } catch {
+    }
+  });
+  if (!active || !view || !range || filtered.length === 0 || !menuPos) return null;
+  return createPortal2(
     /* @__PURE__ */ jsx7(
       "div",
       {
+        ref: menuRef,
         className: "ab-slash-menu",
         style: {
           position: "fixed",
-          top,
-          left,
+          top: menuPos.top,
+          left: menuPos.left,
           width: MENU_WIDTH,
           maxHeight: MAX_MENU_H,
           overflowY: "auto",
           background: "#fff",
-          borderRadius: 8,
+          borderRadius: 4,
           boxShadow: POPUP_SHADOW,
-          padding: "4px",
+          padding: "8px 0",
           zIndex: 1100,
           animation: "ab-float-in 0.12s ease"
         },
-        children: /* @__PURE__ */ jsx7("div", { ref: listRef, children: filtered.length === 0 ? /* @__PURE__ */ jsx7(
-          "div",
-          {
-            style: {
-              padding: "8px 12px",
-              fontSize: 13,
-              color: "#9ca3af"
-            },
-            children: "No results"
-          }
-        ) : filtered.map((item, i) => {
+        children: /* @__PURE__ */ jsx7("div", { ref: listRef, children: filtered.map((item, i) => {
           const prevGroup = i > 0 ? filtered[i - 1].group : void 0;
           const showGroupHeader = item.group && item.group !== prevGroup;
           return /* @__PURE__ */ jsxs6(React4.Fragment, { children: [
-            showGroupHeader && /* @__PURE__ */ jsxs6(Fragment3, { children: [
-              i > 0 && /* @__PURE__ */ jsx7("div", { style: { height: 1, background: "rgba(0,0,0,0.06)", margin: "4px 10px" } }),
-              /* @__PURE__ */ jsx7(
-                "div",
-                {
-                  style: {
-                    padding: "8px 16px 4px",
-                    fontSize: 13,
-                    fontWeight: 400,
-                    color: "#5e5e5e"
-                  },
-                  children: item.group
-                }
-              )
-            ] }),
+            showGroupHeader && /* @__PURE__ */ jsx7(Fragment3, { children: /* @__PURE__ */ jsx7(
+              "div",
+              {
+                style: {
+                  padding: "16px 16px 4px",
+                  fontSize: 12,
+                  fontWeight: 600,
+                  lineHeight: "12px",
+                  color: "#858585"
+                },
+                children: item.group
+              }
+            ) }),
             /* @__PURE__ */ jsx7(
               SlashMenuItem,
               {
@@ -8664,20 +9101,22 @@ function SlashMenuItem({ item, index, selected, onMouseEnter, onMouseDown }) {
         display: "flex",
         alignItems: "center",
         gap: 12,
-        padding: "6px 8px",
-        background: selected ? "rgba(0, 0, 0, 0.04)" : "transparent",
+        padding: "6px 16px",
+        background: selected ? "rgba(13, 13, 13, 0.04)" : "transparent",
         transition: "background 0.08s"
       },
       onMouseEnter,
       onMouseDown,
       children: [
-        item.icon !== void 0 && /* @__PURE__ */ jsx7("span", { style: { flexShrink: 0, display: "flex", alignItems: "center" }, children: item.icon }),
         /* @__PURE__ */ jsx7(
           "span",
           {
             style: {
+              flex: "1 0 0",
               fontSize: 14,
               fontWeight: 400,
+              lineHeight: "20px",
+              letterSpacing: "-0.1px",
               color: "#0d0d0d",
               whiteSpace: "nowrap",
               overflow: "hidden",
@@ -8687,17 +9126,16 @@ function SlashMenuItem({ item, index, selected, onMouseEnter, onMouseDown }) {
             children: item.title
           }
         ),
-        /* @__PURE__ */ jsx7("span", { style: { flex: 1 } }),
         (item.description || item.shortcut) && /* @__PURE__ */ jsx7(
           "span",
           {
             style: {
               fontSize: 12,
+              lineHeight: "16px",
               color: "#5e5e5e",
               whiteSpace: "nowrap",
               flexShrink: 0,
-              textAlign: "right",
-              fontFamily: item.shortcut ? "monospace" : "inherit"
+              textAlign: "right"
             },
             children: item.shortcut ?? item.description
           }
@@ -8953,8 +9391,8 @@ function DocumentTreeView({ doc: doc2, className, onNavigate }) {
 }
 
 // src/ui/components/FloatingMenu.tsx
-import { useCallback as useCallback3, useEffect as useEffect4, useRef as useRef4, useState as useState7 } from "react";
-import { createPortal as createPortal2 } from "react-dom";
+import { useCallback as useCallback3, useEffect as useEffect4, useRef as useRef5, useState as useState7 } from "react";
+import { createPortal as createPortal3 } from "react-dom";
 import { TextSelection as TextSelection6 } from "prosemirror-state";
 import { setBlockType as setBlockType2, toggleMark as toggleMark2, wrapIn } from "prosemirror-commands";
 import { wrapInList as wrapInList2 } from "prosemirror-schema-list";
@@ -9132,7 +9570,7 @@ function Divider() {
 }
 function BlockTypeDropdown({ view, state, label }) {
   const [open, setOpen] = useState7(false);
-  const btnRef = useRef4(null);
+  const btnRef = useRef5(null);
   const [hover, setHover] = useState7(false);
   useEffect4(() => {
     if (!open) return;
@@ -9224,7 +9662,7 @@ function BlockTypeDropdown({ view, state, label }) {
         ]
       }
     ),
-    open && btnRect && createPortal2(
+    open && btnRect && createPortal3(
       /* @__PURE__ */ jsx10(
         "div",
         {
@@ -9286,7 +9724,7 @@ function DropdownItem({ item, onRun }) {
 function SelectionToolbar({ view, state, selectionRect }) {
   const [linkMode, setLinkMode] = useState7(false);
   const [linkHref, setLinkHref] = useState7("");
-  const inputRef = useRef4(null);
+  const inputRef = useRef5(null);
   const isBold = hasMark(state, bold2);
   const isItalic = hasMark(state, italic2);
   const isUnderline = hasMark(state, underline2);
@@ -9502,7 +9940,7 @@ function LinkHoverTooltip({ view, link: link2, onEdit }) {
     VPORT_MARGIN2 + tooltipHalfW,
     Math.min((linkLeft + linkRight) / 2, window.innerWidth - VPORT_MARGIN2 - tooltipHalfW)
   );
-  return createPortal2(
+  return createPortal3(
     /* @__PURE__ */ jsxs9(
       "div",
       {
@@ -9616,7 +10054,7 @@ function LinkHoverTooltip({ view, link: link2, onEdit }) {
 function LinkEditDialog({ view, link: link2, onClose }) {
   const [textValue, setTextValue] = useState7(link2.text);
   const [hrefValue, setHrefValue] = useState7(link2.href);
-  const textInputRef = useRef4(null);
+  const textInputRef = useRef5(null);
   useEffect4(() => {
     setTextValue(link2.text);
     setHrefValue(link2.href);
@@ -9714,7 +10152,7 @@ function LinkEditDialog({ view, link: link2, onClose }) {
       saveLink();
     }
   };
-  return createPortal2(
+  return createPortal3(
     /* @__PURE__ */ jsxs9(
       "div",
       {
@@ -9903,7 +10341,7 @@ var INSERT_LINK_EVENT = "ab-insert-link";
 function LinkInsertDialog({ view, cursorPos, onClose }) {
   const [textValue, setTextValue] = useState7("");
   const [hrefValue, setHrefValue] = useState7("");
-  const textInputRef = useRef4(null);
+  const textInputRef = useRef5(null);
   useEffect4(() => {
     setTimeout(() => textInputRef.current?.focus(), 0);
   }, []);
@@ -9954,7 +10392,7 @@ function LinkInsertDialog({ view, cursorPos, onClose }) {
       saveLink();
     }
   };
-  return createPortal2(
+  return createPortal3(
     /* @__PURE__ */ jsxs9(
       "div",
       {
@@ -10302,8 +10740,8 @@ 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);
+  const dwellTimerRef = useRef5(null);
+  const lastEmptyPosRef = useRef5(null);
   useEffect4(() => {
     const dom = view?.dom;
     if (!dom) return;
@@ -10360,7 +10798,7 @@ function FloatingMenu({ view, editorState }) {
     }
   }
   const selectionRect = hasSelection ? getSelectionDOMRect() : null;
-  return createPortal2(
+  return createPortal3(
     /* @__PURE__ */ jsxs9(Fragment4, { children: [
       hasSelection && selectionRect && /* @__PURE__ */ jsx10(
         SelectionToolbar,
@@ -10401,8 +10839,8 @@ function FloatingMenu({ view, editorState }) {
 }
 
 // src/ui/plugin/inlineSuggestPlugin.ts
-import { Plugin as Plugin11, PluginKey as PluginKey9 } from "prosemirror-state";
-import { Decoration as Decoration5, DecorationSet as DecorationSet5 } from "prosemirror-view";
+import { Plugin as Plugin12, PluginKey as PluginKey9 } from "prosemirror-state";
+import { Decoration as Decoration6, DecorationSet as DecorationSet6 } from "prosemirror-view";
 var inlineSuggestKey = new PluginKey9("inlineSuggest");
 var DEBOUNCE_MS = 600;
 function createInlineSuggestPlugin(provider, endpoint, options) {
@@ -10410,7 +10848,7 @@ function createInlineSuggestPlugin(provider, endpoint, options) {
   return {
     name: "inlineSuggest",
     plugins: () => [
-      new Plugin11({
+      new Plugin12({
         key: inlineSuggestKey,
         state: {
           init: () => ({ suggestion: null, anchorPos: null }),
@@ -10426,13 +10864,13 @@ function createInlineSuggestPlugin(provider, endpoint, options) {
         props: {
           decorations(state) {
             const ps = inlineSuggestKey.getState(state);
-            if (!ps?.suggestion || !state.selection.empty) return DecorationSet5.empty;
+            if (!ps?.suggestion || !state.selection.empty) return DecorationSet6.empty;
             const ghost = document.createElement("span");
             ghost.textContent = ps.suggestion;
             ghost.style.cssText = "color: rgba(0,0,0,0.3); pointer-events: none; user-select: none;";
             ghost.setAttribute("aria-hidden", "true");
-            return DecorationSet5.create(state.doc, [
-              Decoration5.widget(state.selection.from, ghost, {
+            return DecorationSet6.create(state.doc, [
+              Decoration6.widget(state.selection.from, ghost, {
                 side: 1,
                 key: "inline-suggest"
               })
@@ -10577,9 +11015,26 @@ function hasInvalidJinjaConditions(state) {
   });
   return found;
 }
+function hasEmptyJinjaBranches(state) {
+  let found = false;
+  state.doc.descendants((node) => {
+    if (found) return false;
+    if (node.type.name === "jinjaIfBranch") {
+      if (node.childCount === 1) {
+        const first = node.firstChild;
+        if (first?.type.name === "paragraph" && first.content.size === 0) {
+          found = true;
+        }
+      }
+      return false;
+    }
+  });
+  return found;
+}
 export {
   ActionbookRenderer,
   DocumentTreeView,
+  EDITOR_TEXT_STYLES,
   EditorShell,
   FloatingMenu,
   INSERT_LINK_EVENT,
@@ -10611,6 +11066,7 @@ export {
   createTodoNodeViewPlugin,
   hasBrokenAnchorRefs,
   hasDuplicateJumpPoints,
+  hasEmptyJinjaBranches,
   hasInvalidJinjaConditions,
   inlineSuggestKey,
   slashCommandKey,