@sendbird/actionbook-core 0.9.9 → 0.10.1

package/dist/ui/index.js

@@ -2020,7 +2020,7 @@ function resourceTagToMarkdown() {
 }
 
 // src/markdown/plugins/jumpPoint.ts
-var JUMP_POINT_RE = /\^([A-Za-z_]+)\^/g;
+var JUMP_POINT_RE = /\^([\p{L}\p{N}_-]+)\^/gu;
 function splitTextWithJumpPoints(text2) {
   const results = [];
   let lastIndex = 0;
@@ -2649,6 +2649,18 @@ function useEditorView(config) {
       viewInstanceRef.current = null;
     };
   }, []);
+  const prevEditableRef = useRef(config.editable);
+  useEffect(() => {
+    if (prevEditableRef.current !== config.editable) {
+      prevEditableRef.current = config.editable;
+      const view = viewInstanceRef.current;
+      if (view) {
+        const tr = view.state.tr;
+        tr.setMeta("editableChanged", true);
+        view.dispatch(tr);
+      }
+    }
+  }, [config.editable]);
   const viewRef = useCallback((container) => {
     if (container === containerRef.current) return;
     if (viewInstanceRef.current) {
@@ -2665,7 +2677,7 @@ function useEditorView(config) {
     const view = new EditorView(container, {
       state,
       nodeViews,
-      editable: () => configRef.current.editable !== false,
+      editable: () => configRef.current.editable === true,
       dispatchTransaction(tr) {
         const newState = view.state.apply(tr);
         view.updateState(newState);
@@ -2721,13 +2733,87 @@ function useEditorView(config) {
 // src/ui/plugin/inputRulesPlugin.ts
 import { InputRule, textblockTypeInputRule, wrappingInputRule } from "prosemirror-inputrules";
 import { TextSelection } from "prosemirror-state";
+
+// src/ui/plugin/slashCommandPlugin.ts
+import { Plugin, PluginKey } from "prosemirror-state";
+var slashCommandKey = new PluginKey("slashCommand");
+var TRIGGER_RE = /(?:^|\s)(\/[^\s]*)$/;
+function deriveState(state, dismissedFrom) {
+  const inactive = { active: false, range: null, query: "", parentType: "" };
+  const { selection } = state;
+  if (!selection.empty) return inactive;
+  const { $from } = selection;
+  const parentType = $from.parent.type.name;
+  for (let d = $from.depth; d > 0; d--) {
+    if ($from.node(d).type.name === "noteBlock") return inactive;
+  }
+  const textBefore = $from.parent.textBetween(0, $from.parentOffset, "\n", "\0");
+  const match = TRIGGER_RE.exec(textBefore);
+  if (!match) return inactive;
+  const slashText = match[1];
+  const slashStartInParent = textBefore.lastIndexOf(slashText);
+  const from = $from.start() + slashStartInParent;
+  const to = $from.pos;
+  if (dismissedFrom === from) return inactive;
+  return {
+    active: true,
+    range: { from, to },
+    query: slashText.slice(1),
+    parentType
+  };
+}
+function createSlashCommandPlugin() {
+  const plugin = new Plugin({
+    key: slashCommandKey,
+    state: {
+      init(_, state) {
+        const derived = deriveState(state, null);
+        return { ...derived, _dismissedFrom: null };
+      },
+      apply(tr, prev, _old, newState) {
+        const meta = tr.getMeta(slashCommandKey);
+        let dismissedFrom = prev._dismissedFrom;
+        if (meta?.dismiss !== void 0) {
+          dismissedFrom = meta.dismiss;
+        } else if (dismissedFrom !== null) {
+          const derived2 = deriveState(newState, null);
+          if (derived2.active && derived2.range && derived2.range.from !== dismissedFrom) {
+            dismissedFrom = null;
+          }
+        }
+        const derived = deriveState(newState, dismissedFrom);
+        return { ...derived, _dismissedFrom: dismissedFrom };
+      }
+    }
+    // Expose only the public fields via the key
+    // (InternalState is a superset of SlashCommandState so reads work fine)
+  });
+  return {
+    name: "slashCommand",
+    plugins: () => [plugin],
+    keymap: () => ({
+      Escape: (state, dispatch) => {
+        const s = slashCommandKey.getState(state);
+        if (!s?.active || !s.range) return false;
+        if (dispatch) {
+          const tr = state.tr;
+          tr.setMeta(slashCommandKey, { dismiss: s.range.from });
+          dispatch(tr);
+        }
+        return true;
+      }
+    })
+  };
+}
+
+// src/ui/plugin/inputRulesPlugin.ts
 var HEADING_RE = /^(#{1,6})\s$/;
 var BLOCKQUOTE_RE = /^\s*>\s$/;
 var CODE_BLOCK_RE = /^```([a-zA-Z0-9]*)$/;
 var HR_RE = /^([-*_])\1{2,}$/;
 var BULLET_LIST_RE = /^\s*([-*])\s$/;
 var ORDERED_LIST_RE = /^(\d+)\.\s$/;
-var JUMP_POINT_RE2 = /\^([A-Za-z_]+)\^$/;
+var JUMP_POINT_RE2 = /\^([\p{L}\p{N}_-]+)\^$/u;
 var BOLD_STAR_RE = /(?:^|[^*])\*\*([^*]+)\*\*$/;
 var BOLD_UNDER_RE = /(?:^|[^_])__([^_]+)__$/;
 var ITALIC_STAR_RE = /(?:^|[^*])\*([^*]+)\*$/;
@@ -2794,6 +2880,8 @@ function handleListInputRule(state, start, end, listType, attrs) {
 }
 function markInputRule(pattern, markType, markerLen) {
   return new InputRule(pattern, (state, match, start, end) => {
+    const slashState = slashCommandKey.getState(state);
+    if (slashState?.active) return null;
     const textContent2 = match[1];
     const fullMatch = match[0];
     const markedLength = markerLen * 2 + textContent2.length;
@@ -3286,9 +3374,20 @@ var enterCommand = chainCommands(
 );
 var shiftEnterCommand = (state, dispatch) => {
   if (dispatch) {
-    dispatch(
-      state.tr.replaceSelectionWith(hardBreak.create()).scrollIntoView()
-    );
+    const { from, to, $from } = state.selection;
+    const tr = state.tr;
+    if (from !== to) tr.delete(from, to);
+    const insertPos = tr.mapping.map(from);
+    const marks = $from.marks();
+    tr.insert(insertPos, hardBreak.create());
+    const afterBr = insertPos + 1;
+    tr.insertText("\u200B", afterBr);
+    const cursorPos = afterBr + 1;
+    if (cursorPos <= tr.doc.content.size) {
+      tr.setSelection(TextSelection2.create(tr.doc, cursorPos));
+    }
+    if (marks.length > 0) tr.setStoredMarks(marks);
+    dispatch(tr.scrollIntoView());
   }
   return true;
 };
@@ -3315,7 +3414,7 @@ function createKeymapPlugin() {
 
 // src/ui/plugin/markdownClipboard.ts
 import { DOMParser as ProseMirrorDOMParser, Fragment, Slice } from "prosemirror-model";
-import { Plugin, PluginKey } from "prosemirror-state";
+import { Plugin as Plugin2, PluginKey as PluginKey2 } from "prosemirror-state";
 
 // src/ast/traverse.ts
 var MAX_DEPTH3 = 128;
@@ -5198,7 +5297,7 @@ function buildDocumentTree(doc2) {
 }
 
 // src/ui/plugin/markdownClipboard.ts
-var key = new PluginKey("markdownClipboard");
+var key = new PluginKey2("markdownClipboard");
 var MAX_PASTE_LIST_DEPTH = 3;
 var MAX_FLATTEN_DEPTH = 128;
 function flattenDeepLists(node, listDepth = 0, _recurseDepth = 0) {
@@ -5261,7 +5360,7 @@ function textToSlice(text2, view) {
     view.state.doc.descendants((node) => {
       if (node.type.name === "jumpPoint") existingIds.add(node.attrs.id);
     });
-    const deduped = text2.replace(/\^([A-Za-z_][A-Za-z0-9_]*)\^/gm, (match, id) => {
+    const deduped = text2.replace(/\^([\p{L}\p{N}_-]+)\^/gmu, (match, id) => {
       if (existingIds.has(id)) return id;
       existingIds.add(id);
       return match;
@@ -5278,7 +5377,7 @@ function textToSlice(text2, view) {
 }
 var URL_RE = /^https?:\/\/[^\s]+$/i;
 function createPlugin() {
-  return new Plugin({
+  return new Plugin2({
     key,
     props: {
       handlePaste(view, event) {
@@ -5344,9 +5443,9 @@ function createMarkdownClipboardPlugin() {
 }
 
 // src/ui/plugin/jumpPointPlugin.ts
-import { Plugin as Plugin2, PluginKey as PluginKey2, TextSelection as TextSelection3 } from "prosemirror-state";
+import { Plugin as Plugin3, PluginKey as PluginKey3, TextSelection as TextSelection3 } from "prosemirror-state";
 import { Decoration, DecorationSet } from "prosemirror-view";
-var adjacentKey = new PluginKey2("jumpPointAdjacent");
+var adjacentKey = new PluginKey3("jumpPointAdjacent");
 var JUMP_POINT_ADJACENT_SPEC = { jumpPointAdjacent: true };
 function buildDecorations(state) {
   const { selection } = state;
@@ -5362,10 +5461,10 @@ function buildDecorations(state) {
   });
   return DecorationSet.create(state.doc, decorations);
 }
-var jumpPointEditKey = new PluginKey2("jumpPointEdit");
-var JUMP_POINT_FULL_RE = /^\^([A-Za-z_][A-Za-z0-9_]*)\^$/;
+var jumpPointEditKey = new PluginKey3("jumpPointEdit");
+var JUMP_POINT_FULL_RE = /^\^([\p{L}\p{N}_-]+)\^$/u;
 function createJumpPointEditPlugin() {
-  return new Plugin2({
+  return new Plugin3({
     key: jumpPointEditKey,
     state: {
       init: () => ({ rawRange: null }),
@@ -5467,7 +5566,7 @@ function createJumpPointAdjacentPlugin() {
     }),
     plugins: () => [
       createJumpPointEditPlugin(),
-      new Plugin2({
+      new Plugin3({
         key: adjacentKey,
         state: {
           init(_, state) {
@@ -5633,9 +5732,9 @@ function createJumpPointNodeViewPlugin() {
 }
 
 // src/ui/plugin/jumpPointValidationPlugin.ts
-import { Plugin as Plugin3, PluginKey as PluginKey3 } from "prosemirror-state";
+import { Plugin as Plugin4, PluginKey as PluginKey4 } from "prosemirror-state";
 import { Decoration as Decoration2, DecorationSet as DecorationSet2 } from "prosemirror-view";
-var pluginKey = new PluginKey3("jumpPointValidation");
+var pluginKey = new PluginKey4("jumpPointValidation");
 function collectJumpPointIds(state) {
   const ids = /* @__PURE__ */ new Set();
   state.doc.descendants((node) => {
@@ -5685,7 +5784,7 @@ function createJumpPointValidationPlugin() {
   return {
     name: "jumpPointValidation",
     plugins: () => [
-      new Plugin3({
+      new Plugin4({
         key: pluginKey,
         state: {
           init(_, state) {
@@ -5801,9 +5900,9 @@ function createInlineToolTagNodeViewPlugin() {
 }
 
 // src/ui/plugin/jinjaDecoration.ts
-import { Plugin as Plugin4, PluginKey as PluginKey4 } from "prosemirror-state";
+import { Plugin as Plugin5, PluginKey as PluginKey5 } from "prosemirror-state";
 import { Decoration as Decoration3, DecorationSet as DecorationSet3 } from "prosemirror-view";
-var jinjaPluginKey = new PluginKey4("jinjaDecoration");
+var jinjaPluginKey = new PluginKey5("jinjaDecoration");
 var JINJA_TAG_RE = /\{%\s*(if|elif|else|endif)\s*([^%]*?)\s*%\}/g;
 function getBlockPositions(doc2) {
   const blocks = [];
@@ -5894,7 +5993,7 @@ function createJinjaDecorationPlugin() {
   return {
     name: "jinjaDecoration",
     plugins: () => [
-      new Plugin4({
+      new Plugin5({
         key: jinjaPluginKey,
         state: {
           init(_, state) {
@@ -5918,7 +6017,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 { TextSelection as TextSelection4 } from "prosemirror-state";
+import { Plugin as Plugin6, 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";
@@ -6711,10 +6810,13 @@ var JinjaIfBranchView = class {
     this.root = createRoot2(this.headerContainer);
     this._onSiblingsChanged = () => this.render();
     this.dom.addEventListener("jinja-siblings-changed", this._onSiblingsChanged);
+    this._onEditableChanged = () => this.render();
+    this.dom.addEventListener("jinja-editable-changed", this._onEditableChanged);
     this.syncDOM();
     this.render();
   }
   _onSiblingsChanged = null;
+  _onEditableChanged = null;
   syncDOM() {
     const branchType = this.node.attrs.branchType;
     this.dom.className = `jinja-branch jinja-branch-${branchType}`;
@@ -6751,7 +6853,7 @@ var JinjaIfBranchView = class {
         {
           branchType,
           condition,
-          editable: this.view.editable,
+          editable: this.view.editable && this.view.dom.getAttribute("contenteditable") !== "false",
           isLastBranch: showAddButton,
           hasElseBranch: context && nodePos != null ? getElseBranch(this.view, nodePos) : false,
           onConditionChange: (value) => {
@@ -6800,13 +6902,37 @@ var JinjaIfBranchView = class {
     if (this._onSiblingsChanged) {
       this.dom.removeEventListener("jinja-siblings-changed", this._onSiblingsChanged);
     }
+    if (this._onEditableChanged) {
+      this.dom.removeEventListener("jinja-editable-changed", this._onEditableChanged);
+    }
     StyleManager.release();
     setTimeout(() => this.root.unmount(), 0);
   }
 };
+function createEditableWatcherPlugin() {
+  let lastEditable = null;
+  return new Plugin6({
+    view(editorView) {
+      lastEditable = editorView.editable;
+      return {
+        update(view) {
+          const currentEditable = view.editable;
+          if (lastEditable !== null && lastEditable !== currentEditable) {
+            const event = new Event("jinja-editable-changed", { bubbles: true });
+            view.dom.querySelectorAll("[data-jinja-branch]").forEach((el) => {
+              el.dispatchEvent(event);
+            });
+          }
+          lastEditable = currentEditable;
+        }
+      };
+    }
+  });
+}
 function createJinjaIfBlockPlugin() {
   return {
     name: "jinjaIfBlock",
+    plugins: () => [createEditableWatcherPlugin()],
     nodeViews: () => ({
       jinjaIfBlock: (() => new JinjaIfBlockView()),
       jinjaIfBranch: ((node, view, getPos) => new JinjaIfBranchView(node, view, getPos))
@@ -6816,10 +6942,10 @@ function createJinjaIfBlockPlugin() {
 
 // src/ui/plugin/linkPlugin.ts
 import { InputRule as InputRule2, inputRules as inputRules2 } from "prosemirror-inputrules";
-import { Plugin as Plugin5, PluginKey as PluginKey5, TextSelection as TextSelection5 } from "prosemirror-state";
+import { Plugin as Plugin7, PluginKey as PluginKey6, TextSelection as TextSelection5 } from "prosemirror-state";
 var LINK_INPUT_RE = /\\?\[([^\]]*?)\\?\]\(([^)\s]*?)(?:\s+"([^"]*)")?\)$/;
 var LINK_FULL_RE = /^\\?\[([^\]]*?)\\?\]\(([^)\s]*?)(?:\s+"([^"]*)")?\)$/;
-var linkEditKey = new PluginKey5("linkEdit");
+var linkEditKey = new PluginKey6("linkEdit");
 function getMarkRange($pos, type) {
   const { parentOffset } = $pos;
   let child = $pos.parent.childAfter(parentOffset);
@@ -6867,7 +6993,7 @@ function explodeLinkToRaw(state) {
   return tr;
 }
 function createLinkEditPlugin() {
-  return new Plugin5({
+  return new Plugin7({
     key: linkEditKey,
     state: {
       init: () => ({ rawRange: null }),
@@ -6937,8 +7063,8 @@ function createLinkInputRule() {
   );
 }
 function createLinkClickPlugin() {
-  return new Plugin5({
-    key: new PluginKey5("linkClick"),
+  return new Plugin7({
+    key: new PluginKey6("linkClick"),
     props: {
       handleDOMEvents: {
         click: (_view, event) => {
@@ -6990,8 +7116,8 @@ function createLinkPlugin() {
 }
 
 // src/ui/plugin/dragHandlePlugin.ts
-import { Plugin as Plugin6, PluginKey as PluginKey6 } from "prosemirror-state";
-var PLUGIN_KEY = new PluginKey6("dragHandle");
+import { Plugin as Plugin8, 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"/>
   <circle cx="4" cy="6" r="1.2"/><circle cx="8" cy="6" r="1.2"/>
@@ -7798,7 +7924,7 @@ function createDragHandlePlugin() {
     plugins: () => {
       let controller = null;
       return [
-        new Plugin6({
+        new Plugin8({
           key: PLUGIN_KEY,
           view(editorView) {
             controller = new DragHandleController(editorView);
@@ -7921,10 +8047,10 @@ function createTodoNodeViewPlugin() {
 }
 
 // src/ui/plugin/placeholderPlugin.ts
-import { Plugin as Plugin7, PluginKey as PluginKey7 } from "prosemirror-state";
+import { Plugin as Plugin9, 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 PluginKey7("placeholder");
+var pluginKey2 = new PluginKey8("placeholder");
 function buildDecorations4(state) {
   const { doc: doc2, selection } = state;
   if (!selection.empty) return DecorationSet4.empty;
@@ -7950,7 +8076,7 @@ function createPlaceholderPlugin() {
   return {
     name: "placeholder",
     plugins: () => [
-      new Plugin7({
+      new Plugin9({
         key: pluginKey2,
         state: {
           init(_, state) {
@@ -7973,78 +8099,6 @@ function createPlaceholderPlugin() {
   };
 }
 
-// src/ui/plugin/slashCommandPlugin.ts
-import { Plugin as Plugin8, PluginKey as PluginKey8 } from "prosemirror-state";
-var slashCommandKey = new PluginKey8("slashCommand");
-var TRIGGER_RE = /(?:^|\s)(\/[^\s]*)$/;
-function deriveState(state, dismissedFrom) {
-  const inactive = { active: false, range: null, query: "", parentType: "" };
-  const { selection } = state;
-  if (!selection.empty) return inactive;
-  const { $from } = selection;
-  const parentType = $from.parent.type.name;
-  for (let d = $from.depth; d > 0; d--) {
-    if ($from.node(d).type.name === "noteBlock") return inactive;
-  }
-  const textBefore = $from.parent.textBetween(0, $from.parentOffset, "\n", "\0");
-  const match = TRIGGER_RE.exec(textBefore);
-  if (!match) return inactive;
-  const slashText = match[1];
-  const slashStartInParent = textBefore.lastIndexOf(slashText);
-  const from = $from.start() + slashStartInParent;
-  const to = $from.pos;
-  if (dismissedFrom === from) return inactive;
-  return {
-    active: true,
-    range: { from, to },
-    query: slashText.slice(1),
-    parentType
-  };
-}
-function createSlashCommandPlugin() {
-  const plugin = new Plugin8({
-    key: slashCommandKey,
-    state: {
-      init(_, state) {
-        const derived = deriveState(state, null);
-        return { ...derived, _dismissedFrom: null };
-      },
-      apply(tr, prev, _old, newState) {
-        const meta = tr.getMeta(slashCommandKey);
-        let dismissedFrom = prev._dismissedFrom;
-        if (meta?.dismiss !== void 0) {
-          dismissedFrom = meta.dismiss;
-        } else if (dismissedFrom !== null) {
-          const derived2 = deriveState(newState, null);
-          if (derived2.active && derived2.range && derived2.range.from !== dismissedFrom) {
-            dismissedFrom = null;
-          }
-        }
-        const derived = deriveState(newState, dismissedFrom);
-        return { ...derived, _dismissedFrom: dismissedFrom };
-      }
-    }
-    // Expose only the public fields via the key
-    // (InternalState is a superset of SlashCommandState so reads work fine)
-  });
-  return {
-    name: "slashCommand",
-    plugins: () => [plugin],
-    keymap: () => ({
-      Escape: (state, dispatch) => {
-        const s = slashCommandKey.getState(state);
-        if (!s?.active || !s.range) return false;
-        if (dispatch) {
-          const tr = state.tr;
-          tr.setMeta(slashCommandKey, { dismiss: s.range.from });
-          dispatch(tr);
-        }
-        return true;
-      }
-    })
-  };
-}
-
 // src/ui/components/SlashCommandMenu.tsx
 import React4, { useEffect as useEffect3, useLayoutEffect, useRef as useRef3, useState as useState4 } from "react";
 import { createPortal } from "react-dom";
@@ -9757,7 +9811,7 @@ function FloatingMenu({ view, editorState }) {
 }
 
 // src/ui/plugin/inlineSuggestPlugin.ts
-import { Plugin as Plugin9, PluginKey as PluginKey9 } from "prosemirror-state";
+import { Plugin as Plugin10, 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;
@@ -9766,7 +9820,7 @@ function createInlineSuggestPlugin(provider, endpoint, options) {
   return {
     name: "inlineSuggest",
     plugins: () => [
-      new Plugin9({
+      new Plugin10({
         key: inlineSuggestKey,
         state: {
           init: () => ({ suggestion: null, anchorPos: null }),