@mdxeditor/editor 3.0.8 → 3.1.1

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.
Files changed (60) hide show
  1. package/dist/FormatConstants.js +10 -0
  2. package/dist/MDXEditor.js +1 -1
  3. package/dist/directive-editors/GenericDirectiveEditor.js +5 -7
  4. package/dist/exportMarkdownFromLexical.js +10 -7
  5. package/dist/icons/strikethrough_s.svg.js +5 -0
  6. package/dist/icons/subscript.svg.js +5 -0
  7. package/dist/icons/superscript.svg.js +5 -0
  8. package/dist/importMarkdownToLexical.js +3 -1
  9. package/dist/index.d.ts +62 -32
  10. package/dist/index.js +12 -1
  11. package/dist/jsx-editors/GenericJsxEditor.js +1 -1
  12. package/dist/mdastUtilHtmlComment.js +2 -2
  13. package/dist/node_modules/micromark-extension-gfm-strikethrough/lib/syntax.js +114 -0
  14. package/dist/node_modules/micromark-util-chunked/index.js +29 -0
  15. package/dist/node_modules/micromark-util-classify-character/index.js +12 -0
  16. package/dist/node_modules/micromark-util-resolve-all/index.js +15 -0
  17. package/dist/plugins/codeblock/index.js +2 -2
  18. package/dist/plugins/codemirror/index.js +4 -4
  19. package/dist/plugins/core/Icon.js +6 -0
  20. package/dist/plugins/core/LexicalTextVisitor.js +49 -4
  21. package/dist/plugins/core/MdastFormattingVisitor.js +35 -59
  22. package/dist/plugins/core/MdastHTMLNode.js +1 -2
  23. package/dist/plugins/core/NestedLexicalEditor.js +1 -1
  24. package/dist/plugins/core/PropertyPopover.js +28 -18
  25. package/dist/plugins/core/index.js +34 -29
  26. package/dist/plugins/core/ui/DownshiftAutoComplete.js +1 -1
  27. package/dist/plugins/directives/index.js +2 -2
  28. package/dist/plugins/frontmatter/FrontmatterEditor.js +48 -31
  29. package/dist/plugins/frontmatter/FrontmatterNode.js +5 -3
  30. package/dist/plugins/image/ImageDialog.js +1 -1
  31. package/dist/plugins/image/ImageEditor.js +8 -6
  32. package/dist/plugins/image/ImageNode.js +2 -2
  33. package/dist/plugins/image/MdastImageVisitor.js +3 -3
  34. package/dist/plugins/image/index.js +20 -20
  35. package/dist/plugins/jsx/index.js +1 -1
  36. package/dist/plugins/link-dialog/LinkDialog.js +13 -5
  37. package/dist/plugins/link-dialog/index.js +7 -8
  38. package/dist/plugins/lists/MdastListVisitor.js +1 -2
  39. package/dist/plugins/lists/index.js +1 -1
  40. package/dist/plugins/markdown-shortcut/index.js +4 -2
  41. package/dist/plugins/sandpack/SandpackEditor.js +1 -1
  42. package/dist/plugins/sandpack/index.js +2 -2
  43. package/dist/plugins/sandpack/useCodeMirrorRef.js +8 -8
  44. package/dist/plugins/table/TableEditor.js +67 -50
  45. package/dist/plugins/table/TableNode.js +2 -2
  46. package/dist/plugins/toolbar/components/BlockTypeSelect.js +3 -3
  47. package/dist/plugins/toolbar/components/BoldItalicUnderlineToggles.js +79 -24
  48. package/dist/plugins/toolbar/components/ChangeAdmonitionType.js +1 -1
  49. package/dist/plugins/toolbar/components/ChangeCodeMirrorLanguage.js +1 -1
  50. package/dist/plugins/toolbar/components/DiffSourceToggleWrapper.js +3 -1
  51. package/dist/plugins/toolbar/components/InsertFrontmatter.js +3 -1
  52. package/dist/plugins/toolbar/components/InsertImage.js +12 -1
  53. package/dist/plugins/toolbar/components/InsertThematicBreak.js +10 -1
  54. package/dist/plugins/toolbar/components/KitchenSinkToolbar.js +2 -2
  55. package/dist/plugins/toolbar/primitives/DialogButton.js +1 -1
  56. package/dist/plugins/toolbar/primitives/select.js +3 -1
  57. package/dist/plugins/toolbar/primitives/toolbar.js +17 -3
  58. package/dist/utils/detectMac.js +1 -1
  59. package/dist/utils/isPartOftheEditorUI.js +1 -1
  60. package/package.json +3 -2
@@ -1,10 +1,20 @@
1
+ const DEFAULT_FORMAT = 0;
1
2
  const IS_BOLD = 1;
2
3
  const IS_ITALIC = 2;
4
+ const IS_STRIKETHROUGH = 4;
3
5
  const IS_UNDERLINE = 8;
4
6
  const IS_CODE = 16;
7
+ const IS_SUBSCRIPT = 32;
8
+ const IS_SUPERSCRIPT = 64;
9
+ const IS_HIGHLIGHT = 128;
5
10
  export {
11
+ DEFAULT_FORMAT,
6
12
  IS_BOLD,
7
13
  IS_CODE,
14
+ IS_HIGHLIGHT,
8
15
  IS_ITALIC,
16
+ IS_STRIKETHROUGH,
17
+ IS_SUBSCRIPT,
18
+ IS_SUPERSCRIPT,
9
19
  IS_UNDERLINE
10
20
  };
package/dist/MDXEditor.js CHANGED
@@ -125,7 +125,7 @@ const MDXEditor = React__default.forwardRef((props, ref) => {
125
125
  onError: props.onError ?? noop,
126
126
  translation: props.translation ?? defaultTranslation
127
127
  }),
128
- ...props.plugins || []
128
+ ...props.plugins ?? []
129
129
  ]
130
130
  },
131
131
  /* @__PURE__ */ React__default.createElement(EditorRootElement, { className: props.className }, /* @__PURE__ */ React__default.createElement(LexicalProvider, null, /* @__PURE__ */ React__default.createElement(RichTextEditor, null))),
@@ -5,13 +5,11 @@ import styles from "../styles/ui.module.css.js";
5
5
  const GenericDirectiveEditor = ({ mdastNode, descriptor }) => {
6
6
  const updateMdastNode = useMdastNodeUpdater();
7
7
  const properties = React__default.useMemo(() => {
8
- return descriptor.attributes.reduce(
9
- (acc, attributeName) => {
10
- acc[attributeName] = (mdastNode.attributes || {})[attributeName] || "";
11
- return acc;
12
- },
13
- {}
14
- );
8
+ return descriptor.attributes.reduce((acc, attributeName) => {
9
+ var _a;
10
+ acc[attributeName] = ((_a = mdastNode.attributes) == null ? void 0 : _a[attributeName]) ?? "";
11
+ return acc;
12
+ }, {});
15
13
  }, [mdastNode, descriptor]);
16
14
  const onChange = React__default.useCallback(
17
15
  (values) => {
@@ -136,14 +136,13 @@ function exportLexicalTreeToMdast({
136
136
  return typedRoot;
137
137
  }
138
138
  function collapseNestedHtmlTags(node) {
139
- if ("children" in node && node.children) {
139
+ if ("children" in node && node.children.length > 0) {
140
140
  if (isMdastHTMLNode(node) && node.children.length === 1) {
141
141
  const onlyChild = node.children[0];
142
142
  if (onlyChild.type === "mdxJsxTextElement" && onlyChild.name === "span") {
143
- (onlyChild.attributes || []).forEach((attribute) => {
144
- var _a;
143
+ onlyChild.attributes.forEach((attribute) => {
145
144
  if (attribute.type === "mdxJsxAttribute") {
146
- const parentAttribute = (_a = node.attributes) == null ? void 0 : _a.find((attr) => attr.type === "mdxJsxAttribute" && attr.name === attribute.name);
145
+ const parentAttribute = node.attributes.find((attr) => attr.type === "mdxJsxAttribute" && attr.name === attribute.name);
147
146
  if (parentAttribute) {
148
147
  if (attribute.name === "className") {
149
148
  const mergedClassesSet = /* @__PURE__ */ new Set([
@@ -162,7 +161,9 @@ function collapseNestedHtmlTags(node) {
162
161
  node.children = onlyChild.children;
163
162
  }
164
163
  }
165
- node.children.forEach((child) => collapseNestedHtmlTags(child));
164
+ node.children.forEach((child) => {
165
+ collapseNestedHtmlTags(child);
166
+ });
166
167
  }
167
168
  }
168
169
  function convertUnderlineJsxToHtml(node) {
@@ -215,9 +216,11 @@ function fixWrappingWhitespace(node, parentChain) {
215
216
  }
216
217
  }
217
218
  }
218
- if ("children" in node && node.children) {
219
+ if ("children" in node && node.children.length > 0) {
219
220
  const nodeAsParent = node;
220
- nodeAsParent.children.forEach((child) => fixWrappingWhitespace(child, [...parentChain, nodeAsParent]));
221
+ nodeAsParent.children.forEach((child) => {
222
+ fixWrappingWhitespace(child, [...parentChain, nodeAsParent]);
223
+ });
221
224
  }
222
225
  }
223
226
  function exportMarkdownFromLexical({
@@ -0,0 +1,5 @@
1
+ import * as React from "react";
2
+ const SvgStrikethroughS = (props) => /* @__PURE__ */ React.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M12.15 20C10.8833 20 9.75833 19.625 8.775 18.875C7.79167 18.125 7.08333 17.1 6.65 15.8L8.85 14.85C9.08333 15.65 9.4875 16.3083 10.0625 16.825C10.6375 17.3416 11.35 17.6 12.2 17.6C12.9 17.6 13.5333 17.4333 14.1 17.1C14.6667 16.7666 14.95 16.2333 14.95 15.5C14.95 15.2 14.8917 14.925 14.775 14.675C14.6583 14.425 14.5 14.2 14.3 14H17.1C17.1833 14.2333 17.2458 14.4708 17.2875 14.7125C17.3292 14.9541 17.35 15.2166 17.35 15.5C17.35 16.9333 16.8375 18.0416 15.8125 18.825C14.7875 19.6083 13.5667 20 12.15 20ZM2 12V9.99998H22V12H2ZM12.05 3.84998C13.15 3.84998 14.1125 4.12081 14.9375 4.66248C15.7625 5.20414 16.4 6.03331 16.85 7.14998L14.65 8.12498C14.5 7.64164 14.2208 7.20831 13.8125 6.82498C13.4042 6.44164 12.8333 6.24998 12.1 6.24998C11.4167 6.24998 10.85 6.40414 10.4 6.71248C9.95 7.02081 9.7 7.44998 9.65 7.99998H7.25C7.28333 6.84998 7.7375 5.87081 8.6125 5.06248C9.4875 4.25414 10.6333 3.84998 12.05 3.84998Z", fill: "currentColor" }));
3
+ export {
4
+ SvgStrikethroughS as default
5
+ };
@@ -0,0 +1,5 @@
1
+ import * as React from "react";
2
+ const SvgSubscript = (props) => /* @__PURE__ */ React.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M19 21V18H22V17H19V16H23V19H20V20H23V21H19ZM5.875 19L10.5 11.725L6.2 5H8.85L11.95 10H12.05L15.125 5H17.8L13.475 11.725L18.125 19H15.45L12.05 13.575H11.95L8.55 19H5.875Z", fill: "currentColor" }));
3
+ export {
4
+ SvgSubscript as default
5
+ };
@@ -0,0 +1,5 @@
1
+ import * as React from "react";
2
+ const SvgSuperscript = (props) => /* @__PURE__ */ React.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M19 8V5H22V4H19V3H23V6H20V7H23V8H19ZM5.875 19L10.5 11.725L6.2 5H8.85L11.95 10H12.05L15.125 5H17.8L13.475 11.725L18.125 19H15.45L12.05 13.575H11.95L8.55 19H5.875Z", fill: "currentColor" }));
3
+ export {
4
+ SvgSuperscript as default
5
+ };
@@ -53,7 +53,9 @@ function importMdastTreeToLexical({ root, mdastRoot, visitors, ...descriptors })
53
53
  if (!isParent(mdastNode)) {
54
54
  throw new Error("Attempting to visit children of a non-parent");
55
55
  }
56
- mdastNode.children.forEach((child) => visit(child, lexicalParent, mdastNode));
56
+ mdastNode.children.forEach((child) => {
57
+ visit(child, lexicalParent, mdastNode);
58
+ });
57
59
  }
58
60
  function visit(mdastNode, lexicalParent, mdastParent) {
59
61
  const visitor = visitors.find((visitor2) => {
package/dist/index.d.ts CHANGED
@@ -594,7 +594,7 @@ export declare const ConditionalContents: default_2.FC<{
594
594
  * An object that describes a possible option to be displayed in the {@link ConditionalContents} component.
595
595
  * @group Toolbar Primitives
596
596
  */
597
- export declare type ConditionalContentsOption = {
597
+ export declare interface ConditionalContentsOption {
598
598
  /**
599
599
  * A function that returns `true` if the option should be displayed for the current editor in focus.
600
600
  */
@@ -603,7 +603,7 @@ export declare type ConditionalContentsOption = {
603
603
  * The contents to display if the `when` function returns `true`.
604
604
  */
605
605
  contents: () => default_2.ReactNode;
606
- };
606
+ }
607
607
 
608
608
  /**
609
609
  * Holds the CSS class name of the content editable element.
@@ -705,7 +705,7 @@ export declare const currentBlockType$: NodeRef<BlockType>;
705
705
  * Holds the current format of the selection.
706
706
  * @group Core
707
707
  */
708
- export declare const currentFormat$: NodeRef<number>;
708
+ export declare const currentFormat$: NodeRef<FORMAT>;
709
709
 
710
710
  /**
711
711
  * The current list type in the editor.
@@ -731,6 +731,8 @@ export declare function curry1to0<T, R>(proc: (arg: T) => R, arg: T): () => R;
731
731
  */
732
732
  export declare function curry2to1<T, K, R>(proc: (arg1: T, arg2: K) => R, arg1: T): (arg2: K) => R;
733
733
 
734
+ export declare const DEFAULT_FORMAT: 0;
735
+
734
736
  /**
735
737
  * Contains the default language to use when creating a new code block if no language is passed.
736
738
  * @group Code Block
@@ -866,7 +868,7 @@ export declare interface DirectiveDescriptor<T extends Directives = Directives>
866
868
  * Contains the currently registered Markdown directive descriptors.
867
869
  * @group Directive
868
870
  */
869
- export declare const directiveDescriptors$: NodeRef<DirectiveDescriptor<Directives>[]>;
871
+ export declare const directiveDescriptors$: NodeRef<DirectiveDescriptor< Directives>[]>;
870
872
 
871
873
  /**
872
874
  * The properties passed to the {@link DirectiveDescriptor.Editor} component.
@@ -954,11 +956,11 @@ export declare const disableImageSettingsButton$: NodeRef<boolean>;
954
956
  * The state of the image dialog when it is in editing an existing node.
955
957
  * @group Image
956
958
  */
957
- export declare type EditingImageDialogState = {
959
+ export declare interface EditingImageDialogState {
958
960
  type: 'editing';
959
961
  nodeKey: string;
960
962
  initialValues: Omit<SaveImageParameters, 'file'>;
961
- };
963
+ }
962
964
 
963
965
  /**
964
966
  * The state of the link dialog when it is in edit mode.
@@ -1013,26 +1015,34 @@ export declare type EditorSubscription = (activeEditor: LexicalEditor) => () =>
1013
1015
 
1014
1016
  /* Excluded from this release type: exportVisitors$ */
1015
1017
 
1016
- declare type ExpressionValue = {
1018
+ /**
1019
+ * @group JSX
1020
+ */
1021
+ export declare interface ExpressionValue {
1017
1022
  type: 'expression';
1018
1023
  value: string;
1019
- };
1024
+ }
1020
1025
 
1021
1026
  /**
1022
1027
  * A default option to be displayed in the {@link ConditionalContents} component if none of the other options match.
1023
1028
  * @group Toolbar Primitives
1024
1029
  */
1025
- export declare type FallbackOption = {
1030
+ export declare interface FallbackOption {
1026
1031
  /**
1027
1032
  * The contents to display
1028
1033
  */
1029
1034
  fallback: () => default_2.ReactNode;
1030
- };
1035
+ }
1031
1036
 
1032
- declare interface FileImageParameters extends BaseImageParameters {
1037
+ /**
1038
+ * @group Image
1039
+ */
1040
+ export declare interface FileImageParameters extends BaseImageParameters {
1033
1041
  file: File;
1034
1042
  }
1035
1043
 
1044
+ 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;
1045
+
1036
1046
  /**
1037
1047
  * Fetches a value from the Lexical editor read cycle.
1038
1048
  * @group Utils
@@ -1157,7 +1167,7 @@ export declare const iconComponentFor$: NodeRef<(name: IconKey) => default_2.Rea
1157
1167
  * A type that represents the possible icon names that can be used with the {@link iconComponentFor$} cell.
1158
1168
  * @group Core
1159
1169
  */
1160
- export declare type IconKey = 'add_column' | 'add_photo' | 'add_row' | 'arrow_drop_down' | 'check' | 'check_small' | 'close' | 'code' | 'content_copy' | 'delete_big' | 'delete_small' | 'sandpack' | 'difference' | 'edit' | 'admonition' | 'extension' | 'format_align_center' | 'format_align_left' | 'format_align_right' | 'format_bold' | 'format_italic' | 'format_list_bulleted' | 'format_list_checked' | 'format_list_numbered' | 'format_underlined' | 'frame_source' | 'frontmatter' | 'horizontal_rule' | 'insert_col_left' | 'insert_col_right' | 'insert_row_above' | 'insert_row_below' | 'link' | 'link_off' | 'markdown' | 'more_horiz' | 'more_vert' | 'open_in_new' | 'redo' | 'rich_text' | 'settings' | 'table' | 'undo';
1170
+ export declare type IconKey = 'add_column' | 'add_photo' | 'add_row' | 'arrow_drop_down' | 'check' | 'check_small' | 'close' | 'code' | 'content_copy' | 'delete_big' | 'delete_small' | 'sandpack' | 'difference' | 'edit' | 'admonition' | 'extension' | 'format_align_center' | 'format_align_left' | 'format_align_right' | 'format_bold' | 'format_italic' | 'format_list_bulleted' | 'format_list_checked' | 'format_list_numbered' | 'format_underlined' | 'frame_source' | 'frontmatter' | 'horizontal_rule' | 'insert_col_left' | 'insert_col_right' | 'insert_row_above' | 'insert_row_below' | 'link' | 'link_off' | 'markdown' | 'more_horiz' | 'more_vert' | 'open_in_new' | 'redo' | 'rich_text' | 'settings' | 'strikeThrough' | 'subscript' | 'superscript' | 'table' | 'undo';
1161
1171
 
1162
1172
  /**
1163
1173
  * Holds the autocomplete suggestions for image sources.
@@ -1260,9 +1270,9 @@ export declare interface ImportPoint {
1260
1270
  * The state of the image dialog when it is inactive.
1261
1271
  * @group Image
1262
1272
  */
1263
- export declare type InactiveImageDialogState = {
1273
+ export declare interface InactiveImageDialogState {
1264
1274
  type: 'inactive';
1265
- };
1275
+ }
1266
1276
 
1267
1277
  /**
1268
1278
  * The state of the link dialog when it is inactive.
@@ -1449,13 +1459,21 @@ export declare const InsertThematicBreak: default_2.FC;
1449
1459
  */
1450
1460
  export declare const IS_APPLE: boolean;
1451
1461
 
1452
- declare const IS_BOLD: 1;
1462
+ export declare const IS_BOLD: 1;
1463
+
1464
+ export declare const IS_CODE: 16;
1465
+
1466
+ export declare const IS_HIGHLIGHT: 128;
1453
1467
 
1454
- declare const IS_CODE: 16;
1468
+ export declare const IS_ITALIC: 2;
1455
1469
 
1456
- declare const IS_ITALIC: 2;
1470
+ export declare const IS_STRIKETHROUGH: 4;
1457
1471
 
1458
- declare const IS_UNDERLINE: 8;
1472
+ export declare const IS_SUBSCRIPT: 32;
1473
+
1474
+ export declare const IS_SUPERSCRIPT: 64;
1475
+
1476
+ export declare const IS_UNDERLINE: 8;
1459
1477
 
1460
1478
  /**
1461
1479
  * Determines if the given node is a HTML MDAST node.
@@ -1476,7 +1494,7 @@ export declare function isMdastJsxNode(node: Mdast.Nodes): node is MdastJsx;
1476
1494
  * joinProc does not pass arguments or collect return values.
1477
1495
  * @group Utils
1478
1496
  */
1479
- export declare function joinProc(...procs: Array<() => unknown>): () => void;
1497
+ export declare function joinProc(...procs: (() => unknown)[]): () => void;
1480
1498
 
1481
1499
  /**
1482
1500
  * Defines the structure of a JSX component that can be used within the markdown document.
@@ -1544,7 +1562,10 @@ export declare const jsxIsAvailable$: NodeRef<boolean>;
1544
1562
  */
1545
1563
  export declare const jsxPlugin: (params?: JsxPluginParams | undefined) => RealmPlugin;
1546
1564
 
1547
- declare type JsxPluginParams = {
1565
+ /**
1566
+ * @group JSX
1567
+ */
1568
+ export declare interface JsxPluginParams {
1548
1569
  /**
1549
1570
  * A set of descriptors that document the JSX elements used in the document.
1550
1571
  */
@@ -1553,9 +1574,9 @@ declare type JsxPluginParams = {
1553
1574
  * Wether or not to allow default React fragments <></> processing in MDX.
1554
1575
  */
1555
1576
  allowFragment?: boolean;
1556
- };
1577
+ }
1557
1578
 
1558
- declare type JsxProperties = Record<string, string | ExpressionValue>;
1579
+ export declare type JsxProperties = Record<string, string | ExpressionValue>;
1559
1580
 
1560
1581
  /**
1561
1582
  * Defines the structure of a JSX component property.
@@ -1740,7 +1761,7 @@ export declare const listsPlugin: (params?: unknown) => RealmPlugin;
1740
1761
  * @param options - The list types that the user can toggle between. Defaults to `['bullet', 'number', 'check']`.
1741
1762
  */
1742
1763
  export declare const ListsToggle: default_2.FC<{
1743
- options?: Array<'bullet' | 'number' | 'check'>;
1764
+ options?: ('bullet' | 'number' | 'check')[];
1744
1765
  }>;
1745
1766
 
1746
1767
  /* Excluded from this release type: makeHslTransparent */
@@ -1852,12 +1873,12 @@ export declare interface MdastImportVisitor<UN extends Mdast.Nodes> {
1852
1873
  * Adds formatting as a context for the current node and its children.
1853
1874
  * This is necessary due to mdast treating formatting as a node, while lexical considering it an attribute of a node.
1854
1875
  */
1855
- addFormatting(format: typeof IS_BOLD | typeof IS_ITALIC | typeof IS_UNDERLINE | typeof IS_CODE, node?: Mdast.Parent | null): void;
1876
+ addFormatting(format: FORMAT, node?: Mdast.Parent | null): void;
1856
1877
  /**
1857
1878
  * Removes formatting as a context for the current node and its children.
1858
1879
  * This is necessary due to mdast treating formatting as a node, while lexical considering it an attribute of a node.
1859
1880
  */
1860
- removeFormatting(format: typeof IS_BOLD | typeof IS_ITALIC | typeof IS_UNDERLINE | typeof IS_CODE, node?: Mdast.Parent | null): void;
1881
+ removeFormatting(format: FORMAT, node?: Mdast.Parent | null): void;
1861
1882
  /**
1862
1883
  * Access the current formatting context.
1863
1884
  */
@@ -2107,9 +2128,9 @@ export declare const NestedLexicalEditor: <T extends Mdast.RootContent>(props: {
2107
2128
  * The state of the image dialog when it is in new mode.
2108
2129
  * @group Image
2109
2130
  */
2110
- export declare type NewImageDialogState = {
2131
+ export declare interface NewImageDialogState {
2111
2132
  type: 'new';
2112
- };
2133
+ }
2113
2134
 
2114
2135
  /**
2115
2136
  * an empty function
@@ -2463,17 +2484,26 @@ export declare const SingleChoiceToggleGroup: <T extends string>({ value, onChan
2463
2484
  value: T;
2464
2485
  contents: default_2.ReactNode;
2465
2486
  }[];
2466
- onChange: (value: T) => void;
2467
- value: T;
2487
+ onChange: (value: T | '') => void;
2488
+ value: T | '';
2468
2489
  className?: string;
2469
2490
  }) => default_2.JSX.Element;
2470
2491
 
2471
2492
  /* Excluded from this release type: SingleToggleGroup */
2472
2493
 
2473
- declare interface SrcImageParameters extends BaseImageParameters {
2494
+ /**
2495
+ * @group Image
2496
+ */
2497
+ export declare interface SrcImageParameters extends BaseImageParameters {
2474
2498
  src: string;
2475
2499
  }
2476
2500
 
2501
+ /**
2502
+ * A toolbar component that lets the user toggle strikeThrough, superscript and subscript formatting.
2503
+ * @group Toolbar Components
2504
+ */
2505
+ export declare const StrikeThroughSupSubToggles: default_2.FC;
2506
+
2477
2507
  /**
2478
2508
  * An action that switches the link dialog from preview mode to edit mode.
2479
2509
  * @group Link Dialog
@@ -2668,12 +2698,12 @@ export declare type ViewMode = 'rich-text' | 'source' | 'diff';
2668
2698
  * The construct is used so that the lexical nodes can focus their React component editors.
2669
2699
  * @group Utils
2670
2700
  */
2671
- export declare type VoidEmitter = {
2701
+ export declare interface VoidEmitter {
2672
2702
  /**
2673
2703
  * Subscribes to the emitter event
2674
2704
  */
2675
2705
  subscribe: (cb: () => void) => void;
2676
- };
2706
+ }
2677
2707
 
2678
2708
  /**
2679
2709
  * Creates a void emitter.
package/dist/index.js CHANGED
@@ -27,7 +27,7 @@ import { toolbarContents$, toolbarPlugin } from "./plugins/toolbar/index.js";
27
27
  import { cmExtensions$, diffMarkdown$, diffSourcePlugin, readOnlyDiff$ } from "./plugins/diff-source/index.js";
28
28
  import { markdownShortcutPlugin } from "./plugins/markdown-shortcut/index.js";
29
29
  import { BlockTypeSelect } from "./plugins/toolbar/components/BlockTypeSelect.js";
30
- import { BoldItalicUnderlineToggles } from "./plugins/toolbar/components/BoldItalicUnderlineToggles.js";
30
+ import { BoldItalicUnderlineToggles, StrikeThroughSupSubToggles } from "./plugins/toolbar/components/BoldItalicUnderlineToggles.js";
31
31
  import { ChangeAdmonitionType, admonitionLabelsMap } from "./plugins/toolbar/components/ChangeAdmonitionType.js";
32
32
  import { ChangeCodeMirrorLanguage } from "./plugins/toolbar/components/ChangeCodeMirrorLanguage.js";
33
33
  import { CodeToggle } from "./plugins/toolbar/components/CodeToggle.js";
@@ -58,6 +58,7 @@ import { makeHslTransparent } from "./utils/makeHslTransparent.js";
58
58
  import { uuidv4 } from "./utils/uuid4.js";
59
59
  import { voidEmitter } from "./utils/voidEmitter.js";
60
60
  import { RealmWithPlugins, realmPlugin } from "./RealmWithPlugins.js";
61
+ import { DEFAULT_FORMAT, IS_BOLD, IS_CODE, IS_HIGHLIGHT, IS_ITALIC, IS_STRIKETHROUGH, IS_SUBSCRIPT, IS_SUPERSCRIPT, IS_UNDERLINE } from "./FormatConstants.js";
61
62
  import { htmlTags, isMdastHTMLNode } from "./plugins/core/MdastHTMLNode.js";
62
63
  import { $createGenericHTMLNode, $isGenericHTMLNode, GenericHTMLNode, TYPE_NAME } from "./plugins/core/GenericHTMLNode.js";
63
64
  import { $createTableNode, $isTableNode, TableNode } from "./plugins/table/TableNode.js";
@@ -93,6 +94,7 @@ export {
93
94
  CodeToggle,
94
95
  ConditionalContents,
95
96
  CreateLink,
97
+ DEFAULT_FORMAT,
96
98
  DialogButton,
97
99
  DiffSourceToggleWrapper,
98
100
  DirectiveNode,
@@ -101,6 +103,14 @@ export {
101
103
  GenericJsxEditor,
102
104
  INSERT_IMAGE_COMMAND,
103
105
  IS_APPLE,
106
+ IS_BOLD,
107
+ IS_CODE,
108
+ IS_HIGHLIGHT,
109
+ IS_ITALIC,
110
+ IS_STRIKETHROUGH,
111
+ IS_SUBSCRIPT,
112
+ IS_SUPERSCRIPT,
113
+ IS_UNDERLINE,
104
114
  ImageNode,
105
115
  InsertAdmonition,
106
116
  InsertCodeBlock,
@@ -129,6 +139,7 @@ export {
129
139
  ShowSandpackInfo,
130
140
  SingleChoiceToggleGroup,
131
141
  SingleToggleGroup,
142
+ StrikeThroughSupSubToggles,
132
143
  TYPE_NAME,
133
144
  TableNode,
134
145
  ToggleSingleGroupWithItem,
@@ -3,7 +3,7 @@ import { useMdastNodeUpdater, NestedLexicalEditor } from "../plugins/core/Nested
3
3
  import { PropertyPopover } from "../plugins/core/PropertyPopover.js";
4
4
  import styles from "../styles/ui.module.css.js";
5
5
  const isExpressionValue = (value) => {
6
- if (typeof value === "object" && value !== null && "type" in value && value.type === "mdxJsxAttributeValueExpression" && "value" in value && typeof value.value === "string") {
6
+ if (value !== null && typeof value === "object" && "type" in value && "value" in value && typeof value.value === "string") {
7
7
  return true;
8
8
  }
9
9
  return false;
@@ -12,10 +12,10 @@ function commentFromMarkdown(_options) {
12
12
  exit: {
13
13
  comment(token) {
14
14
  const text = this.resume();
15
- if (_options == null ? void 0 : _options.ast) {
15
+ if (_options.ast) {
16
16
  this.enter(
17
17
  {
18
- // @ts-expect-error: hush.
18
+ // @ts-expect-error: not typing this
19
19
  type: "comment",
20
20
  value: "",
21
21
  commentValue: text.slice(0, -2)
@@ -0,0 +1,114 @@
1
+ import { splice } from "../../micromark-util-chunked/index.js";
2
+ import { classifyCharacter } from "../../micromark-util-classify-character/index.js";
3
+ import { resolveAll } from "../../micromark-util-resolve-all/index.js";
4
+ function gfmStrikethrough(options) {
5
+ const options_ = options || {};
6
+ let single = options_.singleTilde;
7
+ const tokenizer = {
8
+ tokenize: tokenizeStrikethrough,
9
+ resolveAll: resolveAllStrikethrough
10
+ };
11
+ if (single === null || single === void 0) {
12
+ single = true;
13
+ }
14
+ return {
15
+ text: {
16
+ [126]: tokenizer
17
+ },
18
+ insideSpan: {
19
+ null: [tokenizer]
20
+ },
21
+ attentionMarkers: {
22
+ null: [126]
23
+ }
24
+ };
25
+ function resolveAllStrikethrough(events, context) {
26
+ let index = -1;
27
+ while (++index < events.length) {
28
+ if (events[index][0] === "enter" && events[index][1].type === "strikethroughSequenceTemporary" && events[index][1]._close) {
29
+ let open = index;
30
+ while (open--) {
31
+ if (events[open][0] === "exit" && events[open][1].type === "strikethroughSequenceTemporary" && events[open][1]._open && // If the sizes are the same:
32
+ events[index][1].end.offset - events[index][1].start.offset === events[open][1].end.offset - events[open][1].start.offset) {
33
+ events[index][1].type = "strikethroughSequence";
34
+ events[open][1].type = "strikethroughSequence";
35
+ const strikethrough = {
36
+ type: "strikethrough",
37
+ start: Object.assign({}, events[open][1].start),
38
+ end: Object.assign({}, events[index][1].end)
39
+ };
40
+ const text = {
41
+ type: "strikethroughText",
42
+ start: Object.assign({}, events[open][1].end),
43
+ end: Object.assign({}, events[index][1].start)
44
+ };
45
+ const nextEvents = [
46
+ ["enter", strikethrough, context],
47
+ ["enter", events[open][1], context],
48
+ ["exit", events[open][1], context],
49
+ ["enter", text, context]
50
+ ];
51
+ const insideSpan = context.parser.constructs.insideSpan.null;
52
+ if (insideSpan) {
53
+ splice(
54
+ nextEvents,
55
+ nextEvents.length,
56
+ 0,
57
+ resolveAll(insideSpan, events.slice(open + 1, index), context)
58
+ );
59
+ }
60
+ splice(nextEvents, nextEvents.length, 0, [
61
+ ["exit", text, context],
62
+ ["enter", events[index][1], context],
63
+ ["exit", events[index][1], context],
64
+ ["exit", strikethrough, context]
65
+ ]);
66
+ splice(events, open - 1, index - open + 3, nextEvents);
67
+ index = open + nextEvents.length - 2;
68
+ break;
69
+ }
70
+ }
71
+ }
72
+ }
73
+ index = -1;
74
+ while (++index < events.length) {
75
+ if (events[index][1].type === "strikethroughSequenceTemporary") {
76
+ events[index][1].type = "data";
77
+ }
78
+ }
79
+ return events;
80
+ }
81
+ function tokenizeStrikethrough(effects, ok, nok) {
82
+ const previous = this.previous;
83
+ const events = this.events;
84
+ let size = 0;
85
+ return start;
86
+ function start(code) {
87
+ if (previous === 126 && events[events.length - 1][1].type !== "characterEscape") {
88
+ return nok(code);
89
+ }
90
+ effects.enter("strikethroughSequenceTemporary");
91
+ return more(code);
92
+ }
93
+ function more(code) {
94
+ const before = classifyCharacter(previous);
95
+ if (code === 126) {
96
+ if (size > 1)
97
+ return nok(code);
98
+ effects.consume(code);
99
+ size++;
100
+ return more;
101
+ }
102
+ if (size < 2 && !single)
103
+ return nok(code);
104
+ const token = effects.exit("strikethroughSequenceTemporary");
105
+ const after = classifyCharacter(code);
106
+ token._open = !after || after === 2 && Boolean(before);
107
+ token._close = !before || before === 2 && Boolean(after);
108
+ return ok(code);
109
+ }
110
+ }
111
+ }
112
+ export {
113
+ gfmStrikethrough
114
+ };
@@ -0,0 +1,29 @@
1
+ function splice(list, start, remove, items) {
2
+ const end = list.length;
3
+ let chunkStart = 0;
4
+ let parameters;
5
+ if (start < 0) {
6
+ start = -start > end ? 0 : end + start;
7
+ } else {
8
+ start = start > end ? end : start;
9
+ }
10
+ remove = remove > 0 ? remove : 0;
11
+ if (items.length < 1e4) {
12
+ parameters = Array.from(items);
13
+ parameters.unshift(start, remove);
14
+ list.splice(...parameters);
15
+ } else {
16
+ if (remove)
17
+ list.splice(start, remove);
18
+ while (chunkStart < items.length) {
19
+ parameters = items.slice(chunkStart, chunkStart + 1e4);
20
+ parameters.unshift(start, 0);
21
+ list.splice(...parameters);
22
+ chunkStart += 1e4;
23
+ start += 1e4;
24
+ }
25
+ }
26
+ }
27
+ export {
28
+ splice
29
+ };
@@ -0,0 +1,12 @@
1
+ import { markdownLineEndingOrSpace, unicodeWhitespace, unicodePunctuation } from "micromark-util-character";
2
+ function classifyCharacter(code) {
3
+ if (code === null || markdownLineEndingOrSpace(code) || unicodeWhitespace(code)) {
4
+ return 1;
5
+ }
6
+ if (unicodePunctuation(code)) {
7
+ return 2;
8
+ }
9
+ }
10
+ export {
11
+ classifyCharacter
12
+ };
@@ -0,0 +1,15 @@
1
+ function resolveAll(constructs, events, context) {
2
+ const called = [];
3
+ let index = -1;
4
+ while (++index < constructs.length) {
5
+ const resolve = constructs[index].resolveAll;
6
+ if (resolve && !called.includes(resolve)) {
7
+ events = resolve(events, context);
8
+ called.push(resolve);
9
+ }
10
+ }
11
+ return events;
12
+ }
13
+ export {
14
+ resolveAll
15
+ };
@@ -21,12 +21,12 @@ const insertCodeBlock$ = Signal((r) => {
21
21
  const appendCodeBlockEditorDescriptor$ = Appender(codeBlockEditorDescriptors$);
22
22
  const codeBlockPlugin = realmPlugin({
23
23
  update(realm, params) {
24
- realm.pub(defaultCodeBlockLanguage$, (params == null ? void 0 : params.defaultCodeBlockLanguage) || "");
24
+ realm.pub(defaultCodeBlockLanguage$, (params == null ? void 0 : params.defaultCodeBlockLanguage) ?? "");
25
25
  },
26
26
  init(realm, params) {
27
27
  realm.pubIn({
28
28
  [addActivePlugin$]: "codeblock",
29
- [codeBlockEditorDescriptors$]: (params == null ? void 0 : params.codeBlockEditorDescriptors) || [],
29
+ [codeBlockEditorDescriptors$]: (params == null ? void 0 : params.codeBlockEditorDescriptors) ?? [],
30
30
  [addImportVisitor$]: MdastCodeVisitor,
31
31
  [addLexicalNode$]: CodeBlockNode,
32
32
  [addExportVisitor$]: CodeBlockVisitor