camox 0.43.0 → 0.45.0

package/dist/core/components/lexical/SidebarLexicalEditor.js

@@ -2,16 +2,17 @@ import { FORMAT_FLAGS } from "../../lib/modifierFormats.js";
 import { isValidTextLinkTarget } from "../../lib/textLinks.js";
 import { lexicalStateToMarkdown } from "../../lib/lexicalState.js";
 import { INPUT_BASE_STYLES, INPUT_FOCUS_STYLES, cn } from "../../../lib/utils.js";
-import { TextLinkPopover } from "./TextLinkPopover.js";
 import { $selectionHasHighlight, $toggleHighlight } from "./HighlightNode.js";
 import { createEditorConfig, normalizeLexicalState } from "./editorConfig.js";
 import { InlineStylesPlugin } from "./InlineStylesPlugin.js";
+import { MaxLengthPlugin } from "./MaxLengthPlugin.js";
 import { selectTextLink } from "./selectTextLink.js";
+import { TextLinkPopover } from "./TextLinkPopover.js";
 import { c } from "react/compiler-runtime";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "@camox/ui/button";
-import { Bold, Highlighter, Italic, Underline } from "lucide-react";
+import { Bold, Highlighter, Italic, Strikethrough } from "lucide-react";
 import { FloatingToolbar } from "@camox/ui/floating-toolbar";
 import { Toggle } from "@camox/ui/toggle";
 import { $createLinkNode, TOGGLE_LINK_COMMAND } from "@lexical/link";
@@ -26,42 +27,34 @@ import { $createTextNode, $getSelection, $isRangeSelection, $setSelection, COMMA
 
 //#region src/core/components/lexical/SidebarLexicalEditor.tsx
 function EnterAsLineBreakHandler() {
-	const $ = c(4);
-	if ($[0] !== "b2abd53d41bcf7845fda084f34768059ff9a381fdb75359c9fd3fc0de4052372") {
-		for (let $i = 0; $i < 4; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "b2abd53d41bcf7845fda084f34768059ff9a381fdb75359c9fd3fc0de4052372";
-	}
+	const $ = c(3);
 	const [editor] = useLexicalComposerContext();
 	let t0;
 	let t1;
-	if ($[1] !== editor) {
+	if ($[0] !== editor) {
 		t0 = () => editor.registerCommand(KEY_ENTER_COMMAND, (event) => {
 			event?.preventDefault();
 			editor.dispatchCommand(INSERT_LINE_BREAK_COMMAND, false);
 			return true;
 		}, COMMAND_PRIORITY_LOW);
 		t1 = [editor];
-		$[1] = editor;
-		$[2] = t0;
-		$[3] = t1;
+		$[0] = editor;
+		$[1] = t0;
+		$[2] = t1;
 	} else {
-		t0 = $[2];
-		t1 = $[3];
+		t0 = $[1];
+		t1 = $[2];
 	}
 	React.useEffect(t0, t1);
 	return null;
 }
 function ExternalStateSync(t0) {
-	const $ = c(6);
-	if ($[0] !== "b2abd53d41bcf7845fda084f34768059ff9a381fdb75359c9fd3fc0de4052372") {
-		for (let $i = 0; $i < 6; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "b2abd53d41bcf7845fda084f34768059ff9a381fdb75359c9fd3fc0de4052372";
-	}
+	const $ = c(5);
 	const { value, isSyncingRef } = t0;
 	const [editor] = useLexicalComposerContext();
 	let t1;
 	let t2;
-	if ($[1] !== editor || $[2] !== isSyncingRef || $[3] !== value) {
+	if ($[0] !== editor || $[1] !== isSyncingRef || $[2] !== value) {
 		t1 = () => {
 			const root = editor.getRootElement();
 			if (root !== null && root === document.activeElement) return;
@@ -77,43 +70,39 @@ function ExternalStateSync(t0) {
 			value,
 			isSyncingRef
 		];
-		$[1] = editor;
-		$[2] = isSyncingRef;
-		$[3] = value;
-		$[4] = t1;
-		$[5] = t2;
+		$[0] = editor;
+		$[1] = isSyncingRef;
+		$[2] = value;
+		$[3] = t1;
+		$[4] = t2;
 	} else {
-		t1 = $[4];
-		t2 = $[5];
+		t1 = $[3];
+		t2 = $[4];
 	}
 	React.useEffect(t1, t2);
 	return null;
 }
 function SidebarFloatingTextToolbar() {
-	const $ = c(72);
-	if ($[0] !== "b2abd53d41bcf7845fda084f34768059ff9a381fdb75359c9fd3fc0de4052372") {
-		for (let $i = 0; $i < 72; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "b2abd53d41bcf7845fda084f34768059ff9a381fdb75359c9fd3fc0de4052372";
-	}
+	const $ = c(71);
 	const [editor] = useLexicalComposerContext();
 	const [open, setOpen] = React.useState(false);
 	const [selectedText, setSelectedText] = React.useState("");
 	const [linkTarget, setLinkTarget] = React.useState(null);
 	const [linkClickAnchor, setLinkClickAnchor] = React.useState(null);
 	let t0;
-	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
 		t0 = {
 			visible: false,
 			top: 0,
 			left: 0,
 			activeFormats: 0
 		};
-		$[1] = t0;
-	} else t0 = $[1];
+		$[0] = t0;
+	} else t0 = $[0];
 	const [toolbarState, setToolbarState] = React.useState(t0);
 	const lastSelectionRef = React.useRef(null);
 	let t1;
-	if ($[2] !== editor || $[3] !== open) {
+	if ($[1] !== editor || $[2] !== open) {
 		t1 = () => {
 			if (open) return;
 			const root = editor.getRootElement();
@@ -143,7 +132,7 @@ function SidebarFloatingTextToolbar() {
 				setSelectedText(selection.getTextContent());
 				if (selection.hasFormat("bold")) activeFormats = activeFormats | FORMAT_FLAGS.bold;
 				if (selection.hasFormat("italic")) activeFormats = activeFormats | FORMAT_FLAGS.italic;
-				if (selection.hasFormat("underline")) activeFormats = activeFormats | FORMAT_FLAGS.underline;
+				if (selection.hasFormat("strikethrough")) activeFormats = activeFormats | FORMAT_FLAGS.strikethrough;
 				if ($selectionHasHighlight()) activeFormats = activeFormats | FORMAT_FLAGS.highlight;
 				let node = selection.anchor.getNode();
 				while (node) {
@@ -163,14 +152,14 @@ function SidebarFloatingTextToolbar() {
 				activeFormats
 			});
 		};
-		$[2] = editor;
-		$[3] = open;
-		$[4] = t1;
-	} else t1 = $[4];
+		$[1] = editor;
+		$[2] = open;
+		$[3] = t1;
+	} else t1 = $[3];
 	const updateToolbar = t1;
 	let t2;
 	let t3;
-	if ($[5] !== editor || $[6] !== updateToolbar) {
+	if ($[4] !== editor || $[5] !== updateToolbar) {
 		t2 = () => {
 			const doc = editor.getRootElement()?.ownerDocument ?? document;
 			doc.addEventListener("selectionchange", updateToolbar);
@@ -183,31 +172,31 @@ function SidebarFloatingTextToolbar() {
 			};
 		};
 		t3 = [editor, updateToolbar];
-		$[5] = editor;
-		$[6] = updateToolbar;
-		$[7] = t2;
-		$[8] = t3;
+		$[4] = editor;
+		$[5] = updateToolbar;
+		$[6] = t2;
+		$[7] = t3;
 	} else {
-		t2 = $[7];
-		t3 = $[8];
+		t2 = $[6];
+		t3 = $[7];
 	}
 	React.useEffect(t2, t3);
 	let t4;
 	let t5;
-	if ($[9] !== editor || $[10] !== updateToolbar) {
+	if ($[8] !== editor || $[9] !== updateToolbar) {
 		t4 = () => editor.registerUpdateListener(() => updateToolbar());
 		t5 = [editor, updateToolbar];
-		$[9] = editor;
-		$[10] = updateToolbar;
-		$[11] = t4;
-		$[12] = t5;
+		$[8] = editor;
+		$[9] = updateToolbar;
+		$[10] = t4;
+		$[11] = t5;
 	} else {
-		t4 = $[11];
-		t5 = $[12];
+		t4 = $[10];
+		t5 = $[11];
 	}
 	React.useEffect(t4, t5);
 	let t6;
-	if ($[13] !== editor) {
+	if ($[12] !== editor) {
 		t6 = () => editor.registerRootListener((root_1) => {
 			if (!root_1) return;
 			const handleLinkClick = (event) => {
@@ -233,30 +222,30 @@ function SidebarFloatingTextToolbar() {
 			root_1.addEventListener("click", handleLinkClick);
 			return () => root_1.removeEventListener("click", handleLinkClick);
 		});
-		$[13] = editor;
-		$[14] = t6;
-	} else t6 = $[14];
+		$[12] = editor;
+		$[13] = t6;
+	} else t6 = $[13];
 	let t7;
-	if ($[15] !== editor || $[16] !== updateToolbar) {
+	if ($[14] !== editor || $[15] !== updateToolbar) {
 		t7 = [editor, updateToolbar];
-		$[15] = editor;
-		$[16] = updateToolbar;
-		$[17] = t7;
-	} else t7 = $[17];
+		$[14] = editor;
+		$[15] = updateToolbar;
+		$[16] = t7;
+	} else t7 = $[16];
 	React.useEffect(t6, t7);
 	let t8;
-	if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
 		t8 = () => {
 			const selection_0 = $getSelection();
 			if ($isRangeSelection(selection_0) && !selection_0.isCollapsed()) return;
 			if (!lastSelectionRef.current) return;
 			$setSelection(lastSelectionRef.current.clone());
 		};
-		$[18] = t8;
-	} else t8 = $[18];
+		$[17] = t8;
+	} else t8 = $[17];
 	const restoreSelection = t8;
 	let t9;
-	if ($[19] !== editor) {
+	if ($[18] !== editor) {
 		t9 = (formatKey) => {
 			editor.update(() => {
 				restoreSelection();
@@ -267,12 +256,12 @@ function SidebarFloatingTextToolbar() {
 				editor.dispatchCommand(FORMAT_TEXT_COMMAND, formatKey);
 			});
 		};
-		$[19] = editor;
-		$[20] = t9;
-	} else t9 = $[20];
+		$[18] = editor;
+		$[19] = t9;
+	} else t9 = $[19];
 	const applyFormat = t9;
 	let t10;
-	if ($[21] !== editor) {
+	if ($[20] !== editor) {
 		t10 = (target_0, text) => {
 			editor.update(() => {
 				restoreSelection();
@@ -293,23 +282,23 @@ function SidebarFloatingTextToolbar() {
 			setOpen(false);
 			setLinkClickAnchor(null);
 		};
-		$[21] = editor;
-		$[22] = t10;
-	} else t10 = $[22];
+		$[20] = editor;
+		$[21] = t10;
+	} else t10 = $[21];
 	const applyTarget = t10;
 	let t11;
-	if ($[23] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[22] === Symbol.for("react.memo_cache_sentinel")) {
 		t11 = (nextOpen) => {
 			setOpen(nextOpen);
 			if (!nextOpen) setLinkClickAnchor(null);
 		};
-		$[23] = t11;
-	} else t11 = $[23];
+		$[22] = t11;
+	} else t11 = $[22];
 	const handleOpenChange = t11;
 	const handleMouseDown = _temp;
 	if (linkClickAnchor) {
 		let t12;
-		if ($[24] !== linkClickAnchor.left || $[25] !== linkClickAnchor.top) {
+		if ($[23] !== linkClickAnchor.left || $[24] !== linkClickAnchor.top) {
 			t12 = /* @__PURE__ */ jsx(Button, {
 				type: "button",
 				variant: "ghost",
@@ -322,18 +311,18 @@ function SidebarFloatingTextToolbar() {
 					left: linkClickAnchor.left
 				}
 			});
-			$[24] = linkClickAnchor.left;
-			$[25] = linkClickAnchor.top;
-			$[26] = t12;
-		} else t12 = $[26];
+			$[23] = linkClickAnchor.left;
+			$[24] = linkClickAnchor.top;
+			$[25] = t12;
+		} else t12 = $[25];
 		let t13;
-		if ($[27] !== applyTarget) {
+		if ($[26] !== applyTarget) {
 			t13 = () => applyTarget(null);
-			$[27] = applyTarget;
-			$[28] = t13;
-		} else t13 = $[28];
+			$[26] = applyTarget;
+			$[27] = t13;
+		} else t13 = $[27];
 		let t14;
-		if ($[29] !== applyTarget || $[30] !== linkTarget || $[31] !== open || $[32] !== selectedText || $[33] !== t12 || $[34] !== t13) {
+		if ($[28] !== applyTarget || $[29] !== linkTarget || $[30] !== open || $[31] !== selectedText || $[32] !== t12 || $[33] !== t13) {
 			t14 = /* @__PURE__ */ jsx(TextLinkPopover, {
 				open,
 				onOpenChange: handleOpenChange,
@@ -343,42 +332,42 @@ function SidebarFloatingTextToolbar() {
 				onSave: applyTarget,
 				onUnlink: t13
 			});
-			$[29] = applyTarget;
-			$[30] = linkTarget;
-			$[31] = open;
-			$[32] = selectedText;
-			$[33] = t12;
-			$[34] = t13;
-			$[35] = t14;
-		} else t14 = $[35];
+			$[28] = applyTarget;
+			$[29] = linkTarget;
+			$[30] = open;
+			$[31] = selectedText;
+			$[32] = t12;
+			$[33] = t13;
+			$[34] = t14;
+		} else t14 = $[34];
 		return t14;
 	}
 	if (!toolbarState.visible) return null;
 	let t12;
-	if ($[36] !== toolbarState.left || $[37] !== toolbarState.top) {
+	if ($[35] !== toolbarState.left || $[36] !== toolbarState.top) {
 		t12 = {
 			top: toolbarState.top,
 			left: toolbarState.left
 		};
-		$[36] = toolbarState.left;
-		$[37] = toolbarState.top;
-		$[38] = t12;
-	} else t12 = $[38];
+		$[35] = toolbarState.left;
+		$[36] = toolbarState.top;
+		$[37] = t12;
+	} else t12 = $[37];
 	const t13 = toolbarState.activeFormats & FORMAT_FLAGS.bold ? "on" : "off";
 	const t14 = !!(toolbarState.activeFormats & FORMAT_FLAGS.bold);
 	let t15;
-	if ($[39] !== applyFormat) {
+	if ($[38] !== applyFormat) {
 		t15 = () => applyFormat("bold");
-		$[39] = applyFormat;
-		$[40] = t15;
-	} else t15 = $[40];
+		$[38] = applyFormat;
+		$[39] = t15;
+	} else t15 = $[39];
 	let t16;
-	if ($[41] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[40] === Symbol.for("react.memo_cache_sentinel")) {
 		t16 = /* @__PURE__ */ jsx(Bold, {});
-		$[41] = t16;
-	} else t16 = $[41];
+		$[40] = t16;
+	} else t16 = $[40];
 	let t17;
-	if ($[42] !== t13 || $[43] !== t14 || $[44] !== t15) {
+	if ($[41] !== t13 || $[42] !== t14 || $[43] !== t15) {
 		t17 = /* @__PURE__ */ jsx(Toggle, {
 			"data-state": t13,
 			pressed: t14,
@@ -389,26 +378,26 @@ function SidebarFloatingTextToolbar() {
 			onPressedChange: t15,
 			children: t16
 		});
-		$[42] = t13;
-		$[43] = t14;
-		$[44] = t15;
-		$[45] = t17;
-	} else t17 = $[45];
+		$[41] = t13;
+		$[42] = t14;
+		$[43] = t15;
+		$[44] = t17;
+	} else t17 = $[44];
 	const t18 = toolbarState.activeFormats & FORMAT_FLAGS.italic ? "on" : "off";
 	const t19 = !!(toolbarState.activeFormats & FORMAT_FLAGS.italic);
 	let t20;
-	if ($[46] !== applyFormat) {
+	if ($[45] !== applyFormat) {
 		t20 = () => applyFormat("italic");
-		$[46] = applyFormat;
-		$[47] = t20;
-	} else t20 = $[47];
+		$[45] = applyFormat;
+		$[46] = t20;
+	} else t20 = $[46];
 	let t21;
-	if ($[48] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[47] === Symbol.for("react.memo_cache_sentinel")) {
 		t21 = /* @__PURE__ */ jsx(Italic, {});
-		$[48] = t21;
-	} else t21 = $[48];
+		$[47] = t21;
+	} else t21 = $[47];
 	let t22;
-	if ($[49] !== t18 || $[50] !== t19 || $[51] !== t20) {
+	if ($[48] !== t18 || $[49] !== t19 || $[50] !== t20) {
 		t22 = /* @__PURE__ */ jsx(Toggle, {
 			"data-state": t18,
 			pressed: t19,
@@ -419,26 +408,26 @@ function SidebarFloatingTextToolbar() {
 			onPressedChange: t20,
 			children: t21
 		});
-		$[49] = t18;
-		$[50] = t19;
-		$[51] = t20;
-		$[52] = t22;
-	} else t22 = $[52];
+		$[48] = t18;
+		$[49] = t19;
+		$[50] = t20;
+		$[51] = t22;
+	} else t22 = $[51];
 	let t23;
-	if ($[53] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[52] === Symbol.for("react.memo_cache_sentinel")) {
 		t23 = [{
-			key: "underline",
-			label: "Underline",
-			icon: Underline
+			key: "strikethrough",
+			label: "Strikethrough",
+			icon: Strikethrough
 		}, {
 			key: "highlight",
 			label: "Highlight",
 			icon: Highlighter
 		}];
-		$[53] = t23;
-	} else t23 = $[53];
+		$[52] = t23;
+	} else t23 = $[52];
 	let t24;
-	if ($[54] !== applyFormat || $[55] !== toolbarState.activeFormats) {
+	if ($[53] !== applyFormat || $[54] !== toolbarState.activeFormats) {
 		t24 = t23.map((t25) => {
 			const { key, label, icon: Icon } = t25;
 			return /* @__PURE__ */ jsx(Toggle, {
@@ -451,28 +440,28 @@ function SidebarFloatingTextToolbar() {
 				children: /* @__PURE__ */ jsx(Icon, {})
 			}, key);
 		});
-		$[54] = applyFormat;
-		$[55] = toolbarState.activeFormats;
-		$[56] = t24;
-	} else t24 = $[56];
+		$[53] = applyFormat;
+		$[54] = toolbarState.activeFormats;
+		$[55] = t24;
+	} else t24 = $[55];
 	let t25;
-	if ($[57] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[56] === Symbol.for("react.memo_cache_sentinel")) {
 		t25 = /* @__PURE__ */ jsx(Button, {
 			type: "button",
 			variant: "ghost",
 			size: "sm",
 			className: "text-foreground hover:text-foreground h-7 min-w-7 px-1.5"
 		});
-		$[57] = t25;
-	} else t25 = $[57];
+		$[56] = t25;
+	} else t25 = $[56];
 	let t26;
-	if ($[58] !== applyTarget) {
+	if ($[57] !== applyTarget) {
 		t26 = () => applyTarget(null);
-		$[58] = applyTarget;
-		$[59] = t26;
-	} else t26 = $[59];
+		$[57] = applyTarget;
+		$[58] = t26;
+	} else t26 = $[58];
 	let t27;
-	if ($[60] !== applyTarget || $[61] !== linkTarget || $[62] !== open || $[63] !== selectedText || $[64] !== t26) {
+	if ($[59] !== applyTarget || $[60] !== linkTarget || $[61] !== open || $[62] !== selectedText || $[63] !== t26) {
 		t27 = /* @__PURE__ */ jsx(TextLinkPopover, {
 			open,
 			onOpenChange: handleOpenChange,
@@ -482,15 +471,15 @@ function SidebarFloatingTextToolbar() {
 			onSave: applyTarget,
 			onUnlink: t26
 		});
-		$[60] = applyTarget;
-		$[61] = linkTarget;
-		$[62] = open;
-		$[63] = selectedText;
-		$[64] = t26;
-		$[65] = t27;
-	} else t27 = $[65];
+		$[59] = applyTarget;
+		$[60] = linkTarget;
+		$[61] = open;
+		$[62] = selectedText;
+		$[63] = t26;
+		$[64] = t27;
+	} else t27 = $[64];
 	let t28;
-	if ($[66] !== t12 || $[67] !== t17 || $[68] !== t22 || $[69] !== t24 || $[70] !== t27) {
+	if ($[65] !== t12 || $[66] !== t17 || $[67] !== t22 || $[68] !== t24 || $[69] !== t27) {
 		t28 = /* @__PURE__ */ jsxs(FloatingToolbar, {
 			onMouseDown: handleMouseDown,
 			className: "fixed z-50 gap-0.5 rounded-lg p-1 shadow-lg",
@@ -502,13 +491,13 @@ function SidebarFloatingTextToolbar() {
 				t27
 			]
 		});
-		$[66] = t12;
-		$[67] = t17;
-		$[68] = t22;
-		$[69] = t24;
-		$[70] = t27;
-		$[71] = t28;
-	} else t28 = $[71];
+		$[65] = t12;
+		$[66] = t17;
+		$[67] = t22;
+		$[68] = t24;
+		$[69] = t27;
+		$[70] = t28;
+	} else t28 = $[70];
 	return t28;
 }
 function _temp(event_0) {
@@ -517,15 +506,11 @@ function _temp(event_0) {
 	event_0.preventDefault();
 }
 function PasteUrlAsLinkHandler() {
-	const $ = c(4);
-	if ($[0] !== "b2abd53d41bcf7845fda084f34768059ff9a381fdb75359c9fd3fc0de4052372") {
-		for (let $i = 0; $i < 4; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "b2abd53d41bcf7845fda084f34768059ff9a381fdb75359c9fd3fc0de4052372";
-	}
+	const $ = c(3);
 	const [editor] = useLexicalComposerContext();
 	let t0;
 	let t1;
-	if ($[1] !== editor) {
+	if ($[0] !== editor) {
 		t0 = () => editor.registerCommand(PASTE_COMMAND, (event) => {
 			const selection = $getSelection();
 			if (!$isRangeSelection(selection) || selection.isCollapsed()) return false;
@@ -537,88 +522,196 @@ function PasteUrlAsLinkHandler() {
 			return true;
 		}, COMMAND_PRIORITY_LOW);
 		t1 = [editor];
-		$[1] = editor;
-		$[2] = t0;
-		$[3] = t1;
+		$[0] = editor;
+		$[1] = t0;
+		$[2] = t1;
 	} else {
-		t0 = $[2];
-		t1 = $[3];
+		t0 = $[1];
+		t1 = $[2];
 	}
 	React.useEffect(t0, t1);
 	return null;
 }
-function SidebarLexicalEditor({ id, value, onChange, onFocus, onBlur }) {
+function SidebarLexicalEditor(t0) {
+	const $ = c(31);
+	const { id, value, maxLength, onChange, onFocus, onBlur } = t0;
 	const timerRef = React.useRef(null);
 	const onChangeRef = React.useRef(onChange);
-	onChangeRef.current = onChange;
+	let t1;
+	if ($[0] !== onChange) {
+		t1 = () => {
+			onChangeRef.current = onChange;
+		};
+		$[0] = onChange;
+		$[1] = t1;
+	} else t1 = $[1];
+	React.useLayoutEffect(t1);
 	const isSyncingRef = React.useRef(false);
 	const pendingMarkdownRef = React.useRef(null);
-	const flushChange = React.useCallback(() => {
-		if (timerRef.current) clearTimeout(timerRef.current);
-		timerRef.current = null;
-		const markdown = pendingMarkdownRef.current;
-		pendingMarkdownRef.current = null;
-		if (markdown !== null) onChangeRef.current(markdown);
-	}, []);
-	const config = React.useMemo(() => createEditorConfig(value), []);
-	const handleChange = React.useCallback((editorState) => {
-		if (isSyncingRef.current) {
-			isSyncingRef.current = false;
-			return;
-		}
-		if (timerRef.current) clearTimeout(timerRef.current);
-		pendingMarkdownRef.current = lexicalStateToMarkdown(editorState.toJSON());
-		timerRef.current = window.setTimeout(flushChange, 300);
-	}, [flushChange]);
-	React.useEffect(() => flushChange, [flushChange]);
-	return /* @__PURE__ */ jsx("div", {
-		className: "w-full min-w-0",
-		children: /* @__PURE__ */ jsxs(LexicalComposer, {
-			initialConfig: config,
-			children: [
-				/* @__PURE__ */ jsx(RichTextPlugin, {
-					contentEditable: /* @__PURE__ */ jsx(ContentEditable, {
-						id,
-						className: cn(INPUT_BASE_STYLES, INPUT_FOCUS_STYLES, "flex min-h-[80px] w-full px-3 py-2"),
-						onFocus,
-						onBlur: () => {
-							flushChange();
-							onBlur?.();
-						}
-					}),
-					ErrorBoundary: LexicalErrorBoundary
-				}),
-				/* @__PURE__ */ jsx(OnChangePlugin, {
-					onChange: handleChange,
-					ignoreSelectionChange: true
-				}),
-				/* @__PURE__ */ jsx(HistoryPlugin, {}),
-				/* @__PURE__ */ jsx(LinkPlugin, {}),
-				/* @__PURE__ */ jsx(ExternalStateSync, {
-					value,
-					isSyncingRef
-				}),
-				/* @__PURE__ */ jsx(EnterAsLineBreakHandler, {}),
-				/* @__PURE__ */ jsx(PasteUrlAsLinkHandler, {}),
-				/* @__PURE__ */ jsx(SidebarFloatingTextToolbar, {}),
-				/* @__PURE__ */ jsx(InlineStylesPlugin, {})
-			]
-		})
-	});
+	let t2;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = () => {
+			if (timerRef.current) clearTimeout(timerRef.current);
+			timerRef.current = null;
+			const markdown = pendingMarkdownRef.current;
+			pendingMarkdownRef.current = null;
+			if (markdown !== null) onChangeRef.current(markdown);
+		};
+		$[2] = t2;
+	} else t2 = $[2];
+	const flushChange = t2;
+	let t3;
+	if ($[3] !== value) {
+		t3 = () => createEditorConfig(value);
+		$[3] = value;
+		$[4] = t3;
+	} else t3 = $[4];
+	const [config] = React.useState(t3);
+	let t4;
+	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = (editorState) => {
+			if (isSyncingRef.current) {
+				isSyncingRef.current = false;
+				return;
+			}
+			if (timerRef.current) clearTimeout(timerRef.current);
+			pendingMarkdownRef.current = lexicalStateToMarkdown(editorState.toJSON());
+			timerRef.current = window.setTimeout(flushChange, 300);
+		};
+		$[5] = t4;
+	} else t4 = $[5];
+	const handleChange = t4;
+	let t5;
+	let t6;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = () => flushChange;
+		t6 = [flushChange];
+		$[6] = t5;
+		$[7] = t6;
+	} else {
+		t5 = $[6];
+		t6 = $[7];
+	}
+	React.useEffect(t5, t6);
+	let t7;
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t7 = cn(INPUT_BASE_STYLES, INPUT_FOCUS_STYLES, "flex min-h-[80px] w-full px-3 py-2");
+		$[8] = t7;
+	} else t7 = $[8];
+	let t8;
+	if ($[9] !== onBlur) {
+		t8 = () => {
+			flushChange();
+			onBlur?.();
+		};
+		$[9] = onBlur;
+		$[10] = t8;
+	} else t8 = $[10];
+	let t9;
+	if ($[11] !== id || $[12] !== onFocus || $[13] !== t8) {
+		t9 = /* @__PURE__ */ jsx(RichTextPlugin, {
+			contentEditable: /* @__PURE__ */ jsx(ContentEditable, {
+				id,
+				className: t7,
+				onFocus,
+				onBlur: t8
+			}),
+			ErrorBoundary: LexicalErrorBoundary
+		});
+		$[11] = id;
+		$[12] = onFocus;
+		$[13] = t8;
+		$[14] = t9;
+	} else t9 = $[14];
+	let t10;
+	let t11;
+	let t12;
+	if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
+		t10 = /* @__PURE__ */ jsx(OnChangePlugin, {
+			onChange: handleChange,
+			ignoreSelectionChange: true
+		});
+		t11 = /* @__PURE__ */ jsx(HistoryPlugin, {});
+		t12 = /* @__PURE__ */ jsx(LinkPlugin, {});
+		$[15] = t10;
+		$[16] = t11;
+		$[17] = t12;
+	} else {
+		t10 = $[15];
+		t11 = $[16];
+		t12 = $[17];
+	}
+	let t13;
+	if ($[18] !== maxLength) {
+		t13 = /* @__PURE__ */ jsx(MaxLengthPlugin, { maxLength });
+		$[18] = maxLength;
+		$[19] = t13;
+	} else t13 = $[19];
+	let t14;
+	if ($[20] !== value) {
+		t14 = /* @__PURE__ */ jsx(ExternalStateSync, {
+			value,
+			isSyncingRef
+		});
+		$[20] = value;
+		$[21] = t14;
+	} else t14 = $[21];
+	let t15;
+	let t16;
+	let t17;
+	let t18;
+	if ($[22] === Symbol.for("react.memo_cache_sentinel")) {
+		t15 = /* @__PURE__ */ jsx(EnterAsLineBreakHandler, {});
+		t16 = /* @__PURE__ */ jsx(PasteUrlAsLinkHandler, {});
+		t17 = /* @__PURE__ */ jsx(SidebarFloatingTextToolbar, {});
+		t18 = /* @__PURE__ */ jsx(InlineStylesPlugin, {});
+		$[22] = t15;
+		$[23] = t16;
+		$[24] = t17;
+		$[25] = t18;
+	} else {
+		t15 = $[22];
+		t16 = $[23];
+		t17 = $[24];
+		t18 = $[25];
+	}
+	let t19;
+	if ($[26] !== config || $[27] !== t13 || $[28] !== t14 || $[29] !== t9) {
+		t19 = /* @__PURE__ */ jsx("div", {
+			className: "w-full min-w-0",
+			children: /* @__PURE__ */ jsxs(LexicalComposer, {
+				initialConfig: config,
+				children: [
+					t9,
+					t10,
+					t11,
+					t12,
+					t13,
+					t14,
+					t15,
+					t16,
+					t17,
+					t18
+				]
+			})
+		});
+		$[26] = config;
+		$[27] = t13;
+		$[28] = t14;
+		$[29] = t9;
+		$[30] = t19;
+	} else t19 = $[30];
+	return t19;
 }
 function LexicalErrorBoundary(t0) {
-	const $ = c(3);
-	if ($[0] !== "b2abd53d41bcf7845fda084f34768059ff9a381fdb75359c9fd3fc0de4052372") {
-		for (let $i = 0; $i < 3; $i += 1) $[$i] = Symbol.for("react.memo_cache_sentinel");
-		$[0] = "b2abd53d41bcf7845fda084f34768059ff9a381fdb75359c9fd3fc0de4052372";
-	}
+	const $ = c(2);
 	const { children } = t0;
 	let t1;
-	if ($[1] !== children) {
+	if ($[0] !== children) {
 		t1 = /* @__PURE__ */ jsx(Fragment, { children });
-		$[1] = children;
-		$[2] = t1;
-	} else t1 = $[2];
+		$[0] = children;
+		$[1] = t1;
+	} else t1 = $[1];
 	return t1;
 }