craft-native 0.0.499 → 0.0.502

package/dist/android/src/index.d.ts

@@ -47,6 +47,12 @@ export interface CraftAndroidConfig {
     renderer?: 'web' | 'native';
     /** "system" follows the device; light/dark pin the generated host. */
     appearance?: 'light' | 'dark' | 'system';
+    /**
+     * The native chrome's accent as #RRGGBB: Back, the bar's buttons and the
+     * selected tab. Omitted keeps the system blue, as before. iOS has had the
+     * same key; without it an app themed on iOS drew its Android chrome blue.
+     */
+    tintColor?: string;
     /** Static native tab-bar styling applied before the page's own tabBar.set call. */
     tabBar?: CraftTabBarConfig;
     /** Runs from the generated project root before Gradle compiles the app. */

package/dist/android/src/index.js

@@ -1140,6 +1140,8 @@ function validateAndroidConfig(config) {
   if (config.appearance !== undefined && !["light", "dark", "system"].includes(config.appearance)) {
     throw new Error(`Unknown Android appearance: ${config.appearance}. Expected light, dark, or system.`);
   }
+  if (config.tintColor !== undefined && !/^#[0-9a-f]{6}$/i.test(config.tintColor))
+    throw new Error("Android tintColor must be a #RRGGBB color");
   const selection = config.tabBar?.selection;
   if (selection?.cornerRadius !== undefined && (!Number.isFinite(selection.cornerRadius) || selection.cornerRadius < 0))
     throw new Error("Android tabBar.selection.cornerRadius must be a finite non-negative number");

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

@@ -17,6 +17,9 @@ import kotlin.math.max
 
 internal typealias CraftNativeRenderItem = (node: JSONObject, identity: String, previous: View?) -> View
 
+/** The most columns a grid is given: more than any screen has pixels across to show. */
+internal const val CRAFT_NATIVE_FLAT_LIST_MAX_COLUMNS = 1024
+
 /** A stable-key RecyclerView host for stx native FlatList nodes. */
 internal class CraftNativeFlatList(context: Context) : RecyclerView(context) {
     override fun dispatchTouchEvent(event: MotionEvent): Boolean =
@@ -297,10 +300,38 @@ internal class CraftNativeFlatList(context: Context) : RecyclerView(context) {
         post { onContentSizeChanged?.invoke() }
     }
 
+    /**
+     * How far the grouped tab actions reach over the end of this list, in
+     * pixels (#523). The last row is given that much room below it, so it can
+     * be brought clear of them; the rows above still scroll behind them, and
+     * the list's own padding and viewport are as they were.
+     */
+    private var floatingCover = 0
+
+    fun setFloatingCover(cover: Int) {
+        val next = if (horizontal) 0 else max(0, cover)
+        if (next == floatingCover) return
+        floatingCover = next
+        invalidateItemDecorations()
+    }
+
+    private val floatingCoverRoom = object : ItemDecoration() {
+        override fun getItemOffsets(outRect: android.graphics.Rect, view: View, parent: RecyclerView, state: State) {
+            val position = parent.getChildAdapterPosition(view)
+            val last = state.itemCount - 1
+            if (floatingCover <= 0 || horizontal || position == NO_POSITION || last < 0) return
+            val grid = layoutManager as? GridLayoutManager
+            val endsTheList = if (grid == null) position == last
+            else grid.spanSizeLookup.getSpanGroupIndex(position, grid.spanCount) == grid.spanSizeLookup.getSpanGroupIndex(last, grid.spanCount)
+            if (endsTheList) outRect.bottom = floatingCover
+        }
+    }
+
     init {
         adapter = listAdapter
         itemAnimator = null
         addOnScrollListener(scrollListener)
+        addItemDecoration(floatingCoverRoom)
     }
 
     fun setKeyboardDismissMode(mode: String, dismissKeyboard: () -> Unit) {
@@ -375,7 +406,11 @@ internal class CraftNativeFlatList(context: Context) : RecyclerView(context) {
         this.endReached = endReached
         threshold = endReachedThreshold.takeIf { it.isFinite() }?.coerceAtLeast(0.0) ?: 0.1
 
-        val nextColumns = columns.coerceAtLeast(1)
+        // A grid keeps an array one longer than its column count, so a
+        // count from data (`numColumns={Number.MAX_VALUE}` arrives as the
+        // largest Int) asked it for a negative length and ended the process
+        // in layout. No screen is as many pixels wide as this many columns.
+        val nextColumns = columns.coerceIn(1, CRAFT_NATIVE_FLAT_LIST_MAX_COLUMNS)
         val layoutChanged = this.horizontal != horizontal || this.columns != nextColumns
         val retainedState = if (layoutChanged) null else layoutManager?.onSaveInstanceState()
         this.horizontal = horizontal
@@ -387,11 +422,10 @@ internal class CraftNativeFlatList(context: Context) : RecyclerView(context) {
         }
 
         val seen = mutableMapOf<String, Int>()
+        val taken = mutableSetOf<String>()
         val next = nodes.mapIndexed { index, node ->
             val base = identity(node) ?: "index:$index"
-            val occurrence = seen.getOrDefault(base, 0)
-            seen[base] = occurrence + 1
-            val unique = if (occurrence == 0) base else "$base#$occurrence"
+            val unique = uniqueIdentity(base, seen, taken)
             val role = node.optJSONObject("props")?.optString("listRole").orEmpty()
             Item(unique, node, node.toString(), role.isNotBlank() && role != "item")
         }.let { if (inverted) it.reversed() else it }
@@ -546,6 +580,27 @@ internal class CraftNativeFlatList(context: Context) : RecyclerView(context) {
         endReached?.invoke()
     }
 
+    /**
+     * A row's identity, its own in this list.
+     *
+     * Rows that share a key are told apart by a suffix: `run`, then `run#1`.
+     * A row whose own key was `run#1` then had the identity of the second
+     * `run`, and with it the same stable id, which a RecyclerView requires to
+     * be unique; UIKit's list ended the process on the same rows. The suffix
+     * counts on until the identity is one no row has taken. A list with no
+     * such key has the identities it always had.
+     */
+    private fun uniqueIdentity(base: String, seen: MutableMap<String, Int>, taken: MutableSet<String>): String {
+        var occurrence = seen.getOrDefault(base, 0)
+        var identity = if (occurrence == 0) base else "$base#$occurrence"
+        while (!taken.add(identity)) {
+            occurrence += 1
+            identity = "$base#$occurrence"
+        }
+        seen[base] = occurrence + 1
+        return identity
+    }
+
     private fun identity(node: JSONObject): String? {
         val props = node.optJSONObject("props") ?: JSONObject()
         return listOf(node.optString("id"), node.optString("key"), props.optString("key"), props.optString("testID"))

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

@@ -187,6 +187,10 @@ internal class CraftNativeRoutes(config: JSONObject) {
         }
         ?: CraftNativeTabBarAppearance()
 
+    /** The chrome's accent, where the app set one (`tintColor`); the system blue otherwise. */
+    val tintColor: Int? = config.optString("tintColor").takeUnless { config.isNull("tintColor") || it.isBlank() }
+        ?.let { runCatching { Color.parseColor(it) }.getOrNull() }
+
     /** CSS stacks for the chrome's labels and titles, as the app configured them. */
     val fontFamily: String? = config.optString("fontFamily").takeUnless { config.isNull("fontFamily") || it.isBlank() }
     val headingFontFamily: String? = config.optString("headingFontFamily").takeUnless { config.isNull("headingFontFamily") || it.isBlank() }
@@ -993,7 +997,7 @@ internal object CraftNativePrelude {
  * screen sets its own chrome with
  *
  * `craft.navigation.setOptions({ title, largeTitle, titleColor, hidden,
- *   backgroundColor, leftButtons, rightButtons, tabItem, tabAccessory,
+ *   backgroundColor, backButton, leftButtons, rightButtons, tabItem, tabAccessory,
  *   tabBarHidden, tabBarHiddenWhenPushed, tabSwipeEnabled })`
  *
  * which `apply` below reads. That list is checked against `apply` itself
@@ -1013,6 +1017,7 @@ internal class CraftNativeChrome(
     private val tabs: List<CraftNativeTab>,
     private val tabBarAppearance: CraftNativeTabBarAppearance = CraftNativeTabBarAppearance(),
     private val fonts: CraftNativeChromeFonts = CraftNativeChromeFonts(),
+    private val tintColor: Int? = null,
 ) : LinearLayout(context) {
     val content = FrameLayout(context)
     private val body = FrameLayout(context)
@@ -1249,6 +1254,8 @@ internal class CraftNativeChrome(
         val title = options.optString("title").takeIf { options.has("title") } ?: fallbackTitle.orEmpty()
         bar.visibility = if (hidden) View.GONE else View.VISIBLE
         backButton.visibility = if (depth > 0) View.VISIBLE else View.GONE
+        backButtonSpec = options.optJSONObject("backButton")
+        applyBackButton()
         bar.setPadding(if (depth > 0) dp(4) else dp(4), 0, dp(8), 0)
         titleView.text = if (large) "" else title
         largeTitleView.text = title
@@ -1335,6 +1342,68 @@ internal class CraftNativeChrome(
         refreshColors()
     }
 
+    /**
+     * How far the grouped actions reach up from the tab bar, in pixels: their
+     * height and their lift above it. Zero when they are not floating over
+     * the screen (no group, a hidden bar, or actions that sit in the tab row).
+     */
+    internal fun floatingActionsReach(): Int =
+        if (accessoryGroup.parent === body && accessoryGroup.visibility == View.VISIBLE && accessoryGroup.height > 0) (body.height - accessoryGroup.top).coerceAtLeast(0)
+        else 0
+
+    private var floatingClearancePosted = false
+    private var floatingClearanceGiven = false
+
+    /**
+     * The grouped actions float over the trailing end of whatever scrolls
+     * behind them, and nothing was reserved, so the last rows of a screen
+     * could not be brought out from under them (#523). Every vertical scroll
+     * view and list that reaches into them is given that much room at its
+     * end; one that ends above them gets none. Measured after each layout,
+     * where each of them now ends.
+     */
+    private fun clearFloatingActions() {
+        val reach = floatingActionsReach()
+        // Nothing floats and nothing was given room: no screen to walk.
+        if (reach <= 0 && !floatingClearanceGiven) return
+        floatingClearanceGiven = reach > 0
+        val top = body.height - reach
+        val origin = IntArray(2).also { body.getLocationInWindow(it) }
+        val at = IntArray(2)
+        fun cover(view: View): Int {
+            if (reach <= 0 || !view.isLaidOut) return 0
+            view.getLocationInWindow(at)
+            return (at[1] - origin[1] + view.height - top).coerceIn(0, reach)
+        }
+        // `inside` a scroll view that scrolls down the screen, a list or a
+        // second scroll view is brought clear by that one, and gets none of
+        // its own: where it sits in a page not yet scrolled to it says
+        // nothing about the screen, and a short list below the fold was
+        // given the whole reach and scrolled inside its box into blank space.
+        fun visit(view: View, inside: Boolean) {
+            when (view) {
+                is CraftNativeFlatList -> view.setFloatingCover(if (inside) 0 else cover(view))
+                is CraftNativeScrollView -> {
+                    view.setFloatingCover(if (inside) 0 else cover(view))
+                    visit(view.content, inside || view.scrollsVertically)
+                }
+                is ViewGroup -> for (index in 0 until view.childCount) visit(view.getChildAt(index), inside)
+            }
+        }
+        visit(content, false)
+    }
+
+    override fun onLayout(changed: Boolean, left: Int, top: Int, right: Int, bottom: Int) {
+        super.onLayout(changed, left, top, right, bottom)
+        if (floatingClearancePosted) return
+        floatingClearancePosted = true
+        // After this pass: giving a scroll view room asks for a layout.
+        post {
+            floatingClearancePosted = false
+            clearFloatingActions()
+        }
+    }
+
     /** The same actions and popup anchors survive switching between grouped and separate chrome. */
     private fun layoutAccessoryGroup(hidden: Boolean) {
         val layout = accessorySpec?.optString("layout").orEmpty()
@@ -1443,6 +1512,42 @@ internal class CraftNativeChrome(
         )
     }
 
+    private var backButtonSpec: JSONObject? = null
+    private var renderedBackButton = ""
+
+    /**
+     * `backButton`: what this screen's Back is drawn with, when it is not the
+     * arrow (`{ symbol: "xmark", accessibilityLabel: "Close" }` for a screen
+     * that closes rather than goes back). `leftButtons` sit beside Back, so a
+     * screen could not put its own symbol in Back's place (#527). It is still
+     * the bar's back button: the same tap, shown at the same depths.
+     *
+     * The symbol is the app's own icon when it has one, and AppCompat's close
+     * mark for an `xmark` it has none for. Any other symbol the app has no
+     * icon for leaves the arrow, and its "Back".
+     */
+    private fun applyBackButton() {
+        val symbol = backButtonSpec?.optString("symbol").orEmpty()
+        val label = backButtonSpec?.optString("accessibilityLabel").orEmpty()
+        val tint = backButton.imageTintList?.defaultColor ?: Color.BLACK
+        // The activity passes cumulative options for every live patch: the
+        // same symbol in the same colour keeps the picture it has.
+        val rendered = "$symbol\u0000$label\u0000$tint"
+        if (rendered == renderedBackButton) return
+        renderedBackButton = rendered
+        val icon = if (symbol.isBlank()) null else CraftNativeIcons.drawable(context, null, symbol, tint)
+            ?: if (symbol.startsWith("xmark")) {
+                androidx.appcompat.content.res.AppCompatResources.getDrawable(context, androidx.appcompat.R.drawable.abc_ic_clear_material)
+            } else null
+        if (icon == null) {
+            backButton.setImageResource(androidx.appcompat.R.drawable.abc_ic_ab_back_material)
+            backButton.contentDescription = "Back"
+        } else {
+            backButton.setImageDrawable(icon)
+            backButton.contentDescription = label.ifBlank { if (symbol.startsWith("xmark")) "Close" else "Back" }
+        }
+    }
+
     /** Light or dark changed: the bars follow the screen's background. */
     fun refreshColors() {
         val background = screenBackgroundColor ?: ContextCompat.getColor(context, R.color.background)
@@ -1456,6 +1561,8 @@ internal class CraftNativeChrome(
         titleView.setTextColor(navigationTitleColor ?: text)
         largeTitleView.setTextColor(navigationTitleColor ?: text)
         backButton.imageTintList = ColorStateList.valueOf(accent)
+        // A screen's own back symbol is drawn in the accent, not tinted by it.
+        applyBackButton()
         val surface = if (dark) Color.parseColor("#1C1C1E") else Color.parseColor("#F9F9F9")
         val grouped = accessoryGroup.parent === body
         accessoryGroup.background = if (grouped) GradientDrawable().apply { setColor(surface); cornerRadius = dp(26).toFloat() } else null
@@ -1579,7 +1686,8 @@ internal class CraftNativeChrome(
         }
     }
 
-    private fun accentColor(dark: Boolean): Int = if (dark) Color.parseColor("#0A84FF") else Color.parseColor("#007AFF")
+    /** Back, the bar's buttons and the selected tab: the app's own tint in both appearances, else the system blue. */
+    private fun accentColor(dark: Boolean): Int = tintColor ?: if (dark) Color.parseColor("#0A84FF") else Color.parseColor("#007AFF")
 
     private fun tabCellBackground(index: Int, dark: Boolean): android.graphics.drawable.Drawable? {
         if (accessorySelected || index != selectedTab || (tabBarAppearance.selectionColor == null && tabBarAppearance.selectionCornerRadius == null)) return rippleBackground()

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

@@ -229,6 +229,21 @@ internal fun craftNativeFiniteFloat(style: JSONObject?, name: String, fallback:
     return if (value.isFinite() && narrowed.isFinite()) narrowed else fallback
 }
 
+/**
+ * The most a number may be on a view, either side of zero: 2^25, as on UIKit.
+ * It is far past any screen, and a view refuses anything past the largest
+ * Float: `setScaleX` and its like throw on infinity and on what is not a
+ * number, and a style is whatever the script said.
+ */
+internal const val CRAFT_NATIVE_LAYOUT_LIMIT = 33_554_432f
+
+/** A number for a view: inside that limit, and 0 when it is not a number. */
+internal fun craftNativeLayoutNumber(value: Float): Float =
+    if (value.isNaN()) 0f else value.coerceIn(-CRAFT_NATIVE_LAYOUT_LIMIT, CRAFT_NATIVE_LAYOUT_LIMIT)
+
+internal fun craftNativeLayoutNumber(value: Double): Float =
+    if (value.isNaN()) 0f else value.coerceIn(-CRAFT_NATIVE_LAYOUT_LIMIT.toDouble(), CRAFT_NATIVE_LAYOUT_LIMIT.toDouble()).toFloat()
+
 internal fun craftNativeFiniteDouble(style: JSONObject?, name: String, fallback: Double): Double {
     val value = craftNativeNumber(style?.opt(name)) ?: Double.NaN
     return value.takeIf { it.isFinite() } ?: fallback
@@ -355,29 +370,32 @@ internal fun craftNativeComponentLayoutStyle(node: JSONObject): JSONObject {
     return merged
 }
 
-private fun craftNativeGridColumnCount(value: Any?): Int {
-    if (value is Number) return max(1, value.toInt())
-    val text = value as? String ?: return 1
-    val trimmed = text.trim()
-    if (trimmed.startsWith("repeat(")) {
-        val count = trimmed.removePrefix("repeat(").takeWhile { it.isDigit() }.toIntOrNull()
-        if (count != null) return max(1, count)
-    }
-    return max(1, trimmed.split(Regex("\\s+")).count { it.isNotBlank() })
-}
+/**
+ * The most tracks a grid is given, either way. A count is whatever the script
+ * said (`gridTemplateRows: Number.MAX_VALUE`, `repeat(2147483647, 1fr)`), and
+ * the layout makes a list of rows and an array of columns that long: the
+ * process ran out of memory in measure. No screen has room to show more
+ * tracks than this.
+ */
+internal const val CRAFT_NATIVE_GRID_TRACK_LIMIT = 1024
 
-private fun craftNativeGridRowCount(value: Any?): Int? {
-    if (value is Number) return max(1, value.toInt())
-    val text = value as? String ?: return null
-    val trimmed = text.trim()
-    if (trimmed.isEmpty()) return null
+internal fun craftNativeGridTrackCount(value: Any?): Int? {
+    if (value is Number) return value.toInt().coerceIn(1, CRAFT_NATIVE_GRID_TRACK_LIMIT)
+    val trimmed = (value as? String)?.trim()?.takeIf { it.isNotEmpty() } ?: return null
     if (trimmed.startsWith("repeat(")) {
-        val count = trimmed.removePrefix("repeat(").takeWhile { it.isDigit() }.toIntOrNull()
-        if (count != null) return max(1, count)
+        // Digits past what an Int holds are still a count, and still too many.
+        val digits = trimmed.removePrefix("repeat(").takeWhile { it.isDigit() }
+        if (digits.isNotEmpty()) {
+            return (digits.toIntOrNull() ?: CRAFT_NATIVE_GRID_TRACK_LIMIT).coerceIn(1, CRAFT_NATIVE_GRID_TRACK_LIMIT)
+        }
     }
-    return max(1, trimmed.split(Regex("\\s+")).count { it.isNotBlank() })
+    return trimmed.split(Regex("\\s+")).count { it.isNotBlank() }.coerceIn(1, CRAFT_NATIVE_GRID_TRACK_LIMIT)
 }
 
+private fun craftNativeGridColumnCount(value: Any?): Int = craftNativeGridTrackCount(value) ?: 1
+
+private fun craftNativeGridRowCount(value: Any?): Int? = craftNativeGridTrackCount(value)
+
 /**
  * A CSS colour as Android's ARGB. STX writes `#RRGGBBAA` (and `#RGBA`) for a
  * colour with alpha, where Android's parser reads `#AARRGGBB`: a translucent
@@ -412,6 +430,54 @@ internal fun craftNativeColor(raw: String): Int {
 }
 
 /** Android View has no skew setters before API 29; draw the shared skew around the view's center. */
+/**
+ * Times a hold on a view whose touch listener answers every event itself.
+ *
+ * The platform times a long click in `View.onTouchEvent`, and a listener
+ * that consumes the touch keeps that from running. A pressable with
+ * `onPress` has such a listener (it sends the press, and the press-in and
+ * press-out around it), so its `onLongPress`, and the menu a `contextMenu`
+ * opens on a hold, were never reached by a finger: holding a row sent its
+ * press when the finger lifted (#529).
+ *
+ * The same rules as the platform's: the hold is up after its long-press
+ * timeout, a finger that moves past the touch slop is not holding, and a
+ * hold that something handled is not also a press.
+ */
+private object CraftNativePressHolds {
+    private class Hold(val fire: Runnable, val x: Float, val y: Float)
+    private val pending = WeakHashMap<View, Hold>()
+    private val handled = WeakHashMap<View, Boolean>()
+
+    fun began(view: View, event: MotionEvent) {
+        cancel(view)
+        handled.remove(view)
+        if (!view.isLongClickable) return
+        val fire = Runnable {
+            pending.remove(view)
+            if (view.isAttachedToWindow && view.isLongClickable && view.performLongClick()) handled[view] = true
+        }
+        pending[view] = Hold(fire, event.x, event.y)
+        view.postDelayed(fire, android.view.ViewConfiguration.getLongPressTimeout().toLong())
+    }
+
+    fun moved(view: View, event: MotionEvent) {
+        val hold = pending[view] ?: return
+        val slop = android.view.ViewConfiguration.get(view.context).scaledTouchSlop
+        if (abs(event.x - hold.x) > slop || abs(event.y - hold.y) > slop) cancel(view)
+    }
+
+    /** The touch is over. Whether its hold was handled, so that lifting is not a press. */
+    fun ended(view: View): Boolean {
+        cancel(view)
+        return handled.remove(view) == true
+    }
+
+    private fun cancel(view: View) {
+        pending.remove(view)?.let { view.removeCallbacks(it.fire) }
+    }
+}
+
 private object CraftNativeSkewTransforms {
     private val values = WeakHashMap<View, Pair<Float, Float>>()
 
@@ -1344,7 +1410,19 @@ internal class CraftNativePointerImageView(context: Context) : ImageView(context
             ?: style.opt(name)?.takeUnless { it == JSONObject.NULL }
         val fit = value("objectFit")
         val position = value("objectPosition")
-        objectFit = if (fit != null || position != null) (fit as? String)
+        // A position does not choose a fit, as in CSS. STX compiles
+        // `object-cover` to `resizeMode: "cover"` and sets no objectFit, so a
+        // cover image given a position was drawn as "fill": stretched to its
+        // box instead of cropped (#532).
+        val requested = if (fit != null) fit as? String else when (
+            craftNativeOptionalString(style.opt("resizeMode")) ?: craftNativeOptionalString(props.opt("resizeMode"))
+        ) {
+            "cover" -> "cover"
+            "contain" -> "contain"
+            "center" -> "none"
+            else -> "fill"
+        }
+        objectFit = if (fit != null || position != null) requested
             ?.takeIf { it in setOf("fill", "contain", "cover", "none", "scale-down") } ?: "fill" else null
         val point = parsePosition(position)
         objectX = point.first; objectY = point.second
@@ -3067,6 +3145,22 @@ internal class CraftNativeScrollView(context: Context) : SwipeRefreshLayout(cont
         }
     }
 
+    /**
+     * How far the grouped tab actions reach over the end of this scroll view,
+     * in pixels (#523). Its content gets that much room at the end, so the
+     * last of it can be brought clear of them; the rest still scrolls behind
+     * them, in the viewport it had.
+     */
+    fun setFloatingCover(cover: Int) {
+        val next = if (horizontalMode == true) 0 else max(0, cover)
+        if (vertical.paddingBottom == next) return
+        vertical.clipToPadding = false
+        vertical.setPadding(vertical.paddingLeft, vertical.paddingTop, vertical.paddingRight, next)
+    }
+
+    /** Whether this scrolls down the screen: what is inside it is brought clear of the actions by it. */
+    val scrollsVertically: Boolean get() = horizontalMode != true
+
     private var bounces = true
     private var alwaysBounceVertical = true
     private var alwaysBounceHorizontal = true
@@ -3585,6 +3679,17 @@ private class CraftNativeTextField(context: Context) : EditText(context) {
         CraftNativePointers.dispatch(this, event) { super.dispatchTouchEvent(it) }
 
     companion object { val CLEAR_ACTION_ID = View.generateViewId() }
+    /**
+     * `autoFocus` as this field was last drawn. Focus is taken when it turns
+     * on, which mounting with it on is, and not on each render while it stays
+     * on: that took the keyboard back whenever anything else changed (#511).
+     */
+    private var autoFocus = false
+    fun autoFocusTurnedOn(wanted: Boolean): Boolean {
+        val turnedOn = wanted && !autoFocus
+        autoFocus = wanted
+        return turnedOn
+    }
     var clearButtonMode = "never"
     var onClearRequest: (() -> Unit)? = null
     private var clearPressed = false
@@ -5321,7 +5426,8 @@ class MainActivity : AppCompatActivity() {
     private fun installChrome() {
         val bodyFont = craftNativeChromeTypeface(routes.fontFamily, bundledFonts)
         val bars = CraftNativeChrome(this, routes.tabs, routes.tabBarAppearance,
-            CraftNativeChromeFonts(bodyFont, craftNativeChromeTypeface(routes.headingFontFamily, bundledFonts) ?: bodyFont))
+            CraftNativeChromeFonts(bodyFont, craftNativeChromeTypeface(routes.headingFontFamily, bundledFonts) ?: bodyFont),
+            routes.tintColor)
         bars.layoutParams = FrameLayout.LayoutParams(-1, -1)
         bars.onBack = { onBackPressedDispatcherCompat() }
         bars.onAccessory = { path -> navigateOpen(path) }
@@ -6802,7 +6908,7 @@ class MainActivity : AppCompatActivity() {
                     send(screen, "EVENT", JSONObject().put("handlerName", current).put("nativeEvent", JSONObject().put("text", text.toString())))
                     true
                 }
-                if (craftNativeBoolean(props.opt("autoFocus")) && !isFocused) post {
+                if (autoFocusTurnedOn(craftNativeBoolean(props.opt("autoFocus"))) && !isFocused) post {
                     if (!isFocused) {
                         requestFocus()
                         (getSystemService(INPUT_METHOD_SERVICE) as? android.view.inputmethod.InputMethodManager)
@@ -7069,9 +7175,17 @@ class MainActivity : AppCompatActivity() {
                 }
             }
             "Slider" -> (previous as? SeekBar ?: CraftNativePointerSeekBar(this)).apply {
-                val minimum = craftNativeFiniteNumber(props, "minimumValue", 0.0)
-                val maximumCandidate = craftNativeFiniteNumber(props, "maximumValue", 1.0)
-                val maximum = if (maximumCandidate > minimum) maximumCandidate else minimum + Double.MIN_VALUE
+                // Held to a quarter of the largest Double, so the range, and
+                // a value's distance along it, are numbers: at the largest
+                // their difference is infinite, and infinity over infinity
+                // is not a number, which `roundToInt` throws on and JSON
+                // will not carry back to the screen.
+                val bound = Double.MAX_VALUE / 4
+                val minimum = craftNativeFiniteNumber(props, "minimumValue", 0.0).coerceIn(-bound, bound)
+                val maximumCandidate = craftNativeFiniteNumber(props, "maximumValue", 1.0).coerceIn(-bound, bound)
+                // The next number up, whatever the size of the first: adding
+                // the smallest Double to anything but zero adds nothing.
+                val maximum = if (maximumCandidate > minimum) maximumCandidate else Math.nextUp(minimum)
                 setOnSeekBarChangeListener(null)
                 val step = craftNativeFiniteNumber(props, "step", 0.0).takeIf { it > 0 }
                 // A stepped slider needs one native position per authored
@@ -7087,7 +7201,7 @@ class MainActivity : AppCompatActivity() {
                         .toInt()
                 } ?: 1000
                 max = progressMax
-                val requested = craftNativeFiniteNumber(props, "value", minimum)
+                val requested = craftNativeFiniteNumber(props, "value", minimum).coerceIn(minimum, maximum)
                 val value = (if (step != null) minimum + ((requested - minimum) / step).roundToInt() * step else requested)
                     .coerceIn(minimum, maximum)
                 progress = if (step != null) {
@@ -7135,7 +7249,7 @@ class MainActivity : AppCompatActivity() {
                 val scale = when (requestedSize) {
                     "large" -> 1.35f
                     "small" -> 0.75f
-                    is Number -> (requestedSize.toDouble() / 24.0).takeIf { it.isFinite() }?.toFloat()?.coerceAtLeast(0.5f) ?: 1f
+                    is Number -> (requestedSize.toDouble() / 24.0).takeIf { it.isFinite() }?.let { craftNativeLayoutNumber(it).coerceAtLeast(0.5f) } ?: 1f
                     else -> 1f
                 }
                 indicatorScale = scale
@@ -7417,9 +7531,17 @@ class MainActivity : AppCompatActivity() {
                                 screen.pressUnderlayShowHandlers[view]?.let { current ->
                                     send(screen, "EVENT", JSONObject().put("handlerName", current).put("nativeEvent", JSONObject()))
                                 }
+                                // This listener answers every event, so the
+                                // platform never times the hold: do it here.
+                                CraftNativePressHolds.began(view, event)
+                                true
+                            }
+                            android.view.MotionEvent.ACTION_MOVE -> {
+                                CraftNativePressHolds.moved(view, event)
                                 true
                             }
                             android.view.MotionEvent.ACTION_UP, android.view.MotionEvent.ACTION_CANCEL -> {
+                                val held = CraftNativePressHolds.ended(view)
                                 view.alpha = screen.pressBaseOpacities[view] ?: 1f
                                 if (screen.pressBaseBackgrounds.containsKey(view)) view.background = screen.pressBaseBackgrounds[view]
                                 screen.pressOutHandlers[view]?.let { current ->
@@ -7428,7 +7550,9 @@ class MainActivity : AppCompatActivity() {
                                 screen.pressUnderlayHideHandlers[view]?.let { current ->
                                     send(screen, "EVENT", JSONObject().put("handlerName", current).put("nativeEvent", JSONObject()))
                                 }
-                                if (event.actionMasked == android.view.MotionEvent.ACTION_UP) {
+                                // A hold that sent its long press, or opened
+                                // its menu, is not a press as well.
+                                if (event.actionMasked == android.view.MotionEvent.ACTION_UP && !held) {
                                     dispatchNativePress(screen, view)
                                 }
                                 true
@@ -7940,37 +8064,46 @@ class MainActivity : AppCompatActivity() {
     }
 
     private fun applyTransform(view: View, transforms: JSONArray?) {
-        view.translationX = 0f
-        view.translationY = 0f
         // Reconciliation reapplies transforms; start from the control's
         // intrinsic scale rather than erasing its authored indicator size.
         val intrinsicScale = (view as? CraftNativeActivityIndicator)?.indicatorScale ?: 1f
-        view.scaleX = intrinsicScale
-        view.scaleY = intrinsicScale
-        view.rotation = 0f
-        view.rotationX = 0f
-        view.rotationY = 0f
-        CraftNativeSkewTransforms.clear(view)
-        if (transforms == null) return
+        var translationX = 0f
+        var translationY = 0f
+        var scaleX = intrinsicScale
+        var scaleY = intrinsicScale
+        var rotation = 0f
+        var rotationX = 0f
+        var rotationY = 0f
         var skewX = 0f
         var skewY = 0f
-        for (index in 0 until transforms.length()) {
-            val transform = transforms.optJSONObject(index) ?: continue
+        for (index in 0 until (transforms?.length() ?: 0)) {
+            val transform = transforms?.optJSONObject(index) ?: continue
             val key = transform.keys().asSequence().firstOrNull() ?: continue
             when (key) {
-                "translateX" -> view.translationX += dp(craftNativeFiniteDouble(transform, key, 0.0)).toFloat()
-                "translateY" -> view.translationY += dp(craftNativeFiniteDouble(transform, key, 0.0)).toFloat()
-                "scale" -> craftNativeFiniteDouble(transform, key, 1.0).toFloat().let { view.scaleX *= it; view.scaleY *= it }
-                "scaleX" -> view.scaleX *= craftNativeFiniteDouble(transform, key, 1.0).toFloat()
-                "scaleY" -> view.scaleY *= craftNativeFiniteDouble(transform, key, 1.0).toFloat()
-                "rotate", "rotateZ" -> view.rotation += angleDegrees(transform.opt(key))
-                "rotateX" -> view.rotationX += angleDegrees(transform.opt(key))
-                "rotateY" -> view.rotationY += angleDegrees(transform.opt(key))
+                "translateX" -> translationX += dp(craftNativeFiniteDouble(transform, key, 0.0)).toFloat()
+                "translateY" -> translationY += dp(craftNativeFiniteDouble(transform, key, 0.0)).toFloat()
+                "scale" -> craftNativeFiniteDouble(transform, key, 1.0).toFloat().let { scaleX *= it; scaleY *= it }
+                "scaleX" -> scaleX *= craftNativeFiniteDouble(transform, key, 1.0).toFloat()
+                "scaleY" -> scaleY *= craftNativeFiniteDouble(transform, key, 1.0).toFloat()
+                "rotate", "rotateZ" -> rotation += angleDegrees(transform.opt(key))
+                "rotateX" -> rotationX += angleDegrees(transform.opt(key))
+                "rotateY" -> rotationY += angleDegrees(transform.opt(key))
                 "skewX" -> skewX += skewFactor(transform.opt(key))
                 "skewY" -> skewY += skewFactor(transform.opt(key))
             }
         }
-        CraftNativeSkewTransforms.set(view, skewX, skewY)
+        // Summed and multiplied first, and bounded once: a view throws on a
+        // scale or an offset that is infinite or not a number, and two finite
+        // factors can make either.
+        view.translationX = craftNativeLayoutNumber(translationX)
+        view.translationY = craftNativeLayoutNumber(translationY)
+        view.scaleX = craftNativeLayoutNumber(scaleX)
+        view.scaleY = craftNativeLayoutNumber(scaleY)
+        view.rotation = craftNativeLayoutNumber(rotation)
+        view.rotationX = craftNativeLayoutNumber(rotationX)
+        view.rotationY = craftNativeLayoutNumber(rotationY)
+        CraftNativeSkewTransforms.clear(view)
+        if (transforms != null) CraftNativeSkewTransforms.set(view, craftNativeLayoutNumber(skewX), craftNativeLayoutNumber(skewY))
     }
 
     private fun skewFactor(value: Any?): Float =