@mdxeditor/editor 0.2.0 → 0.3.0

package/dist/index.d.ts

@@ -274,23 +274,6 @@ export declare type DefaultMdxOptionValues = {
  */
 export declare const defaultMdxOptionValues: DefaultMdxOptionValues;
 
-declare interface ExportLexicalTreeOptions {
-    root: RootNode;
-    visitors: LexicalVisitor[];
-    jsxComponentDescriptors: JsxComponentDescriptor[];
-}
-
-declare interface ExportMarkdownFromLexicalOptions extends ExportLexicalTreeOptions {
-    /**
-     * the markdown extensions to use
-     */
-    toMarkdownExtensions: Array<ToMarkdownExtension>;
-    /**
-     * The options to pass to `toMarkdown`
-     */
-    toMarkdownOptions: ToMarkdownOptions;
-}
-
 declare type ExtendedEditorConfig = EditorConfig & {
     theme: EditorConfig['theme'] & {
         nodeDecoratorComponents: NodeDecoratorComponents;
@@ -435,6 +418,24 @@ export declare interface JsxPropertyDescriptor {
     required?: boolean;
 }
 
+/**
+ * Configures how the lexical tree is converted to a mdast tree and then to markdown.
+ */
+export declare interface LexicalConvertOptions {
+    /**
+     * The visitors to use when processing the lexical tree
+     */
+    visitors?: LexicalVisitor[];
+    /**
+     * the markdown extensions to use
+     */
+    toMarkdownExtensions?: Array<ToMarkdownExtension>;
+    /**
+     * The options to pass to `toMarkdown`
+     */
+    toMarkdownOptions?: ToMarkdownOptions;
+}
+
 /**
  * Implement this interface in order to process mdast node(s) into a lexical tree.
  * This is part of the process that converts the editor contents to markdown.
@@ -661,13 +662,14 @@ export declare interface MDXEditorProps {
      */
     markdownParseOptions?: Partial<MarkdownParseOptions>;
     /**
-     * The {@link https://lexical.dev/ Lexical nodes} used by the editor.
+     * The {@link https://lexical.dev/ | Lexical nodes} used by the editor.
      */
     lexicalNodes?: Klass<LexicalNode>[];
     /**
      * The options used when converting the lexical tree to markdown.
+     * @see the {@link LexicalConvertOptions} interface for more details.
      */
-    lexicalConvertOptions?: Partial<ExportMarkdownFromLexicalOptions>;
+    lexicalConvertOptions?: LexicalConvertOptions;
     /**
      * The supported code block languages.
      */
@@ -683,15 +685,15 @@ declare interface NodeDecoratorComponents {
 }
 
 /**
- * The configuration for the available sandpack presets
+ * The configuration for the available sandpack presets.
  */
 export declare interface SandpackConfig {
     /**
-     * The name of the default preset that will be used if no meta (other than live) is set
+     * The name of the default preset that will be used if no meta (other than live) is set.
      */
     defaultPreset: string;
     /**
-     * The list of sandpack presets that can be used
+     * The list of sandpack presets that can be used.
      */
     presets: Array<SandpackPreset>;
 }
@@ -737,11 +739,11 @@ export declare class SandpackNode extends DecoratorNode<JSX.Element> {
  */
 export declare interface SandpackPreset {
     /**
-     * The name of the preset - use this to reference the preset from the defaultPreset field
+     * The name of the preset - use this to reference the preset from the defaultPreset field.
      */
     name: string;
     /**
-     * The label of th preset, displayed in the sandpack button dropdown
+     * The label of the preset, displayed in the sandpack button dropdown.
      */
     label: string;
     /**
@@ -757,11 +759,11 @@ export declare interface SandpackPreset {
      */
     sandpackTheme: SandpackProviderProps['theme'];
     /**
-     * The name of the file that will be created in the sandbox. e.g. "/App.js"
+     * The name of the file that will be created in the sandbox. e.g. "/App.js".
      */
     snippetFileName: string;
     /**
-     * The dependencies that will be added to the sandbox, just like in package.json
+     * The dependencies that will be added to the sandbox, just like in package.json.
      */
     dependencies?: Record<string, string>;
     /**
@@ -770,7 +772,7 @@ export declare interface SandpackPreset {
      */
     files?: Record<string, string>;
     /**
-     * The language used in the editable snippet. e.g. "jsx", "tsx", etc
+     * The language used in the editable snippet. e.g. "jsx", "tsx", etc.
      */
     snippetLanguage?: string;
     /**

package/dist/index.js

@@ -17,17 +17,16 @@ import { ElementNode, $createParagraphNode, $applyNodeReplacement, DecoratorNode
 import { AdmonitionKind } from "lexical";
 import * as React from "react";
 import React__default, { createContext, forwardRef, useMemo, useImperativeHandle, createElement, useCallback, useContext, useState, useEffect } from "react";
-import { directiveToMarkdown, directiveFromMarkdown } from "mdast-util-directive";
-import { frontmatterToMarkdown, frontmatterFromMarkdown } from "mdast-util-frontmatter";
-import { gfmTableToMarkdown, gfmTableFromMarkdown } from "mdast-util-gfm-table";
-import { mdxToMarkdown, mdxFromMarkdown } from "mdast-util-mdx";
-import { toMarkdown } from "mdast-util-to-markdown";
 import { CodeNode } from "@lexical/code";
 import { $isLinkNode, LinkNode, $createLinkNode, TOGGLE_LINK_COMMAND } from "@lexical/link";
 import { $isListNode, $isListItemNode, ListNode, ListItemNode, $createListNode, $createListItemNode, INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND, REMOVE_LIST_COMMAND, $getListDepth } from "@lexical/list";
 import { $isHorizontalRuleNode, HorizontalRuleNode, $createHorizontalRuleNode, INSERT_HORIZONTAL_RULE_COMMAND } from "@lexical/react/LexicalHorizontalRuleNode";
 import { $isHeadingNode, $isQuoteNode, HeadingNode, QuoteNode, $createHeadingNode, $createQuoteNode } from "@lexical/rich-text";
+import { directiveToMarkdown, directiveFromMarkdown } from "mdast-util-directive";
 import { fromMarkdown } from "mdast-util-from-markdown";
+import { frontmatterToMarkdown, frontmatterFromMarkdown } from "mdast-util-frontmatter";
+import { gfmTableToMarkdown, gfmTableFromMarkdown } from "mdast-util-gfm-table";
+import { mdxToMarkdown, mdxFromMarkdown } from "mdast-util-mdx";
 import { directive } from "micromark-extension-directive";
 import { frontmatter } from "micromark-extension-frontmatter";
 import { gfmTable } from "micromark-extension-gfm-table";
@@ -36,6 +35,7 @@ import { addClassNamesToElement, $insertNodeToNearestRoot, $findMatchingParent,
 import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
 import { $setBlocksType, $isAtNodeEnd } from "@lexical/selection";
 import { createEmptyHistoryState, HistoryPlugin } from "@lexical/react/LexicalHistoryPlugin";
+import { toMarkdown } from "mdast-util-to-markdown";
 import * as RadixPopover from "@radix-ui/react-popover";
 import * as Tooltip from "@radix-ui/react-tooltip";
 import { useCombobox } from "downshift";
@@ -391,21 +391,23 @@ function $createImageNode(options) {
 function $isImageNode(node) {
   return node instanceof ImageNode;
 }
-const bold = "_bold_1xdbx_1";
-const italic = "_italic_1xdbx_5";
-const underline = "_underline_1xdbx_9";
-const strikethrough = "_strikethrough_1xdbx_25";
-const underlineStrikethrough = "_underlineStrikethrough_1xdbx_29";
-const subscript = "_subscript_1xdbx_33";
-const superscript = "_superscript_1xdbx_38";
-const code = "_code_1xdbx_43";
-const nestedListItem$1 = "_nestedListItem_1xdbx_50";
-const admonitionDanger = "_admonitionDanger_1xdbx_54";
-const admonitionInfo = "_admonitionInfo_1xdbx_54";
-const admonitionNote = "_admonitionNote_1xdbx_54";
-const admonitionTip = "_admonitionTip_1xdbx_54";
-const admonitionCaution = "_admonitionCaution_1xdbx_54";
+const darkTheme = "_dark-theme_13nbk_1";
+const bold = "_bold_13nbk_10";
+const italic = "_italic_13nbk_14";
+const underline = "_underline_13nbk_18";
+const strikethrough = "_strikethrough_13nbk_34";
+const underlineStrikethrough = "_underlineStrikethrough_13nbk_38";
+const subscript = "_subscript_13nbk_42";
+const superscript = "_superscript_13nbk_47";
+const code = "_code_13nbk_52";
+const nestedListItem$1 = "_nestedListItem_13nbk_59";
+const admonitionDanger = "_admonitionDanger_13nbk_63";
+const admonitionInfo = "_admonitionInfo_13nbk_63";
+const admonitionNote = "_admonitionNote_13nbk_63";
+const admonitionTip = "_admonitionTip_13nbk_63";
+const admonitionCaution = "_admonitionCaution_13nbk_63";
 const styles$1 = {
+  darkTheme,
   bold,
   italic,
   underline,
@@ -421,6 +423,115 @@ const styles$1 = {
   admonitionTip,
   admonitionCaution
 };
+const editorRoot = "_editorRoot_1x7ym_47";
+const editorWrapper = "_editorWrapper_1x7ym_141";
+const nestedListItem = "_nestedListItem_1x7ym_145";
+const toolbarRoot = "_toolbarRoot_1x7ym_149";
+const toolbarModeSwitch = "_toolbarModeSwitch_1x7ym_170";
+const toolbarToggleItem = "_toolbarToggleItem_1x7ym_179";
+const toolbarGroupOfGroups = "_toolbarGroupOfGroups_1x7ym_189";
+const toolbarToggleSingleGroup = "_toolbarToggleSingleGroup_1x7ym_193";
+const toolbarButton = "_toolbarButton_1x7ym_207";
+const toolbarNodeKindSelectContainer = "_toolbarNodeKindSelectContainer_1x7ym_236";
+const toolbarButtonDropdownContainer = "_toolbarButtonDropdownContainer_1x7ym_237";
+const toolbarCodeBlockLanguageSelectContent = "_toolbarCodeBlockLanguageSelectContent_1x7ym_238";
+const toolbarNodeKindSelectTrigger = "_toolbarNodeKindSelectTrigger_1x7ym_252";
+const toolbarButtonSelectTrigger = "_toolbarButtonSelectTrigger_1x7ym_253";
+const toolbarCodeBlockLanguageSelectTrigger = "_toolbarCodeBlockLanguageSelectTrigger_1x7ym_286";
+const toolbarNodeKindSelectItem = "_toolbarNodeKindSelectItem_1x7ym_292";
+const toolbarNodeKindSelectDropdownArrow = "_toolbarNodeKindSelectDropdownArrow_1x7ym_315";
+const contentEditable = "_contentEditable_1x7ym_319";
+const sandpackWrapper = "_sandpackWrapper_1x7ym_327";
+const frontmatterWrapper = "_frontmatterWrapper_1x7ym_331";
+const frontmatterToggleButton = "_frontmatterToggleButton_1x7ym_341";
+const frontmatterEditorTable = "_frontmatterEditorTable_1x7ym_349";
+const iconButton = "_iconButton_1x7ym_367";
+const frontmatterInput = "_frontmatterInput_1x7ym_373";
+const primaryButton = "_primaryButton_1x7ym_388";
+const linkDialogEditForm = "_linkDialogEditForm_1x7ym_398";
+const linkDialogInputContainer = "_linkDialogInputContainer_1x7ym_404";
+const linkDialogInputWrapper = "_linkDialogInputWrapper_1x7ym_410";
+const linkDialogInput = "_linkDialogInput_1x7ym_404";
+const linkDialogAutocompleteContainer = "_linkDialogAutocompleteContainer_1x7ym_440";
+const linkDialogAnchor = "_linkDialogAnchor_1x7ym_485";
+const linkDialogPopoverContent = "_linkDialogPopoverContent_1x7ym_499";
+const tableColumnEditorPopoverContent = "_tableColumnEditorPopoverContent_1x7ym_499";
+const dialogContent = "_dialogContent_1x7ym_499";
+const linkDialogPreviewAnchor = "_linkDialogPreviewAnchor_1x7ym_513";
+const tooltipContent = "_tooltipContent_1x7ym_535";
+const actionButton = "_actionButton_1x7ym_547";
+const primaryActionButton = "_primaryActionButton_1x7ym_553";
+const tableEditor = "_tableEditor_1x7ym_562";
+const toolCell = "_toolCell_1x7ym_573";
+const tableColumnEditorTrigger = "_tableColumnEditorTrigger_1x7ym_590";
+const tableRowEditorTrigger = "_tableRowEditorTrigger_1x7ym_590";
+const addRowButton = "_addRowButton_1x7ym_590";
+const addColumnButton = "_addColumnButton_1x7ym_590";
+const tableColumnEditorToolbar = "_tableColumnEditorToolbar_1x7ym_624";
+const toggleGroupRoot = "_toggleGroupRoot_1x7ym_636";
+const tableToolsColumn = "_tableToolsColumn_1x7ym_653";
+const leftAlignedCell = "_leftAlignedCell_1x7ym_661";
+const rightAlignedCell = "_rightAlignedCell_1x7ym_665";
+const centeredCell = "_centeredCell_1x7ym_669";
+const dialogOverlay = "_dialogOverlay_1x7ym_697";
+const overlayShow = "_overlayShow_1x7ym_1";
+const contentShow = "_contentShow_1x7ym_1";
+const styles = {
+  editorRoot,
+  editorWrapper,
+  nestedListItem,
+  toolbarRoot,
+  toolbarModeSwitch,
+  toolbarToggleItem,
+  toolbarGroupOfGroups,
+  toolbarToggleSingleGroup,
+  toolbarButton,
+  toolbarNodeKindSelectContainer,
+  toolbarButtonDropdownContainer,
+  toolbarCodeBlockLanguageSelectContent,
+  toolbarNodeKindSelectTrigger,
+  toolbarButtonSelectTrigger,
+  toolbarCodeBlockLanguageSelectTrigger,
+  toolbarNodeKindSelectItem,
+  toolbarNodeKindSelectDropdownArrow,
+  contentEditable,
+  sandpackWrapper,
+  frontmatterWrapper,
+  frontmatterToggleButton,
+  frontmatterEditorTable,
+  iconButton,
+  frontmatterInput,
+  primaryButton,
+  linkDialogEditForm,
+  linkDialogInputContainer,
+  linkDialogInputWrapper,
+  linkDialogInput,
+  linkDialogAutocompleteContainer,
+  linkDialogAnchor,
+  linkDialogPopoverContent,
+  tableColumnEditorPopoverContent,
+  dialogContent,
+  linkDialogPreviewAnchor,
+  tooltipContent,
+  actionButton,
+  primaryActionButton,
+  tableEditor,
+  toolCell,
+  tableColumnEditorTrigger,
+  tableRowEditorTrigger,
+  addRowButton,
+  addColumnButton,
+  tableColumnEditorToolbar,
+  toggleGroupRoot,
+  tableToolsColumn,
+  leftAlignedCell,
+  rightAlignedCell,
+  centeredCell,
+  dialogOverlay,
+  overlayShow,
+  contentShow
+};
+console.log(styles);
 const theme = {
   text: {
     bold: styles$1.bold,
@@ -786,7 +897,7 @@ class TableNode extends DecoratorNode {
       const row = table.children[rowIndex];
       const cells = row.children;
       const cellsClone = Array.from(cells);
-      const rowClone = { ...row, hildren: cellsClone };
+      const rowClone = { ...row, children: cellsClone };
       cellsClone.splice(colIndex, 1);
       table.children[rowIndex] = rowClone;
     }
@@ -912,10 +1023,13 @@ const LexicalQuoteVisitor = {
 };
 const AdmonitionVisitor = {
   testLexicalNode: $isAdmonitionNode,
-  visitLexicalNode: ({ lexicalNode, actions }) => {
-    actions.addAndStepInto("containerDirective", {
-      name: lexicalNode.getKind()
+  visitLexicalNode: ({ mdastParent, lexicalNode, actions }) => {
+    const admonition = actions.appendToParent(mdastParent, {
+      type: "containerDirective",
+      name: lexicalNode.getKind(),
+      children: [{ type: "paragraph", children: [] }]
     });
+    actions.visitChildren(lexicalNode, admonition.children[0]);
   }
 };
 const SandpackNodeVisitor = {
@@ -2925,114 +3039,6 @@ const SvgArrowDropDown$1 = (props) => /* @__PURE__ */ React.createElement("svg",
   maskType: "alpha"
 } }, /* @__PURE__ */ React.createElement("path", { d: "M0 0h24v24H0z" })), /* @__PURE__ */ React.createElement("g", { mask: "url(#a)" }, /* @__PURE__ */ React.createElement("path", { d: "m12 15-5-5h10l-5 5Z" })));
 const DropDownIcon = SvgArrowDropDown$1;
-const editorRoot = "_editorRoot_1bxeh_43";
-const editorWrapper = "_editorWrapper_1bxeh_121";
-const nestedListItem = "_nestedListItem_1bxeh_125";
-const toolbarRoot = "_toolbarRoot_1bxeh_129";
-const toolbarModeSwitch = "_toolbarModeSwitch_1bxeh_150";
-const toolbarToggleItem = "_toolbarToggleItem_1bxeh_159";
-const toolbarGroupOfGroups = "_toolbarGroupOfGroups_1bxeh_169";
-const toolbarToggleSingleGroup = "_toolbarToggleSingleGroup_1bxeh_173";
-const toolbarButton = "_toolbarButton_1bxeh_187";
-const toolbarNodeKindSelectContainer = "_toolbarNodeKindSelectContainer_1bxeh_216";
-const toolbarButtonDropdownContainer = "_toolbarButtonDropdownContainer_1bxeh_217";
-const toolbarCodeBlockLanguageSelectContent = "_toolbarCodeBlockLanguageSelectContent_1bxeh_218";
-const toolbarNodeKindSelectTrigger = "_toolbarNodeKindSelectTrigger_1bxeh_232";
-const toolbarButtonSelectTrigger = "_toolbarButtonSelectTrigger_1bxeh_233";
-const toolbarCodeBlockLanguageSelectTrigger = "_toolbarCodeBlockLanguageSelectTrigger_1bxeh_266";
-const toolbarNodeKindSelectItem = "_toolbarNodeKindSelectItem_1bxeh_272";
-const toolbarNodeKindSelectDropdownArrow = "_toolbarNodeKindSelectDropdownArrow_1bxeh_295";
-const contentEditable = "_contentEditable_1bxeh_299";
-const sandpackWrapper = "_sandpackWrapper_1bxeh_307";
-const frontmatterWrapper = "_frontmatterWrapper_1bxeh_311";
-const frontmatterToggleButton = "_frontmatterToggleButton_1bxeh_321";
-const frontmatterEditorTable = "_frontmatterEditorTable_1bxeh_329";
-const iconButton = "_iconButton_1bxeh_347";
-const frontmatterInput = "_frontmatterInput_1bxeh_353";
-const primaryButton = "_primaryButton_1bxeh_368";
-const linkDialogEditForm = "_linkDialogEditForm_1bxeh_378";
-const linkDialogInputContainer = "_linkDialogInputContainer_1bxeh_384";
-const linkDialogInputWrapper = "_linkDialogInputWrapper_1bxeh_390";
-const linkDialogInput = "_linkDialogInput_1bxeh_384";
-const linkDialogAutocompleteContainer = "_linkDialogAutocompleteContainer_1bxeh_420";
-const linkDialogAnchor = "_linkDialogAnchor_1bxeh_465";
-const linkDialogPopoverContent = "_linkDialogPopoverContent_1bxeh_479";
-const tableColumnEditorPopoverContent = "_tableColumnEditorPopoverContent_1bxeh_479";
-const dialogContent = "_dialogContent_1bxeh_479";
-const linkDialogPreviewAnchor = "_linkDialogPreviewAnchor_1bxeh_493";
-const tooltipContent = "_tooltipContent_1bxeh_515";
-const actionButton = "_actionButton_1bxeh_527";
-const primaryActionButton = "_primaryActionButton_1bxeh_533";
-const tableEditor = "_tableEditor_1bxeh_542";
-const toolCell = "_toolCell_1bxeh_553";
-const tableColumnEditorTrigger = "_tableColumnEditorTrigger_1bxeh_570";
-const tableRowEditorTrigger = "_tableRowEditorTrigger_1bxeh_570";
-const addRowButton = "_addRowButton_1bxeh_570";
-const addColumnButton = "_addColumnButton_1bxeh_570";
-const tableColumnEditorToolbar = "_tableColumnEditorToolbar_1bxeh_604";
-const toggleGroupRoot = "_toggleGroupRoot_1bxeh_616";
-const tableToolsColumn = "_tableToolsColumn_1bxeh_633";
-const leftAlignedCell = "_leftAlignedCell_1bxeh_641";
-const rightAlignedCell = "_rightAlignedCell_1bxeh_645";
-const centeredCell = "_centeredCell_1bxeh_649";
-const dialogOverlay = "_dialogOverlay_1bxeh_677";
-const overlayShow = "_overlayShow_1bxeh_1";
-const contentShow = "_contentShow_1bxeh_1";
-const styles = {
-  editorRoot,
-  editorWrapper,
-  nestedListItem,
-  toolbarRoot,
-  toolbarModeSwitch,
-  toolbarToggleItem,
-  toolbarGroupOfGroups,
-  toolbarToggleSingleGroup,
-  toolbarButton,
-  toolbarNodeKindSelectContainer,
-  toolbarButtonDropdownContainer,
-  toolbarCodeBlockLanguageSelectContent,
-  toolbarNodeKindSelectTrigger,
-  toolbarButtonSelectTrigger,
-  toolbarCodeBlockLanguageSelectTrigger,
-  toolbarNodeKindSelectItem,
-  toolbarNodeKindSelectDropdownArrow,
-  contentEditable,
-  sandpackWrapper,
-  frontmatterWrapper,
-  frontmatterToggleButton,
-  frontmatterEditorTable,
-  iconButton,
-  frontmatterInput,
-  primaryButton,
-  linkDialogEditForm,
-  linkDialogInputContainer,
-  linkDialogInputWrapper,
-  linkDialogInput,
-  linkDialogAutocompleteContainer,
-  linkDialogAnchor,
-  linkDialogPopoverContent,
-  tableColumnEditorPopoverContent,
-  dialogContent,
-  linkDialogPreviewAnchor,
-  tooltipContent,
-  actionButton,
-  primaryActionButton,
-  tableEditor,
-  toolCell,
-  tableColumnEditorTrigger,
-  tableRowEditorTrigger,
-  addRowButton,
-  addColumnButton,
-  tableColumnEditorToolbar,
-  toggleGroupRoot,
-  tableToolsColumn,
-  leftAlignedCell,
-  rightAlignedCell,
-  centeredCell,
-  dialogOverlay,
-  overlayShow,
-  contentShow
-};
 createCommand();
 const MAX_SUGGESTIONS$1 = 20;
 function LinkEditForm({ initialUrl, onSubmit, onCancel, linkAutocompleteSuggestions }) {
@@ -4062,7 +4068,7 @@ const TableIcon = SvgTable;
 const BlockTypeSelect = () => {
   const [currentBlockType] = useEmitterValues("currentBlockType");
   const applyBlockType = usePublisher("applyBlockType");
-  return /* @__PURE__ */ React__default.createElement(Select.Root, { value: currentBlockType || "", onValueChange: applyBlockType }, /* @__PURE__ */ React__default.createElement(SelectTrigger, { placeholder: "Block type" }), /* @__PURE__ */ React__default.createElement(SelectContent, null, /* @__PURE__ */ React__default.createElement(SelectItem, { value: "paragraph" }, "Paragraph"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "quote" }, "Quote"), /* @__PURE__ */ React__default.createElement(Select.Separator, null), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "h1" }, "Heading 1"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "h2" }, "Heading 2"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "h3" }, "Heading 3"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "h4" }, "Heading 4"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "h5" }, "Heading 5"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "h6" }, "Heading 6"), /* @__PURE__ */ React__default.createElement(Select.Separator, null), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "info" }, "Info")));
+  return /* @__PURE__ */ React__default.createElement(Select.Root, { value: currentBlockType || "", onValueChange: applyBlockType }, /* @__PURE__ */ React__default.createElement(SelectTrigger, { placeholder: "Block type" }), /* @__PURE__ */ React__default.createElement(SelectContent, null, /* @__PURE__ */ React__default.createElement(SelectItem, { value: "paragraph" }, "Paragraph"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "quote" }, "Quote"), /* @__PURE__ */ React__default.createElement(Select.Separator, null), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "h1" }, "Heading 1"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "h2" }, "Heading 2"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "h3" }, "Heading 3"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "h4" }, "Heading 4"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "h5" }, "Heading 5"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "h6" }, "Heading 6"), /* @__PURE__ */ React__default.createElement(Select.Separator, null), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "note" }, "Note"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "tip" }, "Tip"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "info" }, "Info"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "caution" }, "Caution"), /* @__PURE__ */ React__default.createElement(SelectItem, { value: "danger" }, "Danger")));
 };
 const SvgAddPhoto = (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("mask", { id: "mask0_343_38", style: {
   maskType: "alpha"