@sendbird/actionbook-core 0.10.7 → 0.10.9

package/dist/ui/index.js

@@ -2418,6 +2418,14 @@ var gfmNoAutolinkToMarkdown = () => ({
 function isEmptyParagraph(node) {
   return node.type === "paragraph" && (!("children" in node) || !node.children || node.children.length === 0);
 }
+var JINJA_TAG_RE = /^\{%\s*(if|elif|else|endif)\b/;
+function isJinjaTagParagraph(node) {
+  if (node.type !== "paragraph") return false;
+  const children = node.children;
+  if (!children || children.length !== 1) return false;
+  const child = children[0];
+  return child.type === "text" && typeof child.value === "string" && JINJA_TAG_RE.test(child.value);
+}
 function textHandler(node, parent, state, info) {
   const originalUnsafe = state.unsafe;
   state.unsafe = originalUnsafe.filter((p) => !(p.character === "_" && !p.atBreak));
@@ -2460,7 +2468,10 @@ function serializeToMarkdown(doc2) {
       // Empty paragraphs represent blank-line spacers.
       // Reduce the separator after an empty paragraph from \n\n to \n
       // so that 1 empty paragraph = 1 extra blank line in the output.
-      (left) => isEmptyParagraph(left) ? 0 : null
+      (left) => isEmptyParagraph(left) ? 0 : null,
+      // Consecutive paragraphs: single newline instead of blank line
+      // (skip jinja tag paragraphs — they need blank lines for proper roundtrip)
+      (left, right) => left.type === "paragraph" && right.type === "paragraph" && !isJinjaTagParagraph(left) && !isJinjaTagParagraph(right) ? 0 : null
     ],
     handlers: {
       text: textHandler,
@@ -5597,6 +5608,11 @@ function tokenize(input) {
       i++;
       continue;
     }
+    if (input[i] === ",") {
+      tokens.push({ type: "COMMA", value: "," });
+      i++;
+      continue;
+    }
     return { tokens: [], error: `Unexpected character: ${input[i]}` };
   }
   tokens.push({ type: "EOF", value: "" });
@@ -5727,6 +5743,17 @@ var Parser = class {
         return null;
       case "IDENT": {
         this.advance();
+        if (this.peek().type === "LPAREN") {
+          this.advance();
+          while (this.peek().type !== "RPAREN" && this.peek().type !== "EOF") {
+            this.orExpr();
+            if (this.peek().type === "COMMA") {
+              this.advance();
+            }
+          }
+          this.expect("RPAREN");
+          return null;
+        }
         return this.resolveVariable(t.value);
       }
       case "LPAREN": {
@@ -5806,7 +5833,7 @@ var END_ACTION_TEXTS = /* @__PURE__ */ new Set([
 function isEndActionTag(tagType, resourceId, text2) {
   return tagType === "handoff" || END_ACTION_RESOURCE_IDS.has(resourceId) || END_ACTION_TEXTS.has(text2.toLowerCase());
 }
-function extractInlineItems(content, blockIndex) {
+function extractInlineItems(content, blockIndex, listItemPath = []) {
   const items = [];
   for (const node of content) {
     if (node.type === "jumpPoint") {
@@ -5823,22 +5850,26 @@ function extractInlineItems(content, blockIndex) {
         label: endAction ? `End  ${node.text}` : node.text,
         blockIndex,
         children: [],
-        meta: { tagType: node.tagType, resourceId: node.resourceId }
+        meta: {
+          tagType: node.tagType,
+          resourceId: node.resourceId,
+          ...listItemPath.length > 0 && { listItemPath: [...listItemPath] }
+        }
       });
     }
   }
   return items;
 }
-function extractBlockItems(blocks, startIndex, depth) {
+function extractBlockItems(blocks, startIndex, depth, listItemPath = [], fixedBlockIndex) {
   if (depth > MAX_DEPTH6) return [];
   const items = [];
   for (let i = 0; i < blocks.length; i++) {
     const block = blocks[i];
-    const blockIndex = startIndex + i;
+    const blockIndex = fixedBlockIndex ?? startIndex + i;
     switch (block.type) {
       case "heading": {
         const label = textContent(block) || `Heading ${block.level}`;
-        const inlineItems = extractInlineItems(block.content, blockIndex);
+        const inlineItems = extractInlineItems(block.content, blockIndex, listItemPath);
         items.push({
           type: "heading",
           label,
@@ -5849,7 +5880,7 @@ function extractBlockItems(blocks, startIndex, depth) {
         break;
       }
       case "paragraph": {
-        const inlineItems = extractInlineItems(block.content, blockIndex);
+        const inlineItems = extractInlineItems(block.content, blockIndex, listItemPath);
         items.push(...inlineItems);
         break;
       }
@@ -5885,14 +5916,15 @@ function extractBlockItems(blocks, startIndex, depth) {
       }
       case "bulletList":
       case "orderedList": {
-        for (const li of block.content) {
-          const childItems = extractBlockItems(li.content, blockIndex, depth + 1);
+        for (let liIdx = 0; liIdx < block.content.length; liIdx++) {
+          const li = block.content[liIdx];
+          const childItems = extractBlockItems(li.content, blockIndex, depth + 1, [...listItemPath, liIdx], blockIndex);
           items.push(...childItems);
         }
         break;
       }
       case "blockquote": {
-        const childItems = extractBlockItems(block.content, blockIndex, depth + 1);
+        const childItems = extractBlockItems(block.content, blockIndex, depth + 1, listItemPath, blockIndex);
         items.push(...childItems);
         break;
       }
@@ -6656,7 +6688,7 @@ function createInlineToolTagNodeViewPlugin() {
 import { Plugin as Plugin6, PluginKey as PluginKey5 } from "prosemirror-state";
 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;
+var JINJA_TAG_RE2 = /\{%\s*(if|elif|else|endif)\s*([^%]*?)\s*%\}/g;
 function getBlockPositions(doc2) {
   const blocks = [];
   let index = 0;
@@ -6670,9 +6702,9 @@ function addInlineChipDecorations(doc2, decorations) {
   doc2.descendants((node, pos) => {
     if (!node.isText) return;
     const text2 = node.text;
-    JINJA_TAG_RE.lastIndex = 0;
+    JINJA_TAG_RE2.lastIndex = 0;
     let match;
-    while ((match = JINJA_TAG_RE.exec(text2)) !== null) {
+    while ((match = JINJA_TAG_RE2.exec(text2)) !== null) {
       const from = pos + match.index;
       const to = from + match[0].length;
       const keyword = match[1];
@@ -6837,6 +6869,7 @@ var JINJA_STYLES = `
 .jinja-branch-condition {
   flex: 1;
   min-width: 0;
+  min-height: 20px;
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
@@ -7014,6 +7047,15 @@ var JINJA_STYLES = `
   background: rgba(13, 13, 13, 0.04);
 }
 
+.jinja-ghost-btn.jinja-add-btn {
+  color: #5E5E5E;
+}
+
+.jinja-ghost-btn.jinja-add-btn.active {
+  background: #DCDBFF;
+  color: #6210CC;
+}
+
 .jinja-ghost-btn:disabled {
   opacity: 0.45;
   cursor: default;
@@ -7316,7 +7358,7 @@ function ConditionDisplay({
           setIsEditing(true);
         }
       },
-      children: condition.length > 0 ? renderCondition(condition) : /* @__PURE__ */ jsx6("span", { className: "jinja-condition-placeholder", children: CONDITION_PLACEHOLDER })
+      children: condition.length > 0 ? condition.trim().length > 0 ? renderCondition(condition) : /* @__PURE__ */ jsx6("span", { className: "jinja-token-identifier", children: condition }) : /* @__PURE__ */ jsx6("span", { className: "jinja-condition-placeholder", children: CONDITION_PLACEHOLDER })
     }
   );
 }
@@ -7390,6 +7432,16 @@ function JinjaBranchHeader({
   }, [menuSource]);
   const menuItems = [];
   if (editable) {
+    if (!hasElseBranch) {
+      menuItems.push({
+        label: "Else if",
+        onSelect: () => onAddBranch("elif")
+      });
+      menuItems.push({
+        label: "Else",
+        onSelect: () => onAddBranch("else")
+      });
+    }
     menuItems.push({
       label: "Delete",
       onSelect: onDelete
@@ -7444,8 +7496,9 @@ function JinjaBranchHeader({
           BranchPopupMenu,
           {
             position: { top: 28, right: 0 },
-            items: menuItems.map((item) => ({
+            items: menuItems.filter((item) => item.label === "Delete").map((item) => ({
               ...item,
+              label: branchType === "if" ? "Delete all" : "Delete",
               onSelect: () => {
                 setMenuSource(null);
                 item.onSelect();
@@ -7462,7 +7515,7 @@ function JinjaBranchHeader({
         "button",
         {
           type: "button",
-          className: "jinja-ghost-btn",
+          className: `jinja-ghost-btn jinja-add-btn${menuSource === "footer" ? " active" : ""}`,
           "aria-label": "Add branch",
           disabled: !canOpenFooterMenu,
           onMouseDown: (event) => event.preventDefault(),
@@ -7471,9 +7524,9 @@ function JinjaBranchHeader({
               setMenuSource((current) => current === "footer" ? null : "footer");
             }
           },
-          children: /* @__PURE__ */ jsxs5("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", children: [
-            /* @__PURE__ */ jsx6("line", { x1: "8", y1: "3", x2: "8", y2: "13" }),
-            /* @__PURE__ */ jsx6("line", { x1: "3", y1: "8", x2: "13", y2: "8" })
+          children: /* @__PURE__ */ jsxs5("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+            /* @__PURE__ */ jsx6("path", { d: "M7.33337 11L7.33337 8.66666L5.00004 8.66666V7.33333L7.33337 7.33333V4.99999H8.66671V7.33333H11V8.66666H8.66671L8.66671 11H7.33337Z", fill: "currentColor" }),
+            /* @__PURE__ */ jsx6("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M8.00004 14.6667C11.6819 14.6667 14.6667 11.6819 14.6667 7.99999C14.6667 4.3181 11.6819 1.33333 8.00004 1.33333C4.31814 1.33333 1.33337 4.3181 1.33337 7.99999C1.33337 11.6819 4.31814 14.6667 8.00004 14.6667ZM13.3334 7.99999C13.3334 10.9455 10.9456 13.3333 8.00004 13.3333C5.05452 13.3333 2.66671 10.9455 2.66671 7.99999C2.66671 5.05448 5.05452 2.66666 8.00004 2.66666C10.9456 2.66666 13.3334 5.05448 13.3334 7.99999Z", fill: "currentColor" })
           ] })
         }
       ),
@@ -7825,23 +7878,10 @@ function createLinkClickPlugin() {
           if (target.tagName !== "A") return false;
           const href = target.getAttribute("href");
           if (!href) return false;
-          if (href.startsWith("#")) {
-            event.preventDefault();
-            const targetId = `jp-${href.slice(1)}`;
-            const el = document.getElementById(targetId);
-            if (el) {
-              el.scrollIntoView({ block: "end" });
-              el.focus();
-              if (el.parentElement) {
-                el.parentElement.style.outline = "2px solid #6213cc";
-                setTimeout(() => {
-                  el.parentElement.style.outline = "none";
-                }, 500);
-              }
-            }
-            return true;
-          }
-          return false;
+          event.preventDefault();
+          if (href.startsWith("#")) return true;
+          window.open(href, "_blank", "noopener,noreferrer");
+          return true;
         }
       }
     }
@@ -7871,7 +7911,7 @@ function createLinkPlugin() {
 // src/ui/plugin/dragHandlePlugin.ts
 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">
+var GRIP_SVG = `<svg width="16" height="16" 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"/>
   <circle cx="4" cy="6" r="1.2"/><circle cx="8" cy="6" r="1.2"/>
   <circle cx="4" cy="9.5" r="1.2"/><circle cx="8" cy="9.5" r="1.2"/>
@@ -8481,6 +8521,7 @@ var DragHandleController = class {
     this.dropIndicator.className = "ab-drop-indicator";
     this.dropIndicator.style.display = "none";
     parent.appendChild(this.dropIndicator);
+    this.scrollContainer = this.findScrollContainer(this.view.dom);
     this.tickAutoScroll();
   }
   addGlobalDragListeners(pointerId) {
@@ -8629,6 +8670,7 @@ var DragHandleController = class {
     while (current) {
       const overflow = getComputedStyle(current).overflowY;
       if (overflow === "auto" || overflow === "scroll") return current;
+      if (overflow === "hidden" && (current.classList.contains("ps") || current.scrollHeight > current.clientHeight + 1)) return current;
       current = current.parentElement;
     }
     return el.parentElement ?? el;
@@ -9715,7 +9757,7 @@ function DropdownItem({ item, onRun }) {
         transition: "background 0.1s"
       },
       children: [
-        /* @__PURE__ */ jsx10("span", { style: { width: 24, flexShrink: 0, textAlign: "center", fontWeight: 700, fontSize: 12, fontFamily: "monospace", color: "#6210CC" }, children: item.shortLabel }),
+        /* @__PURE__ */ jsx10("span", { style: { width: 24, flexShrink: 0, textAlign: "center", fontWeight: 700, fontSize: 12, fontFamily: "monospace", color: item.active ? "#6210CC" : "#666" }, children: item.shortLabel }),
         item.label
       ]
     }