@mdxeditor/editor 3.0.6 → 3.0.8

package/dist/index.d.ts

@@ -1,38 +1,7 @@
-/**
- * The `@mdxeditor/editor` package exports the MDXEditor React component and a set of plugins and
- * pre-made components for  editing/editor UI.
- *
- * The API Reference is organized around the various features of the editor. Usually, each feature is implemented as a plugin.
- *
- * Several note-worthy types of exports are available:
- *
- * **dollar-suffixed variables** (e.g. `markdown$`, `applyBlockType$`, etc.). These are [reactive Gurx primitives (Cells and Signals)](https://mdx-editor.github.io/gurx/)
- * which let you interact with the editor state and extend it with your own custom logic.
- *
- * The MDXEditor package re-exports Gurx's React hooks, so you can use them like this for example:
- * ```tsx
- * // use the markdown$ cell to get the current markdown value,
- * // and the rootEditor$ cell to get the Lexical editor instance.
- * const [markdown, rootEditor] = useCellValues([markdown$, rootEditor$])
- * // use the applyBlockType$ signal to apply a block type to the current selection
- * const applyBlockType = usePublisher(applyBlockType$)
- * ```
- *
- * **dollar-prefixed functions** (e.g. `$isCodeBlockNode`, etc.). These are following the conventions of the Lexical API, and are usually usable within the Lexical editor read/update cycles.
- *
- * **`plugin` functions** - these are functions that return a plugin object that can be passed to the `plugins` prop of the MDXEditor component. They usually accept a set of configuration options specific to the features they provide.
- *
- * **MDAST Nodes, Lexical Nodes and Import/Export visitors** - these are part of the bi-directional Markdown to/from Lexical state conversion API.
- *
- * **Toolbar plugins and primitives** - React components that can be used in the Editor toolbar. The primitives are meant to be used to build your own toolbar items.
- *
- * @packageDocumentation
- */
-
-/// <reference types="react" />
-
 import { Config } from 'mdast-util-from-markdown/lib';
+import { ContentEditable } from '@lexical/react/LexicalContentEditable.js';
 import { DecoratorNode } from 'lexical';
+import { default as default_2 } from 'react';
 import { Directives } from 'mdast-util-directive';
 import { DOMConversionMap } from 'lexical';
 import { DOMExportOutput } from 'lexical';
@@ -61,7 +30,6 @@ import { Options as Options_2 } from 'mdast-util-to-markdown/lib/types';
 import { ParseOptions } from 'micromark-util-types';
 import * as RadixToolbar from '@radix-ui/react-toolbar';
 import { RangeSelection } from 'lexical';
-import { default as React_2 } from 'react';
 import { ReactNode } from 'react';
 import { Realm } from '@mdxeditor/gurx';
 import { RootNode } from 'lexical';
@@ -160,23 +128,23 @@ export declare const addActivePlugin$: NodeRef<string | string[]>;
  * Lets you add React components to the {@link https://lexical.dev/docs/react/plugins | Lexical Composer} element.
  * @group Core
  */
-export declare const addComposerChild$: NodeRef<React_2.ComponentType<{}> | React_2.ComponentType<{}>[]>;
+export declare const addComposerChild$: NodeRef<default_2.ComponentType<{}> | default_2.ComponentType<{}>[]>;
 
 /**
  * Lets you add React components as wrappers around the editor.
  * @group Core
  */
-export declare const addEditorWrapper$: NodeRef<React_2.ComponentType<{
-    children: React_2.ReactNode;
-}> | React_2.ComponentType<{
-    children: React_2.ReactNode;
+export declare const addEditorWrapper$: NodeRef<default_2.ComponentType<{
+    children: default_2.ReactNode;
+}> | default_2.ComponentType<{
+    children: default_2.ReactNode;
 }>[]>;
 
 /**
  * Adds an export visitor to be used when exporting markdown from the Lexical tree.
  * @group Markdown Processing
  */
-export declare const addExportVisitor$: NodeRef<LexicalVisitor | LexicalVisitor[]>;
+export declare const addExportVisitor$: NodeRef< LexicalVisitor | LexicalVisitor[]>;
 
 /**
  * Registers a visitor to be used when importing markdown.
@@ -188,37 +156,37 @@ export declare const addImportVisitor$: NodeRef<MdastImportVisitor<Mdast.Nodes>
  * Registers a lexical node to be used in the editor.
  * @group Core
  */
-export declare const addLexicalNode$: NodeRef<KlassConstructor<typeof LexicalNode> | KlassConstructor<typeof LexicalNode>[]>;
+export declare const addLexicalNode$: NodeRef< KlassConstructor<typeof LexicalNode> | KlassConstructor<typeof LexicalNode>[]>;
 
 /**
  * Adds a mdast extension to the markdown parser.
  * @group Markdown Processing
  */
-export declare const addMdastExtension$: NodeRef<Partial<Config> | Partial<Config>[] | (Partial<Config> | Partial<Config>[])[]>;
+export declare const addMdastExtension$: NodeRef<Partial< Config> | Partial< Config>[] | (Partial< Config> | Partial< Config>[])[]>;
 
 /**
  * Lets you add React components as children of any registered nested editor (useful for Lexical plugins).
  * @group Core
  */
-export declare const addNestedEditorChild$: NodeRef<React_2.ComponentType<{}> | React_2.ComponentType<{}>[]>;
+export declare const addNestedEditorChild$: NodeRef<default_2.ComponentType<{}> | default_2.ComponentType<{}>[]>;
 
 /**
  * Adds a syntax extension to the markdown parser.
  * @group Markdown Processing
  */
-export declare const addSyntaxExtension$: NodeRef<Extension | Extension[]>;
+export declare const addSyntaxExtension$: NodeRef< Extension | Extension[]>;
 
 /**
  * Adds a markdown to string extension to be used when exporting markdown from the Lexical tree.
  * @group Markdown Processing
  */
-export declare const addToMarkdownExtension$: NodeRef<Options_2 | Options_2[]>;
+export declare const addToMarkdownExtension$: NodeRef< Options_2 | Options_2[]>;
 
 /**
  * Lets you add React components on top of the editor (like the toolbar).
  * @group Core
  */
-export declare const addTopAreaChild$: NodeRef<React_2.ComponentType<{}> | React_2.ComponentType<{}>[]>;
+export declare const addTopAreaChild$: NodeRef<default_2.ComponentType<{}> | default_2.ComponentType<{}>[]>;
 
 /* Excluded from this release type: ADMONITION_TYPES */
 
@@ -307,19 +275,19 @@ export declare type BlockType = 'paragraph' | 'quote' | HeadingTagType | '';
  * Supports paragraphs, headings and block quotes.
  * @group Toolbar Components
  */
-export declare const BlockTypeSelect: () => React_2.JSX.Element | null;
+export declare const BlockTypeSelect: () => default_2.JSX.Element | null;
 
 /**
  * A toolbar component that lets the user toggle bold, italic and underline formatting.
  * @group Toolbar Components
  */
-export declare const BoldItalicUnderlineToggles: React_2.FC;
+export declare const BoldItalicUnderlineToggles: default_2.FC;
 
 /**
  * A toolbar button primitive.
  * @group Toolbar Primitives
  */
-export declare const Button: React_2.ForwardRefExoticComponent<Omit<RadixToolbar.ToolbarButtonProps & React_2.RefAttributes<HTMLButtonElement>, "ref"> & React_2.RefAttributes<object>>;
+export declare const Button: default_2.ForwardRefExoticComponent<Omit<RadixToolbar.ToolbarButtonProps & default_2.RefAttributes<HTMLButtonElement>, "ref"> & default_2.RefAttributes<object>>;
 
 /**
  * Use this primitive to create a toolbar button that can be either a button or a dropdown, depending on the number of items passed.
@@ -329,7 +297,7 @@ export declare const ButtonOrDropdownButton: <T extends string>(props: {
     /**
      * The contents of the button - usually an icon.
      */
-    children: React_2.ReactNode;
+    children: default_2.ReactNode;
     /**
      * The title used for the tooltip.
      */
@@ -352,15 +320,15 @@ export declare const ButtonOrDropdownButton: <T extends string>(props: {
          */
         label: string | JSX.Element;
     }[];
-}) => React_2.JSX.Element;
+}) => default_2.JSX.Element;
 
 /**
  * A toolbar button with tooltip primitive.
  * @group Toolbar Primitives
  */
-export declare const ButtonWithTooltip: ({ title, children, ...props }: Omit<RadixToolbar.ToolbarButtonProps & React_2.RefAttributes<HTMLButtonElement>, "ref"> & React_2.RefAttributes<object> & {
+export declare const ButtonWithTooltip: ({ title, children, ...props }: Omit<RadixToolbar.ToolbarButtonProps & default_2.RefAttributes<HTMLButtonElement>, "ref"> & default_2.RefAttributes<object> & {
     title: string;
-}) => React_2.JSX.Element;
+}) => default_2.JSX.Element;
 
 /**
  * Calls the passed function.
@@ -381,7 +349,7 @@ export declare const cancelLinkEdit$: NodeRef<void>;
  * For this component to work, you must pass the {@link AdmonitionDirectiveDescriptor} to the `directivesPlugin` `directiveDescriptors` parameter.
  * @group Toolbar Components
  */
-export declare const ChangeAdmonitionType: () => React_2.JSX.Element;
+export declare const ChangeAdmonitionType: () => default_2.JSX.Element;
 
 /**
  * A component that allows the user to change the code block language of the current selection.
@@ -389,7 +357,7 @@ export declare const ChangeAdmonitionType: () => React_2.JSX.Element;
  * See {@link ConditionalContents} for an example on how to display the dropdown only when a code block is in focus.
  * @group Toolbar Components
  */
-export declare const ChangeCodeMirrorLanguage: () => React_2.JSX.Element;
+export declare const ChangeCodeMirrorLanguage: () => default_2.JSX.Element;
 
 export declare type ClickLinkCallback = (url: string) => void;
 
@@ -547,7 +515,7 @@ export declare const codeBlockPlugin: (params?: {
  */
 export declare const codeMirrorAutoLoadLanguageSupport$: NodeRef<boolean>;
 
-export declare const CodeMirrorEditor: ({ language, nodeKey, code, focusEmitter }: CodeBlockEditorProps) => React_2.JSX.Element;
+export declare const CodeMirrorEditor: ({ language, nodeKey, code, focusEmitter }: CodeBlockEditorProps) => default_2.JSX.Element;
 
 /**
  * The code mirror extensions for the coemirror code block editor.
@@ -578,7 +546,7 @@ export declare const codeMirrorPlugin: (params?: {
  * Use for inline `code` elements (like variables, methods, etc).
  * @group Toolbar Components
  */
-export declare const CodeToggle: React_2.FC;
+export declare const CodeToggle: default_2.FC;
 
 export declare const COMMON_STATE_CONFIG_EXTENSIONS: Extension_2[];
 
@@ -613,7 +581,7 @@ export declare function compose<I, A, R>(a: (arg: A) => R, b: (arg: I) => A): (a
  * ```
  * @group Toolbar Primitives
  */
-export declare const ConditionalContents: React_2.FC<{
+export declare const ConditionalContents: default_2.FC<{
     /**
      * A set of options that define the contents to show based on the editor that is in focus.
      * Can be either a {@link ConditionalContentsOption} or a {@link FallbackOption}.
@@ -634,7 +602,7 @@ export declare type ConditionalContentsOption = {
     /**
      * The contents to display if the `when` function returns `true`.
      */
-    contents: () => React_2.ReactNode;
+    contents: () => default_2.ReactNode;
 };
 
 /**
@@ -711,7 +679,7 @@ export declare interface CreateImageNodeParameters {
  * For this component to work, you must include the `linkDialogPlugin`.
  * @group Toolbar Components
  */
-export declare const CreateLink: () => React_2.JSX.Element;
+export declare const CreateLink: () => default_2.JSX.Element;
 
 /**
  * An input signal that lets you register a new {@link EditorSubscription} for the root editor.
@@ -782,7 +750,7 @@ export declare interface Descriptors {
  * Use this primitive to create a toolbar button that opens a dialog with a text input, autocomplete suggestions, and a submit button.
  * @group Toolbar Primitives
  */
-export declare const DialogButton: React_2.ForwardRefExoticComponent<{
+export declare const DialogButton: default_2.ForwardRefExoticComponent<{
     /**
      * The autocomplete suggestions to show in the dialog input.
      */
@@ -802,7 +770,7 @@ export declare const DialogButton: React_2.ForwardRefExoticComponent<{
      * <DialogButton buttonContent={<CustomIcon />} />
      * ```
      */
-    buttonContent?: React_2.ReactNode;
+    buttonContent?: default_2.ReactNode;
     /**
      * The placeholder text to show in the dialog input.
      */
@@ -811,7 +779,7 @@ export declare const DialogButton: React_2.ForwardRefExoticComponent<{
      * The title of the submit button.
      */
     submitButtonTitle: string;
-} & React_2.RefAttributes<HTMLButtonElement>>;
+} & default_2.RefAttributes<HTMLButtonElement>>;
 
 /* Excluded from this release type: diffMarkdown$ */
 
@@ -856,8 +824,8 @@ export declare const diffSourcePlugin: (params?: {
  *
  * @group Toolbar Components
  */
-export declare const DiffSourceToggleWrapper: React_2.FC<{
-    children: React_2.ReactNode;
+export declare const DiffSourceToggleWrapper: default_2.FC<{
+    children: default_2.ReactNode;
     options?: ViewMode[];
 }>;
 
@@ -927,7 +895,7 @@ export declare interface DirectiveEditorProps<T extends Directives = Directives>
  * A lexical node that represents an image. Use {@link "$createDirectiveNode"} to construct one.
  * @group Directive
  */
-export declare class DirectiveNode extends DecoratorNode<React_2.JSX.Element> {
+export declare class DirectiveNode extends DecoratorNode<default_2.JSX.Element> {
     /* Excluded from this release type: __mdastNode */
     /* Excluded from this release type: __focusEmitter */
     /* Excluded from this release type: getType */
@@ -1025,7 +993,7 @@ export declare interface EditorInFocus {
  * A reference to a DOM element. used for the various popups, dialogs, and tooltips
  * @group Core
  */
-export declare const editorRootElementRef$: NodeRef<React_2.RefObject<HTMLDivElement> | null>;
+export declare const editorRootElementRef$: NodeRef<default_2.RefObject<HTMLDivElement> | null>;
 
 /**
  * A function that subscribes to Lexical editor updates or events, and retursns an unsubscribe function.
@@ -1058,7 +1026,7 @@ export declare type FallbackOption = {
     /**
      * The contents to display
      */
-    fallback: () => React_2.ReactNode;
+    fallback: () => default_2.ReactNode;
 };
 
 declare interface FileImageParameters extends BaseImageParameters {
@@ -1089,7 +1057,7 @@ export declare const frontmatterPlugin: (params?: unknown) => RealmPlugin;
  * Use this editor for the {@link DirectiveDescriptor} Editor option.
  * @group Directive
  */
-export declare const GenericDirectiveEditor: React_2.FC<DirectiveEditorProps>;
+export declare const GenericDirectiveEditor: default_2.FC<DirectiveEditorProps>;
 
 /**
  * A Lexical node that represents a generic HTML element. Use {@link $createGenericHTMLNode} to construct one.
@@ -1127,7 +1095,7 @@ export declare class GenericHTMLNode extends ElementNode {
  * Use this editor for the {@link JsxComponentDescriptor} Editor option.
  * @group JSX
  */
-export declare const GenericJsxEditor: React_2.FC<JsxEditorProps>;
+export declare const GenericJsxEditor: default_2.FC<JsxEditorProps>;
 
 /**
  * Gets the selected node from the Lexical editor.
@@ -1183,7 +1151,7 @@ export declare const htmlTags: readonly ["a", "abbr", "address", "area", "articl
  * A callback that returns the icon component for the given name.
  * @group Core
  */
-export declare const iconComponentFor$: NodeRef<(name: IconKey) => React_2.ReactNode>;
+export declare const iconComponentFor$: NodeRef<(name: IconKey) => default_2.ReactNode>;
 
 /**
  * A type that represents the possible icon names that can be used with the {@link iconComponentFor$} cell.
@@ -1322,7 +1290,7 @@ export declare const inFocus$: NodeRef<boolean>;
  *
  * @group Toolbar Components
  */
-export declare const InsertAdmonition: () => React_2.JSX.Element;
+export declare const InsertAdmonition: () => default_2.JSX.Element;
 
 /**
  * A signal that inserts a new code block into the editor with the published options.
@@ -1337,7 +1305,7 @@ export declare const insertCodeBlock$: NodeRef<Partial<CreateCodeBlockNodeOption
  *
  * @group Toolbar Components
  */
-export declare const InsertCodeBlock: React_2.FC;
+export declare const InsertCodeBlock: default_2.FC;
 
 /**
  * Inserts a new code mirror code block with the specified parameters.
@@ -1375,7 +1343,7 @@ export declare const insertFrontmatter$: NodeRef<void>;
  * For this to work, you need to have the `frontmatterPlugin` plugin enabled.
  * @group Toolbar Components
  */
-export declare const InsertFrontmatter: React_2.FC;
+export declare const InsertFrontmatter: default_2.FC;
 
 /**
  * A signal that inserts a new image node with the published payload.
@@ -1388,7 +1356,7 @@ export declare const insertImage$: NodeRef<InsertImageParameters>;
  * For the button to work, you need to have the `imagePlugin` plugin enabled.
  * @group Toolbar Components
  */
-export declare const InsertImage: React_2.ForwardRefExoticComponent<Omit<Record<string, never>, "ref"> & React_2.RefAttributes<HTMLButtonElement>>;
+export declare const InsertImage: default_2.ForwardRefExoticComponent<Omit<Record<string, never>, "ref"> & default_2.RefAttributes<HTMLButtonElement>>;
 
 /**
  * @group Image
@@ -1431,7 +1399,7 @@ export declare const insertSandpack$: NodeRef<string>;
  * For this to work, you need to have the `sandpackPlugin` installed.
  * @group Toolbar Components
  */
-export declare const InsertSandpack: () => React_2.JSX.Element;
+export declare const InsertSandpack: () => default_2.JSX.Element;
 
 /**
  * A signal that will insert a table with the published amount of rows and columns into the active editor.
@@ -1460,7 +1428,7 @@ export declare const insertTable$: NodeRef<{
  * For this button to work, you need to have the `tablePlugin` plugin enabled.
  * @group Toolbar Components
  */
-export declare const InsertTable: React_2.FC;
+export declare const InsertTable: default_2.FC;
 
 /**
  * Inserts a thematic break at the current selection.
@@ -1473,7 +1441,7 @@ export declare const insertThematicBreak$: NodeRef<void>;
  * For this button to work, you need to have the `thematicBreakPlugin` plugin enabled.
  * @group Toolbar Components
  */
-export declare const InsertThematicBreak: React_2.FC;
+export declare const InsertThematicBreak: default_2.FC;
 
 /**
  * Used to detect if the current platform is Apple based, mostly for keyboard shortcuts.
@@ -1544,7 +1512,7 @@ export declare interface JsxComponentDescriptor {
     /**
      * The editor to use for editing the component
      */
-    Editor: React_2.ComponentType<JsxEditorProps>;
+    Editor: default_2.ComponentType<JsxEditorProps>;
 }
 
 /**
@@ -1614,7 +1582,7 @@ export declare interface JsxPropertyDescriptor {
  * You'll probably want to create your own toolbar component that includes only the buttons that you need.
  * @group Toolbar Components
  */
-export declare const KitchenSinkToolbar: React_2.FC;
+export declare const KitchenSinkToolbar: default_2.FC;
 
 /**
  * All recognized HTML tags.
@@ -1750,7 +1718,7 @@ export declare const linkPlugin: (params?: {
      * An optional function to validate the URL of a link.
      * By default, no validation is performed.
      */
-    validateUrl?: React_2.ComponentProps<typeof LinkPlugin>['validateUrl'];
+    validateUrl?: default_2.ComponentProps<typeof LinkPlugin>['validateUrl'];
     /**
      * Whether to disable the auto-linking of URLs and email addresses.
      * @default false
@@ -1771,7 +1739,7 @@ export declare const listsPlugin: (params?: unknown) => RealmPlugin;
  * @group Toolbar Components
  * @param options - The list types that the user can toggle between. Defaults to `['bullet', 'number', 'check']`.
  */
-export declare const ListsToggle: React_2.FC<{
+export declare const ListsToggle: default_2.FC<{
     options?: Array<'bullet' | 'number' | 'check'>;
 }>;
 
@@ -1925,7 +1893,7 @@ export declare type MdastJsx = MdxJsxTextElement | MdxJsxFlowElement;
  * The MDXEditor React component.
  * @group MDXEditor
  */
-export declare const MDXEditor: React_2.ForwardRefExoticComponent<MDXEditorProps & React_2.RefAttributes<MDXEditorMethods>>;
+export declare const MDXEditor: default_2.ForwardRefExoticComponent<MDXEditorProps & default_2.RefAttributes<MDXEditorMethods>>;
 
 /**
  * The interface for the {@link MDXEditor} object reference.
@@ -2014,7 +1982,7 @@ export declare interface MDXEditorProps {
     /**
      * The placeholder contents, displayed when the editor is empty.
      */
-    placeholder?: React_2.ReactNode;
+    placeholder?: default_2.ReactNode;
     /**
      * pass if you would like to have the editor in read-only mode.
      * Note: Don't use this mode to render content for consumption - render the markdown using a library of your choice instead.
@@ -2044,10 +2012,10 @@ export declare type MdxNodeType = MdastHTMLNode['type'];
  * A toolbar primitive that allows you to build an UI with multiple non-exclusive toggle groups, like the bold/italic/underline toggle.
  * @group Toolbar Primitives
  */
-export declare const MultipleChoiceToggleGroup: React_2.FC<{
+export declare const MultipleChoiceToggleGroup: default_2.FC<{
     items: {
         title: string;
-        contents: React_2.ReactNode;
+        contents: default_2.ReactNode;
         active: boolean;
         onChange: (active: boolean) => void;
         disabled?: boolean;
@@ -2065,7 +2033,7 @@ export declare const muteChange$: NodeRef<boolean>;
  * Place it as a wrapper in your custom lexical node decorators.
  * @group Custom Editor Primitives
  */
-export declare const NestedEditorsContext: React_2.Context<NestedEditorsContextValue<Node_2> | undefined>;
+export declare const NestedEditorsContext: default_2.Context<NestedEditorsContextValue<Node_2> | undefined>;
 
 /**
  * The value of the {@link NestedEditorsContext} React context.
@@ -2128,25 +2096,12 @@ export declare const NestedLexicalEditor: <T extends Mdast.RootContent>(props: {
     /**
      * Props passed to the {@link https://github.com/facebook/lexical/blob/main/packages/lexical-react/src/LexicalContentEditable.tsx | ContentEditable} component.
      */
-    contentEditableProps?: ({
-        ariaActiveDescendant?: string | undefined;
-        ariaAutoComplete?: "list" | "none" | "inline" | "both" | undefined;
-        ariaControls?: string | undefined;
-        ariaDescribedBy?: string | undefined;
-        ariaExpanded?: (boolean | "true" | "false") | undefined;
-        ariaLabel?: string | undefined;
-        ariaLabelledBy?: string | undefined;
-        ariaMultiline?: (boolean | "true" | "false") | undefined;
-        ariaOwns?: string | undefined;
-        ariaRequired?: (boolean | "true" | "false") | undefined;
-        autoCapitalize?: string | undefined;
-        'data-testid'?: string | null | undefined;
-    } & React_2.AllHTMLAttributes<HTMLDivElement>) | undefined;
+    contentEditableProps?: default_2.ComponentProps<typeof ContentEditable>;
     /**
      * Whether or not the editor edits blocks (multiple paragraphs)
      */
-    block?: boolean | undefined;
-}) => React_2.JSX.Element;
+    block?: boolean;
+}) => default_2.JSX.Element;
 
 /**
  * The state of the image dialog when it is in new mode.
@@ -2219,7 +2174,7 @@ export declare function prop<T extends Record<string, unknown>>(property: keyof
  * Displays a simple, static key/value editing UI in a popover.
  * @group Custom Editor Primitives
  */
-export declare const PropertyPopover: React_2.FC<{
+export declare const PropertyPopover: default_2.FC<{
     /**
      * The properties to edit. The key is the name of the property, and the value is the initial value.
      */
@@ -2385,7 +2340,7 @@ export declare interface SandpackPreset {
     initialSnippetContent?: string;
 }
 
-declare type SandpackProviderProps = React_2.ComponentProps<typeof SandpackProvider>;
+declare type SandpackProviderProps = default_2.ComponentProps<typeof SandpackProvider>;
 
 /**
  * Saves the data from the image dialog
@@ -2410,11 +2365,11 @@ export declare const Select: <T extends string>(props: {
     onChange: (value: T) => void;
     triggerTitle: string;
     placeholder: string;
-    items: ("separator" | {
+    items: ({
         label: string | JSX.Element;
         value: T;
-    })[];
-}) => React_2.JSX.Element;
+    } | 'separator')[];
+}) => default_2.JSX.Element;
 
 /* Excluded from this release type: SelectButtonTrigger */
 
@@ -2429,7 +2384,7 @@ export declare const Select: <T extends string>(props: {
  * By default, the separator is styled as vertical line.
  * @group Toolbar Primitives
  */
-export declare const Separator: React_2.ForwardRefExoticComponent<RadixToolbar.ToolbarSeparatorProps & React_2.RefAttributes<HTMLDivElement>>;
+export declare const Separator: default_2.ForwardRefExoticComponent<RadixToolbar.ToolbarSeparatorProps & default_2.RefAttributes<HTMLDivElement>>;
 
 /**
  * A serialized representation of an {@link CodeBlockNode}.
@@ -2496,7 +2451,7 @@ export declare const setMarkdown$: NodeRef<string>;
  * See {@link ConditionalContents} for an example on how to display the dropdown only when a sandpack editor is in focus.
  * @group Toolbar Components
  */
-export declare const ShowSandpackInfo: () => React_2.JSX.Element;
+export declare const ShowSandpackInfo: () => default_2.JSX.Element;
 
 /**
  * A toolbar primitive that allows you to build an UI with multiple exclusive toggle groups, like the list type toggle.
@@ -2506,12 +2461,12 @@ export declare const SingleChoiceToggleGroup: <T extends string>({ value, onChan
     items: {
         title: string;
         value: T;
-        contents: React_2.ReactNode;
+        contents: default_2.ReactNode;
     }[];
     onChange: (value: T) => void;
     value: T;
-    className?: string | undefined;
-}) => React_2.JSX.Element;
+    className?: string;
+}) => default_2.JSX.Element;
 
 /* Excluded from this release type: SingleToggleGroup */
 
@@ -2614,14 +2569,14 @@ export { ToMarkdownOptions }
  * The factory function that returns the contents of the toolbar.
  * @group Toolbar
  */
-export declare const toolbarContents$: NodeRef<() => React_2.ReactNode>;
+export declare const toolbarContents$: NodeRef<() => default_2.ReactNode>;
 
 /**
  * A plugin that adds a toolbar to the editor.
  * @group Toolbar
  */
 export declare const toolbarPlugin: (params?: {
-    toolbarContents: () => React_2.ReactNode;
+    toolbarContents: () => default_2.ReactNode;
 } | undefined) => RealmPlugin;
 
 /* Excluded from this release type: ToolbarToggleItem */
@@ -2630,10 +2585,10 @@ export declare const toolbarPlugin: (params?: {
  * A styled wrapper around the radix-ui tooltip, that lets you display an instant tooltip on hover.
  * @group Toolbar Primitives
  */
-export declare const TooltipWrap: React_2.ForwardRefExoticComponent<{
+export declare const TooltipWrap: default_2.ForwardRefExoticComponent<{
     title: string;
     children: ReactNode;
-} & React_2.RefAttributes<HTMLButtonElement>>;
+} & default_2.RefAttributes<HTMLButtonElement>>;
 
 /* Excluded from this release type: topAreaChildren$ */
 
@@ -2647,7 +2602,7 @@ export declare type Translation = (key: string, defaultValue: string, interpolat
  * A toolbar component that lets the user undo and redo changes in the editor.
  * @group Toolbar Components
  */
-export declare const UndoRedo: React_2.FC;
+export declare const UndoRedo: default_2.FC;
 
 /**
  * An error that gets thrown when the Markdown parsing encounters an node that has no corresponding {@link MdastImportVisitor}.
@@ -2733,3 +2688,21 @@ export declare function voidEmitter(): {
 export * from "@mdxeditor/gurx";
 
 export { }
+
+
+declare global {
+    interface DragEvent {
+        rangeOffset?: number;
+        rangeParent?: Node;
+    }
+}
+
+
+declare module 'micromark-util-types' {
+    interface TokenTypeMap {
+        comment: 'comment';
+        commentEnd: 'commentEnd';
+        data: 'data';
+    }
+}
+

package/dist/plugins/core/LexicalTextVisitor.js

@@ -1,5 +1,5 @@
 import { $isTextNode } from "lexical";
-import { IS_CODE, IS_ITALIC, IS_BOLD, IS_UNDERLINE } from "../../FormatConstants.js";
+import { IS_ITALIC, IS_BOLD, IS_UNDERLINE, IS_CODE } from "../../FormatConstants.js";
 function isMdastText(mdastNode) {
   return mdastNode.type === "text";
 }
@@ -35,12 +35,6 @@ const LexicalTextVisitor = {
     const textContent = lexicalNode.getTextContent();
     const format = lexicalNode.getFormat() ?? 0;
     const style = lexicalNode.getStyle();
-    if (format & IS_CODE) {
-      actions.addAndStepInto("inlineCode", {
-        value: textContent
-      });
-      return;
-    }
     let localParentNode = mdastParent;
     if (style) {
       localParentNode = actions.appendToParent(localParentNode, {
@@ -90,6 +84,13 @@ const LexicalTextVisitor = {
         attributes: []
       });
     }
+    if (format & IS_CODE) {
+      actions.appendToParent(localParentNode, {
+        type: "inlineCode",
+        value: textContent
+      });
+      return;
+    }
     actions.appendToParent(localParentNode, {
       type: "text",
       value: textContent

package/dist/plugins/core/MdastFormattingVisitor.js

@@ -1,4 +1,5 @@
-import { IS_UNDERLINE, IS_ITALIC, IS_BOLD } from "../../FormatConstants.js";
+import { IS_CODE, IS_ITALIC, IS_BOLD, IS_UNDERLINE } from "../../FormatConstants.js";
+import { $createTextNode } from "lexical";
 function isOpeningUnderlineNode(node) {
   return node.type === "html" && node.value === "<u>";
 }
@@ -8,29 +9,88 @@ function isClosingUnderlineNode(node) {
 function isJsxUnderlineNode(node) {
   return node.type === "mdxJsxTextElement" && node.name === "u";
 }
-const MdastFormattingVisitor = {
-  testNode(mdastNode) {
-    return mdastNode.type === "emphasis" || mdastNode.type === "strong" || isJsxUnderlineNode(mdastNode) || isOpeningUnderlineNode(mdastNode) || isClosingUnderlineNode(mdastNode);
-  },
-  visitNode({ mdastNode, lexicalParent, actions, mdastParent }) {
-    if (isOpeningUnderlineNode(mdastNode)) {
-      actions.removeFormatting(IS_UNDERLINE, mdastParent);
-      return;
-    }
-    if (isClosingUnderlineNode(mdastNode)) {
-      actions.removeFormatting(IS_UNDERLINE, mdastParent);
-      return;
-    }
-    if (mdastNode.type === "emphasis") {
-      actions.addFormatting(IS_ITALIC);
-    } else if (mdastNode.type === "strong") {
-      actions.addFormatting(IS_BOLD);
-    } else if (isJsxUnderlineNode(mdastNode)) {
-      actions.addFormatting(IS_UNDERLINE);
-    }
+function isJsxCodeNode(node) {
+  return node.type === "mdxJsxTextElement" && node.name === "code";
+}
+function isOpeningCodeNode(node) {
+  return node.type === "html" && node.value === "<code>";
+}
+function isClosingCodeNode(node) {
+  return node.type === "html" && node.value === "</code>";
+}
+const JsxCodeVisitor = {
+  testNode: isJsxCodeNode,
+  visitNode({ mdastNode, actions, lexicalParent }) {
+    actions.addFormatting(IS_CODE);
+    actions.visitChildren(mdastNode, lexicalParent);
+  }
+};
+const OpeningCodeVisitor = {
+  testNode: isOpeningCodeNode,
+  visitNode({ actions, mdastParent }) {
+    actions.addFormatting(IS_CODE, mdastParent);
+  }
+};
+const ClosingCodeVisitor = {
+  testNode: isClosingCodeNode,
+  visitNode({ actions, mdastParent }) {
+    actions.removeFormatting(IS_CODE, mdastParent);
+  }
+};
+const MdCodeVisitor = {
+  testNode: "inlineCode",
+  visitNode({ mdastNode, actions }) {
+    actions.addAndStepInto($createTextNode(mdastNode.value).setFormat(actions.getParentFormatting() | IS_CODE));
+  }
+};
+const MdEmphasisVisitor = {
+  testNode: "emphasis",
+  visitNode({ mdastNode, actions, lexicalParent }) {
+    actions.addFormatting(IS_ITALIC);
+    actions.visitChildren(mdastNode, lexicalParent);
+  }
+};
+const MdStrongVisitor = {
+  testNode: "strong",
+  visitNode({ mdastNode, actions, lexicalParent }) {
+    actions.addFormatting(IS_BOLD);
     actions.visitChildren(mdastNode, lexicalParent);
   }
 };
+const JsxUnderlineVisitor = {
+  testNode: isJsxUnderlineNode,
+  visitNode({ mdastNode, actions, lexicalParent }) {
+    actions.addFormatting(IS_UNDERLINE);
+    actions.visitChildren(mdastNode, lexicalParent);
+  }
+};
+const OpeningUnderlineVisitor = {
+  testNode: isOpeningUnderlineNode,
+  visitNode({ actions, mdastParent }) {
+    actions.addFormatting(IS_UNDERLINE, mdastParent);
+  }
+};
+const ClosingUnderlineVisitor = {
+  testNode: isClosingUnderlineNode,
+  visitNode({ actions, mdastParent }) {
+    actions.removeFormatting(IS_UNDERLINE, mdastParent);
+  }
+};
+const formattingVisitors = [
+  // emphasis
+  MdEmphasisVisitor,
+  // strong
+  MdStrongVisitor,
+  // underline
+  JsxUnderlineVisitor,
+  OpeningUnderlineVisitor,
+  ClosingUnderlineVisitor,
+  // code
+  JsxCodeVisitor,
+  OpeningCodeVisitor,
+  ClosingCodeVisitor,
+  MdCodeVisitor
+];
 export {
-  MdastFormattingVisitor
+  formattingVisitors
 };

package/dist/plugins/core/index.js

@@ -20,9 +20,8 @@ import { LexicalParagraphVisitor } from "./LexicalParagraphVisitor.js";
 import { LexicalRootVisitor } from "./LexicalRootVisitor.js";
 import { LexicalTextVisitor } from "./LexicalTextVisitor.js";
 import { MdastBreakVisitor } from "./MdastBreakVisitor.js";
-import { MdastFormattingVisitor } from "./MdastFormattingVisitor.js";
+import { formattingVisitors } from "./MdastFormattingVisitor.js";
 import { MdastHTMLVisitor } from "./MdastHTMLVisitor.js";
-import { MdastInlineCodeVisitor } from "./MdastInlineCodeVisitor.js";
 import { MdastParagraphVisitor } from "./MdastParagraphVisitor.js";
 import { MdastRootVisitor } from "./MdastRootVisitor.js";
 import { MdastTextVisitor } from "./MdastTextVisitor.js";
@@ -478,14 +477,7 @@ const corePlugin = realmPlugin({
     r.pubIn({
       [initialMarkdown$]: params == null ? void 0 : params.initialMarkdown.trim(),
       [iconComponentFor$]: params == null ? void 0 : params.iconComponentFor,
-      [addImportVisitor$]: [
-        MdastRootVisitor,
-        MdastParagraphVisitor,
-        MdastTextVisitor,
-        MdastFormattingVisitor,
-        MdastInlineCodeVisitor,
-        MdastBreakVisitor
-      ],
+      [addImportVisitor$]: [MdastRootVisitor, MdastParagraphVisitor, MdastTextVisitor, MdastBreakVisitor, ...formattingVisitors],
       [addLexicalNode$]: [ParagraphNode, TextNode, GenericHTMLNode],
       [addExportVisitor$]: [
         LexicalRootVisitor,

package/dist/plugins/table/TableEditor.js

@@ -242,9 +242,13 @@ const CellEditor = ({ focus, setActiveCell, parentEditor, lexicalTable, contents
           visitors: exportVisitors,
           jsxIsAvailable
         });
-        parentEditor.update(() => {
-          lexicalTable.updateCellContents(colIndex, rowIndex, mdast.children[0].children);
-        });
+        parentEditor.update(
+          () => {
+            lexicalTable.updateCellContents(colIndex, rowIndex, mdast.children[0].children);
+          },
+          { discrete: true }
+        );
+        parentEditor.dispatchCommand(NESTED_EDITOR_UPDATED_COMMAND, void 0);
       });
       setActiveCell(nextCell);
     },

package/package.json

@@ -11,7 +11,7 @@
     "*.css"
   ],
   "type": "module",
-  "version": "3.0.6",
+  "version": "3.0.8",
   "description": "React component for rich text markdown editing",
   "scripts": {
     "build": "vite build",
@@ -109,8 +109,8 @@
     "@types/react": "^18.2.7",
     "@types/react-dom": "^18.2.4",
     "@types/unist": "^3.0.2",
-    "@typescript-eslint/eslint-plugin": "^6.17.0",
-    "@typescript-eslint/parser": "^6.17.0",
+    "@typescript-eslint/eslint-plugin": "^7.9.0",
+    "@typescript-eslint/parser": "^7.9.0",
     "@vitejs/plugin-react": "^4.0.0",
     "@vitejs/plugin-react-swc": "^3.5.0",
     "autoprefixer": "^10.4.14",
@@ -141,13 +141,13 @@
     "semantic-release": "^21.0.5",
     "svgo": "^3.0.2",
     "terser": "^5.26.0",
-    "typedoc": "^0.25.6",
-    "typedoc-plugin-markdown": "^3.17.1",
+    "typedoc": "^0.25.13",
+    "typedoc-plugin-markdown": "^4.0.2",
     "typedoc-plugin-no-inherit": "^1.4.0",
-    "typescript": "^5.3.3",
+    "typescript": "^5.4.5",
     "typescript-plugin-css-modules": "^5.0.2",
     "vite": "^5.0.10",
-    "vite-plugin-dts": "^3.7.0",
+    "vite-plugin-dts": "^3.9.1",
     "vite-plugin-svgr": "^4.2.0",
     "vite-tsconfig-paths": "^4.2.3",
     "vitest": "^1.1.1"

package/dist/plugins/core/MdastInlineCodeVisitor.js

@@ -1,27 +0,0 @@
-import { $createTextNode } from "lexical";
-import { IS_CODE } from "../../FormatConstants.js";
-function isOpeningCodeNode(node) {
-  return node.type === "html" && node.value === "<code>";
-}
-function isClosingCodeNode(node) {
-  return node.type === "html" && node.value === "</code>";
-}
-const MdastInlineCodeVisitor = {
-  testNode: (node) => {
-    return node.type === "inlineCode" || isOpeningCodeNode(node) || isClosingCodeNode(node);
-  },
-  visitNode({ mdastNode, actions, mdastParent }) {
-    if (isOpeningCodeNode(mdastNode)) {
-      actions.addFormatting(IS_CODE, mdastParent);
-      return;
-    }
-    if (isClosingCodeNode(mdastNode)) {
-      actions.removeFormatting(IS_CODE, mdastParent);
-      return;
-    }
-    actions.addAndStepInto($createTextNode(mdastNode.value).setFormat(IS_CODE));
-  }
-};
-export {
-  MdastInlineCodeVisitor
-};