@zuilib/text-editor 0.7.2 → 0.9.0

package/dist/index.js

@@ -14,11 +14,11 @@ import { LinkPlugin } from "@lexical/react/LexicalLinkPlugin";
 import { MarkdownShortcutPlugin } from "@lexical/react/LexicalMarkdownShortcutPlugin";
 import { AutoFocusPlugin } from "@lexical/react/LexicalAutoFocusPlugin";
 import { TablePlugin } from "@lexical/react/LexicalTablePlugin";
-import { CHECK_LIST, CODE, TRANSFORMERS as TRANSFORMERS2 } from "@lexical/markdown";
+import { CHECK_LIST, CODE as CODE2, TRANSFORMERS as TRANSFORMERS2 } from "@lexical/markdown";
 import { useLexicalComposerContext as useLexicalComposerContext6 } from "@lexical/react/LexicalComposerContext";
 import { HeadingNode, QuoteNode } from "@lexical/rich-text";
 import { ListItemNode, ListNode as ListNode2 } from "@lexical/list";
-import { CodeHighlightNode, CodeNode } from "@lexical/code";
+import { CodeHighlightNode, CodeNode as CodeNode2 } from "@lexical/code";
 import { AutoLinkNode, LinkNode } from "@lexical/link";
 import { TableCellNode as TableCellNode2, TableNode as TableNode2, TableRowNode as TableRowNode2 } from "@lexical/table";
 
@@ -160,12 +160,1411 @@ function CodeBlockShortcutPlugin() {
 // src/plugins/CodeHighlightPlugin.tsx
 import { useEffect as useEffect3 } from "react";
 import { useLexicalComposerContext as useLexicalComposerContext3 } from "@lexical/react/LexicalComposerContext";
-import { registerCodeHighlighting } from "@lexical/code";
+
+// src/code/registry.ts
+var PLAIN_LANGUAGE = "plain";
+var PLAIN = {
+  name: PLAIN_LANGUAGE,
+  aliases: ["plaintext", "text", "txt"],
+  rules: []
+};
+var grammars = /* @__PURE__ */ new Map();
+function normalize(name) {
+  return name.trim().toLowerCase();
+}
+function registerCodeLanguage(grammar) {
+  for (const name of [grammar.name, ...grammar.aliases ?? []]) {
+    grammars.set(normalize(name), grammar);
+  }
+}
+function hasCodeLanguage(name) {
+  return grammars.has(normalize(name));
+}
+function resolveCodeLanguage(name) {
+  if (!name) return PLAIN;
+  const key = normalize(name);
+  return grammars.get(key) ?? (key.startsWith("diff-") ? grammars.get("diff") : void 0) ?? PLAIN;
+}
+function getCodeLanguages() {
+  return [...new Set([...grammars.values()].map((g) => g.name))].sort();
+}
+registerCodeLanguage(PLAIN);
+
+// src/code/languages/common.ts
+var LINE_COMMENT = String.raw`//[^\n]*`;
+var BLOCK_COMMENT = String.raw`/\*[^]*?(?:\*/|$)`;
+var HASH_COMMENT = String.raw`#[^\n]*`;
+var DOUBLE_QUOTED = String.raw`"(?:[^"\\\n]|\\[^])*"?`;
+var SINGLE_QUOTED = String.raw`'(?:[^'\\\n]|\\[^])*'?`;
+var TRIPLE_DOUBLE_QUOTED = String.raw`"""[^]*?(?:"""|$)`;
+var TRIPLE_SINGLE_QUOTED = String.raw`'''[^]*?(?:'''|$)`;
+var BACKTICK_QUOTED = String.raw`\`(?:[^\`\\]|\\[^])*\`?`;
+var C_NUMBER = String.raw`\b(?:0[xX][\da-fA-F_]+|0[bB][01_]+|0[oO][0-7_]+|\d[\d_]*(?:\.\d[\d_]*)?(?:[eE][+-]?\d+)?)[a-zA-Z]*\b`;
+var ANNOTATION = String.raw`@[\w.]+`;
+var MEMBER = String.raw`(?<=\.\s*)[A-Za-z_$][\w$]*\b(?!\s*\()`;
+var C_OPERATOR = String.raw`[-+*/%=!<>&|^~?:]+`;
+var PUNCTUATION = String.raw`[{}()\[\];,.]`;
+
+// src/code/languages/c.ts
+var PREPROCESSOR = String.raw`(?<=^|\n)[ \t]*#[ \t]*\w+[^\n]*`;
+var c = {
+  name: "c",
+  aliases: ["h", "cpp", "c++", "cc", "cxx", "hpp", "hh"],
+  rules: [
+    { type: "comment", match: LINE_COMMENT },
+    { type: "comment", match: BLOCK_COMMENT },
+    { type: "meta", match: PREPROCESSOR },
+    { type: "string", match: DOUBLE_QUOTED },
+    { type: "string", match: SINGLE_QUOTED },
+    { type: "number", match: C_NUMBER },
+    { type: "property", match: MEMBER },
+    { type: "operator", match: String.raw`->|::|` + C_OPERATOR },
+    { type: "punctuation", match: PUNCTUATION }
+  ],
+  keywords: [
+    "auto",
+    "break",
+    "case",
+    "const",
+    "continue",
+    "default",
+    "do",
+    "else",
+    "enum",
+    "extern",
+    "for",
+    "goto",
+    "if",
+    "inline",
+    "register",
+    "restrict",
+    "return",
+    "sizeof",
+    "static",
+    "struct",
+    "switch",
+    "typedef",
+    "union",
+    "volatile",
+    "while",
+    // C++
+    "catch",
+    "class",
+    "const_cast",
+    "constexpr",
+    "consteval",
+    "delete",
+    "dynamic_cast",
+    "explicit",
+    "export",
+    "final",
+    "friend",
+    "mutable",
+    "namespace",
+    "new",
+    "noexcept",
+    "operator",
+    "override",
+    "private",
+    "protected",
+    "public",
+    "reinterpret_cast",
+    "static_cast",
+    "template",
+    "this",
+    "throw",
+    "try",
+    "typename",
+    "using",
+    "virtual"
+  ],
+  types: [
+    "bool",
+    "char",
+    "double",
+    "float",
+    "int",
+    "long",
+    "short",
+    "signed",
+    "unsigned",
+    "void",
+    "wchar_t",
+    "size_t",
+    "ssize_t",
+    "int8_t",
+    "int16_t",
+    "int32_t",
+    "int64_t",
+    "uint8_t",
+    "uint16_t",
+    "uint32_t",
+    "uint64_t"
+  ],
+  constants: ["true", "false", "NULL", "nullptr"],
+  callIsFunction: true,
+  capitalizedIsType: true
+};
+
+// src/code/languages/css.ts
+var css = {
+  name: "css",
+  aliases: ["scss", "less", "postcss"],
+  rules: [
+    { type: "comment", match: BLOCK_COMMENT },
+    { type: "comment", match: LINE_COMMENT },
+    { type: "keyword", match: String.raw`@[\w-]+|!\s*important\b` },
+    { type: "variable", match: String.raw`--[\w-]+|\$[\w-]+` },
+    { type: "string", match: DOUBLE_QUOTED },
+    { type: "string", match: SINGLE_QUOTED },
+    { type: "tag", match: String.raw`(?<=(?:^|[{};]|\*/)\s*)[^{};@\s][^{};]*?(?=\s*\{)` },
+    { type: "property", match: String.raw`(?<=[{;(]\s*)[-\w]+(?=\s*:)` },
+    { type: "constant", match: String.raw`#[\da-fA-F]{3,8}\b` },
+    { type: "function", match: String.raw`[-\w]+(?=\()` },
+    { type: "number", match: String.raw`(?<![\w-])[-+]?\d*\.?\d+(?:[eE][-+]?\d+)?(?:%|[a-zA-Z]+)?` },
+    { type: "punctuation", match: String.raw`[{}()\[\];:,]` },
+    { type: "operator", match: String.raw`[>+~*/=]` }
+  ]
+};
+
+// src/code/languages/diff.ts
+var LINE = String.raw`[^\n]*`;
+var AT = String.raw`(?<=^|\n)`;
+var diff = {
+  name: "diff",
+  aliases: ["patch"],
+  rules: [
+    { type: "comment", match: AT + String.raw`(?:diff |index |--- |\+\+\+ |Index: |={3,}|\*{3} )` + LINE },
+    { type: "meta", match: AT + String.raw`@@` + LINE },
+    { type: "inserted", match: AT + String.raw`\+` + LINE },
+    { type: "deleted", match: AT + "-" + LINE }
+  ]
+};
+
+// src/code/languages/go.ts
+var go = {
+  name: "go",
+  aliases: ["golang"],
+  rules: [
+    { type: "comment", match: LINE_COMMENT },
+    { type: "comment", match: BLOCK_COMMENT },
+    { type: "string", match: String.raw`\`[^\`]*\`?` },
+    { type: "string", match: DOUBLE_QUOTED },
+    { type: "string", match: SINGLE_QUOTED },
+    { type: "number", match: C_NUMBER },
+    { type: "property", match: MEMBER },
+    { type: "operator", match: String.raw`:=|<-|\.\.\.|` + C_OPERATOR },
+    { type: "punctuation", match: PUNCTUATION }
+  ],
+  keywords: [
+    "break",
+    "case",
+    "chan",
+    "const",
+    "continue",
+    "default",
+    "defer",
+    "else",
+    "fallthrough",
+    "for",
+    "func",
+    "go",
+    "goto",
+    "if",
+    "import",
+    "interface",
+    "map",
+    "package",
+    "range",
+    "return",
+    "select",
+    "struct",
+    "switch",
+    "type",
+    "var"
+  ],
+  types: [
+    "any",
+    "bool",
+    "byte",
+    "comparable",
+    "complex64",
+    "complex128",
+    "error",
+    "float32",
+    "float64",
+    "int",
+    "int8",
+    "int16",
+    "int32",
+    "int64",
+    "rune",
+    "string",
+    "uint",
+    "uint8",
+    "uint16",
+    "uint32",
+    "uint64",
+    "uintptr"
+  ],
+  builtins: [
+    "append",
+    "cap",
+    "clear",
+    "close",
+    "complex",
+    "copy",
+    "delete",
+    "imag",
+    "len",
+    "make",
+    "max",
+    "min",
+    "new",
+    "panic",
+    "print",
+    "println",
+    "real",
+    "recover"
+  ],
+  constants: ["true", "false", "nil", "iota"],
+  callIsFunction: true,
+  // Exported names are Capitalized in Go; coloring them all as types is noise
+  capitalizedIsType: false
+};
+
+// src/code/languages/java.ts
+var java = {
+  name: "java",
+  rules: [
+    { type: "comment", match: LINE_COMMENT },
+    { type: "comment", match: BLOCK_COMMENT },
+    { type: "string", match: TRIPLE_DOUBLE_QUOTED },
+    { type: "string", match: DOUBLE_QUOTED },
+    { type: "string", match: SINGLE_QUOTED },
+    { type: "meta", match: ANNOTATION },
+    { type: "number", match: C_NUMBER },
+    { type: "property", match: MEMBER },
+    { type: "operator", match: String.raw`->|::|` + C_OPERATOR },
+    { type: "punctuation", match: PUNCTUATION }
+  ],
+  keywords: [
+    "abstract",
+    "assert",
+    "break",
+    "case",
+    "catch",
+    "class",
+    "const",
+    "continue",
+    "default",
+    "do",
+    "else",
+    "enum",
+    "extends",
+    "final",
+    "finally",
+    "for",
+    "goto",
+    "if",
+    "implements",
+    "import",
+    "instanceof",
+    "interface",
+    "native",
+    "new",
+    "package",
+    "permits",
+    "private",
+    "protected",
+    "public",
+    "record",
+    "return",
+    "sealed",
+    "static",
+    "strictfp",
+    "super",
+    "switch",
+    "synchronized",
+    "this",
+    "throw",
+    "throws",
+    "transient",
+    "try",
+    "var",
+    "volatile",
+    "while",
+    "yield"
+  ],
+  types: ["boolean", "byte", "char", "double", "float", "int", "long", "short", "void"],
+  constants: ["true", "false", "null"],
+  callIsFunction: true,
+  capitalizedIsType: true
+};
+
+// src/code/languages/javascript.ts
+var REGEX = String.raw`(?<=(?:^|[=(,:;!&|?{}\[+\-*%<>~^]|\breturn|\btypeof|\bcase|\bof|\bin)\s*)/(?![/*])(?:[^/\\\n\[]|\\[^]|\[(?:[^\]\\\n]|\\[^])*\])+/[dgimsuyv]*`;
+var JSX_TAG = String.raw`(?<=<\/?)[A-Za-z][\w.:-]*`;
+var javascript = {
+  name: "javascript",
+  aliases: ["js", "jsx", "mjs", "cjs", "typescript", "ts", "tsx", "mts", "cts"],
+  rules: [
+    { type: "comment", match: LINE_COMMENT },
+    { type: "comment", match: BLOCK_COMMENT },
+    { type: "string", match: BACKTICK_QUOTED },
+    { type: "string", match: DOUBLE_QUOTED },
+    { type: "string", match: SINGLE_QUOTED },
+    { type: "regex", match: REGEX },
+    { type: "meta", match: ANNOTATION },
+    { type: "number", match: C_NUMBER },
+    { type: "property", match: MEMBER },
+    { type: "tag", match: JSX_TAG },
+    { type: "operator", match: String.raw`=>|\.\.\.|` + C_OPERATOR },
+    { type: "punctuation", match: PUNCTUATION }
+  ],
+  keywords: [
+    "as",
+    "async",
+    "await",
+    "break",
+    "case",
+    "catch",
+    "class",
+    "const",
+    "continue",
+    "debugger",
+    "default",
+    "delete",
+    "do",
+    "else",
+    "enum",
+    "export",
+    "extends",
+    "finally",
+    "for",
+    "from",
+    "function",
+    "get",
+    "if",
+    "implements",
+    "import",
+    "in",
+    "instanceof",
+    "interface",
+    "let",
+    "new",
+    "of",
+    "package",
+    "private",
+    "protected",
+    "public",
+    "return",
+    "set",
+    "static",
+    "super",
+    "switch",
+    "this",
+    "throw",
+    "try",
+    "typeof",
+    "var",
+    "void",
+    "while",
+    "with",
+    "yield",
+    // TypeScript
+    "abstract",
+    "asserts",
+    "declare",
+    "infer",
+    "is",
+    "keyof",
+    "module",
+    "namespace",
+    "override",
+    "readonly",
+    "satisfies",
+    "type",
+    "unique"
+  ],
+  types: [
+    "any",
+    "bigint",
+    "boolean",
+    "never",
+    "null",
+    "number",
+    "object",
+    "string",
+    "symbol",
+    "undefined",
+    "unknown",
+    "void"
+  ],
+  builtins: [
+    "Array",
+    "BigInt",
+    "Boolean",
+    "Date",
+    "Error",
+    "JSON",
+    "Map",
+    "Math",
+    "Number",
+    "Object",
+    "Promise",
+    "Proxy",
+    "Reflect",
+    "RegExp",
+    "Set",
+    "String",
+    "Symbol",
+    "WeakMap",
+    "WeakSet",
+    "console",
+    "document",
+    "globalThis",
+    "window",
+    "parseFloat",
+    "parseInt",
+    "setTimeout",
+    "setInterval",
+    "clearTimeout",
+    "clearInterval",
+    "fetch",
+    "require",
+    "process"
+  ],
+  constants: ["true", "false", "null", "undefined", "NaN", "Infinity"],
+  callIsFunction: true,
+  capitalizedIsType: true
+};
+
+// src/code/languages/json.ts
+var json = {
+  name: "json",
+  aliases: ["jsonc", "json5"],
+  rules: [
+    { type: "comment", match: String.raw`//[^\n]*|/\*[^]*?(?:\*/|$)` },
+    { type: "property", match: String.raw`"(?:[^"\\\n]|\\[^])*"(?=\s*:)` },
+    { type: "string", match: String.raw`"(?:[^"\\\n]|\\[^])*"?` },
+    { type: "number", match: String.raw`-?\b\d+(?:\.\d+)?(?:[eE][+-]?\d+)?\b` },
+    { type: "punctuation", match: String.raw`[{}\[\]:,]` }
+  ],
+  constants: ["true", "false", "null"]
+};
+
+// src/code/languages/kotlin.ts
+var kotlin = {
+  name: "kotlin",
+  aliases: ["kt", "kts"],
+  rules: [
+    { type: "comment", match: LINE_COMMENT },
+    { type: "comment", match: BLOCK_COMMENT },
+    { type: "string", match: TRIPLE_DOUBLE_QUOTED },
+    { type: "string", match: DOUBLE_QUOTED },
+    { type: "string", match: SINGLE_QUOTED },
+    { type: "meta", match: ANNOTATION },
+    { type: "number", match: C_NUMBER },
+    { type: "property", match: MEMBER },
+    { type: "operator", match: String.raw`->|\.\.|\?:|!!|` + C_OPERATOR },
+    { type: "punctuation", match: PUNCTUATION }
+  ],
+  keywords: [
+    "abstract",
+    "actual",
+    "annotation",
+    "as",
+    "break",
+    "by",
+    "catch",
+    "class",
+    "companion",
+    "const",
+    "constructor",
+    "continue",
+    "crossinline",
+    "data",
+    "do",
+    "else",
+    "enum",
+    "expect",
+    "external",
+    "final",
+    "finally",
+    "for",
+    "fun",
+    "get",
+    "if",
+    "import",
+    "in",
+    "infix",
+    "init",
+    "inline",
+    "inner",
+    "interface",
+    "internal",
+    "is",
+    "lateinit",
+    "noinline",
+    "object",
+    "open",
+    "operator",
+    "out",
+    "override",
+    "package",
+    "private",
+    "protected",
+    "public",
+    "reified",
+    "return",
+    "sealed",
+    "set",
+    "super",
+    "suspend",
+    "tailrec",
+    "this",
+    "throw",
+    "try",
+    "typealias",
+    "val",
+    "value",
+    "var",
+    "vararg",
+    "when",
+    "where",
+    "while"
+  ],
+  builtins: [
+    "it",
+    "println",
+    "print",
+    "listOf",
+    "mutableListOf",
+    "mapOf",
+    "mutableMapOf",
+    "setOf",
+    "mutableSetOf",
+    "arrayOf",
+    "emptyList",
+    "emptyMap",
+    "lazy",
+    "require",
+    "check",
+    "error",
+    "TODO",
+    "apply",
+    "also",
+    "let",
+    "run",
+    "with",
+    "takeIf",
+    "takeUnless",
+    "repeat"
+  ],
+  constants: ["true", "false", "null"],
+  callIsFunction: true,
+  capitalizedIsType: true
+};
+
+// src/code/languages/markdown.ts
+var AT2 = String.raw`(?<=^|\n)`;
+var markdown = {
+  name: "markdown",
+  aliases: ["md", "mdx"],
+  rules: [
+    { type: "comment", match: String.raw`<!--[^]*?(?:-->|$)` },
+    { type: "string", match: String.raw`\`\`\`[^]*?(?:\`\`\`|$)|\`[^\`\n]*\`` },
+    { type: "keyword", match: AT2 + String.raw`#{1,6}[ \t][^\n]*` },
+    { type: "meta", match: AT2 + String.raw`(?:>|[-*+]|\d+\.)(?=\s)` },
+    { type: "tag", match: String.raw`\*\*[^*\n]+\*\*|__[^_\n]+__` },
+    { type: "variable", match: String.raw`(?<![*\w])\*[^*\n]+\*(?!\w)|(?<![_\w])_[^_\n]+_(?!\w)` },
+    { type: "function", match: String.raw`!?\[[^\]\n]*\](?=\()` },
+    { type: "string", match: String.raw`(?<=\]\()[^)\n]*(?=\))` },
+    { type: "punctuation", match: AT2 + String.raw`(?:---+|\*\*\*+|___+)(?=\n|$)` }
+  ]
+};
+
+// src/code/languages/markup.ts
+var markup = {
+  name: "html",
+  aliases: ["xml", "svg", "xhtml", "vue", "markup", "rss", "atom"],
+  rules: [
+    { type: "comment", match: String.raw`<!--[^]*?(?:-->|$)` },
+    { type: "string", match: String.raw`<!\[CDATA\[[^]*?(?:\]\]>|$)` },
+    { type: "meta", match: String.raw`<![\w]+[^>]*>?|<\?[^]*?(?:\?>|$)` },
+    { type: "tag", match: String.raw`(?<=<\/?)[A-Za-z][\w:.-]*` },
+    { type: "string", match: String.raw`(?<=<[^>]*=\s*)(?:"[^"]*"|'[^']*')` },
+    { type: "attr", match: String.raw`(?<=<[^>]*\s)[^\s"'<>/=]+` },
+    { type: "punctuation", match: String.raw`<\/?|\/?>|(?<=<[^>]*)=` },
+    { type: "constant", match: String.raw`&#?\w+;` }
+  ]
+};
+
+// src/code/languages/python.ts
+var PREFIX = String.raw`(?:\b[rRbBuUfF]{1,2})?`;
+var NUMBER = String.raw`\b(?:0[xX][\da-fA-F_]+|0[bB][01_]+|0[oO][0-7_]+|\d[\d_]*(?:\.\d[\d_]*)?(?:[eE][+-]?\d+)?[jJ]?)\b`;
+var python = {
+  name: "python",
+  aliases: ["py", "py3"],
+  rules: [
+    { type: "comment", match: HASH_COMMENT },
+    { type: "string", match: PREFIX + String.raw`"""[^]*?(?:"""|$)` },
+    { type: "string", match: PREFIX + String.raw`'''[^]*?(?:'''|$)` },
+    { type: "string", match: PREFIX + String.raw`"(?:[^"\\\n]|\\[^])*"?` },
+    { type: "string", match: PREFIX + String.raw`'(?:[^'\\\n]|\\[^])*'?` },
+    { type: "meta", match: String.raw`@[\w.]+` },
+    { type: "number", match: NUMBER },
+    { type: "property", match: MEMBER },
+    { type: "operator", match: String.raw`->|:=|\*\*|//|[-+*/%=!<>&|^~@]+` },
+    { type: "punctuation", match: PUNCTUATION + "|:" }
+  ],
+  keywords: [
+    "and",
+    "as",
+    "assert",
+    "async",
+    "await",
+    "break",
+    "case",
+    "class",
+    "continue",
+    "def",
+    "del",
+    "elif",
+    "else",
+    "except",
+    "finally",
+    "for",
+    "from",
+    "global",
+    "if",
+    "import",
+    "in",
+    "is",
+    "lambda",
+    "match",
+    "nonlocal",
+    "not",
+    "or",
+    "pass",
+    "raise",
+    "return",
+    "try",
+    "while",
+    "with",
+    "yield"
+  ],
+  builtins: [
+    "self",
+    "cls",
+    "print",
+    "len",
+    "range",
+    "enumerate",
+    "zip",
+    "map",
+    "filter",
+    "sorted",
+    "reversed",
+    "open",
+    "input",
+    "abs",
+    "min",
+    "max",
+    "sum",
+    "any",
+    "all",
+    "iter",
+    "next",
+    "isinstance",
+    "issubclass",
+    "getattr",
+    "setattr",
+    "hasattr",
+    "super",
+    "type",
+    "id",
+    "hash",
+    "repr",
+    "format",
+    "vars",
+    "dir"
+  ],
+  types: ["int", "float", "str", "bytes", "bool", "list", "dict", "set", "tuple", "object", "complex", "frozenset"],
+  constants: ["True", "False", "None", "Ellipsis", "NotImplemented"],
+  callIsFunction: true,
+  capitalizedIsType: true
+};
+
+// src/code/languages/rust.ts
+var NUMBER2 = String.raw`\b(?:0[xX][\da-fA-F_]+|0[bB][01_]+|0[oO][0-7_]+|\d[\d_]*(?:\.\d[\d_]*)?(?:[eE][+-]?\d+)?)(?:[iuf](?:8|16|32|64|128|size))?\b`;
+var rust = {
+  name: "rust",
+  aliases: ["rs"],
+  rules: [
+    { type: "comment", match: LINE_COMMENT },
+    { type: "comment", match: BLOCK_COMMENT },
+    { type: "meta", match: String.raw`#!?\[[^\]\n]*\]` },
+    { type: "string", match: String.raw`b?r#*"[^]*?(?:"#*|$)` },
+    { type: "string", match: String.raw`b?"(?:[^"\\]|\\[^])*"?` },
+    { type: "string", match: String.raw`b?'(?:[^'\\\n]|\\[^])'` },
+    { type: "variable", match: String.raw`'[a-z_]\w*\b(?!')` },
+    { type: "function", match: String.raw`\b[a-z_]\w*!(?=[\s(\[{])` },
+    { type: "number", match: NUMBER2 },
+    { type: "property", match: MEMBER },
+    { type: "operator", match: String.raw`->|=>|::|\.\.=?|` + C_OPERATOR },
+    { type: "punctuation", match: PUNCTUATION + "|#" }
+  ],
+  keywords: [
+    "as",
+    "async",
+    "await",
+    "break",
+    "const",
+    "continue",
+    "crate",
+    "dyn",
+    "else",
+    "enum",
+    "extern",
+    "fn",
+    "for",
+    "if",
+    "impl",
+    "in",
+    "let",
+    "loop",
+    "match",
+    "mod",
+    "move",
+    "mut",
+    "pub",
+    "ref",
+    "return",
+    "self",
+    "Self",
+    "static",
+    "struct",
+    "super",
+    "trait",
+    "type",
+    "union",
+    "unsafe",
+    "use",
+    "where",
+    "while"
+  ],
+  types: [
+    "bool",
+    "char",
+    "f32",
+    "f64",
+    "i8",
+    "i16",
+    "i32",
+    "i64",
+    "i128",
+    "isize",
+    "str",
+    "u8",
+    "u16",
+    "u32",
+    "u64",
+    "u128",
+    "usize",
+    "String",
+    "Vec",
+    "Option",
+    "Result",
+    "Box",
+    "Rc",
+    "Arc",
+    "HashMap",
+    "HashSet"
+  ],
+  constants: ["true", "false", "None", "Some", "Ok", "Err"],
+  callIsFunction: true,
+  capitalizedIsType: true
+};
+
+// src/code/languages/shell.ts
+var shell = {
+  name: "shell",
+  aliases: ["sh", "bash", "zsh", "console", "shellsession"],
+  rules: [
+    { type: "variable", match: String.raw`\$\{[^}\n]*\}|\$\w+|\$[@#?*!$-]` },
+    { type: "comment", match: String.raw`(?<=^|\s)#[^\n]*` },
+    { type: "string", match: String.raw`"(?:[^"\\\n]|\\[^])*"?` },
+    { type: "string", match: String.raw`'[^'\n]*'?` },
+    { type: "punctuation", match: String.raw`(?<=^|\n)[$#](?=\s)` },
+    { type: "attr", match: String.raw`(?<=\s)--?[A-Za-z][\w-]*` },
+    { type: "operator", match: String.raw`\|\|?|&&?|;;?|[<>]+|=` },
+    { type: "punctuation", match: String.raw`[(){}\[\]]` }
+  ],
+  identifier: String.raw`[A-Za-z_][\w.-]*`,
+  keywords: [
+    "if",
+    "then",
+    "else",
+    "elif",
+    "fi",
+    "for",
+    "while",
+    "until",
+    "do",
+    "done",
+    "case",
+    "esac",
+    "in",
+    "function",
+    "select",
+    "time",
+    "return",
+    "exit",
+    "local",
+    "export",
+    "readonly",
+    "declare",
+    "set",
+    "unset",
+    "shift",
+    "source",
+    "alias",
+    "break",
+    "continue"
+  ],
+  builtins: [
+    "echo",
+    "cd",
+    "ls",
+    "pwd",
+    "cat",
+    "grep",
+    "sed",
+    "awk",
+    "mkdir",
+    "rm",
+    "cp",
+    "mv",
+    "chmod",
+    "chown",
+    "curl",
+    "wget",
+    "git",
+    "npm",
+    "pnpm",
+    "yarn",
+    "npx",
+    "node",
+    "python",
+    "python3",
+    "pip",
+    "docker",
+    "kubectl",
+    "sudo",
+    "test",
+    "printf",
+    "read",
+    "eval",
+    "exec",
+    "trap",
+    "wait",
+    "kill",
+    "ps",
+    "tar",
+    "zip",
+    "unzip",
+    "touch",
+    "find",
+    "xargs",
+    "sort",
+    "uniq",
+    "head",
+    "tail",
+    "wc",
+    "tee",
+    "which",
+    "env",
+    "ssh",
+    "scp",
+    "make",
+    "cargo",
+    "go",
+    "brew",
+    "apt",
+    "apt-get",
+    "gradle",
+    "mvn",
+    "java",
+    "jq",
+    "true",
+    "false"
+  ]
+};
+
+// src/code/languages/sql.ts
+var sql = {
+  name: "sql",
+  aliases: ["mysql", "postgres", "postgresql", "pgsql", "plsql", "sqlite", "soql"],
+  caseInsensitive: true,
+  rules: [
+    { type: "comment", match: String.raw`--[^\n]*` },
+    { type: "comment", match: BLOCK_COMMENT },
+    { type: "string", match: String.raw`'(?:[^'\n]|'')*'?` },
+    { type: "variable", match: String.raw`[@:]\w+|\$\d+` },
+    { type: "number", match: String.raw`\b\d+(?:\.\d+)?(?:[eE][+-]?\d+)?\b` },
+    { type: "operator", match: String.raw`\|\||::|[-+*/%=<>!]+` },
+    { type: "punctuation", match: String.raw`[(),;.]` }
+  ],
+  keywords: [
+    "add",
+    "all",
+    "alter",
+    "and",
+    "as",
+    "asc",
+    "begin",
+    "between",
+    "by",
+    "cascade",
+    "case",
+    "check",
+    "column",
+    "commit",
+    "constraint",
+    "create",
+    "cross",
+    "default",
+    "delete",
+    "desc",
+    "distinct",
+    "drop",
+    "else",
+    "end",
+    "except",
+    "exists",
+    "foreign",
+    "from",
+    "full",
+    "group",
+    "having",
+    "if",
+    "in",
+    "index",
+    "inner",
+    "insert",
+    "intersect",
+    "into",
+    "is",
+    "join",
+    "key",
+    "left",
+    "like",
+    "limit",
+    "not",
+    "null",
+    "offset",
+    "on",
+    "or",
+    "order",
+    "outer",
+    "primary",
+    "references",
+    "returning",
+    "right",
+    "rollback",
+    "select",
+    "set",
+    "table",
+    "then",
+    "top",
+    "transaction",
+    "truncate",
+    "union",
+    "unique",
+    "update",
+    "using",
+    "values",
+    "view",
+    "when",
+    "where",
+    "with",
+    "recursive",
+    "ilike",
+    "over",
+    "partition",
+    "window",
+    "rows",
+    "range",
+    "fetch",
+    "first",
+    "next",
+    "only",
+    "nulls",
+    "last",
+    "explain",
+    "analyze",
+    "grant",
+    "revoke",
+    "schema",
+    "database",
+    "trigger",
+    "procedure",
+    "function",
+    "returns",
+    "declare",
+    "cursor",
+    "loop",
+    "while",
+    "for",
+    "exec",
+    "execute",
+    "merge",
+    "matched",
+    "replace",
+    "ignore",
+    "conflict",
+    "do",
+    "nothing",
+    "nowait",
+    "lock",
+    "share",
+    "lateral",
+    "natural",
+    "any",
+    "some",
+    "escape"
+  ],
+  types: [
+    "int",
+    "integer",
+    "bigint",
+    "smallint",
+    "tinyint",
+    "varchar",
+    "char",
+    "text",
+    "boolean",
+    "bool",
+    "date",
+    "timestamp",
+    "timestamptz",
+    "time",
+    "interval",
+    "decimal",
+    "numeric",
+    "float",
+    "real",
+    "double",
+    "serial",
+    "bigserial",
+    "uuid",
+    "json",
+    "jsonb",
+    "bytea",
+    "blob",
+    "array",
+    "money",
+    "precision",
+    "varying"
+  ],
+  builtins: [
+    "count",
+    "sum",
+    "avg",
+    "min",
+    "max",
+    "coalesce",
+    "now",
+    "cast",
+    "concat",
+    "lower",
+    "upper",
+    "length",
+    "substring",
+    "round",
+    "trim",
+    "nullif",
+    "greatest",
+    "least",
+    "array_agg",
+    "string_agg",
+    "json_agg",
+    "row_number",
+    "rank",
+    "dense_rank",
+    "date_trunc",
+    "extract",
+    "current_date",
+    "current_timestamp",
+    "current_user",
+    "exists",
+    "abs",
+    "ceil",
+    "floor",
+    "random",
+    "generate_series"
+  ],
+  constants: ["true", "false", "null", "unknown"],
+  callIsFunction: true
+};
+
+// src/code/languages/yaml.ts
+var LINE_START = String.raw`(?<=^|\n)`;
+var KEY = String.raw`(?<=^|\n|\s|-\s)(?:"(?:[^"\\\n]|\\[^])*"|'(?:[^'\n]|'')*'|[^\s"'#\-\[\]{},:!&*?|>][^:#\n]*?)(?=:(?:\s|$))`;
+var yaml = {
+  name: "yaml",
+  aliases: ["yml"],
+  rules: [
+    { type: "comment", match: String.raw`(?<=^|\s)#[^\n]*` },
+    { type: "meta", match: LINE_START + String.raw`(?:---|\.\.\.)(?=\s|$)` },
+    { type: "property", match: KEY },
+    { type: "variable", match: String.raw`[&*][\w-]+` },
+    { type: "meta", match: String.raw`![\w!/:-]*` },
+    { type: "string", match: String.raw`"(?:[^"\\\n]|\\[^])*"?` },
+    { type: "string", match: String.raw`'(?:[^'\n]|'')*'?` },
+    { type: "punctuation", match: String.raw`(?<=:\s*)[|>][-+]?\d*(?=[ \t]*(?:\n|$|#))` },
+    { type: "punctuation", match: String.raw`(?<=^|\n|\s)-(?=\s)|[\[\]{},:]` },
+    { type: "constant", match: String.raw`(?<=:\s)~(?=\s|$)` },
+    {
+      type: "number",
+      match: String.raw`(?<![\w.-])[-+]?(?:0x[\da-fA-F]+|\d[\d_]*(?:\.\d*)?(?:[eE][+-]?\d+)?|\.inf|\.nan)(?![\w.-])`
+    }
+  ],
+  constants: [
+    "true",
+    "false",
+    "null",
+    "yes",
+    "no",
+    "on",
+    "off",
+    "True",
+    "False",
+    "Null",
+    "Yes",
+    "No",
+    "On",
+    "Off",
+    "TRUE",
+    "FALSE",
+    "NULL",
+    "YES",
+    "NO",
+    "ON",
+    "OFF"
+  ]
+};
+
+// src/code/languages/index.ts
+var BUILTIN_CODE_LANGUAGES = [
+  javascript,
+  kotlin,
+  java,
+  c,
+  python,
+  go,
+  rust,
+  json,
+  yaml,
+  shell,
+  sql,
+  css,
+  markup,
+  diff,
+  markdown
+];
+for (const grammar of BUILTIN_CODE_LANGUAGES) registerCodeLanguage(grammar);
+
+// src/code/lexer.ts
+var DEFAULT_IDENTIFIER = String.raw`[A-Za-z_$][\w$]*`;
+var WHITESPACE = String.raw`\s+`;
+var SCREAMING_CASE = /^[A-Z][A-Z\d_]+$/;
+var CAPITALIZED = /^[A-Z]/;
+var compiled = /* @__PURE__ */ new WeakMap();
+function countGroups(source) {
+  return new RegExp(`${source}|`).exec("").length - 1;
+}
+function compile(grammar) {
+  const cached = compiled.get(grammar);
+  if (cached) return cached;
+  const rules = [...grammar.rules, "whitespace", "identifier"];
+  const sources = rules.map((rule) => {
+    if (rule === "whitespace") return WHITESPACE;
+    if (rule === "identifier") return grammar.identifier ?? DEFAULT_IDENTIFIER;
+    return rule.match;
+  });
+  const groupStarts = [];
+  let group = 1;
+  for (const source of sources) {
+    groupStarts.push(group);
+    group += 1 + countGroups(source);
+  }
+  const regex = new RegExp(
+    sources.map((source) => `(${source})`).join("|"),
+    grammar.caseInsensitive ? "yi" : "y"
+  );
+  const words = /* @__PURE__ */ new Map();
+  const addWords = (list, type) => {
+    for (const word of list ?? []) {
+      words.set(grammar.caseInsensitive ? word.toLowerCase() : word, type);
+    }
+  };
+  addWords(grammar.builtins, "builtin");
+  addWords(grammar.types, "type");
+  addWords(grammar.constants, "constant");
+  addWords(grammar.keywords, "keyword");
+  const result = { regex, groupStarts, rules, words };
+  compiled.set(grammar, result);
+  return result;
+}
+function isCallee(code, end) {
+  let i = end;
+  while (code[i] === " " || code[i] === "	") i++;
+  return code[i] === "(";
+}
+function classifyIdentifier(word, grammar, words, code, end) {
+  const known = words.get(grammar.caseInsensitive ? word.toLowerCase() : word);
+  if (known) return known;
+  if (grammar.capitalizedIsType) {
+    if (SCREAMING_CASE.test(word)) return "constant";
+    if (CAPITALIZED.test(word)) return "type";
+  }
+  if (grammar.callIsFunction && isCallee(code, end)) return "function";
+  return "text";
+}
+function matchedRule(match, compiled2) {
+  const { groupStarts, rules } = compiled2;
+  for (let i = 0; i < groupStarts.length; i++) {
+    if (match[groupStarts[i]] !== void 0) return rules[i];
+  }
+  throw new Error("zui code lexer: no alternative matched");
+}
+function tokenizeCode(code, grammar) {
+  const c2 = compile(grammar);
+  const tokens = [];
+  const push = (type, text) => {
+    const last = tokens[tokens.length - 1];
+    if (last && last.type === type) {
+      tokens[tokens.length - 1] = { type, text: last.text + text };
+    } else {
+      tokens.push({ type, text });
+    }
+  };
+  let pos = 0;
+  let textStart = 0;
+  const flushText = (end) => {
+    if (end > textStart) push("text", code.slice(textStart, end));
+  };
+  while (pos < code.length) {
+    c2.regex.lastIndex = pos;
+    const match = c2.regex.exec(code);
+    if (match === null || match[0].length === 0) {
+      pos += 1;
+      continue;
+    }
+    const text = match[0];
+    const end = pos + text.length;
+    const rule = matchedRule(match, c2);
+    let type;
+    if (rule === "whitespace") type = "text";
+    else if (rule === "identifier") type = classifyIdentifier(text, grammar, c2.words, code, end);
+    else type = rule.type;
+    if (type !== "text") {
+      flushText(pos);
+      push(type, text);
+      textStart = end;
+    }
+    pos = end;
+  }
+  flushText(code.length);
+  return tokens;
+}
+
+// src/code/lexicalTokenizer.ts
+import {
+  $createLineBreakNode,
+  $createTabNode,
+  $nodesOfType
+} from "lexical";
+import { $createCodeHighlightNode, CodeNode, registerCodeHighlighting } from "@lexical/code";
+import { mergeRegister } from "@lexical/utils";
+var MAX_HIGHLIGHT_LENGTH = 2e5;
+function grammarFor(code, language) {
+  return code.length > MAX_HIGHLIGHT_LENGTH ? PLAIN : resolveCodeLanguage(language);
+}
+var codeTokenizer = {
+  defaultLanguage: PLAIN_LANGUAGE,
+  tokenize(code, language) {
+    return tokenizeCode(code, grammarFor(code, language)).map(
+      (token) => token.type === "text" ? token.text : { type: token.type, alias: "", content: token.text }
+    );
+  },
+  $tokenize(codeNode, language) {
+    const code = codeNode.getTextContent();
+    const nodes = [];
+    for (const { type, text } of tokenizeCode(code, grammarFor(code, language))) {
+      const highlightType = type === "text" ? void 0 : type;
+      for (const part of text.split(/(\n|\t)/)) {
+        if (part === "\n") nodes.push($createLineBreakNode());
+        else if (part === "	") nodes.push($createTabNode());
+        else if (part.length > 0) nodes.push($createCodeHighlightNode(part, highlightType));
+      }
+    }
+    return nodes;
+  }
+};
+function openLanguageGate(language) {
+  const prism = globalThis.Prism;
+  const table = prism?.languages;
+  if (!table || Object.prototype.hasOwnProperty.call(table, language)) return false;
+  table[language] = {};
+  return true;
+}
+function registerCodeBlockHighlighting(editor) {
+  const unregister = mergeRegister(
+    editor.registerNodeTransform(CodeNode, (node) => {
+      const language = node.getLanguage();
+      if (language && openLanguageGate(language)) node.markDirty();
+    }),
+    registerCodeHighlighting(editor, codeTokenizer)
+  );
+  editor.update(
+    () => {
+      for (const node of $nodesOfType(CodeNode)) node.markDirty();
+    },
+    { tag: "history-merge" }
+  );
+  return unregister;
+}
+
+// src/code/types.ts
+var CODE_TOKEN_TYPES = [
+  "comment",
+  "string",
+  "number",
+  "keyword",
+  "builtin",
+  "type",
+  "function",
+  "property",
+  "variable",
+  "constant",
+  "operator",
+  "punctuation",
+  "tag",
+  "attr",
+  "regex",
+  "meta",
+  "inserted",
+  "deleted"
+];
+
+// src/plugins/CodeHighlightPlugin.tsx
 function CodeHighlightPlugin() {
   const [editor] = useLexicalComposerContext3();
-  useEffect3(() => {
-    return registerCodeHighlighting(editor);
-  }, [editor]);
+  useEffect3(() => registerCodeBlockHighlighting(editor), [editor]);
   return null;
 }
 
@@ -199,8 +1598,8 @@ function MarkdownSyncPlugin({
         if (dirtyElements.size === 0 && dirtyLeaves.size === 0) return;
         if (tags.has("initial-load")) return;
         editorState.read(() => {
-          const markdown = $convertToMarkdownString(transformers);
-          onChangeRef.current?.(markdown);
+          const markdown2 = $convertToMarkdownString(transformers);
+          onChangeRef.current?.(markdown2);
         });
       }
     );
@@ -211,7 +1610,7 @@ function MarkdownSyncPlugin({
 // src/nodes/FrontmatterNode.ts
 import {
   $applyNodeReplacement,
-  $createLineBreakNode,
+  $createLineBreakNode as $createLineBreakNode2,
   $createTextNode,
   ElementNode
 } from "lexical";
@@ -280,7 +1679,7 @@ ${body}
     while (lines.length > 0 && lines[lines.length - 1].length === 0) lines.pop();
     const node = $createFrontmatterNode();
     lines.forEach((line, index) => {
-      if (index > 0) node.append($createLineBreakNode());
+      if (index > 0) node.append($createLineBreakNode2());
       node.append($createTextNode(line));
     });
     rootNode.append(node);
@@ -300,12 +1699,26 @@ import {
   useEffect as useEffect7,
   useMemo,
   useRef as useRef4,
-  useState as useState3
+  useState as useState3,
+  useContext as useContext2
 } from "react";
 import { $getNodeByKey as $getNodeByKey2 } from "lexical";
 import { useLexicalComposerContext as useLexicalComposerContext5 } from "@lexical/react/LexicalComposerContext";
 import { useLexicalEditable } from "@lexical/react/useLexicalEditable";
 
+// src/editorContext.ts
+import { createContext, useContext } from "react";
+var EditorContext = createContext(null);
+function useEditorContext() {
+  const ctx = useContext(EditorContext);
+  if (!ctx) {
+    throw new Error(
+      "@zuilib/text-editor: this component must be rendered inside <MarkdownEditor> or <MarkdownEditor.Root>"
+    );
+  }
+  return ctx;
+}
+
 // src/drawing/focusCommand.ts
 import { createCommand } from "lexical";
 var DRAWING_FOCUS_COMMAND = createCommand(
@@ -381,9 +1794,9 @@ var SIDE_FIXED_POINTS = {
 function serializeDrawingData(data) {
   return JSON.stringify(data);
 }
-function parseDrawingData(json) {
+function parseDrawingData(json2) {
   try {
-    return normalizeDrawingData(JSON.parse(json));
+    return normalizeDrawingData(JSON.parse(json2));
   } catch {
     return EMPTY_DRAWING;
   }
@@ -531,7 +1944,7 @@ function bbox(shape) {
     h: Math.abs(shape.h)
   };
 }
-function normalize(shape) {
+function normalize2(shape) {
   if (isConnectorType(shape.type)) return shape;
   if (shape.w >= 0 && shape.h >= 0) return shape;
   const b = bbox(shape);
@@ -573,10 +1986,10 @@ function manhattan(a, b) {
   return Math.abs(a.x - b.x) + Math.abs(a.y - b.y);
 }
 function ellipsePolygon(r, segments = 40) {
-  const c = rectCenter(r);
+  const c2 = rectCenter(r);
   return Array.from({ length: segments }, (_, i) => {
     const a = i * 2 * Math.PI / segments;
-    return { x: c.x + r.w / 2 * Math.cos(a), y: c.y + r.h / 2 * Math.sin(a) };
+    return { x: c2.x + r.w / 2 * Math.cos(a), y: c2.y + r.h / 2 * Math.sin(a) };
   });
 }
 function rectPolygon(r) {
@@ -739,23 +2152,23 @@ var BOX_DEFINITIONS = {
     defaultFill: "#ffec99",
     outline: (s) => {
       const b = bbox(s);
-      const f = NOTE_FOLD(b);
+      const f3 = NOTE_FOLD(b);
       return [
         { x: b.x, y: b.y },
         { x: b.x + b.w, y: b.y },
-        { x: b.x + b.w, y: b.y + b.h - f },
-        { x: b.x + b.w - f, y: b.y + b.h },
+        { x: b.x + b.w, y: b.y + b.h - f3 },
+        { x: b.x + b.w - f3, y: b.y + b.h },
         { x: b.x, y: b.y + b.h }
       ];
     },
     textArea: (s) => {
       const b = bbox(s);
-      const f = NOTE_FOLD(b);
+      const f3 = NOTE_FOLD(b);
       return {
         x: b.x + BOX_TEXT_PADDING,
         y: b.y + BOX_TEXT_PADDING,
         w: Math.max(b.w - BOX_TEXT_PADDING * 2, 20),
-        h: Math.max(b.h - BOX_TEXT_PADDING * 2 - f / 2, 10)
+        h: Math.max(b.h - BOX_TEXT_PADDING * 2 - f3 / 2, 10)
       };
     }
   },
@@ -898,7 +2311,7 @@ function fixedPointFor(box, point) {
     [fy * b.h, "fy", 0],
     [(1 - fy) * b.h, "fy", 1]
   ];
-  edges.sort((a, c) => a[0] - c[0]);
+  edges.sort((a, c2) => a[0] - c2[0]);
   const [, axis, value] = edges[0];
   const snapped = axis === "fx" ? [value, fy] : [fx, value];
   return [round3(snapped[0]), round3(snapped[1])];
@@ -920,9 +2333,9 @@ function bindingHeading(box, binding, toward) {
   const fixed = edgeHeading(binding);
   if (fixed) return fixed;
   const b = bbox(box);
-  const c = center(box);
-  const dx = (toward.x - c.x) / Math.max(b.w, 1);
-  const dy = (toward.y - c.y) / Math.max(b.h, 1);
+  const c2 = center(box);
+  const dx = (toward.x - c2.x) / Math.max(b.w, 1);
+  const dy = (toward.y - c2.y) / Math.max(b.h, 1);
   if (Math.abs(dx) >= Math.abs(dy)) return dx >= 0 ? "right" : "left";
   return dy >= 0 ? "down" : "up";
 }
@@ -1192,17 +2605,17 @@ function simplify(points) {
   return out;
 }
 function applyElbowOverride(points, t, obstacles) {
-  const [a, b, c, d] = points;
-  const horizontalMiddle = Math.abs(b.y - c.y) < 0.01 && Math.abs(b.x - c.x) > 0.01;
-  const verticalMiddle = Math.abs(b.x - c.x) < 0.01 && Math.abs(b.y - c.y) > 0.01;
+  const [a, b, c2, d] = points;
+  const horizontalMiddle = Math.abs(b.y - c2.y) < 0.01 && Math.abs(b.x - c2.x) > 0.01;
+  const verticalMiddle = Math.abs(b.x - c2.x) < 0.01 && Math.abs(b.y - c2.y) > 0.01;
   const clamped = Math.min(0.95, Math.max(0.05, t));
   let next;
   if (verticalMiddle) {
     const x = a.x + (d.x - a.x) * clamped;
-    next = [a, { x, y: b.y }, { x, y: c.y }, d];
+    next = [a, { x, y: b.y }, { x, y: c2.y }, d];
   } else if (horizontalMiddle) {
     const y = a.y + (d.y - a.y) * clamped;
-    next = [a, { x: b.x, y }, { x: c.x, y }, d];
+    next = [a, { x: b.x, y }, { x: c2.x, y }, d];
   } else {
     return points;
   }
@@ -1257,13 +2670,17 @@ function segmentAngleAt(points, index, backward) {
   }
   return 0;
 }
-function arrowHeadPath(tip, angle, length) {
+function arrowHeadPoints(tip, angle, length) {
   const spread = Math.PI / 7;
-  const hx1 = tip.x - length * Math.cos(angle - spread);
-  const hy1 = tip.y - length * Math.sin(angle - spread);
-  const hx2 = tip.x - length * Math.cos(angle + spread);
-  const hy2 = tip.y - length * Math.sin(angle + spread);
-  return `M ${fmt(hx1)} ${fmt(hy1)} L ${fmt(tip.x)} ${fmt(tip.y)} L ${fmt(hx2)} ${fmt(hy2)}`;
+  return [
+    { x: tip.x - length * Math.cos(angle - spread), y: tip.y - length * Math.sin(angle - spread) },
+    tip,
+    { x: tip.x - length * Math.cos(angle + spread), y: tip.y - length * Math.sin(angle + spread) }
+  ];
+}
+function arrowHeadPath(tip, angle, length) {
+  const [a, t, b] = arrowHeadPoints(tip, angle, length);
+  return `M ${fmt(a.x)} ${fmt(a.y)} L ${fmt(t.x)} ${fmt(t.y)} L ${fmt(b.x)} ${fmt(b.y)}`;
 }
 function pathLength(points) {
   let total = 0;
@@ -1569,9 +2986,9 @@ var STROKE_WIDTH = 2;
 function isDrawingSkeleton(value) {
   return isRecord2(value) && Array.isArray(value.boxes);
 }
-function parseDrawingSkeleton(json) {
+function parseDrawingSkeleton(json2) {
   try {
-    const parsed = JSON.parse(json);
+    const parsed = JSON.parse(json2);
     if (!isDrawingSkeleton(parsed)) return EMPTY_DRAWING;
     return expandSkeleton(normalizeSkeleton(parsed));
   } catch {
@@ -1584,7 +3001,7 @@ function expandSkeleton(skeleton) {
   const sizes = new Map(boxes.map((box) => [box.id, measureBox(box, boxTypes.get(box.id))]));
   const boxIds = new Set(boxTypes.keys());
   const connectors = (skeleton.connectors ?? []).filter(
-    (c) => boxIds.has(endId(c.from)) && boxIds.has(endId(c.to)) && endId(c.from) !== endId(c.to)
+    (c2) => boxIds.has(endId(c2.from)) && boxIds.has(endId(c2.to)) && endId(c2.from) !== endId(c2.to)
   );
   const positions = layoutBoxes(boxes, sizes, connectors, skeleton.direction ?? "right");
   const boxShapes = boxes.map(
@@ -1599,7 +3016,7 @@ function expandSkeleton(skeleton) {
     used.add(id);
     return id;
   };
-  const connectorShapes = connectors.map((c) => expandConnector(c, centers, nextId("c")));
+  const connectorShapes = connectors.map((c2) => expandConnector(c2, centers, nextId("c")));
   const textShapes = (skeleton.texts ?? []).map((t) => expandText(t, nextId("t")));
   const shapes = resolveBindings([...boxShapes, ...connectorShapes, ...textShapes]);
   const bottom = shapes.reduce((max, shape) => {
@@ -1652,7 +3069,7 @@ function layoutBoxes(boxes, sizes, connectors, direction) {
   const positions = /* @__PURE__ */ new Map();
   const auto = boxes.filter((box) => box.x === void 0 || box.y === void 0);
   const autoIds = new Set(auto.map((box) => box.id));
-  const edges = connectors.map((c) => ({ from: endId(c.from), to: endId(c.to) })).filter((e) => e.from !== e.to && autoIds.has(e.from) && autoIds.has(e.to));
+  const edges = connectors.map((c2) => ({ from: endId(c2.from), to: endId(c2.to) })).filter((e) => e.from !== e.to && autoIds.has(e.from) && autoIds.has(e.to));
   const ranks = rankNodes(
     auto.map((box) => box.id),
     acyclicEdges(
@@ -1671,7 +3088,7 @@ function layoutBoxes(boxes, sizes, connectors, direction) {
   const rowCross = rows.map(
     (row) => row.reduce((sum, id) => sum + sizes.get(id)[cross], 0) + Math.max(0, row.length - 1) * STACK_GAP
   );
-  const maxCross = rowCross.reduce((max, c) => Math.max(max, c), 0);
+  const maxCross = rowCross.reduce((max, c2) => Math.max(max, c2), 0);
   let mainOffset = LAYOUT_ORIGIN;
   rows.forEach((row, rank) => {
     let crossOffset = LAYOUT_ORIGIN + (maxCross - rowCross[rank]) / 2;
@@ -1800,8 +3217,8 @@ function normalizeSkeleton(raw) {
     const box = normalizeBox(b);
     return box ? [box] : [];
   });
-  const connectors = Array.isArray(value.connectors) ? value.connectors.flatMap((c) => {
-    const connector = normalizeConnector(c);
+  const connectors = Array.isArray(value.connectors) ? value.connectors.flatMap((c2) => {
+    const connector = normalizeConnector(c2);
     return connector ? [connector] : [];
   }) : [];
   const texts = Array.isArray(value.texts) ? value.texts.flatMap((t) => {
@@ -2375,7 +3792,7 @@ function BoxGeometry({
         }
       );
     case "note": {
-      const f = NOTE_FOLD(b);
+      const f3 = NOTE_FOLD(b);
       const r = b.x + b.w;
       const btm = b.y + b.h;
       return /* @__PURE__ */ jsxs4("g", { children: [
@@ -2383,7 +3800,7 @@ function BoxGeometry({
           "path",
           {
             ...stroke,
-            d: `M ${n(b.x)} ${n(b.y)} H ${n(r)} V ${n(btm - f)} L ${n(r - f)} ${n(btm)} H ${n(b.x)} Z`,
+            d: `M ${n(b.x)} ${n(b.y)} H ${n(r)} V ${n(btm - f3)} L ${n(r - f3)} ${n(btm)} H ${n(b.x)} Z`,
             fill
           }
         ),
@@ -2391,7 +3808,7 @@ function BoxGeometry({
           "path",
           {
             ...stroke,
-            d: `M ${n(r - f)} ${n(btm)} V ${n(btm - f)} H ${n(r)}`,
+            d: `M ${n(r - f3)} ${n(btm)} V ${n(btm - f3)} H ${n(r)}`,
             fill: "rgba(0,0,0,0.08)"
           }
         )
@@ -2474,8 +3891,385 @@ function BoxGeometry({
   }
 }
 
-// src/drawing/canvas/ShapeView.tsx
+// src/drawing/ink.ts
+var SAMPLE_STEP = 5;
+var PRESSURE = 0.3;
+function seedFrom(text) {
+  let h = 2166136261;
+  for (let i = 0; i < text.length; i++) {
+    h ^= text.charCodeAt(i);
+    h = Math.imul(h, 16777619);
+  }
+  return h >>> 0;
+}
+function mulberry32(seed) {
+  let a = seed >>> 0;
+  return () => {
+    a = a + 1831565813 | 0;
+    let t = Math.imul(a ^ a >>> 15, 1 | a);
+    t = t + Math.imul(t ^ t >>> 7, 61 | t) ^ t;
+    return ((t ^ t >>> 14) >>> 0) / 4294967296;
+  };
+}
+function inkAmplitude(size) {
+  return Math.min(4, Math.max(1, size * 0.03));
+}
+function inkFillOffset(seed) {
+  const rand = mulberry32(seed ^ 2654435769);
+  const angle = rand() * Math.PI * 2;
+  const d = 2 + rand();
+  return { x: Math.cos(angle) * d, y: Math.sin(angle) * d };
+}
+function makeField(seed, amplitude, closed) {
+  const rand = mulberry32(seed);
+  const int = (lo, span) => lo + Math.floor(rand() * span);
+  const f1 = closed ? int(2, 2) : 1.5 + rand();
+  const f22 = closed ? int(5, 3) : 3 + rand() * 2;
+  const g = closed ? int(2, 2) : 1 + rand();
+  const p1 = rand() * Math.PI * 2;
+  const p2 = rand() * Math.PI * 2;
+  const pg = rand() * Math.PI * 2;
+  const a1 = amplitude * (0.55 + rand() * 0.15);
+  const a2 = amplitude * 0.3;
+  const TAU = Math.PI * 2;
+  return {
+    offset: (t) => a1 * Math.sin(TAU * f1 * t + p1) + a2 * Math.sin(TAU * f22 * t + p2),
+    pressure: (t) => 1 + PRESSURE * Math.sin(TAU * g * t + pg)
+  };
+}
+function resample(points, closed) {
+  const src = closed ? [...points, points[0]] : [...points];
+  const lengths = [];
+  let total = 0;
+  for (let i = 1; i < src.length; i++) {
+    const l = Math.hypot(src[i].x - src[i - 1].x, src[i].y - src[i - 1].y);
+    lengths.push(l);
+    total += l;
+  }
+  if (total === 0) return { points: [src[0]], ts: [0] };
+  const out = [];
+  const ts = [];
+  let walked = 0;
+  for (let i = 1; i < src.length; i++) {
+    const a = src[i - 1];
+    const b = src[i];
+    const l = lengths[i - 1];
+    const n2 = Math.max(1, Math.round(l / SAMPLE_STEP));
+    for (let k = 0; k < n2; k++) {
+      const u = k / n2;
+      out.push({ x: a.x + (b.x - a.x) * u, y: a.y + (b.y - a.y) * u });
+      ts.push((walked + l * u) / total);
+    }
+    walked += l;
+  }
+  if (!closed) {
+    out.push(src[src.length - 1]);
+    ts.push(1);
+  }
+  return { points: out, ts };
+}
+function normalAt(points, i, closed) {
+  const n2 = points.length;
+  const prev = points[closed ? (i - 1 + n2) % n2 : Math.max(0, i - 1)];
+  const next = points[closed ? (i + 1) % n2 : Math.min(n2 - 1, i + 1)];
+  const tx = next.x - prev.x;
+  const ty = next.y - prev.y;
+  const len = Math.hypot(tx, ty) || 1;
+  return { x: -ty / len, y: tx / len };
+}
+var f = (v) => Number.isInteger(v) ? String(v) : v.toFixed(2);
+var pathOf = (points) => points.map((p, i) => `${i === 0 ? "M" : "L"} ${f(p.x)} ${f(p.y)}`).join(" ");
+function inkStroke(points, options) {
+  if (points.length < 2) return { ring: "", center: "" };
+  const { closed, seed, width, amplitude } = options;
+  const field = makeField(seed, amplitude, closed);
+  const { points: pts, ts } = resample(points, closed);
+  if (pts.length < 2) return { ring: "", center: "" };
+  const center2 = [];
+  const outer = [];
+  const inner = [];
+  for (let i = 0; i < pts.length; i++) {
+    const t = ts[i];
+    const nrm = normalAt(pts, i, closed);
+    const off = field.offset(t);
+    const c2 = { x: pts[i].x + nrm.x * off, y: pts[i].y + nrm.y * off };
+    const taper = closed ? 1 : 0.55 + 0.45 * Math.min(1, t / 0.1, (1 - t) / 0.1);
+    const half = width * field.pressure(t) * taper / 2;
+    center2.push(c2);
+    outer.push({ x: c2.x + nrm.x * half, y: c2.y + nrm.y * half });
+    inner.push({ x: c2.x - nrm.x * half, y: c2.y - nrm.y * half });
+  }
+  if (closed) {
+    return {
+      ring: `${pathOf(outer)} Z ${pathOf([...inner].reverse())} Z`,
+      center: `${pathOf(center2)} Z`
+    };
+  }
+  return {
+    ring: `${pathOf(outer)} ${pathOf([...inner].reverse()).replace(/^M/, "L")} Z`,
+    center: pathOf(center2)
+  };
+}
+function roundedRectPolygon(r, radius, segments = 4) {
+  const rad = Math.min(radius, r.w / 2, r.h / 2);
+  if (rad <= 0) {
+    return [
+      { x: r.x, y: r.y },
+      { x: r.x + r.w, y: r.y },
+      { x: r.x + r.w, y: r.y + r.h },
+      { x: r.x, y: r.y + r.h }
+    ];
+  }
+  const corners = [
+    [r.x + r.w - rad, r.y + rad, -Math.PI / 2],
+    [r.x + r.w - rad, r.y + r.h - rad, 0],
+    [r.x + rad, r.y + r.h - rad, Math.PI / 2],
+    [r.x + rad, r.y + rad, Math.PI]
+  ];
+  const out = [];
+  for (const [cx, cy, start] of corners) {
+    for (let i = 0; i <= segments; i++) {
+      const a = start + Math.PI / 2 * (i / segments);
+      out.push({ x: cx + rad * Math.cos(a), y: cy + rad * Math.sin(a) });
+    }
+  }
+  return out;
+}
+function roundedPolyline(points, cornerRadius = 6, segments = 4) {
+  if (points.length < 3) return [...points];
+  const out = [points[0]];
+  for (let i = 1; i < points.length - 1; i++) {
+    const prev = points[i - 1];
+    const p = points[i];
+    const next = points[i + 1];
+    const inLen = Math.hypot(p.x - prev.x, p.y - prev.y);
+    const outLen = Math.hypot(next.x - p.x, next.y - p.y);
+    const r = Math.min(cornerRadius, inLen / 2, outLen / 2);
+    if (r < 0.5) {
+      out.push(p);
+      continue;
+    }
+    const a = { x: p.x - (p.x - prev.x) / inLen * r, y: p.y - (p.y - prev.y) / inLen * r };
+    const b = { x: p.x + (next.x - p.x) / outLen * r, y: p.y + (next.y - p.y) / outLen * r };
+    for (let k = 0; k <= segments; k++) {
+      const u = k / segments;
+      const v = 1 - u;
+      out.push({
+        x: v * v * a.x + 2 * v * u * p.x + u * u * b.x,
+        y: v * v * a.y + 2 * v * u * p.y + u * u * b.y
+      });
+    }
+  }
+  out.push(points[points.length - 1]);
+  return out;
+}
+function sampleCubic(p0, p1, p2, p3, segments = 10) {
+  const out = [];
+  for (let k = 1; k <= segments; k++) {
+    const u = k / segments;
+    const v = 1 - u;
+    out.push({
+      x: v * v * v * p0.x + 3 * v * v * u * p1.x + 3 * v * u * u * p2.x + u * u * u * p3.x,
+      y: v * v * v * p0.y + 3 * v * v * u * p1.y + 3 * v * u * u * p2.y + u * u * u * p3.y
+    });
+  }
+  return out;
+}
+function arcPolygon(cx, cy, rx, ry, from, to, segments = 12) {
+  return Array.from({ length: segments + 1 }, (_, i) => {
+    const a = from + (to - from) * i / segments;
+    return { x: cx + rx * Math.cos(a), y: cy + ry * Math.sin(a) };
+  });
+}
+
+// src/drawing/shapes/inkRender.tsx
 import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+var f2 = (v) => Number.isInteger(v) ? String(v) : v.toFixed(2);
+function extent(points) {
+  let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+  for (const p of points) {
+    if (p.x < minX) minX = p.x;
+    if (p.x > maxX) maxX = p.x;
+    if (p.y < minY) minY = p.y;
+    if (p.y > maxY) maxY = p.y;
+  }
+  return { w: maxX - minX, h: maxY - minY };
+}
+function InkBoxGeometry({ shape }) {
+  const b = bbox(shape);
+  const seed = seedFrom(shape.id);
+  const width = shape.strokeWidth;
+  const off = inkFillOffset(seed);
+  const fillTransform = `translate(${f2(off.x)} ${f2(off.y)})`;
+  const amplitudeOf = (points) => inkAmplitude(Math.min(extent(points).w, extent(points).h));
+  const closed = (points, part, fill = shape.fill) => {
+    const s = inkStroke(points, { closed: true, seed: seed + part, width, amplitude: amplitudeOf(points) });
+    return /* @__PURE__ */ jsxs5("g", { children: [
+      /* @__PURE__ */ jsx5("path", { d: s.center, fill, stroke: "none", transform: fillTransform }),
+      /* @__PURE__ */ jsx5("path", { d: s.ring, fill: shape.stroke, fillRule: "evenodd", stroke: "none" })
+    ] });
+  };
+  const open = (points, part, w = width) => /* @__PURE__ */ jsx5(
+    "path",
+    {
+      d: inkStroke(points, { closed: false, seed: seed + part, width: w, amplitude: amplitudeOf(points) }).ring,
+      fill: shape.stroke,
+      stroke: "none"
+    }
+  );
+  switch (shape.type) {
+    case "rect":
+      return closed(roundedRectPolygon(b, Math.min(8, b.w / 4, b.h / 4)), 0);
+    case "ellipse":
+      return closed(ellipsePolygon(b, 64), 0);
+    case "diamond":
+      return closed(
+        [
+          { x: b.x + b.w / 2, y: b.y },
+          { x: b.x + b.w, y: b.y + b.h / 2 },
+          { x: b.x + b.w / 2, y: b.y + b.h },
+          { x: b.x, y: b.y + b.h / 2 }
+        ],
+        0
+      );
+    case "note": {
+      const fold = NOTE_FOLD(b);
+      const r = b.x + b.w;
+      const btm = b.y + b.h;
+      const fillPts = [
+        { x: b.x, y: b.y },
+        { x: r, y: b.y },
+        { x: r, y: btm - fold },
+        { x: r - fold, y: btm },
+        { x: b.x, y: btm }
+      ];
+      const foldPts = [
+        { x: r - fold, y: btm },
+        { x: r - fold, y: btm - fold },
+        { x: r, y: btm - fold }
+      ];
+      return /* @__PURE__ */ jsxs5("g", { children: [
+        closed(fillPts, 0),
+        /* @__PURE__ */ jsx5(
+          "path",
+          {
+            d: `M ${foldPts.map((p) => `${f2(p.x)} ${f2(p.y)}`).join(" L ")} Z`,
+            fill: "rgba(0,0,0,0.08)",
+            stroke: "none"
+          }
+        ),
+        open(foldPts, 1)
+      ] });
+    }
+    case "cylinder": {
+      const ry = CYLINDER_RY(b);
+      const rx = b.w / 2;
+      const cx = b.x + rx;
+      const body = [
+        { x: b.x, y: b.y + ry },
+        { x: b.x, y: b.y + b.h - ry },
+        ...arcPolygon(cx, b.y + b.h - ry, rx, ry, Math.PI, 0, 16),
+        { x: b.x + b.w, y: b.y + ry }
+      ];
+      const s = inkStroke(body, { closed: false, seed: seed + 0, width, amplitude: amplitudeOf(body) });
+      return /* @__PURE__ */ jsxs5("g", { children: [
+        /* @__PURE__ */ jsx5("path", { d: `${s.center} Z`, fill: shape.fill, stroke: "none", transform: fillTransform }),
+        /* @__PURE__ */ jsx5("path", { d: s.ring, fill: shape.stroke, stroke: "none" }),
+        closed(ellipsePolygon({ x: b.x, y: b.y, w: b.w, h: ry * 2 }, 48), 1)
+      ] });
+    }
+    case "cloud": {
+      const p = (u, v) => ({ x: b.x + u * b.w, y: b.y + v * b.h });
+      const start = p(0.22, 0.86);
+      const segs = [
+        [p(0.04, 0.88), p(0, 0.58), p(0.16, 0.5)],
+        [p(0.08, 0.26), p(0.3, 0.12), p(0.42, 0.28)],
+        [p(0.5, 0.02), p(0.76, 0.04), p(0.78, 0.3)],
+        [p(0.98, 0.26), p(1.04, 0.56), p(0.88, 0.64)],
+        [p(1, 0.8), p(0.9, 0.9), p(0.76, 0.86)]
+      ];
+      const pts = [start];
+      let from = start;
+      for (const [c1, c2, to] of segs) {
+        pts.push(...sampleCubic(from, c1, c2, to, 8));
+        from = to;
+      }
+      return closed(pts, 0);
+    }
+    case "queue": {
+      const rx = QUEUE_RX(b);
+      const ry = b.h / 2;
+      const body = [
+        { x: b.x + rx, y: b.y },
+        { x: b.x + b.w - rx, y: b.y },
+        { x: b.x + b.w - rx, y: b.y + b.h },
+        { x: b.x + rx, y: b.y + b.h },
+        ...arcPolygon(b.x + rx, b.y + ry, rx, ry, Math.PI / 2, 3 * Math.PI / 2, 16).slice(1, -1)
+      ];
+      return /* @__PURE__ */ jsxs5("g", { children: [
+        closed(body, 0),
+        closed(ellipsePolygon({ x: b.x + b.w - rx * 2, y: b.y, w: rx * 2, h: b.h }, 48), 1)
+      ] });
+    }
+    case "actor": {
+      const figH = b.h * ACTOR_FIGURE_RATIO;
+      const cx = b.x + b.w / 2;
+      const r = Math.max(4, Math.min(figH * 0.16, b.w * 0.2));
+      const neck = b.y + r * 2;
+      const hip = b.y + figH * 0.62;
+      const armY = neck + figH * 0.12;
+      const reach = Math.min(b.w * 0.32, figH * 0.3);
+      return /* @__PURE__ */ jsxs5("g", { children: [
+        closed(ellipsePolygon({ x: cx - r, y: b.y, w: r * 2, h: r * 2 }, 32), 0),
+        open([{ x: cx, y: neck }, { x: cx, y: hip }], 1),
+        open([{ x: cx - reach, y: armY }, { x: cx + reach, y: armY }], 2),
+        open(
+          [
+            { x: cx - reach, y: b.y + figH },
+            { x: cx, y: hip },
+            { x: cx + reach, y: b.y + figH }
+          ],
+          3
+        )
+      ] });
+    }
+    default:
+      return null;
+  }
+}
+function InkConnector({
+  shape,
+  points
+}) {
+  if (points.length < 2) return null;
+  const seed = seedFrom(shape.id);
+  const length = pathLength(points);
+  const amplitude = Math.min(3, Math.max(0.8, length * 0.015));
+  const width = shape.strokeWidth;
+  const line = inkStroke(roundedPolyline(points), { closed: false, seed, width, amplitude });
+  const heads = [];
+  if (shape.type === "arrow" && length >= 1) {
+    const headLength = Math.min(14, 4 + length / 4);
+    const last = points.length - 1;
+    heads.push(arrowHeadPoints(points[last], segmentAngleAt(points, last, false), headLength));
+    if (shape.bidirectional) {
+      heads.push(arrowHeadPoints(points[0], segmentAngleAt(points, 0, true), headLength));
+    }
+  }
+  return /* @__PURE__ */ jsxs5("g", { fill: shape.stroke, stroke: "none", children: [
+    /* @__PURE__ */ jsx5("path", { d: line.ring }),
+    heads.map((pts, i) => /* @__PURE__ */ jsx5(
+      "path",
+      {
+        d: inkStroke(pts, { closed: false, seed: seed + 1 + i, width: width * 1.15, amplitude: 0.8 }).ring
+      },
+      i
+    ))
+  ] });
+}
+
+// src/drawing/canvas/ShapeView.tsx
+import { Fragment, jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 import { createElement } from "react";
 var CONNECTOR_FONT_SIZE = 12;
 var CONNECTOR_LABEL_MAX_WIDTH = 160;
@@ -2497,7 +4291,7 @@ var textStyle = { userSelect: "none" };
 function luminance(color) {
   const m = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i.exec(color);
   if (!m) return 1;
-  const hex = m[1].length === 3 ? m[1].replace(/./g, (c) => c + c) : m[1];
+  const hex = m[1].length === 3 ? m[1].replace(/./g, (c2) => c2 + c2) : m[1];
   const [r, g, b] = [0, 2, 4].map((i) => parseInt(hex.slice(i, i + 2), 16) / 255);
   return 0.2126 * r + 0.7152 * g + 0.0722 * b;
 }
@@ -2526,7 +4320,7 @@ function BoxTexts({
     fill: textColorFor(shape),
     textAnchor: "middle"
   };
-  return /* @__PURE__ */ jsxs5("g", { children: [
+  return /* @__PURE__ */ jsxs6("g", { children: [
     slots.includes("label") && hideField !== "label" && (shape.label ? labelLines.map((line, i) => /* @__PURE__ */ createElement(
       "text",
       {
@@ -2541,7 +4335,7 @@ function BoxTexts({
         style: textStyle
       },
       line
-    )) : hints && /* @__PURE__ */ jsx5(
+    )) : hints && /* @__PURE__ */ jsx6(
       "text",
       {
         ...common,
@@ -2564,7 +4358,7 @@ function BoxTexts({
         style: textStyle
       },
       line
-    )) : hints && /* @__PURE__ */ jsx5(
+    )) : hints && /* @__PURE__ */ jsx6(
       "text",
       {
         ...common,
@@ -2588,7 +4382,7 @@ function BoxTexts({
         style: textStyle
       },
       line
-    )) : hints && /* @__PURE__ */ jsx5(
+    )) : hints && /* @__PURE__ */ jsx6(
       "text",
       {
         ...common,
@@ -2612,8 +4406,8 @@ function ConnectorLabel({
   const { x: midX, y: midY } = connectorMidpoint(points);
   const lineH = CONNECTOR_FONT_SIZE * LINE_HEIGHT;
   const startY = midY - (lines.length - 1) * lineH / 2 + CONNECTOR_FONT_SIZE * 0.35;
-  return /* @__PURE__ */ jsxs5("g", { children: [
-    /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsxs6("g", { children: [
+    /* @__PURE__ */ jsx6(
       "rect",
       {
         x: midX - size.w / 2 - 5,
@@ -2625,7 +4419,7 @@ function ConnectorLabel({
         opacity: 0.94
       }
     ),
-    lines.map((line, i) => /* @__PURE__ */ jsx5(
+    lines.map((line, i) => /* @__PURE__ */ jsx6(
       "text",
       {
         x: midX,
@@ -2644,7 +4438,8 @@ function ShapeView({
   shape,
   points,
   hideField,
-  showHints
+  showHints,
+  ink = false
 }) {
   const stroke = {
     stroke: shape.stroke,
@@ -2653,9 +4448,9 @@ function ShapeView({
     strokeLinejoin: "round"
   };
   if (isBoxType(shape.type)) {
-    return /* @__PURE__ */ jsxs5("g", { children: [
-      /* @__PURE__ */ jsx5(BoxGeometry, { shape, stroke }),
-      /* @__PURE__ */ jsx5(BoxTexts, { shape, hideField, showHints })
+    return /* @__PURE__ */ jsxs6("g", { children: [
+      ink ? /* @__PURE__ */ jsx6(InkBoxGeometry, { shape }) : /* @__PURE__ */ jsx6(BoxGeometry, { shape, stroke }),
+      /* @__PURE__ */ jsx6(BoxTexts, { shape, hideField, showHints })
     ] });
   }
   if (isConnectorType(shape.type)) {
@@ -2663,13 +4458,15 @@ function ShapeView({
       { x: shape.x, y: shape.y },
       { x: shape.x + shape.w, y: shape.y + shape.h }
     ];
-    return /* @__PURE__ */ jsxs5("g", { children: [
-      /* @__PURE__ */ jsx5("path", { ...stroke, d: polylinePath(pts), fill: "none" }),
-      arrowHeads(shape, pts).map((d, i) => /* @__PURE__ */ jsx5("path", { ...stroke, d, fill: "none" }, i)),
-      shape.text && hideField !== "text" && /* @__PURE__ */ jsx5(ConnectorLabel, { shape, points: pts })
+    return /* @__PURE__ */ jsxs6("g", { children: [
+      ink ? /* @__PURE__ */ jsx6(InkConnector, { shape, points: pts }) : /* @__PURE__ */ jsxs6(Fragment, { children: [
+        /* @__PURE__ */ jsx6("path", { ...stroke, d: polylinePath(pts), fill: "none" }),
+        arrowHeads(shape, pts).map((d, i) => /* @__PURE__ */ jsx6("path", { ...stroke, d, fill: "none" }, i))
+      ] }),
+      shape.text && hideField !== "text" && /* @__PURE__ */ jsx6(ConnectorLabel, { shape, points: pts })
     ] });
   }
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx6(
     "text",
     {
       x: shape.x,
@@ -2677,7 +4474,7 @@ function ShapeView({
       fill: shape.stroke,
       fontSize: FONT_SIZE,
       style: { userSelect: "none", whiteSpace: "pre" },
-      children: (shape.text ?? "").split("\n").map((line, i) => /* @__PURE__ */ jsx5("tspan", { x: shape.x, dy: i === 0 ? 0 : FONT_SIZE * LINE_HEIGHT, children: line }, i))
+      children: (shape.text ?? "").split("\n").map((line, i) => /* @__PURE__ */ jsx6("tspan", { x: shape.x, dy: i === 0 ? 0 : FONT_SIZE * LINE_HEIGHT, children: line }, i))
     }
   );
 }
@@ -2686,10 +4483,10 @@ function HitArea({
   points
 }) {
   if (isConnectorType(shape.type) && points) {
-    return /* @__PURE__ */ jsx5("path", { d: polylinePath(points), fill: "none", stroke: "transparent", strokeWidth: 16 });
+    return /* @__PURE__ */ jsx6("path", { d: polylinePath(points), fill: "none", stroke: "transparent", strokeWidth: 16 });
   }
   const b = bbox(shape);
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx6(
     "rect",
     {
       x: b.x - 2,
@@ -2708,7 +4505,7 @@ import {
   useRef as useRef2,
   useState
 } from "react";
-import { jsx as jsx6 } from "react/jsx-runtime";
+import { jsx as jsx7 } from "react/jsx-runtime";
 function TextEditOverlay({
   shape,
   field,
@@ -2811,7 +4608,7 @@ function TextEditOverlay({
     });
   }
   const placeholder = field === "label" ? "Label" : field === "footer" ? "Footer" : "Text";
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "textarea",
     {
       ref,
@@ -2831,16 +4628,16 @@ function TextEditOverlay({
 import { useEffect as useEffect6, useRef as useRef3, useState as useState2 } from "react";
 
 // src/components/blockWidthOptions.tsx
-import { Fragment, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
 var LAYOUT_OPTIONS = [
   {
     preset: "compact",
     label: "Compact (shrink to content, tight rows)",
     width: "content",
     density: "compact",
-    icon: /* @__PURE__ */ jsxs6(Fragment, { children: [
-      /* @__PURE__ */ jsx7("path", { d: "M3 4v12M17 4v12" }),
-      /* @__PURE__ */ jsx7("path", { d: "M5.5 10h3M11.5 10h3M6.5 7.5L9 10l-2.5 2.5M13.5 7.5L11 10l2.5 2.5" })
+    icon: /* @__PURE__ */ jsxs7(Fragment2, { children: [
+      /* @__PURE__ */ jsx8("path", { d: "M3 4v12M17 4v12" }),
+      /* @__PURE__ */ jsx8("path", { d: "M5.5 10h3M11.5 10h3M6.5 7.5L9 10l-2.5 2.5M13.5 7.5L11 10l2.5 2.5" })
     ] })
   },
   {
@@ -2848,9 +4645,9 @@ var LAYOUT_OPTIONS = [
     label: "Comfortable (text width)",
     width: "text",
     density: "comfortable",
-    icon: /* @__PURE__ */ jsxs6(Fragment, { children: [
-      /* @__PURE__ */ jsx7("path", { d: "M3 4v12M17 4v12" }),
-      /* @__PURE__ */ jsx7("path", { d: "M6.5 7h7M6.5 10h7M6.5 13h4.5" })
+    icon: /* @__PURE__ */ jsxs7(Fragment2, { children: [
+      /* @__PURE__ */ jsx8("path", { d: "M3 4v12M17 4v12" }),
+      /* @__PURE__ */ jsx8("path", { d: "M6.5 7h7M6.5 10h7M6.5 13h4.5" })
     ] })
   },
   {
@@ -2858,9 +4655,9 @@ var LAYOUT_OPTIONS = [
     label: "Full width",
     width: "full",
     density: "comfortable",
-    icon: /* @__PURE__ */ jsxs6(Fragment, { children: [
-      /* @__PURE__ */ jsx7("path", { d: "M3 4v12M17 4v12" }),
-      /* @__PURE__ */ jsx7("path", { d: "M6 10h8M8.5 7.5L6 10l2.5 2.5M11.5 7.5L14 10l-2.5 2.5" })
+    icon: /* @__PURE__ */ jsxs7(Fragment2, { children: [
+      /* @__PURE__ */ jsx8("path", { d: "M3 4v12M17 4v12" }),
+      /* @__PURE__ */ jsx8("path", { d: "M6 10h8M8.5 7.5L6 10l2.5 2.5M11.5 7.5L14 10l-2.5 2.5" })
     ] })
   }
 ];
@@ -2869,7 +4666,7 @@ function layoutPreset(width) {
 }
 
 // src/drawing/canvas/Toolbar.tsx
-import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
 var PRIMARY_TOOLS = [
   { tool: "select", label: "Select" },
   { tool: "rect", label: "Rectangle" },
@@ -2888,7 +4685,7 @@ function ToolButton({
   className,
   pressed
 }) {
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     "button",
     {
       type: "button",
@@ -2897,7 +4694,7 @@ function ToolButton({
       "aria-pressed": pressed ?? active,
       className: `zui-drawing-tool ${active ? "is-active" : ""} ${className ?? ""}`,
       onClick,
-      children: /* @__PURE__ */ jsx8(Icon, { children })
+      children: /* @__PURE__ */ jsx9(Icon, { children })
     }
   );
 }
@@ -2930,11 +4727,11 @@ function DrawingToolbar({
   }, [moreOpen]);
   const moreActive = MORE_SHAPES.includes(tool);
   const moreIcon = moreActive ? SHAPE_ICONS[tool] : SHAPE_ICONS[lastMore];
-  return /* @__PURE__ */ jsxs7(Fragment2, { children: [
-    /* @__PURE__ */ jsxs7("div", { className: "zui-drawing-toolbar-group", role: "toolbar", "aria-label": "Drawing tools", children: [
-      PRIMARY_TOOLS.map(({ tool: t, label }) => /* @__PURE__ */ jsx8(ToolButton, { label, active: tool === t, onClick: () => onToolChange(t), children: SHAPE_ICONS[t] }, t)),
-      /* @__PURE__ */ jsxs7("div", { className: "zui-drawing-more", ref: moreRef, children: [
-        /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs8(Fragment3, { children: [
+    /* @__PURE__ */ jsxs8("div", { className: "zui-drawing-toolbar-group", role: "toolbar", "aria-label": "Drawing tools", children: [
+      PRIMARY_TOOLS.map(({ tool: t, label }) => /* @__PURE__ */ jsx9(ToolButton, { label, active: tool === t, onClick: () => onToolChange(t), children: SHAPE_ICONS[t] }, t)),
+      /* @__PURE__ */ jsxs8("div", { className: "zui-drawing-more", ref: moreRef, children: [
+        /* @__PURE__ */ jsxs8(
           "button",
           {
             type: "button",
@@ -2945,12 +4742,12 @@ function DrawingToolbar({
             className: `zui-drawing-tool zui-drawing-tool-more ${moreActive ? "is-active" : ""}`,
             onClick: () => setMoreOpen((open) => !open),
             children: [
-              /* @__PURE__ */ jsx8(Icon, { children: moreIcon }),
-              /* @__PURE__ */ jsx8("span", { className: "zui-drawing-caret", "aria-hidden": "true" })
+              /* @__PURE__ */ jsx9(Icon, { children: moreIcon }),
+              /* @__PURE__ */ jsx9("span", { className: "zui-drawing-caret", "aria-hidden": "true" })
             ]
           }
         ),
-        moreOpen && /* @__PURE__ */ jsx8("div", { className: "zui-drawing-popover", role: "menu", children: MORE_SHAPES.map((type) => /* @__PURE__ */ jsxs7(
+        moreOpen && /* @__PURE__ */ jsx9("div", { className: "zui-drawing-popover", role: "menu", children: MORE_SHAPES.map((type) => /* @__PURE__ */ jsxs8(
           "button",
           {
             type: "button",
@@ -2963,8 +4760,8 @@ function DrawingToolbar({
               setMoreOpen(false);
             },
             children: [
-              /* @__PURE__ */ jsx8(Icon, { size: 18, children: SHAPE_ICONS[type] }),
-              /* @__PURE__ */ jsx8("span", { children: BOX_DEFINITIONS[type].label })
+              /* @__PURE__ */ jsx9(Icon, { size: 18, children: SHAPE_ICONS[type] }),
+              /* @__PURE__ */ jsx9("span", { children: BOX_DEFINITIONS[type].label })
             ]
           },
           type
@@ -2972,8 +4769,8 @@ function DrawingToolbar({
       ] })
     ] }),
     properties,
-    /* @__PURE__ */ jsxs7("div", { className: "zui-drawing-toolbar-group zui-drawing-toolbar-group-end", children: [
-      /* @__PURE__ */ jsx8(
+    /* @__PURE__ */ jsxs8("div", { className: "zui-drawing-toolbar-group zui-drawing-toolbar-group-end", children: [
+      /* @__PURE__ */ jsx9(
         ToolButton,
         {
           label: copied ? "Copied Mermaid to clipboard" : "Copy as Mermaid",
@@ -2988,8 +4785,8 @@ function DrawingToolbar({
           children: copied ? UI_ICONS.check : UI_ICONS.mermaid
         }
       ),
-      /* @__PURE__ */ jsx8("span", { className: "zui-drawing-toolbar-divider" }),
-      LAYOUT_OPTIONS.map(({ preset, label, icon, width: presetWidth }) => /* @__PURE__ */ jsx8(
+      /* @__PURE__ */ jsx9("span", { className: "zui-drawing-toolbar-divider" }),
+      LAYOUT_OPTIONS.map(({ preset, label, icon, width: presetWidth }) => /* @__PURE__ */ jsx9(
         ToolButton,
         {
           label,
@@ -3004,7 +4801,7 @@ function DrawingToolbar({
 }
 
 // src/drawing/canvas/DrawingCanvas.tsx
-import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
 var MIN_HEIGHT = 120;
 var MAX_HEIGHT = 1200;
 var WIDTH_CLASS = {
@@ -3040,6 +4837,7 @@ function DrawingCanvas({ nodeKey, data }) {
   const [shapes, setShapes] = useState3(data.shapes);
   const [canvasHeight, setCanvasHeight] = useState3(data.canvasHeight);
   const [width, setWidth] = useState3(data.width ?? "full");
+  const ink = useContext2(EditorContext)?.drawingStyle === "ink";
   const [tool, setTool] = useState3("select");
   const [selectedIds, setSelectedIds] = useState3(EMPTY_SET);
   const [editingText, setEditingText] = useState3(null);
@@ -3103,9 +4901,9 @@ function DrawingCanvas({ nodeKey, data }) {
         ...nextWidth !== "full" || explicitFull ? { width: nextWidth } : {},
         shapes: nextShapes
       };
-      const json = serializeDrawingData(payload);
-      if (json === lastCommittedRef.current) return;
-      lastCommittedRef.current = json;
+      const json2 = serializeDrawingData(payload);
+      if (json2 === lastCommittedRef.current) return;
+      lastCommittedRef.current = json2;
       editor.update(() => {
         const node = $getNodeByKey2(nodeKey);
         if ($isDrawingNode(node)) node.setData(payload);
@@ -3349,7 +5147,7 @@ function DrawingCanvas({ nodeKey, data }) {
           })
         );
       }
-      updateShapes((prev) => prev.map(normalize), { commit: true });
+      updateShapes((prev) => prev.map(normalize2), { commit: true });
     },
     [getPoint, paths, updateShapes, startTextEditing]
   );
@@ -3500,11 +5298,11 @@ function DrawingCanvas({ nodeKey, data }) {
   const propStroke = single?.stroke ?? selection[0]?.stroke ?? stroke;
   const propFill = single?.fill ?? selection[0]?.fill ?? fill;
   const canvasCursor = tool === "select" ? "default" : tool === "text" ? "text" : "crosshair";
-  return /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs9(
     "div",
     {
       ref: rootRef,
-      className: `zui-drawing-canvas ${WIDTH_CLASS[width]} ${isEditable ? "is-editable" : ""}`,
+      className: `zui-drawing-canvas ${WIDTH_CLASS[width]} ${isEditable ? "is-editable" : ""} ${ink ? "is-ink" : ""}`,
       tabIndex: isEditable ? 0 : void 0,
       onFocus: () => editor.dispatchCommand(DRAWING_FOCUS_COMMAND, nodeKey),
       onBlur: (e) => {
@@ -3512,7 +5310,7 @@ function DrawingCanvas({ nodeKey, data }) {
         editor.dispatchCommand(DRAWING_FOCUS_COMMAND, null);
       },
       children: [
-        isEditable && /* @__PURE__ */ jsx9("div", { className: "zui-drawing-toolbar", onPointerDown: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx9(
+        isEditable && /* @__PURE__ */ jsx10("div", { className: "zui-drawing-toolbar", onPointerDown: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx10(
           DrawingToolbar,
           {
             tool,
@@ -3526,7 +5324,7 @@ function DrawingCanvas({ nodeKey, data }) {
             properties: (
               // Inline in the same row (so the stage never shifts); shown
               // only while the canvas has focus (see .zui-drawing-props-host)
-              /* @__PURE__ */ jsx9("div", { className: "zui-drawing-props-host", children: /* @__PURE__ */ jsx9(
+              /* @__PURE__ */ jsx10("div", { className: "zui-drawing-props-host", children: /* @__PURE__ */ jsx10(
                 PropertyBar,
                 {
                   selection,
@@ -3541,8 +5339,8 @@ function DrawingCanvas({ nodeKey, data }) {
             )
           }
         ) }),
-        /* @__PURE__ */ jsxs8("div", { className: "zui-drawing-stage", children: [
-          /* @__PURE__ */ jsxs8(
+        /* @__PURE__ */ jsxs9("div", { className: "zui-drawing-stage", children: [
+          /* @__PURE__ */ jsxs9(
             "svg",
             {
               ref: svgRef,
@@ -3573,7 +5371,7 @@ function DrawingCanvas({ nodeKey, data }) {
                 }
               },
               children: [
-                shapes.map((shape) => /* @__PURE__ */ jsxs8(
+                shapes.map((shape) => /* @__PURE__ */ jsxs9(
                   "g",
                   {
                     "data-shape-id": shape.id,
@@ -3581,11 +5379,12 @@ function DrawingCanvas({ nodeKey, data }) {
                     style: { cursor: isEditable && tool === "select" ? "move" : void 0 },
                     onPointerDown: (e) => handleShapePointerDown(e, shape),
                     children: [
-                      /* @__PURE__ */ jsx9(HitArea, { shape, points: paths.get(shape.id) }),
-                      shape.id === editingText?.id && shape.type === "text" ? null : /* @__PURE__ */ jsx9(
+                      /* @__PURE__ */ jsx10(HitArea, { shape, points: paths.get(shape.id) }),
+                      shape.id === editingText?.id && shape.type === "text" ? null : /* @__PURE__ */ jsx10(
                         ShapeView,
                         {
                           shape,
+                          ink,
                           points: paths.get(shape.id),
                           hideField: shape.id === editingText?.id ? editingText.field : null,
                           showHints: isEditable && tool === "select" && single?.id === shape.id && shape.id !== editingText?.id
@@ -3595,7 +5394,7 @@ function DrawingCanvas({ nodeKey, data }) {
                   },
                   shape.id
                 )),
-                hoverBox && /* @__PURE__ */ jsx9(
+                hoverBox && /* @__PURE__ */ jsx10(
                   "polygon",
                   {
                     className: "zui-drawing-selection zui-drawing-bind-target",
@@ -3608,7 +5407,7 @@ function DrawingCanvas({ nodeKey, data }) {
                     pointerEvents: "none"
                   }
                 ),
-                single && isEditable && !editingText && /* @__PURE__ */ jsx9(
+                single && isEditable && !editingText && /* @__PURE__ */ jsx10(
                   SelectionOverlay,
                   {
                     shape: single,
@@ -3618,13 +5417,13 @@ function DrawingCanvas({ nodeKey, data }) {
                     onWaypointRemove: removeWaypoint
                   }
                 ),
-                selection.length > 1 && isEditable && /* @__PURE__ */ jsx9(GroupSelectionOverlay, { shapes: selection, paths }),
-                marquee && /* @__PURE__ */ jsx9(MarqueeOverlay, { rect: marqueeRect(marquee.origin, marquee.current) })
+                selection.length > 1 && isEditable && /* @__PURE__ */ jsx10(GroupSelectionOverlay, { shapes: selection, paths }),
+                marquee && /* @__PURE__ */ jsx10(MarqueeOverlay, { rect: marqueeRect(marquee.origin, marquee.current) })
               ]
             }
           ),
-          isEditable && shapes.length === 0 && /* @__PURE__ */ jsx9("div", { className: "zui-drawing-empty", "aria-hidden": "true", children: "Pick a shape above, then click or drag on the canvas" }),
-          editingShape && editingText && /* @__PURE__ */ jsx9(
+          isEditable && shapes.length === 0 && /* @__PURE__ */ jsx10("div", { className: "zui-drawing-empty", "aria-hidden": "true", children: "Pick a shape above, then click or drag on the canvas" }),
+          editingShape && editingText && /* @__PURE__ */ jsx10(
             "div",
             {
               className: "zui-drawing-overlay",
@@ -3633,7 +5432,7 @@ function DrawingCanvas({ nodeKey, data }) {
                 width: logicalWidth ?? void 0,
                 height: logicalWidth ? canvasHeight : void 0
               },
-              children: /* @__PURE__ */ jsx9(
+              children: /* @__PURE__ */ jsx10(
                 TextEditOverlay,
                 {
                   shape: editingShape,
@@ -3645,7 +5444,7 @@ function DrawingCanvas({ nodeKey, data }) {
               )
             }
           ),
-          isEditable && /* @__PURE__ */ jsx9(
+          isEditable && /* @__PURE__ */ jsx10(
             HeightHandle,
             {
               height: canvasHeight,
@@ -3669,7 +5468,7 @@ function HeightHandle({
   const latestRef = useRef4(height);
   latestRef.current = height;
   const clamp = (h) => Math.round(Math.min(MAX_HEIGHT, Math.max(MIN_HEIGHT, h)));
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     "div",
     {
       className: "zui-drawing-resize",
@@ -3692,13 +5491,13 @@ function HeightHandle({
         dragRef.current = null;
         onCommit(latestRef.current);
       },
-      children: /* @__PURE__ */ jsx9(Icon, { size: 14, children: UI_ICONS.grip })
+      children: /* @__PURE__ */ jsx10(Icon, { size: 14, children: UI_ICONS.grip })
     }
   );
 }
 
 // src/nodes/DrawingNode.tsx
-import { jsx as jsx10 } from "react/jsx-runtime";
+import { jsx as jsx11 } from "react/jsx-runtime";
 var DrawingNode = class _DrawingNode extends DecoratorNode {
   static getType() {
     return "drawing";
@@ -3762,7 +5561,7 @@ var DrawingNode = class _DrawingNode extends DecoratorNode {
     return false;
   }
   decorate(_editor, _config) {
-    return /* @__PURE__ */ jsx10(DrawingCanvas, { nodeKey: this.getKey(), data: this.getData() });
+    return /* @__PURE__ */ jsx11(DrawingCanvas, { nodeKey: this.getKey(), data: this.getData() });
   }
 };
 function $createDrawingNode(data = serializeDrawingData(EMPTY_DRAWING)) {
@@ -4076,6 +5875,19 @@ var TABLE = {
   type: "element"
 };
 
+// src/transformers/codeTransformer.ts
+import { CODE } from "@lexical/markdown";
+import { $isCodeNode as $isCodeNode2 } from "@lexical/code";
+var CODE_BLOCK = {
+  ...CODE,
+  export: (node, exportChildren) => {
+    if (!$isCodeNode2(node)) return null;
+    if (node.getLanguage() !== PLAIN_LANGUAGE) return CODE.export?.(node, exportChildren) ?? null;
+    const text = node.getTextContent();
+    return "```" + (text ? "\n" + text : "") + "\n```";
+  }
+};
+
 // src/theme.ts
 var editorTheme = {
   ltr: "text-left",
@@ -4113,38 +5925,9 @@ var editorTheme = {
     underlineStrikethrough: "underline line-through"
   },
   code: "zui-code bg-muted rounded-md p-4 font-mono text-sm block my-2 overflow-x-auto",
-  codeHighlight: {
-    atrule: "text-blue-500",
-    attr: "text-yellow-500",
-    boolean: "text-purple-500",
-    builtin: "text-cyan-500",
-    cdata: "text-gray-500",
-    char: "text-green-500",
-    class: "text-yellow-500",
-    "class-name": "text-yellow-500",
-    comment: "text-gray-500",
-    constant: "text-purple-500",
-    deleted: "text-red-500",
-    doctype: "text-gray-500",
-    entity: "text-red-500",
-    function: "text-blue-500",
-    important: "text-red-500",
-    inserted: "text-green-500",
-    keyword: "text-purple-500",
-    namespace: "text-purple-500",
-    number: "text-green-500",
-    operator: "text-gray-500",
-    prolog: "text-gray-500",
-    property: "text-blue-500",
-    punctuation: "text-gray-500",
-    regex: "text-red-500",
-    selector: "text-blue-500",
-    string: "text-green-500",
-    symbol: "text-green-500",
-    tag: "text-red-500",
-    url: "text-blue-500",
-    variable: "text-blue-500"
-  },
+  codeHighlight: Object.fromEntries(
+    CODE_TOKEN_TYPES.map((type) => [type, `zui-token zui-token-${type}`])
+  ),
   quote: "zui-quote border-l-4 border-border pl-4 italic",
   frontmatter: "zui-frontmatter",
   table: "zui-table",
@@ -4155,23 +5938,18 @@ var editorTheme = {
   drawing: "zui-drawing"
 };
 
-// src/editorContext.ts
-import { createContext, useContext } from "react";
-var EditorContext = createContext(null);
-function useEditorContext() {
-  const ctx = useContext(EditorContext);
-  if (!ctx) {
-    throw new Error(
-      "@zuilib/text-editor: this component must be rendered inside <MarkdownEditor> or <MarkdownEditor.Root>"
-    );
-  }
-  return ctx;
-}
-
 // src/EditorRoot.tsx
-import { Fragment as Fragment3, jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
-var SYNC_TRANSFORMERS = [FRONTMATTER, DRAWING, DIAGRAM, CHECK_LIST, TABLE, ...TRANSFORMERS2];
-var SHORTCUT_TRANSFORMERS = [TABLE, ...TRANSFORMERS2.filter((t) => t !== CODE)];
+import { Fragment as Fragment4, jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
+var SYNC_TRANSFORMERS = [
+  FRONTMATTER,
+  DRAWING,
+  DIAGRAM,
+  CHECK_LIST,
+  TABLE,
+  CODE_BLOCK,
+  ...TRANSFORMERS2.filter((t) => t !== CODE2)
+];
+var SHORTCUT_TRANSFORMERS = [TABLE, ...TRANSFORMERS2.filter((t) => t !== CODE2)];
 var NO_DEFAULT_BLOCK_WIDTH = {};
 function onError(error) {
   console.error(error);
@@ -4181,7 +5959,7 @@ var editorNodes = [
   ListNode2,
   ListItemNode,
   QuoteNode,
-  CodeNode,
+  CodeNode2,
   CodeHighlightNode,
   AutoLinkNode,
   LinkNode,
@@ -4207,6 +5985,7 @@ function EditorRoot({
   autoFocus = false,
   measure,
   defaultBlockWidth = NO_DEFAULT_BLOCK_WIDTH,
+  drawingStyle = "clean",
   children
 }) {
   const latestValueRef = useRef5(value ?? "");
@@ -4248,19 +6027,20 @@ function EditorRoot({
       autoFocus,
       rawValue: value ?? "",
       onRawChange: handleChange,
-      defaultBlockWidth
+      defaultBlockWidth,
+      drawingStyle
     }),
-    [mode, readOnly, autoFocus, value, handleChange, defaultBlockWidth]
+    [mode, readOnly, autoFocus, value, handleChange, defaultBlockWidth, drawingStyle]
   );
   const isRaw = mode === "edit-raw";
   const rootStyle = useMemo2(
     () => measure !== void 0 ? { "--zui-text-editor-measure": measure } : void 0,
     [measure]
   );
-  return /* @__PURE__ */ jsx11(LexicalComposer, { initialConfig, children: /* @__PURE__ */ jsx11(EditorContext.Provider, { value: context, children: /* @__PURE__ */ jsxs9("div", { className: `zui-text-editor ${className ?? ""}`, style: rootStyle, children: [
+  return /* @__PURE__ */ jsx12(LexicalComposer, { initialConfig, children: /* @__PURE__ */ jsx12(EditorContext.Provider, { value: context, children: /* @__PURE__ */ jsxs10("div", { className: `zui-text-editor ${className ?? ""}`, style: rootStyle, children: [
     children,
-    !isRaw && /* @__PURE__ */ jsxs9(Fragment3, { children: [
-      /* @__PURE__ */ jsx11(
+    !isRaw && /* @__PURE__ */ jsxs10(Fragment4, { children: [
+      /* @__PURE__ */ jsx12(
         MarkdownSyncPlugin,
         {
           initialMarkdown: mode === "view" ? value ?? "" : capturedMarkdown,
@@ -4268,17 +6048,17 @@ function EditorRoot({
           transformers: SYNC_TRANSFORMERS
         }
       ),
-      /* @__PURE__ */ jsx11(HistoryPlugin, {}),
-      /* @__PURE__ */ jsx11(ListPlugin, {}),
-      /* @__PURE__ */ jsx11(CheckListPlugin, {}),
-      /* @__PURE__ */ jsx11(ChecklistShortcutPlugin, {}),
-      /* @__PURE__ */ jsx11(CodeBlockShortcutPlugin, {}),
-      /* @__PURE__ */ jsx11(CodeHighlightPlugin, {}),
-      /* @__PURE__ */ jsx11(TablePlugin, {}),
-      /* @__PURE__ */ jsx11(LinkPlugin, {}),
-      /* @__PURE__ */ jsx11(MarkdownShortcutPlugin, { transformers: SHORTCUT_TRANSFORMERS }),
-      /* @__PURE__ */ jsx11(ReadOnlyPlugin, { readOnly: readOnly || mode === "view" }),
-      autoFocus && /* @__PURE__ */ jsx11(AutoFocusPlugin, {})
+      /* @__PURE__ */ jsx12(HistoryPlugin, {}),
+      /* @__PURE__ */ jsx12(ListPlugin, {}),
+      /* @__PURE__ */ jsx12(CheckListPlugin, {}),
+      /* @__PURE__ */ jsx12(ChecklistShortcutPlugin, {}),
+      /* @__PURE__ */ jsx12(CodeBlockShortcutPlugin, {}),
+      /* @__PURE__ */ jsx12(CodeHighlightPlugin, {}),
+      /* @__PURE__ */ jsx12(TablePlugin, {}),
+      /* @__PURE__ */ jsx12(LinkPlugin, {}),
+      /* @__PURE__ */ jsx12(MarkdownShortcutPlugin, { transformers: SHORTCUT_TRANSFORMERS }),
+      /* @__PURE__ */ jsx12(ReadOnlyPlugin, { readOnly: readOnly || mode === "view" }),
+      autoFocus && /* @__PURE__ */ jsx12(AutoFocusPlugin, {})
     ] })
   ] }) }) }, mountKey);
 }
@@ -4298,7 +6078,7 @@ import {
 import { $getRoot, $getSelection as $getSelection3, $isRangeSelection as $isRangeSelection3 } from "lexical";
 import { useLexicalComposerContext as useLexicalComposerContext7 } from "@lexical/react/LexicalComposerContext";
 import { $isHeadingNode } from "@lexical/rich-text";
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx13 } from "react/jsx-runtime";
 var HEADING_LEVELS = {
   h1: 1,
   h2: 2,
@@ -4396,7 +6176,7 @@ function FoldingPlugin() {
       return next;
     });
   }, []);
-  return /* @__PURE__ */ jsx12("div", { className: "zui-text-editor-fold-gutter", children: buttons.map(({ key, folded, top, height }) => /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx13("div", { className: "zui-text-editor-fold-gutter", children: buttons.map(({ key, folded, top, height }) => /* @__PURE__ */ jsx13(
     "button",
     {
       type: "button",
@@ -4406,7 +6186,7 @@ function FoldingPlugin() {
       "aria-label": folded ? "Expand section" : "Collapse section",
       "aria-expanded": !folded,
       onClick: () => toggle(key),
-      children: /* @__PURE__ */ jsx12(
+      children: /* @__PURE__ */ jsx13(
         "svg",
         {
           viewBox: "0 0 20 20",
@@ -4417,7 +6197,7 @@ function FoldingPlugin() {
           strokeWidth: "2",
           strokeLinecap: "round",
           strokeLinejoin: "round",
-          children: /* @__PURE__ */ jsx12("path", { d: "M6 8l4 4 4-4" })
+          children: /* @__PURE__ */ jsx13("path", { d: "M6 8l4 4 4-4" })
         }
       )
     },
@@ -4445,7 +6225,7 @@ import {
 } from "lexical";
 import { useLexicalComposerContext as useLexicalComposerContext8 } from "@lexical/react/LexicalComposerContext";
 import { INSERT_TABLE_COMMAND } from "@lexical/table";
-import { $insertNodeToNearestRoot, mergeRegister } from "@lexical/utils";
+import { $insertNodeToNearestRoot, mergeRegister as mergeRegister2 } from "@lexical/utils";
 var TRACKED_FORMATS = [
   "bold",
   "italic",
@@ -4470,7 +6250,7 @@ function useMarkdownEditor() {
   const activeDrawingRef = useRef7(null);
   const [drawingWidth, setDrawingWidth] = useState6(null);
   useEffect10(
-    () => mergeRegister(
+    () => mergeRegister2(
       editor.registerUpdateListener(({ editorState }) => {
         editorState.read(() => {
           const table = $getSelectedTable();
@@ -4612,23 +6392,23 @@ function useMarkdownEditor() {
 }
 
 // src/components/Toolbar.tsx
-import { Fragment as Fragment4, jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx14, jsxs as jsxs11 } from "react/jsx-runtime";
 function Toolbar({ children, className }) {
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14(
     "div",
     {
       className: `zui-text-editor-toolbar ${className ?? ""}`,
       role: "toolbar",
-      children: children ?? /* @__PURE__ */ jsxs10(Fragment4, { children: [
-        /* @__PURE__ */ jsx13(FormatButtons, {}),
-        /* @__PURE__ */ jsx13(ToolbarDivider, {}),
-        /* @__PURE__ */ jsx13(InsertButtons, {})
+      children: children ?? /* @__PURE__ */ jsxs11(Fragment5, { children: [
+        /* @__PURE__ */ jsx14(FormatButtons, {}),
+        /* @__PURE__ */ jsx14(ToolbarDivider, {}),
+        /* @__PURE__ */ jsx14(InsertButtons, {})
       ] })
     }
   );
 }
 function ToolbarDivider() {
-  return /* @__PURE__ */ jsx13("div", { className: "zui-text-editor-toolbar-divider" });
+  return /* @__PURE__ */ jsx14("div", { className: "zui-text-editor-toolbar-divider" });
 }
 function ToolbarButton({
   label,
@@ -4638,7 +6418,7 @@ function ToolbarButton({
   disabled = false,
   className
 }) {
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14(
     "button",
     {
       type: "button",
@@ -4654,7 +6434,7 @@ function ToolbarButton({
   );
 }
 function Icon2({ children, strokeWidth = 1.5 }) {
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14(
     "svg",
     {
       viewBox: "0 0 20 20",
@@ -4673,27 +6453,27 @@ var FORMAT_BUTTONS = [
   {
     format: "bold",
     label: "Bold",
-    icon: /* @__PURE__ */ jsx13(Icon2, { strokeWidth: 1.8, children: /* @__PURE__ */ jsx13("path", { d: "M6 3.5h5a3 3 0 0 1 0 6H6zm0 6h6a3 3 0 0 1 0 6H6z" }) })
+    icon: /* @__PURE__ */ jsx14(Icon2, { strokeWidth: 1.8, children: /* @__PURE__ */ jsx14("path", { d: "M6 3.5h5a3 3 0 0 1 0 6H6zm0 6h6a3 3 0 0 1 0 6H6z" }) })
   },
   {
     format: "italic",
     label: "Italic",
-    icon: /* @__PURE__ */ jsx13(Icon2, { strokeWidth: 1.6, children: /* @__PURE__ */ jsx13("path", { d: "M8.5 3.5h6M5.5 16.5h6M11.5 3.5l-3 13" }) })
+    icon: /* @__PURE__ */ jsx14(Icon2, { strokeWidth: 1.6, children: /* @__PURE__ */ jsx14("path", { d: "M8.5 3.5h6M5.5 16.5h6M11.5 3.5l-3 13" }) })
   },
   {
     format: "strikethrough",
     label: "Strikethrough",
-    icon: /* @__PURE__ */ jsx13(Icon2, { strokeWidth: 1.6, children: /* @__PURE__ */ jsx13("path", { d: "M4 10h12M13.5 5.5c-.6-1.2-2-2-3.5-2-2 0-3.5 1.2-3.5 2.8 0 .5.1.9.4 1.3m-.4 5c.5 1.6 2 2.9 3.9 2.9 2 0 3.6-1.2 3.6-2.9 0-.4-.1-.8-.2-1.1" }) })
+    icon: /* @__PURE__ */ jsx14(Icon2, { strokeWidth: 1.6, children: /* @__PURE__ */ jsx14("path", { d: "M4 10h12M13.5 5.5c-.6-1.2-2-2-3.5-2-2 0-3.5 1.2-3.5 2.8 0 .5.1.9.4 1.3m-.4 5c.5 1.6 2 2.9 3.9 2.9 2 0 3.6-1.2 3.6-2.9 0-.4-.1-.8-.2-1.1" }) })
   },
   {
     format: "code",
     label: "Inline code",
-    icon: /* @__PURE__ */ jsx13(Icon2, { strokeWidth: 1.6, children: /* @__PURE__ */ jsx13("path", { d: "M7.5 6L4 10l3.5 4M12.5 6L16 10l-3.5 4" }) })
+    icon: /* @__PURE__ */ jsx14(Icon2, { strokeWidth: 1.6, children: /* @__PURE__ */ jsx14("path", { d: "M7.5 6L4 10l3.5 4M12.5 6L16 10l-3.5 4" }) })
   }
 ];
 function FormatButtons() {
   const { activeFormats, toggleFormat } = useMarkdownEditor();
-  return /* @__PURE__ */ jsx13(Fragment4, { children: FORMAT_BUTTONS.map(({ format, label, icon }) => /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14(Fragment5, { children: FORMAT_BUTTONS.map(({ format, label, icon }) => /* @__PURE__ */ jsx14(
     ToolbarButton,
     {
       label,
@@ -4706,36 +6486,36 @@ function FormatButtons() {
 }
 function InsertButtons() {
   const { insertTable, insertDrawing } = useMarkdownEditor();
-  return /* @__PURE__ */ jsxs10(Fragment4, { children: [
-    /* @__PURE__ */ jsx13(ToolbarButton, { label: "Insert table", onClick: () => insertTable(), children: /* @__PURE__ */ jsxs10(Icon2, { children: [
-      /* @__PURE__ */ jsx13("rect", { x: "3", y: "3.5", width: "14", height: "13", rx: "1.5" }),
-      /* @__PURE__ */ jsx13("path", { d: "M3 8h14M8 8v8.5M13 8v8.5" })
+  return /* @__PURE__ */ jsxs11(Fragment5, { children: [
+    /* @__PURE__ */ jsx14(ToolbarButton, { label: "Insert table", onClick: () => insertTable(), children: /* @__PURE__ */ jsxs11(Icon2, { children: [
+      /* @__PURE__ */ jsx14("rect", { x: "3", y: "3.5", width: "14", height: "13", rx: "1.5" }),
+      /* @__PURE__ */ jsx14("path", { d: "M3 8h14M8 8v8.5M13 8v8.5" })
     ] }) }),
-    /* @__PURE__ */ jsx13(ToolbarButton, { label: "Insert drawing", onClick: insertDrawing, children: /* @__PURE__ */ jsxs10(Icon2, { children: [
-      /* @__PURE__ */ jsx13("rect", { x: "3", y: "5", width: "8", height: "6", rx: "1.5" }),
-      /* @__PURE__ */ jsx13("path", { d: "M13.5 8h3M14.5 6.5L17.5 8l-3 1.5" }),
-      /* @__PURE__ */ jsx13("ellipse", { cx: "13", cy: "14.5", rx: "4", ry: "2.8" })
+    /* @__PURE__ */ jsx14(ToolbarButton, { label: "Insert drawing", onClick: insertDrawing, children: /* @__PURE__ */ jsxs11(Icon2, { children: [
+      /* @__PURE__ */ jsx14("rect", { x: "3", y: "5", width: "8", height: "6", rx: "1.5" }),
+      /* @__PURE__ */ jsx14("path", { d: "M13.5 8h3M14.5 6.5L17.5 8l-3 1.5" }),
+      /* @__PURE__ */ jsx14("ellipse", { cx: "13", cy: "14.5", rx: "4", ry: "2.8" })
     ] }) })
   ] });
 }
 function HistoryButtons() {
   const { canUndo, canRedo, undo, redo } = useMarkdownEditor();
-  return /* @__PURE__ */ jsxs10(Fragment4, { children: [
-    /* @__PURE__ */ jsx13(ToolbarButton, { label: "Undo", onClick: undo, disabled: !canUndo, children: /* @__PURE__ */ jsxs10(Icon2, { children: [
-      /* @__PURE__ */ jsx13("path", { d: "M7 6L3.5 9.5 7 13" }),
-      /* @__PURE__ */ jsx13("path", { d: "M3.5 9.5H12a4 4 0 0 1 0 8h-1" })
+  return /* @__PURE__ */ jsxs11(Fragment5, { children: [
+    /* @__PURE__ */ jsx14(ToolbarButton, { label: "Undo", onClick: undo, disabled: !canUndo, children: /* @__PURE__ */ jsxs11(Icon2, { children: [
+      /* @__PURE__ */ jsx14("path", { d: "M7 6L3.5 9.5 7 13" }),
+      /* @__PURE__ */ jsx14("path", { d: "M3.5 9.5H12a4 4 0 0 1 0 8h-1" })
     ] }) }),
-    /* @__PURE__ */ jsx13(ToolbarButton, { label: "Redo", onClick: redo, disabled: !canRedo, children: /* @__PURE__ */ jsxs10(Icon2, { children: [
-      /* @__PURE__ */ jsx13("path", { d: "M13 6l3.5 3.5L13 13" }),
-      /* @__PURE__ */ jsx13("path", { d: "M16.5 9.5H8a4 4 0 0 0 0 8h1" })
+    /* @__PURE__ */ jsx14(ToolbarButton, { label: "Redo", onClick: redo, disabled: !canRedo, children: /* @__PURE__ */ jsxs11(Icon2, { children: [
+      /* @__PURE__ */ jsx14("path", { d: "M13 6l3.5 3.5L13 13" }),
+      /* @__PURE__ */ jsx14("path", { d: "M16.5 9.5H8a4 4 0 0 0 0 8h1" })
     ] }) })
   ] });
 }
 
 // src/plugins/TableSettingsPlugin.tsx
-import { jsx as jsx14 } from "react/jsx-runtime";
+import { jsx as jsx15 } from "react/jsx-runtime";
 function Icon3({ children }) {
-  return /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx15(
     "svg",
     {
       viewBox: "0 0 20 20",
@@ -4796,20 +6576,20 @@ function TableSettingsPlugin() {
     [editor]
   );
   if (!isEditable || !anchor || !settings) return null;
-  return /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx15(
     "div",
     {
       className: "zui-table-settings",
       role: "toolbar",
       "aria-label": "Table settings",
       style: { top: anchor.top, right: anchor.right },
-      children: LAYOUT_OPTIONS.map(({ preset, label, icon, width, density }) => /* @__PURE__ */ jsx14(
+      children: LAYOUT_OPTIONS.map(({ preset, label, icon, width, density }) => /* @__PURE__ */ jsx15(
         ToolbarButton,
         {
           label,
           active: layoutPreset(settings.width) === preset,
           onClick: () => update({ width, density }),
-          children: /* @__PURE__ */ jsx14(Icon3, { children: icon })
+          children: /* @__PURE__ */ jsx15(Icon3, { children: icon })
         },
         preset
       ))
@@ -4818,7 +6598,7 @@ function TableSettingsPlugin() {
 }
 
 // src/EditorContent.tsx
-import { jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
 function EditorContent({
   placeholder = "Start writing...",
   foldable = true,
@@ -4826,7 +6606,7 @@ function EditorContent({
 }) {
   const { mode, readOnly, autoFocus, rawValue, onRawChange } = useEditorContext();
   if (mode === "edit-raw") {
-    return /* @__PURE__ */ jsx15(
+    return /* @__PURE__ */ jsx16(
       "textarea",
       {
         className: "zui-text-editor-textarea",
@@ -4839,24 +6619,24 @@ function EditorContent({
       }
     );
   }
-  return /* @__PURE__ */ jsxs11("div", { className: "zui-text-editor-body", children: [
-    /* @__PURE__ */ jsxs11("div", { className: "zui-text-editor-main", children: [
-      /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsxs12("div", { className: "zui-text-editor-body", children: [
+    /* @__PURE__ */ jsxs12("div", { className: "zui-text-editor-main", children: [
+      /* @__PURE__ */ jsx16(
         RichTextPlugin,
         {
-          contentEditable: /* @__PURE__ */ jsx15(
+          contentEditable: /* @__PURE__ */ jsx16(
             ContentEditable,
             {
               className: "zui-text-editor-content",
               "aria-placeholder": placeholder,
-              placeholder: /* @__PURE__ */ jsx15("div", { className: "zui-text-editor-placeholder", children: placeholder })
+              placeholder: /* @__PURE__ */ jsx16("div", { className: "zui-text-editor-placeholder", children: placeholder })
             }
           ),
           ErrorBoundary: LexicalErrorBoundary
         }
       ),
-      foldable && /* @__PURE__ */ jsx15(FoldingPlugin, {}),
-      /* @__PURE__ */ jsx15(TableSettingsPlugin, {})
+      foldable && /* @__PURE__ */ jsx16(FoldingPlugin, {}),
+      /* @__PURE__ */ jsx16(TableSettingsPlugin, {})
     ] }),
     children
   ] });
@@ -4868,7 +6648,7 @@ import { useLexicalComposerContext as useLexicalComposerContext10 } from "@lexic
 import {
   TableOfContentsPlugin
 } from "@lexical/react/LexicalTableOfContentsPlugin";
-import { jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
 var INDENT_PER_LEVEL = {
   h1: 0,
   h2: 1,
@@ -4920,16 +6700,16 @@ function OutlinePlugin() {
     },
     [editor]
   );
-  return /* @__PURE__ */ jsx16(TableOfContentsPlugin, { children: (entries) => {
+  return /* @__PURE__ */ jsx17(TableOfContentsPlugin, { children: (entries) => {
     for (const [key] of entries) {
       editor.getElementByKey(key)?.setAttribute("data-outline-key", key);
     }
-    return /* @__PURE__ */ jsxs12(
+    return /* @__PURE__ */ jsxs13(
       "div",
       {
         className: `zui-text-editor-outline ${collapsed ? "is-collapsed" : ""}`,
         children: [
-          /* @__PURE__ */ jsx16(
+          /* @__PURE__ */ jsx17(
             "button",
             {
               type: "button",
@@ -4937,8 +6717,8 @@ function OutlinePlugin() {
               title: collapsed ? "Show outline" : "Hide outline",
               "aria-label": collapsed ? "Show outline" : "Hide outline",
               "aria-expanded": !collapsed,
-              onClick: () => setCollapsed((c) => !c),
-              children: /* @__PURE__ */ jsx16(
+              onClick: () => setCollapsed((c2) => !c2),
+              children: /* @__PURE__ */ jsx17(
                 "svg",
                 {
                   viewBox: "0 0 20 20",
@@ -4948,14 +6728,14 @@ function OutlinePlugin() {
                   stroke: "currentColor",
                   strokeWidth: "1.8",
                   strokeLinecap: "round",
-                  children: /* @__PURE__ */ jsx16("path", { d: "M4 5h12M4 10h8M4 15h10" })
+                  children: /* @__PURE__ */ jsx17("path", { d: "M4 5h12M4 10h8M4 15h10" })
                 }
               )
             }
           ),
-          !collapsed && /* @__PURE__ */ jsxs12("nav", { className: "zui-text-editor-outline-list", "aria-label": "Table of contents", children: [
-            entries.length === 0 && /* @__PURE__ */ jsx16("div", { className: "zui-text-editor-outline-empty", children: "No headings" }),
-            entries.map(([key, text, tag]) => /* @__PURE__ */ jsx16(
+          !collapsed && /* @__PURE__ */ jsxs13("nav", { className: "zui-text-editor-outline-list", "aria-label": "Table of contents", children: [
+            entries.length === 0 && /* @__PURE__ */ jsx17("div", { className: "zui-text-editor-outline-empty", children: "No headings" }),
+            entries.map(([key, text, tag]) => /* @__PURE__ */ jsx17(
               "button",
               {
                 type: "button",
@@ -4976,11 +6756,11 @@ function OutlinePlugin() {
 }
 
 // src/MarkdownEditor.tsx
-import { jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
 var DEFAULT_ITEMS = {
-  format: /* @__PURE__ */ jsx17(FormatButtons, {}),
-  insert: /* @__PURE__ */ jsx17(InsertButtons, {}),
-  history: /* @__PURE__ */ jsx17(HistoryButtons, {})
+  format: /* @__PURE__ */ jsx18(FormatButtons, {}),
+  insert: /* @__PURE__ */ jsx18(InsertButtons, {}),
+  history: /* @__PURE__ */ jsx18(HistoryButtons, {})
 };
 function EditorToolbar({
   children,
@@ -4988,7 +6768,7 @@ function EditorToolbar({
 }) {
   const { mode, readOnly } = useEditorContext();
   if (mode !== "edit-md" || readOnly) return null;
-  return /* @__PURE__ */ jsx17(Toolbar, { className, children });
+  return /* @__PURE__ */ jsx18(Toolbar, { className, children });
 }
 function MarkdownEditor({
   placeholder,
@@ -4997,10 +6777,10 @@ function MarkdownEditor({
   foldable = true,
   ...rootProps
 }) {
-  return /* @__PURE__ */ jsxs13(EditorRoot, { ...rootProps, children: [
-    toolbar === true && /* @__PURE__ */ jsx17(EditorToolbar, {}),
+  return /* @__PURE__ */ jsxs14(EditorRoot, { ...rootProps, children: [
+    toolbar === true && /* @__PURE__ */ jsx18(EditorToolbar, {}),
     typeof toolbar === "function" && toolbar(DEFAULT_ITEMS),
-    /* @__PURE__ */ jsx17(EditorContent, { placeholder, foldable, children: outline && /* @__PURE__ */ jsx17(OutlinePlugin, {}) })
+    /* @__PURE__ */ jsx18(EditorContent, { placeholder, foldable, children: outline && /* @__PURE__ */ jsx18(OutlinePlugin, {}) })
   ] });
 }
 MarkdownEditor.Root = EditorRoot;
@@ -5187,6 +6967,9 @@ export {
   BLOCK_WIDTHS,
   BOX_DEFINITIONS,
   BOX_TYPES,
+  BUILTIN_CODE_LANGUAGES,
+  CODE_BLOCK,
+  CODE_TOKEN_TYPES,
   COLOR_PRESETS,
   CONNECTOR_TYPES,
   DEFAULT_TABLE_SETTINGS,
@@ -5203,6 +6986,7 @@ export {
   HistoryButtons,
   InsertButtons,
   MarkdownEditor_default as MarkdownEditor,
+  PLAIN_LANGUAGE,
   SHAPE_TYPES,
   SIDE_FIXED_POINTS,
   STROKE_COLORS,
@@ -5214,12 +6998,18 @@ export {
   anchorPoint,
   bindEndpoints,
   boxOutline,
+  codeTokenizer,
   connectorPoints,
   drawingToMermaid,
   expandSkeleton,
   findBoxAt,
   fixedPointFor,
   formatTableSettingsMarker,
+  getCodeLanguages,
+  hasCodeLanguage,
+  inkAmplitude,
+  inkFillOffset,
+  inkStroke,
   isBlockWidth,
   isDrawingSkeleton,
   makeBinding,
@@ -5227,8 +7017,15 @@ export {
   parseDrawingData,
   parseDrawingSkeleton,
   parseTableSettingsMarker,
+  registerCodeBlockHighlighting,
+  registerCodeLanguage,
   resolveBindings,
+  resolveCodeLanguage,
+  roundedPolyline,
+  roundedRectPolygon,
   routeElbow,
+  seedFrom,
   serializeDrawingData,
+  tokenizeCode,
   useMarkdownEditor
 };