@examind/block-editor 0.1.4 → 0.1.6

package/dist/index.css

@@ -3400,6 +3400,15 @@ article {
     font-weight: var(--sl-font-weight-bold);
     color: var(--sl-color-neutral-600);
   }
+  .financial-statement-question-header {
+    position: relative;
+    padding: var(--sl-spacing-3x-small) var(--sl-spacing-2x-small);
+    text-align: left;
+    vertical-align: top;
+    border-bottom: 1px solid var(--sl-color-neutral-200);
+    border-right: 1px solid var(--sl-color-neutral-200);
+    background-color: var(--sl-color-neutral-100);
+  }
   .financial-statement-question-cell {
     position: relative;
     padding-left: var(--sl-spacing-large);

package/dist/index.js

@@ -5215,14 +5215,14 @@ function DistractorButton(props) {
   ] });
 }
 
-// src/plugins/VariablesPlugin/TypeaheadVariablesAgentPlugin.tsx
+// src/plugins/VariablesPlugin/TypeaheadVariableAgentPlugin.tsx
 var import_LexicalComposerContext21 = require("@lexical/react/LexicalComposerContext");
 var import_utils6 = require("@lexical/utils");
 var import_lexical23 = require("lexical");
 var import_react38 = require("react");
 var import_jsx_runtime49 = require("react/jsx-runtime");
-var TYPEAHEAD_VARIABLES_COMMAND = (0, import_lexical23.createCommand)("TYPEAHEAD_VARIABLES_COMMAND");
-function TypeaheadVariablesAgentPlugin() {
+var TYPEAHEAD_VARIABLE_COMMAND = (0, import_lexical23.createCommand)("TYPEAHEAD_VARIABLE_COMMAND");
+function TypeaheadVariableAgentPlugin() {
   const { hasModule, modulesNumber } = useBlockEditor();
   const [editor] = (0, import_LexicalComposerContext21.useLexicalComposerContext)();
   (0, import_react38.useEffect)(() => {
@@ -5231,7 +5231,7 @@ function TypeaheadVariablesAgentPlugin() {
         editor.registerUpdateListener(({ tags }) => {
           if (!tags.has("history-merge")) {
             editor.dispatchCommand(
-              TYPEAHEAD_VARIABLES_COMMAND,
+              TYPEAHEAD_VARIABLE_COMMAND,
               void 0
             );
           }
@@ -5758,7 +5758,7 @@ function JournalEntryQuestionItemComponent(props) {
                     decoratorNode: JournalEntryQuestionNode
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(VariableComponentPlugin, {})
               ] }) }) }),
               (!debit || !credit) && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "controls", children: [
@@ -5817,7 +5817,7 @@ function JournalEntryQuestionItemComponent(props) {
                     decoratorNode: JournalEntryQuestionNode
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(VariableComponentPlugin, {})
               ] }) }) })
             ]
@@ -5854,7 +5854,7 @@ function JournalEntryQuestionItemComponent(props) {
                     decoratorNode: JournalEntryQuestionNode
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(VariableComponentPlugin, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(VariableToolbarAgentPlugin, {})
               ] }) }) }),
@@ -6401,7 +6401,7 @@ function QuestionItemComponent(props) {
                 ),
                 /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_LexicalHistoryPlugin4.HistoryPlugin, { externalHistoryState: historyState }),
                 /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(TextToolbarAgentPlugin, {}),
-                /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(VariableComponentPlugin, {})
               ] }) }) })
             ]
@@ -6435,7 +6435,7 @@ function QuestionItemComponent(props) {
                     decoratorNode: MatchingQuestionNode
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(VariableComponentPlugin, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(VariableToolbarAgentPlugin, {})
               ] }) }) }),
@@ -6810,7 +6810,7 @@ function MultipleOptionQuestionItemComponent(props) {
               decoratorNode: MultipleOptionQuestionNode
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(TypeaheadVariablesAgentPlugin, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(TypeaheadVariableAgentPlugin, {}),
           /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(VariableComponentPlugin, {}),
           /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(VariableToolbarAgentPlugin, {})
         ] }) }) }),
@@ -7253,7 +7253,7 @@ function ShortAnswerQuestionComponent(props) {
                     decoratorNode: ShortAnswerQuestionNode
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(VariableComponentPlugin, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(VariableToolbarAgentPlugin, {})
               ] }) }) })
@@ -7648,7 +7648,7 @@ function FillInTheBlankQuestionComponent(props) {
                     decoratorNode: FillInTheBlankQuestionNode
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(VariableComponentPlugin, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(VariableToolbarAgentPlugin, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
@@ -7827,26 +7827,34 @@ function FinancialStatementQuestionComponent(props) {
         ),
         /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { "data-selectable": "true", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("table", { "data-selectable": "true", style: { width: "100%" }, children: [
           /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("thead", { "data-selectable": "true", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("tr", { "data-selectable": "true", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("th", { colSpan: 2, "data-selectable": "true", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_LexicalNestedComposer7.LexicalNestedComposer, { initialEditor: header, children: /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(NestedEditor, { nodeKey, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(SettingsPanelNestedAgentPlugin, {}),
-              /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
-                import_LexicalRichTextPlugin7.RichTextPlugin,
-                {
-                  contentEditable: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(NestedContentEditable, {}),
-                  ErrorBoundary: import_LexicalErrorBoundary7.LexicalErrorBoundary,
-                  placeholder: null
-                },
-                nodeKey
-              ),
-              /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
-                import_LexicalHistoryPlugin8.HistoryPlugin,
-                {
-                  externalHistoryState: historyState
-                }
-              ),
-              /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(TypeaheadVariablesAgentPlugin, {}),
-              /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(VariableComponentPlugin, {})
-            ] }) }) }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("tr", { "data-selectable": "true", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+              "td",
+              {
+                className: "financial-statement-question-header",
+                colSpan: 2,
+                "data-selectable": "true",
+                children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_LexicalNestedComposer7.LexicalNestedComposer, { initialEditor: header, children: /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(NestedEditor, { nodeKey, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(SettingsPanelNestedAgentPlugin, {}),
+                  /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+                    import_LexicalRichTextPlugin7.RichTextPlugin,
+                    {
+                      contentEditable: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(NestedContentEditable, {}),
+                      ErrorBoundary: import_LexicalErrorBoundary7.LexicalErrorBoundary,
+                      placeholder: null
+                    },
+                    nodeKey
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+                    import_LexicalHistoryPlugin8.HistoryPlugin,
+                    {
+                      externalHistoryState: historyState
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(TypeaheadVariableAgentPlugin, {}),
+                  /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(VariableComponentPlugin, {})
+                ] }) })
+              }
+            ) }),
             columnHeaders.length >= 2 && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("tr", { "data-selectable": "true", children: [
               /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
                 "th",
@@ -7934,7 +7942,7 @@ function FinancialStatementQuestionComponent(props) {
                                     externalHistoryState: historyState
                                   }
                                 ),
-                                /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(TypeaheadVariablesAgentPlugin, {}),
+                                /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(TypeaheadVariableAgentPlugin, {}),
                                 /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(VariableComponentPlugin, {})
                               ] })
                             }
@@ -14123,16 +14131,48 @@ var PopupToolbar = (0, import_react86.forwardRef)((props, ref) => {
 
 // src/content/colorDialog/colorConstants.ts
 var textColorList = [
-  { label: "Red", color: "var(--td-editor-text-color-red)" },
-  { label: "Green", color: "var(--td-editor-text-color-green)" },
-  { label: "Blue", color: "var(--td-editor-text-color-blue)" },
-  { label: "Purple", color: "var(--td-editor-text-color-purple)" }
+  {
+    label: "Red",
+    color: "var(--td-editor-text-color-red)",
+    bgColor: "default"
+  },
+  {
+    label: "Green",
+    color: "var(--td-editor-text-color-green)",
+    bgColor: "default"
+  },
+  {
+    label: "Blue",
+    color: "var(--td-editor-text-color-blue)",
+    bgColor: "default"
+  },
+  {
+    label: "Purple",
+    color: "var(--td-editor-text-color-purple)",
+    bgColor: "default"
+  }
 ];
 var bgColorList = [
-  { label: "Red", color: "var(--td-editor-bg-color-red)" },
-  { label: "Green", color: "var(--td-editor-bg-color-green)" },
-  { label: "Blue", color: "var(--td-editor-bg-color-blue)" },
-  { label: "Purple", color: "var(--td-editor-bg-color-purple)" }
+  {
+    label: "Red",
+    bgColor: "var(--td-editor-bg-color-red)",
+    color: "var(--td-editor-text-color-red)"
+  },
+  {
+    label: "Green",
+    bgColor: "var(--td-editor-bg-color-green)",
+    color: "var(--td-editor-text-color-green)"
+  },
+  {
+    label: "Blue",
+    bgColor: "var(--td-editor-bg-color-blue)",
+    color: "var(--td-editor-text-color-blue)"
+  },
+  {
+    label: "Purple",
+    bgColor: "var(--td-editor-bg-color-purple)",
+    color: "var(--td-editor-text-color-purple)"
+  }
 ];
 
 // src/components/feedback/ProgressBar.tsx
@@ -14894,8 +14934,8 @@ function replaceWithVariable(variableName, variableFormat, editor, textToReplace
   );
 }
 
-// src/plugins/VariablesPlugin/renderVariablesMenu.tsx
-function renderVariablesMenu(list, popupRef, highlighterRef, activeEditorRef, textToReplaceTargetRef, onUpdateCb) {
+// src/plugins/VariablesPlugin/renderVariableMenu.tsx
+function renderVariableMenu(list, popupRef, highlighterRef, activeEditorRef, textToReplaceTargetRef, onUpdateCb) {
   return [...list].map((variableName) => {
     return {
       id: variableName,
@@ -15104,14 +15144,14 @@ function removeTextInDomSelection(editor, leadOffset, onUpdate) {
   );
 }
 
-// src/plugins/VariablesPlugin/TypeaheadVariablesPlugin.tsx
+// src/plugins/VariablesPlugin/TypeaheadVariablePlugin.tsx
 var import_LexicalComposerContext63 = require("@lexical/react/LexicalComposerContext");
 var import_utils31 = require("@lexical/utils");
 var import_lexical95 = require("lexical");
 var import_react93 = require("react");
 var import_jsx_runtime114 = require("react/jsx-runtime");
 var CREATE_VARIABLE_FROM_SELECTION_COMMAND = (0, import_lexical95.createCommand)("CREATE_VARIABLE_FROM_SELECTION_COMMAND");
-function TypeaheadVariablesPlugin() {
+function TypeaheadVariablePlugin() {
   const { variableList, onCreated } = useVariables();
   const [editor] = (0, import_LexicalComposerContext63.useLexicalComposerContext)();
   const triggerVariableFn = useTypeaheadTriggerMatch("@", {
@@ -15265,7 +15305,7 @@ function TypeaheadVariablesPlugin() {
   (0, import_react93.useEffect)(() => {
     return (0, import_utils31.mergeRegister)(
       editor.registerCommand(
-        TYPEAHEAD_VARIABLES_COMMAND,
+        TYPEAHEAD_VARIABLE_COMMAND,
         (_payload, activeEditor) => {
           activeEditorRef.current = activeEditor;
           handleUpdate();
@@ -15332,7 +15372,7 @@ function TypeaheadVariablesPlugin() {
     );
   }, [editor, variableList]);
   const menu = (0, import_react93.useMemo)(() => {
-    return renderVariablesMenu(
+    return renderVariableMenu(
       variableList || [],
       popupRef,
       highlighterRef,
@@ -15529,19 +15569,19 @@ function TextToolbarPlugin() {
       }
     );
   };
-  const formatBackgroundColor = (newColor) => {
+  const formatBackgroundColor = (color, bgColor) => {
     activeEditorRef.current?.update(
       () => {
         const selection = (0, import_lexical96.$getSelection)();
         if (selection !== null) {
           (0, import_selection2.$patchStyleText)(selection, {
-            color: null,
-            "background-color": newColor !== "default" ? newColor : null,
-            "border-radius": newColor !== "default" ? "calc(var(--sl-border-radius-small) * 0.5)" : null,
-            "outline-width": newColor !== "default" ? "2px" : null,
-            "outline-color": newColor !== "default" ? newColor : null,
-            "outline-style": newColor !== "default" ? "solid" : null,
-            "padding-inline": newColor !== "default" ? "1px" : null
+            color: color !== "default" ? color : null,
+            "background-color": bgColor !== "default" ? bgColor : null,
+            "border-radius": bgColor !== "default" ? "calc(var(--sl-border-radius-small) * 0.5)" : null,
+            "outline-width": bgColor !== "default" ? "2px" : null,
+            "outline-color": bgColor !== "default" ? bgColor : null,
+            "outline-style": bgColor !== "default" ? "solid" : null,
+            "padding-inline": bgColor !== "default" ? "1px" : null
           });
         }
       },
@@ -16011,7 +16051,7 @@ function TextToolbarPlugin() {
                   label: "Default",
                   Icon: import_lucide_react19.Circle,
                   onClick: () => {
-                    formatBackgroundColor("default");
+                    formatBackgroundColor("default", "default");
                   }
                 },
                 ...bgColorList.map((simpleColor, index) => {
@@ -16022,7 +16062,10 @@ function TextToolbarPlugin() {
                     color: bgColorList[index].color,
                     bgColor: simpleColor.color,
                     onClick: () => {
-                      formatBackgroundColor(simpleColor.color);
+                      formatBackgroundColor(
+                        simpleColor.color,
+                        simpleColor.bgColor
+                      );
                     }
                   };
                 })
@@ -16994,10 +17037,17 @@ function TypeaheadMenuPlugin() {
                 );
               } else if ((0, import_lexical101.$isParagraphNode)(node)) {
                 if (node.getChildrenSize() === 0) {
-                  dom.setAttribute(
-                    "data-placeholder",
-                    "Type / for commands or @ for variables"
-                  );
+                  if (hasModule("Variables")) {
+                    dom.setAttribute(
+                      "data-placeholder",
+                      "Type / for commands or @ for variables"
+                    );
+                  } else {
+                    dom.setAttribute(
+                      "data-placeholder",
+                      "Type / for commands"
+                    );
+                  }
                 }
               }
               hidePopup();
@@ -17535,7 +17585,7 @@ function BlockEditor(props) {
                       /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(NodeMousePlugin, {}),
                       /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(TextToolbarPlugin, {}),
                       /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(TextToolbarAgentPlugin, {}),
-                      /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(TypeaheadVariablesAgentPlugin, {}),
+                      /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(TypeaheadVariableAgentPlugin, {}),
                       /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(VariableComponentPlugin, {}),
                       /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(MarkdownPlugin, {})
                     ]
@@ -18575,7 +18625,7 @@ function Variables(props) {
     });
   }, [variablesSettings, setEditingModeDataCallback]);
   return /* @__PURE__ */ (0, import_jsx_runtime132.jsxs)(VariablesProvider, { variablesSettings, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(TypeaheadVariablesPlugin, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(TypeaheadVariablePlugin, {}),
     /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(VariableSettingsPlugin, {}),
     /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(VariableToolbarPlugin, {}),
     /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(VariableToolbarAgentPlugin, {})

package/dist/index.mjs

@@ -5329,14 +5329,14 @@ function DistractorButton(props) {
   ] });
 }
 
-// src/plugins/VariablesPlugin/TypeaheadVariablesAgentPlugin.tsx
+// src/plugins/VariablesPlugin/TypeaheadVariableAgentPlugin.tsx
 import { useLexicalComposerContext as useLexicalComposerContext21 } from "@lexical/react/LexicalComposerContext";
 import { mergeRegister as mergeRegister6 } from "@lexical/utils";
 import { createCommand as createCommand6 } from "lexical";
 import { useEffect as useEffect30 } from "react";
 import { Fragment as Fragment20, jsx as jsx49 } from "react/jsx-runtime";
-var TYPEAHEAD_VARIABLES_COMMAND = createCommand6("TYPEAHEAD_VARIABLES_COMMAND");
-function TypeaheadVariablesAgentPlugin() {
+var TYPEAHEAD_VARIABLE_COMMAND = createCommand6("TYPEAHEAD_VARIABLE_COMMAND");
+function TypeaheadVariableAgentPlugin() {
   const { hasModule, modulesNumber } = useBlockEditor();
   const [editor] = useLexicalComposerContext21();
   useEffect30(() => {
@@ -5345,7 +5345,7 @@ function TypeaheadVariablesAgentPlugin() {
         editor.registerUpdateListener(({ tags }) => {
           if (!tags.has("history-merge")) {
             editor.dispatchCommand(
-              TYPEAHEAD_VARIABLES_COMMAND,
+              TYPEAHEAD_VARIABLE_COMMAND,
               void 0
             );
           }
@@ -5892,7 +5892,7 @@ function JournalEntryQuestionItemComponent(props) {
                     decoratorNode: JournalEntryQuestionNode
                   }
                 ),
-                /* @__PURE__ */ jsx54(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ jsx54(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ jsx54(VariableComponentPlugin, {})
               ] }) }) }),
               (!debit || !credit) && /* @__PURE__ */ jsxs17("div", { className: "controls", children: [
@@ -5951,7 +5951,7 @@ function JournalEntryQuestionItemComponent(props) {
                     decoratorNode: JournalEntryQuestionNode
                   }
                 ),
-                /* @__PURE__ */ jsx54(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ jsx54(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ jsx54(VariableComponentPlugin, {})
               ] }) }) })
             ]
@@ -5988,7 +5988,7 @@ function JournalEntryQuestionItemComponent(props) {
                     decoratorNode: JournalEntryQuestionNode
                   }
                 ),
-                /* @__PURE__ */ jsx54(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ jsx54(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ jsx54(VariableComponentPlugin, {}),
                 /* @__PURE__ */ jsx54(VariableToolbarAgentPlugin, {})
               ] }) }) }),
@@ -6560,7 +6560,7 @@ function QuestionItemComponent(props) {
                 ),
                 /* @__PURE__ */ jsx58(HistoryPlugin3, { externalHistoryState: historyState }),
                 /* @__PURE__ */ jsx58(TextToolbarAgentPlugin, {}),
-                /* @__PURE__ */ jsx58(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ jsx58(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ jsx58(VariableComponentPlugin, {})
               ] }) }) })
             ]
@@ -6594,7 +6594,7 @@ function QuestionItemComponent(props) {
                     decoratorNode: MatchingQuestionNode
                   }
                 ),
-                /* @__PURE__ */ jsx58(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ jsx58(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ jsx58(VariableComponentPlugin, {}),
                 /* @__PURE__ */ jsx58(VariableToolbarAgentPlugin, {})
               ] }) }) }),
@@ -6982,7 +6982,7 @@ function MultipleOptionQuestionItemComponent(props) {
               decoratorNode: MultipleOptionQuestionNode
             }
           ),
-          /* @__PURE__ */ jsx61(TypeaheadVariablesAgentPlugin, {}),
+          /* @__PURE__ */ jsx61(TypeaheadVariableAgentPlugin, {}),
           /* @__PURE__ */ jsx61(VariableComponentPlugin, {}),
           /* @__PURE__ */ jsx61(VariableToolbarAgentPlugin, {})
         ] }) }) }),
@@ -7435,7 +7435,7 @@ function ShortAnswerQuestionComponent(props) {
                     decoratorNode: ShortAnswerQuestionNode
                   }
                 ),
-                /* @__PURE__ */ jsx64(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ jsx64(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ jsx64(VariableComponentPlugin, {}),
                 /* @__PURE__ */ jsx64(VariableToolbarAgentPlugin, {})
               ] }) }) })
@@ -7854,7 +7854,7 @@ function FillInTheBlankQuestionComponent(props) {
                     decoratorNode: FillInTheBlankQuestionNode
                   }
                 ),
-                /* @__PURE__ */ jsx69(TypeaheadVariablesAgentPlugin, {}),
+                /* @__PURE__ */ jsx69(TypeaheadVariableAgentPlugin, {}),
                 /* @__PURE__ */ jsx69(VariableComponentPlugin, {}),
                 /* @__PURE__ */ jsx69(VariableToolbarAgentPlugin, {}),
                 /* @__PURE__ */ jsx69(
@@ -8043,26 +8043,34 @@ function FinancialStatementQuestionComponent(props) {
         ),
         /* @__PURE__ */ jsx71("div", { "data-selectable": "true", children: /* @__PURE__ */ jsxs26("table", { "data-selectable": "true", style: { width: "100%" }, children: [
           /* @__PURE__ */ jsxs26("thead", { "data-selectable": "true", children: [
-            /* @__PURE__ */ jsx71("tr", { "data-selectable": "true", children: /* @__PURE__ */ jsx71("th", { colSpan: 2, "data-selectable": "true", children: /* @__PURE__ */ jsx71(LexicalNestedComposer7, { initialEditor: header, children: /* @__PURE__ */ jsxs26(NestedEditor, { nodeKey, children: [
-              /* @__PURE__ */ jsx71(SettingsPanelNestedAgentPlugin, {}),
-              /* @__PURE__ */ jsx71(
-                RichTextPlugin7,
-                {
-                  contentEditable: /* @__PURE__ */ jsx71(NestedContentEditable, {}),
-                  ErrorBoundary: LexicalErrorBoundary7,
-                  placeholder: null
-                },
-                nodeKey
-              ),
-              /* @__PURE__ */ jsx71(
-                HistoryPlugin7,
-                {
-                  externalHistoryState: historyState
-                }
-              ),
-              /* @__PURE__ */ jsx71(TypeaheadVariablesAgentPlugin, {}),
-              /* @__PURE__ */ jsx71(VariableComponentPlugin, {})
-            ] }) }) }) }),
+            /* @__PURE__ */ jsx71("tr", { "data-selectable": "true", children: /* @__PURE__ */ jsx71(
+              "td",
+              {
+                className: "financial-statement-question-header",
+                colSpan: 2,
+                "data-selectable": "true",
+                children: /* @__PURE__ */ jsx71(LexicalNestedComposer7, { initialEditor: header, children: /* @__PURE__ */ jsxs26(NestedEditor, { nodeKey, children: [
+                  /* @__PURE__ */ jsx71(SettingsPanelNestedAgentPlugin, {}),
+                  /* @__PURE__ */ jsx71(
+                    RichTextPlugin7,
+                    {
+                      contentEditable: /* @__PURE__ */ jsx71(NestedContentEditable, {}),
+                      ErrorBoundary: LexicalErrorBoundary7,
+                      placeholder: null
+                    },
+                    nodeKey
+                  ),
+                  /* @__PURE__ */ jsx71(
+                    HistoryPlugin7,
+                    {
+                      externalHistoryState: historyState
+                    }
+                  ),
+                  /* @__PURE__ */ jsx71(TypeaheadVariableAgentPlugin, {}),
+                  /* @__PURE__ */ jsx71(VariableComponentPlugin, {})
+                ] }) })
+              }
+            ) }),
             columnHeaders.length >= 2 && /* @__PURE__ */ jsxs26("tr", { "data-selectable": "true", children: [
               /* @__PURE__ */ jsx71(
                 "th",
@@ -8150,7 +8158,7 @@ function FinancialStatementQuestionComponent(props) {
                                     externalHistoryState: historyState
                                   }
                                 ),
-                                /* @__PURE__ */ jsx71(TypeaheadVariablesAgentPlugin, {}),
+                                /* @__PURE__ */ jsx71(TypeaheadVariableAgentPlugin, {}),
                                 /* @__PURE__ */ jsx71(VariableComponentPlugin, {})
                               ] })
                             }
@@ -14589,16 +14597,48 @@ var PopupToolbar = forwardRef12((props, ref) => {
 
 // src/content/colorDialog/colorConstants.ts
 var textColorList = [
-  { label: "Red", color: "var(--td-editor-text-color-red)" },
-  { label: "Green", color: "var(--td-editor-text-color-green)" },
-  { label: "Blue", color: "var(--td-editor-text-color-blue)" },
-  { label: "Purple", color: "var(--td-editor-text-color-purple)" }
+  {
+    label: "Red",
+    color: "var(--td-editor-text-color-red)",
+    bgColor: "default"
+  },
+  {
+    label: "Green",
+    color: "var(--td-editor-text-color-green)",
+    bgColor: "default"
+  },
+  {
+    label: "Blue",
+    color: "var(--td-editor-text-color-blue)",
+    bgColor: "default"
+  },
+  {
+    label: "Purple",
+    color: "var(--td-editor-text-color-purple)",
+    bgColor: "default"
+  }
 ];
 var bgColorList = [
-  { label: "Red", color: "var(--td-editor-bg-color-red)" },
-  { label: "Green", color: "var(--td-editor-bg-color-green)" },
-  { label: "Blue", color: "var(--td-editor-bg-color-blue)" },
-  { label: "Purple", color: "var(--td-editor-bg-color-purple)" }
+  {
+    label: "Red",
+    bgColor: "var(--td-editor-bg-color-red)",
+    color: "var(--td-editor-text-color-red)"
+  },
+  {
+    label: "Green",
+    bgColor: "var(--td-editor-bg-color-green)",
+    color: "var(--td-editor-text-color-green)"
+  },
+  {
+    label: "Blue",
+    bgColor: "var(--td-editor-bg-color-blue)",
+    color: "var(--td-editor-text-color-blue)"
+  },
+  {
+    label: "Purple",
+    bgColor: "var(--td-editor-bg-color-purple)",
+    color: "var(--td-editor-text-color-purple)"
+  }
 ];
 
 // src/components/feedback/ProgressBar.tsx
@@ -15386,8 +15426,8 @@ function replaceWithVariable(variableName, variableFormat, editor, textToReplace
   );
 }
 
-// src/plugins/VariablesPlugin/renderVariablesMenu.tsx
-function renderVariablesMenu(list, popupRef, highlighterRef, activeEditorRef, textToReplaceTargetRef, onUpdateCb) {
+// src/plugins/VariablesPlugin/renderVariableMenu.tsx
+function renderVariableMenu(list, popupRef, highlighterRef, activeEditorRef, textToReplaceTargetRef, onUpdateCb) {
   return [...list].map((variableName) => {
     return {
       id: variableName,
@@ -15605,7 +15645,7 @@ function removeTextInDomSelection(editor, leadOffset, onUpdate) {
   );
 }
 
-// src/plugins/VariablesPlugin/TypeaheadVariablesPlugin.tsx
+// src/plugins/VariablesPlugin/TypeaheadVariablePlugin.tsx
 import { useLexicalComposerContext as useLexicalComposerContext63 } from "@lexical/react/LexicalComposerContext";
 import { mergeRegister as mergeRegister25 } from "@lexical/utils";
 import {
@@ -15623,7 +15663,7 @@ import {
 import { useEffect as useEffect76, useMemo as useMemo12, useRef as useRef52 } from "react";
 import { Fragment as Fragment46, jsx as jsx114, jsxs as jsxs42 } from "react/jsx-runtime";
 var CREATE_VARIABLE_FROM_SELECTION_COMMAND = createCommand20("CREATE_VARIABLE_FROM_SELECTION_COMMAND");
-function TypeaheadVariablesPlugin() {
+function TypeaheadVariablePlugin() {
   const { variableList, onCreated } = useVariables();
   const [editor] = useLexicalComposerContext63();
   const triggerVariableFn = useTypeaheadTriggerMatch("@", {
@@ -15777,7 +15817,7 @@ function TypeaheadVariablesPlugin() {
   useEffect76(() => {
     return mergeRegister25(
       editor.registerCommand(
-        TYPEAHEAD_VARIABLES_COMMAND,
+        TYPEAHEAD_VARIABLE_COMMAND,
         (_payload, activeEditor) => {
           activeEditorRef.current = activeEditor;
           handleUpdate();
@@ -15844,7 +15884,7 @@ function TypeaheadVariablesPlugin() {
     );
   }, [editor, variableList]);
   const menu = useMemo12(() => {
-    return renderVariablesMenu(
+    return renderVariableMenu(
       variableList || [],
       popupRef,
       highlighterRef,
@@ -16086,19 +16126,19 @@ function TextToolbarPlugin() {
       }
     );
   };
-  const formatBackgroundColor = (newColor) => {
+  const formatBackgroundColor = (color, bgColor) => {
     activeEditorRef.current?.update(
       () => {
         const selection = $getSelection14();
         if (selection !== null) {
           $patchStyleText(selection, {
-            color: null,
-            "background-color": newColor !== "default" ? newColor : null,
-            "border-radius": newColor !== "default" ? "calc(var(--sl-border-radius-small) * 0.5)" : null,
-            "outline-width": newColor !== "default" ? "2px" : null,
-            "outline-color": newColor !== "default" ? newColor : null,
-            "outline-style": newColor !== "default" ? "solid" : null,
-            "padding-inline": newColor !== "default" ? "1px" : null
+            color: color !== "default" ? color : null,
+            "background-color": bgColor !== "default" ? bgColor : null,
+            "border-radius": bgColor !== "default" ? "calc(var(--sl-border-radius-small) * 0.5)" : null,
+            "outline-width": bgColor !== "default" ? "2px" : null,
+            "outline-color": bgColor !== "default" ? bgColor : null,
+            "outline-style": bgColor !== "default" ? "solid" : null,
+            "padding-inline": bgColor !== "default" ? "1px" : null
           });
         }
       },
@@ -16568,7 +16608,7 @@ function TextToolbarPlugin() {
                   label: "Default",
                   Icon: Circle,
                   onClick: () => {
-                    formatBackgroundColor("default");
+                    formatBackgroundColor("default", "default");
                   }
                 },
                 ...bgColorList.map((simpleColor, index) => {
@@ -16579,7 +16619,10 @@ function TextToolbarPlugin() {
                     color: bgColorList[index].color,
                     bgColor: simpleColor.color,
                     onClick: () => {
-                      formatBackgroundColor(simpleColor.color);
+                      formatBackgroundColor(
+                        simpleColor.color,
+                        simpleColor.bgColor
+                      );
                     }
                   };
                 })
@@ -17599,10 +17642,17 @@ function TypeaheadMenuPlugin() {
                 );
               } else if ($isParagraphNode7(node)) {
                 if (node.getChildrenSize() === 0) {
-                  dom.setAttribute(
-                    "data-placeholder",
-                    "Type / for commands or @ for variables"
-                  );
+                  if (hasModule("Variables")) {
+                    dom.setAttribute(
+                      "data-placeholder",
+                      "Type / for commands or @ for variables"
+                    );
+                  } else {
+                    dom.setAttribute(
+                      "data-placeholder",
+                      "Type / for commands"
+                    );
+                  }
                 }
               }
               hidePopup();
@@ -18152,7 +18202,7 @@ function BlockEditor(props) {
                       /* @__PURE__ */ jsx120(NodeMousePlugin, {}),
                       /* @__PURE__ */ jsx120(TextToolbarPlugin, {}),
                       /* @__PURE__ */ jsx120(TextToolbarAgentPlugin, {}),
-                      /* @__PURE__ */ jsx120(TypeaheadVariablesAgentPlugin, {}),
+                      /* @__PURE__ */ jsx120(TypeaheadVariableAgentPlugin, {}),
                       /* @__PURE__ */ jsx120(VariableComponentPlugin, {}),
                       /* @__PURE__ */ jsx120(MarkdownPlugin, {})
                     ]
@@ -19221,7 +19271,7 @@ function Variables(props) {
     });
   }, [variablesSettings, setEditingModeDataCallback]);
   return /* @__PURE__ */ jsxs49(VariablesProvider, { variablesSettings, children: [
-    /* @__PURE__ */ jsx132(TypeaheadVariablesPlugin, {}),
+    /* @__PURE__ */ jsx132(TypeaheadVariablePlugin, {}),
     /* @__PURE__ */ jsx132(VariableSettingsPlugin, {}),
     /* @__PURE__ */ jsx132(VariableToolbarPlugin, {}),
     /* @__PURE__ */ jsx132(VariableToolbarAgentPlugin, {})

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@examind/block-editor",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "@comment version": [
     "Don't specify package version here. It will be injected by publish workflow."
   ],