@sendbird/actionbook-core 0.9.9 → 0.10.0

package/dist/ui/index.js

@@ -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) {
@@ -5918,7 +5930,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 Plugin5, 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 +6723,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}`;
@@ -6800,13 +6815,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 Plugin5({
+    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,7 +6855,7 @@ 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 Plugin6, PluginKey as PluginKey5, TextSelection as TextSelection5 } from "prosemirror-state";
 var LINK_INPUT_RE = /\\?\[([^\]]*?)\\?\]\(([^)\s]*?)(?:\s+"([^"]*)")?\)$/;
 var LINK_FULL_RE = /^\\?\[([^\]]*?)\\?\]\(([^)\s]*?)(?:\s+"([^"]*)")?\)$/;
 var linkEditKey = new PluginKey5("linkEdit");
@@ -6867,7 +6906,7 @@ function explodeLinkToRaw(state) {
   return tr;
 }
 function createLinkEditPlugin() {
-  return new Plugin5({
+  return new Plugin6({
     key: linkEditKey,
     state: {
       init: () => ({ rawRange: null }),
@@ -6937,7 +6976,7 @@ function createLinkInputRule() {
   );
 }
 function createLinkClickPlugin() {
-  return new Plugin5({
+  return new Plugin6({
     key: new PluginKey5("linkClick"),
     props: {
       handleDOMEvents: {
@@ -6990,7 +7029,7 @@ function createLinkPlugin() {
 }
 
 // src/ui/plugin/dragHandlePlugin.ts
-import { Plugin as Plugin6, PluginKey as PluginKey6 } from "prosemirror-state";
+import { Plugin as Plugin7, PluginKey as PluginKey6 } from "prosemirror-state";
 var PLUGIN_KEY = new PluginKey6("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"/>
@@ -7798,7 +7837,7 @@ function createDragHandlePlugin() {
     plugins: () => {
       let controller = null;
       return [
-        new Plugin6({
+        new Plugin7({
           key: PLUGIN_KEY,
           view(editorView) {
             controller = new DragHandleController(editorView);
@@ -7921,7 +7960,7 @@ function createTodoNodeViewPlugin() {
 }
 
 // src/ui/plugin/placeholderPlugin.ts
-import { Plugin as Plugin7, PluginKey as PluginKey7 } from "prosemirror-state";
+import { Plugin as Plugin8, PluginKey as PluginKey7 } 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");
@@ -7950,7 +7989,7 @@ function createPlaceholderPlugin() {
   return {
     name: "placeholder",
     plugins: () => [
-      new Plugin7({
+      new Plugin8({
         key: pluginKey2,
         state: {
           init(_, state) {
@@ -7974,7 +8013,7 @@ function createPlaceholderPlugin() {
 }
 
 // src/ui/plugin/slashCommandPlugin.ts
-import { Plugin as Plugin8, PluginKey as PluginKey8 } from "prosemirror-state";
+import { Plugin as Plugin9, PluginKey as PluginKey8 } from "prosemirror-state";
 var slashCommandKey = new PluginKey8("slashCommand");
 var TRIGGER_RE = /(?:^|\s)(\/[^\s]*)$/;
 function deriveState(state, dismissedFrom) {
@@ -8002,7 +8041,7 @@ function deriveState(state, dismissedFrom) {
   };
 }
 function createSlashCommandPlugin() {
-  const plugin = new Plugin8({
+  const plugin = new Plugin9({
     key: slashCommandKey,
     state: {
       init(_, state) {
@@ -9757,7 +9796,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 +9805,7 @@ function createInlineSuggestPlugin(provider, endpoint, options) {
   return {
     name: "inlineSuggest",
     plugins: () => [
-      new Plugin9({
+      new Plugin10({
         key: inlineSuggestKey,
         state: {
           init: () => ({ suggestion: null, anchorPos: null }),