craft-native 0.0.128 → 0.0.133

package/dist/android/templates/MainActivityNative.kt.template

@@ -48,6 +48,7 @@ import android.widget.Switch
 import android.widget.TextView
 import androidx.appcompat.app.AppCompatActivity
 import androidx.appcompat.app.AppCompatDelegate
+import androidx.swiperefreshlayout.widget.SwipeRefreshLayout
 import androidx.core.content.ContextCompat
 import androidx.core.view.AccessibilityDelegateCompat
 import androidx.core.view.WindowInsetsCompat
@@ -72,13 +73,31 @@ import kotlin.math.roundToInt
 
 private const val CRAFT_NATIVE_CAPABILITY_TIMEOUT_MS = 30_000L
 
+private data class CraftNativeLength(
+    val points: Int? = null,
+    val fraction: Double? = null,
+) {
+    fun resolve(base: Int?): Int? = points ?: fraction?.let { value -> base?.let { max(0, (it * value).roundToInt()) } }
+
+    companion object {
+        fun from(value: Any?, density: Float): CraftNativeLength? {
+            if (value == null || value == JSONObject.NULL) return null
+            if (value is Number) return CraftNativeLength(points = (value.toDouble() * density).roundToInt())
+            val text = value.toString().trim()
+            if (text.endsWith('%')) return text.dropLast(1).toDoubleOrNull()?.let { CraftNativeLength(fraction = it / 100) }
+            if (text.endsWith("px")) return text.dropLast(2).toDoubleOrNull()?.let { CraftNativeLength(points = (it * density).roundToInt()) }
+            return text.toDoubleOrNull()?.let { CraftNativeLength(points = (it * density).roundToInt()) }
+        }
+    }
+}
+
 private data class CraftNativeLayoutStyle(
-    val width: Int? = null,
-    val height: Int? = null,
-    val minWidth: Int? = null,
-    val maxWidth: Int? = null,
-    val minHeight: Int? = null,
-    val maxHeight: Int? = null,
+    val width: CraftNativeLength? = null,
+    val height: CraftNativeLength? = null,
+    val minWidth: CraftNativeLength? = null,
+    val maxWidth: CraftNativeLength? = null,
+    val minHeight: CraftNativeLength? = null,
+    val maxHeight: CraftNativeLength? = null,
     val position: String = "relative",
     val top: Int? = null,
     val right: Int? = null,
@@ -86,19 +105,25 @@ private data class CraftNativeLayoutStyle(
     val left: Int? = null,
     val alignSelf: String? = null,
     val flexGrow: Double = 0.0,
-    val flexShrink: Double = 0.0,
-    val flexBasis: Int? = null,
+    val flexShrink: Double? = null,
+    val flexBasis: CraftNativeLength? = null,
 ) {
     companion object {
         fun from(raw: JSONObject, density: Float): CraftNativeLayoutStyle {
+            fun length(name: String): CraftNativeLength? = CraftNativeLength.from(raw.opt(name), density)
             fun number(name: String): Int? {
                 if (!raw.has(name) || raw.isNull(name)) return null
-                return raw.optDouble(name, Double.NaN).takeUnless { it.isNaN() }?.let { (it * density).toInt() }
+                return raw.optDouble(name, Double.NaN).takeUnless { it.isNaN() }?.let { (it * density).roundToInt() }
             }
+            fun decimal(name: String): Double? {
+                if (!raw.has(name) || raw.isNull(name)) return null
+                return raw.optDouble(name, Double.NaN).takeUnless { it.isNaN() }
+            }
+            val flex = decimal("flex")
             return CraftNativeLayoutStyle(
-                width = number("width"), height = number("height"),
-                minWidth = number("minWidth"), maxWidth = number("maxWidth"),
-                minHeight = number("minHeight"), maxHeight = number("maxHeight"),
+                width = length("width"), height = length("height"),
+                minWidth = length("minWidth"), maxWidth = length("maxWidth"),
+                minHeight = length("minHeight"), maxHeight = length("maxHeight"),
                 position = raw.opt("position")
                     ?.takeUnless { it == JSONObject.NULL }
                     ?.toString()
@@ -108,10 +133,11 @@ private data class CraftNativeLayoutStyle(
                 alignSelf = raw.opt("alignSelf")
                     ?.takeUnless { it == JSONObject.NULL }
                     ?.toString()
-                    ?.takeIf { it.isNotBlank() },
-                flexGrow = raw.optDouble("flexGrow", raw.optDouble("flex", 0.0)),
-                flexShrink = raw.optDouble("flexShrink", 0.0),
-                flexBasis = number("flexBasis"),
+                    ?.takeIf { it.isNotBlank() && it != "auto" },
+                flexGrow = decimal("flexGrow") ?: flex?.coerceAtLeast(0.0) ?: 0.0,
+                flexShrink = decimal("flexShrink") ?: flex?.let { if (it != 0.0) 1.0 else 0.0 },
+                flexBasis = length("flexBasis")
+                    ?: flex?.takeIf { it > 0.0 }?.let { CraftNativeLength(points = 0) },
             )
         }
     }
@@ -134,6 +160,7 @@ private class CraftNativeFlexLayout(context: Context) : LinearLayout(context) {
     private val styles = mutableMapOf<View, CraftNativeLayoutStyle>()
     private var wrap = false
     private var alignItems = "stretch"
+    private var alignContent = "flex-start"
     private var justifyContent = "flex-start"
     private var rowGap = 0
     private var columnGap = 0
@@ -145,6 +172,7 @@ private class CraftNativeFlexLayout(context: Context) : LinearLayout(context) {
         orientation = if (style.optString("flexDirection") in setOf("row", "row-reverse")) HORIZONTAL else VERTICAL
         wrap = style.optString("flexWrap") == "wrap" || style.optBoolean("flexWrap", false)
         alignItems = style.optString("alignItems", "stretch")
+        alignContent = style.optString("alignContent", "flex-start")
         justifyContent = style.optString("justifyContent", "flex-start")
         val gap = (style.optDouble("gap", 0.0) * density).toInt()
         rowGap = (style.optDouble("rowGap", gap.toDouble() / density.toDouble()) * density).toInt()
@@ -294,25 +322,30 @@ private class CraftNativeFlexLayout(context: Context) : LinearLayout(context) {
     }
 
     private fun measureChildWidth(child: View, style: CraftNativeLayoutStyle, available: Int, margins: Int): Int {
-        val flexBasis = if (orientation == HORIZONTAL) style.flexBasis else null
-        val explicit = style.width ?: flexBasis
-            ?: (child.layoutParams?.width ?: ViewGroup.LayoutParams.WRAP_CONTENT).takeIf { it >= 0 }
-        val target = explicit ?: max(0, available - margins)
+        val base = max(0, available - margins)
+        val flexBasis = if (orientation == HORIZONTAL) style.flexBasis?.resolve(base) else null
+        // The STX style is authoritative. A reused View may still carry a
+        // previous fixed LayoutParams width after a reactive width is removed;
+        // using that value here prevents intrinsic sizing from being restored.
+        val explicit = style.width?.resolve(base) ?: flexBasis
+        val target = explicit ?: base
         val spec = if (explicit != null) View.MeasureSpec.makeMeasureSpec(target, View.MeasureSpec.EXACTLY)
-        else View.MeasureSpec.makeMeasureSpec(max(0, available - margins), View.MeasureSpec.AT_MOST)
+        else View.MeasureSpec.makeMeasureSpec(base, View.MeasureSpec.AT_MOST)
         child.measure(spec, View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED))
-        return clamp(if (explicit != null) target else child.measuredWidth, style.minWidth, style.maxWidth)
+        return clamp(if (explicit != null) target else child.measuredWidth, style.minWidth?.resolve(base), style.maxWidth?.resolve(base))
     }
 
     private fun measureChildHeight(child: View, style: CraftNativeLayoutStyle, available: Int, margins: Int): Int {
-        val flexBasis = if (orientation == VERTICAL) style.flexBasis else null
-        val explicit = style.height ?: flexBasis
-            ?: (child.layoutParams?.height ?: ViewGroup.LayoutParams.WRAP_CONTENT).takeIf { it >= 0 }
-        val target = explicit ?: max(0, available - margins)
+        val base = max(0, available - margins)
+        val flexBasis = if (orientation == VERTICAL) style.flexBasis?.resolve(base) else null
+        // Match width measurement: do not let stale native LayoutParams keep
+        // a removed reactive height fixed.
+        val explicit = style.height?.resolve(base) ?: flexBasis
+        val target = explicit ?: base
         val spec = if (explicit != null) View.MeasureSpec.makeMeasureSpec(target, View.MeasureSpec.EXACTLY)
-        else View.MeasureSpec.makeMeasureSpec(max(0, available - margins), View.MeasureSpec.AT_MOST)
+        else View.MeasureSpec.makeMeasureSpec(base, View.MeasureSpec.AT_MOST)
         child.measure(child.measuredWidth.let { View.MeasureSpec.makeMeasureSpec(max(0, it), View.MeasureSpec.EXACTLY) }, spec)
-        return clamp(if (explicit != null) target else child.measuredHeight, style.minHeight, style.maxHeight)
+        return clamp(if (explicit != null) target else child.measuredHeight, style.minHeight?.resolve(base), style.maxHeight?.resolve(base))
     }
 
     private fun clamp(value: Int, lower: Int?, upper: Int?): Int {
@@ -322,6 +355,12 @@ private class CraftNativeFlexLayout(context: Context) : LinearLayout(context) {
         return result
     }
 
+    private fun defaultFlexShrink(view: View): Double = when {
+        view is ScrollView || view is HorizontalScrollView -> 1.0
+        view is TextView && view !is Button && view !is EditText && orientation == HORIZONTAL -> 1.0
+        else -> 0.0
+    }
+
     override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
         val widthMode = View.MeasureSpec.getMode(widthMeasureSpec)
         val width = View.MeasureSpec.getSize(widthMeasureSpec).takeUnless { widthMode == View.MeasureSpec.UNSPECIFIED } ?: 1_000_000
@@ -404,18 +443,38 @@ private class CraftNativeFlexLayout(context: Context) : LinearLayout(context) {
         val gap = if (orientation == HORIZONTAL) columnGap else rowGap
         val crossGap = if (orientation == HORIZONTAL) rowGap else columnGap
         val availableMain = if (orientation == HORIZONTAL) contentWidth else contentHeight
-        var crossOffset = if (orientation == HORIZONTAL) paddingTop else paddingLeft
+        val availableCross = if (orientation == HORIZONTAL) contentHeight else contentWidth
+        val totalCross = lines.sumOf { it.cross } + max(0, lines.size - 1) * crossGap
+        val crossFree = max(0, availableCross - totalCross)
+        var crossLeading = 0
+        var crossBetween = crossGap
+        if (wrap && lines.size > 1) {
+            when (alignContent) {
+                "center" -> crossLeading = crossFree / 2
+                "flex-end" -> crossLeading = crossFree
+                "space-between" -> crossBetween = crossFree / (lines.size - 1) + crossGap
+                "space-around" -> {
+                    crossBetween = crossFree / lines.size + crossGap
+                    crossLeading = crossFree / (lines.size * 2)
+                }
+                "stretch" -> {
+                    val extra = crossFree / lines.size
+                    lines.forEach { it.cross += extra }
+                }
+            }
+        }
+        var crossOffset = (if (orientation == HORIZONTAL) paddingTop else paddingLeft) + crossLeading
         for (line in lines) {
             val rawFree = availableMain - line.main
-            val factors = line.entries.map { if (rawFree >= 0) it.style.flexGrow else it.style.flexShrink }
+            val factors = line.entries.map { if (rawFree >= 0) it.style.flexGrow else it.style.flexShrink ?: defaultFlexShrink(it.view) }
             val totalFactor = factors.sum()
             val distributedMain = line.entries.indices.sumOf { index ->
                 val base = if (orientation == HORIZONTAL) line.entries[index].width else line.entries[index].height
                 val primary = if (totalFactor > 0) max(0, (base + rawFree * factors[index] / totalFactor).toInt()) else base
                 val constrained = if (orientation == HORIZONTAL) {
-                    clamp(primary, line.entries[index].style.minWidth, line.entries[index].style.maxWidth)
+                    clamp(primary, line.entries[index].style.minWidth?.resolve(contentWidth), line.entries[index].style.maxWidth?.resolve(contentWidth))
                 } else {
-                    clamp(primary, line.entries[index].style.minHeight, line.entries[index].style.maxHeight)
+                    clamp(primary, line.entries[index].style.minHeight?.resolve(contentHeight), line.entries[index].style.maxHeight?.resolve(contentHeight))
                 }
                 val lp = line.entries[index].view.layoutParams as? MarginLayoutParams
                 val margins = if (orientation == HORIZONTAL) (lp?.leftMargin ?: 0) + (lp?.rightMargin ?: 0)
@@ -447,16 +506,16 @@ private class CraftNativeFlexLayout(context: Context) : LinearLayout(context) {
                 val primary = if (orientation == HORIZONTAL) entry.width else entry.height
                 val distributed = if (totalFactor > 0) max(0, (primary + rawFree * factors[index] / totalFactor).toInt()) else primary
                 val distributedPrimary = if (orientation == HORIZONTAL) {
-                    clamp(distributed, entry.style.minWidth, entry.style.maxWidth)
+                    clamp(distributed, entry.style.minWidth?.resolve(contentWidth), entry.style.maxWidth?.resolve(contentWidth))
                 } else {
-                    clamp(distributed, entry.style.minHeight, entry.style.maxHeight)
+                    clamp(distributed, entry.style.minHeight?.resolve(contentHeight), entry.style.maxHeight?.resolve(contentHeight))
                 }
                 val w = if (orientation == HORIZONTAL) distributedPrimary else crossSize
                 val h = if (orientation == HORIZONTAL) crossSize else distributedPrimary
                 entry.view.layout(x, y, x + w, y + h)
                 mainOffset += distributedPrimary + marginStart + marginEnd + gap + between
             }
-            crossOffset += line.cross + crossGap
+            crossOffset += line.cross + crossBetween
         }
         for (entry in absolute) {
             if (entry.view is CraftNativeModalView && entry.view.visibility == View.VISIBLE) entry.view.bringToFront()
@@ -479,7 +538,7 @@ private class CraftNativeFlexLayout(context: Context) : LinearLayout(context) {
     }
 }
 
-private class CraftNativeScrollView(context: Context) : FrameLayout(context) {
+private class CraftNativeScrollView(context: Context) : SwipeRefreshLayout(context) {
     val content = CraftNativeFlexLayout(context)
     private val vertical = ScrollView(context)
     private val horizontal = HorizontalScrollView(context)
@@ -489,15 +548,31 @@ private class CraftNativeScrollView(context: Context) : FrameLayout(context) {
     private var alwaysBounceVertical = true
     private var alwaysBounceHorizontal = true
     private var keyboardShouldPersistTaps = "never"
+    private var refreshHandler: (() -> Unit)? = null
 
     init {
         vertical.isNestedScrollingEnabled = true
         horizontal.isNestedScrollingEnabled = true
         vertical.isFillViewport = true
         horizontal.isFillViewport = true
+        setOnRefreshListener { refreshHandler?.invoke() }
+        isEnabled = false
         setHorizontal(false)
     }
 
+    fun setRefreshHandler(handler: (() -> Unit)?, refreshing: Boolean) {
+        refreshHandler = handler
+        isEnabled = handler != null
+        isRefreshing = handler != null && refreshing
+        if (handler == null) isRefreshing = false
+    }
+
+    override fun onDetachedFromWindow() {
+        refreshHandler = null
+        isRefreshing = false
+        super.onDetachedFromWindow()
+    }
+
     fun setHorizontal(value: Boolean) {
         if (horizontalMode == value) return
         horizontalMode = value
@@ -661,6 +736,7 @@ private class CraftNativeModalView(context: Context) : FrameLayout(context) {
     val content = CraftNativeFlexLayout(context)
     private val blocker = View(context)
     private var renderedVisible = false
+    private var animationGeneration = 0
     var onRequestClose: (() -> Unit)? = null
 
     var transparent: Boolean = false
@@ -679,22 +755,59 @@ private class CraftNativeModalView(context: Context) : FrameLayout(context) {
     }
 
     fun setVisible(visible: Boolean, opacity: Float, animationType: String?) {
-        if (renderedVisible == visible && visibility == if (visible) View.VISIBLE else View.GONE) return
+        if (renderedVisible == visible && visibility == if (visible) View.VISIBLE else View.GONE) {
+            if (visible && alpha != opacity) alpha = opacity
+            return
+        }
+        val wasVisible = renderedVisible && visibility == View.VISIBLE
         renderedVisible = visible
+        animationGeneration += 1
+        val generation = animationGeneration
+        animate().cancel()
         if (!visible) {
-            animate().cancel()
-            alpha = 0f
-            visibility = View.GONE
+            if (animationType == "slide" && wasVisible) {
+                val distance = max(height, (parent as? View)?.height ?: resources.displayMetrics.heightPixels).toFloat()
+                animate().translationY(distance).alpha(0f).setDuration(240L).withEndAction {
+                    if (animationGeneration != generation) return@withEndAction
+                    visibility = View.GONE
+                    translationY = 0f
+                    alpha = 0f
+                }.start()
+            } else {
+                alpha = 0f
+                translationY = 0f
+                visibility = View.GONE
+            }
             return
         }
         visibility = View.VISIBLE
         if (animationType == "none") {
+            translationY = 0f
+            alpha = opacity
+        } else if (animationType == "slide") {
             alpha = opacity
+            translationY = max(height, (parent as? View)?.height ?: resources.displayMetrics.heightPixels).toFloat()
+            post {
+                if (animationGeneration != generation || visibility != View.VISIBLE) return@post
+                val distance = max(height, (parent as? View)?.height ?: resources.displayMetrics.heightPixels).toFloat()
+                translationY = distance
+                animate().translationY(0f).setDuration(240L).start()
+            }
         } else {
+            translationY = 0f
             alpha = 0f
-            animate().alpha(opacity).setDuration(if (animationType == "slide") 240L else 180L).start()
+            animate().alpha(opacity).setDuration(180L).start()
         }
     }
+
+    fun resetForTeardown() {
+        animationGeneration += 1
+        animate().cancel()
+        visibility = View.GONE
+        translationY = 0f
+        alpha = 0f
+        onRequestClose = null
+    }
 }
 
 private data class LayoutBounds(
@@ -752,9 +865,25 @@ class MainActivity : AppCompatActivity() {
         var active = true
 
         fun close() {
+            if (!active) return
             active = false
-            port?.close()
-            isolate.close()
+            val finish = {
+                port?.close()
+                isolate.close()
+            }
+            val teardown = runCatching {
+                isolate.evaluateJavaScriptAsync(
+                    "globalThis.__stxNativeUnmount && globalThis.__stxNativeUnmount()"
+                )
+            }.getOrNull()
+            if (teardown == null) {
+                finish()
+                return
+            }
+            teardown.addListener({
+                runCatching { teardown.get() }
+                finish()
+            }, java.util.concurrent.Executor { command -> command.run() })
         }
     }
 
@@ -922,6 +1051,7 @@ class MainActivity : AppCompatActivity() {
                 capabilityTimeoutMs: $CRAFT_NATIVE_CAPABILITY_TIMEOUT_MS,
                 capabilities: ${capabilities.names()},
                 initialAppState: ${JSONObject.quote(nativeAppState)},
+                colorScheme: ${JSONObject.quote(colorScheme())},
                 postMessage: function(value) { port.postMessage(value); },
                 onMessage: function(callback) { port.onmessage = function(event) { callback(event.data); }; }
               };
@@ -935,6 +1065,7 @@ class MainActivity : AppCompatActivity() {
               capabilityTimeoutMs: $CRAFT_NATIVE_CAPABILITY_TIMEOUT_MS,
               capabilities: ${capabilities.names()},
               initialAppState: ${JSONObject.quote(nativeAppState)},
+              colorScheme: ${JSONObject.quote(colorScheme())},
               postMessage: function(value) { console.log(${JSONObject.quote(prefix)} + value); },
               onMessage: function(callback) { globalThis.__stxNativeCallback = callback; }
             };
@@ -991,6 +1122,9 @@ class MainActivity : AppCompatActivity() {
         refreshInputDefaultsForTraitChange()
         screens.lastOrNull()?.let { screen ->
             refreshScreenTheme(screen)
+            if (screen.active) {
+                send(screen, "APPEARANCE", JSONObject().put("colorScheme", colorScheme()))
+            }
         }
     }
 
@@ -1011,6 +1145,10 @@ class MainActivity : AppCompatActivity() {
         defaultTextColor = if (Color.luminance(background) < 0.5) Color.WHITE else Color.BLACK
     }
 
+    private fun colorScheme(): String = if (
+        resources.configuration.uiMode and Configuration.UI_MODE_NIGHT_MASK == Configuration.UI_MODE_NIGHT_YES
+    ) "dark" else "light"
+
     private fun refreshInputDefaultsForTraitChange() {
         if (inputHintDefaults.isEmpty() && inputHighlightDefaults.isEmpty()) return
         val probe = EditText(this)
@@ -1102,10 +1240,30 @@ class MainActivity : AppCompatActivity() {
             val document = screen.mutations.node(target) ?: return false
             if (!screen.controls.containsKey("id:$target")) return false
             makeView(screen, document, target, screen.controls)
+            val updated = screen.controls["id:$target"] ?: return false
+            if (!updateParentLayoutStyle(updated, document.optJSONObject("style") ?: JSONObject())) return false
         }
         return true
     }
 
+    /**
+     * Targeted mutations bypass the parent's child reconciliation. Rebind the
+     * updated node's layout style explicitly so removing a width/height (or
+     * changing flex participation) invalidates the native parent's metrics.
+     */
+    private fun updateParentLayoutStyle(view: View, style: JSONObject): Boolean {
+        var parent = view.parent
+        while (parent != null) {
+            if (parent is CraftNativeFlexLayout) {
+                parent.setChildStyle(view, style, resources.displayMetrics.density)
+                parent.requestLayout()
+                return true
+            }
+            parent = parent.parent
+        }
+        return false
+    }
+
     private fun renderCommitted(screen: Screen, document: JSONObject) {
         // Keep live controls (especially the focused EditText) across renders.
         val next = mutableMapOf<String, View>()
@@ -1154,6 +1312,7 @@ class MainActivity : AppCompatActivity() {
         val reusableInput = previous as? EditText
         val control = when (type) {
             "Text" -> ((previous as? TextView)?.takeUnless { it is Button || it is EditText } ?: TextView(this)).apply {
+                includeFontPadding = false
                 maxLines = props.optInt("numberOfLines", 0).takeIf { it > 0 } ?: Int.MAX_VALUE
                 ellipsize = when (props.optString("ellipsizeMode")) {
                     "head" -> TextUtils.TruncateAt.START
@@ -1164,6 +1323,7 @@ class MainActivity : AppCompatActivity() {
                 configureText(this, childText(children), style)
             }
             "Link" -> ((previous as? TextView)?.takeUnless { it is Button } ?: TextView(this)).apply {
+                includeFontPadding = false
                 configureText(this, props.optString("title").ifBlank { childText(children) }, style)
                 val linkColor = props.optString("color").takeIf { it.isNotBlank() } ?: style.optString("color")
                 setTextColor(color(linkColor, Color.rgb(33, 150, 243)))
@@ -1180,6 +1340,7 @@ class MainActivity : AppCompatActivity() {
             }
             "Button" -> (previous as? Button ?: Button(this)).apply {
                 val title = props.optString("title").ifBlank { childText(children) }
+                isAllCaps = false
                 configureText(this, title, style)
                 props.optString("color").takeIf { it.isNotBlank() }?.let { setTextColor(color(it, defaultTextColor)) }
                 isEnabled = !props.optBoolean("disabled", false)
@@ -1287,17 +1448,27 @@ class MainActivity : AppCompatActivity() {
                     val value = optionProps?.optString("value").takeIf { !it.isNullOrBlank() } ?: label
                     value to label
                 }
+                val handler = events.optString("onValueChange").ifBlank { events.optString("onChange") }
+                if (handler.isNotBlank()) screen.handlers[this] = handler else screen.handlers.remove(this)
+                // Detach the old listener before replacing the adapter or selection.
+                // Both operations can synchronously dispatch an Android selection
+                // callback during reconciliation, but neither is user input.
+                onItemSelectedListener = null
                 adapter = ArrayAdapter(this@MainActivity, android.R.layout.simple_spinner_item, options.map { it.second }).also {
                     it.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item)
                 }
                 val requested = props.optString("selectedValue").ifBlank { props.optString("value") }
                 val selected = options.indexOfFirst { it.first == requested }.takeIf { it >= 0 } ?: 0
                 isEnabled = !props.optBoolean("disabled", false)
-                val handler = events.optString("onValueChange").ifBlank { events.optString("onChange") }
-                if (handler.isNotBlank()) screen.handlers[this] = handler else screen.handlers.remove(this)
+                // Mounting a controlled picker must not look like a user
+                // change. Android may dispatch the initial adapter selection
+                // during the first layout pass; iOS only reports a choice
+                // after the picker is interacted with.
+                var suppressInitialSelection = true
                 onItemSelectedListener = object : AdapterView.OnItemSelectedListener {
                     override fun onNothingSelected(parent: AdapterView<*>?) = Unit
                     override fun onItemSelected(parent: AdapterView<*>?, view: View?, position: Int, id: Long) {
+                        if (suppressInitialSelection) return
                         val current = screen.handlers[this@apply] ?: return
                         val option = options.getOrNull(position) ?: return
                         send(screen, "EVENT", JSONObject().put("handlerName", current).put("nativeEvent", JSONObject()
@@ -1305,12 +1476,13 @@ class MainActivity : AppCompatActivity() {
                     }
                 }
                 setSelection(selected, false)
+                post { suppressInitialSelection = false }
             }
             "Modal" -> (previous as? CraftNativeModalView ?: CraftNativeModalView(this)).apply {
                 transparent = props.optBoolean("transparent", false)
                 content.configure(style, resources.displayMetrics.density)
                 reconcileChildren(screen, content, children, path, next, style, previousControls)
-                val visible = props.optBoolean("visible", false)
+                val visible = props.optBoolean("visible", false) && style.optString("display") != "none"
                 val wasVisible = screen.modalVisibility[this]
                 screen.modalVisibility[this] = visible
                 val requestClose = events.optString("onRequestClose")
@@ -1332,10 +1504,14 @@ class MainActivity : AppCompatActivity() {
             "Switch" -> (previous as? Switch ?: Switch(this)).apply {
                 setOnCheckedChangeListener(null)
                 val requestedValue = props.opt("value")
-                isChecked = if (requestedValue != null && requestedValue != JSONObject.NULL) {
-                    props.optBoolean("value")
-                } else {
-                    props.optBoolean("checked", false)
+                val requestedChecked = props.opt("checked")
+                isChecked = when {
+                    requestedValue != null && requestedValue != JSONObject.NULL -> props.optBoolean("value")
+                    requestedChecked == null || requestedChecked == JSONObject.NULL -> false
+                    requestedChecked is Boolean -> requestedChecked
+                    requestedChecked is Number -> requestedChecked.toDouble() != 0.0
+                    requestedChecked is String -> requestedChecked.isBlank() || requestedChecked.equals("true", ignoreCase = true)
+                    else -> props.optBoolean("checked", false)
                 }
                 isEnabled = !props.optBoolean("disabled", false)
                 props.optJSONObject("trackColor")?.let { track ->
@@ -1453,6 +1629,10 @@ class MainActivity : AppCompatActivity() {
                     props.optBoolean("alwaysBounceHorizontal", horizontal),
                 )
                 setPagingEnabled(props.optBoolean("pagingEnabled", false))
+                val refreshHandler = events.optString("onRefresh").takeIf { it.isNotBlank() }?.let { handler ->
+                    { send(screen, "EVENT", JSONObject().put("handlerName", handler).put("nativeEvent", JSONObject())) }
+                }
+                setRefreshHandler(refreshHandler, props.optBoolean("refreshing", false))
                 val onScroll = events.optString("onScroll")
                 if (onScroll.isNotBlank()) screen.scrollHandlers[this] = onScroll else screen.scrollHandlers.remove(this)
                 val onBegin = events.optString("onScrollBeginDrag")
@@ -1543,7 +1723,10 @@ class MainActivity : AppCompatActivity() {
                 if (handler.isNotBlank()) screen.handlers[control] = handler else screen.handlers.remove(control)
                 control.isClickable = true
                 if (type in setOf("TouchableOpacity", "TouchableHighlight", "Pressable")) {
-                    control.setOnClickListener(null)
+                    control.setOnClickListener {
+                        val current = screen.handlers[it] ?: return@setOnClickListener
+                        send(screen, "EVENT", JSONObject().put("handlerName", current).put("nativeEvent", JSONObject()))
+                    }
                     control.setOnTouchListener { view, event ->
                         when (event.actionMasked) {
                             android.view.MotionEvent.ACTION_DOWN -> {
@@ -1584,7 +1767,9 @@ class MainActivity : AppCompatActivity() {
             }
             control.isEnabled = !disabled
         }
-        val longPressHandler = events.optString("onLongPress").takeUnless { props.optBoolean("disabled", false) } ?: ""
+        val longPressDisabled = props.optBoolean("disabled", false) ||
+            props.optJSONObject("accessibilityState")?.optBoolean("disabled", false) == true
+        val longPressHandler = events.optString("onLongPress").takeUnless { longPressDisabled } ?: ""
         if (longPressHandler.isNotBlank()) {
             screen.longPressHandlers[control] = longPressHandler
             control.setOnLongClickListener {
@@ -1613,6 +1798,15 @@ class MainActivity : AppCompatActivity() {
         }
         next[identity] = control
         applyViewStyle(control, style)
+        if (type == "ActivityIndicator") {
+            val animating = props.optBoolean("animating", true)
+            val hidesWhenStopped = props.optBoolean("hidesWhenStopped", true)
+            control.visibility = if (style.optString("display") == "none" || (!animating && hidesWhenStopped)) {
+                View.GONE
+            } else {
+                View.VISIBLE
+            }
+        }
         if (type == "Modal" && !props.optBoolean("visible", false)) control.visibility = View.GONE
         val width = style.optDouble("width", Double.NaN).takeUnless { it.isNaN() }?.let(::dp)
         val height = style.optDouble("height", Double.NaN).takeUnless { it.isNaN() }?.let(::dp)
@@ -1672,7 +1866,11 @@ class MainActivity : AppCompatActivity() {
             val child = children.opt(index)
             val childView = when (child) {
                 is JSONObject -> makeView(screen, child, "$path.$index", next, previousControls)
-                is String -> TextView(this).apply { text = child; setTextColor(defaultTextColor) }
+                is String -> TextView(this).apply {
+                    includeFontPadding = false
+                    text = child
+                    setTextColor(defaultTextColor)
+                }
                 else -> null
             }
             if (childView != null) desired.add(childView)
@@ -1790,8 +1988,12 @@ class MainActivity : AppCompatActivity() {
         view.clipToOutline = style.optString("overflow") == "hidden"
         if (view is ViewGroup) view.clipChildren = style.optString("overflow") == "hidden"
         if (view is ImageView) {
-            style.optString("tintColor").takeIf { it.isNotBlank() }?.let { view.setColorFilter(color(it, Color.TRANSPARENT)) }
-                ?: view.clearColorFilter()
+            val tint = style.opt("tintColor") as? String
+            if (tint.isNullOrBlank() || tint == "null" || tint == "undefined") {
+                view.clearColorFilter()
+            } else {
+                view.setColorFilter(color(tint, Color.TRANSPARENT))
+            }
         }
     }
 
@@ -1857,8 +2059,9 @@ class MainActivity : AppCompatActivity() {
             else -> ""
         }
         if (uri.isBlank()) {
+            if (imageSources[view] == "") return
             imageJobs.remove(view)?.cancel(true)
-            imageSources.remove(view)
+            imageSources[view] = ""
             imageErrors[view] = "Image source is missing"
             view.setImageDrawable(null)
             imageFailure(screen, view, uri, "Image source is missing")
@@ -1961,7 +2164,7 @@ class MainActivity : AppCompatActivity() {
         view.tooltipText = props.optString("accessibilityHint").takeIf { it.isNotBlank() }
         val role = props.optString("accessibilityRole").ifBlank { type.lowercase() }
         val state = props.optJSONObject("accessibilityState")
-        val disabled = state?.optBoolean("disabled", false) == true
+        val disabled = props.optBoolean("disabled", false) || state?.optBoolean("disabled", false) == true
         if (type !in setOf("Button", "Link", "TextInput", "Picker", "Modal", "Switch", "Slider", "ActivityIndicator")) {
             view.isEnabled = !disabled
         } else if (disabled) {
@@ -2236,6 +2439,8 @@ class MainActivity : AppCompatActivity() {
         released.filterIsInstance<CraftNativeFlatList>().filterNot { nestedLists.contains(it) }.forEach {
             releaseFlatList(screen, it, preservingInputDrafts)
         }
+        released.filterIsInstance<CraftNativeModalView>().forEach { it.resetForTeardown() }
+        released.filterIsInstance<CraftNativeScrollView>().forEach { it.setRefreshHandler(null, false) }
         releaseImages(released)
         released.filterIsInstance<EditText>().forEach {
             inputHintDefaults.remove(it)

package/dist/cli.js

@@ -3303,7 +3303,7 @@ function pinCraftNativeDependency(packagePath, craftVersion) {
 `);
 }
 // package.json
-var version = "0.0.128";
+var version = "0.0.133";
 
 // bin/cli.ts
 var spawnedFrom = process6.env[CRAFT_CLI_SPAWN_MARKER];

package/dist/index.cjs

@@ -310,7 +310,7 @@ function craftBinaryNotFoundMessage(triedPath) {
 `);
 }
 // package.json
-var version = "0.0.128";
+var version = "0.0.133";
 
 // src/sdk-version.ts
 var SDK_VERSION = version;

package/dist/index.js

@@ -58,7 +58,7 @@ function craftBinaryNotFoundMessage(triedPath) {
 `);
 }
 // package.json
-var version = "0.0.128";
+var version = "0.0.133";
 
 // src/sdk-version.ts
 var SDK_VERSION = version;