@mdxeditor/editor 1.14.3 → 2.0.1

package/dist/plugins/quote/index.js

@@ -1,26 +1,18 @@
-import { coreSystem } from "../core/index.js";
 import { QuoteNode } from "@lexical/rich-text";
 import { MdastBlockQuoteVisitor } from "./MdastBlockQuoteVisitor.js";
 import { LexicalQuoteVisitor } from "./LexicalQuoteVisitor.js";
-import { realmPlugin } from "../../gurx/react.js";
-import { system } from "../../gurx/realmFactory.js";
-const [
-  /** @internal */
-  quotePlugin,
-  /** @internal */
-  quotePluginHooks
-] = realmPlugin({
-  id: "quote",
-  systemSpec: system(() => {
-    return {};
-  }, [coreSystem]),
-  init: (realm) => {
-    realm.pubKey("addImportVisitor", MdastBlockQuoteVisitor);
-    realm.pubKey("addLexicalNode", QuoteNode);
-    realm.pubKey("addExportVisitor", LexicalQuoteVisitor);
+import { realmPlugin } from "../../RealmWithPlugins.js";
+import { addActivePlugin$, addImportVisitor$, addLexicalNode$, addExportVisitor$ } from "../core/index.js";
+const quotePlugin = realmPlugin({
+  init(realm) {
+    realm.pubIn({
+      [addActivePlugin$]: "quote",
+      [addImportVisitor$]: MdastBlockQuoteVisitor,
+      [addLexicalNode$]: QuoteNode,
+      [addExportVisitor$]: LexicalQuoteVisitor
+    });
   }
 });
 export {
-  quotePlugin,
-  quotePluginHooks
+  quotePlugin
 };

package/dist/plugins/sandpack/SandpackEditor.js

@@ -2,7 +2,8 @@ import React__default from "react";
 import { useCodeMirrorRef } from "./useCodeMirrorRef.js";
 import { SandpackProvider, SandpackLayout, SandpackCodeEditor, SandpackPreview, useSandpack } from "@codesandbox/sandpack-react";
 import { useCodeBlockEditorContext } from "../codeblock/CodeBlockNode.js";
-import { corePluginHooks } from "../core/index.js";
+import { readOnly$ } from "../core/index.js";
+import { useCellValue } from "@mdxeditor/gurx";
 const CodeUpdateEmitter = ({ onChange, snippetFileName }) => {
   const { sandpack } = useSandpack();
   onChange(sandpack.files[snippetFileName].code);
@@ -10,7 +11,7 @@ const CodeUpdateEmitter = ({ onChange, snippetFileName }) => {
 };
 const SandpackEditor = ({ nodeKey, code, focusEmitter, preset }) => {
   const codeMirrorRef = useCodeMirrorRef(nodeKey, "sandpack", "jsx", focusEmitter);
-  const [readOnly] = corePluginHooks.useEmitterValues("readOnly");
+  const readOnly = useCellValue(readOnly$);
   const { setCode } = useCodeBlockEditorContext();
   return /* @__PURE__ */ React__default.createElement(
     SandpackProvider,

package/dist/plugins/sandpack/index.js

@@ -1,9 +1,8 @@
 import React__default from "react";
-import { coreSystem } from "../core/index.js";
-import { codeBlockSystem } from "../codeblock/index.js";
+import { insertCodeBlock$, appendCodeBlockEditorDescriptor$ } from "../codeblock/index.js";
 import { SandpackEditor } from "./SandpackEditor.js";
-import { system } from "../../gurx/realmFactory.js";
-import { realmPlugin } from "../../gurx/react.js";
+import { Cell, Signal, withLatestFrom, map, useCellValue } from "@mdxeditor/gurx";
+import { realmPlugin } from "../../RealmWithPlugins.js";
 const defaultSnippetContent = `
 export default function App() {
   return (
@@ -29,54 +28,36 @@ const defaultSandpackConfig = {
     }
   ]
 };
-const sandpackSystem = system(
-  (r, [, { insertCodeBlock }]) => {
-    const sandpackConfig = r.node(defaultSandpackConfig);
-    const insertSandpack = r.node();
-    r.link(
-      r.pipe(
-        insertSandpack,
-        r.o.withLatestFrom(sandpackConfig),
-        r.o.map(([presetName, sandpackConfig2]) => {
-          const preset = presetName ? sandpackConfig2.presets.find((preset2) => preset2.name === presetName) : sandpackConfig2.presets.find((preset2) => preset2.name == sandpackConfig2.defaultPreset);
-          if (!preset) {
-            throw new Error(`No sandpack preset found with name ${presetName}`);
-          }
-          return {
-            code: preset.initialSnippetContent || "",
-            language: preset.snippetLanguage || "jsx",
-            meta: preset.meta
-          };
-        })
-      ),
-      insertCodeBlock
-    );
-    return {
-      insertSandpack,
-      sandpackConfig
-    };
-  },
-  [coreSystem, codeBlockSystem]
-);
-const [
-  /** @internal */
-  sandpackPlugin,
-  /** @internal */
-  sandpackPluginHooks
-] = realmPlugin({
-  id: "sandpack",
-  systemSpec: sandpackSystem,
-  applyParamsToSystem(r, params) {
-    r.pubKey("sandpackConfig", params.sandpackConfig);
-  },
-  init(r) {
-    r.pubKey("appendCodeBlockEditorDescriptor", {
+const sandpackConfig$ = Cell(defaultSandpackConfig);
+const insertSandpack$ = Signal((r) => {
+  r.link(
+    r.pipe(
+      insertSandpack$,
+      withLatestFrom(sandpackConfig$),
+      map(([presetName, sandpackConfig]) => {
+        const preset = presetName ? sandpackConfig.presets.find((preset2) => preset2.name === presetName) : sandpackConfig.presets.find((preset2) => preset2.name == sandpackConfig.defaultPreset);
+        if (!preset) {
+          throw new Error(`No sandpack preset found with name ${presetName}`);
+        }
+        return {
+          code: preset.initialSnippetContent || "",
+          language: preset.snippetLanguage || "jsx",
+          meta: preset.meta
+        };
+      })
+    ),
+    insertCodeBlock$
+  );
+});
+const sandpackPlugin = realmPlugin({
+  init(realm) {
+    realm.pub(appendCodeBlockEditorDescriptor$, {
       match(_language, meta) {
         return meta == null ? void 0 : meta.startsWith("live");
       },
       priority: 1,
       Editor(props) {
-        const [config] = sandpackPluginHooks.useEmitterValues("sandpackConfig");
+        const config = useCellValue(sandpackConfig$);
         const preset = config.presets.find((preset2) => preset2.meta === props.meta);
         if (!preset) {
           throw new Error(`No sandpack preset found with ${props.meta}`);
@@ -84,10 +65,13 @@ const [
         return /* @__PURE__ */ React__default.createElement(SandpackEditor, { ...props, preset });
       }
     });
+  },
+  update(realm, params) {
+    realm.pub(sandpackConfig$, params == null ? void 0 : params.sandpackConfig);
   }
 });
 export {
-  sandpackPlugin,
-  sandpackPluginHooks,
-  sandpackSystem
+  insertSandpack$,
+  sandpackConfig$,
+  sandpackPlugin
 };

package/dist/plugins/sandpack/useCodeMirrorRef.js

@@ -1,10 +1,11 @@
 import { $getNodeByKey, $createParagraphNode } from "lexical";
 import React__default from "react";
 import { useCodeBlockEditorContext } from "../codeblock/CodeBlockNode.js";
-import { corePluginHooks } from "../core/index.js";
+import { activeEditor$, editorInFocus$ } from "../core/index.js";
+import { useCellValue, usePublisher } from "@mdxeditor/gurx";
 function useCodeMirrorRef(nodeKey, editorType, language, focusEmitter) {
-  const [theEditor] = corePluginHooks.useEmitterValues("activeEditor");
-  const setEditorInFocus = corePluginHooks.usePublisher("editorInFocus");
+  const activeEditor = useCellValue(activeEditor$);
+  const setEditorInFocus = usePublisher(editorInFocus$);
   const codeMirrorRef = React__default.useRef(null);
   const { lexicalNode } = useCodeBlockEditorContext();
   const atBottom = React__default.useRef(false);
@@ -27,7 +28,7 @@ function useCodeMirrorRef(nodeKey, editorType, language, focusEmitter) {
             if (!atBottom.current) {
               atBottom.current = true;
             } else {
-              theEditor == null ? void 0 : theEditor.update(() => {
+              activeEditor == null ? void 0 : activeEditor.update(() => {
                 var _a2, _b2;
                 const node = $getNodeByKey(nodeKey);
                 const nextSibling = node.getNextSibling();
@@ -50,7 +51,7 @@ function useCodeMirrorRef(nodeKey, editorType, language, focusEmitter) {
             if (!atTop.current) {
               atTop.current = true;
             } else {
-              theEditor == null ? void 0 : theEditor.update(() => {
+              activeEditor == null ? void 0 : activeEditor.update(() => {
                 var _a2, _b2;
                 const node = $getNodeByKey(nodeKey);
                 const previousSibling = node.getPreviousSibling();
@@ -67,7 +68,7 @@ function useCodeMirrorRef(nodeKey, editorType, language, focusEmitter) {
         e.stopPropagation();
       }
     },
-    [theEditor, nodeKey]
+    [activeEditor, nodeKey]
   );
   React__default.useEffect(() => {
     const codeMirror = codeMirrorRef.current;

package/dist/plugins/table/TableEditor.js

@@ -15,7 +15,8 @@ import classNames from "classnames";
 import styles from "../../styles/ui.module.css.js";
 import { isPartOftheEditorUI } from "../../utils/isPartOftheEditorUI.js";
 import { uuidv4 } from "../../utils/uuid4.js";
-import { corePluginHooks } from "../core/index.js";
+import { iconComponentFor$, readOnly$, importVisitors$, exportVisitors$, usedLexicalNodes$, jsxComponentDescriptors$, jsxIsAvailable$, rootEditor$, NESTED_EDITOR_UPDATED_COMMAND, editorRootElementRef$ } from "../core/index.js";
+import { useCellValues } from "@mdxeditor/gurx";
 const AlignToTailwindClassMap = {
   center: styles.centeredCell,
   left: styles.leftAlignedCell,
@@ -23,7 +24,7 @@ const AlignToTailwindClassMap = {
 };
 const TableEditor = ({ mdastNode, parentEditor, lexicalTable }) => {
   const [activeCell, setActiveCell] = React__default.useState(null);
-  const [iconComponentFor, readOnly] = corePluginHooks.useEmitterValues("iconComponentFor", "readOnly");
+  const [iconComponentFor, readOnly] = useCellValues(iconComponentFor$, readOnly$);
   const getCellKey = React__default.useMemo(() => {
     return (cell) => {
       if (!cell.__cacheKey) {
@@ -187,13 +188,13 @@ const Cell = ({ align, ...props }) => {
   );
 };
 const CellEditor = ({ focus, setActiveCell, parentEditor, lexicalTable, contents, colIndex, rowIndex }) => {
-  const [importVisitors, exportVisitors, usedLexicalNodes, jsxComponentDescriptors, jsxIsAvailable, rootEditor] = corePluginHooks.useEmitterValues(
-    "importVisitors",
-    "exportVisitors",
-    "usedLexicalNodes",
-    "jsxComponentDescriptors",
-    "jsxIsAvailable",
-    "rootEditor"
+  const [importVisitors, exportVisitors, usedLexicalNodes, jsxComponentDescriptors, jsxIsAvailable, rootEditor] = useCellValues(
+    importVisitors$,
+    exportVisitors$,
+    usedLexicalNodes$,
+    jsxComponentDescriptors$,
+    jsxIsAvailable$,
+    rootEditor$
   );
   const [editor] = React__default.useState(() => {
     const editor2 = createEditor({
@@ -267,6 +268,14 @@ const CellEditor = ({ focus, setActiveCell, parentEditor, lexicalTable, contents
           return true;
         },
         COMMAND_PRIORITY_CRITICAL
+      ),
+      editor.registerCommand(
+        NESTED_EDITOR_UPDATED_COMMAND,
+        () => {
+          saveAndFocus(null);
+          return true;
+        },
+        COMMAND_PRIORITY_CRITICAL
       )
     );
   }, [colIndex, editor, rootEditor, rowIndex, saveAndFocus, setActiveCell]);
@@ -283,8 +292,7 @@ const ColumnEditor = ({
   colIndex,
   setActiveCellWithBoundaries
 }) => {
-  const [editorRootElementRef] = corePluginHooks.useEmitterValues("editorRootElementRef");
-  const [iconComponentFor] = corePluginHooks.useEmitterValues("iconComponentFor");
+  const [editorRootElementRef, iconComponentFor] = useCellValues(editorRootElementRef$, iconComponentFor$);
   const insertColumnAt = React__default.useCallback(
     (colIndex2) => {
       parentEditor.update(() => {
@@ -351,8 +359,7 @@ const RowEditor = ({
   rowIndex,
   setActiveCellWithBoundaries
 }) => {
-  const [editorRootElementRef] = corePluginHooks.useEmitterValues("editorRootElementRef");
-  const [iconComponentFor] = corePluginHooks.useEmitterValues("iconComponentFor");
+  const [editorRootElementRef, iconComponentFor] = useCellValues(editorRootElementRef$, iconComponentFor$);
   const insertRowAt = React__default.useCallback(
     (rowIndex2) => {
       parentEditor.update(() => {

package/dist/plugins/table/TableNode.js

@@ -21,21 +21,31 @@ function coordinatesEmitter() {
   };
 }
 class TableNode extends DecoratorNode {
+  /**
+   * Constructs a new {@link TableNode} with the specified MDAST table node as the object to edit.
+   * See {@link https://github.com/micromark/micromark-extension-gfm-table | micromark/micromark-extension-gfm-table} for more information on the MDAST table node.
+   */
   constructor(mdastNode, key) {
     super(key);
+    /** @internal */
     __publicField(this, "__mdastNode");
+    /** @internal */
     __publicField(this, "focusEmitter", coordinatesEmitter());
     this.__mdastNode = mdastNode || { type: "table", children: [] };
   }
+  /** @internal */
   static getType() {
     return "table";
   }
+  /** @internal */
   static clone(node) {
     return new TableNode(structuredClone(node.__mdastNode), node.__key);
   }
+  /** @internal */
   static importJSON(serializedNode) {
     return $createTableNode(serializedNode.mdastNode);
   }
+  /** @internal */
   exportJSON() {
     return {
       mdastNode: structuredClone(this.__mdastNode),
@@ -43,22 +53,34 @@ class TableNode extends DecoratorNode {
       version: 1
     };
   }
+  /**
+   * Returns the mdast node that this node is constructed from.
+   */
   getMdastNode() {
     return this.__mdastNode;
   }
+  /**
+   * Returns the number of rows in the table.
+   */
   getRowCount() {
     return this.__mdastNode.children.length;
   }
+  /**
+   * Returns the number of columns in the table.
+   */
   getColCount() {
     var _a;
     return ((_a = this.__mdastNode.children[0]) == null ? void 0 : _a.children.length) || 0;
   }
+  /** @internal */
   createDOM() {
     return document.createElement("div");
   }
+  /** @internal */
   updateDOM() {
     return false;
   }
+  /** @internal */
   updateCellContents(colIndex, rowIndex, children) {
     const self = this.getWritable();
     const table = self.__mdastNode;
@@ -129,12 +151,18 @@ class TableNode extends DecoratorNode {
     }
     table.align[colIndex] = align;
   }
+  /** @internal */
   decorate(parentEditor) {
     return /* @__PURE__ */ React__default.createElement(TableEditor, { lexicalTable: this, mdastNode: this.__mdastNode, parentEditor });
   }
+  /**
+   * Focuses the table cell at the specified coordinates.
+   * Pass `undefined` to remove the focus.
+   */
   select(coords) {
     this.focusEmitter.publish(coords || [0, 0]);
   }
+  /** @internal */
   isInline() {
     return false;
   }

package/dist/plugins/table/index.js

@@ -1,11 +1,12 @@
+import { realmPlugin } from "../../RealmWithPlugins.js";
+import { Signal, map } from "@mdxeditor/gurx";
 import { gfmTableFromMarkdown, gfmTableToMarkdown } from "mdast-util-gfm-table";
 import { gfmTable } from "micromark-extension-gfm-table";
-import { coreSystem } from "../core/index.js";
+import { insertDecoratorNode$, addMdastExtension$, addSyntaxExtension$, addImportVisitor$, addLexicalNode$, addExportVisitor$, addToMarkdownExtension$ } from "../core/index.js";
 import { LexicalTableVisitor } from "./LexicalTableVisitor.js";
 import { MdastTableVisitor } from "./MdastTableVisitor.js";
 import { $createTableNode, TableNode } from "./TableNode.js";
-import { system } from "../../gurx/realmFactory.js";
-import { realmPlugin } from "../../gurx/react.js";
+import { $isTableNode } from "./TableNode.js";
 function seedTable(rows = 1, columns = 1) {
   const table = {
     type: "table",
@@ -27,43 +28,35 @@ function seedTable(rows = 1, columns = 1) {
   }
   return table;
 }
-const tableSystem = system(
-  (r, [{ insertDecoratorNode }]) => {
-    const insertTable = r.node();
-    r.link(
-      r.pipe(
-        insertTable,
-        r.o.map(({ rows, columns }) => {
-          return () => $createTableNode(seedTable(rows, columns));
-        })
-      ),
-      insertDecoratorNode
-    );
-    return {
-      insertTable
-    };
-  },
-  [coreSystem]
-);
-const [
-  /** @internal */
-  tablePlugin,
-  /** @internal */
-  tablePluginHooks
-] = realmPlugin({
-  id: "table",
-  systemSpec: tableSystem,
-  init: (realm) => {
-    realm.pubKey("addMdastExtension", gfmTableFromMarkdown);
-    realm.pubKey("addSyntaxExtension", gfmTable);
-    realm.pubKey("addImportVisitor", MdastTableVisitor);
-    realm.pubKey("addLexicalNode", TableNode);
-    realm.pubKey("addExportVisitor", LexicalTableVisitor);
-    realm.pubKey("addToMarkdownExtension", gfmTableToMarkdown({ tableCellPadding: true, tablePipeAlign: true }));
+const insertTable$ = Signal((r) => {
+  r.link(
+    r.pipe(
+      insertTable$,
+      map(({ rows, columns }) => {
+        return () => $createTableNode(seedTable(rows, columns));
+      })
+    ),
+    insertDecoratorNode$
+  );
+});
+const tablePlugin = realmPlugin({
+  init(realm) {
+    realm.pubIn({
+      // import
+      [addMdastExtension$]: gfmTableFromMarkdown(),
+      [addSyntaxExtension$]: gfmTable(),
+      [addImportVisitor$]: MdastTableVisitor,
+      // export
+      [addLexicalNode$]: TableNode,
+      [addExportVisitor$]: LexicalTableVisitor,
+      [addToMarkdownExtension$]: gfmTableToMarkdown({ tableCellPadding: true, tablePipeAlign: true })
+    });
   }
 });
 export {
-  tablePlugin,
-  tablePluginHooks,
-  tableSystem
+  $createTableNode,
+  $isTableNode,
+  TableNode,
+  insertTable$,
+  tablePlugin
 };

package/dist/plugins/thematic-break/index.js

@@ -1,39 +1,26 @@
-import { coreSystem } from "../core/index.js";
-import { MdastThematicBreakVisitor } from "./MdastThematicBreakVisitor.js";
-import { LexicalThematicBreakVisitor } from "./LexicalThematicBreakVisitor.js";
+import { realmPlugin } from "../../RealmWithPlugins.js";
 import { INSERT_HORIZONTAL_RULE_COMMAND, HorizontalRuleNode } from "@lexical/react/LexicalHorizontalRuleNode.js";
 import { HorizontalRulePlugin } from "@lexical/react/LexicalHorizontalRulePlugin.js";
-import { system } from "../../gurx/realmFactory.js";
-import { realmPlugin } from "../../gurx/react.js";
-const thematicBreakSystem = system(
-  (r, [{ activeEditor }]) => {
-    const insertThematicBreak = r.node();
-    r.sub(r.pipe(insertThematicBreak, r.o.withLatestFrom(activeEditor)), ([, theEditor]) => {
-      theEditor == null ? void 0 : theEditor.dispatchCommand(INSERT_HORIZONTAL_RULE_COMMAND, void 0);
+import { Action, withLatestFrom } from "@mdxeditor/gurx";
+import { activeEditor$, addImportVisitor$, addLexicalNode$, addExportVisitor$, addComposerChild$ } from "../core/index.js";
+import { LexicalThematicBreakVisitor } from "./LexicalThematicBreakVisitor.js";
+import { MdastThematicBreakVisitor } from "./MdastThematicBreakVisitor.js";
+const insertThematicBreak$ = Action((r) => {
+  r.sub(r.pipe(insertThematicBreak$, withLatestFrom(activeEditor$)), ([, theEditor]) => {
+    theEditor == null ? void 0 : theEditor.dispatchCommand(INSERT_HORIZONTAL_RULE_COMMAND, void 0);
+  });
+});
+const thematicBreakPlugin = realmPlugin({
+  init(realm) {
+    realm.pubIn({
+      [addImportVisitor$]: MdastThematicBreakVisitor,
+      [addLexicalNode$]: HorizontalRuleNode,
+      [addExportVisitor$]: LexicalThematicBreakVisitor,
+      [addComposerChild$]: HorizontalRulePlugin
     });
-    return {
-      insertThematicBreak
-    };
-  },
-  [coreSystem]
-);
-const [
-  /** @internal */
-  thematicBreakPlugin,
-  /** @internal */
-  thematicBreakPluginHooks
-] = realmPlugin({
-  id: "thematic-break",
-  systemSpec: thematicBreakSystem,
-  init: (realm) => {
-    realm.pubKey("addImportVisitor", MdastThematicBreakVisitor);
-    realm.pubKey("addLexicalNode", HorizontalRuleNode);
-    realm.pubKey("addExportVisitor", LexicalThematicBreakVisitor);
-    realm.pubKey("addComposerChild", HorizontalRulePlugin);
   }
 });
 export {
-  thematicBreakPlugin,
-  thematicBreakPluginHooks,
-  thematicBreakSystem
+  insertThematicBreak$,
+  thematicBreakPlugin
 };

package/dist/plugins/toolbar/components/BlockTypeSelect.js

@@ -1,15 +1,16 @@
 import { $createHeadingNode, $createQuoteNode } from "@lexical/rich-text";
+import { usePublisher, useCellValue } from "@mdxeditor/gurx";
 import { $createParagraphNode } from "lexical";
 import React__default from "react";
-import { corePluginHooks } from "../../core/index.js";
+import { convertSelectionToNode$, currentBlockType$, activePlugins$ } from "../../core/index.js";
+import { allowedHeadingLevels$ } from "../../headings/index.js";
 import { Select } from "../primitives/select.js";
-import { headingsPluginHooks } from "../../headings/index.js";
-import { useHasPlugin } from "../../../gurx/react.js";
 const BlockTypeSelect = () => {
-  const convertSelectionToNode = corePluginHooks.usePublisher("convertSelectionToNode");
-  const [currentBlockType] = corePluginHooks.useEmitterValues("currentBlockType");
-  const hasQuote = useHasPlugin("quote");
-  const hasHeadings = useHasPlugin("headings");
+  const convertSelectionToNode = usePublisher(convertSelectionToNode$);
+  const currentBlockType = useCellValue(currentBlockType$);
+  const activePlugins = useCellValue(activePlugins$);
+  const hasQuote = activePlugins.includes("quote");
+  const hasHeadings = activePlugins.includes("headings");
   if (!hasQuote && !hasHeadings) {
     return null;
   }
@@ -18,7 +19,7 @@ const BlockTypeSelect = () => {
     items.push({ label: "Quote", value: "quote" });
   }
   if (hasHeadings) {
-    const [allowedHeadingLevels] = headingsPluginHooks.useEmitterValues("allowedHeadingLevels");
+    const allowedHeadingLevels = useCellValue(allowedHeadingLevels$);
     items.push(...allowedHeadingLevels.map((n) => ({ label: `Heading ${n}`, value: `h${n}` })));
   }
   return /* @__PURE__ */ React__default.createElement(

package/dist/plugins/toolbar/components/BoldItalicUnderlineToggles.js

@@ -1,17 +1,17 @@
+import { currentFormat$, iconComponentFor$, applyFormat$ } from "../../core/index.js";
+import { useCellValues, usePublisher } from "@mdxeditor/gurx";
 import React__default from "react";
-import { corePluginHooks } from "../../core/index.js";
 import { IS_BOLD, IS_ITALIC, IS_UNDERLINE } from "../../../FormatConstants.js";
 import { MultipleChoiceToggleGroup } from "../primitives/toolbar.js";
 const BoldItalicUnderlineToggles = () => {
-  const [currentFormat] = corePluginHooks.useEmitterValues("currentFormat");
-  const applyFormat = corePluginHooks.usePublisher("applyFormat");
+  const [currentFormat, iconComponentFor] = useCellValues(currentFormat$, iconComponentFor$);
+  const applyFormat = usePublisher(applyFormat$);
   const boldIsOn = (currentFormat & IS_BOLD) !== 0;
   const italicIsOn = (currentFormat & IS_ITALIC) !== 0;
   const underlineIsOn = (currentFormat & IS_UNDERLINE) !== 0;
   const boldTitle = boldIsOn ? "Remove bold" : "Bold";
   const italicTitle = italicIsOn ? "Remove italic" : "Italic";
   const underlineTitle = underlineIsOn ? "Remove underline" : "Underline";
-  const [iconComponentFor] = corePluginHooks.useEmitterValues("iconComponentFor");
   return /* @__PURE__ */ React__default.createElement(
     MultipleChoiceToggleGroup,
     {

package/dist/plugins/toolbar/components/ChangeAdmonitionType.js

@@ -1,9 +1,10 @@
 import React__default from "react";
-import { corePluginHooks } from "../../core/index.js";
+import { editorInFocus$, rootEditor$ } from "../../core/index.js";
 import { Select } from "../primitives/select.js";
 import { ADMONITION_TYPES } from "../../../directive-editors/AdmonitionDirectiveDescriptor.js";
+import { useCellValues } from "@mdxeditor/gurx";
 const ChangeAdmonitionType = () => {
-  const [editorInFocus, rootEditor] = corePluginHooks.useEmitterValues("editorInFocus", "rootEditor");
+  const [editorInFocus, rootEditor] = useCellValues(editorInFocus$, rootEditor$);
   const admonitionNode = editorInFocus.rootNode;
   return /* @__PURE__ */ React__default.createElement(
     Select,

package/dist/plugins/toolbar/components/ChangeCodeMirrorLanguage.js

@@ -1,12 +1,12 @@
+import { useCellValues } from "@mdxeditor/gurx";
 import React__default from "react";
-import { corePluginHooks } from "../../core/index.js";
-import { Select } from "../primitives/select.js";
-import { codeMirrorHooks } from "../../codemirror/index.js";
 import styles from "../../../styles/ui.module.css.js";
+import { codeBlockLanguages$ } from "../../codemirror/index.js";
+import { editorInFocus$, activeEditor$ } from "../../core/index.js";
+import { Select } from "../primitives/select.js";
 const ChangeCodeMirrorLanguage = () => {
-  const [editorInFocus, theEditor] = corePluginHooks.useEmitterValues("editorInFocus", "activeEditor");
+  const [editorInFocus, theEditor, codeBlockLanguages] = useCellValues(editorInFocus$, activeEditor$, codeBlockLanguages$);
   const codeBlockNode = editorInFocus.rootNode;
-  const [codeBlockLanguages] = codeMirrorHooks.useEmitterValues("codeBlockLanguages");
   return /* @__PURE__ */ React__default.createElement("div", { className: styles.selectWithLabel }, /* @__PURE__ */ React__default.createElement("label", null, "Code block language:"), /* @__PURE__ */ React__default.createElement(
     Select,
     {

package/dist/plugins/toolbar/components/CodeToggle.js

@@ -1,10 +1,11 @@
 import React__default from "react";
 import { IS_CODE } from "../../../FormatConstants.js";
-import { corePluginHooks } from "../../core/index.js";
+import { currentFormat$, iconComponentFor$, applyFormat$ } from "../../core/index.js";
 import { MultipleChoiceToggleGroup } from "../primitives/toolbar.js";
+import { useCellValues, usePublisher } from "@mdxeditor/gurx";
 const CodeToggle = () => {
-  const [currentFormat, iconComponentFor] = corePluginHooks.useEmitterValues("currentFormat", "iconComponentFor");
-  const applyFormat = corePluginHooks.usePublisher("applyFormat");
+  const [currentFormat, iconComponentFor] = useCellValues(currentFormat$, iconComponentFor$);
+  const applyFormat = usePublisher(applyFormat$);
   const codeIsOn = (currentFormat & IS_CODE) !== 0;
   const title = codeIsOn ? "Remove code format" : "Inline code format";
   return /* @__PURE__ */ React__default.createElement(

package/dist/plugins/toolbar/components/CreateLink.js

@@ -1,15 +1,17 @@
 import React__default from "react";
 import { ButtonWithTooltip } from "../primitives/toolbar.js";
-import { linkDialogPluginHooks } from "../../link-dialog/index.js";
+import { openLinkEditDialog$ } from "../../link-dialog/index.js";
+import { usePublisher, useCellValue } from "@mdxeditor/gurx";
+import { iconComponentFor$ } from "../../core/index.js";
 const CreateLink = () => {
-  const openLinkDialog = linkDialogPluginHooks.usePublisher("openLinkEditDialog");
-  const [iconComponentFor] = linkDialogPluginHooks.useEmitterValues("iconComponentFor");
+  const openLinkDialog = usePublisher(openLinkEditDialog$);
+  const iconComponentFor = useCellValue(iconComponentFor$);
   return /* @__PURE__ */ React__default.createElement(
     ButtonWithTooltip,
     {
       title: "Create link",
       onClick: (_) => {
-        openLinkDialog(true);
+        openLinkDialog();
       }
     },
     iconComponentFor("link")