md-editor-lite 0.1.13 → 0.1.15

package/dist/index.mjs

@@ -1,36 +1,45 @@
 // src/components/EditorHeader.tsx
 import "./style.css";
+import { jsx, jsxs } from "react/jsx-runtime";
 function EditorHeader({
   mode,
   setMode,
   insertMarkdown
 }) {
-  return /* @__PURE__ */ React.createElement("header", { className: "editor-header" }, /* @__PURE__ */ React.createElement(EditorTab, { mode, setMode }), mode === "write" && /* @__PURE__ */ React.createElement(Toolbar, { insertMarkdown }));
+  return /* @__PURE__ */ jsxs("header", { className: "editor-header", children: [
+    /* @__PURE__ */ jsx(EditorTab, { mode, setMode }),
+    mode === "write" && /* @__PURE__ */ jsx(Toolbar, { insertMarkdown })
+  ] });
 }
 
 // src/components/EditorTab.tsx
 import "./style.css";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function EditorTab({ mode, setMode }) {
-  return /* @__PURE__ */ React.createElement("div", { className: "editor-tab-container" }, /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      className: `editor-tab ${mode === "write" ? "editor-tab--active" : ""}`,
-      onClick: () => setMode("write")
-    },
-    "Write"
-  ), /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      className: `editor-tab ${mode === "preview" ? "editor-tab--active" : ""}`,
-      onClick: () => setMode("preview")
-    },
-    "Preview"
-  ));
+  return /* @__PURE__ */ jsxs2("div", { className: "editor-tab-container", children: [
+    /* @__PURE__ */ jsx2(
+      "div",
+      {
+        className: `editor-tab ${mode === "write" ? "editor-tab--active" : ""}`,
+        onClick: () => setMode("write"),
+        children: "Write"
+      }
+    ),
+    /* @__PURE__ */ jsx2(
+      "div",
+      {
+        className: `editor-tab ${mode === "preview" ? "editor-tab--active" : ""}`,
+        onClick: () => setMode("preview"),
+        children: "Preview"
+      }
+    )
+  ] });
 }
 
 // src/components/EditorTextarea.tsx
 import { forwardRef } from "react";
 import "./style.css";
+import { jsx as jsx3 } from "react/jsx-runtime";
 var EditorTextarea = forwardRef(({ value, placeholder, setValue, onImageUpload }, ref) => {
   const handleDrop = async (e) => {
     e.preventDefault();
@@ -45,7 +54,7 @@ var EditorTextarea = forwardRef(({ value, placeholder, setValue, onImageUpload }
 `);
     }
   };
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx3(
     "textarea",
     {
       ref,
@@ -93,6 +102,7 @@ function useMarkdownEditor({ value, setValue }) {
 
 // src/components/MarkdownEditor.tsx
 import "./style.css";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 function MarkdownEditor({
   value,
   onChange: setValue,
@@ -103,22 +113,25 @@ function MarkdownEditor({
     setValue
   });
   const [mode, setMode] = useState("write");
-  return /* @__PURE__ */ React.createElement("div", { className: "editor" }, /* @__PURE__ */ React.createElement(
-    EditorHeader,
-    {
-      mode,
-      setMode,
-      insertMarkdown
-    }
-  ), mode === "write" ? /* @__PURE__ */ React.createElement(
-    EditorTextarea,
-    {
-      ref: textareaRef,
-      value,
-      setValue,
-      onImageUpload
-    }
-  ) : /* @__PURE__ */ React.createElement(Preview, { value }));
+  return /* @__PURE__ */ jsxs3("div", { className: "editor", children: [
+    /* @__PURE__ */ jsx4(
+      EditorHeader,
+      {
+        mode,
+        setMode,
+        insertMarkdown
+      }
+    ),
+    mode === "write" ? /* @__PURE__ */ jsx4(
+      EditorTextarea,
+      {
+        ref: textareaRef,
+        value,
+        setValue,
+        onImageUpload
+      }
+    ) : /* @__PURE__ */ jsx4(Preview, { value })
+  ] });
 }
 
 // src/utils/markdown.ts
@@ -199,8 +212,9 @@ function markdownToHtml(markdown) {
 
 // src/components/Preview.tsx
 import "./style.css";
+import { jsx as jsx5 } from "react/jsx-runtime";
 function Preview({ value }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx5(
     "div",
     {
       className: "preview",
@@ -248,20 +262,25 @@ var listOptions = [
 
 // src/components/Toolbar.tsx
 import "./style.css";
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
 function Toolbar({ insertMarkdown }) {
-  return /* @__PURE__ */ React.createElement("menu", { className: "toolbar-menu" }, TOOLBAR_BUTTONS.map(({ key, before, after, Icon }) => /* @__PURE__ */ React.createElement(
-    "button",
-    {
-      key,
-      className: "toolbar-button",
-      onClick: () => insertMarkdown(before, after)
-    },
-    /* @__PURE__ */ React.createElement(Icon, { size: 18 })
-  )), /* @__PURE__ */ React.createElement(ToolbarDropdownHeading, { insertMarkdown }), /* @__PURE__ */ React.createElement(ToolbarDropdownList, { insertMarkdown }));
+  return /* @__PURE__ */ jsxs4("menu", { className: "toolbar-menu", children: [
+    TOOLBAR_BUTTONS.map(({ key, before, after, Icon }) => /* @__PURE__ */ jsx6(
+      "button",
+      {
+        className: "toolbar-button",
+        onClick: () => insertMarkdown(before, after),
+        children: /* @__PURE__ */ jsx6(Icon, { size: 18 })
+      },
+      key
+    )),
+    /* @__PURE__ */ jsx6(ToolbarDropdownHeading, { insertMarkdown }),
+    /* @__PURE__ */ jsx6(ToolbarDropdownList, { insertMarkdown })
+  ] });
 }
 
 // src/components/IconDropdown.tsx
-import React2 from "react";
+import React from "react";
 
 // src/utils/cx.ts
 function cx(...classes) {
@@ -270,6 +289,7 @@ function cx(...classes) {
 
 // src/components/IconDropdown.tsx
 import "./style.css";
+import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
 function IconDropdown({
   className,
   disabled,
@@ -278,12 +298,12 @@ function IconDropdown({
   triggerIcon,
   onChange
 }) {
-  const [isOpen, setIsOpen] = React2.useState(false);
-  const dropdownRef = React2.useRef(null);
+  const [isOpen, setIsOpen] = React.useState(false);
+  const dropdownRef = React.useRef(null);
   const toggle = () => {
     if (!disabled) setIsOpen((prev) => !prev);
   };
-  React2.useEffect(() => {
+  React.useEffect(() => {
     const handleClickOutside = (e) => {
       if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
         setIsOpen(false);
@@ -292,46 +312,52 @@ function IconDropdown({
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  return /* @__PURE__ */ React2.createElement("div", { ref: dropdownRef, className: cx("md-dropdown", className) }, /* @__PURE__ */ React2.createElement(
-    "button",
-    {
-      type: "button",
-      onClick: toggle,
-      disabled,
-      className: cx(
-        "md-dropdown__trigger",
-        disabled && "md-dropdown__trigger--disabled"
-      )
-    },
-    triggerIcon
-  ), isOpen && /* @__PURE__ */ React2.createElement("ul", { className: "md-dropdown__menu" }, options.map((option) => /* @__PURE__ */ React2.createElement(
-    "li",
-    {
-      key: option.value,
-      className: cx(
-        "md-dropdown__item",
-        selected && "md-dropdown__item--selected"
-      ),
-      onClick: () => {
-        onChange(option.value);
-        setIsOpen(false);
+  return /* @__PURE__ */ jsxs5("div", { ref: dropdownRef, className: cx("md-dropdown", className), children: [
+    /* @__PURE__ */ jsx7(
+      "button",
+      {
+        type: "button",
+        onClick: toggle,
+        disabled,
+        className: cx(
+          "md-dropdown__trigger",
+          disabled && "md-dropdown__trigger--disabled"
+        ),
+        children: triggerIcon
       }
-    },
-    option.Icon && /* @__PURE__ */ React2.createElement("span", { className: "md-dropdown__icon" }, /* @__PURE__ */ React2.createElement(option.Icon, null)),
-    option.label && /* @__PURE__ */ React2.createElement("span", { className: "md-dropdown__label" }, option.label)
-  ))));
+    ),
+    isOpen && /* @__PURE__ */ jsx7("ul", { className: "md-dropdown__menu", children: options.map((option) => /* @__PURE__ */ jsxs5(
+      "li",
+      {
+        className: cx(
+          "md-dropdown__item",
+          selected && "md-dropdown__item--selected"
+        ),
+        onClick: () => {
+          onChange(option.value);
+          setIsOpen(false);
+        },
+        children: [
+          option.Icon && /* @__PURE__ */ jsx7("span", { className: "md-dropdown__icon", children: /* @__PURE__ */ jsx7(option.Icon, {}) }),
+          option.label && /* @__PURE__ */ jsx7("span", { className: "md-dropdown__label", children: option.label })
+        ]
+      },
+      option.value
+    )) })
+  ] });
 }
 
 // src/components/ToolbarDropdown.tsx
 import { Heading1Icon as Heading1Icon2, ListIcon as ListIcon2 } from "lucide-react";
+import { jsx as jsx8 } from "react/jsx-runtime";
 function ToolbarDropdownHeading({
   insertMarkdown
 }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx8(
     IconDropdown,
     {
       options: headingOptions,
-      triggerIcon: /* @__PURE__ */ React.createElement(Heading1Icon2, null),
+      triggerIcon: /* @__PURE__ */ jsx8(Heading1Icon2, {}),
       onChange: (value) => {
         const option = headingOptions.find((o) => o.value === value);
         if (option) insertMarkdown(option.before);
@@ -340,11 +366,11 @@ function ToolbarDropdownHeading({
   );
 }
 function ToolbarDropdownList({ insertMarkdown }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx8(
     IconDropdown,
     {
       options: listOptions,
-      triggerIcon: /* @__PURE__ */ React.createElement(ListIcon2, null),
+      triggerIcon: /* @__PURE__ */ jsx8(ListIcon2, {}),
       onChange: (value) => {
         const option = listOptions.find((o) => o.value === value);
         if (option) insertMarkdown(option.before);

package/package.json

@@ -10,7 +10,7 @@
     "lightweight",
     "textarea"
   ],
-  "version": "0.1.13",
+  "version": "0.1.15",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",

package/dist/index.js

@@ -1,405 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/index.ts
-var index_exports = {};
-__export(index_exports, {
-  EditorHeader: () => EditorHeader,
-  EditorTab: () => EditorTab,
-  EditorTextarea: () => EditorTextarea,
-  MarkdownEditor: () => MarkdownEditor,
-  Preview: () => Preview,
-  TOOLBAR_BUTTONS: () => TOOLBAR_BUTTONS,
-  Toolbar: () => Toolbar,
-  ToolbarDropdownHeading: () => ToolbarDropdownHeading,
-  ToolbarDropdownList: () => ToolbarDropdownList,
-  cx: () => cx,
-  headingOptions: () => headingOptions,
-  listOptions: () => listOptions,
-  markdownToHtml: () => markdownToHtml,
-  useMarkdownEditor: () => useMarkdownEditor
-});
-module.exports = __toCommonJS(index_exports);
-
-// src/components/EditorHeader.tsx
-var import_style = require("./style.css");
-function EditorHeader({
-  mode,
-  setMode,
-  insertMarkdown
-}) {
-  return /* @__PURE__ */ React.createElement("header", { className: "editor-header" }, /* @__PURE__ */ React.createElement(EditorTab, { mode, setMode }), mode === "write" && /* @__PURE__ */ React.createElement(Toolbar, { insertMarkdown }));
-}
-
-// src/components/EditorTab.tsx
-var import_style2 = require("./style.css");
-function EditorTab({ mode, setMode }) {
-  return /* @__PURE__ */ React.createElement("div", { className: "editor-tab-container" }, /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      className: `editor-tab ${mode === "write" ? "editor-tab--active" : ""}`,
-      onClick: () => setMode("write")
-    },
-    "Write"
-  ), /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      className: `editor-tab ${mode === "preview" ? "editor-tab--active" : ""}`,
-      onClick: () => setMode("preview")
-    },
-    "Preview"
-  ));
-}
-
-// src/components/EditorTextarea.tsx
-var import_react = require("react");
-var import_style3 = require("./style.css");
-var EditorTextarea = (0, import_react.forwardRef)(({ value, placeholder, setValue, onImageUpload }, ref) => {
-  const handleDrop = async (e) => {
-    e.preventDefault();
-    if (!onImageUpload) return;
-    const files = Array.from(e.dataTransfer.files).filter(
-      (file) => file.type.startsWith("image/")
-    );
-    for (const file of files) {
-      const url = await onImageUpload(file);
-      setValue(value + `
-![${file.name}](${url})
-`);
-    }
-  };
-  return /* @__PURE__ */ React.createElement(
-    "textarea",
-    {
-      ref,
-      value,
-      onChange: (e) => setValue(e.target.value),
-      onDragOver: (e) => e.preventDefault(),
-      onDrop: handleDrop,
-      placeholder,
-      className: "editor-textarea"
-    }
-  );
-});
-
-// src/components/MarkdownEditor.tsx
-var import_react3 = require("react");
-
-// src/hooks/useMarkdownEditor.ts
-var import_react2 = require("react");
-function useMarkdownEditor({ value, setValue }) {
-  const textareaRef = (0, import_react2.useRef)(null);
-  const insertMarkdown = (0, import_react2.useCallback)(
-    (before, after = "") => {
-      const textarea = textareaRef.current;
-      if (!textarea) return;
-      const start = textarea.selectionStart;
-      const end = textarea.selectionEnd;
-      const selected = value.slice(start, end);
-      const replaced = before + (selected || "") + after;
-      setValue(value.slice(0, start) + replaced + value.slice(end));
-      requestAnimationFrame(() => {
-        if (!textareaRef.current) return;
-        const next = start + replaced.length;
-        textareaRef.current.focus();
-        textareaRef.current.selectionStart = next;
-        textareaRef.current.selectionEnd = next;
-      });
-    },
-    [value, setValue]
-  );
-  return {
-    textareaRef,
-    insertMarkdown
-  };
-}
-
-// src/components/MarkdownEditor.tsx
-var import_style4 = require("./style.css");
-function MarkdownEditor({
-  value,
-  onChange: setValue,
-  onImageUpload
-}) {
-  const { textareaRef, insertMarkdown } = useMarkdownEditor({
-    value,
-    setValue
-  });
-  const [mode, setMode] = (0, import_react3.useState)("write");
-  return /* @__PURE__ */ React.createElement("div", { className: "editor" }, /* @__PURE__ */ React.createElement(
-    EditorHeader,
-    {
-      mode,
-      setMode,
-      insertMarkdown
-    }
-  ), mode === "write" ? /* @__PURE__ */ React.createElement(
-    EditorTextarea,
-    {
-      ref: textareaRef,
-      value,
-      setValue,
-      onImageUpload
-    }
-  ) : /* @__PURE__ */ React.createElement(Preview, { value }));
-}
-
-// src/utils/markdown.ts
-function parseBold(text) {
-  return text.replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>");
-}
-function parseItalic(text) {
-  return text.replace(/(?<!\*)\*(?!\*)(.+?)(?<!\*)\*(?!\*)/g, "<em>$1</em>");
-}
-function parseInlineCode(text) {
-  return text.replace(/`(.+?)`/g, "<code>$1</code>");
-}
-function parseBlockquote(text) {
-  return text.replace(/^> (.+)$/gm, "<blockquote>$1</blockquote>");
-}
-function parseStrikethrough(text) {
-  return text.replace(/~~(.+?)~~/g, "<del>$1</del>");
-}
-function parseUnderline(text) {
-  return text.replace(/__(.+?)__/g, "<u>$1</u>");
-}
-function parseHr(text) {
-  return text.replace(/^---$/gm, "<hr />");
-}
-function parseImages(text) {
-  return text.replace(
-    /!\[(.*?)\]\(([^)]*?)\)/g,
-    (_, alt, url) => `<img src="${url}" alt="${alt || ""}" />`
-  );
-}
-function parseLinks(text) {
-  return text.replace(/\[(.+?)\]\((.+?)\)/g, '<a href="$2">$1</a>');
-}
-function parseHeadings(text) {
-  return text.replace(/^# (.+)$/gm, "<h1>$1</h1>").replace(/^## (.+)$/gm, "<h2>$1</h2>").replace(/^### (.+)$/gm, "<h3>$1</h3>");
-}
-function parseUnorderedList(text) {
-  return text.replace(
-    /(^|\r?\n)((?:\s*- .+(?:\r?\n|$))+)/g,
-    (_, prefix, block) => {
-      const items = block.trim().split(/\r?\n/).map((line) => line.replace(/^\s*- /, "").trim()).filter(Boolean).map((item) => `<li>${item}</li>`).join("");
-      return `${prefix}<ul>${items}</ul>`;
-    }
-  );
-}
-function parseOrderedList(text) {
-  return text.replace(
-    /(^|\r?\n)((?:\d+\. .+(?:\r?\n|$))+)/g,
-    (_, prefix, block) => {
-      const items = block.trim().split(/\r?\n/).map((line) => line.replace(/^\d+\. /, "").trim()).filter(Boolean).map((item) => `<li>${item}</li>`).join("");
-      return `${prefix}<ol>${items}</ol>`;
-    }
-  );
-}
-function parseLineBreaks(text) {
-  return text.replace(
-    /(?<!<\/ul>|<\/ol>|<\/li>|<\/h1>|<\/h2>|<\/h3>)\n/g,
-    "<br/>"
-  );
-}
-function markdownToHtml(markdown) {
-  let html = markdown;
-  html = parseHr(html);
-  html = parseHeadings(html);
-  html = parseBlockquote(html);
-  html = parseUnorderedList(html);
-  html = parseOrderedList(html);
-  html = parseBold(html);
-  html = parseUnderline(html);
-  html = parseStrikethrough(html);
-  html = parseItalic(html);
-  html = parseInlineCode(html);
-  html = parseImages(html);
-  html = parseLinks(html);
-  html = parseLineBreaks(html);
-  return html;
-}
-
-// src/components/Preview.tsx
-var import_style5 = require("./style.css");
-function Preview({ value }) {
-  return /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      className: "preview",
-      dangerouslySetInnerHTML: { __html: markdownToHtml(value) },
-      style: { listStyle: "decimal" }
-    }
-  );
-}
-
-// src/constants/toolbar.ts
-var import_lucide_react = require("lucide-react");
-var TOOLBAR_BUTTONS = [
-  { key: "bold", before: "**", after: "**", Icon: import_lucide_react.BoldIcon },
-  { key: "italic", before: "*", after: "*", Icon: import_lucide_react.ItalicIcon },
-  { key: "code", before: "`", after: "`", Icon: import_lucide_react.CodeIcon },
-  { key: "blockquote", before: "> ", after: "", Icon: import_lucide_react.QuoteIcon },
-  { key: "strikethrough", before: "~~", after: "~~", Icon: import_lucide_react.StrikethroughIcon },
-  { key: "underline", before: "__", after: "__", Icon: import_lucide_react.UnderlineIcon },
-  { key: "horizontal rule", before: "\n---\n", after: "", Icon: import_lucide_react.ListEndIcon },
-  { key: "link", before: "[", after: "]()", Icon: import_lucide_react.LinkIcon }
-];
-var headingOptions = [
-  { value: "h1", Icon: import_lucide_react.Heading1Icon, before: "# " },
-  { value: "h2", Icon: import_lucide_react.Heading2Icon, before: "## " },
-  { value: "h3", Icon: import_lucide_react.Heading3Icon, before: "### " }
-];
-var listOptions = [
-  { value: "unordered list", Icon: import_lucide_react.ListIcon, before: "- " },
-  { value: "ordered list", Icon: import_lucide_react.ListOrderedIcon, before: "1. " }
-];
-
-// src/components/Toolbar.tsx
-var import_style6 = require("./style.css");
-function Toolbar({ insertMarkdown }) {
-  return /* @__PURE__ */ React.createElement("menu", { className: "toolbar-menu" }, TOOLBAR_BUTTONS.map(({ key, before, after, Icon }) => /* @__PURE__ */ React.createElement(
-    "button",
-    {
-      key,
-      className: "toolbar-button",
-      onClick: () => insertMarkdown(before, after)
-    },
-    /* @__PURE__ */ React.createElement(Icon, { size: 18 })
-  )), /* @__PURE__ */ React.createElement(ToolbarDropdownHeading, { insertMarkdown }), /* @__PURE__ */ React.createElement(ToolbarDropdownList, { insertMarkdown }));
-}
-
-// src/components/IconDropdown.tsx
-var import_react4 = __toESM(require("react"));
-
-// src/utils/cx.ts
-function cx(...classes) {
-  return classes.filter(Boolean).join(" ");
-}
-
-// src/components/IconDropdown.tsx
-var import_style7 = require("./style.css");
-function IconDropdown({
-  className,
-  disabled,
-  options,
-  selected,
-  triggerIcon,
-  onChange
-}) {
-  const [isOpen, setIsOpen] = import_react4.default.useState(false);
-  const dropdownRef = import_react4.default.useRef(null);
-  const toggle = () => {
-    if (!disabled) setIsOpen((prev) => !prev);
-  };
-  import_react4.default.useEffect(() => {
-    const handleClickOutside = (e) => {
-      if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
-        setIsOpen(false);
-      }
-    };
-    document.addEventListener("mousedown", handleClickOutside);
-    return () => document.removeEventListener("mousedown", handleClickOutside);
-  }, []);
-  return /* @__PURE__ */ import_react4.default.createElement("div", { ref: dropdownRef, className: cx("md-dropdown", className) }, /* @__PURE__ */ import_react4.default.createElement(
-    "button",
-    {
-      type: "button",
-      onClick: toggle,
-      disabled,
-      className: cx(
-        "md-dropdown__trigger",
-        disabled && "md-dropdown__trigger--disabled"
-      )
-    },
-    triggerIcon
-  ), isOpen && /* @__PURE__ */ import_react4.default.createElement("ul", { className: "md-dropdown__menu" }, options.map((option) => /* @__PURE__ */ import_react4.default.createElement(
-    "li",
-    {
-      key: option.value,
-      className: cx(
-        "md-dropdown__item",
-        selected && "md-dropdown__item--selected"
-      ),
-      onClick: () => {
-        onChange(option.value);
-        setIsOpen(false);
-      }
-    },
-    option.Icon && /* @__PURE__ */ import_react4.default.createElement("span", { className: "md-dropdown__icon" }, /* @__PURE__ */ import_react4.default.createElement(option.Icon, null)),
-    option.label && /* @__PURE__ */ import_react4.default.createElement("span", { className: "md-dropdown__label" }, option.label)
-  ))));
-}
-
-// src/components/ToolbarDropdown.tsx
-var import_lucide_react2 = require("lucide-react");
-function ToolbarDropdownHeading({
-  insertMarkdown
-}) {
-  return /* @__PURE__ */ React.createElement(
-    IconDropdown,
-    {
-      options: headingOptions,
-      triggerIcon: /* @__PURE__ */ React.createElement(import_lucide_react2.Heading1Icon, null),
-      onChange: (value) => {
-        const option = headingOptions.find((o) => o.value === value);
-        if (option) insertMarkdown(option.before);
-      }
-    }
-  );
-}
-function ToolbarDropdownList({ insertMarkdown }) {
-  return /* @__PURE__ */ React.createElement(
-    IconDropdown,
-    {
-      options: listOptions,
-      triggerIcon: /* @__PURE__ */ React.createElement(import_lucide_react2.ListIcon, null),
-      onChange: (value) => {
-        const option = listOptions.find((o) => o.value === value);
-        if (option) insertMarkdown(option.before);
-      }
-    }
-  );
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  EditorHeader,
-  EditorTab,
-  EditorTextarea,
-  MarkdownEditor,
-  Preview,
-  TOOLBAR_BUTTONS,
-  Toolbar,
-  ToolbarDropdownHeading,
-  ToolbarDropdownList,
-  cx,
-  headingOptions,
-  listOptions,
-  markdownToHtml,
-  useMarkdownEditor
-});