@apollohg/react-native-prose-editor 0.1.0

package/android/src/main/java/com/apollohg/editor/EditorHeightBehavior.kt

@@ -0,0 +1,14 @@
+package com.apollohg.editor
+
+enum class EditorHeightBehavior {
+    FIXED,
+    AUTO_GROW;
+
+    companion object {
+        fun fromRaw(rawValue: String?): EditorHeightBehavior =
+            when (rawValue) {
+                "autoGrow" -> AUTO_GROW
+                else -> FIXED
+            }
+    }
+}

package/android/src/main/java/com/apollohg/editor/EditorInputConnection.kt

@@ -0,0 +1,191 @@
+package com.apollohg.editor
+
+import android.view.KeyEvent
+import android.view.inputmethod.InputConnection
+import android.view.inputmethod.InputConnectionWrapper
+
+/**
+ * Custom [InputConnectionWrapper] that intercepts all text input from the soft keyboard
+ * and routes it through the Rust editor-core engine via the hosting [EditorEditText].
+ *
+ * Instead of letting Android's EditText text storage handle insertions and deletions
+ * directly, this class captures the user's intent (typing, deleting, IME composition)
+ * and delegates to the Rust editor. The Rust editor returns render elements, which are
+ * converted to [android.text.SpannableStringBuilder] via [RenderBridge] and applied
+ * back to the EditText.
+ *
+ * ## Composition (IME) Handling
+ *
+ * For CJK input methods (and swipe keyboards), [setComposingText] and
+ * [finishComposingText] are used. During composition, we let the base [InputConnection]
+ * handle composing text normally so the user sees their in-progress input with the
+ * composing underline. When composition finalizes ([finishComposingText]), we capture
+ * the result and route it through Rust.
+ *
+ * ## Key Events
+ *
+ * Hardware keyboard events (backspace, enter) arrive via [sendKeyEvent]. We intercept
+ * DEL and ENTER to route through the Rust editor.
+ */
+class EditorInputConnection(
+    private val editorView: EditorEditText,
+    baseConnection: InputConnection
+) : InputConnectionWrapper(baseConnection, true) {
+
+    companion object {
+        internal fun codePointsToUtf16Length(
+            text: String,
+            fromUtf16Offset: Int,
+            codePointCount: Int,
+            forward: Boolean
+        ): Int {
+            if (codePointCount <= 0 || text.isEmpty()) return 0
+
+            var remaining = codePointCount
+            var utf16Length = 0
+
+            if (forward) {
+                var index = fromUtf16Offset.coerceIn(0, text.length)
+                while (index < text.length && remaining > 0) {
+                    val codePoint = Character.codePointAt(text, index)
+                    val charCount = Character.charCount(codePoint)
+                    utf16Length += charCount
+                    index += charCount
+                    remaining--
+                }
+            } else {
+                var index = fromUtf16Offset.coerceIn(0, text.length)
+                while (index > 0 && remaining > 0) {
+                    val codePoint = Character.codePointBefore(text, index)
+                    val charCount = Character.charCount(codePoint)
+                    utf16Length += charCount
+                    index -= charCount
+                    remaining--
+                }
+            }
+
+            return utf16Length
+        }
+    }
+
+    /** Tracks the current composing text for CJK/swipe input. */
+    private var composingText: String? = null
+
+    /**
+     * Called when the IME commits finalized text (single character, word,
+     * autocomplete selection, etc.).
+     *
+     * Routes the text through Rust instead of directly inserting into the EditText.
+     */
+    override fun commitText(text: CharSequence?, newCursorPosition: Int): Boolean {
+        if (!editorView.isEditable) return false
+        if (editorView.isApplyingRustState) {
+            return super.commitText(text, newCursorPosition)
+        }
+        text?.toString()?.let { editorView.handleTextCommit(it) }
+        return true
+    }
+
+    /**
+     * Called when the IME requests deletion of text surrounding the cursor.
+     *
+     * Routes the deletion through Rust instead of directly modifying the EditText.
+     *
+     * @param beforeLength Number of UTF-16 code units to delete before the cursor.
+     * @param afterLength Number of UTF-16 code units to delete after the cursor.
+     */
+    override fun deleteSurroundingText(beforeLength: Int, afterLength: Int): Boolean {
+        if (!editorView.isEditable) return false
+        if (editorView.isApplyingRustState) {
+            return super.deleteSurroundingText(beforeLength, afterLength)
+        }
+        editorView.handleDelete(beforeLength, afterLength)
+        return true
+    }
+
+    override fun deleteSurroundingTextInCodePoints(beforeLength: Int, afterLength: Int): Boolean {
+        if (!editorView.isEditable) return false
+        if (editorView.isApplyingRustState) {
+            return super.deleteSurroundingTextInCodePoints(beforeLength, afterLength)
+        }
+
+        val currentText = editorView.text?.toString().orEmpty()
+        val cursor = editorView.selectionStart.coerceAtLeast(0)
+        val beforeUtf16Length = codePointsToUtf16Length(
+            text = currentText,
+            fromUtf16Offset = cursor,
+            codePointCount = beforeLength,
+            forward = false
+        )
+        val afterUtf16Length = codePointsToUtf16Length(
+            text = currentText,
+            fromUtf16Offset = editorView.selectionEnd.coerceAtLeast(cursor),
+            codePointCount = afterLength,
+            forward = true
+        )
+        editorView.handleDelete(beforeUtf16Length, afterUtf16Length)
+        return true
+    }
+
+    /**
+     * Called when the IME sets composing (in-progress) text for CJK/swipe input.
+     *
+     * We let the base InputConnection handle this normally so the user sees
+     * the composing text with its underline decoration. The text is NOT sent
+     * to Rust during composition — only when [finishComposingText] is called.
+     */
+    override fun setComposingText(text: CharSequence?, newCursorPosition: Int): Boolean {
+        if (!editorView.isEditable) return super.setComposingText(text, newCursorPosition)
+        composingText = text?.toString()
+        return super.setComposingText(text, newCursorPosition)
+    }
+
+    /**
+     * Called when IME composition is finalized (user selects a candidate or
+     * presses space/enter to commit the composing text).
+     *
+     * At this point, the composed text is final. We notify the [EditorEditText]
+     * so it can capture the result and send it to Rust.
+     */
+    override fun finishComposingText(): Boolean {
+        if (!editorView.isEditable) return super.finishComposingText()
+        val composed = composingText
+        composingText = null
+
+        // Prevent selection sync while the base connection commits the composed
+        // text, since the Rust document doesn't have it yet.
+        editorView.isApplyingRustState = true
+        val result = super.finishComposingText()
+        editorView.isApplyingRustState = false
+
+        // Now route the composed text through Rust.
+        if (!editorView.isApplyingRustState) {
+            editorView.handleCompositionFinished(composed)
+        }
+        return result
+    }
+
+    /**
+     * Called for hardware keyboard key events.
+     *
+     * Intercepts DEL (backspace) and ENTER to route through Rust. Other key
+     * events are passed through to the base connection.
+     */
+    override fun sendKeyEvent(event: KeyEvent?): Boolean {
+        if (!editorView.isEditable) return false
+        if (event != null && event.action == KeyEvent.ACTION_DOWN) {
+            if (editorView.handleHardwareKeyDown(event.keyCode, event.isShiftPressed)) {
+                return true
+            }
+        }
+        if (event != null && event.action == KeyEvent.ACTION_UP) {
+            when (event.keyCode) {
+                KeyEvent.KEYCODE_DEL,
+                KeyEvent.KEYCODE_ENTER,
+                KeyEvent.KEYCODE_NUMPAD_ENTER,
+                KeyEvent.KEYCODE_TAB -> return true
+            }
+        }
+        return super.sendKeyEvent(event)
+    }
+}

package/android/src/main/java/com/apollohg/editor/EditorTheme.kt

@@ -0,0 +1,325 @@
+package com.apollohg.editor
+
+import android.graphics.Color
+import android.graphics.Typeface
+import org.json.JSONObject
+
+data class EditorTextStyle(
+    val fontFamily: String? = null,
+    val fontSize: Float? = null,
+    val fontWeight: String? = null,
+    val fontStyle: String? = null,
+    val color: Int? = null,
+    val lineHeight: Float? = null,
+    val spacingAfter: Float? = null
+) {
+    companion object {
+        fun fromJson(json: JSONObject?): EditorTextStyle? {
+            json ?: return null
+            return EditorTextStyle(
+                fontFamily = json.optNullableString("fontFamily"),
+                fontSize = json.optNullableFloat("fontSize"),
+                fontWeight = json.optNullableString("fontWeight"),
+                fontStyle = json.optNullableString("fontStyle"),
+                color = parseColor(json.optNullableString("color")),
+                lineHeight = json.optNullableFloat("lineHeight"),
+                spacingAfter = json.optNullableFloat("spacingAfter")
+            )
+        }
+    }
+
+    fun mergedWith(other: EditorTextStyle?): EditorTextStyle {
+        other ?: return this
+        return copy(
+            fontFamily = other.fontFamily ?: fontFamily,
+            fontSize = other.fontSize ?: fontSize,
+            fontWeight = other.fontWeight ?: fontWeight,
+            fontStyle = other.fontStyle ?: fontStyle,
+            color = other.color ?: color,
+            lineHeight = other.lineHeight ?: lineHeight,
+            spacingAfter = other.spacingAfter ?: spacingAfter
+        )
+    }
+
+    fun typefaceStyle(): Int {
+        val bold = fontWeight == "bold" || fontWeight?.toIntOrNull()?.let { it >= 600 } == true
+        val italic = fontStyle == "italic"
+        return when {
+            bold && italic -> Typeface.BOLD_ITALIC
+            bold -> Typeface.BOLD
+            italic -> Typeface.ITALIC
+            else -> Typeface.NORMAL
+        }
+    }
+}
+
+data class EditorListTheme(
+    val indent: Float? = null,
+    val itemSpacing: Float? = null,
+    val markerColor: Int? = null,
+    val markerScale: Float? = null
+) {
+    companion object {
+        fun fromJson(json: JSONObject?): EditorListTheme? {
+            json ?: return null
+            return EditorListTheme(
+                indent = json.optNullableFloat("indent"),
+                itemSpacing = json.optNullableFloat("itemSpacing"),
+                markerColor = parseColor(json.optNullableString("markerColor")),
+                markerScale = json.optNullableFloat("markerScale")
+            )
+        }
+    }
+}
+
+data class EditorHorizontalRuleTheme(
+    val color: Int? = null,
+    val thickness: Float? = null,
+    val verticalMargin: Float? = null
+) {
+    companion object {
+        fun fromJson(json: JSONObject?): EditorHorizontalRuleTheme? {
+            json ?: return null
+            return EditorHorizontalRuleTheme(
+                color = parseColor(json.optNullableString("color")),
+                thickness = json.optNullableFloat("thickness"),
+                verticalMargin = json.optNullableFloat("verticalMargin")
+            )
+        }
+    }
+}
+
+data class EditorMentionTheme(
+    val textColor: Int? = null,
+    val backgroundColor: Int? = null,
+    val borderColor: Int? = null,
+    val borderWidth: Float? = null,
+    val borderRadius: Float? = null,
+    val fontWeight: String? = null,
+    val popoverBackgroundColor: Int? = null,
+    val popoverBorderColor: Int? = null,
+    val popoverBorderWidth: Float? = null,
+    val popoverBorderRadius: Float? = null,
+    val popoverShadowColor: Int? = null,
+    val optionTextColor: Int? = null,
+    val optionSecondaryTextColor: Int? = null,
+    val optionHighlightedBackgroundColor: Int? = null,
+    val optionHighlightedTextColor: Int? = null
+) {
+    companion object {
+        fun fromJson(json: JSONObject?): EditorMentionTheme? {
+            json ?: return null
+            return EditorMentionTheme(
+                textColor = parseColor(json.optNullableString("textColor")),
+                backgroundColor = parseColor(json.optNullableString("backgroundColor")),
+                borderColor = parseColor(json.optNullableString("borderColor")),
+                borderWidth = json.optNullableFloat("borderWidth"),
+                borderRadius = json.optNullableFloat("borderRadius"),
+                fontWeight = json.optNullableString("fontWeight"),
+                popoverBackgroundColor = parseColor(json.optNullableString("popoverBackgroundColor")),
+                popoverBorderColor = parseColor(json.optNullableString("popoverBorderColor")),
+                popoverBorderWidth = json.optNullableFloat("popoverBorderWidth"),
+                popoverBorderRadius = json.optNullableFloat("popoverBorderRadius"),
+                popoverShadowColor = parseColor(json.optNullableString("popoverShadowColor")),
+                optionTextColor = parseColor(json.optNullableString("optionTextColor")),
+                optionSecondaryTextColor = parseColor(json.optNullableString("optionSecondaryTextColor")),
+                optionHighlightedBackgroundColor = parseColor(json.optNullableString("optionHighlightedBackgroundColor")),
+                optionHighlightedTextColor = parseColor(json.optNullableString("optionHighlightedTextColor"))
+            )
+        }
+    }
+}
+
+data class EditorToolbarTheme(
+    val backgroundColor: Int? = null,
+    val borderColor: Int? = null,
+    val borderWidth: Float? = null,
+    val borderRadius: Float? = null,
+    val keyboardOffset: Float? = null,
+    val horizontalInset: Float? = null,
+    val separatorColor: Int? = null,
+    val buttonColor: Int? = null,
+    val buttonActiveColor: Int? = null,
+    val buttonDisabledColor: Int? = null,
+    val buttonActiveBackgroundColor: Int? = null,
+    val buttonBorderRadius: Float? = null
+) {
+    companion object {
+        fun fromJson(json: JSONObject?): EditorToolbarTheme? {
+            json ?: return null
+            return EditorToolbarTheme(
+                backgroundColor = parseColor(json.optNullableString("backgroundColor")),
+                borderColor = parseColor(json.optNullableString("borderColor")),
+                borderWidth = json.optNullableFloat("borderWidth"),
+                borderRadius = json.optNullableFloat("borderRadius"),
+                keyboardOffset = json.optNullableFloat("keyboardOffset"),
+                horizontalInset = json.optNullableFloat("horizontalInset"),
+                separatorColor = parseColor(json.optNullableString("separatorColor")),
+                buttonColor = parseColor(json.optNullableString("buttonColor")),
+                buttonActiveColor = parseColor(json.optNullableString("buttonActiveColor")),
+                buttonDisabledColor = parseColor(json.optNullableString("buttonDisabledColor")),
+                buttonActiveBackgroundColor = parseColor(json.optNullableString("buttonActiveBackgroundColor")),
+                buttonBorderRadius = json.optNullableFloat("buttonBorderRadius")
+            )
+        }
+    }
+}
+
+data class EditorContentInsets(
+    val top: Float? = null,
+    val right: Float? = null,
+    val bottom: Float? = null,
+    val left: Float? = null
+) {
+    companion object {
+        fun fromJson(json: JSONObject?): EditorContentInsets? {
+            json ?: return null
+            return EditorContentInsets(
+                top = json.optNullableFloat("top"),
+                right = json.optNullableFloat("right"),
+                bottom = json.optNullableFloat("bottom"),
+                left = json.optNullableFloat("left")
+            )
+        }
+    }
+}
+
+data class EditorTheme(
+    val text: EditorTextStyle? = null,
+    val paragraph: EditorTextStyle? = null,
+    val headings: Map<String, EditorTextStyle> = emptyMap(),
+    val list: EditorListTheme? = null,
+    val horizontalRule: EditorHorizontalRuleTheme? = null,
+    val mentions: EditorMentionTheme? = null,
+    val toolbar: EditorToolbarTheme? = null,
+    val backgroundColor: Int? = null,
+    val borderRadius: Float? = null,
+    val contentInsets: EditorContentInsets? = null
+) {
+    companion object {
+        fun fromJson(json: String?): EditorTheme? {
+            if (json.isNullOrBlank()) return null
+            val root = try {
+                JSONObject(json)
+            } catch (_: Exception) {
+                return null
+            }
+
+            val headings = mutableMapOf<String, EditorTextStyle>()
+            for (level in listOf("h1", "h2", "h3", "h4", "h5", "h6")) {
+                val style = EditorTextStyle.fromJson(root.optJSONObject("headings")?.optJSONObject(level))
+                if (style != null) {
+                    headings[level] = style
+                }
+            }
+
+            return EditorTheme(
+                text = EditorTextStyle.fromJson(root.optJSONObject("text")),
+                paragraph = EditorTextStyle.fromJson(root.optJSONObject("paragraph")),
+                headings = headings,
+                list = EditorListTheme.fromJson(root.optJSONObject("list")),
+                horizontalRule = EditorHorizontalRuleTheme.fromJson(root.optJSONObject("horizontalRule")),
+                mentions = EditorMentionTheme.fromJson(root.optJSONObject("mentions")),
+                toolbar = EditorToolbarTheme.fromJson(root.optJSONObject("toolbar")),
+                backgroundColor = parseColor(root.optNullableString("backgroundColor")),
+                borderRadius = root.optNullableFloat("borderRadius"),
+                contentInsets = EditorContentInsets.fromJson(root.optJSONObject("contentInsets"))
+            )
+        }
+    }
+
+    fun effectiveTextStyle(nodeType: String): EditorTextStyle {
+        var style = text ?: EditorTextStyle()
+        if (nodeType == "paragraph") {
+            style = style.mergedWith(paragraph)
+            if (paragraph?.lineHeight == null) {
+                style = style.copy(lineHeight = null)
+            }
+        }
+        style = style.mergedWith(headings[nodeType])
+        return style
+    }
+}
+
+private fun parseColor(raw: String?): Int? {
+    val value = raw?.trim()?.lowercase() ?: return null
+    if (value.isEmpty()) return null
+
+    parseCssHexColor(value)?.let { return it }
+
+    try {
+        return Color.parseColor(value)
+    } catch (_: IllegalArgumentException) {
+        // Fall through to rgb()/rgba() parsing.
+    }
+
+    return when {
+        value.startsWith("rgb(") && value.endsWith(")") -> {
+            val parts = value.removePrefix("rgb(").removeSuffix(")")
+                .split(',')
+                .map { it.trim() }
+            if (parts.size != 3) return null
+            val red = parts[0].toDoubleOrNull() ?: return null
+            val green = parts[1].toDoubleOrNull() ?: return null
+            val blue = parts[2].toDoubleOrNull() ?: return null
+            Color.argb(255, red.toInt(), green.toInt(), blue.toInt())
+        }
+        value.startsWith("rgba(") && value.endsWith(")") -> {
+            val parts = value.removePrefix("rgba(").removeSuffix(")")
+                .split(',')
+                .map { it.trim() }
+            if (parts.size != 4) return null
+            val red = parts[0].toDoubleOrNull() ?: return null
+            val green = parts[1].toDoubleOrNull() ?: return null
+            val blue = parts[2].toDoubleOrNull() ?: return null
+            val alpha = parts[3].toDoubleOrNull() ?: return null
+            Color.argb((alpha * 255f).toInt(), red.toInt(), green.toInt(), blue.toInt())
+        }
+        else -> null
+    }
+}
+
+private fun parseCssHexColor(value: String): Int? {
+    if (!value.startsWith("#")) return null
+    val hex = value.removePrefix("#")
+
+    return when (hex.length) {
+        3 -> {
+            val red = "${hex[0]}${hex[0]}".toIntOrNull(16) ?: return null
+            val green = "${hex[1]}${hex[1]}".toIntOrNull(16) ?: return null
+            val blue = "${hex[2]}${hex[2]}".toIntOrNull(16) ?: return null
+            Color.argb(255, red, green, blue)
+        }
+        4 -> {
+            val red = "${hex[0]}${hex[0]}".toIntOrNull(16) ?: return null
+            val green = "${hex[1]}${hex[1]}".toIntOrNull(16) ?: return null
+            val blue = "${hex[2]}${hex[2]}".toIntOrNull(16) ?: return null
+            val alpha = "${hex[3]}${hex[3]}".toIntOrNull(16) ?: return null
+            Color.argb(alpha, red, green, blue)
+        }
+        6 -> {
+            val red = hex.substring(0, 2).toIntOrNull(16) ?: return null
+            val green = hex.substring(2, 4).toIntOrNull(16) ?: return null
+            val blue = hex.substring(4, 6).toIntOrNull(16) ?: return null
+            Color.argb(255, red, green, blue)
+        }
+        8 -> {
+            val red = hex.substring(0, 2).toIntOrNull(16) ?: return null
+            val green = hex.substring(2, 4).toIntOrNull(16) ?: return null
+            val blue = hex.substring(4, 6).toIntOrNull(16) ?: return null
+            val alpha = hex.substring(6, 8).toIntOrNull(16) ?: return null
+            Color.argb(alpha, red, green, blue)
+        }
+        else -> null
+    }
+}
+
+private fun JSONObject.optNullableString(key: String): String? {
+    if (!has(key) || isNull(key)) return null
+    return optString(key).takeUnless { it == "null" }
+}
+
+private fun JSONObject.optNullableFloat(key: String): Float? {
+    if (!has(key) || isNull(key)) return null
+    return optDouble(key).takeIf { !it.isNaN() }?.toFloat()
+}