craft-native 0.0.124 → 0.0.126

package/dist/android/src/index.js

@@ -425,10 +425,12 @@ async function init(options) {
   if (config.renderer === "native") {
     const mutationTemplate = readFileSync(join(TEMPLATES_DIR, "CraftNativeMutation.kt.template"), "utf-8");
     const flatListTemplate = readFileSync(join(TEMPLATES_DIR, "CraftNativeFlatList.kt.template"), "utf-8");
+    const refreshableFlatListTemplate = readFileSync(join(TEMPLATES_DIR, "CraftNativeRefreshableFlatList.kt.template"), "utf-8");
     const capabilityTemplate = readFileSync(join(TEMPLATES_DIR, "CraftNativeCapabilities.kt.template"), "utf-8");
     const notificationTemplate = readFileSync(join(TEMPLATES_DIR, "CraftNativeNotificationReceiver.kt.template"), "utf-8");
     writeFileSync(join(output, "app/src/main/java", packagePath, "CraftNativeMutation.kt"), mutationTemplate.replace(/\{\{PACKAGE_NAME\}\}/g, finalPackageName));
     writeFileSync(join(output, "app/src/main/java", packagePath, "CraftNativeFlatList.kt"), flatListTemplate.replace(/\{\{PACKAGE_NAME\}\}/g, finalPackageName));
+    writeFileSync(join(output, "app/src/main/java", packagePath, "CraftNativeRefreshableFlatList.kt"), refreshableFlatListTemplate.replace(/\{\{PACKAGE_NAME\}\}/g, finalPackageName));
     writeFileSync(join(output, "app/src/main/java", packagePath, "CraftNativeCapabilities.kt"), capabilityTemplate.replace(/\{\{PACKAGE_NAME\}\}/g, finalPackageName));
     writeFileSync(join(output, "app/src/main/java", packagePath, "CraftNativeNotificationReceiver.kt"), notificationTemplate.replace(/\{\{PACKAGE_NAME\}\}/g, finalPackageName));
   }
@@ -475,7 +477,7 @@ async function init(options) {
   const projectGradleTemplate = readFileSync(join(TEMPLATES_DIR, "build.gradle.kts.project.template"), "utf-8");
   writeFileSync(join(output, "build.gradle.kts"), projectGradleTemplate.replace(/\{\{GOOGLE_SERVICES_PLUGIN\}\}/g, hasGoogleServices ? '    id("com.google.gms.google-services") version "4.4.2" apply false' : ""));
   const appGradleTemplate = readFileSync(join(TEMPLATES_DIR, "build.gradle.kts.app.template"), "utf-8");
-  const appGradle = appGradleTemplate.replace(/\{\{PACKAGE_NAME\}\}/g, finalPackageName).replace(/\{\{VERSION_NAME\}\}/g, escapeKotlinString(config.version || "1.0.0")).replace(/\{\{VERSION_CODE\}\}/g, String(config.versionCode || 1)).replace(/\{\{MIN_SDK\}\}/g, String(config.minSdk ?? ANDROID_MIN_SDK)).replace(/\{\{COMPILE_SDK\}\}/g, String(config.compileSdk || 36)).replace(/\{\{TARGET_SDK\}\}/g, String(config.targetSdk || 35)).replace(/\{\{GOOGLE_SERVICES_PLUGIN\}\}/g, hasGoogleServices ? '    id("com.google.gms.google-services")' : "").replace(/\{\{FIREBASE_MESSAGING_DEPENDENCY\}\}/g, config.enablePushNotifications ? '    implementation("com.google.firebase:firebase-messaging:24.1.0")' : "").replace(/\{\{HEALTH_CONNECT_DEPENDENCIES\}\}/g, config.enableHealthConnect ? `    implementation("androidx.health.connect:connect-client:1.1.0")
+  const appGradle = appGradleTemplate.replace(/\{\{PACKAGE_NAME\}\}/g, finalPackageName).replace(/\{\{VERSION_NAME\}\}/g, escapeKotlinString(config.version || "1.0.0")).replace(/\{\{VERSION_CODE\}\}/g, String(config.versionCode || 1)).replace(/\{\{MIN_SDK\}\}/g, String(config.minSdk ?? ANDROID_MIN_SDK)).replace(/\{\{COMPILE_SDK\}\}/g, String(config.compileSdk || 36)).replace(/\{\{TARGET_SDK\}\}/g, String(config.targetSdk || 35)).replace(/\{\{GOOGLE_SERVICES_PLUGIN\}\}/g, hasGoogleServices ? '    id("com.google.gms.google-services")' : "").replace(/\{\{FIREBASE_MESSAGING_DEPENDENCY\}\}/g, config.enablePushNotifications ? '    implementation("com.google.firebase:firebase-messaging:24.1.0")' : "").replace(/\{\{REFRESH_LAYOUT_DEPENDENCY\}\}/g, config.renderer === "native" ? '    implementation("androidx.swiperefreshlayout:swiperefreshlayout:1.1.0")' : "").replace(/\{\{HEALTH_CONNECT_DEPENDENCIES\}\}/g, config.enableHealthConnect ? `    implementation("androidx.health.connect:connect-client:1.1.0")
     implementation("org.jetbrains.kotlinx:kotlinx-coroutines-android:1.8.1")` : "").replace(/\{\{JAVASCRIPT_ENGINE_DEPENDENCY\}\}/g, config.renderer === "native" ? '    implementation("androidx.javascriptengine:javascriptengine:1.1.0")' : "");
   writeFileSync(join(output, "app/build.gradle.kts"), appGradle);
   const proguardTemplate = readFileSync(join(TEMPLATES_DIR, "proguard-rules.pro.template"), "utf-8");
@@ -618,7 +620,7 @@ zipStorePath=wrapper/dists
   console.log("Next steps:");
   console.log(`  1. cd ${output}`);
   if (config.renderer === "native") {
-    console.log("  2. Compile your screen: stx-native compile Screen.stx --format bundle --output screen.js");
+    console.log("  2. Compile your screen: stx native compile Screen.stx --format bundle --output screen.js");
     console.log("  3. Run: craft android build --native-bundle screen.js");
   } else {
     console.log("  2. Add your web content to app/src/main/assets/index.html");
@@ -644,7 +646,7 @@ async function build(options) {
     if (nativeBundlePath && resolve(nativeBundlePath) !== resolve(destination))
       cpSync(nativeBundlePath, destination);
     if (!existsSync(destination)) {
-      throw new Error("Native Android mode needs app/src/main/assets/native-screen.js. Compile a .stx screen with stx-native first.");
+      throw new Error("Native Android mode needs app/src/main/assets/native-screen.js. Compile a .stx screen with `stx native compile` first.");
     }
   } else if (nativeBundlePath) {
     throw new Error('--native-bundle requires renderer: "native" in craft.config.json.');

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

@@ -14,7 +14,7 @@ import kotlin.math.ceil
 
 internal typealias CraftNativeRenderItem = (node: JSONObject, identity: String, previous: View?) -> View
 
-/** A stable-key RecyclerView host for stx-native FlatList nodes. */
+/** A stable-key RecyclerView host for stx native FlatList nodes. */
 internal class CraftNativeFlatList(context: Context) : RecyclerView(context) {
     private data class Item(
         val identity: String,
@@ -90,6 +90,7 @@ internal class CraftNativeFlatList(context: Context) : RecyclerView(context) {
     private var dataContentSignature = ""
     private var horizontal = false
     private var columns = 1
+    private var keyboardShouldPersistTaps = "never"
     private var submissionGeneration = 0
     private var isSubmittingList = false
     private var pendingThemeRefresh = false
@@ -161,7 +162,7 @@ internal class CraftNativeFlatList(context: Context) : RecyclerView(context) {
     }
 
     fun setKeyboardDismissMode(mode: String, dismissKeyboard: () -> Unit) {
-        if (mode !in setOf("on-drag", "interactive")) {
+        if (mode !in setOf("on-drag", "interactive") && keyboardShouldPersistTaps == "always") {
             setOnTouchListener(null)
             return
         }
@@ -173,11 +174,47 @@ internal class CraftNativeFlatList(context: Context) : RecyclerView(context) {
                     dismissed = true
                     dismissKeyboard()
                 }
+                android.view.MotionEvent.ACTION_UP -> if (shouldDismissKeyboard(event)) dismissKeyboard()
             }
             false
         }
     }
 
+    fun setKeyboardShouldPersistTaps(value: String?) {
+        keyboardShouldPersistTaps = value?.takeIf { it in setOf("always", "handled", "never") } ?: "never"
+    }
+
+    private fun tapTarget(view: View, x: Float, y: Float): View? {
+        if (x < 0 || y < 0 || x >= view.width || y >= view.height || view.visibility != View.VISIBLE) return null
+        if (view is ViewGroup) {
+            for (index in view.childCount - 1 downTo 0) {
+                val child = view.getChildAt(index)
+                tapTarget(child, x - child.left, y - child.top)?.let { return it }
+            }
+        }
+        return view
+    }
+
+    private fun shouldDismissKeyboard(event: android.view.MotionEvent): Boolean {
+        if (keyboardShouldPersistTaps == "always") return false
+        if (keyboardShouldPersistTaps == "never") return true
+        return tapTarget(this, event.x, event.y)?.isClickable != true
+    }
+
+    fun setContentContainerStyle(style: JSONObject?, density: Float) {
+        val padding = (style?.optDouble("padding", 0.0) ?: 0.0) * density
+        val horizontal = (style?.optDouble("paddingHorizontal", padding / density) ?: (padding / density)) * density
+        val vertical = (style?.optDouble("paddingVertical", padding / density) ?: (padding / density)) * density
+        setPadding(
+            ((style?.optDouble("paddingLeft", horizontal / density) ?: (horizontal / density)) * density).toInt(),
+            ((style?.optDouble("paddingTop", vertical / density) ?: (vertical / density)) * density).toInt(),
+            ((style?.optDouble("paddingRight", horizontal / density) ?: (horizontal / density)) * density).toInt(),
+            ((style?.optDouble("paddingBottom", vertical / density) ?: (vertical / density)) * density).toInt(),
+        )
+        clipToPadding = true
+        requestLayout()
+    }
+
     fun apply(
         nodes: List<JSONObject>,
         horizontal: Boolean,

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

@@ -0,0 +1,29 @@
+package {{PACKAGE_NAME}}
+
+import android.content.Context
+import androidx.swiperefreshlayout.widget.SwipeRefreshLayout
+
+/** Swipe-to-refresh host for a native FlatList. */
+internal class CraftNativeRefreshableFlatList(context: Context) : SwipeRefreshLayout(context) {
+    val list = CraftNativeFlatList(context)
+    private var refreshHandler: (() -> Unit)? = null
+
+    init {
+        addView(list, LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT))
+        setOnRefreshListener { refreshHandler?.invoke() }
+        isEnabled = false
+    }
+
+    fun configureRefresh(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()
+    }
+}

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

@@ -33,6 +33,8 @@ import android.text.InputType
 import android.text.Layout
 import android.view.View
 import android.view.ViewGroup
+import android.widget.AdapterView
+import android.widget.ArrayAdapter
 import android.widget.Button
 import android.widget.EditText
 import android.widget.FrameLayout
@@ -41,6 +43,7 @@ import android.widget.ImageView
 import android.widget.LinearLayout
 import android.widget.ScrollView
 import android.widget.SeekBar
+import android.widget.Spinner
 import android.widget.Switch
 import android.widget.TextView
 import androidx.appcompat.app.AppCompatActivity
@@ -191,6 +194,16 @@ private class CraftNativeFlexLayout(context: Context) : LinearLayout(context) {
             val lp = child.layoutParams as? MarginLayoutParams
             val horizontalMargins = (lp?.leftMargin ?: 0) + (lp?.rightMargin ?: 0)
             val verticalMargins = (lp?.topMargin ?: 0) + (lp?.bottomMargin ?: 0)
+            if (child is CraftNativeModalView) {
+                val modalWidth = max(0, width - paddingLeft - paddingRight)
+                val modalHeight = max(0, height - paddingTop - paddingBottom)
+                child.measure(
+                    View.MeasureSpec.makeMeasureSpec(modalWidth, View.MeasureSpec.EXACTLY),
+                    View.MeasureSpec.makeMeasureSpec(modalHeight, View.MeasureSpec.EXACTLY),
+                )
+                absolute += Entry(child, style, modalWidth, modalHeight)
+                continue
+            }
             val childWidth = measureChildWidth(child, style, width - paddingLeft - paddingRight, horizontalMargins)
             val childHeight = measureChildHeight(child, style, height - paddingTop - paddingBottom, verticalMargins)
             val entry = Entry(child, style, childWidth, childHeight)
@@ -223,6 +236,16 @@ private class CraftNativeFlexLayout(context: Context) : LinearLayout(context) {
             val lp = child.layoutParams as? MarginLayoutParams
             val horizontalMargins = (lp?.leftMargin ?: 0) + (lp?.rightMargin ?: 0)
             val verticalMargins = (lp?.topMargin ?: 0) + (lp?.bottomMargin ?: 0)
+            if (child is CraftNativeModalView) {
+                val modalWidth = max(0, width - paddingLeft - paddingRight)
+                val modalHeight = max(0, height - paddingTop - paddingBottom)
+                child.measure(
+                    View.MeasureSpec.makeMeasureSpec(modalWidth, View.MeasureSpec.EXACTLY),
+                    View.MeasureSpec.makeMeasureSpec(modalHeight, View.MeasureSpec.EXACTLY),
+                )
+                absolute += Entry(child, style, modalWidth, modalHeight)
+                continue
+            }
             val childWidth = measureChildWidth(child, style, cellWidth, horizontalMargins)
             val childHeight = measureChildHeight(child, style, height - paddingTop - paddingBottom, verticalMargins)
             val entry = Entry(child, style, childWidth, childHeight)
@@ -250,7 +273,7 @@ private class CraftNativeFlexLayout(context: Context) : LinearLayout(context) {
             val child = getChildAt(index)
             if (child.visibility == GONE) continue
             val style = styles[child] ?: CraftNativeLayoutStyle()
-            if (style.position == "absolute") continue
+            if (style.position == "absolute" || child is CraftNativeModalView) continue
             val lp = child.layoutParams as? MarginLayoutParams
             val horizontalMargins = (lp?.leftMargin ?: 0) + (lp?.rightMargin ?: 0)
             val verticalMargins = (lp?.topMargin ?: 0) + (lp?.bottomMargin ?: 0)
@@ -365,6 +388,7 @@ private class CraftNativeFlexLayout(context: Context) : LinearLayout(context) {
             val contentWidth = width - paddingLeft - paddingRight
             val contentHeight = height - paddingTop - paddingBottom
             for (entry in layout.absolute) {
+                if (entry.view is CraftNativeModalView && entry.view.visibility == View.VISIBLE) entry.view.bringToFront()
                 val childWidth = if (entry.style.left != null && entry.style.right != null) contentWidth - entry.style.left!! - entry.style.right!! else entry.width
                 val childHeight = if (entry.style.top != null && entry.style.bottom != null) contentHeight - entry.style.top!! - entry.style.bottom!! else entry.height
                 val x = paddingLeft + (entry.style.left ?: (entry.style.right?.let { contentWidth - it - childWidth } ?: 0))
@@ -435,6 +459,7 @@ private class CraftNativeFlexLayout(context: Context) : LinearLayout(context) {
             crossOffset += line.cross + crossGap
         }
         for (entry in absolute) {
+            if (entry.view is CraftNativeModalView && entry.view.visibility == View.VISIBLE) entry.view.bringToFront()
             val widthValue = if (entry.style.left != null && entry.style.right != null) contentWidth - entry.style.left!! - entry.style.right!! else entry.width
             val heightValue = if (entry.style.top != null && entry.style.bottom != null) contentHeight - entry.style.top!! - entry.style.bottom!! else entry.height
             val x = paddingLeft + (entry.style.left ?: (entry.style.right?.let { contentWidth - it - widthValue } ?: 0))
@@ -463,6 +488,7 @@ private class CraftNativeScrollView(context: Context) : FrameLayout(context) {
     private var bounces = true
     private var alwaysBounceVertical = true
     private var alwaysBounceHorizontal = true
+    private var keyboardShouldPersistTaps = "never"
 
     init {
         vertical.isNestedScrollingEnabled = true
@@ -496,6 +522,10 @@ private class CraftNativeScrollView(context: Context) : FrameLayout(context) {
         horizontal.isEnabled = value
     }
 
+    fun setKeyboardShouldPersistTaps(value: String?) {
+        keyboardShouldPersistTaps = value?.takeIf { it in setOf("always", "handled", "never") } ?: "never"
+    }
+
     fun setBounces(value: Boolean) {
         bounces = value
         applyBounceModes()
@@ -512,6 +542,25 @@ private class CraftNativeScrollView(context: Context) : FrameLayout(context) {
         horizontal.overScrollMode = if (bounces && alwaysBounceHorizontal) View.OVER_SCROLL_ALWAYS else View.OVER_SCROLL_NEVER
     }
 
+    private fun tapTarget(view: View, x: Float, y: Float): View? {
+        if (x < 0 || y < 0 || x >= view.width || y >= view.height || view.visibility != View.VISIBLE) return null
+        if (view is ViewGroup) {
+            for (index in view.childCount - 1 downTo 0) {
+                val child = view.getChildAt(index)
+                tapTarget(child, x - child.left, y - child.top)?.let { return it }
+            }
+        }
+        return view
+    }
+
+    private fun shouldDismissKeyboard(scroller: View, event: android.view.MotionEvent): Boolean {
+        if (keyboardShouldPersistTaps == "always") return false
+        return when (keyboardShouldPersistTaps) {
+            "handled" -> (scroller as? ViewGroup)?.let { tapTarget(it, event.x, event.y)?.isClickable != true } ?: true
+            else -> true
+        }
+    }
+
     fun setPagingEnabled(value: Boolean) {
         pagingEnabled = value
     }
@@ -584,6 +633,9 @@ private class CraftNativeScrollView(context: Context) : FrameLayout(context) {
                         }
                     }
                     android.view.MotionEvent.ACTION_UP, android.view.MotionEvent.ACTION_CANCEL -> {
+                        if (event.actionMasked == android.view.MotionEvent.ACTION_UP && shouldDismissKeyboard(scroller, event)) {
+                            dismissKeyboard?.invoke()
+                        }
                         onEndDrag?.invoke()
                         if (pagingEnabled) snapToPage(scroller)
                         if (moved && !momentumActive) {
@@ -605,6 +657,46 @@ private class CraftNativeScrollView(context: Context) : FrameLayout(context) {
 
 private class CraftNativeFlexSpacer(context: Context) : View(context)
 
+private class CraftNativeModalView(context: Context) : FrameLayout(context) {
+    val content = CraftNativeFlexLayout(context)
+    private val blocker = View(context)
+    private var renderedVisible = false
+    var onRequestClose: (() -> Unit)? = null
+
+    var transparent: Boolean = false
+        set(value) {
+            field = value
+            blocker.setBackgroundColor(if (value) Color.TRANSPARENT else Color.argb(82, 0, 0, 0))
+        }
+
+    init {
+        isClickable = true
+        blocker.isClickable = true
+        blocker.setOnTouchListener { _, _ -> true }
+        blocker.setBackgroundColor(Color.argb(82, 0, 0, 0))
+        addView(blocker, LayoutParams(-1, -1))
+        addView(content, LayoutParams(-1, -1))
+    }
+
+    fun setVisible(visible: Boolean, opacity: Float, animationType: String?) {
+        if (renderedVisible == visible && visibility == if (visible) View.VISIBLE else View.GONE) return
+        renderedVisible = visible
+        if (!visible) {
+            animate().cancel()
+            alpha = 0f
+            visibility = View.GONE
+            return
+        }
+        visibility = View.VISIBLE
+        if (animationType == "none") {
+            alpha = opacity
+        } else {
+            alpha = 0f
+            animate().alpha(opacity).setDuration(if (animationType == "slide") 240L else 180L).start()
+        }
+    }
+}
+
 private data class LayoutBounds(
     val x: Double,
     val y: Double,
@@ -612,7 +704,7 @@ private data class LayoutBounds(
     val height: Double,
 )
 
-/** WebView-free host for a compiled stx-native route bundle. */
+/** WebView-free host for a route bundle compiled by `stx native compile`. */
 class MainActivity : AppCompatActivity() {
     private class Screen(
         val route: String?,
@@ -626,6 +718,8 @@ class MainActivity : AppCompatActivity() {
         val suppressedTextChanges = mutableSetOf<EditText>()
         val controls = mutableMapOf<String, View>()
         val handlers = mutableMapOf<View, String>()
+        val pressInHandlers = mutableMapOf<View, String>()
+        val pressOutHandlers = mutableMapOf<View, String>()
         val longPressHandlers = mutableMapOf<View, String>()
         val scrollHandlers = mutableMapOf<View, String>()
         val scrollBeginHandlers = mutableMapOf<View, String>()
@@ -642,6 +736,10 @@ class MainActivity : AppCompatActivity() {
         val imageLoadHandlers = mutableMapOf<ImageView, String>()
         val imageLoadEndHandlers = mutableMapOf<ImageView, String>()
         val imageErrorHandlers = mutableMapOf<ImageView, String>()
+        val pressActiveOpacities = mutableMapOf<View, Float>()
+        val pressBaseOpacities = mutableMapOf<View, Float>()
+        val modalVisibility = mutableMapOf<View, Boolean>()
+        val modalCloseHandlers = mutableMapOf<View, String>()
         val layoutHandlers = mutableMapOf<View, String>()
         val lastLayoutBounds = mutableMapOf<View, LayoutBounds>()
         val flatListRows = mutableMapOf<CraftNativeFlatList, MutableMap<String, MutableMap<String, View>>>()
@@ -695,6 +793,8 @@ class MainActivity : AppCompatActivity() {
         ViewCompat.setOnApplyWindowInsetsListener(root) { view, insets ->
             val safe = insets.getInsets(WindowInsetsCompat.Type.systemBars() or WindowInsetsCompat.Type.displayCutout())
             view.setPadding(safe.left, safe.top, safe.right, safe.bottom)
+            view.requestLayout()
+            view.post { screens.lastOrNull()?.takeIf { it.active }?.let(::emitLayoutEvents) }
             insets
         }
         ViewCompat.requestApplyInsets(root)
@@ -896,7 +996,13 @@ class MainActivity : AppCompatActivity() {
 
     private fun refreshScreenTheme(screen: Screen) {
         screen.mutations.node("root")?.let { renderCommitted(screen, it) }
-        screen.controls.values.filterIsInstance<CraftNativeFlatList>().forEach { it.refreshThemeDefaults() }
+        screen.controls.values.mapNotNull {
+            when (it) {
+                is CraftNativeRefreshableFlatList -> it.list
+                is CraftNativeFlatList -> it
+                else -> null
+            }
+        }.forEach { it.refreshThemeDefaults() }
     }
 
     private fun refreshThemeDefaults() {
@@ -1169,6 +1275,60 @@ class MainActivity : AppCompatActivity() {
                     override fun afterTextChanged(s: Editable?) {}
                 })
             }
+            "Picker" -> (previous as? Spinner ?: Spinner(this)).apply {
+                val options = (0 until children.length()).mapNotNull { index ->
+                    val option = children.optJSONObject(index) ?: return@mapNotNull null
+                    if (option.optString("type") != "Text") return@mapNotNull null
+                    val label = (option.optJSONArray("children") ?: JSONArray()).let { text ->
+                        (0 until text.length()).joinToString("") { text.optString(it) }
+                    }
+                    if (label.isBlank()) return@mapNotNull null
+                    val optionProps = option.optJSONObject("props")
+                    val value = optionProps?.optString("value").takeIf { !it.isNullOrBlank() } ?: label
+                    value to label
+                }
+                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)
+                onItemSelectedListener = object : AdapterView.OnItemSelectedListener {
+                    override fun onNothingSelected(parent: AdapterView<*>?) = Unit
+                    override fun onItemSelected(parent: AdapterView<*>?, view: View?, position: Int, id: Long) {
+                        val current = screen.handlers[this@apply] ?: return
+                        val option = options.getOrNull(position) ?: return
+                        send(screen, "EVENT", JSONObject().put("handlerName", current).put("nativeEvent", JSONObject()
+                            .put("value", option.first).put("index", position)))
+                    }
+                }
+                setSelection(selected, 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 wasVisible = screen.modalVisibility[this]
+                screen.modalVisibility[this] = visible
+                val requestClose = events.optString("onRequestClose")
+                if (requestClose.isNotBlank()) screen.modalCloseHandlers[this] = requestClose else screen.modalCloseHandlers.remove(this)
+                setVisible(visible, style.optDouble("opacity", 1.0).toFloat(), props.optString("animationType").ifBlank { null })
+                if (wasVisible != visible && (visible || wasVisible == true)) {
+                    val lifecycleHandler = if (visible) events.optString("onShow") else events.optString("onDismiss")
+                    if (lifecycleHandler.isNotBlank()) {
+                        send(screen, "EVENT", JSONObject().put("handlerName", lifecycleHandler).put("nativeEvent", JSONObject()))
+                    }
+                }
+            }
+            "TouchableOpacity", "TouchableHighlight", "Pressable" -> (previous as? CraftNativeFlexLayout ?: CraftNativeFlexLayout(this)).apply {
+                configureContainer(this, style)
+                screen.pressActiveOpacities[this] = props.optDouble("activeOpacity", 0.5).toFloat()
+                screen.pressBaseOpacities[this] = style.optDouble("opacity", 1.0).toFloat()
+                reconcileChildren(screen, this, children, path, next, style, previousControls)
+            }
             "Switch" -> (previous as? Switch ?: Switch(this)).apply {
                 setOnCheckedChangeListener(null)
                 val requestedValue = props.opt("value")
@@ -1286,6 +1446,7 @@ class MainActivity : AppCompatActivity() {
                     props.optBoolean("showsHorizontalScrollIndicator", true),
                 )
                 setScrollEnabled(props.optBoolean("scrollEnabled", true))
+                setKeyboardShouldPersistTaps(props.optString("keyboardShouldPersistTaps", "never"))
                 setBounces(props.optBoolean("bounces", true))
                 setAlwaysBounce(
                     props.optBoolean("alwaysBounceVertical", !horizontal),
@@ -1339,16 +1500,27 @@ class MainActivity : AppCompatActivity() {
                             ?.hideSoftInputFromWindow(nativeScroll.windowToken, 0)
                     },
                 )
-                configureContainer(content, style)
-                reconcileChildren(screen, content, children, path, next, style, previousControls)
+                val contentStyle = JSONObject(style.toString()).apply {
+                    props.optJSONObject("contentContainerStyle")?.let { override ->
+                        override.keys().forEach { key -> put(key, override.get(key)) }
+                    }
+                }
+                configureContainer(content, contentStyle)
+                reconcileChildren(screen, content, children, path, next, contentStyle, previousControls)
             }
-            "FlatList" -> (previous as? CraftNativeFlatList ?: CraftNativeFlatList(this)).apply {
-                setKeyboardDismissMode(props.optString("keyboardDismissMode")) {
+            "FlatList" -> (previous as? CraftNativeRefreshableFlatList ?: CraftNativeRefreshableFlatList(this)).apply {
+                val nativeList = list
+                configureRefresh(events.optString("onRefresh").takeIf { it.isNotBlank() }?.let { handler ->
+                    { send(screen, "EVENT", JSONObject().put("handlerName", handler).put("nativeEvent", JSONObject())) }
+                }, props.optBoolean("refreshing", false))
+                nativeList.setKeyboardShouldPersistTaps(props.optString("keyboardShouldPersistTaps", "never"))
+                nativeList.setContentContainerStyle(props.optJSONObject("contentContainerStyle"), resources.displayMetrics.density)
+                nativeList.setKeyboardDismissMode(props.optString("keyboardDismissMode")) {
                     (getSystemService(INPUT_METHOD_SERVICE) as? android.view.inputmethod.InputMethodManager)
                         ?.hideSoftInputFromWindow(windowToken, 0)
                 }
-                overScrollMode = if (props.optBoolean("bounces", true)) View.OVER_SCROLL_ALWAYS else View.OVER_SCROLL_NEVER
-                reconcileFlatList(screen, this, children, path, protocolId ?: path, props, events)
+                nativeList.overScrollMode = if (props.optBoolean("bounces", true)) View.OVER_SCROLL_ALWAYS else View.OVER_SCROLL_NEVER
+                reconcileFlatList(screen, nativeList, children, path, protocolId ?: path, props, events)
             }
             "View", "SafeAreaView" -> (previous as? CraftNativeFlexLayout ?: CraftNativeFlexLayout(this)).apply {
                 configureContainer(this, style)
@@ -1359,22 +1531,60 @@ class MainActivity : AppCompatActivity() {
                 reconcileChildren(screen, this, children, path, next, style, previousControls)
             }
         }
-        if (type != "Button" && type != "Link" && type != "TextInput" && type != "Switch" && type != "Slider" && type != "ActivityIndicator") {
+        val pressInHandler = events.optString("onPressIn").takeIf { it.isNotBlank() }
+        val pressOutHandler = events.optString("onPressOut").takeIf { it.isNotBlank() }
+        if (pressInHandler != null) screen.pressInHandlers[control] = pressInHandler else screen.pressInHandlers.remove(control)
+        if (pressOutHandler != null) screen.pressOutHandlers[control] = pressOutHandler else screen.pressOutHandlers.remove(control)
+        if (type != "Button" && type != "Link" && type != "TextInput" && type != "Picker" && type != "Modal" && type != "Switch" && type != "Slider" && type != "ActivityIndicator") {
             val handler = events.optString("onPress").ifBlank { events.optString("onClick") }
-            if (handler.isNotBlank()) {
-                screen.handlers[control] = handler
+            val disabled = props.optBoolean("disabled", false)
+            val hasPressLifecycle = pressInHandler != null || pressOutHandler != null
+            if ((handler.isNotBlank() || (type in setOf("TouchableOpacity", "TouchableHighlight", "Pressable") && hasPressLifecycle)) && !disabled) {
+                if (handler.isNotBlank()) screen.handlers[control] = handler else screen.handlers.remove(control)
                 control.isClickable = true
-                control.setOnClickListener {
-                    val current = screen.handlers[control] ?: return@setOnClickListener
-                    send(screen, "EVENT", JSONObject().put("handlerName", current).put("nativeEvent", JSONObject()))
+                if (type in setOf("TouchableOpacity", "TouchableHighlight", "Pressable")) {
+                    control.setOnClickListener(null)
+                    control.setOnTouchListener { view, event ->
+                        when (event.actionMasked) {
+                            android.view.MotionEvent.ACTION_DOWN -> {
+                                val active = screen.pressActiveOpacities[view] ?: 0.5f
+                                val base = screen.pressBaseOpacities[view] ?: 1f
+                                view.alpha = base * active
+                                screen.pressInHandlers[view]?.let { current ->
+                                    send(screen, "EVENT", JSONObject().put("handlerName", current).put("nativeEvent", JSONObject()))
+                                }
+                                true
+                            }
+                            android.view.MotionEvent.ACTION_UP, android.view.MotionEvent.ACTION_CANCEL -> {
+                                view.alpha = screen.pressBaseOpacities[view] ?: 1f
+                                screen.pressOutHandlers[view]?.let { current ->
+                                    send(screen, "EVENT", JSONObject().put("handlerName", current).put("nativeEvent", JSONObject()))
+                                }
+                                if (event.actionMasked == android.view.MotionEvent.ACTION_UP) {
+                                    val current = screen.handlers[view] ?: return@setOnTouchListener true
+                                    send(screen, "EVENT", JSONObject().put("handlerName", current).put("nativeEvent", JSONObject()))
+                                }
+                                true
+                            }
+                            else -> true
+                        }
+                    }
+                } else {
+                    control.setOnTouchListener(null)
+                    control.setOnClickListener {
+                        val current = screen.handlers[control] ?: return@setOnClickListener
+                        send(screen, "EVENT", JSONObject().put("handlerName", current).put("nativeEvent", JSONObject()))
+                    }
                 }
             } else {
                 screen.handlers.remove(control)
                 control.isClickable = false
                 control.setOnClickListener(null)
+                control.setOnTouchListener(null)
             }
+            control.isEnabled = !disabled
         }
-        val longPressHandler = events.optString("onLongPress")
+        val longPressHandler = events.optString("onLongPress").takeUnless { props.optBoolean("disabled", false) } ?: ""
         if (longPressHandler.isNotBlank()) {
             screen.longPressHandlers[control] = longPressHandler
             control.setOnLongClickListener {
@@ -1403,6 +1613,7 @@ class MainActivity : AppCompatActivity() {
         }
         next[identity] = control
         applyViewStyle(control, style)
+        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)
         control.layoutParams = LinearLayout.LayoutParams(
@@ -1751,7 +1962,7 @@ class MainActivity : AppCompatActivity() {
         val role = props.optString("accessibilityRole").ifBlank { type.lowercase() }
         val state = props.optJSONObject("accessibilityState")
         val disabled = state?.optBoolean("disabled", false) == true
-        if (type !in setOf("Button", "Link", "TextInput", "Switch", "Slider", "ActivityIndicator")) {
+        if (type !in setOf("Button", "Link", "TextInput", "Picker", "Modal", "Switch", "Slider", "ActivityIndicator")) {
             view.isEnabled = !disabled
         } else if (disabled) {
             view.isEnabled = false
@@ -1997,19 +2208,33 @@ class MainActivity : AppCompatActivity() {
         screen.flatListRows.values.forEach { rows -> rows.values.forEach { addAll(it.values) } }
     }
 
+    private fun releaseFlatList(
+        screen: Screen,
+        list: CraftNativeFlatList,
+        preservingInputDrafts: Boolean,
+    ) {
+        val owner = screen.flatListOwnerByView.remove(list)
+        list.discardAll()
+        screen.flatListRows.remove(list)?.values?.forEach {
+            releaseViewState(screen, it.values, preservingInputDrafts)
+        }
+        if (owner != null) screen.flatListOwners.entries.removeAll { it.value == owner }
+    }
+
     private fun releaseViewState(
         screen: Screen,
         views: Collection<View>,
         preservingInputDrafts: Boolean = false,
     ) {
-        val released = views.toSet()
-        released.filterIsInstance<CraftNativeFlatList>().forEach { list ->
-            val owner = screen.flatListOwnerByView.remove(list)
-            list.discardAll()
-            screen.flatListRows.remove(list)?.values?.forEach {
-                releaseViewState(screen, it.values, preservingInputDrafts)
-            }
-            if (owner != null) screen.flatListOwners.entries.removeAll { it.value == owner }
+        val released = views.toMutableSet()
+        val refreshableLists = released.filterIsInstance<CraftNativeRefreshableFlatList>()
+        val nestedLists = refreshableLists.map { it.list }.toSet()
+        released.addAll(nestedLists)
+        refreshableLists.forEach {
+            releaseFlatList(screen, it.list, preservingInputDrafts)
+        }
+        released.filterIsInstance<CraftNativeFlatList>().filterNot { nestedLists.contains(it) }.forEach {
+            releaseFlatList(screen, it, preservingInputDrafts)
         }
         releaseImages(released)
         released.filterIsInstance<EditText>().forEach {
@@ -2021,6 +2246,8 @@ class MainActivity : AppCompatActivity() {
         }
         released.forEach(defaultBackgrounds::remove)
         screen.handlers.keys.removeAll(released)
+        screen.pressInHandlers.keys.removeAll(released)
+        screen.pressOutHandlers.keys.removeAll(released)
         screen.longPressHandlers.keys.removeAll(released)
         screen.layoutHandlers.keys.removeAll(released)
         screen.lastLayoutBounds.keys.removeAll(released)
@@ -2039,6 +2266,10 @@ class MainActivity : AppCompatActivity() {
         screen.imageLoadHandlers.keys.removeAll(released)
         screen.imageLoadEndHandlers.keys.removeAll(released)
         screen.imageErrorHandlers.keys.removeAll(released)
+        screen.pressActiveOpacities.keys.removeAll(released)
+        screen.pressBaseOpacities.keys.removeAll(released)
+        screen.modalVisibility.keys.removeAll(released)
+        screen.modalCloseHandlers.keys.removeAll(released)
     }
 
     private fun closeScreen(screen: Screen) {
@@ -2049,6 +2280,8 @@ class MainActivity : AppCompatActivity() {
         releaseViewState(screen, retainedViews(screen).toList())
         screen.controls.clear()
         screen.handlers.clear()
+        screen.pressInHandlers.clear()
+        screen.pressOutHandlers.clear()
         screen.layoutHandlers.clear()
         screen.lastLayoutBounds.clear()
         screen.scrollHandlers.clear()
@@ -2073,7 +2306,17 @@ class MainActivity : AppCompatActivity() {
     }
 
     @Deprecated("Uses the activity back callback for native route navigation")
-    override fun onBackPressed() = back()
+    override fun onBackPressed() {
+        val screen = screens.lastOrNull() ?: return back()
+        val modal = screen.modalVisibility.entries.lastOrNull { (view, visible) -> visible && view.visibility == View.VISIBLE }
+        if (modal != null) {
+            screen.modalCloseHandlers[modal.key]?.let { handler ->
+                send(screen, "EVENT", JSONObject().put("handlerName", handler).put("nativeEvent", JSONObject()))
+            }
+            return
+        }
+        back()
+    }
 
     private fun showError(message: String) {
         root.removeAllViews()