@mrmeg/expo-ui 0.24.0 → 0.25.1

package/dist/components/StatusBar.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect } from "react";
 import { useTheme } from "../hooks/useTheme.js";
-import { StatusBar as RNStatusBar, Platform } from "react-native";
+import { StatusBar as RNStatusBar } from "react-native";
 export const StatusBar = () => {
     const { scheme, theme } = useTheme();
     const barStyle = scheme === "dark" ? "light-content" : "dark-content";
@@ -10,10 +10,6 @@ export const StatusBar = () => {
      */
     useEffect(() => {
         RNStatusBar.setBarStyle(barStyle, true);
-        if (Platform.OS === "android") {
-            RNStatusBar.setBackgroundColor("transparent", true);
-            RNStatusBar.setTranslucent(true);
-        }
     }, [barStyle]);
-    return (_jsx(RNStatusBar, { barStyle: barStyle, backgroundColor: Platform.OS === "android" ? "transparent" : undefined, translucent: true }));
+    return _jsx(RNStatusBar, { barStyle: barStyle });
 };

package/dist/components/StyledText.context.d.ts

@@ -2,5 +2,5 @@ import React from "react";
 import type { StyleProp, TextStyle } from "react-native";
 export declare const TextClassContext: React.Context<string | undefined>;
 export declare const TextColorContext: React.Context<string | undefined>;
-export declare const TextStyleContext: React.Context<StyleProp<TextStyle>>;
+export declare const TextStyleContext: React.Context<StyleProp<TextStyle> | undefined>;
 export declare const TextSelectabilityContext: React.Context<boolean | undefined>;

package/dist/components/StyledText.d.ts

@@ -1,4 +1,4 @@
-import { type Ref } from "react";
+import { type ComponentRef, type Ref } from "react";
 import { Text as RNText, TextProps as RNTextProps } from "react-native";
 import { type FontVariant } from "../constants/fonts";
 /**
@@ -55,8 +55,12 @@ export type TextProps = RNTextProps & {
     txOptions?: object;
     /**
      * Forwarded ref to the underlying RNText element.
+     *
+     * Written as `ComponentRef<typeof RNText>` rather than RN 0.88's `TextInstance`
+     * alias so the emitted declarations stay valid on RN 0.85/0.86, whose typings
+     * do not export that name.
      */
-    ref?: Ref<RNText>;
+    ref?: Ref<ComponentRef<typeof RNText>>;
 };
 /**
  * Base Text component with theme and variant support

package/dist/components/TextInput.d.ts

@@ -1,4 +1,4 @@
-import { type ReactNode, type Ref } from "react";
+import { type ComponentRef, type ReactNode, type Ref } from "react";
 import { TextInput as RNTextInput, ViewStyle, TextStyle, TextInputProps, StyleProp } from "react-native";
 /**
  * Size variants for TextInput
@@ -10,9 +10,13 @@ export type TextInputSize = "sm" | "md" | "lg";
 export type TextInputVariant = "outline" | "filled" | "underlined";
 interface TextInputCustomProps extends TextInputProps {
     /**
-     * Forwarded ref to the underlying RNTextInput element.
+     * RNTextInput ref on web; an RN-compatible imperative handle on native.
+     *
+     * Written as `ComponentRef<typeof RNTextInput>` rather than RN 0.88's
+     * `TextInputInstance` alias so the emitted declarations stay valid on
+     * RN 0.85/0.86, whose typings do not export that name.
      */
-    ref?: Ref<RNTextInput>;
+    ref?: Ref<ComponentRef<typeof RNTextInput>>;
     /**
      * Visual variant
      * @default "outline"

package/dist/components/TextInput.js

@@ -191,11 +191,10 @@ function WebTextInput({ variant = "outline", size = "md", label, helperText, err
  * never round-trips through React state — eliminating the cursor flicker seen on
  * controlled RN inputs.
  *
- * By design (reliability over feature-parity) this path renders the field plus
- * sibling label / helper / error text only. The in-field overlays from the web
- * implementation — password visibility toggle, clear button, left/right
- * elements, and error icon — are intentionally omitted on native to avoid
- * layering RN views over the native host view.
+ * This path supports label / helper / error text and a password visibility
+ * toggle laid out beside the native Host. Clear buttons, left/right elements,
+ * and the error icon remain web-only; RN overlays are not layered over the
+ * native host view.
  */
 function NativeTextInput({ variant = "outline", size = "md", label, helperText, errorText, error, required, rows, forceLight, inputMode, onChangeText, onFocus, onBlur, value, defaultValue, editable = true, multiline, secureTextEntry, showSecureEntryToggle, ref, wrapperStyle, 
 // Web-only affordances. Destructured out of `rest` so they're NOT forwarded to
@@ -231,9 +230,9 @@ leftElement, rightElement, clearable, focusedStyle, style, ...rest }) {
     // parity) once it settles.
     const queuedTogglesRef = useRef(0);
     const toggleRef = useRef(() => { });
-    // Per-flavour mount generation. Bumped whenever a flavour becomes the incoming
-    // view so React always mounts a FRESH native view (whose `autoFocus` will run)
-    // instead of reusing one that is still unmounting from the previous handoff.
+    // iOS-only per-flavour mount generation. Bumped whenever a flavour becomes
+    // the incoming view so React mounts a FRESH native view (whose `autoFocus`
+    // will run) instead of reusing one still unmounting from the previous handoff.
     const generationRef = useRef({ secure: 0, plain: 0 });
     // Last text the JS side knows about; see handleChangeText.
     const lastTextRef = useRef(value ?? defaultValue ?? "");
@@ -256,12 +255,18 @@ leftElement, rightElement, clearable, focusedStyle, style, ...rest }) {
     // RNTextInput because that's what the public TextInputCustomProps declares.
     // We expose the subset consumers use, plus a `setNativeProps` shim so the
     // uncontrolled AuthTextField can push corrected text into the native buffer.
-    // One ref per native view flavour; only the active one (or, mid-handoff on
-    // iOS, both) is mounted.
+    // Android keeps one field/ref as visualTransformation changes in place.
+    // iOS has one ref per flavour; both are mounted only during a handoff.
+    const androidRef = useRef(null);
     const secureRef = useRef(null);
     const plainRef = useRef(null);
-    const activeInput = useCallback(() => (activeSecureRef.current ? secureRef : plainRef).current, []);
+    const activeInput = useCallback(() => {
+        if (Platform.OS === "android")
+            return androidRef.current;
+        return (activeSecureRef.current ? secureRef : plainRef).current;
+    }, []);
     const blurAll = useCallback(() => {
+        androidRef.current?.blur();
         secureRef.current?.blur();
         plainRef.current?.blur();
     }, []);
@@ -282,19 +287,15 @@ leftElement, rightElement, clearable, focusedStyle, style, ...rest }) {
     }, []);
     const parentOnFocus = onFocus;
     const parentOnBlur = onBlur;
-    // Focus/blur from a view that is not the active flavour is ignored: that is
-    // the outgoing view resigning during a handoff, or a stale event from a view
-    // React is unmounting.
+    // On iOS, ignore focus/blur from the outgoing flavour during a handoff or
+    // unmount. Android events always belong to the same mounted field.
     const handleFocus = useCallback((secure) => {
-        if (secure !== activeSecureRef.current)
+        if (Platform.OS === "ios" && secure !== activeSecureRef.current)
             return;
         isFocusedRef.current = true;
-        // Register a blur handle so tap-away dismissal (`keyboardDismiss.ts`) and
-        // the BottomSheet overlay can resign this field: RN's `TextInputState`
-        // never sees SwiftUI / Compose fields, so `Keyboard.dismiss()` cannot.
-        // Blurring through the field's own ref is window-independent — inside a
-        // native bottom sheet `KeyboardController.dismiss()` can miss, the ref
-        // never does.
+        // Register the field's own blur handle for tap-away dismissal and the
+        // BottomSheet overlay. RN supports Expo-hosted field interop; this direct
+        // ref also targets the actual field inside a native sheet's window.
         setKeyboardFocusedInput(focusRegistryToken, blurAll);
         if (handoffRef.current) {
             // The incoming view took first responder; the parent never saw focus leave.
@@ -305,7 +306,7 @@ leftElement, rightElement, clearable, focusedStyle, style, ...rest }) {
         parentOnFocus?.();
     }, [blurAll, finishHandoff, focusRegistryToken, parentOnFocus]);
     const handleBlur = useCallback((secure) => {
-        if (secure !== activeSecureRef.current)
+        if (Platform.OS === "ios" && secure !== activeSecureRef.current)
             return;
         isFocusedRef.current = false;
         restoreAfterSecureHandoffRef.current = false;
@@ -321,10 +322,12 @@ leftElement, rightElement, clearable, focusedStyle, style, ...rest }) {
         }
         restoreAfterSecureHandoffRef.current = false;
         const outgoingSecure = activeSecureRef.current;
-        if (outgoingSecure)
-            generationRef.current.plain += 1;
-        else
-            generationRef.current.secure += 1;
+        if (Platform.OS === "ios") {
+            if (outgoingSecure)
+                generationRef.current.plain += 1;
+            else
+                generationRef.current.secure += 1;
+        }
         if (Platform.OS === "ios" && isFocusedRef.current) {
             const timer = setTimeout(() => {
                 // The incoming view never took first responder. Rather than unmount
@@ -460,7 +463,7 @@ leftElement, rightElement, clearable, focusedStyle, style, ...rest }) {
         fontSize: sizeConfig.fontSize,
         ...(nativeFontFamily ? { fontFamily: nativeFontFamily } : null),
     };
-    return (_jsxs(View, { style: wrapperStyle, children: [!!label && (_jsx(View, { style: styles.labelContainer, children: _jsxs(StyledText, { selectable: false, size: "base", fontWeight: "medium", style: styles.label, children: [label, required && _jsx(StyledText, { selectable: false, fontWeight: "bold", style: styles.required, children: " *" })] }) })), _jsxs(View, { style: [surfaceStyle, hasSecureToggle && styles.nativeRow], hitSlop: { top: surfaceHitSlop, bottom: surfaceHitSlop }, ...surfaceResponderProps, children: [[true, false].map((secure) => {
+    return (_jsxs(View, { style: wrapperStyle, children: [!!label && (_jsx(View, { style: styles.labelContainer, children: _jsxs(StyledText, { selectable: false, size: "base", fontWeight: "medium", style: styles.label, children: [label, required && _jsx(StyledText, { selectable: false, fontWeight: "bold", style: styles.required, children: " *" })] }) })), _jsxs(View, { style: [surfaceStyle, hasSecureToggle && styles.nativeRow], hitSlop: { top: surfaceHitSlop, bottom: surfaceHitSlop }, ...surfaceResponderProps, children: [(Platform.OS === "android" ? [effectiveSecureTextEntry] : [true, false]).map((secure) => {
                         const active = secure === effectiveSecureTextEntry;
                         const outgoing = handoff != null && secure === handoff.outgoingSecure;
                         if (!active && !outgoing)
@@ -472,7 +475,11 @@ leftElement, rightElement, clearable, focusedStyle, style, ...rest }) {
                                 ? hasSecureToggle
                                     ? styles.nativeHostFlex
                                     : styles.nativeHost
-                                : styles.nativeHostHandoff, pointerEvents: inLayout ? "auto" : "none", accessibilityElementsHidden: !inLayout, importantForAccessibility: inLayout ? "auto" : "no-hide-descendants", children: _jsx(ExpoTextInput, { ...rest, autoFocus: rest.autoFocus || (handoff != null && active), ref: secure ? secureRef : plainRef, value: state, defaultValue: defaultValue, onChangeText: handleChangeText, onFocus: () => handleFocus(secure), onBlur: () => handleBlur(secure), editable: editable, multiline: multiline, rows: rows, inputMode: inputMode, secureTextEntry: secure, placeholderTextColor: theme.colors.textDim, style: boxStyle, textStyle: textStyle }) }, secure ? `secure-${generationRef.current.secure}` : `plain-${generationRef.current.plain}`));
+                                : styles.nativeHostHandoff, pointerEvents: inLayout ? "auto" : "none", accessibilityElementsHidden: !inLayout, importantForAccessibility: inLayout ? "auto" : "no-hide-descendants", children: _jsx(ExpoTextInput, { ...rest, autoFocus: rest.autoFocus || (handoff != null && active), ref: Platform.OS === "android" ? androidRef : secure ? secureRef : plainRef, value: state, defaultValue: defaultValue, onChangeText: handleChangeText, onFocus: () => handleFocus(secure), onBlur: () => handleBlur(secure), editable: editable, multiline: multiline, rows: rows, inputMode: inputMode, secureTextEntry: secure, placeholderTextColor: theme.colors.textDim, style: boxStyle, textStyle: textStyle }) }, Platform.OS === "android"
+                            ? "android"
+                            : secure
+                                ? `secure-${generationRef.current.secure}`
+                                : `plain-${generationRef.current.plain}`));
                     }), hasSecureToggle && (_jsx(Pressable, { style: styles.nativePasswordToggle, onPress: togglePasswordVisible, accessibilityLabel: passwordVisible ? "Hide password" : "Show password", accessibilityRole: "button", children: _jsx(Icon, { name: passwordVisible ? "eye-off" : "eye", size: spacing.iconSm + 4, color: "textDim" }) }))] }), !!(helperText || errorText) && (_jsx(StyledText, { selectable: false, size: "sm", style: [styles.helperText, hasError && styles.errorText], children: errorText || helperText }))] }));
 }
 const createStyles = (theme, variant, size) => StyleSheet.create({

package/dist/components/Tooltip.d.ts

@@ -1,19 +1,11 @@
 import * as React from "react";
-import { View, ViewProps } from "react-native";
+import { ViewProps } from "react-native";
 import * as TooltipPrimitive from "@rn-primitives/tooltip";
 /**
  * Tooltip Trigger Component
  * The element that triggers the tooltip to appear on hover (web) or press (native)
  */
-declare const TooltipTrigger: {
-    ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-        asChild?: boolean;
-    } & {
-        onKeyDown?: (ev: React.KeyboardEvent) => void;
-        onKeyUp?: (ev: React.KeyboardEvent) => void;
-    } & React.RefAttributes<import("@rn-primitives/tooltip").TriggerRef>): React.JSX.Element;
-    displayName: string;
-};
+declare const TooltipTrigger: typeof TooltipPrimitive.Trigger;
 /**
  * Tooltip variant styles
  */
@@ -100,22 +92,16 @@ interface TooltipProps extends TooltipPrimitive.RootProps {
  * ```
  */
 declare function Tooltip({ delayDuration, skipDelayDuration, ...props }: TooltipProps): React.JSX.Element;
-/**
- * Tooltip Component with Sub-components
- * Properly typed interface for dot notation access (e.g., Tooltip.Trigger)
- */
-declare const TooltipComponent: typeof Tooltip & {
-    Trigger: {
-        ({ asChild, onPress: onPressProp, disabled, ref, ...props }: Omit<import("react-native").PressableProps & React.RefAttributes<View>, "ref"> & {
-            asChild?: boolean;
-        } & {
-            onKeyDown?: (ev: React.KeyboardEvent) => void;
-            onKeyUp?: (ev: React.KeyboardEvent) => void;
-        } & React.RefAttributes<import("@rn-primitives/tooltip").TriggerRef>): React.JSX.Element;
-        displayName: string;
-    };
+type TooltipCompound = typeof Tooltip & {
+    Trigger: typeof TooltipTrigger;
     Content: typeof TooltipContent;
     Body: typeof TooltipBody;
 };
+/**
+ * Tooltip Component with Sub-components
+ * Properly typed interface for dot notation access (e.g., Tooltip.Trigger).
+ * The annotation is what keeps declaration emit portable — see Dialog.tsx (TS2883).
+ */
+declare const TooltipComponent: TooltipCompound;
 export { TooltipComponent as Tooltip, TooltipTrigger, TooltipContent, TooltipBody, };
 export type { TooltipContentProps, TooltipBodyProps, TooltipProps, };

package/dist/components/Tooltip.js

@@ -12,6 +12,8 @@ import { palette } from "../constants/colors.js";
  * Tooltip Trigger Component
  * The element that triggers the tooltip to appear on hover (web) or press (native)
  */
+// Annotated with `typeof` for portable declaration emit — see the note in
+// Dialog.tsx (TS2883). Without it the .d.ts inlines RN 0.88's `PressableInstance`.
 const TooltipTrigger = TooltipPrimitive.Trigger;
 /**
  * FullWindowOverlay wrapper - uses native overlay on iOS for proper z-index handling
@@ -68,7 +70,7 @@ function TooltipContent({ side = "top", align = "center", sideOffset = 4, portal
             maxWidth: 250,
             ...getShadowStyle("soft"),
         },
-    ]);
+    ]) ?? undefined;
     return (_jsx(TooltipPrimitive.Portal, { hostName: portalHost, children: _jsx(FullWindowOverlay, { children: _jsx(TooltipPrimitive.Overlay, { style: Platform.select({ native: StyleSheet.absoluteFill }), children: _jsx(AnimatedView, { type: "fade", enterDuration: 150, children: _jsx(TextColorContext.Provider, { value: colors.text, children: _jsx(TextClassContext.Provider, { value: "", children: _jsx(TextSelectabilityContext.Provider, { value: false, children: _jsx(TooltipPrimitive.Content, { side: side, align: align, sideOffset: sideOffset, style: contentStyle, ...props }) }) }) }) }) }) }) }));
 }
 function TooltipBody({ children, style, ...props }) {
@@ -122,7 +124,8 @@ function Tooltip({ delayDuration = 700, skipDelayDuration = 300, ...props }) {
 }
 /**
  * Tooltip Component with Sub-components
- * Properly typed interface for dot notation access (e.g., Tooltip.Trigger)
+ * Properly typed interface for dot notation access (e.g., Tooltip.Trigger).
+ * The annotation is what keeps declaration emit portable — see Dialog.tsx (TS2883).
  */
 const TooltipComponent = Object.assign(Tooltip, {
     Trigger: TooltipTrigger,

package/dist/components/keyboardController.d.ts

@@ -19,7 +19,6 @@
  * function that has no hook calls of its own).
  */
 import React from "react";
-import { View } from "react-native";
 import type { IKeyboardState, KeyboardAnimationContext, KeyboardAvoidingViewProps, KeyboardControllerModule } from "react-native-keyboard-controller";
 /** No-op imperative module: there is no IME to dismiss or preload on web. */
 export declare const KeyboardController: KeyboardControllerModule;
@@ -41,6 +40,9 @@ type NativeKeyboardAvoidingViewProps = KeyboardAvoidingViewProps & {
  * Plain `View` passthrough. Keyboard-avoidance props are accepted (so callers
  * stay identical across platforms) and dropped, since the browser handles
  * viewport resizing itself.
+ *
+ * The explicit return type keeps declaration emit from inlining `View`'s ref
+ * type (RN 0.88's `ViewInstance`), which older RN typings do not export.
  */
-export declare function NativeKeyboardAvoidingView({ behavior, contentContainerStyle, keyboardVerticalOffset, automaticOffset, enabled, children, ...viewProps }: NativeKeyboardAvoidingViewProps): React.CElement<import("react-native").ViewProps, View>;
+export declare function NativeKeyboardAvoidingView({ behavior, contentContainerStyle, keyboardVerticalOffset, automaticOffset, enabled, children, ...viewProps }: NativeKeyboardAvoidingViewProps): React.ReactElement;
 export {};

package/dist/components/keyboardController.js

@@ -53,6 +53,7 @@ export const KeyboardController = {
     setDefaultMode: () => undefined,
     setInputMode: () => undefined,
     preload: () => undefined,
+    setTranslucent: () => undefined,
     dismiss: () => Promise.resolve(),
     setFocusTo: () => undefined,
     isVisible: () => false,
@@ -77,6 +78,9 @@ export function useKeyboardContext() {
  * Plain `View` passthrough. Keyboard-avoidance props are accepted (so callers
  * stay identical across platforms) and dropped, since the browser handles
  * viewport resizing itself.
+ *
+ * The explicit return type keeps declaration emit from inlining `View`'s ref
+ * type (RN 0.88's `ViewInstance`), which older RN typings do not export.
  */
 export function NativeKeyboardAvoidingView({ behavior, contentContainerStyle, keyboardVerticalOffset, automaticOffset, enabled, children, ...viewProps }) {
     // Dropped rather than forwarded so they never reach the DOM node.

package/dist/components/keyboardDismiss.js

@@ -1,34 +1,38 @@
 /**
  * Tap-away keyboard dismissal that never steals a touch.
  *
- * React Native's own `keyboardShouldPersistTaps="handled"` is the model: let the
- * deepest interactive view win the responder negotiation, and blur on *release*
- * only when nothing else took the tap and the finger did not scroll. RN cannot
- * apply that to the native `@expo/ui` field (it is invisible to
- * `TextInputState`), so this module re-creates the same decision with two
- * signals that need no rectangles and no responder ownership:
+ * Let the deepest interactive view win the responder negotiation, and blur on
+ * release only for an unclaimed, single-finger tap within the travel slop.
+ * Hosted `@expo/ui` inputs register with RN's `TextInputState`. A ScrollView
+ * using `keyboardShouldPersistTaps="handled"` can therefore claim dead space
+ * and blur on release if it observed no scroll, even after substantial travel.
+ * `DismissKeyboard`'s ScrollView uses `always` so this boundary owns tap dismissal
+ * with an explicit travel policy, independent of whether content can scroll.
+ * Two signals need no rectangles and no responder ownership:
  *
  *  1. `onStartShouldSetResponder` in the *bubble* phase is only ever called on a
- *     view when no descendant claimed the touch. Pressables, RN TextInputs and
- *     scroll views all claim, so being asked at all means "this tap is on dead
- *     space or on a native view that does not participate".
+ *     view when no descendant claimed the touch. Pressables and RN TextInputs
+ *     claim, as can scroll views depending on their tap policy. Being asked
+ *     means no descendant took responder ownership, not necessarily dead space.
  *  2. The package `TextInput` tags touches that begin on its surface
  *     (`markTextInputTouchStart`). Its bubble handler runs before any enclosing
  *     boundary's, so the boundary can tell a tap on *any* native field — focused
  *     or not — from dead space, and leave focus handoff, double-tap selection
  *     and the eye toggle to the platform.
  *
- * The boundary always answers `false`, so no JS responder is ever set: native
- * controls (SwiftUI/Compose fields, sliders) keep receiving every touch phase
+ * The boundary always answers `false`, so it never becomes the JS responder.
+ * Native controls (SwiftUI/Compose fields, sliders) keep receiving every touch phase
  * on both platforms, and scroll views take over drags exactly as before.
  * Dismissal happens in `onTouchEnd`, a plain bubbling event that fires whether
- * or not anyone became the responder; a drag past the slop or a cancel drops it.
+ * or not anyone became the responder. Moves cancel permanently once past the
+ * slop; release coordinates also enforce it when move delivery was missed.
+ * Cancellation and multitouch drop the tap without rearming another finger.
  */
 import { useMemo, useRef } from "react";
 import { Platform } from "react-native";
 import { KeyboardController, useKeyboardState } from "./keyboardController";
 import { dismissKeyboardFocusedInput, hasKeyboardFocusedInput } from "./keyboardFocusRegistry.js";
-/** Finger travel (pt) after which a touch counts as a scroll, not a tap. */
+/** Maximum displacement per axis (RN logical units) for a tap, scrollable or not. */
 const MOVE_SLOP = 10;
 function keyOf(event) {
     const { identifier, timestamp } = event.nativeEvent;
@@ -42,6 +46,10 @@ function isSameEvent(key, event) {
 }
 let textInputTouch = null;
 let claimedTouch = null;
+// An ancestor can observe a second finger outside an inner boundary/surface.
+// Invalidate already-armed taps there too, even if that finger lifts first and
+// the inner view only receives its original finger's final touches=[] event.
+let multiTouchVersion = 0;
 /**
  * `onStartShouldSetResponder` for a native text-field surface: decline the
  * responder (the native field keeps every touch phase) but tag the touch so an
@@ -72,6 +80,77 @@ function movedPastSlop(tap, event) {
     return (Math.abs(event.nativeEvent.pageX - tap.pageX) > MOVE_SLOP ||
         Math.abs(event.nativeEvent.pageY - tap.pageY) > MOVE_SLOP);
 }
+/** Shared single-finger travel policy for tap-away dismissal and surface focus. */
+function createTapTracker() {
+    let pending = null;
+    let armedVersion = multiTouchVersion;
+    let lastStart = null;
+    const active = new Set();
+    function readTouches(event) {
+        const { touches } = event.nativeEvent;
+        if (touches == null)
+            return false;
+        active.clear();
+        touches.forEach(({ identifier }) => active.add(identifier));
+        return true;
+    }
+    return {
+        start(event) {
+            // Negotiation precedes the plain bubbling touch-start for the same event.
+            // Observe it once; a child-claimed start reaches only onTouchStart, which
+            // clears any stale pending tap but never arms one.
+            if (isSameEvent(lastStart, event))
+                return false;
+            lastStart = keyOf(event);
+            pending = null;
+            // RN's array is authoritative, including after a missed end. The set is
+            // also a fallback for callers/tests omitting arrays, retaining other down
+            // fingers even after movement has cancelled the pending tap.
+            if (!readTouches(event))
+                active.add(event.nativeEvent.identifier);
+            if (active.size > 1 || (event.nativeEvent.changedTouches?.length ?? 1) > 1) {
+                multiTouchVersion += 1;
+                return false;
+            }
+            return active.size === 1;
+        },
+        arm(event) {
+            pending = { ...keyOf(event), pageX: event.nativeEvent.pageX, pageY: event.nativeEvent.pageY };
+            armedVersion = multiTouchVersion;
+        },
+        move(event) {
+            readTouches(event);
+            if (active.size > 1 || (event.nativeEvent.changedTouches?.length ?? 1) > 1) {
+                multiTouchVersion += 1;
+                pending = null;
+            }
+            else if (isSameTouch(pending, event) && movedPastSlop(pending, event)) {
+                pending = null;
+            }
+        },
+        end(event) {
+            const tap = pending;
+            pending = null;
+            // On touch end, touches contains the REMAINING fingers (empty on the last
+            // release); changedTouches contains those that ended. Never treat the
+            // final empty array as an invalid single-finger tap.
+            if (!readTouches(event)) {
+                active.delete(event.nativeEvent.identifier);
+                event.nativeEvent.changedTouches?.forEach(({ identifier }) => active.delete(identifier));
+            }
+            if (active.size === 0)
+                lastStart = null;
+            if (active.size > 0 || (event.nativeEvent.changedTouches?.length ?? 1) > 1) {
+                multiTouchVersion += 1;
+            }
+            return (armedVersion === multiTouchVersion &&
+                active.size === 0 &&
+                (event.nativeEvent.changedTouches?.length ?? 1) <= 1 &&
+                isSameTouch(tap, event) &&
+                !movedPastSlop(tap, event));
+        },
+    };
+}
 /**
  * View props for the painted surface around a native (`@expo/ui`) text field.
  *
@@ -87,31 +166,30 @@ function movedPastSlop(tap, event) {
 export function useTextInputSurfaceResponder(focus) {
     const focusRef = useRef(focus);
     focusRef.current = focus;
-    const tap = useRef(null);
-    return useMemo(() => ({
-        onStartShouldSetResponder: (event) => {
-            markTextInputTouchStart(event);
-            tap.current = { ...keyOf(event), pageX: event.nativeEvent.pageX, pageY: event.nativeEvent.pageY };
-            return false;
-        },
-        onTouchStart: (event) => {
-            if (tap.current && !isSameEvent(tap.current, event))
-                tap.current = null;
-        },
-        onTouchMove: (event) => {
-            if (isSameTouch(tap.current, event) && movedPastSlop(tap.current, event))
-                tap.current = null;
-        },
-        onTouchEnd: (event) => {
-            if (!isSameTouch(tap.current, event))
-                return;
-            tap.current = null;
-            focusRef.current();
-        },
-        onTouchCancel: () => {
-            tap.current = null;
-        },
-    }), []);
+    return useMemo(() => {
+        const tap = createTapTracker();
+        return {
+            onStartShouldSetResponder: (event) => {
+                markTextInputTouchStart(event);
+                if (tap.start(event))
+                    tap.arm(event);
+                return false;
+            },
+            onTouchStart: (event) => {
+                tap.start(event);
+            },
+            onTouchMove: (event) => {
+                tap.move(event);
+            },
+            onTouchEnd: (event) => {
+                if (tap.end(event))
+                    focusRef.current();
+            },
+            onTouchCancel: (event) => {
+                tap.end(event);
+            },
+        };
+    }, []);
 }
 /**
  * View props for a tap-away keyboard-dismiss boundary. Spread onto the wrapper
@@ -123,13 +201,14 @@ export function useKeyboardDismissResponder() {
     const isVisible = useKeyboardState((state) => state.isVisible);
     const isVisibleRef = useRef(isVisible);
     isVisibleRef.current = isVisible;
-    const pending = useRef(null);
     return useMemo(() => {
         if (Platform.OS === "web")
             return {};
+        const tap = createTapTracker();
         return {
             onStartShouldSetResponder: (event) => {
-                pending.current = null;
+                if (!tap.start(event))
+                    return false;
                 // `hasKeyboardFocusedInput` covers the window where a field has focus but
                 // keyboard-controller has not reported the keyboard yet (or a hardware
                 // keyboard is attached and there is no software keyboard to observe).
@@ -141,29 +220,21 @@ export function useKeyboardDismissResponder() {
                 if (isSameEvent(claimedTouch, event))
                     return false;
                 claimedTouch = keyOf(event);
-                pending.current = { ...claimedTouch, pageX: event.nativeEvent.pageX, pageY: event.nativeEvent.pageY };
+                tap.arm(event);
                 return false;
             },
             onTouchStart: (event) => {
-                // Bubbling touch events run after the negotiation for the same native
-                // event, so a fresh pending tap matches here; anything else is stale
-                // (e.g. a touch whose end never reached this view).
-                if (pending.current && !isSameEvent(pending.current, event))
-                    pending.current = null;
+                tap.start(event);
             },
             onTouchMove: (event) => {
-                if (isSameTouch(pending.current, event) && movedPastSlop(pending.current, event)) {
-                    pending.current = null;
-                }
+                tap.move(event);
             },
             onTouchEnd: (event) => {
-                if (!isSameTouch(pending.current, event))
-                    return;
-                pending.current = null;
-                dismissKeyboard();
+                if (tap.end(event))
+                    dismissKeyboard();
             },
-            onTouchCancel: () => {
-                pending.current = null;
+            onTouchCancel: (event) => {
+                tap.end(event);
             },
         };
     }, []);

package/dist/components/keyboardFocusRegistry.d.ts

@@ -1,10 +1,12 @@
 /**
  * Registry of the currently focused native (`@expo/ui`) text field.
  *
- * React Native's `TextInputState` never learns about SwiftUI / Compose fields,
- * so `Keyboard.dismiss()` cannot blur them. The package `TextInput` registers a
- * blur handle here on focus; tap-away dismissal (`keyboardDismiss.ts`) and the
- * `BottomSheet` overlay resign the field through it.
+ * Hosted `@expo/ui` inputs also register with React Native's `TextInputState`.
+ * This package registry supplies a window-independent native blur handle and
+ * focus presence even when keyboard-controller cannot observe the keyboard
+ * (for example, in an isolated native sheet window). The package `TextInput`
+ * registers on focus; tap-away dismissal (`keyboardDismiss.ts`) and the
+ * `BottomSheet` overlay resign the field through that handle.
  */
 export type KeyboardFocusedInputToken = object;
 /**

package/dist/constants/spacing.d.ts

@@ -36,7 +36,7 @@ export declare const spacing: {
     readonly radiusNone: 0;
     readonly radiusXs: 4;
     readonly radiusSm: 8;
-    readonly radiusMd: 12;
+    readonly radiusMd: 10;
     readonly radiusLg: 14;
     readonly radiusXl: 18;
     readonly radius2xl: 24;
@@ -47,5 +47,5 @@ export declare const spacing: {
     readonly iconLg: 32;
     readonly iconXl: 48;
 };
-export declare const base: 8, xxs: 2, xs: 4, sm: 8, smd: 12, md: 16, mdl: 20, lg: 24, xl: 32, xxl: 48, xxxl: 64, gutter: 16, gutterVertical: 24, screenPadding: 16, sectionSpacing: 24, rowPaddingY: 10, rowPaddingX: 16, rowGap: 12, rowMinHeight: 40, formRowMinHeight: 32, cardPadding: 16, dialogPadding: 20, touchTarget: 44, buttonPadding: 10, inputPadding: 10, listItemSpacing: 8, radiusNone: 0, radiusXs: 4, radiusSm: 8, radiusMd: 12, radiusLg: 14, radiusXl: 18, radius2xl: 24, radiusFull: 9999, iconXs: 12, iconSm: 16, iconMd: 24, iconLg: 32, iconXl: 48;
+export declare const base: 8, xxs: 2, xs: 4, sm: 8, smd: 12, md: 16, mdl: 20, lg: 24, xl: 32, xxl: 48, xxxl: 64, gutter: 16, gutterVertical: 24, screenPadding: 16, sectionSpacing: 24, rowPaddingY: 10, rowPaddingX: 16, rowGap: 12, rowMinHeight: 40, formRowMinHeight: 32, cardPadding: 16, dialogPadding: 20, touchTarget: 44, buttonPadding: 10, inputPadding: 10, listItemSpacing: 8, radiusNone: 0, radiusXs: 4, radiusSm: 8, radiusMd: 10, radiusLg: 14, radiusXl: 18, radius2xl: 24, radiusFull: 9999, iconXs: 12, iconSm: 16, iconMd: 24, iconLg: 32, iconXl: 48;
 export declare const space: (multiplier: number) => number;

package/dist/constants/spacing.js

@@ -38,11 +38,11 @@ export const spacing = {
     buttonPadding: 10, // Default button padding
     inputPadding: 10, // Default input padding
     listItemSpacing: 8, // Space between list items
-    // Border radius — shadcn-inspired scale (radiusMd = 12px default)
+    // Border radius — shadcn-inspired scale (radiusMd = 10px default)
     radiusNone: 0,
     radiusXs: 4,
     radiusSm: 8,
-    radiusMd: 12,
+    radiusMd: 10,
     radiusLg: 14,
     radiusXl: 18,
     radius2xl: 24,