testomatio-editor-blocks 0.4.53 → 0.4.54

package/package/editor/blocks/markdown.js

@@ -1,6 +1,5 @@
 const IMAGE_MARKDOWN_REGEX = /!\[([^\]]*)\]\(([^)]+?)(?:\s+=\d+x(?:\d+|\*))?\)/g;
 const MARKDOWN_ESCAPE_REGEX = /([*_\\])/g;
-const INLINE_SEGMENT_REGEX = /(\*\*\*[^*]+\*\*\*|___[^_]+___|\*\*[^*]+\*\*|__[^_]+__|\*[^*]+\*|_[^_]+_|<u>[^<]+<\/u>)/;
 export function escapeHtml(text) {
     return text
         .replace(/&/g, "&amp;")
@@ -12,46 +11,108 @@ export function escapeHtml(text) {
 function restoreEscapes(text) {
     return text.replace(/\uE000/g, "\\");
 }
+function findItalicClose(text, start, marker) {
+    let j = start;
+    while (j < text.length) {
+        const ch = text[j];
+        if (ch === "\uE000") {
+            j += 2;
+            continue;
+        }
+        if ((ch === "*" || ch === "_") && text[j + 1] === ch) {
+            const close = text.indexOf(ch + ch, j + 2);
+            if (close === -1) {
+                return -1;
+            }
+            j = close + 2;
+            continue;
+        }
+        if (ch === marker) {
+            return j;
+        }
+        j += 1;
+    }
+    return -1;
+}
+function parseInlineSegments(normalized, outer) {
+    const result = [];
+    let buffer = "";
+    const pushPlain = () => {
+        if (!buffer)
+            return;
+        result.push({ text: restoreEscapes(buffer), styles: { ...outer } });
+        buffer = "";
+    };
+    const wrap = (inner, add) => {
+        pushPlain();
+        result.push(...parseInlineSegments(inner, { ...outer, ...add }));
+    };
+    let i = 0;
+    while (i < normalized.length) {
+        if (normalized.startsWith("***", i)) {
+            const end = normalized.indexOf("***", i + 3);
+            if (end !== -1) {
+                wrap(normalized.slice(i + 3, end), { bold: true, italic: true });
+                i = end + 3;
+                continue;
+            }
+        }
+        if (normalized.startsWith("___", i)) {
+            const end = normalized.indexOf("___", i + 3);
+            if (end !== -1) {
+                wrap(normalized.slice(i + 3, end), { bold: true, italic: true });
+                i = end + 3;
+                continue;
+            }
+        }
+        if (normalized.startsWith("**", i)) {
+            const end = normalized.indexOf("**", i + 2);
+            if (end !== -1) {
+                wrap(normalized.slice(i + 2, end), { bold: true });
+                i = end + 2;
+                continue;
+            }
+        }
+        if (normalized.startsWith("__", i)) {
+            const end = normalized.indexOf("__", i + 2);
+            if (end !== -1) {
+                wrap(normalized.slice(i + 2, end), { bold: true });
+                i = end + 2;
+                continue;
+            }
+        }
+        if (normalized.startsWith("<u>", i)) {
+            const end = normalized.indexOf("</u>", i + 3);
+            if (end !== -1) {
+                wrap(normalized.slice(i + 3, end), { underline: true });
+                i = end + 4;
+                continue;
+            }
+        }
+        if (normalized[i] === "*" || normalized[i] === "_") {
+            const marker = normalized[i];
+            const end = findItalicClose(normalized, i + 1, marker);
+            if (end !== -1) {
+                wrap(normalized.slice(i + 1, end), { italic: true });
+                i = end + 1;
+                continue;
+            }
+        }
+        buffer += normalized[i];
+        i += 1;
+    }
+    pushPlain();
+    return result;
+}
 function parseInlineMarkdown(text) {
     if (!text) {
         return [];
     }
     const normalized = text.replace(/\\([*_`~])/g, "\uE000$1");
-    const rawSegments = normalized.split(INLINE_SEGMENT_REGEX).filter(Boolean);
-    return rawSegments.map((segment) => {
-        const baseStyles = { bold: false, italic: false, underline: false };
-        if (/^\*\*\*(.+)\*\*\*$/.test(segment) || /^___(.+)___$/.test(segment)) {
-            const content = segment.slice(3, -3);
-            return {
-                text: restoreEscapes(content),
-                styles: { bold: true, italic: true, underline: false },
-            };
-        }
-        if (/^\*\*(.+)\*\*$/.test(segment) || /^__(.+)__$/.test(segment)) {
-            const content = segment.slice(2, -2);
-            return {
-                text: restoreEscapes(content),
-                styles: { ...baseStyles, bold: true },
-            };
-        }
-        if (/^\*(.+)\*$/.test(segment) || /^_(.+)_$/.test(segment)) {
-            const content = segment.slice(1, -1);
-            return {
-                text: restoreEscapes(content),
-                styles: { ...baseStyles, italic: true },
-            };
-        }
-        if (/^<u>(.+)<\/u>$/.test(segment)) {
-            const content = segment.slice(3, -4);
-            return {
-                text: restoreEscapes(content),
-                styles: { ...baseStyles, underline: true },
-            };
-        }
-        return {
-            text: restoreEscapes(segment),
-            styles: { ...baseStyles },
-        };
+    return parseInlineSegments(normalized, {
+        bold: false,
+        italic: false,
+        underline: false,
     });
 }
 function inlineToHtml(inline) {

package/package/editor/blocks/stepField.js

@@ -753,6 +753,15 @@ export function StepField({ label, showLabel = true, labelToggle, labelAction, p
         }
         textareaNode.focus();
     }, [focusSignal, textareaNode]);
+    useAutoResize({
+        textarea: textareaNode,
+        enabled: multiline,
+        onResize: useCallback(() => {
+            var _a;
+            const instance = editorInstanceRef.current;
+            (_a = instance === null || instance === void 0 ? void 0 : instance._updateAutoHeight) === null || _a === void 0 ? void 0 : _a.call(instance);
+        }, []),
+    });
     useEffect(() => {
         var _a;
         const instance = editorInstanceRef.current;
@@ -814,12 +823,6 @@ export function StepField({ label, showLabel = true, labelToggle, labelAction, p
         }
         textareaNode.readOnly = readOnly;
     }, [readOnly, textareaNode]);
-    useAutoResize({
-        textarea: textareaNode,
-        multiline,
-        minRows: 3,
-        maxRows: 16,
-    });
     useEffect(() => {
         if (!textareaNode) {
             return;

package/package/editor/blocks/useAutoResize.d.ts

@@ -1,8 +1,7 @@
 type Options = {
     textarea: HTMLTextAreaElement | null;
-    multiline?: boolean;
-    minRows?: number;
-    maxRows?: number;
+    enabled?: boolean;
+    onResize: () => void;
 };
-export declare function useAutoResize({ textarea, multiline, minRows, maxRows }: Options): void;
+export declare function useAutoResize({ textarea, enabled, onResize }: Options): () => void;
 export {};

package/package/editor/blocks/useAutoResize.js

@@ -1,65 +1,77 @@
-import { useEffect, useRef } from "react";
-export function useAutoResize({ textarea, multiline = false, minRows = 2, maxRows = 12 }) {
+import { useCallback, useEffect, useRef } from "react";
+// Shared across all hook instances: one fonts.ready promise per document,
+// fanned out to every registered callback so N fields cost 1 .then().
+const fontsReadyCallbacks = new Set();
+let fontsReadyAttached = false;
+function registerFontsReady(cb) {
+    var _a;
+    if (typeof document === "undefined" || !((_a = document.fonts) === null || _a === void 0 ? void 0 : _a.ready)) {
+        return () => { };
+    }
+    fontsReadyCallbacks.add(cb);
+    if (!fontsReadyAttached) {
+        fontsReadyAttached = true;
+        document.fonts.ready
+            .then(() => {
+            for (const fn of fontsReadyCallbacks)
+                fn();
+        })
+            .catch(() => { });
+    }
+    return () => {
+        fontsReadyCallbacks.delete(cb);
+    };
+}
+export function useAutoResize({ textarea, enabled = true, onResize }) {
     const frameRef = useRef(0);
+    const onResizeRef = useRef(onResize);
+    useEffect(() => {
+        onResizeRef.current = onResize;
+    }, [onResize]);
     useEffect(() => {
-        var _a;
-        if (!textarea || !multiline) {
+        if (!textarea || !enabled)
             return;
-        }
-        const resize = () => {
-            textarea.style.height = "auto";
-            const lineHeight = parseFloat(getComputedStyle(textarea).lineHeight || "16");
-            const minHeight = lineHeight * minRows;
-            const maxHeight = lineHeight * maxRows;
-            const clampedHeight = Math.min(Math.max(textarea.scrollHeight, minHeight), maxHeight);
-            textarea.style.height = `${clampedHeight}px`;
-            textarea.style.overflowY = textarea.scrollHeight > maxHeight ? "auto" : "hidden";
-        };
-        const mutationObserver = new MutationObserver(resize);
-        mutationObserver.observe(textarea, { childList: true, characterData: true, subtree: true });
-        const resizeObserver = new ResizeObserver(resize);
-        resizeObserver.observe(textarea);
-        const handleInput = () => {
-            var _a;
-            cancelAnimationFrame((_a = frameRef.current) !== null && _a !== void 0 ? _a : 0);
-            frameRef.current = requestAnimationFrame(resize);
-        };
-        textarea.addEventListener("input", handleInput);
         let cancelled = false;
-        const initialFrame = requestAnimationFrame(() => {
+        // All callers go through this coalescing scheduler: repeated pings in a
+        // single frame collapse to one reflow.
+        const schedule = () => {
+            if (cancelled)
+                return;
+            if (frameRef.current)
+                return;
             frameRef.current = requestAnimationFrame(() => {
+                frameRef.current = 0;
                 if (!cancelled)
-                    resize();
+                    onResizeRef.current();
             });
-        });
-        // Re-run resize once the textarea is actually laid out. During drag-drop
-        // remounts the element can be briefly detached, so the initial RAF resize
-        // sees scrollHeight === 0 and clamps to minRows.
+        };
+        // Initial pass after layout.
+        schedule();
+        // One-shot: re-run once the textarea actually enters the layout tree.
+        // This is the piece that fixes the drag-drop remount and
+        // snippet-insert-while-hidden cases OverType itself cannot recover from.
         const intersectionObserver = new IntersectionObserver((entries) => {
             for (const entry of entries) {
-                if (entry.isIntersecting && !cancelled) {
-                    resize();
+                if (entry.isIntersecting) {
+                    schedule();
                     intersectionObserver.disconnect();
                     break;
                 }
             }
         });
         intersectionObserver.observe(textarea);
-        if (typeof document !== "undefined" && ((_a = document.fonts) === null || _a === void 0 ? void 0 : _a.ready)) {
-            document.fonts.ready.then(() => {
-                if (!cancelled)
-                    resize();
-            }).catch(() => { });
-        }
+        const unregisterFonts = registerFontsReady(schedule);
         return () => {
-            var _a;
             cancelled = true;
-            mutationObserver.disconnect();
-            resizeObserver.disconnect();
             intersectionObserver.disconnect();
-            textarea.removeEventListener("input", handleInput);
-            cancelAnimationFrame(initialFrame);
-            cancelAnimationFrame((_a = frameRef.current) !== null && _a !== void 0 ? _a : 0);
+            unregisterFonts();
+            if (frameRef.current) {
+                cancelAnimationFrame(frameRef.current);
+                frameRef.current = 0;
+            }
         };
-    }, [textarea, multiline, minRows, maxRows]);
+    }, [textarea, enabled]);
+    return useCallback(() => {
+        onResizeRef.current();
+    }, []);
 }

package/package/editor/customMarkdownConverter.js

@@ -521,28 +521,80 @@ export function blocksToMarkdown(blocks) {
     return cleaned;
 }
 function parseInlineMarkdown(text) {
-    const cleaned = stripHtmlWrappers(text);
+    return parseInlineSegments(stripHtmlWrappers(text), {});
+}
+function findItalicClose(text, start, marker) {
+    let j = start;
+    while (j < text.length) {
+        const ch = text[j];
+        if (ch === "\\") {
+            j += 2;
+            continue;
+        }
+        if ((ch === "*" || ch === "_") && text[j + 1] === ch) {
+            const close = text.indexOf(ch + ch, j + 2);
+            if (close === -1) {
+                return -1;
+            }
+            j = close + 2;
+            continue;
+        }
+        if (ch === marker) {
+            return j;
+        }
+        j += 1;
+    }
+    return -1;
+}
+function parseInlineSegments(cleaned, outerStyles) {
     const result = [];
     let buffer = "";
     const pushPlain = () => {
         if (buffer.length === 0) {
             return;
         }
-        result.push({ type: "text", text: unescapeMarkdown(buffer), styles: {} });
+        result.push({
+            type: "text",
+            text: unescapeMarkdown(buffer),
+            styles: { ...outerStyles },
+        });
         buffer = "";
     };
+    const wrap = (inner, add) => {
+        pushPlain();
+        const nested = parseInlineSegments(inner, { ...outerStyles, ...add });
+        result.push(...nested);
+    };
     let i = 0;
     while (i < cleaned.length) {
+        if (cleaned.startsWith("***", i)) {
+            const end = cleaned.indexOf("***", i + 3);
+            if (end !== -1) {
+                wrap(cleaned.slice(i + 3, end), { bold: true, italic: true });
+                i = end + 3;
+                continue;
+            }
+        }
+        if (cleaned.startsWith("___", i)) {
+            const end = cleaned.indexOf("___", i + 3);
+            if (end !== -1) {
+                wrap(cleaned.slice(i + 3, end), { bold: true, italic: true });
+                i = end + 3;
+                continue;
+            }
+        }
         if (cleaned.startsWith("**", i)) {
             const end = cleaned.indexOf("**", i + 2);
             if (end !== -1) {
-                pushPlain();
-                const inner = cleaned.slice(i + 2, end);
-                result.push({
-                    type: "text",
-                    text: unescapeMarkdown(inner),
-                    styles: { bold: true },
-                });
+                wrap(cleaned.slice(i + 2, end), { bold: true });
+                i = end + 2;
+                continue;
+            }
+        }
+        if (cleaned.startsWith("__", i)) {
+            const end = cleaned.indexOf("__", i + 2);
+            if (end !== -1) {
+                wrap(cleaned.slice(i + 2, end), { bold: true });
                 i = end + 2;
                 continue;
             }
@@ -550,13 +602,7 @@ function parseInlineMarkdown(text) {
         if (cleaned.startsWith("~~", i)) {
             const end = cleaned.indexOf("~~", i + 2);
             if (end !== -1) {
-                pushPlain();
-                const inner = cleaned.slice(i + 2, end);
-                result.push({
-                    type: "text",
-                    text: unescapeMarkdown(inner),
-                    styles: { strike: true },
-                });
+                wrap(cleaned.slice(i + 2, end), { strike: true });
                 i = end + 2;
                 continue;
             }
@@ -569,7 +615,7 @@ function parseInlineMarkdown(text) {
                 result.push({
                     type: "text",
                     text: unescapeMarkdown(inner),
-                    styles: { code: true },
+                    styles: { ...outerStyles, code: true },
                 });
                 i = end + 1;
                 continue;
@@ -583,7 +629,7 @@ function parseInlineMarkdown(text) {
                 pushPlain();
                 const label = cleaned.slice(i + 1, endLabel);
                 const href = cleaned.slice(startLink + 1, endLink);
-                const parsedLabel = parseInlineMarkdown(label);
+                const parsedLabel = parseInlineSegments(label, {});
                 // Ensure link content is never undefined - if empty, add empty text
                 const linkContent = parsedLabel.length > 0 ? parsedLabel : [{ type: "text", text: "", styles: {} }];
                 result.push({
@@ -597,15 +643,9 @@ function parseInlineMarkdown(text) {
         }
         if (cleaned[i] === "*" || cleaned[i] === "_") {
             const marker = cleaned[i];
-            const end = cleaned.indexOf(marker, i + 1);
+            const end = findItalicClose(cleaned, i + 1, marker);
             if (end !== -1) {
-                pushPlain();
-                const inner = cleaned.slice(i + 1, end);
-                result.push({
-                    type: "text",
-                    text: unescapeMarkdown(inner),
-                    styles: { italic: true },
-                });
+                wrap(cleaned.slice(i + 1, end), { italic: true });
                 i = end + 1;
                 continue;
             }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "testomatio-editor-blocks",
-  "version": "0.4.53",
+  "version": "0.4.54",
   "description": "Custom BlockNote schema, markdown conversion helpers, and UI for Testomatio-style test cases and steps.",
   "type": "module",
   "main": "./package/index.js",

package/src/editor/blocks/markdown.ts

@@ -1,7 +1,5 @@
 const IMAGE_MARKDOWN_REGEX = /!\[([^\]]*)\]\(([^)]+?)(?:\s+=\d+x(?:\d+|\*))?\)/g;
 const MARKDOWN_ESCAPE_REGEX = /([*_\\])/g;
-const INLINE_SEGMENT_REGEX =
-  /(\*\*\*[^*]+\*\*\*|___[^_]+___|\*\*[^*]+\*\*|__[^_]+__|\*[^*]+\*|_[^_]+_|<u>[^<]+<\/u>)/;
 
 export function escapeHtml(text: string): string {
   return text
@@ -25,53 +23,125 @@ function restoreEscapes(text: string): string {
   return text.replace(/\uE000/g, "\\");
 }
 
-function parseInlineMarkdown(text: string): InlineSegment[] {
-  if (!text) {
-    return [];
+function findItalicClose(
+  text: string,
+  start: number,
+  marker: "*" | "_",
+): number {
+  let j = start;
+  while (j < text.length) {
+    const ch = text[j];
+    if (ch === "\uE000") {
+      j += 2;
+      continue;
+    }
+    if ((ch === "*" || ch === "_") && text[j + 1] === ch) {
+      const close = text.indexOf(ch + ch, j + 2);
+      if (close === -1) {
+        return -1;
+      }
+      j = close + 2;
+      continue;
+    }
+    if (ch === marker) {
+      return j;
+    }
+    j += 1;
   }
+  return -1;
+}
 
-  const normalized = text.replace(/\\([*_`~])/g, "\uE000$1");
-  const rawSegments = normalized.split(INLINE_SEGMENT_REGEX).filter(Boolean);
+function parseInlineSegments(
+  normalized: string,
+  outer: { bold: boolean; italic: boolean; underline: boolean },
+): InlineSegment[] {
+  const result: InlineSegment[] = [];
+  let buffer = "";
+
+  const pushPlain = () => {
+    if (!buffer) return;
+    result.push({ text: restoreEscapes(buffer), styles: { ...outer } });
+    buffer = "";
+  };
 
-  return rawSegments.map((segment) => {
-    const baseStyles = { bold: false, italic: false, underline: false };
+  const wrap = (
+    inner: string,
+    add: Partial<{ bold: boolean; italic: boolean; underline: boolean }>,
+  ) => {
+    pushPlain();
+    result.push(...parseInlineSegments(inner, { ...outer, ...add }));
+  };
 
-    if (/^\*\*\*(.+)\*\*\*$/.test(segment) || /^___(.+)___$/.test(segment)) {
-      const content = segment.slice(3, -3);
-      return {
-        text: restoreEscapes(content),
-        styles: { bold: true, italic: true, underline: false },
-      };
+  let i = 0;
+  while (i < normalized.length) {
+    if (normalized.startsWith("***", i)) {
+      const end = normalized.indexOf("***", i + 3);
+      if (end !== -1) {
+        wrap(normalized.slice(i + 3, end), { bold: true, italic: true });
+        i = end + 3;
+        continue;
+      }
     }
-
-    if (/^\*\*(.+)\*\*$/.test(segment) || /^__(.+)__$/.test(segment)) {
-      const content = segment.slice(2, -2);
-      return {
-        text: restoreEscapes(content),
-        styles: { ...baseStyles, bold: true },
-      };
+    if (normalized.startsWith("___", i)) {
+      const end = normalized.indexOf("___", i + 3);
+      if (end !== -1) {
+        wrap(normalized.slice(i + 3, end), { bold: true, italic: true });
+        i = end + 3;
+        continue;
+      }
     }
-
-    if (/^\*(.+)\*$/.test(segment) || /^_(.+)_$/.test(segment)) {
-      const content = segment.slice(1, -1);
-      return {
-        text: restoreEscapes(content),
-        styles: { ...baseStyles, italic: true },
-      };
+    if (normalized.startsWith("**", i)) {
+      const end = normalized.indexOf("**", i + 2);
+      if (end !== -1) {
+        wrap(normalized.slice(i + 2, end), { bold: true });
+        i = end + 2;
+        continue;
+      }
     }
-
-    if (/^<u>(.+)<\/u>$/.test(segment)) {
-      const content = segment.slice(3, -4);
-      return {
-        text: restoreEscapes(content),
-        styles: { ...baseStyles, underline: true },
-      };
+    if (normalized.startsWith("__", i)) {
+      const end = normalized.indexOf("__", i + 2);
+      if (end !== -1) {
+        wrap(normalized.slice(i + 2, end), { bold: true });
+        i = end + 2;
+        continue;
+      }
+    }
+    if (normalized.startsWith("<u>", i)) {
+      const end = normalized.indexOf("</u>", i + 3);
+      if (end !== -1) {
+        wrap(normalized.slice(i + 3, end), { underline: true });
+        i = end + 4;
+        continue;
+      }
     }
+    if (normalized[i] === "*" || normalized[i] === "_") {
+      const marker = normalized[i] as "*" | "_";
+      const end = findItalicClose(normalized, i + 1, marker);
+      if (end !== -1) {
+        wrap(normalized.slice(i + 1, end), { italic: true });
+        i = end + 1;
+        continue;
+      }
+    }
+
+    buffer += normalized[i];
+    i += 1;
+  }
 
-    return {
-      text: restoreEscapes(segment),
-      styles: { ...baseStyles },
-    };
+  pushPlain();
+  return result;
+}
+
+function parseInlineMarkdown(text: string): InlineSegment[] {
+  if (!text) {
+    return [];
+  }
+
+  const normalized = text.replace(/\\([*_`~])/g, "\uE000$1");
+  return parseInlineSegments(normalized, {
+    bold: false,
+    italic: false,
+    underline: false,
   });
 }
 

package/src/editor/blocks/stepField.tsx

@@ -945,6 +945,15 @@ export function StepField({
     textareaNode.focus();
   }, [focusSignal, textareaNode]);
 
+  useAutoResize({
+    textarea: textareaNode,
+    enabled: multiline,
+    onResize: useCallback(() => {
+      const instance = editorInstanceRef.current as (OverTypeInstance & { _updateAutoHeight?: () => void }) | null;
+      instance?._updateAutoHeight?.();
+    }, []),
+  });
+
   useEffect(() => {
     const instance = editorInstanceRef.current;
     if (!instance) {
@@ -1012,13 +1021,6 @@ export function StepField({
     textareaNode.readOnly = readOnly;
   }, [readOnly, textareaNode]);
 
-  useAutoResize({
-    textarea: textareaNode,
-    multiline,
-    minRows: 3,
-    maxRows: 16,
-  });
-
   useEffect(() => {
     if (!textareaNode) {
       return;

package/src/editor/blocks/useAutoResize.ts

@@ -1,58 +1,68 @@
-import { useEffect, useRef } from "react";
+import { useCallback, useEffect, useRef } from "react";
 
 type Options = {
   textarea: HTMLTextAreaElement | null;
-  multiline?: boolean;
-  minRows?: number;
-  maxRows?: number;
+  enabled?: boolean;
+  onResize: () => void;
 };
 
-export function useAutoResize({ textarea, multiline = false, minRows = 2, maxRows = 12 }: Options) {
-  const frameRef = useRef<number>(0);
-
-  useEffect(() => {
-    if (!textarea || !multiline) {
-      return;
-    }
+// Shared across all hook instances: one fonts.ready promise per document,
+// fanned out to every registered callback so N fields cost 1 .then().
+const fontsReadyCallbacks = new Set<() => void>();
+let fontsReadyAttached = false;
 
-    const resize = () => {
-      textarea.style.height = "auto";
-      const lineHeight = parseFloat(getComputedStyle(textarea).lineHeight || "16");
-      const minHeight = lineHeight * minRows;
-      const maxHeight = lineHeight * maxRows;
-
-      const clampedHeight = Math.min(Math.max(textarea.scrollHeight, minHeight), maxHeight);
-      textarea.style.height = `${clampedHeight}px`;
-      textarea.style.overflowY = textarea.scrollHeight > maxHeight ? "auto" : "hidden";
-    };
-
-    const mutationObserver = new MutationObserver(resize);
-    mutationObserver.observe(textarea, { childList: true, characterData: true, subtree: true });
+function registerFontsReady(cb: () => void): () => void {
+  if (typeof document === "undefined" || !document.fonts?.ready) {
+    return () => {};
+  }
+  fontsReadyCallbacks.add(cb);
+  if (!fontsReadyAttached) {
+    fontsReadyAttached = true;
+    document.fonts.ready
+      .then(() => {
+        for (const fn of fontsReadyCallbacks) fn();
+      })
+      .catch(() => {});
+  }
+  return () => {
+    fontsReadyCallbacks.delete(cb);
+  };
+}
 
-    const resizeObserver = new ResizeObserver(resize);
-    resizeObserver.observe(textarea);
+export function useAutoResize({ textarea, enabled = true, onResize }: Options) {
+  const frameRef = useRef<number>(0);
+  const onResizeRef = useRef(onResize);
 
-    const handleInput = () => {
-      cancelAnimationFrame(frameRef.current ?? 0);
-      frameRef.current = requestAnimationFrame(resize);
-    };
+  useEffect(() => {
+    onResizeRef.current = onResize;
+  }, [onResize]);
 
-    textarea.addEventListener("input", handleInput);
+  useEffect(() => {
+    if (!textarea || !enabled) return;
 
     let cancelled = false;
-    const initialFrame = requestAnimationFrame(() => {
+
+    // All callers go through this coalescing scheduler: repeated pings in a
+    // single frame collapse to one reflow.
+    const schedule = () => {
+      if (cancelled) return;
+      if (frameRef.current) return;
       frameRef.current = requestAnimationFrame(() => {
-        if (!cancelled) resize();
+        frameRef.current = 0;
+        if (!cancelled) onResizeRef.current();
       });
-    });
+    };
+
+    // Initial pass after layout.
+    schedule();
 
-    // Re-run resize once the textarea is actually laid out. During drag-drop
-    // remounts the element can be briefly detached, so the initial RAF resize
-    // sees scrollHeight === 0 and clamps to minRows.
+    // One-shot: re-run once the textarea actually enters the layout tree.
+    // This is the piece that fixes the drag-drop remount and
+    // snippet-insert-while-hidden cases OverType itself cannot recover from.
     const intersectionObserver = new IntersectionObserver((entries) => {
       for (const entry of entries) {
-        if (entry.isIntersecting && !cancelled) {
-          resize();
+        if (entry.isIntersecting) {
+          schedule();
           intersectionObserver.disconnect();
           break;
         }
@@ -60,20 +70,20 @@ export function useAutoResize({ textarea, multiline = false, minRows = 2, maxRow
     });
     intersectionObserver.observe(textarea);
 
-    if (typeof document !== "undefined" && document.fonts?.ready) {
-      document.fonts.ready.then(() => {
-        if (!cancelled) resize();
-      }).catch(() => {});
-    }
+    const unregisterFonts = registerFontsReady(schedule);
 
     return () => {
       cancelled = true;
-      mutationObserver.disconnect();
-      resizeObserver.disconnect();
       intersectionObserver.disconnect();
-      textarea.removeEventListener("input", handleInput);
-      cancelAnimationFrame(initialFrame);
-      cancelAnimationFrame(frameRef.current ?? 0);
+      unregisterFonts();
+      if (frameRef.current) {
+        cancelAnimationFrame(frameRef.current);
+        frameRef.current = 0;
+      }
     };
-  }, [textarea, multiline, minRows, maxRows]);
+  }, [textarea, enabled]);
+
+  return useCallback(() => {
+    onResizeRef.current();
+  }, []);
 }

package/src/editor/customMarkdownConverter.ts

@@ -630,7 +630,41 @@ export function blocksToMarkdown(blocks: CustomEditorBlock[]): string {
 }
 
 function parseInlineMarkdown(text: string): EditorInline[] {
-  const cleaned = stripHtmlWrappers(text);
+  return parseInlineSegments(stripHtmlWrappers(text), {});
+}
+
+function findItalicClose(
+  text: string,
+  start: number,
+  marker: "*" | "_",
+): number {
+  let j = start;
+  while (j < text.length) {
+    const ch = text[j];
+    if (ch === "\\") {
+      j += 2;
+      continue;
+    }
+    if ((ch === "*" || ch === "_") && text[j + 1] === ch) {
+      const close = text.indexOf(ch + ch, j + 2);
+      if (close === -1) {
+        return -1;
+      }
+      j = close + 2;
+      continue;
+    }
+    if (ch === marker) {
+      return j;
+    }
+    j += 1;
+  }
+  return -1;
+}
+
+function parseInlineSegments(
+  cleaned: string,
+  outerStyles: Record<string, boolean>,
+): EditorInline[] {
   const result: EditorInline[] = [];
   let buffer = "";
 
@@ -638,22 +672,53 @@ function parseInlineMarkdown(text: string): EditorInline[] {
     if (buffer.length === 0) {
       return;
     }
-    result.push({ type: "text", text: unescapeMarkdown(buffer), styles: {} });
+    result.push({
+      type: "text",
+      text: unescapeMarkdown(buffer),
+      styles: { ...outerStyles } as EditorStyles,
+    });
     buffer = "";
   };
 
+  const wrap = (inner: string, add: Record<string, boolean>) => {
+    pushPlain();
+    const nested = parseInlineSegments(inner, { ...outerStyles, ...add });
+    result.push(...nested);
+  };
+
   let i = 0;
   while (i < cleaned.length) {
+    if (cleaned.startsWith("***", i)) {
+      const end = cleaned.indexOf("***", i + 3);
+      if (end !== -1) {
+        wrap(cleaned.slice(i + 3, end), { bold: true, italic: true });
+        i = end + 3;
+        continue;
+      }
+    }
+
+    if (cleaned.startsWith("___", i)) {
+      const end = cleaned.indexOf("___", i + 3);
+      if (end !== -1) {
+        wrap(cleaned.slice(i + 3, end), { bold: true, italic: true });
+        i = end + 3;
+        continue;
+      }
+    }
+
     if (cleaned.startsWith("**", i)) {
       const end = cleaned.indexOf("**", i + 2);
       if (end !== -1) {
-        pushPlain();
-        const inner = cleaned.slice(i + 2, end);
-        result.push({
-          type: "text",
-          text: unescapeMarkdown(inner),
-          styles: { bold: true },
-        });
+        wrap(cleaned.slice(i + 2, end), { bold: true });
+        i = end + 2;
+        continue;
+      }
+    }
+
+    if (cleaned.startsWith("__", i)) {
+      const end = cleaned.indexOf("__", i + 2);
+      if (end !== -1) {
+        wrap(cleaned.slice(i + 2, end), { bold: true });
         i = end + 2;
         continue;
       }
@@ -662,13 +727,7 @@ function parseInlineMarkdown(text: string): EditorInline[] {
     if (cleaned.startsWith("~~", i)) {
       const end = cleaned.indexOf("~~", i + 2);
       if (end !== -1) {
-        pushPlain();
-        const inner = cleaned.slice(i + 2, end);
-        result.push({
-          type: "text",
-          text: unescapeMarkdown(inner),
-          styles: { strike: true },
-        });
+        wrap(cleaned.slice(i + 2, end), { strike: true });
         i = end + 2;
         continue;
       }
@@ -682,7 +741,7 @@ function parseInlineMarkdown(text: string): EditorInline[] {
         result.push({
           type: "text",
           text: unescapeMarkdown(inner),
-          styles: { code: true },
+          styles: { ...outerStyles, code: true } as EditorStyles,
         });
         i = end + 1;
         continue;
@@ -697,7 +756,7 @@ function parseInlineMarkdown(text: string): EditorInline[] {
         pushPlain();
         const label = cleaned.slice(i + 1, endLabel);
         const href = cleaned.slice(startLink + 1, endLink);
-        const parsedLabel = parseInlineMarkdown(label);
+        const parsedLabel = parseInlineSegments(label, {});
         // Ensure link content is never undefined - if empty, add empty text
         const linkContent = parsedLabel.length > 0 ? parsedLabel : [{ type: "text", text: "", styles: {} }];
         result.push({
@@ -711,16 +770,10 @@ function parseInlineMarkdown(text: string): EditorInline[] {
     }
 
     if (cleaned[i] === "*" || cleaned[i] === "_") {
-      const marker = cleaned[i];
-      const end = cleaned.indexOf(marker, i + 1);
+      const marker = cleaned[i] as "*" | "_";
+      const end = findItalicClose(cleaned, i + 1, marker);
       if (end !== -1) {
-        pushPlain();
-        const inner = cleaned.slice(i + 1, end);
-        result.push({
-          type: "text",
-          text: unescapeMarkdown(inner),
-          styles: { italic: true },
-        });
+        wrap(cleaned.slice(i + 1, end), { italic: true });
         i = end + 1;
         continue;
       }

package/src/editor/markdownToBlocks.test.ts

@@ -130,4 +130,43 @@ describe("markdownToBlocks", () => {
       children: [],
     });
   });
+
+  it("parses combined bold+italic using nested delimiters", () => {
+    const blocks = markdownToBlocks(
+      "The _**Username**_ and **_Password_** fields and ***both*** and ___both___.",
+    );
+
+    expect(blocks).toHaveLength(1);
+    expect(blocks[0]).toEqual({
+      type: "paragraph",
+      props: baseProps,
+      content: [
+        { type: "text", text: "The ", styles: {} },
+        { type: "text", text: "Username", styles: { italic: true, bold: true } },
+        { type: "text", text: " and ", styles: {} },
+        { type: "text", text: "Password", styles: { bold: true, italic: true } },
+        { type: "text", text: " fields and ", styles: {} },
+        { type: "text", text: "both", styles: { bold: true, italic: true } },
+        { type: "text", text: " and ", styles: {} },
+        { type: "text", text: "both", styles: { bold: true, italic: true } },
+        { type: "text", text: ".", styles: {} },
+      ],
+      children: [],
+    });
+  });
+
+  it("parses bold with nested italic keeping both styles", () => {
+    const blocks = markdownToBlocks("**foo _bar_ baz**");
+
+    expect(blocks[0]).toEqual({
+      type: "paragraph",
+      props: baseProps,
+      content: [
+        { type: "text", text: "foo ", styles: { bold: true } },
+        { type: "text", text: "bar", styles: { bold: true, italic: true } },
+        { type: "text", text: " baz", styles: { bold: true } },
+      ],
+      children: [],
+    });
+  });
 });