@nkzw/mdx-editor 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +86 -0
- package/UPSTREAM.md +21 -0
- package/dist/EditorIcon.js +75 -0
- package/dist/FormatConstants.js +20 -0
- package/dist/MDXEditor.js +189 -0
- package/dist/MarkdownEditor.js +281 -0
- package/dist/PersistentMarkdownEditor.js +358 -0
- package/dist/RealmWithPlugins.js +35 -0
- package/dist/core.d.ts +3232 -0
- package/dist/core.js +354 -0
- package/dist/defaultSvgIcons.js +371 -0
- package/dist/directive-editors/AdmonitionDirectiveDescriptor.js +28 -0
- package/dist/directive-editors/GenericDirectiveEditor.js +37 -0
- package/dist/exportMarkdownFromLexical.js +262 -0
- package/dist/horizontalRuleShortcut.js +37 -0
- package/dist/importMarkdownToLexical.js +172 -0
- package/dist/index.d.ts +86 -0
- package/dist/index.js +8 -0
- package/dist/jsx-editors/GenericJsxEditor.js +84 -0
- package/dist/mdastUtilHtmlComment.js +125 -0
- package/dist/persistence.d.ts +128 -0
- package/dist/persistence.js +4 -0
- package/dist/plugins/codeblock/CodeBlockNode.js +183 -0
- package/dist/plugins/codeblock/CodeBlockVisitor.js +14 -0
- package/dist/plugins/codeblock/MdastCodeVisitor.js +23 -0
- package/dist/plugins/codeblock/findCodeBlockDescriptor.js +8 -0
- package/dist/plugins/codeblock/index.js +46 -0
- package/dist/plugins/codemirror/CodeMirrorEditor.js +145 -0
- package/dist/plugins/codemirror/index.js +115 -0
- package/dist/plugins/codemirror/useCodeMirrorRef.js +101 -0
- package/dist/plugins/core/GenericHTMLNode.js +118 -0
- package/dist/plugins/core/LexicalGenericHTMLNodeVisitor.js +15 -0
- package/dist/plugins/core/LexicalLinebreakVisitor.js +10 -0
- package/dist/plugins/core/LexicalParagraphVisitor.js +10 -0
- package/dist/plugins/core/LexicalRootVisitor.js +10 -0
- package/dist/plugins/core/LexicalTextVisitor.js +160 -0
- package/dist/plugins/core/MdastBreakVisitor.js +10 -0
- package/dist/plugins/core/MdastFormattingVisitor.js +81 -0
- package/dist/plugins/core/MdastHTMLNode.js +120 -0
- package/dist/plugins/core/MdastHTMLVisitor.js +17 -0
- package/dist/plugins/core/MdastParagraphVisitor.js +23 -0
- package/dist/plugins/core/MdastRootVisitor.js +9 -0
- package/dist/plugins/core/MdastTextVisitor.js +16 -0
- package/dist/plugins/core/NestedLexicalEditor.js +221 -0
- package/dist/plugins/core/PropertyPopover.js +75 -0
- package/dist/plugins/core/SharedHistoryPlugin.js +10 -0
- package/dist/plugins/core/index.js +692 -0
- package/dist/plugins/core/ui/DownshiftAutoComplete.js +89 -0
- package/dist/plugins/core/ui/PopoverUtils.js +22 -0
- package/dist/plugins/diff-source/DiffSourceWrapper.js +24 -0
- package/dist/plugins/diff-source/DiffViewer.js +84 -0
- package/dist/plugins/diff-source/SourceEditor.js +60 -0
- package/dist/plugins/diff-source/index.js +27 -0
- package/dist/plugins/directives/DirectiveNode.js +107 -0
- package/dist/plugins/directives/DirectiveVisitor.js +10 -0
- package/dist/plugins/directives/MdastDirectiveVisitor.js +30 -0
- package/dist/plugins/directives/index.js +45 -0
- package/dist/plugins/frontmatter/FrontmatterEditor.js +137 -0
- package/dist/plugins/frontmatter/FrontmatterNode.js +70 -0
- package/dist/plugins/frontmatter/LexicalFrontmatterVisitor.js +10 -0
- package/dist/plugins/frontmatter/MdastFrontmatterVisitor.js +10 -0
- package/dist/plugins/frontmatter/index.js +113 -0
- package/dist/plugins/headings/LexicalHeadingVisitor.js +11 -0
- package/dist/plugins/headings/MdastHeadingVisitor.js +10 -0
- package/dist/plugins/headings/index.js +63 -0
- package/dist/plugins/image/EditImageToolbar.js +58 -0
- package/dist/plugins/image/ImageDialog.js +132 -0
- package/dist/plugins/image/ImageEditor.js +279 -0
- package/dist/plugins/image/ImageNode.js +187 -0
- package/dist/plugins/image/ImagePlaceholder.js +9 -0
- package/dist/plugins/image/ImageResizer.js +223 -0
- package/dist/plugins/image/LexicalImageVisitor.js +42 -0
- package/dist/plugins/image/MdastImageVisitor.js +91 -0
- package/dist/plugins/image/index.js +364 -0
- package/dist/plugins/jsx/LexicalJsxNode.js +103 -0
- package/dist/plugins/jsx/LexicalJsxVisitor.js +27 -0
- package/dist/plugins/jsx/LexicalMdxExpressionNode.js +130 -0
- package/dist/plugins/jsx/LexicalMdxExpressionVisitor.js +14 -0
- package/dist/plugins/jsx/MdastMdxExpressionVisitor.js +11 -0
- package/dist/plugins/jsx/MdastMdxJsEsmVisitor.js +8 -0
- package/dist/plugins/jsx/MdastMdxJsxElementVisitor.js +28 -0
- package/dist/plugins/jsx/index.js +97 -0
- package/dist/plugins/jsx/jsxTagName.js +7 -0
- package/dist/plugins/link/AutoLinkPlugin.js +18 -0
- package/dist/plugins/link/LexicalLinkVisitor.js +10 -0
- package/dist/plugins/link/MdastLinkVisitor.js +14 -0
- package/dist/plugins/link/index.js +34 -0
- package/dist/plugins/link-dialog/LinkDialog.js +262 -0
- package/dist/plugins/link-dialog/index.js +304 -0
- package/dist/plugins/lists/CheckListPlugin.js +270 -0
- package/dist/plugins/lists/LexicalListItemVisitor.js +41 -0
- package/dist/plugins/lists/LexicalListVisitor.js +13 -0
- package/dist/plugins/lists/MdastListItemVisitor.js +11 -0
- package/dist/plugins/lists/MdastListVisitor.js +19 -0
- package/dist/plugins/lists/NotesListItemNode.js +22 -0
- package/dist/plugins/lists/index.js +111 -0
- package/dist/plugins/markdown-shortcut/index.js +114 -0
- package/dist/plugins/maxlength/index.js +36 -0
- package/dist/plugins/quote/LexicalQuoteVisitor.js +10 -0
- package/dist/plugins/quote/MdastBlockQuoteVisitor.js +10 -0
- package/dist/plugins/quote/index.js +18 -0
- package/dist/plugins/remote/index.js +52 -0
- package/dist/plugins/search/index.js +360 -0
- package/dist/plugins/table/LexicalTableVisitor.js +10 -0
- package/dist/plugins/table/MdastTableVisitor.js +10 -0
- package/dist/plugins/table/TableEditor.js +527 -0
- package/dist/plugins/table/TableNode.js +208 -0
- package/dist/plugins/table/index.js +66 -0
- package/dist/plugins/thematic-break/LexicalThematicBreakVisitor.js +10 -0
- package/dist/plugins/thematic-break/MdastThematicBreakVisitor.js +10 -0
- package/dist/plugins/thematic-break/index.js +27 -0
- package/dist/plugins/toolbar/components/BlockTypeSelect.js +62 -0
- package/dist/plugins/toolbar/components/BoldItalicUnderlineToggles.js +98 -0
- package/dist/plugins/toolbar/components/ChangeAdmonitionType.js +43 -0
- package/dist/plugins/toolbar/components/ChangeCodeMirrorLanguage.js +42 -0
- package/dist/plugins/toolbar/components/CodeToggle.js +21 -0
- package/dist/plugins/toolbar/components/CreateLink.js +24 -0
- package/dist/plugins/toolbar/components/DiffSourceToggleWrapper.js +42 -0
- package/dist/plugins/toolbar/components/HighlightToggle.js +28 -0
- package/dist/plugins/toolbar/components/InsertAdmonition.js +34 -0
- package/dist/plugins/toolbar/components/InsertCodeBlock.js +23 -0
- package/dist/plugins/toolbar/components/InsertFrontmatter.js +28 -0
- package/dist/plugins/toolbar/components/InsertImage.js +29 -0
- package/dist/plugins/toolbar/components/InsertTable.js +25 -0
- package/dist/plugins/toolbar/components/InsertThematicBreak.js +23 -0
- package/dist/plugins/toolbar/components/KitchenSinkToolbar.js +82 -0
- package/dist/plugins/toolbar/components/ListsToggle.js +29 -0
- package/dist/plugins/toolbar/components/UndoRedo.js +60 -0
- package/dist/plugins/toolbar/index.js +32 -0
- package/dist/plugins/toolbar/primitives/DialogButton.js +130 -0
- package/dist/plugins/toolbar/primitives/TooltipWrap.js +17 -0
- package/dist/plugins/toolbar/primitives/select.js +76 -0
- package/dist/plugins/toolbar/primitives/toolbar.js +144 -0
- package/dist/registerCodeBoundaryEscape.js +40 -0
- package/dist/styles/lexical-theme.module.css.js +62 -0
- package/dist/styles/lexicalTheme.js +32 -0
- package/dist/styles/ui.module.css.js +296 -0
- package/dist/styles.css +2838 -0
- package/dist/utils/detectMac.js +16 -0
- package/dist/utils/fp.js +44 -0
- package/dist/utils/isPartOftheEditorUI.js +12 -0
- package/dist/utils/lexicalHelpers.js +185 -0
- package/dist/utils/makeHslTransparent.js +6 -0
- package/dist/utils/mergeStyleAttributes.js +22 -0
- package/dist/utils/uuid4.js +10 -0
- package/dist/utils/voidEmitter.js +15 -0
- package/package.json +133 -0
package/dist/core.d.ts
ADDED
|
@@ -0,0 +1,3232 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* The `@mdxeditor/editor` package exports the MDXEditor React component and a set of plugins and
|
|
3
|
+
* pre-made components for editing/editor UI.
|
|
4
|
+
*
|
|
5
|
+
* The API Reference is organized around the various features of the editor. Usually, each feature is implemented as a plugin.
|
|
6
|
+
*
|
|
7
|
+
* Several note-worthy types of exports are available:
|
|
8
|
+
*
|
|
9
|
+
* **dollar-suffixed variables** (e.g. `markdown$`, `applyBlockType$`, etc.). These are [reactive Gurx primitives (Cells and Signals)](https://mdx-editor.github.io/gurx/)
|
|
10
|
+
* which let you interact with the editor state and extend it with your own custom logic.
|
|
11
|
+
*
|
|
12
|
+
* The MDXEditor package re-exports Gurx's React hooks, so you can use them like this for example:
|
|
13
|
+
* ```tsx
|
|
14
|
+
* // use the markdown$ cell to get the current markdown value,
|
|
15
|
+
* // and the rootEditor$ cell to get the Lexical editor instance.
|
|
16
|
+
* const [markdown, rootEditor] = useCellValues([markdown$, rootEditor$])
|
|
17
|
+
* // use the applyBlockType$ signal to apply a block type to the current selection
|
|
18
|
+
* const applyBlockType = usePublisher(applyBlockType$)
|
|
19
|
+
* ```
|
|
20
|
+
*
|
|
21
|
+
* **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.
|
|
22
|
+
*
|
|
23
|
+
* **`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.
|
|
24
|
+
*
|
|
25
|
+
* **MDAST Nodes, Lexical Nodes and Import/Export visitors** - these are part of the bi-directional Markdown to/from Lexical state conversion API.
|
|
26
|
+
*
|
|
27
|
+
* **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.
|
|
28
|
+
*
|
|
29
|
+
* @packageDocumentation
|
|
30
|
+
*/
|
|
31
|
+
|
|
32
|
+
import { ContentEditable } from '@lexical/react/LexicalContentEditable';
|
|
33
|
+
import { DecoratorNode } from 'lexical';
|
|
34
|
+
import { default as default_2 } from 'react';
|
|
35
|
+
import { Directives } from 'mdast-util-directive';
|
|
36
|
+
import { DOMConversionMap } from 'lexical';
|
|
37
|
+
import { DOMConversionOutput } from 'lexical';
|
|
38
|
+
import { DOMExportOutput } from 'lexical';
|
|
39
|
+
import { EditorConfig } from 'lexical';
|
|
40
|
+
import { EditorState } from 'lexical';
|
|
41
|
+
import { EditorThemeClasses } from 'lexical';
|
|
42
|
+
import { ElementNode } from 'lexical';
|
|
43
|
+
import { Extension } from 'mdast-util-from-markdown';
|
|
44
|
+
import { Extension as Extension_2 } from 'micromark-util-types';
|
|
45
|
+
import { Extension as Extension_3 } from '@codemirror/state';
|
|
46
|
+
import { FC } from 'react';
|
|
47
|
+
import { Options as FromMarkdownOptions } from 'mdast-util-from-markdown';
|
|
48
|
+
import { HeadingTagType } from '@lexical/rich-text';
|
|
49
|
+
import { HistoryState } from '@lexical/react/LexicalHistoryPlugin';
|
|
50
|
+
import { JSX } from 'react';
|
|
51
|
+
import { KlassConstructor } from 'lexical';
|
|
52
|
+
import * as lexical from 'lexical';
|
|
53
|
+
import { LexicalCommand } from 'lexical';
|
|
54
|
+
import { LexicalEditor } from 'lexical';
|
|
55
|
+
import { LexicalNode } from 'lexical';
|
|
56
|
+
import { LexicalNodeReplacement } from 'lexical';
|
|
57
|
+
import { LinkNode } from '@lexical/link';
|
|
58
|
+
import { LinkPlugin } from '@lexical/react/LexicalLinkPlugin';
|
|
59
|
+
import { ListType } from '@lexical/list';
|
|
60
|
+
import * as Mdast from 'mdast';
|
|
61
|
+
import { MdxJsxAttribute } from 'mdast-util-mdx-jsx';
|
|
62
|
+
import { MdxJsxExpressionAttribute } from 'mdast-util-mdx-jsx';
|
|
63
|
+
import { MdxJsxFlowElement } from 'mdast-util-mdx-jsx';
|
|
64
|
+
import { MdxJsxTextElement } from 'mdast-util-mdx-jsx';
|
|
65
|
+
import { Node as Node_2 } from 'unist';
|
|
66
|
+
import { NodeKey } from 'lexical';
|
|
67
|
+
import { NodeRef } from '@mdxeditor/gurx';
|
|
68
|
+
import { Options } from 'mdast-util-to-markdown';
|
|
69
|
+
import { Options as Options_2 } from 'mdast-util-gfm-table';
|
|
70
|
+
import { ParseOptions } from 'micromark-util-types';
|
|
71
|
+
import { PropsWithChildren } from 'react';
|
|
72
|
+
import * as RadixToolbar from '@radix-ui/react-toolbar';
|
|
73
|
+
import { RangeSelection } from 'lexical';
|
|
74
|
+
import { ReactNode } from 'react';
|
|
75
|
+
import { Realm } from '@mdxeditor/gurx';
|
|
76
|
+
import { RootNode } from 'lexical';
|
|
77
|
+
import { SerializedElementNode } from 'lexical';
|
|
78
|
+
import { SerializedLexicalNode } from 'lexical';
|
|
79
|
+
import { Spread } from 'lexical';
|
|
80
|
+
import { TextFormatType } from 'lexical';
|
|
81
|
+
import { TextNode } from 'lexical';
|
|
82
|
+
|
|
83
|
+
/**
|
|
84
|
+
* Converts a <pre> HTML element into a CodeBlockNode.
|
|
85
|
+
* Extracts the code content, language, and meta information from the element's attributes.
|
|
86
|
+
* The language is determined from the class attribute (e.g., class="language-javascript") or
|
|
87
|
+
* the data-language attribute if available.
|
|
88
|
+
*
|
|
89
|
+
* @param element - The <pre> HTML element to convert.
|
|
90
|
+
* @returns A DOMConversionOutput containing the created CodeBlockNode.
|
|
91
|
+
* @group Code Block
|
|
92
|
+
*/
|
|
93
|
+
export declare function $convertPreElement(element: Element): DOMConversionOutput;
|
|
94
|
+
|
|
95
|
+
/**
|
|
96
|
+
* Converts an HTML table element into a {@link TableNode}.
|
|
97
|
+
* This function is used to transform a DOM table element into a format that can be used by Lexical.
|
|
98
|
+
* It extracts the rows and cells from the table, converting them into MDAST-compatible nodes.
|
|
99
|
+
*
|
|
100
|
+
* @param element - The HTML table element to convert.
|
|
101
|
+
* @returns A {@link DOMConversionOutput} containing the converted {@link TableNode}.
|
|
102
|
+
* @group Table
|
|
103
|
+
*/
|
|
104
|
+
export declare function $convertTableElement(element: HTMLElement): DOMConversionOutput;
|
|
105
|
+
|
|
106
|
+
/**
|
|
107
|
+
* Creates a {@link CodeBlockNode}.
|
|
108
|
+
* @param options - The code contents, the language (i.e. js, jsx, etc.), and the additional meta data of the block.
|
|
109
|
+
* @group Code Block
|
|
110
|
+
*/
|
|
111
|
+
export declare function $createCodeBlockNode(options: Partial<CreateCodeBlockNodeOptions>): CodeBlockNode;
|
|
112
|
+
|
|
113
|
+
/**
|
|
114
|
+
* Creates an {@link DirectiveNode}. Use this instead of the constructor to follow the Lexical conventions.
|
|
115
|
+
* @group Directive
|
|
116
|
+
*/
|
|
117
|
+
export declare function $createDirectiveNode(mdastNode: Directives, key?: NodeKey): DirectiveNode;
|
|
118
|
+
|
|
119
|
+
/**
|
|
120
|
+
* Creates a {@link FrontmatterNode}.
|
|
121
|
+
* @param yaml - The YAML string of the frontmatter.
|
|
122
|
+
*/
|
|
123
|
+
export declare function $createFrontmatterNode(yaml: string): FrontmatterNode;
|
|
124
|
+
|
|
125
|
+
/**
|
|
126
|
+
* Creates a new {@link GenericHTMLNode} with the specified MDAST HTML node as the object to edit.
|
|
127
|
+
* @group HTML
|
|
128
|
+
*/
|
|
129
|
+
export declare function $createGenericHTMLNode(tag: KnownHTMLTagType, type: MdxNodeType, attributes: MdxJsxAttribute[]): GenericHTMLNode;
|
|
130
|
+
|
|
131
|
+
/**
|
|
132
|
+
* Creates an {@link ImageNode}.
|
|
133
|
+
* @param params - The image attributes.
|
|
134
|
+
* @group Image
|
|
135
|
+
*/
|
|
136
|
+
export declare function $createImageNode(params: CreateImageNodeParameters): ImageNode;
|
|
137
|
+
|
|
138
|
+
/**
|
|
139
|
+
* Creates a {@link TableNode}. Use this instead of the constructor to follow the Lexical conventions.
|
|
140
|
+
* @param mdastNode - The mdast node to create the {@link TableNode} from.
|
|
141
|
+
* @group Table
|
|
142
|
+
*/
|
|
143
|
+
export declare function $createTableNode(mdastNode: Mdast.Table): TableNode;
|
|
144
|
+
|
|
145
|
+
/**
|
|
146
|
+
* Returns true if the given node is a {@link CodeBlockNode}.
|
|
147
|
+
* @group Code Block
|
|
148
|
+
*/
|
|
149
|
+
export declare function $isCodeBlockNode(node: LexicalNode | null | undefined): node is CodeBlockNode;
|
|
150
|
+
|
|
151
|
+
/**
|
|
152
|
+
* Returns true if the node is an {@link DirectiveNode}.
|
|
153
|
+
* @group Directive
|
|
154
|
+
*/
|
|
155
|
+
export declare function $isDirectiveNode(node: LexicalNode | null | undefined): node is DirectiveNode;
|
|
156
|
+
|
|
157
|
+
/**
|
|
158
|
+
* Returns `true` if the given node is a {@link FrontmatterNode}.
|
|
159
|
+
*/
|
|
160
|
+
export declare function $isFrontmatterNode(node: LexicalNode | null | undefined): node is FrontmatterNode;
|
|
161
|
+
|
|
162
|
+
/**
|
|
163
|
+
* Determines if the specified node is a {@link GenericHTMLNode}.
|
|
164
|
+
* @group HTML
|
|
165
|
+
*/
|
|
166
|
+
export declare function $isGenericHTMLNode(node: LexicalNode | null | undefined): node is GenericHTMLNode;
|
|
167
|
+
|
|
168
|
+
/**
|
|
169
|
+
* Returns true if the node is an {@link ImageNode}.
|
|
170
|
+
* @group Image
|
|
171
|
+
*/
|
|
172
|
+
export declare function $isImageNode(node: LexicalNode | null | undefined): node is ImageNode;
|
|
173
|
+
|
|
174
|
+
/**
|
|
175
|
+
* Returns true if the given node is a {@link TableNode}.
|
|
176
|
+
* @group Table
|
|
177
|
+
*/
|
|
178
|
+
export declare function $isTableNode(node: LexicalNode | null | undefined): node is TableNode;
|
|
179
|
+
|
|
180
|
+
/**
|
|
181
|
+
* Holds a reference to the current Lexical editor instance - can be the root editor or a nested editor.
|
|
182
|
+
* @group Core
|
|
183
|
+
*/
|
|
184
|
+
export declare const activeEditor$: NodeRef<LexicalEditor | null>;
|
|
185
|
+
|
|
186
|
+
/* Excluded from this release type: activeEditorSubscriptions$ */
|
|
187
|
+
|
|
188
|
+
/**
|
|
189
|
+
* The names of the plugins that are currently active.
|
|
190
|
+
* @group Core
|
|
191
|
+
*/
|
|
192
|
+
export declare const activePlugins$: NodeRef<string[]>;
|
|
193
|
+
|
|
194
|
+
/**
|
|
195
|
+
* Add a plugin name to the list of active plugins.
|
|
196
|
+
* @group Core
|
|
197
|
+
*/
|
|
198
|
+
export declare const addActivePlugin$: NodeRef<string | string[]>;
|
|
199
|
+
|
|
200
|
+
/**
|
|
201
|
+
* Lets you add React components below the editor.
|
|
202
|
+
* @group Core
|
|
203
|
+
*/
|
|
204
|
+
export declare const addBottomAreaChild$: NodeRef<default_2.ComponentType<{}> | default_2.ComponentType<{}>[]>;
|
|
205
|
+
|
|
206
|
+
/**
|
|
207
|
+
* Lets you add React components to the {@link https://lexical.dev/docs/react/plugins | Lexical Composer} element.
|
|
208
|
+
* @group Core
|
|
209
|
+
*/
|
|
210
|
+
export declare const addComposerChild$: NodeRef<default_2.ComponentType<{}> | default_2.ComponentType<{}>[]>;
|
|
211
|
+
|
|
212
|
+
/**
|
|
213
|
+
* Lets you add React components as wrappers around the editor.
|
|
214
|
+
* @group Core
|
|
215
|
+
*/
|
|
216
|
+
export declare const addEditorWrapper$: NodeRef<default_2.ComponentType<{
|
|
217
|
+
children: default_2.ReactNode;
|
|
218
|
+
}> | default_2.ComponentType<{
|
|
219
|
+
children: default_2.ReactNode;
|
|
220
|
+
}>[]>;
|
|
221
|
+
|
|
222
|
+
/**
|
|
223
|
+
* Adds an export visitor to be used when exporting markdown from the Lexical tree.
|
|
224
|
+
* @group Markdown Processing
|
|
225
|
+
*/
|
|
226
|
+
export declare const addExportVisitor$: NodeRef< LexicalVisitor | LexicalVisitor[]>;
|
|
227
|
+
|
|
228
|
+
/**
|
|
229
|
+
* Registers a visitor to be used when importing markdown.
|
|
230
|
+
* @group Markdown Processing
|
|
231
|
+
*/
|
|
232
|
+
export declare const addImportVisitor$: NodeRef<MdastImportVisitor<Mdast.Nodes> | MdastImportVisitor<Mdast.Nodes>[]>;
|
|
233
|
+
|
|
234
|
+
export declare type AdditionalLexicalNode = KlassConstructor<typeof LexicalNode> | LexicalNodeReplacement;
|
|
235
|
+
|
|
236
|
+
/**
|
|
237
|
+
* Registers a lexical node to be used in the editor.
|
|
238
|
+
* @group Core
|
|
239
|
+
*/
|
|
240
|
+
export declare const addLexicalNode$: NodeRef<KlassConstructor<typeof LexicalNode> | KlassConstructor<typeof LexicalNode>[]>;
|
|
241
|
+
|
|
242
|
+
/**
|
|
243
|
+
* Adds a mdast extension to the markdown parser.
|
|
244
|
+
* @group Markdown Processing
|
|
245
|
+
*/
|
|
246
|
+
export declare const addMdastExtension$: NodeRef<MdastExtension | MdastExtension[]>;
|
|
247
|
+
|
|
248
|
+
/**
|
|
249
|
+
* Lets you add React components as children of any registered nested editor (useful for Lexical plugins).
|
|
250
|
+
* @group Core
|
|
251
|
+
*/
|
|
252
|
+
export declare const addNestedEditorChild$: NodeRef<default_2.ComponentType<{}> | default_2.ComponentType<{}>[]>;
|
|
253
|
+
|
|
254
|
+
/**
|
|
255
|
+
* Adds a syntax extension to the markdown parser.
|
|
256
|
+
* @group Markdown Processing
|
|
257
|
+
*/
|
|
258
|
+
export declare const addSyntaxExtension$: NodeRef< Extension_2 | Extension_2[]>;
|
|
259
|
+
|
|
260
|
+
/**
|
|
261
|
+
* Lets you add React components as children of table cell editors.
|
|
262
|
+
* @group Core
|
|
263
|
+
*/
|
|
264
|
+
export declare const addTableCellEditorChild$: NodeRef<default_2.ComponentType<{}> | default_2.ComponentType<{}>[]>;
|
|
265
|
+
|
|
266
|
+
/**
|
|
267
|
+
* Adds a markdown to string extension to be used when exporting markdown from the Lexical tree.
|
|
268
|
+
* @group Markdown Processing
|
|
269
|
+
*/
|
|
270
|
+
export declare const addToMarkdownExtension$: NodeRef<ToMarkdownExtension | ToMarkdownExtension[]>;
|
|
271
|
+
|
|
272
|
+
/**
|
|
273
|
+
* Lets you add React components on top of the editor (like the toolbar).
|
|
274
|
+
* @group Core
|
|
275
|
+
*/
|
|
276
|
+
export declare const addTopAreaChild$: NodeRef<default_2.ComponentType<{}> | default_2.ComponentType<{}>[]>;
|
|
277
|
+
|
|
278
|
+
export declare const ADMONITION_TYPES: readonly ["note", "tip", "danger", "info", "caution"];
|
|
279
|
+
|
|
280
|
+
/**
|
|
281
|
+
* Pass this descriptor to the `directivesPlugin` `directiveDescriptors` parameter to enable {@link https://docusaurus.io/docs/markdown-features/admonitions | markdown admonitions}.
|
|
282
|
+
*
|
|
283
|
+
* @example
|
|
284
|
+
* ```tsx
|
|
285
|
+
* <MDXEditor
|
|
286
|
+
* plugins={[
|
|
287
|
+
* directivesPlugin({ directiveDescriptors: [ AdmonitionDirectiveDescriptor] }),
|
|
288
|
+
* ]} />
|
|
289
|
+
* ```
|
|
290
|
+
* @group Directive
|
|
291
|
+
*/
|
|
292
|
+
export declare const AdmonitionDirectiveDescriptor: DirectiveDescriptor;
|
|
293
|
+
|
|
294
|
+
/* Excluded from this release type: AdmonitionKind */
|
|
295
|
+
|
|
296
|
+
export declare function admonitionLabelsMap(t: Translation): Record<(typeof ADMONITION_TYPES)[number], string>;
|
|
297
|
+
|
|
298
|
+
/**
|
|
299
|
+
* @group Headings
|
|
300
|
+
*/
|
|
301
|
+
export declare const ALL_HEADING_LEVELS: readonly [1, 2, 3, 4, 5, 6];
|
|
302
|
+
|
|
303
|
+
/**
|
|
304
|
+
* Holds the allowed heading levels.
|
|
305
|
+
* @group Headings
|
|
306
|
+
*/
|
|
307
|
+
export declare const allowedHeadingLevels$: NodeRef<readonly HEADING_LEVEL[]>;
|
|
308
|
+
|
|
309
|
+
/**
|
|
310
|
+
* Allow to set width and height of image through dialog window
|
|
311
|
+
* @group Image
|
|
312
|
+
*/
|
|
313
|
+
export declare const allowSetImageDimensions$: NodeRef<boolean>;
|
|
314
|
+
|
|
315
|
+
/**
|
|
316
|
+
* returns a function which when called always returns the passed value
|
|
317
|
+
* @group Utils
|
|
318
|
+
*/
|
|
319
|
+
export declare function always<T>(value: T): () => T;
|
|
320
|
+
|
|
321
|
+
/**
|
|
322
|
+
* A signal that appends a code block editor descriptor to the list of descriptors.
|
|
323
|
+
* @group Code Block
|
|
324
|
+
*/
|
|
325
|
+
export declare const appendCodeBlockEditorDescriptor$: NodeRef<CodeBlockEditorDescriptor | CodeBlockEditorDescriptor[]>;
|
|
326
|
+
|
|
327
|
+
/* Excluded from this release type: Appender */
|
|
328
|
+
|
|
329
|
+
/**
|
|
330
|
+
* Allows you to change the block type of the current selection.
|
|
331
|
+
* @group Core
|
|
332
|
+
*/
|
|
333
|
+
export declare const applyBlockType$: NodeRef<BlockType>;
|
|
334
|
+
|
|
335
|
+
/**
|
|
336
|
+
* Applies the published format to the current selection.
|
|
337
|
+
* @group Core
|
|
338
|
+
*/
|
|
339
|
+
export declare const applyFormat$: NodeRef<TextFormatType>;
|
|
340
|
+
|
|
341
|
+
/**
|
|
342
|
+
* A signal that confirms the updated values of the current link.
|
|
343
|
+
* @group Link Dialog
|
|
344
|
+
*/
|
|
345
|
+
export declare const applyLinkChanges$: NodeRef<void>;
|
|
346
|
+
|
|
347
|
+
/**
|
|
348
|
+
* Converts the current selection to the specified list type.
|
|
349
|
+
* @group Lists
|
|
350
|
+
*/
|
|
351
|
+
export declare const applyListType$: NodeRef<"" | ListType>;
|
|
352
|
+
|
|
353
|
+
/* Excluded from this release type: autoFocus$ */
|
|
354
|
+
|
|
355
|
+
declare interface BaseImageParameters {
|
|
356
|
+
altText?: string;
|
|
357
|
+
title?: string;
|
|
358
|
+
width?: number;
|
|
359
|
+
height?: number;
|
|
360
|
+
}
|
|
361
|
+
|
|
362
|
+
/**
|
|
363
|
+
* The type of the block that the current selection is in.
|
|
364
|
+
* @group Core
|
|
365
|
+
*/
|
|
366
|
+
export declare type BlockType = 'paragraph' | 'quote' | HeadingTagType | '';
|
|
367
|
+
|
|
368
|
+
/**
|
|
369
|
+
* A toolbar component that allows the user to change the block type of the current selection.
|
|
370
|
+
* Supports paragraphs, headings and block quotes.
|
|
371
|
+
* @group Toolbar Components
|
|
372
|
+
*/
|
|
373
|
+
export declare const BlockTypeSelect: () => JSX.Element | null;
|
|
374
|
+
|
|
375
|
+
/**
|
|
376
|
+
* A toolbar component that lets the user toggle bold, italic and underline formatting.
|
|
377
|
+
* @group Toolbar Components
|
|
378
|
+
*/
|
|
379
|
+
export declare const BoldItalicUnderlineToggles: default_2.FC<BoldItalicUnderlineTogglesProps>;
|
|
380
|
+
|
|
381
|
+
export declare interface BoldItalicUnderlineTogglesProps {
|
|
382
|
+
options?: ('Bold' | 'Italic' | 'Underline')[];
|
|
383
|
+
}
|
|
384
|
+
|
|
385
|
+
/* Excluded from this release type: bottomAreaChildren$ */
|
|
386
|
+
|
|
387
|
+
/**
|
|
388
|
+
* A toolbar button primitive.
|
|
389
|
+
* @group Toolbar Primitives
|
|
390
|
+
*/
|
|
391
|
+
export declare const Button: default_2.ForwardRefExoticComponent<RadixToolbar.ToolbarButtonProps & default_2.RefAttributes<HTMLButtonElement>>;
|
|
392
|
+
|
|
393
|
+
/**
|
|
394
|
+
* Use this primitive to create a toolbar button that can be either a button or a dropdown, depending on the number of items passed.
|
|
395
|
+
* @group Toolbar Primitives
|
|
396
|
+
*/
|
|
397
|
+
export declare const ButtonOrDropdownButton: <T extends string>(props: {
|
|
398
|
+
/**
|
|
399
|
+
* The contents of the button - usually an icon.
|
|
400
|
+
*/
|
|
401
|
+
children: default_2.ReactNode;
|
|
402
|
+
/**
|
|
403
|
+
* The title used for the tooltip.
|
|
404
|
+
*/
|
|
405
|
+
title: string;
|
|
406
|
+
/**
|
|
407
|
+
* The function to execute when the button is clicked or an item is chosen from the dropdown.
|
|
408
|
+
* If there is only one item in the dropdown, the value will be an empty string.
|
|
409
|
+
*/
|
|
410
|
+
onChoose: (value: T) => void;
|
|
411
|
+
/**
|
|
412
|
+
* The items to show in the dropdown.
|
|
413
|
+
*/
|
|
414
|
+
items: {
|
|
415
|
+
/**
|
|
416
|
+
* The value to pass to the `onChoose` function when this item is chosen.
|
|
417
|
+
*/
|
|
418
|
+
value: T;
|
|
419
|
+
/**
|
|
420
|
+
* The label to show in the dropdown.
|
|
421
|
+
*/
|
|
422
|
+
label: string | JSX.Element;
|
|
423
|
+
}[];
|
|
424
|
+
}) => JSX.Element;
|
|
425
|
+
|
|
426
|
+
/**
|
|
427
|
+
* A toolbar button with tooltip primitive.
|
|
428
|
+
* @group Toolbar Primitives
|
|
429
|
+
*/
|
|
430
|
+
export declare const ButtonWithTooltip: ({ title, children, ...props }: RadixToolbar.ToolbarButtonProps & default_2.RefAttributes<HTMLButtonElement> & {
|
|
431
|
+
title: string;
|
|
432
|
+
}) => JSX.Element;
|
|
433
|
+
|
|
434
|
+
/**
|
|
435
|
+
* Calls the passed function.
|
|
436
|
+
* @group Utils
|
|
437
|
+
*/
|
|
438
|
+
export declare function call(proc: () => unknown): void;
|
|
439
|
+
|
|
440
|
+
/* Excluded from this release type: CAN_USE_DOM */
|
|
441
|
+
|
|
442
|
+
/**
|
|
443
|
+
* An action that cancel the edit of the current link.
|
|
444
|
+
* @group Link Dialog
|
|
445
|
+
*/
|
|
446
|
+
export declare const cancelLinkEdit$: NodeRef<void>;
|
|
447
|
+
|
|
448
|
+
/**
|
|
449
|
+
* A component that allows the user to change the admonition type of the current selection.
|
|
450
|
+
* For this component to work, you must pass the {@link AdmonitionDirectiveDescriptor} to the `directivesPlugin` `directiveDescriptors` parameter.
|
|
451
|
+
* @group Toolbar Components
|
|
452
|
+
*/
|
|
453
|
+
export declare const ChangeAdmonitionType: () => default_2.JSX.Element;
|
|
454
|
+
|
|
455
|
+
/**
|
|
456
|
+
* A component that allows the user to change the code block language of the current selection.
|
|
457
|
+
* For this component to work, you must enable the `codeMirrorPlugin` for the editor.
|
|
458
|
+
* See {@link ConditionalContents} for an example on how to display the dropdown only when a code block is in focus.
|
|
459
|
+
* @group Toolbar Components
|
|
460
|
+
*/
|
|
461
|
+
export declare const ChangeCodeMirrorLanguage: () => default_2.JSX.Element | null;
|
|
462
|
+
|
|
463
|
+
export declare type ClickLinkCallback = (url: string) => void;
|
|
464
|
+
|
|
465
|
+
/**
|
|
466
|
+
* Close the image dialog.
|
|
467
|
+
* @group Image
|
|
468
|
+
*/
|
|
469
|
+
export declare const closeImageDialog$: NodeRef<void>;
|
|
470
|
+
|
|
471
|
+
/* Excluded from this release type: cmExtensions$ */
|
|
472
|
+
|
|
473
|
+
/**
|
|
474
|
+
* A set of functions that modify the underlying code block node.
|
|
475
|
+
* Access this with the {@link useCodeBlockEditorContext} hook in your custom code editor components.
|
|
476
|
+
* @group Code Block
|
|
477
|
+
*/
|
|
478
|
+
export declare interface CodeBlockEditorContextValue {
|
|
479
|
+
/**
|
|
480
|
+
* Updates the code contents of the code block.
|
|
481
|
+
*/
|
|
482
|
+
setCode: (code: string) => void;
|
|
483
|
+
/**
|
|
484
|
+
* Updates the language of the code block. See {@link https://www.markdownguide.org/extended-syntax/#syntax-highlighting} for language examples.
|
|
485
|
+
*
|
|
486
|
+
*/
|
|
487
|
+
setLanguage: (language: string) => void;
|
|
488
|
+
/**
|
|
489
|
+
* Updates the meta of the code block. The meta is the additional string that comes after the code block language.
|
|
490
|
+
*/
|
|
491
|
+
setMeta: (meta: string) => void;
|
|
492
|
+
/**
|
|
493
|
+
* The Lexical node that's being edited.
|
|
494
|
+
*/
|
|
495
|
+
lexicalNode: CodeBlockNode;
|
|
496
|
+
/**
|
|
497
|
+
* The parent Lexical editor.
|
|
498
|
+
*/
|
|
499
|
+
parentEditor: LexicalEditor;
|
|
500
|
+
}
|
|
501
|
+
|
|
502
|
+
/**
|
|
503
|
+
* Implement this interface to create a custom code block editor.
|
|
504
|
+
* Pass the object in the {@link codeBlockPlugin} parameters.
|
|
505
|
+
* @group Code Block
|
|
506
|
+
*/
|
|
507
|
+
export declare interface CodeBlockEditorDescriptor {
|
|
508
|
+
/**
|
|
509
|
+
* The priority of the descriptor when descriptors are matched against a given code block. Lower number means lower priority.
|
|
510
|
+
* This allows you to implement a catch-all generic editor and a more specific editor for a given language / meta.
|
|
511
|
+
*/
|
|
512
|
+
priority: number;
|
|
513
|
+
/**
|
|
514
|
+
* A function that returns true if the descriptor's editor should be used for the given code block.
|
|
515
|
+
* @param language - The language of the code block.
|
|
516
|
+
* @param meta - The meta of the code block.
|
|
517
|
+
*/
|
|
518
|
+
match: (language: string | null | undefined, meta: string | null | undefined) => boolean;
|
|
519
|
+
/**
|
|
520
|
+
* The React component to be used. See {@link CodeBlockEditorProps} for the props passed to the component.
|
|
521
|
+
*/
|
|
522
|
+
Editor: React.ComponentType<CodeBlockEditorProps>;
|
|
523
|
+
}
|
|
524
|
+
|
|
525
|
+
/**
|
|
526
|
+
* Contains the currently registered code block descriptors.
|
|
527
|
+
* @group Code Block
|
|
528
|
+
*/
|
|
529
|
+
export declare const codeBlockEditorDescriptors$: NodeRef<CodeBlockEditorDescriptor[]>;
|
|
530
|
+
|
|
531
|
+
/**
|
|
532
|
+
* The properties passed to the {@link CodeBlockEditorDescriptor.Editor} component.
|
|
533
|
+
* @group Code Block
|
|
534
|
+
*/
|
|
535
|
+
export declare interface CodeBlockEditorProps {
|
|
536
|
+
/**
|
|
537
|
+
* The code to edit.
|
|
538
|
+
*/
|
|
539
|
+
code: string;
|
|
540
|
+
/**
|
|
541
|
+
* The language of the fenced code block.
|
|
542
|
+
*/
|
|
543
|
+
language: string;
|
|
544
|
+
/**
|
|
545
|
+
* The meta of the fenced code block.
|
|
546
|
+
*/
|
|
547
|
+
meta: string;
|
|
548
|
+
/**
|
|
549
|
+
* The key of the Lexical node - use this if you are dealing with the Lexical APIs.
|
|
550
|
+
*/
|
|
551
|
+
nodeKey: string;
|
|
552
|
+
/**
|
|
553
|
+
* An emitter that will execute its subscription when the editor should be focused.
|
|
554
|
+
* Note: you don't need to unsubscribe, the emiter has a single subscription model.
|
|
555
|
+
*/
|
|
556
|
+
focusEmitter: VoidEmitter;
|
|
557
|
+
}
|
|
558
|
+
|
|
559
|
+
/**
|
|
560
|
+
* A code block language entry with a name and optional aliases/extensions.
|
|
561
|
+
* Compatible with CodeMirror's `LanguageDescription` from `@codemirror/language-data`.
|
|
562
|
+
* @group CodeMirror
|
|
563
|
+
*/
|
|
564
|
+
export declare interface CodeBlockLanguage {
|
|
565
|
+
/** Display name shown in the language select dropdown. */
|
|
566
|
+
name: string;
|
|
567
|
+
/** Alternative identifiers for this language (e.g. `["js"]` for JavaScript). */
|
|
568
|
+
alias?: readonly string[];
|
|
569
|
+
/** File extensions associated with this language (e.g. `["js", "mjs"]`). */
|
|
570
|
+
extensions?: readonly string[];
|
|
571
|
+
/** Pre-loaded language support. When provided, this is used directly instead of auto-loading. */
|
|
572
|
+
support?: CodeBlockLanguageSupport;
|
|
573
|
+
}
|
|
574
|
+
|
|
575
|
+
/**
|
|
576
|
+
* The normalized code block languages used by the CodeMirror editor.
|
|
577
|
+
* @group CodeMirror
|
|
578
|
+
*/
|
|
579
|
+
export declare const codeBlockLanguages$: NodeRef<NormalizedCodeBlockLanguages>;
|
|
580
|
+
|
|
581
|
+
/**
|
|
582
|
+
* Compatible with CodeMirror `LanguageSupport` objects without exposing that package in the public API.
|
|
583
|
+
* @group CodeMirror
|
|
584
|
+
*/
|
|
585
|
+
export declare interface CodeBlockLanguageSupport {
|
|
586
|
+
extension: Extension_3;
|
|
587
|
+
}
|
|
588
|
+
|
|
589
|
+
/**
|
|
590
|
+
* A lexical node that represents a fenced code block. Use {@link "$createCodeBlockNode"} to construct one.
|
|
591
|
+
* @group Code Block
|
|
592
|
+
*/
|
|
593
|
+
export declare class CodeBlockNode extends DecoratorNode<JSX.Element> {
|
|
594
|
+
__code: string;
|
|
595
|
+
__meta: string;
|
|
596
|
+
__language: string;
|
|
597
|
+
__focusEmitter: {
|
|
598
|
+
publish: () => void;
|
|
599
|
+
subscribe: (cb: () => void) => void;
|
|
600
|
+
};
|
|
601
|
+
static getType(): string;
|
|
602
|
+
static clone(node: CodeBlockNode): CodeBlockNode;
|
|
603
|
+
afterCloneFrom(prevNode: this): void;
|
|
604
|
+
static importJSON(serializedNode: SerializedCodeBlockNode): CodeBlockNode;
|
|
605
|
+
static importDOM(): DOMConversionMap;
|
|
606
|
+
constructor(code: string, language: string, meta: string, key?: NodeKey);
|
|
607
|
+
exportJSON(): SerializedCodeBlockNode;
|
|
608
|
+
createDOM(_config: EditorConfig, _editor: LexicalEditor): HTMLDivElement;
|
|
609
|
+
updateDOM(): false;
|
|
610
|
+
getCode(): string;
|
|
611
|
+
getMeta(): string;
|
|
612
|
+
getLanguage(): string;
|
|
613
|
+
setCode: (code: string) => void;
|
|
614
|
+
setMeta: (meta: string) => void;
|
|
615
|
+
setLanguage: (language: string) => void;
|
|
616
|
+
select: () => void;
|
|
617
|
+
decorate(editor: LexicalEditor): JSX.Element;
|
|
618
|
+
isInline(): boolean;
|
|
619
|
+
}
|
|
620
|
+
|
|
621
|
+
/**
|
|
622
|
+
* A plugin that adds support for code blocks and custom code block editors.
|
|
623
|
+
* @group Code Block
|
|
624
|
+
*/
|
|
625
|
+
export declare const codeBlockPlugin: (params?: {
|
|
626
|
+
/**
|
|
627
|
+
* Pass an array of {@link CodeBlockEditorDescriptor} to register custom code block editors.
|
|
628
|
+
*/
|
|
629
|
+
codeBlockEditorDescriptors?: CodeBlockEditorDescriptor[];
|
|
630
|
+
/**
|
|
631
|
+
* The default code block language. Used when inserting a new code block, and as a fallback at import time for
|
|
632
|
+
* fences whose language has no matching descriptor.
|
|
633
|
+
*/
|
|
634
|
+
defaultCodeBlockLanguage?: string;
|
|
635
|
+
} | undefined) => RealmPlugin;
|
|
636
|
+
|
|
637
|
+
/**
|
|
638
|
+
* Whether or not to try to dynamically load the code block language support.
|
|
639
|
+
* Disable if you want to manually pass the supported languages.
|
|
640
|
+
* @group CodeMirror
|
|
641
|
+
*/
|
|
642
|
+
export declare const codeMirrorAutoLoadLanguageSupport$: NodeRef<boolean>;
|
|
643
|
+
|
|
644
|
+
export declare const CodeMirrorEditor: ({ language, nodeKey, code, focusEmitter }: CodeBlockEditorProps) => default_2.JSX.Element;
|
|
645
|
+
|
|
646
|
+
/**
|
|
647
|
+
* The code mirror extensions for the coemirror code block editor.
|
|
648
|
+
* @group CodeMirror
|
|
649
|
+
*/
|
|
650
|
+
export declare const codeMirrorExtensions$: NodeRef<Extension_3[]>;
|
|
651
|
+
|
|
652
|
+
/**
|
|
653
|
+
* A plugin that adds lets users edit code blocks with CodeMirror.
|
|
654
|
+
* @group CodeMirror
|
|
655
|
+
*/
|
|
656
|
+
export declare const codeMirrorPlugin: (params?: {
|
|
657
|
+
/**
|
|
658
|
+
* The code block languages to display in the language select dropdown.
|
|
659
|
+
* Accepts either a `Record<string, string>` (key → label) for backwards compatibility,
|
|
660
|
+
* or an array of {@link CodeBlockLanguage} objects (compatible with CodeMirror's `LanguageDescription`
|
|
661
|
+
* from `@codemirror/language-data`), which supports aliases and file extensions.
|
|
662
|
+
*/
|
|
663
|
+
codeBlockLanguages: Record<string, string> | CodeBlockLanguage[];
|
|
664
|
+
/**
|
|
665
|
+
* Optional, additional CodeMirror extensions to load in the diff/source mode.
|
|
666
|
+
*/
|
|
667
|
+
codeMirrorExtensions?: Extension_3[];
|
|
668
|
+
/**
|
|
669
|
+
* Whether or not to try to dynamically load the code block language support.
|
|
670
|
+
* Disable if you want to manually pass the supported languages.
|
|
671
|
+
* @group CodeMirror
|
|
672
|
+
*/
|
|
673
|
+
autoLoadLanguageSupport?: boolean;
|
|
674
|
+
} | undefined) => RealmPlugin;
|
|
675
|
+
|
|
676
|
+
/**
|
|
677
|
+
* A toolbar component that lets the user toggle code formatting.
|
|
678
|
+
* Use for inline `code` elements (like variables, methods, etc).
|
|
679
|
+
* @group Toolbar Components
|
|
680
|
+
*/
|
|
681
|
+
export declare const CodeToggle: default_2.FC;
|
|
682
|
+
|
|
683
|
+
export declare const COMMON_STATE_CONFIG_EXTENSIONS: Extension_3[];
|
|
684
|
+
|
|
685
|
+
/**
|
|
686
|
+
* Performs left to right composition of two functions.
|
|
687
|
+
* @group Utils
|
|
688
|
+
*/
|
|
689
|
+
export declare function compose<I, A, R>(a: (arg: A) => R, b: (arg: I) => A): (arg: I) => R;
|
|
690
|
+
|
|
691
|
+
/* Excluded from this release type: composerChildren$ */
|
|
692
|
+
|
|
693
|
+
/**
|
|
694
|
+
* A toolbar primitive that allows you to show different contents based on the editor that is in focus.
|
|
695
|
+
* Useful for code editors that have different features and don't support rich text formatting.
|
|
696
|
+
* @example
|
|
697
|
+
* ```tsx
|
|
698
|
+
* <ConditionalContents
|
|
699
|
+
* options={[
|
|
700
|
+
* { when: (editor) => editor?.editorType === 'codeblock', contents: () => <ChangeCodeMirrorLanguage /> },
|
|
701
|
+
* {
|
|
702
|
+
* fallback: () => (
|
|
703
|
+
* <>
|
|
704
|
+
* <UndoRedo />
|
|
705
|
+
* <BoldItalicUnderlineToggles />
|
|
706
|
+
* <InsertCodeBlock />
|
|
707
|
+
* </>
|
|
708
|
+
* )
|
|
709
|
+
* }
|
|
710
|
+
* ]}
|
|
711
|
+
* />
|
|
712
|
+
* ```
|
|
713
|
+
* @group Toolbar Primitives
|
|
714
|
+
*/
|
|
715
|
+
export declare const ConditionalContents: default_2.FC<{
|
|
716
|
+
/**
|
|
717
|
+
* A set of options that define the contents to show based on the editor that is in focus.
|
|
718
|
+
* Can be either a {@link ConditionalContentsOption} or a {@link FallbackOption}.
|
|
719
|
+
* See the {@link ConditionalContents} documentation for an example.
|
|
720
|
+
*/
|
|
721
|
+
options: (ConditionalContentsOption | FallbackOption)[];
|
|
722
|
+
}>;
|
|
723
|
+
|
|
724
|
+
/**
|
|
725
|
+
* An object that describes a possible option to be displayed in the {@link ConditionalContents} component.
|
|
726
|
+
* @group Toolbar Primitives
|
|
727
|
+
*/
|
|
728
|
+
export declare interface ConditionalContentsOption {
|
|
729
|
+
/**
|
|
730
|
+
* A function that returns `true` if the option should be displayed for the current editor in focus.
|
|
731
|
+
*/
|
|
732
|
+
when: (rootNode: EditorInFocus | null) => boolean;
|
|
733
|
+
/**
|
|
734
|
+
* The contents to display if the `when` function returns `true`.
|
|
735
|
+
*/
|
|
736
|
+
contents: () => default_2.ReactNode;
|
|
737
|
+
}
|
|
738
|
+
|
|
739
|
+
/**
|
|
740
|
+
* Holds the CSS class name of the content editable element.
|
|
741
|
+
* @group Core
|
|
742
|
+
*/
|
|
743
|
+
export declare const contentEditableClassName$: NodeRef<string>;
|
|
744
|
+
|
|
745
|
+
/**
|
|
746
|
+
* A reference to the content editable element.
|
|
747
|
+
* @group Core
|
|
748
|
+
*/
|
|
749
|
+
export declare const contentEditableRef$: NodeRef<default_2.RefObject<HTMLDivElement> | null>;
|
|
750
|
+
|
|
751
|
+
export declare const contentEditableWrapperElement$: NodeRef<HTMLDivElement | null>;
|
|
752
|
+
|
|
753
|
+
/**
|
|
754
|
+
* Returns true if the user is pressing the control key on Windows or the meta key on Mac.
|
|
755
|
+
* @group Utils
|
|
756
|
+
*/
|
|
757
|
+
export declare function controlOrMeta(metaKey: boolean, ctrlKey: boolean): boolean;
|
|
758
|
+
|
|
759
|
+
/**
|
|
760
|
+
* Converts the current selection to a node created by the published factory.
|
|
761
|
+
* @group Core
|
|
762
|
+
*/
|
|
763
|
+
export declare const convertSelectionToNode$: NodeRef<() => ElementNode>;
|
|
764
|
+
|
|
765
|
+
declare type CoordinatesSubscription = (coords: [colIndex: number, rowIndex: number]) => void;
|
|
766
|
+
|
|
767
|
+
/* Excluded from this release type: corePlugin */
|
|
768
|
+
|
|
769
|
+
/**
|
|
770
|
+
* An input signal that lets you register a new {@link EditorSubscription} for the active editor.
|
|
771
|
+
* The subscriptions are automatically cleaned up and re-bound when the active editor changes.
|
|
772
|
+
* @example
|
|
773
|
+
* ```tsx
|
|
774
|
+
* realm.pub(createActiveEditorSubscription$, (theEditor) => {
|
|
775
|
+
* return theEditor.registerUpdateListener(() => { ... })
|
|
776
|
+
* // or a command
|
|
777
|
+
* // return theEditor.registerCommand('my-command', () => { ... })
|
|
778
|
+
* })
|
|
779
|
+
* ```
|
|
780
|
+
* @group Core
|
|
781
|
+
*/
|
|
782
|
+
export declare const createActiveEditorSubscription$: NodeRef<EditorSubscription | EditorSubscription[]>;
|
|
783
|
+
|
|
784
|
+
/**
|
|
785
|
+
* The options necessary to construct a new code block node.
|
|
786
|
+
* @group Code Block
|
|
787
|
+
*/
|
|
788
|
+
export declare interface CreateCodeBlockNodeOptions {
|
|
789
|
+
/**
|
|
790
|
+
* The code contents of the block.
|
|
791
|
+
*/
|
|
792
|
+
code: string;
|
|
793
|
+
/**
|
|
794
|
+
* The language of the code block (i.e. `js`, `jsx`, etc.). This is used for syntax highlighting.
|
|
795
|
+
*/
|
|
796
|
+
language: string;
|
|
797
|
+
/**
|
|
798
|
+
* The additional meta data of the block.
|
|
799
|
+
*/
|
|
800
|
+
meta: string;
|
|
801
|
+
}
|
|
802
|
+
|
|
803
|
+
/**
|
|
804
|
+
* The parameters used to create an {@link ImageNode} through {@link $createImageNode}.
|
|
805
|
+
* @group Image
|
|
806
|
+
*/
|
|
807
|
+
export declare interface CreateImageNodeParameters {
|
|
808
|
+
altText: string;
|
|
809
|
+
width?: number;
|
|
810
|
+
height?: number;
|
|
811
|
+
title?: string;
|
|
812
|
+
key?: NodeKey;
|
|
813
|
+
rest?: (MdxJsxAttribute | MdxJsxExpressionAttribute)[];
|
|
814
|
+
src: string;
|
|
815
|
+
}
|
|
816
|
+
|
|
817
|
+
/**
|
|
818
|
+
* A toolbar component that opens the link edit dialog.
|
|
819
|
+
* For this component to work, you must include the `linkDialogPlugin`.
|
|
820
|
+
* @group Toolbar Components
|
|
821
|
+
*/
|
|
822
|
+
export declare const CreateLink: () => default_2.JSX.Element;
|
|
823
|
+
|
|
824
|
+
/**
|
|
825
|
+
* An input signal that lets you register a new {@link EditorSubscription} for the root editor.
|
|
826
|
+
* @example
|
|
827
|
+
* ```tsx
|
|
828
|
+
* realm.pub(createRootEditorSubscription$, (theEditor) => {
|
|
829
|
+
* return theEditor.registerUpdateListener(() => { ... })
|
|
830
|
+
* // or a command
|
|
831
|
+
* // return theEditor.registerCommand('my-command', () => { ... })
|
|
832
|
+
* })
|
|
833
|
+
* ```
|
|
834
|
+
* @group Core
|
|
835
|
+
*/
|
|
836
|
+
export declare const createRootEditorSubscription$: NodeRef<EditorSubscription | EditorSubscription[]>;
|
|
837
|
+
|
|
838
|
+
/**
|
|
839
|
+
* Holds the current block type of the selection (i.e. Heading, Paragraph, etc).
|
|
840
|
+
* @group Core
|
|
841
|
+
*/
|
|
842
|
+
export declare const currentBlockType$: NodeRef<BlockType>;
|
|
843
|
+
|
|
844
|
+
/**
|
|
845
|
+
* Holds the current format of the selection.
|
|
846
|
+
* @group Core
|
|
847
|
+
*/
|
|
848
|
+
export declare const currentFormat$: NodeRef<FORMAT>;
|
|
849
|
+
|
|
850
|
+
/**
|
|
851
|
+
* The current list type in the editor.
|
|
852
|
+
* @group Lists
|
|
853
|
+
*/
|
|
854
|
+
export declare const currentListType$: NodeRef<"" | ListType>;
|
|
855
|
+
|
|
856
|
+
/**
|
|
857
|
+
* Holds the current selection.
|
|
858
|
+
* @group Core
|
|
859
|
+
*/
|
|
860
|
+
export declare const currentSelection$: NodeRef<RangeSelection | null>;
|
|
861
|
+
|
|
862
|
+
/**
|
|
863
|
+
* Takes a 1 argument function and returns a function which when called, executes it with the provided argument.
|
|
864
|
+
* @group Utils
|
|
865
|
+
*/
|
|
866
|
+
export declare function curry1to0<T, R>(proc: (arg: T) => R, arg: T): () => R;
|
|
867
|
+
|
|
868
|
+
/**
|
|
869
|
+
* Takes a 2 argument function and partially applies the first argument.
|
|
870
|
+
* @group Utils
|
|
871
|
+
*/
|
|
872
|
+
export declare function curry2to1<T, K, R>(proc: (arg1: T, arg2: K) => R, arg1: T): (arg2: K) => R;
|
|
873
|
+
|
|
874
|
+
export declare const debouncedIndexer$: NodeRef<TextNodeIndex>;
|
|
875
|
+
|
|
876
|
+
export declare const DEFAULT_FORMAT: 0;
|
|
877
|
+
|
|
878
|
+
/**
|
|
879
|
+
* The default code block language. Used both when inserting a new code block without an explicit language, and as a
|
|
880
|
+
* fallback at import time when a fence's own language doesn't match any registered descriptor.
|
|
881
|
+
* @group Code Block
|
|
882
|
+
*/
|
|
883
|
+
export declare const defaultCodeBlockLanguage$: NodeRef<string>;
|
|
884
|
+
|
|
885
|
+
export declare const defaultSvgIcons: {
|
|
886
|
+
undo: default_2.JSX.Element;
|
|
887
|
+
redo: default_2.JSX.Element;
|
|
888
|
+
format_bold: default_2.JSX.Element;
|
|
889
|
+
format_italic: default_2.JSX.Element;
|
|
890
|
+
format_underlined: default_2.JSX.Element;
|
|
891
|
+
format_highlight: default_2.JSX.Element;
|
|
892
|
+
code: default_2.JSX.Element;
|
|
893
|
+
strikeThrough: default_2.JSX.Element;
|
|
894
|
+
superscript: default_2.JSX.Element;
|
|
895
|
+
subscript: default_2.JSX.Element;
|
|
896
|
+
format_list_bulleted: default_2.JSX.Element;
|
|
897
|
+
format_list_numbered: default_2.JSX.Element;
|
|
898
|
+
format_list_checked: default_2.JSX.Element;
|
|
899
|
+
link: default_2.JSX.Element;
|
|
900
|
+
add_photo: default_2.JSX.Element;
|
|
901
|
+
table: default_2.JSX.Element;
|
|
902
|
+
horizontal_rule: default_2.JSX.Element;
|
|
903
|
+
frontmatter: default_2.JSX.Element;
|
|
904
|
+
frame_source: default_2.JSX.Element;
|
|
905
|
+
arrow_drop_down: default_2.JSX.Element;
|
|
906
|
+
admonition: default_2.JSX.Element;
|
|
907
|
+
rich_text: default_2.JSX.Element;
|
|
908
|
+
difference: default_2.JSX.Element;
|
|
909
|
+
markdown: default_2.JSX.Element;
|
|
910
|
+
open_in_new: default_2.JSX.Element;
|
|
911
|
+
link_off: default_2.JSX.Element;
|
|
912
|
+
edit: default_2.JSX.Element;
|
|
913
|
+
content_copy: default_2.JSX.Element;
|
|
914
|
+
more_horiz: default_2.JSX.Element;
|
|
915
|
+
more_vert: default_2.JSX.Element;
|
|
916
|
+
close: default_2.JSX.Element;
|
|
917
|
+
settings: default_2.JSX.Element;
|
|
918
|
+
delete_big: default_2.JSX.Element;
|
|
919
|
+
delete_small: default_2.JSX.Element;
|
|
920
|
+
format_align_center: default_2.JSX.Element;
|
|
921
|
+
format_align_left: default_2.JSX.Element;
|
|
922
|
+
format_align_right: default_2.JSX.Element;
|
|
923
|
+
add_row: default_2.JSX.Element;
|
|
924
|
+
add_column: default_2.JSX.Element;
|
|
925
|
+
insert_col_left: default_2.JSX.Element;
|
|
926
|
+
insert_row_above: default_2.JSX.Element;
|
|
927
|
+
insert_row_below: default_2.JSX.Element;
|
|
928
|
+
insert_col_right: default_2.JSX.Element;
|
|
929
|
+
check: default_2.JSX.Element;
|
|
930
|
+
};
|
|
931
|
+
|
|
932
|
+
/**
|
|
933
|
+
* Per-plugin import context passed to {@link MdastImportVisitor} functions.
|
|
934
|
+
*/
|
|
935
|
+
export declare interface Descriptors {
|
|
936
|
+
jsxComponentDescriptors: JsxComponentDescriptor[];
|
|
937
|
+
directiveDescriptors: DirectiveDescriptor[];
|
|
938
|
+
codeBlockEditorDescriptors: CodeBlockEditorDescriptor[];
|
|
939
|
+
/**
|
|
940
|
+
* The fallback language used to select a code block editor when a fenced code block's own language has no matching descriptor.
|
|
941
|
+
*/
|
|
942
|
+
defaultCodeBlockLanguage?: string;
|
|
943
|
+
}
|
|
944
|
+
|
|
945
|
+
/**
|
|
946
|
+
* Use this primitive to create a toolbar button that opens a dialog with a text input, autocomplete suggestions, and a submit button.
|
|
947
|
+
* @group Toolbar Primitives
|
|
948
|
+
*/
|
|
949
|
+
export declare const DialogButton: default_2.ForwardRefExoticComponent<{
|
|
950
|
+
/**
|
|
951
|
+
* The autocomplete suggestions to show in the dialog input.
|
|
952
|
+
*/
|
|
953
|
+
autocompleteSuggestions?: string[];
|
|
954
|
+
/**
|
|
955
|
+
* The callback to call when the dialog is submitted. The callback receives the value of the text input as a parameter.
|
|
956
|
+
*/
|
|
957
|
+
onSubmit: (value: string) => void;
|
|
958
|
+
/**
|
|
959
|
+
* The title to show in the tooltip of the toolbar button.
|
|
960
|
+
*/
|
|
961
|
+
tooltipTitle: string;
|
|
962
|
+
/**
|
|
963
|
+
* The contents of the button. Usually an icon.
|
|
964
|
+
* @example
|
|
965
|
+
* ```tsx
|
|
966
|
+
* <DialogButton buttonContent={<CustomIcon />} />
|
|
967
|
+
* ```
|
|
968
|
+
*/
|
|
969
|
+
buttonContent?: default_2.ReactNode;
|
|
970
|
+
/**
|
|
971
|
+
* The placeholder text to show in the dialog input.
|
|
972
|
+
*/
|
|
973
|
+
dialogInputPlaceholder: string;
|
|
974
|
+
/**
|
|
975
|
+
* The title of the submit button.
|
|
976
|
+
*/
|
|
977
|
+
submitButtonTitle: string;
|
|
978
|
+
} & default_2.RefAttributes<HTMLButtonElement>>;
|
|
979
|
+
|
|
980
|
+
/* Excluded from this release type: diffMarkdown$ */
|
|
981
|
+
|
|
982
|
+
/**
|
|
983
|
+
* @group Diff/Source
|
|
984
|
+
*/
|
|
985
|
+
export declare const diffSourcePlugin: (params?: {
|
|
986
|
+
/**
|
|
987
|
+
* The initial view mode of the editor.
|
|
988
|
+
* @default 'rich-text'
|
|
989
|
+
*/
|
|
990
|
+
viewMode?: ViewMode;
|
|
991
|
+
/**
|
|
992
|
+
* The markdown to show in the diff editor.
|
|
993
|
+
* @default ''
|
|
994
|
+
*/
|
|
995
|
+
diffMarkdown?: string;
|
|
996
|
+
/**
|
|
997
|
+
* Optional, additional CodeMirror extensions to load in the diff/source mode.
|
|
998
|
+
*/
|
|
999
|
+
codeMirrorExtensions?: Extension_3[];
|
|
1000
|
+
/**
|
|
1001
|
+
* Set the diff editor to read-only.
|
|
1002
|
+
* @default false
|
|
1003
|
+
*/
|
|
1004
|
+
readOnlyDiff?: boolean;
|
|
1005
|
+
} | undefined) => RealmPlugin;
|
|
1006
|
+
|
|
1007
|
+
/**
|
|
1008
|
+
* A wrapper element for the toolbar contents that lets the user toggle between rich text, diff and source mode.
|
|
1009
|
+
* Put the rich text toolbar contents as children of this component.
|
|
1010
|
+
* For this component to work, you must include the `diffSourcePlugin`.
|
|
1011
|
+
*
|
|
1012
|
+
* @example
|
|
1013
|
+
* ```tsx
|
|
1014
|
+
* <MDXEditor markdown='Hello world'
|
|
1015
|
+
* plugins={[toolbarPlugin({
|
|
1016
|
+
* toolbarContents: () => ( <> <DiffSourceToggleWrapper><UndoRedo /><BoldItalicUnderlineToggles /></DiffSourceToggleWrapper></>)
|
|
1017
|
+
* }), diffSourcePlugin()]}
|
|
1018
|
+
* />
|
|
1019
|
+
* ```
|
|
1020
|
+
*
|
|
1021
|
+
* @group Toolbar Components
|
|
1022
|
+
*/
|
|
1023
|
+
export declare const DiffSourceToggleWrapper: default_2.FC<{
|
|
1024
|
+
children: default_2.ReactNode;
|
|
1025
|
+
options?: ViewMode[];
|
|
1026
|
+
SourceToolbar?: default_2.ReactNode;
|
|
1027
|
+
}>;
|
|
1028
|
+
|
|
1029
|
+
/**
|
|
1030
|
+
* Implement this interface to create a custom editor for markdown directives.
|
|
1031
|
+
* Pass the object in the `directivesPlugin` parameters.
|
|
1032
|
+
* @group Directive
|
|
1033
|
+
*/
|
|
1034
|
+
export declare interface DirectiveDescriptor<T extends Directives = Directives> {
|
|
1035
|
+
/**
|
|
1036
|
+
* Whether the descriptor's Editor should be used for the given node.
|
|
1037
|
+
* @param node - The directive mdast node. You can code your logic against the node's name, type, attributes, children, etc.
|
|
1038
|
+
*/
|
|
1039
|
+
testNode(node: Directives): boolean;
|
|
1040
|
+
/**
|
|
1041
|
+
* The name of the descriptor - use this if you're building UI for the user to select a directive.
|
|
1042
|
+
*/
|
|
1043
|
+
name: string;
|
|
1044
|
+
/**
|
|
1045
|
+
* The attributes that the directive has. This can be used when building the UI for the user to configure a directive. The {@link GenericDirectiveEditor} uses those to display a property form.
|
|
1046
|
+
*/
|
|
1047
|
+
attributes: string[];
|
|
1048
|
+
/**
|
|
1049
|
+
* Whether or not the directive has inner markdown content as children. Used by the {@link GenericDirectiveEditor} to determine whether to show the inner markdown editor.
|
|
1050
|
+
*/
|
|
1051
|
+
hasChildren: boolean;
|
|
1052
|
+
/**
|
|
1053
|
+
* The type of the supported directive. Can be one of: 'leafDirective' | 'containerDirective' | 'textDirective'.
|
|
1054
|
+
*/
|
|
1055
|
+
type?: 'leafDirective' | 'containerDirective' | 'textDirective';
|
|
1056
|
+
/**
|
|
1057
|
+
* The React component to be used as an Editor. See {@link DirectiveEditorProps} for the props passed to the component.
|
|
1058
|
+
*/
|
|
1059
|
+
Editor: React.ComponentType<DirectiveEditorProps<T>>;
|
|
1060
|
+
}
|
|
1061
|
+
|
|
1062
|
+
/**
|
|
1063
|
+
* Contains the currently registered Markdown directive descriptors.
|
|
1064
|
+
* @group Directive
|
|
1065
|
+
*/
|
|
1066
|
+
export declare const directiveDescriptors$: NodeRef<DirectiveDescriptor< Directives>[]>;
|
|
1067
|
+
|
|
1068
|
+
/**
|
|
1069
|
+
* The properties passed to the {@link DirectiveDescriptor.Editor} component.
|
|
1070
|
+
* @group Directive
|
|
1071
|
+
*/
|
|
1072
|
+
export declare interface DirectiveEditorProps<T extends Directives = Directives> {
|
|
1073
|
+
/**
|
|
1074
|
+
* The mdast directive node.
|
|
1075
|
+
*/
|
|
1076
|
+
mdastNode: T;
|
|
1077
|
+
/**
|
|
1078
|
+
* The parent lexical editor - use this if you are dealing with the Lexical APIs.
|
|
1079
|
+
*/
|
|
1080
|
+
parentEditor: LexicalEditor;
|
|
1081
|
+
/**
|
|
1082
|
+
* The Lexical directive node.
|
|
1083
|
+
*/
|
|
1084
|
+
lexicalNode: DirectiveNode;
|
|
1085
|
+
/**
|
|
1086
|
+
* The descriptor that activated the editor
|
|
1087
|
+
*/
|
|
1088
|
+
descriptor: DirectiveDescriptor;
|
|
1089
|
+
}
|
|
1090
|
+
|
|
1091
|
+
/**
|
|
1092
|
+
* A lexical node that represents an image. Use {@link "$createDirectiveNode"} to construct one.
|
|
1093
|
+
* @group Directive
|
|
1094
|
+
*/
|
|
1095
|
+
export declare class DirectiveNode extends DecoratorNode<default_2.JSX.Element> {
|
|
1096
|
+
/* Excluded from this release type: __mdastNode */
|
|
1097
|
+
/* Excluded from this release type: __focusEmitter */
|
|
1098
|
+
/* Excluded from this release type: getType */
|
|
1099
|
+
/* Excluded from this release type: clone */
|
|
1100
|
+
/* Excluded from this release type: importJSON */
|
|
1101
|
+
/**
|
|
1102
|
+
* Constructs a new {@link DirectiveNode} with the specified MDAST directive node as the object to edit.
|
|
1103
|
+
*/
|
|
1104
|
+
constructor(mdastNode: Directives, key?: NodeKey);
|
|
1105
|
+
/**
|
|
1106
|
+
* Returns the MDAST node that is being edited.
|
|
1107
|
+
*/
|
|
1108
|
+
getMdastNode(): Directives;
|
|
1109
|
+
/* Excluded from this release type: exportJSON */
|
|
1110
|
+
/* Excluded from this release type: createDOM */
|
|
1111
|
+
/* Excluded from this release type: updateDOM */
|
|
1112
|
+
/**
|
|
1113
|
+
* Sets a new MDAST node to edit.
|
|
1114
|
+
*/
|
|
1115
|
+
setMdastNode(mdastNode: Directives): void;
|
|
1116
|
+
/**
|
|
1117
|
+
* Focuses the direcitive editor.
|
|
1118
|
+
*/
|
|
1119
|
+
select: () => void;
|
|
1120
|
+
/* Excluded from this release type: decorate */
|
|
1121
|
+
/* Excluded from this release type: isInline */
|
|
1122
|
+
/* Excluded from this release type: isKeyboardSelectable */
|
|
1123
|
+
}
|
|
1124
|
+
|
|
1125
|
+
/**
|
|
1126
|
+
* A plugin that adds support for markdown directives.
|
|
1127
|
+
* @group Directive
|
|
1128
|
+
*/
|
|
1129
|
+
export declare const directivesPlugin: (params?: {
|
|
1130
|
+
/**
|
|
1131
|
+
* Use this to register your custom directive editors. You can also use the built-in {@link GenericDirectiveEditor}.
|
|
1132
|
+
*/
|
|
1133
|
+
directiveDescriptors: DirectiveDescriptor<any>[];
|
|
1134
|
+
/**
|
|
1135
|
+
* Set this option to display unknown text-directives as normal text nodes.
|
|
1136
|
+
* This is handy when colons are used to separate words, e.g. in german "Schüler:in"
|
|
1137
|
+
*/
|
|
1138
|
+
escapeUnknownTextDirectives?: boolean;
|
|
1139
|
+
} | undefined) => RealmPlugin;
|
|
1140
|
+
|
|
1141
|
+
/**
|
|
1142
|
+
* Holds whether the auto-linking of URLs and email addresses is disabled.
|
|
1143
|
+
* @group Links
|
|
1144
|
+
*/
|
|
1145
|
+
export declare const disableAutoLink$: NodeRef<boolean>;
|
|
1146
|
+
|
|
1147
|
+
/**
|
|
1148
|
+
* Holds the disable image resize configuration flag.
|
|
1149
|
+
* @group Image
|
|
1150
|
+
*/
|
|
1151
|
+
export declare const disableImageResize$: NodeRef<boolean>;
|
|
1152
|
+
|
|
1153
|
+
export declare const disableImageSettingsButton$: NodeRef<boolean>;
|
|
1154
|
+
|
|
1155
|
+
/**
|
|
1156
|
+
* Holds the custom EditImageToolbar component.
|
|
1157
|
+
* @group Image
|
|
1158
|
+
*/
|
|
1159
|
+
export declare const editImageToolbarComponent$: NodeRef<FC<EditImageToolbarProps>>;
|
|
1160
|
+
|
|
1161
|
+
declare interface EditImageToolbarProps {
|
|
1162
|
+
nodeKey: string;
|
|
1163
|
+
imageSource: string;
|
|
1164
|
+
initialImagePath: string | null;
|
|
1165
|
+
title: string;
|
|
1166
|
+
alt: string;
|
|
1167
|
+
width?: number | 'inherit';
|
|
1168
|
+
height?: number | 'inherit';
|
|
1169
|
+
}
|
|
1170
|
+
|
|
1171
|
+
/**
|
|
1172
|
+
* The state of the image dialog when it is in editing an existing node.
|
|
1173
|
+
* @group Image
|
|
1174
|
+
*/
|
|
1175
|
+
export declare interface EditingImageDialogState {
|
|
1176
|
+
type: 'editing';
|
|
1177
|
+
nodeKey: string;
|
|
1178
|
+
initialValues: Omit<SaveImageParameters, 'file'>;
|
|
1179
|
+
}
|
|
1180
|
+
|
|
1181
|
+
/**
|
|
1182
|
+
* The state of the link dialog when it is in edit mode.
|
|
1183
|
+
* @group Link Dialog
|
|
1184
|
+
*/
|
|
1185
|
+
export declare interface EditLinkDialog {
|
|
1186
|
+
type: 'edit';
|
|
1187
|
+
initialUrl: string;
|
|
1188
|
+
url: string;
|
|
1189
|
+
title: string;
|
|
1190
|
+
text: string;
|
|
1191
|
+
withAnchorText: boolean;
|
|
1192
|
+
linkNodeKey: string;
|
|
1193
|
+
rectangle: RectData;
|
|
1194
|
+
}
|
|
1195
|
+
|
|
1196
|
+
/**
|
|
1197
|
+
* The currently focused editor
|
|
1198
|
+
* @group Core
|
|
1199
|
+
*/
|
|
1200
|
+
export declare const editorInFocus$: NodeRef<EditorInFocus | null>;
|
|
1201
|
+
|
|
1202
|
+
/**
|
|
1203
|
+
* The type of the editor being edited currently. Custom editors can override this, so that the toolbar can change its contents.
|
|
1204
|
+
* @group Core
|
|
1205
|
+
*/
|
|
1206
|
+
export declare interface EditorInFocus {
|
|
1207
|
+
editorType: string;
|
|
1208
|
+
rootNode: LexicalNode | null;
|
|
1209
|
+
editorRef: unknown;
|
|
1210
|
+
}
|
|
1211
|
+
|
|
1212
|
+
/**
|
|
1213
|
+
* Whether the currently active editor is inside a table cell.
|
|
1214
|
+
* @group Core
|
|
1215
|
+
*/
|
|
1216
|
+
export declare const editorInTable$: NodeRef<boolean>;
|
|
1217
|
+
|
|
1218
|
+
/**
|
|
1219
|
+
* A reference to a DOM element. used for the various popups, dialogs, and tooltips
|
|
1220
|
+
* @group Core
|
|
1221
|
+
*/
|
|
1222
|
+
export declare const editorRootElementRef$: NodeRef<default_2.RefObject<HTMLDivElement> | null>;
|
|
1223
|
+
|
|
1224
|
+
export declare const editorSearchCursor$: NodeRef<number>;
|
|
1225
|
+
|
|
1226
|
+
export declare const editorSearchRanges$: NodeRef<Range[]>;
|
|
1227
|
+
|
|
1228
|
+
export declare const editorSearchScrollableContent$: NodeRef<HTMLElement | null>;
|
|
1229
|
+
|
|
1230
|
+
export declare const editorSearchTerm$: NodeRef<string>;
|
|
1231
|
+
|
|
1232
|
+
export declare const editorSearchTermDebounced$: NodeRef<string>;
|
|
1233
|
+
|
|
1234
|
+
export declare const editorSearchTextNodeIndex$: NodeRef<TextNodeIndex>;
|
|
1235
|
+
|
|
1236
|
+
/**
|
|
1237
|
+
* A function that subscribes to Lexical editor updates or events, and retursns an unsubscribe function.
|
|
1238
|
+
* @group Core
|
|
1239
|
+
*/
|
|
1240
|
+
export declare type EditorSubscription = (activeEditor: LexicalEditor) => () => void;
|
|
1241
|
+
|
|
1242
|
+
/**
|
|
1243
|
+
* @group Core
|
|
1244
|
+
*/
|
|
1245
|
+
export declare const editorWrapperElementRef$: NodeRef<default_2.RefObject<HTMLDivElement> | null>;
|
|
1246
|
+
|
|
1247
|
+
/* Excluded from this release type: editorWrappers$ */
|
|
1248
|
+
|
|
1249
|
+
/* Excluded from this release type: EMPTY_VALUE */
|
|
1250
|
+
|
|
1251
|
+
export declare const EmptyTextNodeIndex: TextNodeIndex;
|
|
1252
|
+
|
|
1253
|
+
export declare interface ExportLexicalTreeOptions {
|
|
1254
|
+
root: RootNode;
|
|
1255
|
+
visitors: LexicalVisitor[];
|
|
1256
|
+
jsxComponentDescriptors: JsxComponentDescriptor[];
|
|
1257
|
+
jsxIsAvailable: boolean;
|
|
1258
|
+
addImportStatements?: boolean;
|
|
1259
|
+
}
|
|
1260
|
+
|
|
1261
|
+
export declare function exportLexicalTreeToMdast({ root, visitors, jsxComponentDescriptors, jsxIsAvailable, addImportStatements }: ExportLexicalTreeOptions): Mdast.Root;
|
|
1262
|
+
|
|
1263
|
+
/* Excluded from this release type: exportMarkdownFromLexical */
|
|
1264
|
+
|
|
1265
|
+
export declare interface ExportMarkdownFromLexicalOptions extends ExportLexicalTreeOptions {
|
|
1266
|
+
visitors: LexicalVisitor[];
|
|
1267
|
+
/**
|
|
1268
|
+
* the markdown extensions to use
|
|
1269
|
+
*/
|
|
1270
|
+
toMarkdownExtensions: ToMarkdownExtension[];
|
|
1271
|
+
/**
|
|
1272
|
+
* The options to pass to `toMarkdown`
|
|
1273
|
+
*/
|
|
1274
|
+
toMarkdownOptions: ToMarkdownOptions;
|
|
1275
|
+
}
|
|
1276
|
+
|
|
1277
|
+
/**
|
|
1278
|
+
* Contains the currently registered export visitors.
|
|
1279
|
+
* @group Core
|
|
1280
|
+
*/
|
|
1281
|
+
export declare const exportVisitors$: NodeRef< LexicalVisitor[]>;
|
|
1282
|
+
|
|
1283
|
+
/**
|
|
1284
|
+
* @group JSX
|
|
1285
|
+
*/
|
|
1286
|
+
export declare interface ExpressionValue {
|
|
1287
|
+
type: 'expression';
|
|
1288
|
+
value: string;
|
|
1289
|
+
}
|
|
1290
|
+
|
|
1291
|
+
/**
|
|
1292
|
+
* A default option to be displayed in the {@link ConditionalContents} component if none of the other options match.
|
|
1293
|
+
* @group Toolbar Primitives
|
|
1294
|
+
*/
|
|
1295
|
+
export declare interface FallbackOption {
|
|
1296
|
+
/**
|
|
1297
|
+
* The contents to display
|
|
1298
|
+
*/
|
|
1299
|
+
fallback: () => default_2.ReactNode;
|
|
1300
|
+
}
|
|
1301
|
+
|
|
1302
|
+
/**
|
|
1303
|
+
* @group Image
|
|
1304
|
+
*/
|
|
1305
|
+
export declare interface FileImageParameters extends BaseImageParameters {
|
|
1306
|
+
file: File;
|
|
1307
|
+
}
|
|
1308
|
+
|
|
1309
|
+
export declare type FORMAT = typeof DEFAULT_FORMAT | typeof IS_BOLD | typeof IS_ITALIC | typeof IS_STRIKETHROUGH | typeof IS_UNDERLINE | typeof IS_CODE | typeof IS_SUBSCRIPT | typeof IS_SUPERSCRIPT | typeof IS_HIGHLIGHT;
|
|
1310
|
+
|
|
1311
|
+
export { FromMarkdownOptions }
|
|
1312
|
+
|
|
1313
|
+
/**
|
|
1314
|
+
* Fetches a value from the Lexical editor read cycle.
|
|
1315
|
+
* @group Utils
|
|
1316
|
+
*/
|
|
1317
|
+
export declare function fromWithinEditorRead<T>(editor: LexicalEditor, fn: () => T): T;
|
|
1318
|
+
|
|
1319
|
+
/**
|
|
1320
|
+
* Whether the frontmatter dialog is open.
|
|
1321
|
+
* @group Frontmatter
|
|
1322
|
+
*/
|
|
1323
|
+
export declare const frontmatterDialogOpen$: NodeRef<boolean>;
|
|
1324
|
+
|
|
1325
|
+
/**
|
|
1326
|
+
* Represents {@link https://daily-dev-tips.com/posts/what-exactly-is-frontmatter/ | the frontmatter} of the markdown document.
|
|
1327
|
+
* Use {@link "$createFrontmatterNode"} to construct one.
|
|
1328
|
+
*/
|
|
1329
|
+
export declare class FrontmatterNode extends DecoratorNode<JSX.Element> {
|
|
1330
|
+
__yaml: string;
|
|
1331
|
+
static getType(): string;
|
|
1332
|
+
static clone(node: FrontmatterNode): FrontmatterNode;
|
|
1333
|
+
static importJSON(serializedNode: SerializedFrontmatterNode): FrontmatterNode;
|
|
1334
|
+
constructor(code: string, key?: NodeKey);
|
|
1335
|
+
exportJSON(): SerializedFrontmatterNode;
|
|
1336
|
+
createDOM(_config: EditorConfig): HTMLDivElement;
|
|
1337
|
+
updateDOM(): false;
|
|
1338
|
+
getYaml(): string;
|
|
1339
|
+
setYaml(yaml: string): void;
|
|
1340
|
+
decorate(editor: LexicalEditor): JSX.Element;
|
|
1341
|
+
isKeyboardSelectable(): boolean;
|
|
1342
|
+
}
|
|
1343
|
+
|
|
1344
|
+
/**
|
|
1345
|
+
* A plugin that adds support for frontmatter.
|
|
1346
|
+
* @group Frontmatter
|
|
1347
|
+
*/
|
|
1348
|
+
export declare const frontmatterPlugin: (params?: unknown) => RealmPlugin;
|
|
1349
|
+
|
|
1350
|
+
/**
|
|
1351
|
+
* A generic editor that can be used as an universal UI for any directive.
|
|
1352
|
+
* Allows editing of the directive content and properties.
|
|
1353
|
+
* Use this editor for the {@link DirectiveDescriptor} Editor option.
|
|
1354
|
+
* @group Directive
|
|
1355
|
+
*/
|
|
1356
|
+
export declare const GenericDirectiveEditor: default_2.FC<DirectiveEditorProps>;
|
|
1357
|
+
|
|
1358
|
+
/**
|
|
1359
|
+
* A Lexical node that represents a generic HTML element. Use {@link $createGenericHTMLNode} to construct one.
|
|
1360
|
+
* The generic HTML node is used as a "fallback" for HTML elements that are not explicitly supported by the editor.
|
|
1361
|
+
* @group HTML
|
|
1362
|
+
*/
|
|
1363
|
+
export declare class GenericHTMLNode extends ElementNode {
|
|
1364
|
+
/* Excluded from this release type: __tag */
|
|
1365
|
+
/* Excluded from this release type: __nodeType */
|
|
1366
|
+
/* Excluded from this release type: __attributes */
|
|
1367
|
+
/* Excluded from this release type: getType */
|
|
1368
|
+
/* Excluded from this release type: clone */
|
|
1369
|
+
/**
|
|
1370
|
+
* Constructs a new {@link GenericHTMLNode} with the specified MDAST HTML node as the object to edit.
|
|
1371
|
+
*/
|
|
1372
|
+
constructor(tag: KnownHTMLTagType, type: MdxNodeType, attributes: MdxJsxAttribute[], key?: NodeKey);
|
|
1373
|
+
getTag(): KnownHTMLTagType;
|
|
1374
|
+
getNodeType(): MdxNodeType;
|
|
1375
|
+
getAttributes(): MdxJsxAttribute[];
|
|
1376
|
+
updateAttributes(attributes: MdxJsxAttribute[]): void;
|
|
1377
|
+
getStyle(): string;
|
|
1378
|
+
createDOM(): HTMLElement;
|
|
1379
|
+
updateDOM(): boolean;
|
|
1380
|
+
static importDOM(): DOMConversionMap | null;
|
|
1381
|
+
exportDOM(editor: LexicalEditor): DOMExportOutput;
|
|
1382
|
+
static importJSON(serializedNode: SerializedGenericHTMLNode): GenericHTMLNode;
|
|
1383
|
+
exportJSON(): SerializedGenericHTMLNode;
|
|
1384
|
+
extractWithChild(): boolean;
|
|
1385
|
+
isInline(): boolean;
|
|
1386
|
+
}
|
|
1387
|
+
|
|
1388
|
+
/**
|
|
1389
|
+
* A generic editor that can be used as an universal UI for any JSX element.
|
|
1390
|
+
* Allows editing of the element content and properties.
|
|
1391
|
+
* Use this editor for the {@link JsxComponentDescriptor} Editor option.
|
|
1392
|
+
* @group JSX
|
|
1393
|
+
*/
|
|
1394
|
+
export declare const GenericJsxEditor: default_2.FC<GenericJsxEditorProps>;
|
|
1395
|
+
|
|
1396
|
+
/**
|
|
1397
|
+
* Properties for the Generic Jsx Editor
|
|
1398
|
+
*/
|
|
1399
|
+
export declare interface GenericJsxEditorProps extends JsxEditorProps {
|
|
1400
|
+
/**
|
|
1401
|
+
* A custom property editor component {@link PropertyEditorType}
|
|
1402
|
+
*/
|
|
1403
|
+
PropertyEditor?: PropertyEditorType;
|
|
1404
|
+
}
|
|
1405
|
+
|
|
1406
|
+
/**
|
|
1407
|
+
* Resolves the current language to the select value and items used by CodeMirror language pickers.
|
|
1408
|
+
* Unknown languages are added as a temporary item so the picker remains in sync with the code block value.
|
|
1409
|
+
*/
|
|
1410
|
+
export declare function getCodeBlockLanguageSelectData(normalized: NormalizedCodeBlockLanguages, language: string): {
|
|
1411
|
+
value: string;
|
|
1412
|
+
items: {
|
|
1413
|
+
value: string;
|
|
1414
|
+
label: string;
|
|
1415
|
+
}[];
|
|
1416
|
+
};
|
|
1417
|
+
|
|
1418
|
+
/**
|
|
1419
|
+
* Gets the selected node from the Lexical editor.
|
|
1420
|
+
* @group Utils
|
|
1421
|
+
*/
|
|
1422
|
+
export declare function getSelectedNode(selection: RangeSelection): TextNode | ElementNode | null;
|
|
1423
|
+
|
|
1424
|
+
/**
|
|
1425
|
+
* Gets the markdown representation of the current selection in the Lexical editor.
|
|
1426
|
+
* Returns an empty string if there is no selection or if the selection is collapsed.
|
|
1427
|
+
* Converts selected nodes to markdown by recursively processing them and preserving formatting.
|
|
1428
|
+
* Note: Selects entire nodes, not partial selections within nodes.
|
|
1429
|
+
* @group Utils
|
|
1430
|
+
*/
|
|
1431
|
+
export declare function getSelectionAsMarkdown(editor: LexicalEditor, _exportParams: Omit<ExportMarkdownFromLexicalOptions, 'root'>): string;
|
|
1432
|
+
|
|
1433
|
+
/**
|
|
1434
|
+
* Gets the coordinates of the selection in the Lexical editor.
|
|
1435
|
+
* @group Utils
|
|
1436
|
+
*/
|
|
1437
|
+
export declare function getSelectionRectangle(editor: LexicalEditor): {
|
|
1438
|
+
top: number;
|
|
1439
|
+
left: number;
|
|
1440
|
+
width: number;
|
|
1441
|
+
height: number;
|
|
1442
|
+
} | null;
|
|
1443
|
+
|
|
1444
|
+
/* Excluded from this release type: getStateAsMarkdown */
|
|
1445
|
+
|
|
1446
|
+
/**
|
|
1447
|
+
* Whether the markdown document has a frontmatter node.
|
|
1448
|
+
* @group Frontmatter
|
|
1449
|
+
*/
|
|
1450
|
+
export declare const hasFrontmatter$: NodeRef<boolean>;
|
|
1451
|
+
|
|
1452
|
+
/**
|
|
1453
|
+
* @group Headings
|
|
1454
|
+
*/
|
|
1455
|
+
export declare type HEADING_LEVEL = 1 | 2 | 3 | 4 | 5 | 6;
|
|
1456
|
+
|
|
1457
|
+
/**
|
|
1458
|
+
* A plugin that adds support for markdown headings.
|
|
1459
|
+
* @group Headings
|
|
1460
|
+
*/
|
|
1461
|
+
export declare const headingsPlugin: (params?: {
|
|
1462
|
+
/**
|
|
1463
|
+
* Allows you to limit the headings used in the editor. Affects the block type dropdown and the keyboard shortcuts.
|
|
1464
|
+
* @default [1, 2, 3, 4, 5, 6]
|
|
1465
|
+
*/
|
|
1466
|
+
allowedHeadingLevels?: readonly HEADING_LEVEL[];
|
|
1467
|
+
} | undefined) => RealmPlugin;
|
|
1468
|
+
|
|
1469
|
+
/**
|
|
1470
|
+
* A toolbar component that lets the user toggle highlight formatting.
|
|
1471
|
+
* @group Toolbar Components
|
|
1472
|
+
*/
|
|
1473
|
+
export declare const HighlightToggle: default_2.FC;
|
|
1474
|
+
|
|
1475
|
+
/* Excluded from this release type: historyState$ */
|
|
1476
|
+
|
|
1477
|
+
/**
|
|
1478
|
+
* All the HTML tags supported by the generic html node.
|
|
1479
|
+
* @group HTML
|
|
1480
|
+
*/
|
|
1481
|
+
export declare const htmlTags: string[];
|
|
1482
|
+
|
|
1483
|
+
/**
|
|
1484
|
+
* A callback that returns the icon component for the given name.
|
|
1485
|
+
* @group Core
|
|
1486
|
+
*/
|
|
1487
|
+
export declare const iconComponentFor$: NodeRef<(name: IconKey) => default_2.ReactNode>;
|
|
1488
|
+
|
|
1489
|
+
export declare type IconKey = 'undo' | 'redo' | 'format_bold' | 'format_italic' | 'format_underlined' | 'code' | 'strikeThrough' | 'superscript' | 'subscript' | 'format_list_bulleted' | 'format_list_numbered' | 'format_list_checked' | 'format_highlight' | 'link' | 'add_photo' | 'table' | 'horizontal_rule' | 'frontmatter' | 'frame_source' | 'arrow_drop_down' | 'admonition' | 'rich_text' | 'difference' | 'markdown' | 'open_in_new' | 'link_off' | 'edit' | 'content_copy' | 'more_horiz' | 'more_vert' | 'close' | 'settings' | 'delete_big' | 'delete_small' | 'format_align_center' | 'format_align_left' | 'format_align_right' | 'add_row' | 'add_column' | 'insert_col_left' | 'insert_row_above' | 'insert_row_below' | 'insert_col_right' | 'check';
|
|
1490
|
+
|
|
1491
|
+
/**
|
|
1492
|
+
* Holds the autocomplete suggestions for image sources.
|
|
1493
|
+
* @group Image
|
|
1494
|
+
*/
|
|
1495
|
+
export declare const imageAutocompleteSuggestions$: NodeRef<string[]>;
|
|
1496
|
+
|
|
1497
|
+
/**
|
|
1498
|
+
* Holds the current state of the image dialog.
|
|
1499
|
+
* @group Image
|
|
1500
|
+
*/
|
|
1501
|
+
export declare const imageDialogState$: NodeRef<EditingImageDialogState | InactiveImageDialogState | NewImageDialogState>;
|
|
1502
|
+
|
|
1503
|
+
/**
|
|
1504
|
+
* A lexical node that represents an image. Use {@link "$createImageNode"} to construct one.
|
|
1505
|
+
* @group Image
|
|
1506
|
+
*/
|
|
1507
|
+
export declare class ImageNode extends DecoratorNode<JSX.Element> {
|
|
1508
|
+
/* Excluded from this release type: __src */
|
|
1509
|
+
/* Excluded from this release type: __altText */
|
|
1510
|
+
/* Excluded from this release type: __title */
|
|
1511
|
+
/* Excluded from this release type: __width */
|
|
1512
|
+
/* Excluded from this release type: __height */
|
|
1513
|
+
/* Excluded from this release type: __rest */
|
|
1514
|
+
/* Excluded from this release type: getType */
|
|
1515
|
+
/* Excluded from this release type: clone */
|
|
1516
|
+
/* Excluded from this release type: afterCloneFrom */
|
|
1517
|
+
/* Excluded from this release type: importJSON */
|
|
1518
|
+
/* Excluded from this release type: exportDOM */
|
|
1519
|
+
/* Excluded from this release type: importDOM */
|
|
1520
|
+
/**
|
|
1521
|
+
* Constructs a new {@link ImageNode} with the specified image parameters.
|
|
1522
|
+
* Use {@link $createImageNode} to construct one.
|
|
1523
|
+
*/
|
|
1524
|
+
constructor(src: string, altText: string, title: string | undefined, width?: 'inherit' | number, height?: 'inherit' | number, rest?: (MdxJsxAttribute | MdxJsxExpressionAttribute)[], key?: NodeKey);
|
|
1525
|
+
/* Excluded from this release type: exportJSON */
|
|
1526
|
+
/**
|
|
1527
|
+
* Sets the image dimensions
|
|
1528
|
+
*/
|
|
1529
|
+
setWidthAndHeight(width: 'inherit' | number, height: 'inherit' | number): void;
|
|
1530
|
+
/* Excluded from this release type: createDOM */
|
|
1531
|
+
/* Excluded from this release type: updateDOM */
|
|
1532
|
+
getSrc(): string;
|
|
1533
|
+
getAltText(): string;
|
|
1534
|
+
getTitle(): string | undefined;
|
|
1535
|
+
getHeight(): 'inherit' | number;
|
|
1536
|
+
getWidth(): 'inherit' | number;
|
|
1537
|
+
getRest(): (MdxJsxAttribute | MdxJsxExpressionAttribute)[];
|
|
1538
|
+
setTitle(title: string | undefined): void;
|
|
1539
|
+
setSrc(src: string): void;
|
|
1540
|
+
setAltText(altText: string | undefined): void;
|
|
1541
|
+
/* Excluded from this release type: shouldBeSerializedAsElement */
|
|
1542
|
+
/* Excluded from this release type: decorate */
|
|
1543
|
+
}
|
|
1544
|
+
|
|
1545
|
+
/**
|
|
1546
|
+
* Holds the image placeholder.
|
|
1547
|
+
* @group Image
|
|
1548
|
+
*/
|
|
1549
|
+
export declare const imagePlaceholder$: NodeRef< FC<{}> | null>;
|
|
1550
|
+
|
|
1551
|
+
/**
|
|
1552
|
+
* A plugin that adds support for images.
|
|
1553
|
+
* @group Image
|
|
1554
|
+
*/
|
|
1555
|
+
export declare const imagePlugin: (params?: {
|
|
1556
|
+
imageUploadHandler?: ImageUploadHandler;
|
|
1557
|
+
imageAutocompleteSuggestions?: string[];
|
|
1558
|
+
disableImageResize?: boolean;
|
|
1559
|
+
disableImageSettingsButton?: boolean;
|
|
1560
|
+
allowSetImageDimensions?: boolean;
|
|
1561
|
+
imagePreviewHandler?: ImagePreviewHandler;
|
|
1562
|
+
ImageDialog?: (() => JSX.Element) | React.FC;
|
|
1563
|
+
EditImageToolbar?: (() => JSX.Element) | React.FC;
|
|
1564
|
+
imagePlaceholder?: (() => JSX.Element) | null;
|
|
1565
|
+
} | undefined) => RealmPlugin;
|
|
1566
|
+
|
|
1567
|
+
/**
|
|
1568
|
+
* Holds the image preview handler callback.
|
|
1569
|
+
* @group Image
|
|
1570
|
+
*/
|
|
1571
|
+
export declare const imagePreviewHandler$: NodeRef<ImagePreviewHandler>;
|
|
1572
|
+
|
|
1573
|
+
/**
|
|
1574
|
+
* @group Image
|
|
1575
|
+
*/
|
|
1576
|
+
export declare type ImagePreviewHandler = ((imageSource: string) => Promise<string>) | null;
|
|
1577
|
+
|
|
1578
|
+
/**
|
|
1579
|
+
* Holds the image upload handler callback.
|
|
1580
|
+
* @group Image
|
|
1581
|
+
*/
|
|
1582
|
+
export declare const imageUploadHandler$: NodeRef<ImageUploadHandler>;
|
|
1583
|
+
|
|
1584
|
+
/**
|
|
1585
|
+
* @group Image
|
|
1586
|
+
*/
|
|
1587
|
+
export declare type ImageUploadHandler = ((image: File) => Promise<string>) | null;
|
|
1588
|
+
|
|
1589
|
+
/* Excluded from this release type: importMarkdownToLexical */
|
|
1590
|
+
|
|
1591
|
+
export declare function importMdastTreeToLexical({ root, mdastRoot, visitors, ...descriptors }: MdastTreeImportOptions): void;
|
|
1592
|
+
|
|
1593
|
+
export declare interface ImportPoint {
|
|
1594
|
+
append(node: LexicalNode): void;
|
|
1595
|
+
getType(): string;
|
|
1596
|
+
}
|
|
1597
|
+
|
|
1598
|
+
export declare interface ImportStatement {
|
|
1599
|
+
source: string;
|
|
1600
|
+
defaultExport: boolean;
|
|
1601
|
+
}
|
|
1602
|
+
|
|
1603
|
+
/**
|
|
1604
|
+
* Contains the currently registered import visitors.
|
|
1605
|
+
* @group Core
|
|
1606
|
+
*/
|
|
1607
|
+
export declare const importVisitors$: NodeRef<MdastImportVisitor<Mdast.Nodes>[]>;
|
|
1608
|
+
|
|
1609
|
+
/**
|
|
1610
|
+
* The state of the image dialog when it is inactive.
|
|
1611
|
+
* @group Image
|
|
1612
|
+
*/
|
|
1613
|
+
export declare interface InactiveImageDialogState {
|
|
1614
|
+
type: 'inactive';
|
|
1615
|
+
}
|
|
1616
|
+
|
|
1617
|
+
/**
|
|
1618
|
+
* The state of the link dialog when it is inactive.
|
|
1619
|
+
* @group Link Dialog
|
|
1620
|
+
*/
|
|
1621
|
+
export declare interface InactiveLinkDialog {
|
|
1622
|
+
type: 'inactive';
|
|
1623
|
+
rectangle?: undefined;
|
|
1624
|
+
linkNodeKey?: undefined;
|
|
1625
|
+
}
|
|
1626
|
+
|
|
1627
|
+
/**
|
|
1628
|
+
* Holds whether the editor is in focus or not.
|
|
1629
|
+
* @group Core
|
|
1630
|
+
*/
|
|
1631
|
+
export declare const inFocus$: NodeRef<boolean>;
|
|
1632
|
+
|
|
1633
|
+
/* Excluded from this release type: initialMarkdown$ */
|
|
1634
|
+
|
|
1635
|
+
export declare const initialMarkdownNormalize$: NodeRef<boolean>;
|
|
1636
|
+
|
|
1637
|
+
/* Excluded from this release type: INSERT_IMAGE_COMMAND */
|
|
1638
|
+
|
|
1639
|
+
/**
|
|
1640
|
+
* A toolbar dropdown button that allows the user to insert admonitions.
|
|
1641
|
+
* For this to work, you need to have the `directives` plugin enabled with the {@link AdmonitionDirectiveDescriptor} configured.
|
|
1642
|
+
*
|
|
1643
|
+
* @group Toolbar Components
|
|
1644
|
+
*/
|
|
1645
|
+
export declare const InsertAdmonition: () => default_2.JSX.Element;
|
|
1646
|
+
|
|
1647
|
+
/**
|
|
1648
|
+
* A signal that inserts a new code block into the editor with the published options.
|
|
1649
|
+
* @group Code Block
|
|
1650
|
+
*/
|
|
1651
|
+
export declare const insertCodeBlock$: NodeRef<Partial<CreateCodeBlockNodeOptions>>;
|
|
1652
|
+
|
|
1653
|
+
/**
|
|
1654
|
+
* A toolbar button that allows the user to insert a fenced code block.
|
|
1655
|
+
* Once the code block is focused, you can construct a special code block toolbar for it, using the {@link ConditionalContents} primitive.
|
|
1656
|
+
* See the {@link ConditionalContents} documentation for an example.
|
|
1657
|
+
*
|
|
1658
|
+
* @group Toolbar Components
|
|
1659
|
+
*/
|
|
1660
|
+
export declare const InsertCodeBlock: default_2.FC;
|
|
1661
|
+
|
|
1662
|
+
/**
|
|
1663
|
+
* Inserts a new code mirror code block with the specified parameters.
|
|
1664
|
+
* @group CodeMirror
|
|
1665
|
+
*/
|
|
1666
|
+
export declare const insertCodeMirror$: NodeRef<{
|
|
1667
|
+
language: string;
|
|
1668
|
+
code: string;
|
|
1669
|
+
}>;
|
|
1670
|
+
|
|
1671
|
+
/**
|
|
1672
|
+
* Inserts a decorator node (constructed by the published factory) at the current selection.
|
|
1673
|
+
* @group Core
|
|
1674
|
+
*/
|
|
1675
|
+
export declare const insertDecoratorNode$: NodeRef<() => DecoratorNode<unknown>>;
|
|
1676
|
+
|
|
1677
|
+
/**
|
|
1678
|
+
* A signal that inserts a new directive node with the published payload.
|
|
1679
|
+
* @group Directive
|
|
1680
|
+
*/
|
|
1681
|
+
export declare const insertDirective$: NodeRef<{
|
|
1682
|
+
type: Directives["type"];
|
|
1683
|
+
name: string;
|
|
1684
|
+
attributes?: Directives["attributes"];
|
|
1685
|
+
}>;
|
|
1686
|
+
|
|
1687
|
+
/**
|
|
1688
|
+
* Inserts a frontmatter node at the beginning of the markdown document.
|
|
1689
|
+
* @group Frontmatter
|
|
1690
|
+
*/
|
|
1691
|
+
export declare const insertFrontmatter$: NodeRef<void>;
|
|
1692
|
+
|
|
1693
|
+
/**
|
|
1694
|
+
* A toolbar button that allows the user to insert a {@link https://jekyllrb.com/docs/front-matter/ | front-matter} editor (if one is not already present).
|
|
1695
|
+
* For this to work, you need to have the `frontmatterPlugin` plugin enabled.
|
|
1696
|
+
* @group Toolbar Components
|
|
1697
|
+
*/
|
|
1698
|
+
export declare const InsertFrontmatter: default_2.FC;
|
|
1699
|
+
|
|
1700
|
+
/**
|
|
1701
|
+
* A signal that inserts a new image node with the published payload.
|
|
1702
|
+
* @group Image
|
|
1703
|
+
*/
|
|
1704
|
+
export declare const insertImage$: NodeRef<InsertImageParameters>;
|
|
1705
|
+
|
|
1706
|
+
/**
|
|
1707
|
+
* A toolbar button that allows the user to insert an image from an URL.
|
|
1708
|
+
* For the button to work, you need to have the `imagePlugin` plugin enabled.
|
|
1709
|
+
* @group Toolbar Components
|
|
1710
|
+
*/
|
|
1711
|
+
export declare const InsertImage: default_2.ForwardRefExoticComponent<Omit<Record<string, never>, "ref"> & default_2.RefAttributes<HTMLButtonElement>>;
|
|
1712
|
+
|
|
1713
|
+
/**
|
|
1714
|
+
* @group Image
|
|
1715
|
+
*/
|
|
1716
|
+
export declare type InsertImageParameters = FileImageParameters | SrcImageParameters;
|
|
1717
|
+
|
|
1718
|
+
/* Excluded from this release type: InsertImagePayload */
|
|
1719
|
+
|
|
1720
|
+
/**
|
|
1721
|
+
* A signal that inserts a new JSX node with the published payload.
|
|
1722
|
+
* @group JSX
|
|
1723
|
+
*/
|
|
1724
|
+
export declare const insertJsx$: NodeRef<{
|
|
1725
|
+
kind: "text";
|
|
1726
|
+
name: string;
|
|
1727
|
+
props: JsxProperties;
|
|
1728
|
+
children?: MdxJsxTextElement["children"];
|
|
1729
|
+
} | {
|
|
1730
|
+
kind: "flow";
|
|
1731
|
+
name: string;
|
|
1732
|
+
props: JsxProperties;
|
|
1733
|
+
children?: MdxJsxFlowElement["children"];
|
|
1734
|
+
}>;
|
|
1735
|
+
|
|
1736
|
+
/**
|
|
1737
|
+
* Inserts new markdown value into the current cursor position of the active editor.
|
|
1738
|
+
* @group Core
|
|
1739
|
+
*/
|
|
1740
|
+
export declare const insertMarkdown$: NodeRef<string>;
|
|
1741
|
+
|
|
1742
|
+
/**
|
|
1743
|
+
* A signal that will insert a table with the published amount of rows and columns into the active editor.
|
|
1744
|
+
* @example
|
|
1745
|
+
* ```tsx
|
|
1746
|
+
* const insertTable = usePublisher(insertTable$)
|
|
1747
|
+
* // ...
|
|
1748
|
+
* insertTable({ rows: 3, columns: 4 })
|
|
1749
|
+
* ```
|
|
1750
|
+
*
|
|
1751
|
+
* @group Table
|
|
1752
|
+
*/
|
|
1753
|
+
export declare const insertTable$: NodeRef<{
|
|
1754
|
+
/**
|
|
1755
|
+
* The number of rows of the table.
|
|
1756
|
+
*/
|
|
1757
|
+
rows?: number;
|
|
1758
|
+
/**
|
|
1759
|
+
* The number of columns of the table.
|
|
1760
|
+
*/
|
|
1761
|
+
columns?: number;
|
|
1762
|
+
}>;
|
|
1763
|
+
|
|
1764
|
+
/**
|
|
1765
|
+
* A toolbar button that allows the user to insert a table.
|
|
1766
|
+
* For this button to work, you need to have the `tablePlugin` plugin enabled.
|
|
1767
|
+
* @group Toolbar Components
|
|
1768
|
+
*/
|
|
1769
|
+
export declare const InsertTable: default_2.FC;
|
|
1770
|
+
|
|
1771
|
+
/**
|
|
1772
|
+
* Inserts a thematic break at the current selection.
|
|
1773
|
+
* @group Thematic Break
|
|
1774
|
+
*/
|
|
1775
|
+
export declare const insertThematicBreak$: NodeRef<void>;
|
|
1776
|
+
|
|
1777
|
+
/**
|
|
1778
|
+
* A toolbar button that allows the user to insert a thematic break (rendered as an HR HTML element).
|
|
1779
|
+
* For this button to work, you need to have the `thematicBreakPlugin` plugin enabled.
|
|
1780
|
+
* @group Toolbar Components
|
|
1781
|
+
*/
|
|
1782
|
+
export declare const InsertThematicBreak: default_2.FC;
|
|
1783
|
+
|
|
1784
|
+
/**
|
|
1785
|
+
* Used to detect if the current platform is Apple based, mostly for keyboard shortcuts.
|
|
1786
|
+
* @group Utils
|
|
1787
|
+
*/
|
|
1788
|
+
export declare const IS_APPLE: boolean;
|
|
1789
|
+
|
|
1790
|
+
export declare const IS_BOLD: 1;
|
|
1791
|
+
|
|
1792
|
+
export declare const IS_CODE: 16;
|
|
1793
|
+
|
|
1794
|
+
export declare const IS_HIGHLIGHT: 128;
|
|
1795
|
+
|
|
1796
|
+
export declare const IS_ITALIC: 2;
|
|
1797
|
+
|
|
1798
|
+
export declare const IS_STRIKETHROUGH: 4;
|
|
1799
|
+
|
|
1800
|
+
export declare const IS_SUBSCRIPT: 32;
|
|
1801
|
+
|
|
1802
|
+
export declare const IS_SUPERSCRIPT: 64;
|
|
1803
|
+
|
|
1804
|
+
export declare const IS_UNDERLINE: 8;
|
|
1805
|
+
|
|
1806
|
+
/**
|
|
1807
|
+
* Determines if the given node is a HTML MDAST node.
|
|
1808
|
+
* @group HTML
|
|
1809
|
+
*/
|
|
1810
|
+
export declare function isMdastHTMLNode(node: Mdast.Nodes): node is MdastHTMLNode;
|
|
1811
|
+
|
|
1812
|
+
/**
|
|
1813
|
+
* Determines whether the given node is a JSX node.
|
|
1814
|
+
* @group JSX
|
|
1815
|
+
*/
|
|
1816
|
+
export declare function isMdastJsxNode(node: Mdast.Nodes): node is MdastJsx;
|
|
1817
|
+
|
|
1818
|
+
export declare function isPartOftheEditorUI(element: HTMLElement | null, editorRoot: HTMLElement): boolean;
|
|
1819
|
+
|
|
1820
|
+
/**
|
|
1821
|
+
* returns a function which calls all passed functions in the passed order.
|
|
1822
|
+
* joinProc does not pass arguments or collect return values.
|
|
1823
|
+
* @group Utils
|
|
1824
|
+
*/
|
|
1825
|
+
export declare function joinProc(...procs: (() => unknown)[]): () => void;
|
|
1826
|
+
|
|
1827
|
+
/**
|
|
1828
|
+
* Defines the structure of a JSX component that can be used within the markdown document.
|
|
1829
|
+
* @group JSX
|
|
1830
|
+
*/
|
|
1831
|
+
export declare interface JsxComponentDescriptor {
|
|
1832
|
+
/**
|
|
1833
|
+
* The tag name. For example: 'div', 'span', 'MyComponent'. Use '*' for any tag.
|
|
1834
|
+
* Note: For fragments, use null.
|
|
1835
|
+
*
|
|
1836
|
+
*/
|
|
1837
|
+
name: string | null;
|
|
1838
|
+
/**
|
|
1839
|
+
* Whether the component is a flow or text component (inline or block)
|
|
1840
|
+
*/
|
|
1841
|
+
kind: 'flow' | 'text';
|
|
1842
|
+
/**
|
|
1843
|
+
* The module path from which the component can be imported
|
|
1844
|
+
* Omit to skip injecting an import statement
|
|
1845
|
+
*/
|
|
1846
|
+
source?: string;
|
|
1847
|
+
/**
|
|
1848
|
+
* Whether the component is the default export of the module
|
|
1849
|
+
*/
|
|
1850
|
+
defaultExport?: boolean;
|
|
1851
|
+
/**
|
|
1852
|
+
* The properties that can be applied to the component
|
|
1853
|
+
*/
|
|
1854
|
+
props: JsxPropertyDescriptor[];
|
|
1855
|
+
/**
|
|
1856
|
+
* Whether or not the component has children
|
|
1857
|
+
*/
|
|
1858
|
+
hasChildren?: boolean;
|
|
1859
|
+
/**
|
|
1860
|
+
* The editor to use for editing the component
|
|
1861
|
+
*/
|
|
1862
|
+
Editor: default_2.ComponentType<JsxEditorProps>;
|
|
1863
|
+
}
|
|
1864
|
+
|
|
1865
|
+
/**
|
|
1866
|
+
* Contains the currently registered JSX component descriptors.
|
|
1867
|
+
* @group JSX
|
|
1868
|
+
*/
|
|
1869
|
+
export declare const jsxComponentDescriptors$: NodeRef<JsxComponentDescriptor[]>;
|
|
1870
|
+
|
|
1871
|
+
/**
|
|
1872
|
+
* The properties passed to a custom JSX Editor component.
|
|
1873
|
+
* @group JSX
|
|
1874
|
+
*/
|
|
1875
|
+
export declare interface JsxEditorProps {
|
|
1876
|
+
/** The MDAST node to edit */
|
|
1877
|
+
mdastNode: MdastJsx;
|
|
1878
|
+
/** The descriptor that activated the editor */
|
|
1879
|
+
descriptor: JsxComponentDescriptor;
|
|
1880
|
+
}
|
|
1881
|
+
|
|
1882
|
+
/**
|
|
1883
|
+
* This JSX plugin will fill this value.
|
|
1884
|
+
* @group JSX
|
|
1885
|
+
*/
|
|
1886
|
+
export declare const jsxIsAvailable$: NodeRef<boolean>;
|
|
1887
|
+
|
|
1888
|
+
/**
|
|
1889
|
+
* a plugin that adds support for JSX elements (MDX).
|
|
1890
|
+
* @group JSX
|
|
1891
|
+
*/
|
|
1892
|
+
export declare const jsxPlugin: (params?: JsxPluginParams | undefined) => RealmPlugin;
|
|
1893
|
+
|
|
1894
|
+
/**
|
|
1895
|
+
* @group JSX
|
|
1896
|
+
*/
|
|
1897
|
+
export declare interface JsxPluginParams {
|
|
1898
|
+
/**
|
|
1899
|
+
* A set of descriptors that document the JSX elements used in the document.
|
|
1900
|
+
*/
|
|
1901
|
+
jsxComponentDescriptors: JsxComponentDescriptor[];
|
|
1902
|
+
/**
|
|
1903
|
+
* Whether or not to allow default React fragments <></> processing in MDX.
|
|
1904
|
+
*/
|
|
1905
|
+
allowFragment?: boolean;
|
|
1906
|
+
}
|
|
1907
|
+
|
|
1908
|
+
export declare type JsxProperties = Record<string, string | ExpressionValue>;
|
|
1909
|
+
|
|
1910
|
+
/**
|
|
1911
|
+
* Defines the structure of a JSX component property.
|
|
1912
|
+
* @group JSX
|
|
1913
|
+
*/
|
|
1914
|
+
export declare interface JsxPropertyDescriptor {
|
|
1915
|
+
/**
|
|
1916
|
+
* The name of the property
|
|
1917
|
+
*/
|
|
1918
|
+
name: string;
|
|
1919
|
+
/**
|
|
1920
|
+
* The type of the property
|
|
1921
|
+
*/
|
|
1922
|
+
type: 'string' | 'number' | 'expression';
|
|
1923
|
+
/**
|
|
1924
|
+
* Whether the property is required
|
|
1925
|
+
*/
|
|
1926
|
+
required?: boolean;
|
|
1927
|
+
}
|
|
1928
|
+
|
|
1929
|
+
/**
|
|
1930
|
+
* A toolbar component that includes all toolbar components.
|
|
1931
|
+
* Notice that some of the buttons will work only if you have the corresponding plugin enabled, so you should use it only for testing purposes.
|
|
1932
|
+
* You'll probably want to create your own toolbar component that includes only the buttons that you need.
|
|
1933
|
+
* @group Toolbar Components
|
|
1934
|
+
*/
|
|
1935
|
+
export declare const KitchenSinkToolbar: default_2.FC;
|
|
1936
|
+
|
|
1937
|
+
/**
|
|
1938
|
+
* All recognized HTML tags.
|
|
1939
|
+
* @group HTML
|
|
1940
|
+
*/
|
|
1941
|
+
export declare type KnownHTMLTagType = (typeof htmlTags)[number];
|
|
1942
|
+
|
|
1943
|
+
export { lexical }
|
|
1944
|
+
|
|
1945
|
+
/**
|
|
1946
|
+
* Configures how the lexical tree is converted to a mdast tree and then to markdown.
|
|
1947
|
+
* @group Markdown Processing
|
|
1948
|
+
*/
|
|
1949
|
+
export declare interface LexicalConvertOptions {
|
|
1950
|
+
/**
|
|
1951
|
+
* The visitors to use when processing the lexical tree
|
|
1952
|
+
*/
|
|
1953
|
+
visitors?: LexicalVisitor[];
|
|
1954
|
+
/**
|
|
1955
|
+
* the markdown extensions to use
|
|
1956
|
+
*/
|
|
1957
|
+
toMarkdownExtensions?: ToMarkdownExtension[];
|
|
1958
|
+
/**
|
|
1959
|
+
* The options to pass to `toMarkdown`
|
|
1960
|
+
*/
|
|
1961
|
+
toMarkdownOptions?: ToMarkdownOptions;
|
|
1962
|
+
}
|
|
1963
|
+
|
|
1964
|
+
/**
|
|
1965
|
+
* Implement this interface in order to process mdast node(s) into a lexical tree.
|
|
1966
|
+
* This is part of the process that converts the editor contents to markdown.
|
|
1967
|
+
* @group Markdown Processing
|
|
1968
|
+
*/
|
|
1969
|
+
export declare interface LexicalExportVisitor<LN extends LexicalNode, UN extends Mdast.Nodes> {
|
|
1970
|
+
/**
|
|
1971
|
+
* Return true if the given node is of the type that this visitor can process.
|
|
1972
|
+
* You can safely use the node type guard functions (as in $isParagraphNode, $isLinkNode, etc.) here.
|
|
1973
|
+
*/
|
|
1974
|
+
testLexicalNode?(lexicalNode: LexicalNode): lexicalNode is LN;
|
|
1975
|
+
/**
|
|
1976
|
+
* Process the given node and manipulate the mdast tree accordingly.
|
|
1977
|
+
*/
|
|
1978
|
+
visitLexicalNode?(params: {
|
|
1979
|
+
/**
|
|
1980
|
+
* The lexical node that is being visited.
|
|
1981
|
+
*/
|
|
1982
|
+
lexicalNode: LN;
|
|
1983
|
+
/**
|
|
1984
|
+
* The mdast parent node that the result of the lexical node conversion should be appended to.
|
|
1985
|
+
*/
|
|
1986
|
+
mdastParent: Mdast.Parent;
|
|
1987
|
+
/**
|
|
1988
|
+
* A set of actions that can be used to manipulate the mdast tree.
|
|
1989
|
+
* These are "convenience" utilities that avoid the repetitive boilerplate of creating mdast nodes.
|
|
1990
|
+
*/
|
|
1991
|
+
actions: {
|
|
1992
|
+
/**
|
|
1993
|
+
* Iterate over the immediate children of a lexical node with the given mdast node as a parent.
|
|
1994
|
+
*/
|
|
1995
|
+
visitChildren(node: LN, mdastParent: Mdast.Parent): void;
|
|
1996
|
+
/**
|
|
1997
|
+
* Create a new mdast node with the given type, and props.
|
|
1998
|
+
* Iterate over the immediate children of the current lexical node with the new mdast node as a parent.
|
|
1999
|
+
* @param hasChildren - true by default. Pass false to skip iterating over the lexical node children.
|
|
2000
|
+
*/
|
|
2001
|
+
addAndStepInto(type: string, props?: Record<string, unknown>, hasChildren?: boolean): void;
|
|
2002
|
+
/**
|
|
2003
|
+
* Append a new mdast node to a parent node.
|
|
2004
|
+
* @param parentNode - the mdast parent node to append the new node to.
|
|
2005
|
+
* @param node - the mdast node to append.
|
|
2006
|
+
*/
|
|
2007
|
+
appendToParent<T extends Mdast.Parent>(parentNode: T, node: T['children'][number]): T['children'][number] | Mdast.Root;
|
|
2008
|
+
/**
|
|
2009
|
+
* Used when processing JSX nodes so that later, the correct import statement can be added to the document.
|
|
2010
|
+
* @param componentName - the name of the component that has to be imported.
|
|
2011
|
+
* @see {@link JsxComponentDescriptor}
|
|
2012
|
+
*/
|
|
2013
|
+
registerReferredComponent(componentName: string, importStatement?: ImportStatement): void;
|
|
2014
|
+
/**
|
|
2015
|
+
* visits the specified lexical node
|
|
2016
|
+
*/
|
|
2017
|
+
visit(node: LexicalNode, parent: Mdast.Parent): void;
|
|
2018
|
+
/**
|
|
2019
|
+
* Go to next visitor in the visitors chain for potential processing from a different visitor with a lower priority
|
|
2020
|
+
*/
|
|
2021
|
+
nextVisitor(): void;
|
|
2022
|
+
};
|
|
2023
|
+
}): void;
|
|
2024
|
+
/**
|
|
2025
|
+
* Return true if the current node should be joined with the previous node.
|
|
2026
|
+
* This is necessary due to some inconsistencies between the lexical tree and the mdast tree when it comes to formatting.
|
|
2027
|
+
*/
|
|
2028
|
+
shouldJoin?(prevNode: Mdast.RootContent, currentNode: UN): boolean;
|
|
2029
|
+
/**
|
|
2030
|
+
* Join the current node with the previous node, returning the resulting new node
|
|
2031
|
+
* For this to be called by the tree walk, shouldJoin must return true.
|
|
2032
|
+
*/
|
|
2033
|
+
join?<T extends Mdast.RootContent>(prevNode: T, currentNode: T): T;
|
|
2034
|
+
/**
|
|
2035
|
+
* Default 0, optional, sets the priority of the visitor. The higher the number, the earlier it will be called.
|
|
2036
|
+
*/
|
|
2037
|
+
priority?: number;
|
|
2038
|
+
}
|
|
2039
|
+
|
|
2040
|
+
export declare const lexicalTheme$: NodeRef<EditorThemeClasses>;
|
|
2041
|
+
|
|
2042
|
+
export declare const lexicalTheme: EditorThemeClasses;
|
|
2043
|
+
|
|
2044
|
+
/**
|
|
2045
|
+
* A generic visitor that can be used to process any lexical node.
|
|
2046
|
+
* @group Markdown Processing
|
|
2047
|
+
*/
|
|
2048
|
+
export declare type LexicalVisitor = LexicalExportVisitor<LexicalNode, Mdast.RootContent>;
|
|
2049
|
+
|
|
2050
|
+
/* Excluded from this release type: linkAutocompleteSuggestions$ */
|
|
2051
|
+
|
|
2052
|
+
/**
|
|
2053
|
+
* @group Link Dialog
|
|
2054
|
+
*/
|
|
2055
|
+
export declare const linkDialogPlugin: (params?: {
|
|
2056
|
+
/**
|
|
2057
|
+
* If passed, the link dialog will be rendered using this component instead of the default one.
|
|
2058
|
+
*/
|
|
2059
|
+
LinkDialog?: () => JSX.Element;
|
|
2060
|
+
/**
|
|
2061
|
+
* If passed, the link input field will autocomplete using the published suggestions.
|
|
2062
|
+
*/
|
|
2063
|
+
linkAutocompleteSuggestions?: string[];
|
|
2064
|
+
/**
|
|
2065
|
+
* If set, clicking on the link in the preview popup will call this callback instead of opening the link.
|
|
2066
|
+
*/
|
|
2067
|
+
onClickLinkCallback?: ClickLinkCallback;
|
|
2068
|
+
/**
|
|
2069
|
+
* Invoked when a link is clicked in read-only mode
|
|
2070
|
+
*/
|
|
2071
|
+
onReadOnlyClickLinkCallback?: ReadOnlyClickLinkCallback;
|
|
2072
|
+
/**
|
|
2073
|
+
* If true, show the "Link title" field in link dialogs (this sets mouseover text, NOT anchor text)
|
|
2074
|
+
*/
|
|
2075
|
+
showLinkTitleField?: boolean;
|
|
2076
|
+
} | undefined) => RealmPlugin;
|
|
2077
|
+
|
|
2078
|
+
/**
|
|
2079
|
+
* The current state of the link dialog.
|
|
2080
|
+
* @group Link Dialog
|
|
2081
|
+
*/
|
|
2082
|
+
export declare const linkDialogState$: NodeRef<InactiveLinkDialog | PreviewLinkDialog | EditLinkDialog>;
|
|
2083
|
+
|
|
2084
|
+
/**
|
|
2085
|
+
* A plugin that adds support for links in the editor.
|
|
2086
|
+
* @group Links
|
|
2087
|
+
*/
|
|
2088
|
+
export declare const linkPlugin: (params?: {
|
|
2089
|
+
/**
|
|
2090
|
+
* An optional function to validate the URL of a link.
|
|
2091
|
+
* By default, no validation is performed.
|
|
2092
|
+
*/
|
|
2093
|
+
validateUrl?: default_2.ComponentProps<typeof LinkPlugin>["validateUrl"];
|
|
2094
|
+
/**
|
|
2095
|
+
* Whether to disable the auto-linking of URLs and email addresses.
|
|
2096
|
+
* @default false
|
|
2097
|
+
*/
|
|
2098
|
+
disableAutoLink?: boolean;
|
|
2099
|
+
} | undefined) => RealmPlugin;
|
|
2100
|
+
|
|
2101
|
+
/**
|
|
2102
|
+
* A plugin that adds support for markdown lists.
|
|
2103
|
+
* @group Lists
|
|
2104
|
+
*/
|
|
2105
|
+
export declare const listsPlugin: (params?: unknown) => RealmPlugin;
|
|
2106
|
+
|
|
2107
|
+
/**
|
|
2108
|
+
* A toolbar toggle that allows the user to toggle between bulleted, numbered, and check lists.
|
|
2109
|
+
* Pressing the selected button will convert the current list to the other type. Pressing it again will remove the list.
|
|
2110
|
+
* For this button to work, you need to have the `listsPlugin` plugin enabled.
|
|
2111
|
+
* @group Toolbar Components
|
|
2112
|
+
* @param options - The list types that the user can toggle between. Defaults to `['bullet', 'number', 'check']`.
|
|
2113
|
+
*/
|
|
2114
|
+
export declare const ListsToggle: default_2.FC<{
|
|
2115
|
+
options?: ('bullet' | 'number' | 'check')[];
|
|
2116
|
+
}>;
|
|
2117
|
+
|
|
2118
|
+
/* Excluded from this release type: makeHslTransparent */
|
|
2119
|
+
|
|
2120
|
+
/**
|
|
2121
|
+
* Holds the current markdown value.
|
|
2122
|
+
* @group Core
|
|
2123
|
+
*/
|
|
2124
|
+
export declare const markdown$: NodeRef<string>;
|
|
2125
|
+
|
|
2126
|
+
/* Excluded from this release type: markdownErrorSignal$ */
|
|
2127
|
+
|
|
2128
|
+
/**
|
|
2129
|
+
* An error that gets thrown when the Markdown parsing fails due to a syntax error.
|
|
2130
|
+
* @group Markdown Processing
|
|
2131
|
+
*/
|
|
2132
|
+
export declare class MarkdownParseError extends Error {
|
|
2133
|
+
constructor(message: string, cause: unknown);
|
|
2134
|
+
}
|
|
2135
|
+
|
|
2136
|
+
/* Excluded from this release type: MarkdownParseOptions */
|
|
2137
|
+
|
|
2138
|
+
/**
|
|
2139
|
+
* Emits a processing error when such happens
|
|
2140
|
+
* @group Core
|
|
2141
|
+
*/
|
|
2142
|
+
export declare const markdownProcessingError$: NodeRef<{
|
|
2143
|
+
error: string;
|
|
2144
|
+
source: string;
|
|
2145
|
+
} | null>;
|
|
2146
|
+
|
|
2147
|
+
/**
|
|
2148
|
+
* A plugin that adds markdown shortcuts to the editor.
|
|
2149
|
+
* @group Markdown Shortcuts
|
|
2150
|
+
*/
|
|
2151
|
+
export declare const markdownShortcutPlugin: (params?: unknown) => RealmPlugin;
|
|
2152
|
+
|
|
2153
|
+
/**
|
|
2154
|
+
* The current value of the source/diff editors.
|
|
2155
|
+
* @group Diff/Source
|
|
2156
|
+
*/
|
|
2157
|
+
export declare const markdownSourceEditorValue$: NodeRef<string>;
|
|
2158
|
+
|
|
2159
|
+
/**
|
|
2160
|
+
* A plugin that limits the maximum length of the text content of the editor.
|
|
2161
|
+
* Adapted from the Lexical plugin. https://github.com/facebook/lexical/blob/main/packages/lexical-playground/src/plugins/MaxLengthPlugin/index.tsx
|
|
2162
|
+
* @example
|
|
2163
|
+
* ```tsx
|
|
2164
|
+
* <MDXEditor plugins={[maxLengthPlugin(100)]} markdown={'hello world'} />
|
|
2165
|
+
* ```
|
|
2166
|
+
* @group Utilities
|
|
2167
|
+
*/
|
|
2168
|
+
export declare const maxLengthPlugin: (params?: number | undefined) => RealmPlugin;
|
|
2169
|
+
|
|
2170
|
+
/**
|
|
2171
|
+
* A block-level HTML node.
|
|
2172
|
+
* @group HTML
|
|
2173
|
+
*/
|
|
2174
|
+
export declare interface MdastBlockHTMLNode extends MdxJsxFlowElement {
|
|
2175
|
+
/**
|
|
2176
|
+
* the tag name of the node
|
|
2177
|
+
*/
|
|
2178
|
+
name: (typeof htmlTags)[number];
|
|
2179
|
+
}
|
|
2180
|
+
|
|
2181
|
+
export declare type MdastExtension = Extension | Extension[];
|
|
2182
|
+
|
|
2183
|
+
/* Excluded from this release type: mdastExtensions$ */
|
|
2184
|
+
|
|
2185
|
+
export declare type MdastExtensions = MdastExtension[];
|
|
2186
|
+
|
|
2187
|
+
/**
|
|
2188
|
+
* A HTML MDAST node.
|
|
2189
|
+
* @group HTML
|
|
2190
|
+
*/
|
|
2191
|
+
export declare type MdastHTMLNode = MdastBlockHTMLNode | MdastInlineHTMLNode;
|
|
2192
|
+
|
|
2193
|
+
/**
|
|
2194
|
+
* Implement this interface to convert certain mdast nodes into lexical nodes.
|
|
2195
|
+
* @typeParam UN - The type of the mdast node that is being visited.
|
|
2196
|
+
* @group Markdown Processing
|
|
2197
|
+
*/
|
|
2198
|
+
export declare interface MdastImportVisitor<UN extends Mdast.Nodes> {
|
|
2199
|
+
/**
|
|
2200
|
+
* The test function that determines if this visitor should be used for the given node.
|
|
2201
|
+
* As a convenience, you can also pass a string here, which will be compared to the node's type.
|
|
2202
|
+
* @param descriptors - the registered descriptors and fallback values for composite nodes.
|
|
2203
|
+
*/
|
|
2204
|
+
testNode: ((mdastNode: Mdast.Nodes, descriptors: Descriptors) => boolean) | string;
|
|
2205
|
+
visitNode(params: {
|
|
2206
|
+
/**
|
|
2207
|
+
* The node that is currently being visited.
|
|
2208
|
+
*/
|
|
2209
|
+
mdastNode: UN;
|
|
2210
|
+
/**
|
|
2211
|
+
* The MDAST parent of the node that is currently being visited.
|
|
2212
|
+
*/
|
|
2213
|
+
mdastParent: Mdast.Parent | null;
|
|
2214
|
+
/**
|
|
2215
|
+
* The parent lexical node to which the results of the processing should be added.
|
|
2216
|
+
*/
|
|
2217
|
+
lexicalParent: LexicalNode;
|
|
2218
|
+
/**
|
|
2219
|
+
* The descriptors for composite nodes (jsx, directives, code blocks).
|
|
2220
|
+
*/
|
|
2221
|
+
descriptors: Descriptors;
|
|
2222
|
+
/**
|
|
2223
|
+
* metaData: context data provided from the import visitor.
|
|
2224
|
+
*/
|
|
2225
|
+
metaData: MetaData;
|
|
2226
|
+
/**
|
|
2227
|
+
* A set of convenience utilities that can be used to add nodes to the lexical tree.
|
|
2228
|
+
*/
|
|
2229
|
+
actions: {
|
|
2230
|
+
/**
|
|
2231
|
+
* Iterate the children of the node with the lexical node as the parent.
|
|
2232
|
+
*/
|
|
2233
|
+
visitChildren(node: Mdast.Parent, lexicalParent: LexicalNode): void;
|
|
2234
|
+
/**
|
|
2235
|
+
* Add the given node to the lexical tree, and iterate the current mdast node's children with the newly created lexical node as a parent.
|
|
2236
|
+
*/
|
|
2237
|
+
addAndStepInto(lexicalNode: LexicalNode): void;
|
|
2238
|
+
/**
|
|
2239
|
+
* Adds formatting as a context for the current node and its children.
|
|
2240
|
+
* This is necessary due to mdast treating formatting as a node, while lexical considering it an attribute of a node.
|
|
2241
|
+
*/
|
|
2242
|
+
addFormatting(format: FORMAT, node?: Mdast.Parent | null): void;
|
|
2243
|
+
/**
|
|
2244
|
+
* Removes formatting as a context for the current node and its children.
|
|
2245
|
+
* This is necessary due to mdast treating formatting as a node, while lexical considering it an attribute of a node.
|
|
2246
|
+
*/
|
|
2247
|
+
removeFormatting(format: FORMAT, node?: Mdast.Parent | null): void;
|
|
2248
|
+
/**
|
|
2249
|
+
* Access the current formatting context.
|
|
2250
|
+
*/
|
|
2251
|
+
getParentFormatting(): number;
|
|
2252
|
+
/**
|
|
2253
|
+
* Adds styling as a context for the current node and its children.
|
|
2254
|
+
* This is necessary due to mdast treating styling as a node, while lexical considering it an attribute of a node.
|
|
2255
|
+
*/
|
|
2256
|
+
addStyle(style: string, node?: Mdast.Parent | null): void;
|
|
2257
|
+
/**
|
|
2258
|
+
* Access the current style context.
|
|
2259
|
+
*/
|
|
2260
|
+
getParentStyle(): string;
|
|
2261
|
+
/**
|
|
2262
|
+
* Go to next visitor in the visitors chain for potential processing from a different visitor with a lower priority
|
|
2263
|
+
*/
|
|
2264
|
+
nextVisitor(): void;
|
|
2265
|
+
};
|
|
2266
|
+
}): void;
|
|
2267
|
+
/**
|
|
2268
|
+
* Default 0, optional, sets the priority of the visitor. The higher the number, the earlier it will be called.
|
|
2269
|
+
*/
|
|
2270
|
+
priority?: number;
|
|
2271
|
+
}
|
|
2272
|
+
|
|
2273
|
+
/**
|
|
2274
|
+
* An inline HTML node.
|
|
2275
|
+
* @group HTML
|
|
2276
|
+
*/
|
|
2277
|
+
export declare interface MdastInlineHTMLNode extends MdxJsxTextElement {
|
|
2278
|
+
/**
|
|
2279
|
+
* the tag name of the node
|
|
2280
|
+
*/
|
|
2281
|
+
name: (typeof htmlTags)[number];
|
|
2282
|
+
}
|
|
2283
|
+
|
|
2284
|
+
/**
|
|
2285
|
+
* An MDX JSX MDAST node.
|
|
2286
|
+
* @group JSX
|
|
2287
|
+
*/
|
|
2288
|
+
export declare type MdastJsx = MdxJsxTextElement | MdxJsxFlowElement;
|
|
2289
|
+
|
|
2290
|
+
/**
|
|
2291
|
+
* The options of the tree import utility. Not meant to be used directly.
|
|
2292
|
+
*/
|
|
2293
|
+
export declare interface MdastTreeImportOptions extends Descriptors {
|
|
2294
|
+
root: ImportPoint;
|
|
2295
|
+
visitors: MdastImportVisitor<Mdast.RootContent>[];
|
|
2296
|
+
mdastRoot: Mdast.Root;
|
|
2297
|
+
}
|
|
2298
|
+
|
|
2299
|
+
export declare const MDX_FOCUS_SEARCH_NAME = "MdxFocusSearch";
|
|
2300
|
+
|
|
2301
|
+
export declare const MDX_SEARCH_NAME = "MdxSearch";
|
|
2302
|
+
|
|
2303
|
+
/**
|
|
2304
|
+
* The MDXEditor React component.
|
|
2305
|
+
* @group MDXEditor
|
|
2306
|
+
*/
|
|
2307
|
+
export declare const MDXEditor: default_2.ForwardRefExoticComponent<MDXEditorProps & default_2.RefAttributes<MDXEditorMethods>>;
|
|
2308
|
+
|
|
2309
|
+
/**
|
|
2310
|
+
* The interface for the {@link MDXEditor} object reference.
|
|
2311
|
+
*
|
|
2312
|
+
* @example
|
|
2313
|
+
* ```tsx
|
|
2314
|
+
* const mdxEditorRef = React.useRef<MDXEditorMethods>(null)
|
|
2315
|
+
* <MDXEditor ref={mdxEditorRef} />
|
|
2316
|
+
* ```
|
|
2317
|
+
* @group MDXEditor
|
|
2318
|
+
*/
|
|
2319
|
+
export declare interface MDXEditorMethods {
|
|
2320
|
+
/**
|
|
2321
|
+
* Gets the current markdown value.
|
|
2322
|
+
*/
|
|
2323
|
+
getMarkdown: () => string;
|
|
2324
|
+
/**
|
|
2325
|
+
* Updates the markdown value of the editor.
|
|
2326
|
+
*/
|
|
2327
|
+
setMarkdown: (value: string) => void;
|
|
2328
|
+
/**
|
|
2329
|
+
* Inserts markdown at the current cursor position. Use the focus if necessary.
|
|
2330
|
+
*/
|
|
2331
|
+
insertMarkdown: (value: string) => void;
|
|
2332
|
+
/**
|
|
2333
|
+
* Sets focus on input
|
|
2334
|
+
*/
|
|
2335
|
+
focus: (callbackFn?: () => void, opts?: {
|
|
2336
|
+
defaultSelection?: 'rootStart' | 'rootEnd';
|
|
2337
|
+
preventScroll?: boolean;
|
|
2338
|
+
}) => void;
|
|
2339
|
+
/**
|
|
2340
|
+
* gets the underlying Lexical contentEditable HTML content
|
|
2341
|
+
*/
|
|
2342
|
+
getContentEditableHTML: () => string;
|
|
2343
|
+
/**
|
|
2344
|
+
* Gets the markdown representation of the current selection.
|
|
2345
|
+
* Returns an empty string if there is no selection, if selection is collapsed, or if editor is in source/diff mode.
|
|
2346
|
+
*/
|
|
2347
|
+
getSelectionMarkdown: () => string;
|
|
2348
|
+
}
|
|
2349
|
+
|
|
2350
|
+
/**
|
|
2351
|
+
* The props for the {@link MDXEditor} React component.
|
|
2352
|
+
* @group MDXEditor
|
|
2353
|
+
*/
|
|
2354
|
+
export declare interface MDXEditorProps {
|
|
2355
|
+
/**
|
|
2356
|
+
* the CSS class to apply to the content editable element of the editor.
|
|
2357
|
+
* Use this to style the various content elements like lists and blockquotes.
|
|
2358
|
+
*/
|
|
2359
|
+
contentEditableClassName?: string;
|
|
2360
|
+
/**
|
|
2361
|
+
* Controls the spellCheck value for the content editable element of the editor.
|
|
2362
|
+
* Defaults to true, use false to disable spell checking.
|
|
2363
|
+
*/
|
|
2364
|
+
spellCheck?: boolean;
|
|
2365
|
+
/**
|
|
2366
|
+
* The markdown to edit. Notice that this is read only when the component is mounted.
|
|
2367
|
+
* To change the component content dynamically, use the `MDXEditorMethods.setMarkdown` method.
|
|
2368
|
+
*/
|
|
2369
|
+
markdown: string;
|
|
2370
|
+
/**
|
|
2371
|
+
* Triggered when the editor value changes. The callback is not throttled, you can use any throttling mechanism
|
|
2372
|
+
* if you intend to do auto-saving.
|
|
2373
|
+
* @param initialMarkdownNormalize - set to true if the change is triggered when the initial markdown is set. This can happen due to variety of reasons - for example, additional whitespace, bullet symbols different than the configured ones, etc.
|
|
2374
|
+
*/
|
|
2375
|
+
onChange?: (markdown: string, initialMarkdownNormalize: boolean) => void;
|
|
2376
|
+
/**
|
|
2377
|
+
* Triggered when the markdown parser encounters an error. The payload includes the invalid source and the error message.
|
|
2378
|
+
*/
|
|
2379
|
+
onError?: (payload: {
|
|
2380
|
+
error: string;
|
|
2381
|
+
source: string;
|
|
2382
|
+
}) => void;
|
|
2383
|
+
/**
|
|
2384
|
+
* The markdown options used to generate the resulting markdown.
|
|
2385
|
+
* See {@link https://github.com/syntax-tree/mdast-util-to-markdown#options | the mdast-util-to-markdown docs} for the full list of options.
|
|
2386
|
+
*/
|
|
2387
|
+
toMarkdownOptions?: ToMarkdownOptions;
|
|
2388
|
+
/**
|
|
2389
|
+
* The plugins to use in the editor.
|
|
2390
|
+
*/
|
|
2391
|
+
plugins?: RealmPlugin[];
|
|
2392
|
+
/**
|
|
2393
|
+
* The class name to apply to the root component element, including the toolbar and the popups. For styling the content editable area, Use `contentEditableClassName` property.
|
|
2394
|
+
*/
|
|
2395
|
+
className?: string;
|
|
2396
|
+
/**
|
|
2397
|
+
* pass if you would like to have the editor automatically focused when mounted.
|
|
2398
|
+
*/
|
|
2399
|
+
autoFocus?: boolean | {
|
|
2400
|
+
defaultSelection?: 'rootStart' | 'rootEnd';
|
|
2401
|
+
preventScroll?: boolean;
|
|
2402
|
+
};
|
|
2403
|
+
/**
|
|
2404
|
+
* Triggered when focus leaves the editor
|
|
2405
|
+
*/
|
|
2406
|
+
onBlur?: (e: FocusEvent) => void;
|
|
2407
|
+
/**
|
|
2408
|
+
* The placeholder contents, displayed when the editor is empty.
|
|
2409
|
+
*/
|
|
2410
|
+
placeholder?: default_2.ReactNode;
|
|
2411
|
+
/**
|
|
2412
|
+
* pass if you would like to have the editor in read-only mode.
|
|
2413
|
+
* Note: Don't use this mode to render content for consumption - render the markdown using a library of your choice instead.
|
|
2414
|
+
*/
|
|
2415
|
+
readOnly?: boolean;
|
|
2416
|
+
/**
|
|
2417
|
+
* Use this prop to customize the icons used across the editor. Pass a function that returns an icon (JSX) for a given icon key.
|
|
2418
|
+
*/
|
|
2419
|
+
iconComponentFor?: (name: IconKey) => JSX.Element;
|
|
2420
|
+
/**
|
|
2421
|
+
* Set to true if you want to suppress the processing of HTML tags.
|
|
2422
|
+
*/
|
|
2423
|
+
suppressHtmlProcessing?: boolean;
|
|
2424
|
+
/**
|
|
2425
|
+
* Pass your own translation function if you want to localize the editor.
|
|
2426
|
+
*/
|
|
2427
|
+
translation?: Translation;
|
|
2428
|
+
/**
|
|
2429
|
+
* Whether to apply trim() to the initial markdown input (default: true)
|
|
2430
|
+
*/
|
|
2431
|
+
trim?: boolean;
|
|
2432
|
+
/**
|
|
2433
|
+
* A custom lexical theme to use for the editor.
|
|
2434
|
+
*/
|
|
2435
|
+
lexicalTheme?: EditorThemeClasses;
|
|
2436
|
+
/**
|
|
2437
|
+
* Optional container element to use for rendering editor popups.
|
|
2438
|
+
* Defaults to document.body.
|
|
2439
|
+
*/
|
|
2440
|
+
overlayContainer?: HTMLElement | null;
|
|
2441
|
+
/**
|
|
2442
|
+
* Certain collaboration plugins require that the history is disabled for the editor.
|
|
2443
|
+
*/
|
|
2444
|
+
suppressSharedHistory?: boolean;
|
|
2445
|
+
/**
|
|
2446
|
+
* The initial state of the lexical editor. Pass null to disable any initiation.
|
|
2447
|
+
*/
|
|
2448
|
+
editorState?: EditorState | undefined | null;
|
|
2449
|
+
/**
|
|
2450
|
+
* Additional lexical nodes to include in the editor.
|
|
2451
|
+
*/
|
|
2452
|
+
additionalLexicalNodes?: AdditionalLexicalNode[];
|
|
2453
|
+
/**
|
|
2454
|
+
* The lexical editor namespace.
|
|
2455
|
+
*/
|
|
2456
|
+
lexicalEditorNamespace?: string;
|
|
2457
|
+
}
|
|
2458
|
+
|
|
2459
|
+
/**
|
|
2460
|
+
* The MDAST jsx distinction value used to differentiate inline and block level elements.
|
|
2461
|
+
* @group HTML
|
|
2462
|
+
*/
|
|
2463
|
+
export declare type MdxNodeType = MdastHTMLNode['type'];
|
|
2464
|
+
|
|
2465
|
+
/**
|
|
2466
|
+
* Metadata that is provided to the visitors
|
|
2467
|
+
*/
|
|
2468
|
+
declare interface MetaData {
|
|
2469
|
+
importDeclarations: Record<string, ImportStatement>;
|
|
2470
|
+
}
|
|
2471
|
+
|
|
2472
|
+
/**
|
|
2473
|
+
* A toolbar primitive that allows you to build an UI with multiple non-exclusive toggle groups, like the bold/italic/underline toggle.
|
|
2474
|
+
* @group Toolbar Primitives
|
|
2475
|
+
*/
|
|
2476
|
+
export declare const MultipleChoiceToggleGroup: default_2.FC<{
|
|
2477
|
+
items: {
|
|
2478
|
+
title: string;
|
|
2479
|
+
contents: default_2.ReactNode;
|
|
2480
|
+
active: boolean;
|
|
2481
|
+
onChange: (active: boolean) => void;
|
|
2482
|
+
disabled?: boolean;
|
|
2483
|
+
}[];
|
|
2484
|
+
}>;
|
|
2485
|
+
|
|
2486
|
+
export declare const muteChange$: NodeRef<boolean>;
|
|
2487
|
+
|
|
2488
|
+
export declare const NESTED_EDITOR_UPDATED_COMMAND: LexicalCommand<undefined>;
|
|
2489
|
+
|
|
2490
|
+
/**
|
|
2491
|
+
* React Components registered to be rendered inside `LexicalNestedComposer`. Useful if you're using lexical editor plugins that are wrapped as react components.
|
|
2492
|
+
* @group Core
|
|
2493
|
+
*/
|
|
2494
|
+
export declare const nestedEditorChildren$: NodeRef<default_2.ComponentType<{}>[]>;
|
|
2495
|
+
|
|
2496
|
+
/**
|
|
2497
|
+
* Use this context to provide the necessary values to the {@link NestedLexicalEditor} React component.
|
|
2498
|
+
* Place it as a wrapper in your custom lexical node decorators.
|
|
2499
|
+
* @group Custom Editor Primitives
|
|
2500
|
+
*/
|
|
2501
|
+
export declare const NestedEditorsContext: default_2.Context<NestedEditorsContextValue<Node_2> | undefined>;
|
|
2502
|
+
|
|
2503
|
+
/**
|
|
2504
|
+
* The value of the {@link NestedEditorsContext} React context.
|
|
2505
|
+
* @group Custom Editor Primitives
|
|
2506
|
+
*/
|
|
2507
|
+
export declare interface NestedEditorsContextValue<T extends Node_2> {
|
|
2508
|
+
/**
|
|
2509
|
+
* The parent lexical editor
|
|
2510
|
+
*/
|
|
2511
|
+
parentEditor: LexicalEditor;
|
|
2512
|
+
/**
|
|
2513
|
+
* The parent editor config
|
|
2514
|
+
*/
|
|
2515
|
+
config: EditorConfig;
|
|
2516
|
+
/**
|
|
2517
|
+
* The mdast node that is being edited
|
|
2518
|
+
*/
|
|
2519
|
+
mdastNode: T;
|
|
2520
|
+
/**
|
|
2521
|
+
* The lexical node that is being edited
|
|
2522
|
+
*/
|
|
2523
|
+
lexicalNode: DecoratorNode<any> & {
|
|
2524
|
+
/**
|
|
2525
|
+
* Use this method to update the mdast node. This will also update the mdast tree of the parent editor.
|
|
2526
|
+
*/
|
|
2527
|
+
setMdastNode: (mdastNode: any) => void;
|
|
2528
|
+
};
|
|
2529
|
+
/**
|
|
2530
|
+
* Subscribe to the emitter and implement the logic to focus the custom editor.
|
|
2531
|
+
*/
|
|
2532
|
+
focusEmitter: VoidEmitter;
|
|
2533
|
+
}
|
|
2534
|
+
|
|
2535
|
+
/**
|
|
2536
|
+
* A nested editor React component that allows editing of the contents of complex markdown nodes that have nested markdown content (for example, custom directives or JSX elements).
|
|
2537
|
+
*
|
|
2538
|
+
* @example
|
|
2539
|
+
* You can use a type param to specify the type of the mdast node
|
|
2540
|
+
*
|
|
2541
|
+
* ```tsx
|
|
2542
|
+
*
|
|
2543
|
+
* interface CalloutDirectiveNode extends LeafDirective {
|
|
2544
|
+
* name: 'callout'
|
|
2545
|
+
* children: Mdast.PhrasingContent[]
|
|
2546
|
+
* }
|
|
2547
|
+
*
|
|
2548
|
+
* return <NestedLexicalEditor<CalloutDirectiveNode> getContent={node => node.children} getUpdatedMdastNode={(node, children) => ({ ...node, children })} />
|
|
2549
|
+
* ```
|
|
2550
|
+
* @group Custom Editor Primitives
|
|
2551
|
+
*/
|
|
2552
|
+
export declare const NestedLexicalEditor: <T extends Mdast.RootContent>(props: {
|
|
2553
|
+
/**
|
|
2554
|
+
* A function that returns the phrasing content of the mdast node. In most cases, this will be the `children` property of the mdast node, but you can also have multiple nested nodes with their own children.
|
|
2555
|
+
*/
|
|
2556
|
+
getContent: (mdastNode: T) => Mdast.RootContent[];
|
|
2557
|
+
/**
|
|
2558
|
+
* A function that should return the updated mdast node based on the original mdast node and the new content (serialized as mdast tree) produced by the editor.
|
|
2559
|
+
*/
|
|
2560
|
+
getUpdatedMdastNode: (mdastNode: T, children: Mdast.RootContent[]) => T;
|
|
2561
|
+
/**
|
|
2562
|
+
* Props passed to the {@link https://github.com/facebook/lexical/blob/main/packages/lexical-react/src/LexicalContentEditable.tsx | ContentEditable} component.
|
|
2563
|
+
*/
|
|
2564
|
+
contentEditableProps?: default_2.ComponentProps<typeof ContentEditable>;
|
|
2565
|
+
/**
|
|
2566
|
+
* Whether or not the editor edits blocks (multiple paragraphs)
|
|
2567
|
+
*/
|
|
2568
|
+
block?: boolean;
|
|
2569
|
+
}) => default_2.JSX.Element;
|
|
2570
|
+
|
|
2571
|
+
/**
|
|
2572
|
+
* The state of the image dialog when it is in new mode.
|
|
2573
|
+
* @group Image
|
|
2574
|
+
*/
|
|
2575
|
+
export declare interface NewImageDialogState {
|
|
2576
|
+
type: 'new';
|
|
2577
|
+
}
|
|
2578
|
+
|
|
2579
|
+
/**
|
|
2580
|
+
* an empty function
|
|
2581
|
+
* @group Utils
|
|
2582
|
+
*/
|
|
2583
|
+
export declare function noop(): void;
|
|
2584
|
+
|
|
2585
|
+
/**
|
|
2586
|
+
* Normalizes the `codeBlockLanguages` parameter into a canonical form.
|
|
2587
|
+
* Accepts either a `Record<string, string>` (legacy) or a `CodeBlockLanguage[]` array.
|
|
2588
|
+
*/
|
|
2589
|
+
export declare function normalizeCodeBlockLanguages(input: Record<string, string> | CodeBlockLanguage[]): NormalizedCodeBlockLanguages;
|
|
2590
|
+
|
|
2591
|
+
/**
|
|
2592
|
+
* Internal normalized representation of code block languages.
|
|
2593
|
+
* @group CodeMirror
|
|
2594
|
+
*/
|
|
2595
|
+
export declare interface NormalizedCodeBlockLanguages {
|
|
2596
|
+
/** Items for the language select dropdown. */
|
|
2597
|
+
items: {
|
|
2598
|
+
value: string;
|
|
2599
|
+
label: string;
|
|
2600
|
+
}[];
|
|
2601
|
+
/** Maps any known key (canonical, alias, extension) to the canonical key. */
|
|
2602
|
+
keyMap: Record<string, string>;
|
|
2603
|
+
/** Maps canonical keys to pre-loaded language support, when provided. */
|
|
2604
|
+
supportMap: Partial<Record<string, CodeBlockLanguageSupport>>;
|
|
2605
|
+
}
|
|
2606
|
+
|
|
2607
|
+
/**
|
|
2608
|
+
* Emits when the editor loses focus
|
|
2609
|
+
* @group Core
|
|
2610
|
+
*/
|
|
2611
|
+
export declare const onBlur$: NodeRef<FocusEvent>;
|
|
2612
|
+
|
|
2613
|
+
/* Excluded from this release type: onClickLinkCallback$ */
|
|
2614
|
+
|
|
2615
|
+
/* Excluded from this release type: onReadOnlyClickLinkCallback$ */
|
|
2616
|
+
|
|
2617
|
+
/**
|
|
2618
|
+
* Emits when the window is resized.
|
|
2619
|
+
* @group Utils
|
|
2620
|
+
*/
|
|
2621
|
+
export declare const onWindowChange$: NodeRef<true>;
|
|
2622
|
+
|
|
2623
|
+
/**
|
|
2624
|
+
* Opens the edit image dialog with the published parameters.
|
|
2625
|
+
* @group Image
|
|
2626
|
+
*/
|
|
2627
|
+
export declare const openEditImageDialog$: NodeRef<Omit<EditingImageDialogState, "type">>;
|
|
2628
|
+
|
|
2629
|
+
/**
|
|
2630
|
+
* An action that opens the link dialog.
|
|
2631
|
+
* @group Link Dialog
|
|
2632
|
+
*/
|
|
2633
|
+
export declare const openLinkEditDialog$: NodeRef<void>;
|
|
2634
|
+
|
|
2635
|
+
/**
|
|
2636
|
+
* Opens the new image dialog.
|
|
2637
|
+
* @group Image
|
|
2638
|
+
*/
|
|
2639
|
+
export declare const openNewImageDialog$: NodeRef<void>;
|
|
2640
|
+
|
|
2641
|
+
export declare const parseImageDimension: (value: string | number | undefined) => number | undefined;
|
|
2642
|
+
|
|
2643
|
+
/* Excluded from this release type: placeholder$ */
|
|
2644
|
+
|
|
2645
|
+
/**
|
|
2646
|
+
* The state of the link dialog when it is in preview mode.
|
|
2647
|
+
* @group Link Dialog
|
|
2648
|
+
*/
|
|
2649
|
+
export declare interface PreviewLinkDialog {
|
|
2650
|
+
type: 'preview';
|
|
2651
|
+
title: string;
|
|
2652
|
+
url: string;
|
|
2653
|
+
linkNodeKey: string;
|
|
2654
|
+
rectangle: RectData;
|
|
2655
|
+
}
|
|
2656
|
+
|
|
2657
|
+
/**
|
|
2658
|
+
* Returns a function which extracts the property from from the passed object.
|
|
2659
|
+
* @group Utils
|
|
2660
|
+
*/
|
|
2661
|
+
export declare function prop<T extends Record<string, unknown>>(property: keyof T): (object: T) => T[keyof T];
|
|
2662
|
+
|
|
2663
|
+
/**
|
|
2664
|
+
* A component capable of editing JSX properties
|
|
2665
|
+
*/
|
|
2666
|
+
declare type PropertyEditorType = typeof PropertyPopover;
|
|
2667
|
+
|
|
2668
|
+
/**
|
|
2669
|
+
* A React component that can be used in custom editors to edit the properties of the node.
|
|
2670
|
+
* Displays a simple, static key/value editing UI in a popover.
|
|
2671
|
+
* @group Custom Editor Primitives
|
|
2672
|
+
*/
|
|
2673
|
+
export declare const PropertyPopover: default_2.FC<{
|
|
2674
|
+
/**
|
|
2675
|
+
* The properties to edit. The key is the name of the property, and the value is the initial value.
|
|
2676
|
+
*/
|
|
2677
|
+
properties: Record<string, string>;
|
|
2678
|
+
/**
|
|
2679
|
+
* Triggered when the user edits the property values.
|
|
2680
|
+
*/
|
|
2681
|
+
onChange: (values: Record<string, string>) => void;
|
|
2682
|
+
/**
|
|
2683
|
+
* The title to display in the popover.
|
|
2684
|
+
*/
|
|
2685
|
+
title: string;
|
|
2686
|
+
}>;
|
|
2687
|
+
|
|
2688
|
+
/**
|
|
2689
|
+
* A plugin that adds support for block quotes to the editor.
|
|
2690
|
+
* @group Quote
|
|
2691
|
+
*/
|
|
2692
|
+
export declare const quotePlugin: (params?: unknown) => RealmPlugin;
|
|
2693
|
+
|
|
2694
|
+
export declare function rangeSearchScan(searchQuery: string, { allText, offsetIndex, nodeIndex }: TextNodeIndex): Generator<Range, void, unknown>;
|
|
2695
|
+
|
|
2696
|
+
/**
|
|
2697
|
+
* Holds the readOnly state of the editor.
|
|
2698
|
+
* @group Core
|
|
2699
|
+
*/
|
|
2700
|
+
export declare const readOnly$: NodeRef<boolean>;
|
|
2701
|
+
|
|
2702
|
+
export declare type ReadOnlyClickLinkCallback = (event: MouseEvent, node: LinkNode, url: string) => void;
|
|
2703
|
+
|
|
2704
|
+
/* Excluded from this release type: readOnlyDiff$ */
|
|
2705
|
+
|
|
2706
|
+
/**
|
|
2707
|
+
* A plugin for the editor.
|
|
2708
|
+
* @group Core
|
|
2709
|
+
*/
|
|
2710
|
+
export declare interface RealmPlugin {
|
|
2711
|
+
init?: (realm: Realm) => void;
|
|
2712
|
+
update?: (realm: Realm) => void;
|
|
2713
|
+
postInit?: (realm: Realm) => void;
|
|
2714
|
+
}
|
|
2715
|
+
|
|
2716
|
+
/**
|
|
2717
|
+
* A function that creates an editor plugin.
|
|
2718
|
+
* @typeParam Params - The parameters for the plugin.
|
|
2719
|
+
* @group Core
|
|
2720
|
+
*/
|
|
2721
|
+
export declare function realmPlugin<Params>(plugin: {
|
|
2722
|
+
/**
|
|
2723
|
+
* Called when the MDXEditor component is mounted and the plugin is initialized.
|
|
2724
|
+
*/
|
|
2725
|
+
init?: (realm: Realm, params?: Params) => void;
|
|
2726
|
+
/**
|
|
2727
|
+
* Called after the MDXEditor component is mounted and all plugins are initialized.
|
|
2728
|
+
*/
|
|
2729
|
+
postInit?: (realm: Realm, params?: Params) => void;
|
|
2730
|
+
/**
|
|
2731
|
+
* Called on each re-render. Use this to update the realm with updated property values.
|
|
2732
|
+
*/
|
|
2733
|
+
update?: (realm: Realm, params?: Params) => void;
|
|
2734
|
+
}): (params?: Params) => RealmPlugin;
|
|
2735
|
+
|
|
2736
|
+
/* Excluded from this release type: RealmWithPlugins */
|
|
2737
|
+
|
|
2738
|
+
/**
|
|
2739
|
+
* Describes the boundaries of the current selection so that the link dialog can position itself accordingly.
|
|
2740
|
+
* @group Link Dialog
|
|
2741
|
+
*/
|
|
2742
|
+
export declare type RectData = Pick<DOMRect, 'height' | 'width' | 'top' | 'left'>;
|
|
2743
|
+
|
|
2744
|
+
/**
|
|
2745
|
+
* A context provider that allows you to register and access realms of remote MDX editors.
|
|
2746
|
+
* @group Utils
|
|
2747
|
+
*/
|
|
2748
|
+
export declare const RemoteMDXEditorRealmProvider: FC<PropsWithChildren>;
|
|
2749
|
+
|
|
2750
|
+
/**
|
|
2751
|
+
* A plugin that allows you to access the editor's realm outside of the editor's component tree.
|
|
2752
|
+
* Requires wrapping your application in the `RemoteMDXEditorRealmProvider` component.
|
|
2753
|
+
* @see {@link useRemoteMDXEditorRealm}.
|
|
2754
|
+
* @group Utils
|
|
2755
|
+
*/
|
|
2756
|
+
export declare const remoteRealmPlugin: (params?: {
|
|
2757
|
+
/**
|
|
2758
|
+
* The id to access the realm with. See {@link useRemoteMDXEditorRealm}.
|
|
2759
|
+
*/
|
|
2760
|
+
editorId: string;
|
|
2761
|
+
} | undefined) => RealmPlugin;
|
|
2762
|
+
|
|
2763
|
+
/**
|
|
2764
|
+
* Removes the frontmatter node from the markdown document.
|
|
2765
|
+
* @group Frontmatter
|
|
2766
|
+
*/
|
|
2767
|
+
export declare const removeFrontmatter$: NodeRef<void>;
|
|
2768
|
+
|
|
2769
|
+
/**
|
|
2770
|
+
* A signal that removes the current link.
|
|
2771
|
+
* @group Link Dialog
|
|
2772
|
+
*/
|
|
2773
|
+
export declare const removeLink$: NodeRef<void>;
|
|
2774
|
+
|
|
2775
|
+
/* Excluded from this release type: Root */
|
|
2776
|
+
|
|
2777
|
+
/**
|
|
2778
|
+
* Holds a reference to the root Lexical editor instance.
|
|
2779
|
+
* @group Core
|
|
2780
|
+
*/
|
|
2781
|
+
export declare const rootEditor$: NodeRef<LexicalEditor | null>;
|
|
2782
|
+
|
|
2783
|
+
/* Excluded from this release type: rootEditorSubscriptions$ */
|
|
2784
|
+
|
|
2785
|
+
/**
|
|
2786
|
+
* Saves the data from the image dialog
|
|
2787
|
+
* @group Image
|
|
2788
|
+
*/
|
|
2789
|
+
export declare const saveImage$: NodeRef<SaveImageParameters>;
|
|
2790
|
+
|
|
2791
|
+
/**
|
|
2792
|
+
* @group Image
|
|
2793
|
+
*/
|
|
2794
|
+
export declare interface SaveImageParameters extends BaseImageParameters {
|
|
2795
|
+
src?: string;
|
|
2796
|
+
file?: FileList;
|
|
2797
|
+
}
|
|
2798
|
+
|
|
2799
|
+
export declare const searchOpen$: NodeRef<boolean>;
|
|
2800
|
+
|
|
2801
|
+
export declare const searchPlugin: (params?: unknown) => RealmPlugin;
|
|
2802
|
+
|
|
2803
|
+
/**
|
|
2804
|
+
* A toolbar primitive you can use to build dropdowns, such as the block type select.
|
|
2805
|
+
* @group Toolbar Primitives
|
|
2806
|
+
*/
|
|
2807
|
+
export declare const Select: <T extends string>(props: {
|
|
2808
|
+
value: T;
|
|
2809
|
+
onChange: (value: T) => void;
|
|
2810
|
+
triggerTitle: string;
|
|
2811
|
+
placeholder: string;
|
|
2812
|
+
disabled?: boolean;
|
|
2813
|
+
items: ({
|
|
2814
|
+
label: string | JSX.Element;
|
|
2815
|
+
value: T;
|
|
2816
|
+
} | "separator")[];
|
|
2817
|
+
}) => JSX.Element;
|
|
2818
|
+
|
|
2819
|
+
/* Excluded from this release type: SelectButtonTrigger */
|
|
2820
|
+
|
|
2821
|
+
/* Excluded from this release type: SelectContent */
|
|
2822
|
+
|
|
2823
|
+
/* Excluded from this release type: SelectItem */
|
|
2824
|
+
|
|
2825
|
+
/* Excluded from this release type: SelectTrigger */
|
|
2826
|
+
|
|
2827
|
+
/**
|
|
2828
|
+
* A toolbar primitive that allows you to show a separator between toolbar items.
|
|
2829
|
+
* By default, the separator is styled as vertical line.
|
|
2830
|
+
* @group Toolbar Primitives
|
|
2831
|
+
*/
|
|
2832
|
+
export declare const Separator: default_2.ForwardRefExoticComponent<RadixToolbar.ToolbarSeparatorProps & default_2.RefAttributes<HTMLDivElement>>;
|
|
2833
|
+
|
|
2834
|
+
/**
|
|
2835
|
+
* A serialized representation of an {@link CodeBlockNode}.
|
|
2836
|
+
* @group Code Block
|
|
2837
|
+
*/
|
|
2838
|
+
export declare type SerializedCodeBlockNode = Spread<CreateCodeBlockNodeOptions & {
|
|
2839
|
+
type: 'codeblock';
|
|
2840
|
+
version: 1;
|
|
2841
|
+
}, SerializedLexicalNode>;
|
|
2842
|
+
|
|
2843
|
+
/**
|
|
2844
|
+
* A serialized representation of an {@link DirectiveNode}.
|
|
2845
|
+
* @group Directive
|
|
2846
|
+
*/
|
|
2847
|
+
export declare type SerializedDirectiveNode = Spread<{
|
|
2848
|
+
mdastNode: Directives;
|
|
2849
|
+
type: 'directive';
|
|
2850
|
+
version: 1;
|
|
2851
|
+
}, SerializedLexicalNode>;
|
|
2852
|
+
|
|
2853
|
+
/**
|
|
2854
|
+
* A serialized representation of an {@link FrontmatterNode}.
|
|
2855
|
+
*/
|
|
2856
|
+
export declare type SerializedFrontmatterNode = Spread<{
|
|
2857
|
+
yaml: string;
|
|
2858
|
+
version: 1;
|
|
2859
|
+
}, SerializedLexicalNode>;
|
|
2860
|
+
|
|
2861
|
+
/**
|
|
2862
|
+
* A serialized representation of a {@link GenericHTMLNode}.
|
|
2863
|
+
* @group HTML
|
|
2864
|
+
*/
|
|
2865
|
+
export declare type SerializedGenericHTMLNode = Spread<{
|
|
2866
|
+
tag: KnownHTMLTagType;
|
|
2867
|
+
type: 'generic-html';
|
|
2868
|
+
mdxType: MdxNodeType;
|
|
2869
|
+
attributes: MdxJsxAttribute[];
|
|
2870
|
+
version: 1;
|
|
2871
|
+
}, SerializedElementNode>;
|
|
2872
|
+
|
|
2873
|
+
/**
|
|
2874
|
+
* A serialized representation of an {@link ImageNode}.
|
|
2875
|
+
* @group Image
|
|
2876
|
+
*/
|
|
2877
|
+
export declare type SerializedImageNode = Spread<{
|
|
2878
|
+
altText: string;
|
|
2879
|
+
title?: string;
|
|
2880
|
+
width?: number;
|
|
2881
|
+
height?: number;
|
|
2882
|
+
src: string;
|
|
2883
|
+
rest: (MdxJsxAttribute | MdxJsxExpressionAttribute)[];
|
|
2884
|
+
type: 'image';
|
|
2885
|
+
version: 1;
|
|
2886
|
+
}, SerializedLexicalNode>;
|
|
2887
|
+
|
|
2888
|
+
/**
|
|
2889
|
+
* A serialized representation of a {@link TableNode}.
|
|
2890
|
+
* @group Table
|
|
2891
|
+
*/
|
|
2892
|
+
export declare type SerializedTableNode = Spread<{
|
|
2893
|
+
mdastNode: Mdast.Table;
|
|
2894
|
+
}, SerializedLexicalNode>;
|
|
2895
|
+
|
|
2896
|
+
/**
|
|
2897
|
+
* Sets a new markdown value for the editor, replacing the current one.
|
|
2898
|
+
* @group Core
|
|
2899
|
+
*/
|
|
2900
|
+
export declare const setMarkdown$: NodeRef<string>;
|
|
2901
|
+
|
|
2902
|
+
export declare const showLinkTitleField$: NodeRef<boolean>;
|
|
2903
|
+
|
|
2904
|
+
/**
|
|
2905
|
+
* A toolbar primitive that allows you to build an UI with multiple exclusive toggle groups, like the list type toggle.
|
|
2906
|
+
* @group Toolbar Primitives
|
|
2907
|
+
*/
|
|
2908
|
+
export declare const SingleChoiceToggleGroup: <T extends string>({ value, onChange, className, ggClassName, items, disabled }: {
|
|
2909
|
+
items: {
|
|
2910
|
+
title: string;
|
|
2911
|
+
value: T;
|
|
2912
|
+
contents: default_2.ReactNode;
|
|
2913
|
+
}[];
|
|
2914
|
+
onChange: (value: T | "") => void;
|
|
2915
|
+
value: T | "";
|
|
2916
|
+
ggClassName?: string;
|
|
2917
|
+
className?: string;
|
|
2918
|
+
disabled?: boolean;
|
|
2919
|
+
}) => JSX.Element;
|
|
2920
|
+
|
|
2921
|
+
/* Excluded from this release type: SingleToggleGroup */
|
|
2922
|
+
|
|
2923
|
+
/**
|
|
2924
|
+
* Holds the spellcheck value of the content editable element.
|
|
2925
|
+
* @group Core
|
|
2926
|
+
*/
|
|
2927
|
+
export declare const spellCheck$: NodeRef<boolean>;
|
|
2928
|
+
|
|
2929
|
+
/**
|
|
2930
|
+
* @group Image
|
|
2931
|
+
*/
|
|
2932
|
+
export declare interface SrcImageParameters extends BaseImageParameters {
|
|
2933
|
+
src: string;
|
|
2934
|
+
}
|
|
2935
|
+
|
|
2936
|
+
/**
|
|
2937
|
+
* A toolbar component that lets the user toggle strikeThrough, superscript and subscript formatting.
|
|
2938
|
+
* @group Toolbar Components
|
|
2939
|
+
*/
|
|
2940
|
+
export declare const StrikeThroughSupSubToggles: default_2.FC<StrikeThroughSupSubTogglesProps>;
|
|
2941
|
+
|
|
2942
|
+
export declare interface StrikeThroughSupSubTogglesProps {
|
|
2943
|
+
options?: ('Strikethrough' | 'Sub' | 'Sup')[];
|
|
2944
|
+
}
|
|
2945
|
+
|
|
2946
|
+
/**
|
|
2947
|
+
* An action that switches the link dialog from preview mode to edit mode.
|
|
2948
|
+
* @group Link Dialog
|
|
2949
|
+
*/
|
|
2950
|
+
export declare const switchFromPreviewToLinkEdit$: NodeRef<void>;
|
|
2951
|
+
|
|
2952
|
+
/* Excluded from this release type: SyntaxExtension */
|
|
2953
|
+
|
|
2954
|
+
export declare const syntaxExtensions$: NodeRef< Extension_2[]>;
|
|
2955
|
+
|
|
2956
|
+
/**
|
|
2957
|
+
* React Components registered to be rendered inside table cell editors. Use this instead of {@link addNestedEditorChild$} for components that should only appear in table cells.
|
|
2958
|
+
* Plugins that should not be active in table cells (e.g. lists) should not register here.
|
|
2959
|
+
* @group Core
|
|
2960
|
+
*/
|
|
2961
|
+
export declare const tableCellEditorChildren$: NodeRef<default_2.ComponentType<{}>[]>;
|
|
2962
|
+
|
|
2963
|
+
/**
|
|
2964
|
+
* A Lexical node that represents a markdown table.
|
|
2965
|
+
* Use {@link "$createTableNode"} to construct one.
|
|
2966
|
+
* @group Table
|
|
2967
|
+
*/
|
|
2968
|
+
export declare class TableNode extends DecoratorNode<JSX.Element> {
|
|
2969
|
+
/* Excluded from this release type: __mdastNode */
|
|
2970
|
+
/* Excluded from this release type: focusEmitter */
|
|
2971
|
+
/* Excluded from this release type: getType */
|
|
2972
|
+
/* Excluded from this release type: clone */
|
|
2973
|
+
/* Excluded from this release type: importJSON */
|
|
2974
|
+
/* Excluded from this release type: importDOM */
|
|
2975
|
+
/* Excluded from this release type: exportJSON */
|
|
2976
|
+
/**
|
|
2977
|
+
* Returns the mdast node that this node is constructed from.
|
|
2978
|
+
*/
|
|
2979
|
+
getMdastNode(): Mdast.Table;
|
|
2980
|
+
/**
|
|
2981
|
+
* Returns the number of rows in the table.
|
|
2982
|
+
*/
|
|
2983
|
+
getRowCount(): number;
|
|
2984
|
+
/**
|
|
2985
|
+
* Returns the number of columns in the table.
|
|
2986
|
+
*/
|
|
2987
|
+
getColCount(): number;
|
|
2988
|
+
/**
|
|
2989
|
+
* Constructs a new {@link TableNode} with the specified MDAST table node as the object to edit.
|
|
2990
|
+
* See {@link https://github.com/micromark/micromark-extension-gfm-table | micromark/micromark-extension-gfm-table} for more information on the MDAST table node.
|
|
2991
|
+
*/
|
|
2992
|
+
constructor(mdastNode?: Mdast.Table, key?: NodeKey);
|
|
2993
|
+
/* Excluded from this release type: createDOM */
|
|
2994
|
+
/* Excluded from this release type: updateDOM */
|
|
2995
|
+
/* Excluded from this release type: updateCellContents */
|
|
2996
|
+
insertColumnAt(colIndex: number): void;
|
|
2997
|
+
deleteColumnAt(colIndex: number): void;
|
|
2998
|
+
insertRowAt(y: number): void;
|
|
2999
|
+
deleteRowAt(rowIndex: number): void;
|
|
3000
|
+
addRowToBottom(): void;
|
|
3001
|
+
addColumnToRight(): void;
|
|
3002
|
+
setColumnAlign(colIndex: number, align: Mdast.AlignType): void;
|
|
3003
|
+
/* Excluded from this release type: decorate */
|
|
3004
|
+
/**
|
|
3005
|
+
* Focuses the table cell at the specified coordinates.
|
|
3006
|
+
* Pass `undefined` to remove the focus.
|
|
3007
|
+
*/
|
|
3008
|
+
select(coords?: [colIndex: number, rowIndex: number]): void;
|
|
3009
|
+
/* Excluded from this release type: isInline */
|
|
3010
|
+
}
|
|
3011
|
+
|
|
3012
|
+
/**
|
|
3013
|
+
* A plugin that adds support for tables to the editor.
|
|
3014
|
+
* @group Table
|
|
3015
|
+
*/
|
|
3016
|
+
export declare const tablePlugin: (params?: Options_2 | undefined) => RealmPlugin;
|
|
3017
|
+
|
|
3018
|
+
/**
|
|
3019
|
+
* Calls callback with the first argument, and returns it.
|
|
3020
|
+
* @group Utils
|
|
3021
|
+
*/
|
|
3022
|
+
export declare function tap<T>(arg: T, proc: (arg: T) => unknown): T;
|
|
3023
|
+
|
|
3024
|
+
export declare interface TextNodeIndex {
|
|
3025
|
+
allText: string;
|
|
3026
|
+
nodeIndex: Node[];
|
|
3027
|
+
offsetIndex: number[];
|
|
3028
|
+
}
|
|
3029
|
+
|
|
3030
|
+
/**
|
|
3031
|
+
* A plugin that adds support for thematic breaks.
|
|
3032
|
+
* @group Thematic Break
|
|
3033
|
+
*/
|
|
3034
|
+
export declare const thematicBreakPlugin: (params?: unknown) => RealmPlugin;
|
|
3035
|
+
|
|
3036
|
+
/**
|
|
3037
|
+
* Takes a value and applies a function to it.
|
|
3038
|
+
* @group Utils
|
|
3039
|
+
*/
|
|
3040
|
+
export declare function thrush<I, K>(arg: I, proc: (arg: I) => K): K;
|
|
3041
|
+
|
|
3042
|
+
/* Excluded from this release type: ToggleSingleGroupWithItem */
|
|
3043
|
+
|
|
3044
|
+
export declare interface ToMarkdownExtension extends ToMarkdownOptions {
|
|
3045
|
+
}
|
|
3046
|
+
|
|
3047
|
+
/* Excluded from this release type: toMarkdownExtensions$ */
|
|
3048
|
+
|
|
3049
|
+
/* Excluded from this release type: toMarkdownOptions$ */
|
|
3050
|
+
|
|
3051
|
+
export declare interface ToMarkdownOptions extends Options {
|
|
3052
|
+
}
|
|
3053
|
+
|
|
3054
|
+
export declare const toolbarClassName$: NodeRef<string>;
|
|
3055
|
+
|
|
3056
|
+
/**
|
|
3057
|
+
* The factory function that returns the contents of the toolbar.
|
|
3058
|
+
* @group Toolbar
|
|
3059
|
+
*/
|
|
3060
|
+
export declare const toolbarContents$: NodeRef<() => default_2.ReactNode>;
|
|
3061
|
+
|
|
3062
|
+
/**
|
|
3063
|
+
* A plugin that adds a toolbar to the editor.
|
|
3064
|
+
* @group Toolbar
|
|
3065
|
+
*/
|
|
3066
|
+
export declare const toolbarPlugin: (params?: {
|
|
3067
|
+
/**
|
|
3068
|
+
* Contents of the toolbar
|
|
3069
|
+
*/
|
|
3070
|
+
toolbarContents: () => default_2.ReactNode;
|
|
3071
|
+
/**
|
|
3072
|
+
* The class name to apply to the toolbar element
|
|
3073
|
+
*/
|
|
3074
|
+
toolbarClassName?: string;
|
|
3075
|
+
/**
|
|
3076
|
+
* Controls the position of the toolbar (top by default)
|
|
3077
|
+
*/
|
|
3078
|
+
toolbarPosition?: "top" | "bottom";
|
|
3079
|
+
} | undefined) => RealmPlugin;
|
|
3080
|
+
|
|
3081
|
+
/* Excluded from this release type: ToolbarToggleItem */
|
|
3082
|
+
|
|
3083
|
+
/**
|
|
3084
|
+
* A styled wrapper around the radix-ui tooltip, that lets you display an instant tooltip on hover.
|
|
3085
|
+
* @group Toolbar Primitives
|
|
3086
|
+
*/
|
|
3087
|
+
export declare const TooltipWrap: default_2.ForwardRefExoticComponent<{
|
|
3088
|
+
title: string;
|
|
3089
|
+
children: ReactNode;
|
|
3090
|
+
} & default_2.RefAttributes<HTMLButtonElement>>;
|
|
3091
|
+
|
|
3092
|
+
/* Excluded from this release type: topAreaChildren$ */
|
|
3093
|
+
|
|
3094
|
+
export declare const translation$: NodeRef<Translation>;
|
|
3095
|
+
|
|
3096
|
+
export declare type Translation = (key: string, defaultValue: string, interpolations?: Record<string, any>) => string;
|
|
3097
|
+
|
|
3098
|
+
/* Excluded from this release type: TYPE_NAME */
|
|
3099
|
+
|
|
3100
|
+
/**
|
|
3101
|
+
* A toolbar component that lets the user undo and redo changes in the editor.
|
|
3102
|
+
* @group Toolbar Components
|
|
3103
|
+
*/
|
|
3104
|
+
export declare const UndoRedo: default_2.FC;
|
|
3105
|
+
|
|
3106
|
+
/**
|
|
3107
|
+
* An error that gets thrown when the Markdown parsing encounters a node that has no corresponding {@link MdastImportVisitor}.
|
|
3108
|
+
* @group Markdown Processing
|
|
3109
|
+
*/
|
|
3110
|
+
export declare class UnrecognizedMarkdownConstructError extends Error {
|
|
3111
|
+
constructor(message: string);
|
|
3112
|
+
}
|
|
3113
|
+
|
|
3114
|
+
/**
|
|
3115
|
+
* A signal that updates the current link with the published payload.
|
|
3116
|
+
* @group Link Dialog
|
|
3117
|
+
*/
|
|
3118
|
+
export declare const updateLink$: NodeRef<{
|
|
3119
|
+
text: string | undefined;
|
|
3120
|
+
url: string | undefined;
|
|
3121
|
+
title: string | undefined;
|
|
3122
|
+
}>;
|
|
3123
|
+
|
|
3124
|
+
/**
|
|
3125
|
+
* Use this hook in your custom code block editors to modify the underlying node code, language, and meta.
|
|
3126
|
+
* @group Code Block
|
|
3127
|
+
*/
|
|
3128
|
+
export declare function useCodeBlockEditorContext(): CodeBlockEditorContextValue;
|
|
3129
|
+
|
|
3130
|
+
/**
|
|
3131
|
+
* Contains the currently registered lexical nodes.
|
|
3132
|
+
* @group Core
|
|
3133
|
+
*/
|
|
3134
|
+
export declare const usedLexicalNodes$: NodeRef<KlassConstructor<typeof LexicalNode>[]>;
|
|
3135
|
+
|
|
3136
|
+
export declare function useEditorSearch(): {
|
|
3137
|
+
next: () => void;
|
|
3138
|
+
prev: () => void;
|
|
3139
|
+
total: number;
|
|
3140
|
+
cursor: number;
|
|
3141
|
+
setSearch: (term: string | null) => void;
|
|
3142
|
+
search: string;
|
|
3143
|
+
currentRange: Range;
|
|
3144
|
+
isSearchOpen: boolean;
|
|
3145
|
+
setIsSearchOpen: (value: boolean) => void;
|
|
3146
|
+
openSearch: () => void;
|
|
3147
|
+
closeSearch: () => void;
|
|
3148
|
+
toggleSearch: () => void;
|
|
3149
|
+
ranges: Range[];
|
|
3150
|
+
scrollToRangeOrIndex: (range: Range | number, options?: {
|
|
3151
|
+
ignoreIfInView?: boolean;
|
|
3152
|
+
behavior?: ScrollBehavior;
|
|
3153
|
+
}) => void;
|
|
3154
|
+
replace: (str: string, onUpdate?: () => void) => void;
|
|
3155
|
+
replaceAll: (str: string, onUpdate?: () => void) => void;
|
|
3156
|
+
};
|
|
3157
|
+
|
|
3158
|
+
/**
|
|
3159
|
+
* A hook that returns a function that removes the lexical node from the editor.
|
|
3160
|
+
* @group Custom Editor Primitives
|
|
3161
|
+
*/
|
|
3162
|
+
export declare function useLexicalNodeRemove(): () => void;
|
|
3163
|
+
|
|
3164
|
+
/**
|
|
3165
|
+
* A hook that returns a function that can be used to update the mdast node. Use this in your custom editor components.
|
|
3166
|
+
* @group Custom Editor Primitives
|
|
3167
|
+
*/
|
|
3168
|
+
export declare function useMdastNodeUpdater<T extends Mdast.RootContent>(): (node: Partial<T>) => void;
|
|
3169
|
+
|
|
3170
|
+
/**
|
|
3171
|
+
* A hook to get the current {@link NestedEditorsContext} value. Use this in your custom editor components.
|
|
3172
|
+
* @group Custom Editor Primitives
|
|
3173
|
+
*/
|
|
3174
|
+
export declare function useNestedEditorContext<T extends Mdast.RootContent>(): NestedEditorsContextValue<T>;
|
|
3175
|
+
|
|
3176
|
+
/**
|
|
3177
|
+
* A hook to access the realm of a remote MDX editor by its ID. You need to wrap your tree in the `RemoteMDXEditorRealmProvider` and add the {@link remoteRealmPlugin} to the editor's instance.
|
|
3178
|
+
* @param editorId - The id passed to the {@link remoteRealmPlugin} of the MDX editor instance.
|
|
3179
|
+
* @group Utils
|
|
3180
|
+
*/
|
|
3181
|
+
export declare function useRemoteMDXEditorRealm(editorId: string): Realm | undefined;
|
|
3182
|
+
|
|
3183
|
+
export declare function useTranslation(): Translation;
|
|
3184
|
+
|
|
3185
|
+
/* Excluded from this release type: uuidv4 */
|
|
3186
|
+
|
|
3187
|
+
/**
|
|
3188
|
+
* The current view mode of the editor when using the {@link diffSourcePlugin}.
|
|
3189
|
+
* @group Diff/Source
|
|
3190
|
+
*/
|
|
3191
|
+
export declare const viewMode$: NodeRef<ViewMode>;
|
|
3192
|
+
|
|
3193
|
+
/**
|
|
3194
|
+
* The possible view modes of the editor when using the {@link diffSourcePlugin}.
|
|
3195
|
+
* @group Diff/Source
|
|
3196
|
+
*/
|
|
3197
|
+
export declare type ViewMode = 'rich-text' | 'source' | 'diff';
|
|
3198
|
+
|
|
3199
|
+
/**
|
|
3200
|
+
* An emitter object that has a single subscription that will be executed.
|
|
3201
|
+
* The construct is used so that the lexical nodes can focus their React component editors.
|
|
3202
|
+
* @group Utils
|
|
3203
|
+
*/
|
|
3204
|
+
export declare interface VoidEmitter {
|
|
3205
|
+
/**
|
|
3206
|
+
* Subscribes to the emitter event
|
|
3207
|
+
*/
|
|
3208
|
+
subscribe: (cb: () => void) => void;
|
|
3209
|
+
}
|
|
3210
|
+
|
|
3211
|
+
/**
|
|
3212
|
+
* Creates a void emitter.
|
|
3213
|
+
* @group Utils
|
|
3214
|
+
*/
|
|
3215
|
+
export declare function voidEmitter(): {
|
|
3216
|
+
publish: () => void;
|
|
3217
|
+
subscribe: (cb: () => void) => void;
|
|
3218
|
+
};
|
|
3219
|
+
|
|
3220
|
+
|
|
3221
|
+
export * from "@mdxeditor/gurx";
|
|
3222
|
+
|
|
3223
|
+
export { }
|
|
3224
|
+
|
|
3225
|
+
|
|
3226
|
+
declare module 'micromark-util-types' {
|
|
3227
|
+
interface TokenTypeMap {
|
|
3228
|
+
comment: 'comment';
|
|
3229
|
+
commentEnd: 'commentEnd';
|
|
3230
|
+
data: 'data';
|
|
3231
|
+
}
|
|
3232
|
+
}
|