@overlap/rte 1.0.3 → 1.0.5

package/dist/index.js

@@ -272,6 +272,12 @@ function ensureAllCheckboxes(editor) {
         if (!ul.classList.contains("rte-checkbox-list")) {
             ul.classList.add("rte-checkbox-list");
         }
+        // Propagate checkbox class to nested ULs inside LI children
+        ul.querySelectorAll(":scope > li > ul").forEach((nestedUl) => {
+            if (!nestedUl.classList.contains("rte-checkbox-list")) {
+                nestedUl.classList.add("rte-checkbox-list");
+            }
+        });
         // Handle GitHub format: convert <input type="checkbox"> to aria-checked
         ul.querySelectorAll(":scope > li").forEach((li) => {
             const input = li.querySelector('input[type="checkbox"]');
@@ -874,9 +880,8 @@ function domToContent(element) {
         if (tagName === "input" && el.getAttribute("type") === "checkbox") {
             return null;
         }
-        // Handle <br> as empty text
         if (tagName === "br") {
-            return null;
+            return { type: "br" };
         }
         if (tagName === "img") {
             const attributes = {};
@@ -1426,8 +1431,10 @@ function indentListItem(selection) {
         // Create nested list in the previous item
         let nestedList = previousItem.querySelector('ul, ol');
         if (!nestedList) {
-            // Create new nested list
             nestedList = document.createElement(list.tagName.toLowerCase());
+            if (list.classList.contains('rte-checkbox-list')) {
+                nestedList.classList.add('rte-checkbox-list');
+            }
             previousItem.appendChild(nestedList);
         }
         // Move current item into nested list
@@ -1455,6 +1462,9 @@ function indentListItem(selection) {
     else {
         // No previous item — create new nested list in current item
         const nestedList = document.createElement(list.tagName.toLowerCase());
+        if (list.classList.contains('rte-checkbox-list')) {
+            nestedList.classList.add('rte-checkbox-list');
+        }
         // Move all following items into the nested list
         let nextSibling = listItem.nextElementSibling;
         while (nextSibling && nextSibling.tagName === 'LI') {
@@ -1683,8 +1693,25 @@ function handleMarkdownShortcut(editor, e) {
 /** Remove the trigger characters from the text node before applying formatting. */
 function clearBlockText(textNode, charCount) {
     const text = textNode.textContent || "";
-    textNode.textContent = text.substring(charCount);
-    // Reset cursor to start
+    const remaining = text.substring(charCount);
+    textNode.textContent = remaining;
+    if (remaining === "") {
+        const parent = textNode.parentElement;
+        if (parent) {
+            parent.removeChild(textNode);
+            const br = document.createElement("br");
+            parent.appendChild(br);
+            const selection = window.getSelection();
+            if (selection) {
+                const range = document.createRange();
+                range.setStart(parent, 0);
+                range.collapse(true);
+                selection.removeAllRanges();
+                selection.addRange(range);
+            }
+            return;
+        }
+    }
     const selection = window.getSelection();
     if (selection) {
         const range = document.createRange();
@@ -3227,7 +3254,7 @@ function createImagePlugin(onImageUpload) {
                     }
                 }
             };
-            return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("button", { type: "button", onClick: () => setShowModal(true), disabled: props.disabled, className: "rte-toolbar-button", title: "Insert Image", "aria-label": "Insert Image", children: jsxRuntime.jsx(IconWrapper, { icon: "mdi:image", width: 18, height: 18 }) }), showModal && (jsxRuntime.jsx("div", { className: "rte-image-modal-overlay", onClick: (e) => {
+            return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("button", { type: "button", onClick: () => setShowModal(true), disabled: props.disabled, className: "rte-toolbar-button", title: "Insert Image", "aria-label": "Insert Image", children: jsxRuntime.jsx(IconWrapper, { icon: "mdi:image", width: 18, height: 18 }) }), showModal && (jsxRuntime.jsx("div", { className: "rte-image-modal-overlay", onMouseDown: (e) => e.stopPropagation(), onClick: (e) => {
                             if (e.target === e.currentTarget) {
                                 setShowModal(false);
                             }
@@ -5141,10 +5168,18 @@ const Editor = ({ initialContent, onChange, plugins: providedPlugins, placeholde
                 {
                     "--rte-button-hover-bg": theme.buttonHoverBg,
                 }),
+            ...(theme.buttonActiveBg &&
+                {
+                    "--rte-button-active-bg": theme.buttonActiveBg,
+                }),
             ...(theme.contentBg &&
                 {
                     "--rte-content-bg": theme.contentBg,
                 }),
+            ...(theme.textColor &&
+                {
+                    "--rte-text-color": theme.textColor,
+                }),
             ...(theme.primaryColor &&
                 {
                     "--rte-primary-color": theme.primaryColor,