@symbiote-native/components 3.0.1 → 3.1.1

package/README.md

@@ -20,17 +20,19 @@ supplies only the third:
 
 1. **Logic — `src/state/*.ts`.** A pure reducer `(state, action) => state`, a
    `createInitial*State` factory, and pure predicates. Zero framework, zero render —
-   `switchReducer` / `shouldSnapBack` / `valueFromChange` for `Switch`, `modalReducer` for `Modal`,
-   the `virtualized-list` windowing math for the list family.
+   `modalReducer` for `Modal`, `shouldSnapBack` / `valueFromChange` for `Pressable`'s press
+   machine, the `virtualized-list` windowing math for the list family.
 2. **View — `src/view/render-*.ts`.** A pure function `render*(viewState, platform) => Descriptor`.
    State and visuals enter **only through arguments**; out comes a tree of `Descriptor` nodes
    (`{ type, props, children, key }`, built with `el()` / `txt()`) over the intrinsic primitives
-   (`symbiote-view`, `symbiote-switch`, …). No framework, no state, no events.
+   (`symbiote-view`, `symbiote-scroll-view`, …). No framework, no state, no events.
 3. **Lifecycle — the adapter.** React wires the reducer through `useReducer`/`useLayoutEffect` and
    bridges the `Descriptor` to `React.createElement`; Vue wires it through `ref`/`watch` and
    bridges to `h()`. This is the ONLY part a new adapter has to write.
 
-`Switch` is the canonical reference for a full three-layer component.
+`Modal` is the canonical reference for a full three-layer component. `Switch` used to be — its
+`render*` function is gone now that the painting moved to the `switch` tag's own host behavior
+(see "Host behaviors" below), so only its reducer and prop type still live at this layer.
 
 ### Install
 
@@ -45,28 +47,25 @@ npm install @symbiote-native/components
 ## Usage
 
 Nearly every consumer reaches this package **through an adapter**, not directly — an app imports
-`Switch` from `@symbiote-native/react` (or `@symbiote-native/vue`), and that adapter re-exports the prop
+`Modal` from `@symbiote-native/react` (or `@symbiote-native/vue`), and that adapter re-exports the prop
 types and wires the reducer/render pair from here. Calling the render function directly is what an
 adapter itself does, to build its lifecycle wrapper:
 
 ```ts
 import {
-  renderSwitch,
-  createInitialSwitchState,
-  switchReducer,
+  renderModal,
+  createInitialModalState,
+  modalReducer,
 } from '@symbiote-native/components';
 
 // inside an adapter's own hook/composable:
-const state = createInitialSwitchState();
-const next = switchReducer(state, { type: 'native-reported', value: true });
-const descriptor = renderSwitch(
-  { value: true, disabled: false, passthrough: { onChange, ref } },
-  {
-    trackColorProps: (value, trackColor) => ({
-      /* platform-specific prop names */
-    }),
-  },
-);
+const state = createInitialModalState(visible);
+const next = modalReducer(state, { type: visible ? 'show' : 'hide' });
+const descriptor = renderModal({
+  visible,
+  transparent: false,
+  passthrough: { onDismiss, onRequestClose, ref },
+});
 // descriptor is then handed to the adapter's own descriptorToReact / descriptorToVue bridge
 ```
 

package/build/behaviors/button.js

@@ -14,7 +14,7 @@
 //   iOS      button   RCTView      TouchableOpacity's Animated.View — the responder + the fade
 //            └ view   RCTView      no style at all, and no fold
 //              └ text RCTText      `button-label-text` — foldButtonLabelStyle + RN's Text defaults
-//                └ raw RCTRawText  `button-label`    — foldButtonLabel            FOUR nodes
+//                └ raw RCTRawText  `button-label`    — uppercaseTitle (Android)   FOUR nodes
 //
 //   Android  button   RCTView      the styled button view, CLONED onto: the responder, the ripple
 //            │                     background, the whole a11y fold. No fade, no wrapper.
@@ -111,7 +111,7 @@
 // since 2026-09-09, in the same commit that deleted the five wrappers, which is what makes it safe:
 // while a wrapper still built its own view and text under this tag, registering would have given
 // every Button a second copy of the subtree.
-import { addDerivedNode, appendChild, createElement, createRawText, markPropsDirty, Platform, registerHostBehavior, requestCommitFor, setProp, } from '@symbiote-native/engine';
+import { addDerivedNode, appendChild, createElement, createRawText, markPropsDirty, Platform, registerHostBehavior, requestCommitFor, } from '@symbiote-native/engine';
 import { descriptorFor } from '../component-names';
 import { resolveButtonDisabled } from '../view/render-button.js';
 import { booleanOr, createPressBehavior, } from './pressable.js';
@@ -192,15 +192,8 @@ const buttonDisabled = props => projectionOf(props).disabled;
 // was the thing this fold was waiting for: `ownerProps` answers "my parent" and this node's parent
 // is the wrapping view, which knows none of it.
 export const BUTTON_LABEL_TEXT_TAG = 'button-label-text';
-// The label's own tag. A raw text carrying one looks odd and is not: it has no props an app can
-// write, but its CONTENT is the platform's decision here — RN renders a button's title uppercased on
-// Android and verbatim elsewhere (`Button.js:352-353`), which is a user-agent choice about a control
-// rather than anything the app asked for.
-//
-// That is what the fold here used to do, and it is `foldButtonLabel` in `SymbioteFabricProps.cpp`
-// now, reached off this tag. `button-payload.itest.ts` recorded "a raw text carries no tag at all,
-// so there is nothing for a tag-keyed rule to key on" — true of `createRawText`'s old signature, not
-// of raw texts, and it takes a tag now for exactly this.
+// The label's own tag, on the raw text that holds the title. Its Android uppercase (`Button.js:352`)
+// is `uppercaseTitle` below, in JS: the C++ tag rule it briefly was could only do ASCII.
 export const BUTTON_LABEL_TAG = 'button-label';
 // ---- the Android touchable -------------------------------------------------------------------
 // Button.js:281-284. Not two variants of one component: see the tree diagram at the top for what
@@ -313,6 +306,14 @@ function onOwnedListenerChange(node, name) {
     markPropsDirty(node);
     requestCommitFor(node);
 }
+// Button.js:352-353 — Android renders `title.toUpperCase()`. Here in JS rather than in the C++ tag
+// rules because only JavaScript's uppercase is full Unicode (Cyrillic, `ß` -> `SS`); the host has
+// no ICU, and an ASCII port left every non-Latin title in its authored case.
+function uppercaseTitle(slotKey, value) {
+    return slotKey === 'text' && typeof value === 'string'
+        ? value.toUpperCase()
+        : value;
+}
 // Idempotent: an adapter entry may be imported more than once in a bundle.
 export function registerButtonBehavior() {
     // `attach`/`detach` come from the touchable unwrapped: the internal nodes are ordinary children
@@ -325,6 +326,7 @@ export function registerButtonBehavior() {
         onOwnedListenerChange,
         slotProps: SLOT_PROPS,
         slotDerived: SLOT_DERIVED,
+        ...(IS_ANDROID ? { slotValueFor: uppercaseTitle } : {}),
     };
     // The two DERIVED nodes' tags, registered with no runtime at all. A tag reaches C++ only through
     // `recordSetTag`, which `attachHostBehavior` emits, so a tag nobody registered carries an empty

package/build/behaviors/input-accessory-view.js

@@ -31,8 +31,8 @@
 // tagged node rather than per primitive.
 //
 // PLATFORM. This is the only primitive in its group that is not platform-invariant in what it
-// COMMITS TO: `input-accessory-view` resolves to `RCTInputAccessoryView` on iOS and to a
-// plain `RCTView` on Android. The fold itself is platform-invariant on purpose.
+// COMMITS TO: `input-accessory-view` resolves to `RCTInputAccessoryView` on iOS and to the void
+// component on Android. The fold itself is platform-invariant on purpose.
 //
 // FIXED (2026-09-20). `InputAccessoryView.js` on Android does `console.warn('<InputAccessoryView>
 // is only supported on iOS.'); return null` — the WHOLE component, children included, renders
@@ -49,12 +49,14 @@
 // contributing neither itself nor its children. Wired purely through
 // `core/components/src/component-names/index.android.ts`'s per-platform table, the same seam
 // `ANCHOR_COMPONENT` already used — this behavior file needed no change at all.
-import { registerHostBehavior, } from '@symbiote-native/engine';
+import { Platform, registerHostBehavior, } from '@symbiote-native/engine';
 export const INPUT_ACCESSORY_VIEW_TAG = 'input-accessory-view';
-// Required by IHostBehavior and deliberately empty: this primitive owns no per-node runtime.
-// Written out rather than shared with a `noop` so the emptiness reads as a decision.
+// `InputAccessoryView.js:110-113` — off iOS it warns and renders nothing (the void component).
+// RN warns per render; once per node is the nearest beat a tag has.
 function attach(_node) {
-    // nothing to set up
+    if (Platform.OS !== 'ios') {
+        console.warn('<InputAccessoryView> is only supported on iOS.');
+    }
 }
 function detach(_node) {
     // nothing to release

package/build/behaviors/pressable.d.ts

@@ -26,9 +26,17 @@ export type IPressConfigRefinement = (node: ISymbioteNode, config: IPressMachine
  * would answer the NEXT resolution as if the app had written it and the tag could never re-enable.
  */
 export type IDisabledResolver = (props: Readonly<Record<string, unknown>>) => boolean | undefined;
+export type ICancelableResolver = (source: ISymbioteNode) => boolean | undefined;
 export declare function booleanOr(value: unknown): boolean | undefined;
 export declare function asAccessibilityState(value: unknown): IAccessibilityStateValue | undefined;
 export declare function accessibleUnlessOptedOut(props: Readonly<Record<string, unknown>>): boolean;
+/**
+ * The Android ripple's three view commands around the app's callbacks (TNF :230-252,
+ * useAndroidRippleForView.js:77-104). The JS responder takes the touch before Android's own
+ * pressed handling, so without them the ripple never animates. Hotspot first: it starts under
+ * the finger.
+ */
+export declare function withNativeFeedbackCommands(node: ISymbioteNode, config: IPressMachineConfig): IPressMachineConfig;
 /**
  * The machine on `node`, reading its props and the app's callbacks off `options.source` when that
  * is a different node.
@@ -43,6 +51,7 @@ export declare function accessibleUnlessOptedOut(props: Readonly<Record<string,
 export declare function attachPressMachine(node: ISymbioteNode, options?: {
     readonly refine?: IPressConfigRefinement;
     readonly disabledOf?: IDisabledResolver;
+    readonly cancelableOf?: ICancelableResolver;
     readonly source?: ISymbioteNode;
 }): void;
 /** See `attachPressMachine`: the same teardown `createPressBehavior` registers as its `detach`. */

package/build/behaviors/pressable.js

@@ -14,7 +14,7 @@
 // `registerPressableBehavior()`, and its entry does a bare `import './register';` that the barrel
 // does NOT re-export. A bare `import './register';` sitting NEXT TO such a re-export does not work
 // either: Babel merges the two imports of one specifier and the merged dependency stays lazy.
-import { appListenerFor, dlog, propOf, registerHostBehavior, requestCommitFor, setBehaviorListener, setNodePressed, propsOf, } from '@symbiote-native/engine';
+import { appListenerFor, dispatchViewCommand, dlog, Platform, propOf, registerHostBehavior, requestCommitFor, setBehaviorListener, setNodePressed, propsOf, } from '@symbiote-native/engine';
 import { createPressHandlers, createPressRuntime, disposePressRuntime, DEFAULT_DELAY_LONG_PRESS_MS, DEFAULT_MIN_PRESS_DURATION_MS, } from '../state/pressable.js';
 import { buildPressableListeners } from '../view/render-pressable/index.js';
 export const PRESSABLE_TAG = 'pressable';
@@ -148,6 +148,52 @@ function configFor(node) {
             booleanOr(propOf(node, 'touchSoundDisabled')),
     };
 }
+// Read once: the platform cannot change under a running app.
+const IS_ANDROID = Platform.OS === 'android';
+// useAndroidRippleForView.js:57 — a ripple exists only when color, borderless or radius is set.
+function hasAndroidRipple(config) {
+    if (typeof config !== 'object' || config === null)
+        return false;
+    return (Reflect.get(config, 'color') != null ||
+        Reflect.get(config, 'borderless') != null ||
+        Reflect.get(config, 'radius') != null);
+}
+// `locationX ?? 0` (TouchableNativeFeedback.js:280, useAndroidRippleForView.js:83). The bag is raw
+// Fabric payload, so guard.
+function hotspotAt(nativeEvent, key) {
+    const value = nativeEvent[key];
+    return typeof value === 'number' ? value : 0;
+}
+/**
+ * The Android ripple's three view commands around the app's callbacks (TNF :230-252,
+ * useAndroidRippleForView.js:77-104). The JS responder takes the touch before Android's own
+ * pressed handling, so without them the ripple never animates. Hotspot first: it starts under
+ * the finger.
+ */
+export function withNativeFeedbackCommands(node, config) {
+    const hotspot = (event) => {
+        dispatchViewCommand(node, 'hotspotUpdate', [
+            hotspotAt(event.nativeEvent, 'locationX'),
+            hotspotAt(event.nativeEvent, 'locationY'),
+        ]);
+    };
+    return {
+        ...config,
+        onPressIn(event) {
+            hotspot(event);
+            dispatchViewCommand(node, 'setPressed', [true]);
+            config.onPressIn?.(event);
+        },
+        onPressMove(event) {
+            hotspot(event);
+            config.onPressMove?.(event);
+        },
+        onPressOut(event) {
+            dispatchViewCommand(node, 'setPressed', [false]);
+            config.onPressOut?.(event);
+        },
+    };
+}
 // Rebuilding at GESTURE START is the whole reason for the dispatcher indirection, and skipping it
 // is a bug that looks like working code. `attach` runs inside `createElement`, before a single
 // prop has been routed — the node holds nothing at all there — so a machine built at attach would
@@ -160,7 +206,10 @@ function rebuild(node, state) {
     // (dispatching a view command needs the committed node, not the one holding the props).
     const source = state.source;
     const base = configFor(source);
-    const handlers = createPressHandlers(state.refine === undefined ? base : state.refine(node, base), state.runtime, state.host);
+    const refined = state.refine === undefined ? base : state.refine(node, base);
+    const handlers = createPressHandlers(IS_ANDROID && hasAndroidRipple(propOf(source, 'android_ripple'))
+        ? withNativeFeedbackCommands(node, refined)
+        : refined, state.runtime, state.host);
     state.isBuilt = true;
     // Re-read every gesture, so a tag whose resolver looks past `disabled` — `./button`, at
     // `aria-disabled` — re-enables on the next touch instead of latching at its first answer.
@@ -170,7 +219,7 @@ function rebuild(node, state) {
         : state.disabledOf(sourceProps);
     state.listeners = buildPressableListeners(handlers, {
         disabled: disabled === true ? true : undefined,
-        cancelable: resolveCancelable(source),
+        cancelable: (state.cancelableOf ?? resolveCancelable)(source),
         blockNativeResponder: propOf(source, 'blockNativeResponder') === true,
     });
 }
@@ -311,6 +360,7 @@ function attach(node, options) {
         host,
         refine: options.refine,
         disabledOf: options.disabledOf,
+        cancelableOf: options.cancelableOf,
         source: options.source ?? node,
         timers,
         listeners: {},

package/build/behaviors/scroll-view/index.android.js

@@ -33,7 +33,9 @@
 import { registerScrollViewBehaviors } from './shared.js';
 const android = {
     claimMode: 'wrap',
-    slotDerived: ['style'],
+    // `stickyHeaderIndices`: the content view's clipping is forced off under sticky headers on
+    // Android only (`ScrollView.js:1740-1745`), so only here does it dirty the slot.
+    slotDerived: ['style', 'stickyHeaderIndices'],
 };
 export function registerScrollViewBehavior() {
     registerScrollViewBehaviors(android);

package/build/behaviors/scroll-view/responder.js

@@ -5,7 +5,7 @@
 // Ported line-for-line from `ScrollView.js:1263-1546` — the negotiation engine itself and the
 // `IResponderProps` prop surface already exist and needed no change; this file is ScrollView opting
 // into the same mechanism Pressable already uses (`../pressable.ts:329-384`).
-import { appListenerFor, currentlyFocusedInput, blurTextInput, isRecord, isSymbioteNode, Keyboard, propOf, setBehaviorListener, } from '@symbiote-native/engine';
+import { appListenerFor, currentlyFocusedInput, blurTextInput, dlog, isDebug, isRecord, isSymbioteNode, Keyboard, Platform, propOf, setBehaviorListener, } from '@symbiote-native/engine';
 import { descriptorFor } from '../../component-names';
 import { TEXT_INPUT_MULTILINE_TAG, TEXT_INPUT_TAG } from '../text-input.js';
 // RN's `IS_ANIMATING_TOUCH_START_THRESHOLD_MS` (ScrollView.js:695) — a momentum end inside this
@@ -45,14 +45,20 @@ function isTextInputNode(node) {
     return (node.component === descriptorFor(TEXT_INPUT_TAG).component ||
         node.component === descriptorFor(TEXT_INPUT_MULTILINE_TAG).component);
 }
-// RN's `_keyboardIsDismissible()` (ScrollView.js:1527-1541). RN also has `_keyboardEventsAreUnreliable()`
-// — a pre-API-30 Android layout-polling fallback — deliberately not ported: modern targets only,
-// and the omission only ever makes this return `false` more readily (never dismisses when RN
-// would not have been sure either), never a false claim.
+// RN's `_keyboardEventsAreUnreliable()` (ScrollView.js:1558-1561): before API 30 Android reports
+// the keyboard only through layout, so its events cannot be trusted.
+const ANDROID_RELIABLE_KEYBOARD_API = 30;
+function keyboardEventsAreUnreliable() {
+    return (Platform.OS === 'android' &&
+        typeof Platform.Version === 'number' &&
+        Platform.Version < ANDROID_RELIABLE_KEYBOARD_API);
+}
+// RN's `_keyboardIsDismissible()` (ScrollView.js:1527-1541).
 function keyboardIsDismissible() {
     const focused = currentlyFocusedInput();
     const hasFocusedTextInput = focused !== null && isTextInputNode(focused);
-    return hasFocusedTextInput && Keyboard.metrics() !== undefined;
+    const softKeyboardMayBeOpen = Keyboard.metrics() !== undefined || keyboardEventsAreUnreliable();
+    return hasFocusedTextInput && softKeyboardMayBeOpen;
 }
 // RN's `_softKeyboardIsDetached()` (ScrollView.js:1543-1546).
 function softKeyboardIsDetached() {
@@ -88,8 +94,13 @@ function keyboardNeverPersistsTaps(persist) {
 // keyboard is up, and the touch did not land on the focused input itself.
 function startShouldSetResponderCapture(owner, event) {
     const state = stateFor(owner);
-    if (isAnimating(state))
+    // Both claims below take the tap away from the button under the finger, so each one says so.
+    if (isAnimating(state)) {
+        if (isDebug()) {
+            dlog(`ScrollView claims the tap (animating: momentum begin=${state.lastMomentumScrollBeginTime} end=${state.lastMomentumScrollEndTime})`);
+        }
         return true;
+    }
     if (propOf(owner, 'disableScrollViewPanResponder') === true)
         return false;
     if (softKeyboardIsDetached())
@@ -97,8 +108,11 @@ function startShouldSetResponderCapture(owner, event) {
     if (keyboardNeverPersistsTaps(propOf(owner, 'keyboardShouldPersistTaps')) &&
         keyboardIsDismissible()) {
         const target = touchTargetOf(event.nativeEvent);
-        if (target !== undefined && !isTextInputNode(target))
+        if (target !== undefined && !isTextInputNode(target)) {
+            if (isDebug())
+                dlog('ScrollView claims the tap (keyboard up, dismissing it)');
             return true;
+        }
     }
     return false;
 }
@@ -173,7 +187,19 @@ function handleMomentumScrollEnd(owner, event) {
     if (typeof app === 'function')
         app(event);
 }
+// `ScrollView.js:1284-1295`. Android's native scroller has no `keyboardDismissMode`, so `on-drag`
+// is JS dismissing the keyboard (`dismissKeyboard()`) before the app's own handler runs.
+function handleScrollBeginDrag(owner, event) {
+    if (Platform.OS === 'android' &&
+        propOf(owner, 'keyboardDismissMode') === 'on-drag') {
+        blurTextInput(currentlyFocusedInput());
+    }
+    const app = appListenerFor(owner, 'scrollBeginDrag');
+    if (typeof app === 'function')
+        app(event);
+}
 export const RESPONDER_OWNED_LISTENERS = [
+    'scrollBeginDrag',
     'startShouldSetResponderCapture',
     'startShouldSetResponder',
     'responderTerminationRequest',
@@ -196,6 +222,9 @@ export function installResponderPredicates(owner) {
     setBehaviorListener(owner, 'momentumScrollBegin', event => {
         handleMomentumScrollBegin(owner, event);
     });
+    setBehaviorListener(owner, 'scrollBeginDrag', event => {
+        handleScrollBeginDrag(owner, event);
+    });
     setBehaviorListener(owner, 'momentumScrollEnd', event => {
         handleMomentumScrollEnd(owner, event);
     });

package/build/behaviors/scroll-view/shared.js

@@ -81,7 +81,7 @@
 // The slot's fold is assigned to the node inside `buildStructure`, not declared on the behavior:
 // `IHostBehavior.foldPayload` is the OWNER's, wired by `attachHostBehavior`, and a behavior that
 // builds a node owns what that node carries.
-import { appendChild, appListenerFor, createElement, dlog, registerHostBehavior, setBehaviorListener, setEventListener, setProp, } from '@symbiote-native/engine';
+import { appendChild, appListenerFor, createElement, dlog, registerHostBehavior, setBehaviorListener, setEventListener, } from '@symbiote-native/engine';
 import { descriptorFor } from '../../component-names';
 import { didContentSizeChange, readLayoutDimension, } from '../../view/render-scroll-view.js';
 import { installResponderPredicates, RESPONDER_OWNED_LISTENERS, } from './responder.js';
@@ -95,7 +95,11 @@ const SLOT_PROPS = {
 };
 // Owner props the SLOT's payload reads. Declared so a write to one dirties the slot — see
 // `IHostBehavior.slotDerived` for why nothing else makes that happen.
-const SLOT_DERIVED = ['maintainVisibleContentPosition', 'snapToAlignment'];
+const SLOT_DERIVED = [
+    'maintainVisibleContentPosition',
+    'snapToAlignment',
+    'removeClippedSubviews',
+];
 // A `<RefreshControl>` written among the app's children is claimed, and WHAT the owner does with
 // it is the one thing that genuinely differs per platform — see the platform files. Resolved
 // through `descriptorFor`, so this is `PullToRefreshView` on iOS and `AndroidSwipeRefreshLayout`
@@ -113,9 +117,8 @@ export const REFRESH_CONTROL = descriptorFor('refresh-control').component;
 // intrinsic from; an app that also writes `horizontal` on the vertical tag is contradicting the
 // element it chose, and the tag wins.
 //
-// `nestedScrollEnabled` defaults ON because every wrapper writes it on every ScrollView, both
-// platforms. RN itself only defaults it on the Android RefreshControl WRAP path
-// (`ScrollView.js:1862`) — parity here is with the wrapper this behavior replaced.
+// `nestedScrollEnabled` defaults ON only on the Android RefreshControl WRAP path, as RN does
+// (`ScrollView.js:1862`); elsewhere only the authored value is sent.
 // THE OWNER'S FOLD IS GONE (2026-09-18) — `foldScrollViewProps` in `SymbioteFabricProps.cpp`. Every
 // input it had was the node's own bag plus the AXIS, and the axis is the tag (`scroll-view` vs
 // `horizontal-scroll-view`), so it was a tag rule by every criterion: the base style composition,
@@ -148,8 +151,7 @@ export const REFRESH_CONTROL = descriptorFor('refresh-control').component;
 // `core/engine/cpp/tests/js/scroll-content-payload.itest.ts`.
 // `rowStyle` USED TO BE A PARAMETER HERE and is not one any more: the content node's row direction
 // is decided in the engine from that node's OWN tag (`horizontal-scroll-content`), so this builder
-// no longer needs to know the axis to build it. `scrollBehavior` still derives `horizontal` from the
-// row style for the things that DO still need it in JS.
+// no longer needs to know the axis to build it.
 function buildContent(contentIntrinsic) {
     return (node) => {
         const descriptor = descriptorFor(contentIntrinsic);
@@ -230,9 +232,6 @@ function syncOwnedListener(owner, name, wired) {
         syncOwnerLayout(owner);
 }
 function scrollBehavior(contentIntrinsic, rowStyle, platform) {
-    // The row style is the horizontal tag's constant and nothing else carries it, so it IS the axis —
-    // deriving keeps the two from ever disagreeing about which behavior this is.
-    const horizontal = rowStyle !== undefined;
     return {
         // `scroll` and `layout` are owned for the collision reason rather than because the behavior
         // consumes them: RN's ScrollView installs `_handleScroll` and `_handleLayout` on the native

package/build/behaviors/text-input.js

@@ -21,7 +21,7 @@
 // compares against that seed. Reversed, the very first beat would see an empty mirror, decide the
 // app's value had diverged, and command a redundant `setTextAndSelection` down to native on every
 // input in the tree.
-import { appListenerFor, blurTextInput, dispatchViewCommand, dlog, focusTextInput, propOf, propsOf, registerHostBehavior, requestCommitFor, setBehaviorListener, setInputBlurred, setInputFocused, setProp, } from '@symbiote-native/engine';
+import { appListenerFor, blurTextInput, dispatchViewCommand, dlog, focusTextInput, Platform, propOf, propsOf, registerHostBehavior, requestCommitFor, setBehaviorListener, setInputBlurred, setInputFocused, setProp, } from '@symbiote-native/engine';
 import { attachPressMachine, detachPressMachine, } from './pressable.js';
 import { eventCountFromChange, foldText, INITIAL_EVENT_COUNT, SELECTION_NONE, shouldCommandText, textFromChange, } from '../state/text-input.js';
 // Both spellings, because `multiline` picks between two Fabric views and the TAG is what decides.
@@ -265,7 +265,18 @@ function attach(node) {
     setBehaviorListener(node, 'focus', event => onFocus(node, event));
     setBehaviorListener(node, 'blur', event => onBlur(node, event));
     setBehaviorListener(node, 'selectionChange', event => onSelectionChange(node, event));
-    attachPressMachine(node, { refine: focusOnPress });
+    attachPressMachine(node, {
+        refine: focusOnPress,
+        cancelableOf: textInputCancelable,
+    });
+}
+// TextInput.js:597 with its `rejectResponderTermination = true` default (:905): iOS keeps the
+// gesture unless the app opts in; Android hands Pressability `null`, i.e. its own default (yield).
+function textInputCancelable(source) {
+    if (Platform.OS !== 'ios')
+        return undefined;
+    const reject = propOf(source, 'rejectResponderTermination');
+    return !(reject === undefined || Boolean(reject));
 }
 // The first commit is the earliest point where the node has BOTH its props and a Fabric tag. The
 // mirror needs the first, `autoFocus` needs the second.

package/build/behaviors/touchable-native-feedback.js

@@ -54,9 +54,9 @@
 // since 2026-09-09, in the same commit that deleted the five wrappers, which is what makes it safe:
 // while a wrapper still built its own Pressable + feedback View, registering would have left every
 // TouchableNativeFeedback with two responders.
-import { SLOT_DERIVED_ALL, appListenerFor, dispatchViewCommand, markPropsDirty, Platform, registerHostBehavior, requestCommitFor, setBehaviorListener, } from '@symbiote-native/engine';
+import { SLOT_DERIVED_ALL, appListenerFor, markPropsDirty, Platform, registerHostBehavior, requestCommitFor, setBehaviorListener, } from '@symbiote-native/engine';
 import { resolveButtonDisabled } from '../view/render-button.js';
-import { asAccessibilityState, attachPressMachine, booleanOr, detachPressMachine, } from './pressable.js';
+import { asAccessibilityState, attachPressMachine, booleanOr, detachPressMachine, withNativeFeedbackCommands, } from './pressable.js';
 export const TOUCHABLE_NATIVE_FEEDBACK_TAG = 'touchable-native-feedback';
 // TouchableNativeFeedback.js:214-221 — `disabled != null ? disabled : (aria-disabled ??
 // accessibilityState.disabled)`, read by the OWNER's Pressability config (:213), same three-way
@@ -106,11 +106,6 @@ const PRESS_LISTENERS = [
 // discriminant; the C++ rule asks only whether the value is an OBJECT and copies it into the slot,
 // because the four factories that produce it (`render-touchable-native-feedback.ts`) are ours and
 // the payload is not a place to re-validate what a typed factory already built.
-// TouchableNativeFeedback.js:280 — `locationX ?? 0`. The bag is raw Fabric payload, so guard.
-function hotspotAt(nativeEvent, key) {
-    const value = nativeEvent[key];
-    return typeof value === 'number' ? value : 0;
-}
 /**
  * TNF's own Pressability config, applied to whatever node carries the responder.
  *
@@ -128,34 +123,8 @@ function hotspotAt(nativeEvent, key) {
  * moves.
  */
 export const nativeFeedbackRefinement = (node, config) => {
-    if (!IS_ANDROID)
-        return { ...config, minPressDuration: 0 };
-    const hotspot = (event) => {
-        dispatchViewCommand(node, 'hotspotUpdate', [
-            hotspotAt(event.nativeEvent, 'locationX'),
-            hotspotAt(event.nativeEvent, 'locationY'),
-        ]);
-    };
-    return {
-        ...config,
-        minPressDuration: 0,
-        onPressIn(event) {
-            // RN's order: hotspot first, so the ripple starts where the finger is rather than at centre.
-            hotspot(event);
-            dispatchViewCommand(node, 'setPressed', [true]);
-            config.onPressIn?.(event);
-        },
-        onPressMove(event) {
-            hotspot(event);
-            // RN drops the app's own onPressMove here; ours forwards it, because on a tag that callback
-            // is the app's and iOS already delivers it.
-            config.onPressMove?.(event);
-        },
-        onPressOut(event) {
-            dispatchViewCommand(node, 'setPressed', [false]);
-            config.onPressOut?.(event);
-        },
-    };
+    const floorless = { ...config, minPressDuration: 0 };
+    return IS_ANDROID ? withNativeFeedbackCommands(node, floorless) : floorless;
 };
 // `cloneFold` LEFT THIS FILE ON 2026-09-18 — it is `foldCloneOntoChild` in
 // `SymbioteFabricProps.cpp`, and the seam it needed is the first rule keyed on the PARENT'S tag

package/build/bootstrap/index.d.ts

@@ -2,6 +2,7 @@ import { type IColorValue, type IDeviceEventSource, type INativeViewConfigSource
 export type IBootstrapHostOptions = {
     colorProcessor?: (value: IColorValue) => unknown;
     imageSourceResolver?: (source: unknown) => unknown;
+    assetSourceResolver?: (source: unknown) => unknown;
     deviceEventSource?: IDeviceEventSource;
     nativeViewConfigSource?: INativeViewConfigSource;
     debug?: boolean;

package/build/bootstrap/index.js

@@ -5,7 +5,7 @@
 // export): react-native's own source is Flow syntax Vitest's transform can't parse, so anything
 // importing it directly must stay unreachable from the tested main index.ts.
 import { processColor, DeviceEventEmitter, Image, } from 'react-native';
-import { setColorProcessor, setDeviceEventSource, setImageSourceResolver, setNativeViewConfigSource, } from '@symbiote-native/engine';
+import { setAssetSourceResolver, installBackHandler, setColorProcessor, setDeviceEventSource, setImageSourceResolver, setNativeViewConfigSource, } from '@symbiote-native/engine';
 // @ts-expect-error react-native ships no types for this internal path (plain .js) - the
 // try/catch below is what actually proves the shape, not TS.
 import * as ReactNativeViewConfigRegistry from 'react-native/Libraries/Renderer/shims/ReactNativeViewConfigRegistry';
@@ -37,6 +37,9 @@ export function bootstrapHost(options = {}) {
     globalThis.__SYMBIOTE_DEBUG__ = options.debug ?? process.env.DEBUG === '1';
     setColorProcessor(options.colorProcessor ?? defaultColorProcessor);
     setImageSourceResolver(options.imageSourceResolver ?? defaultImageSourceResolver);
+    setAssetSourceResolver(options.assetSourceResolver ?? defaultImageSourceResolver);
     setDeviceEventSource(options.deviceEventSource ?? DeviceEventEmitter);
+    // After the event source: the back button subscribes through it (see installBackHandler).
+    installBackHandler();
     setNativeViewConfigSource(options.nativeViewConfigSource ?? defaultNativeViewConfigSource);
 }

package/build/component-names/index.android.js

@@ -31,20 +31,9 @@ const ANDROID_NAMES = {
     switch: 'AndroidSwitch',
     'activity-indicator': 'RCTView',
     'activity-indicator-spinner': 'AndroidProgressBar',
-    // KNOWN DIVERGENCE FROM REACT NATIVE, and it is in our favour — recorded 2026-09-01 because it
-    // was arrived at by accident, not decided. Upstream `SafeAreaView.js` is
-    // `Platform.select({ ios: RCTSafeAreaViewNativeComponent, default: View })`, so RN's own JS
-    // renders a plain View on Android and applies NO insets. `RCTSafeAreaView` does exist and is
-    // registered (`ReactSafeAreaViewManager.REACT_CLASS`, wired in `MainReactPackage.kt:149`) and
-    // does real window-inset math — so we inset where RN does not, and an app ported from RN gets
-    // different Android layout with nothing to explain why.
-    //
-    // This table's rule is "the name is the ViewManager's REACT_CLASS", and by that rule the entry is
-    // correct. What nobody checked is whether RN's JS ROUTES there. Left as-is deliberately: insetting
-    // is the better behaviour and RN has deprecated its own component in favour of
-    // react-native-safe-area-context. Invisible to every audit we have, because both of our paths
-    // agree with each other and only disagree with RN — the boundary
-    // `.claude/rules/adapter-parity-audit.md` states about itself.
+    // DELIBERATE DIVERGENCE FROM RN (2026-09-23). RN's `SafeAreaView.js` is a plain View on Android,
+    // with no insets. `RCTSafeAreaView` is registered there too (`ReactSafeAreaViewManager`) and
+    // applies the window insets, so one screen is safe on both platforms.
     'safe-area-view': 'RCTSafeAreaView',
     modal: 'RCTModalHostView',
     'refresh-control': 'AndroidSwipeRefreshLayout',

package/build/index.d.ts

@@ -27,7 +27,7 @@ export { imageStatics, setImageSourceResolver } from '@symbiote-native/engine';
 export type { IInputAccessoryViewViewProps } from './view/render-input-accessory-view';
 export { renderModal } from './view/render-modal';
 export type { IModalViewProps, IModalAnimationType, IModalPresentationStyle, IModalOrientation, IModalOrientationChangeEvent, } from './view/render-modal';
-export { modalReducer, createInitialModalState, shouldRenderModal, } from './state/modal';
+export { modalReducer, createInitialModalState, isModalVisible, modalVisibilityAction, shouldRenderModal, } from './state/modal';
 export type { IModalState, IModalAction } from './state/modal';
 export { computeInset, configureKeyboardAvoidingAnimation, keyboardAvoidingEventNamesFor, readKeyboardAnimationTiming, readPrefersCrossFadeTransitions, readKeyboardFrame, readLayoutFrame, resolveKeyboardAvoidingLayout, DEFAULT_VERTICAL_OFFSET, } from './view/render-keyboard-avoiding-view';
 export type { IComputeInsetOptions, IKeyboardAnimationTiming, IKeyboardAvoidingBehavior, IKeyboardAvoidingEventNames, IMeasuredFrame, IKeyboardFrame, IKeyboardAvoidingLayout, IResolveKeyboardAvoidingLayoutParams, } from './view/render-keyboard-avoiding-view';
@@ -50,7 +50,7 @@ export { reduceList, createInitialListState, listEffectSignature, } from './stat
 export type { IListState, IListMetrics, IListReducerInputs, IListAction, IListEffect, IListReduceResult, } from './state/virtualized-list-reducer';
 export { subscribeListDiagnostics } from './state/virtualized-list-diagnostics';
 export type { IListDiagnosticFrame, IListDiagnosticMove, } from './state/virtualized-list-diagnostics';
-export { SINGLE_COLUMN, chunkIntoRows, rowKeyExtractor, expandRowToken, expandRowViewability, lastItemOfRow, firstItemOfRow, } from './state/flat-list';
+export { SINGLE_COLUMN, chunkIntoRows, rowKeyExtractor, expandRowToken, expandRowViewability, lastItemOfRow, firstItemOfRow, removeClippedSubviewsOrDefault, } from './state/flat-list';
 export type { IRow } from './state/flat-list';
 export { flattenSections, unwrapEntryItem, sectionEntryKey, scrollLocationToFlatIndex, } from './state/section-list';
 export type { ISection, ISectionEntry, IVirtualizedSectionListHandle, } from './state/section-list';

package/build/index.js

@@ -35,7 +35,7 @@ export { renderImage } from './view/render-image/index.js';
 export { imageStatics, setImageSourceResolver } from '@symbiote-native/engine';
 // Modal: full 3-layer split (state machine gates the iOS keep-alive frame).
 export { renderModal } from './view/render-modal.js';
-export { modalReducer, createInitialModalState, shouldRenderModal, } from './state/modal.js';
+export { modalReducer, createInitialModalState, isModalVisible, modalVisibilityAction, shouldRenderModal, } from './state/modal.js';
 // KeyboardAvoidingView: pure inset/behavior math; the adapter owns the Keyboard subscription.
 export { computeInset, configureKeyboardAvoidingAnimation, keyboardAvoidingEventNamesFor, readKeyboardAnimationTiming, readPrefersCrossFadeTransitions, readKeyboardFrame, readLayoutFrame, resolveKeyboardAvoidingLayout, DEFAULT_VERTICAL_OFFSET, } from './view/render-keyboard-avoiding-view.js';
 // Pressable: the press state machine (logic) + render decisions. The pure lifecycle (timers,
@@ -74,7 +74,7 @@ export { DEFAULT_WINDOW_SIZE, DEFAULT_INITIAL_NUM_TO_RENDER, DEFAULT_MAX_TO_REND
 // out of each adapter's reactive glue. The adapter maps events to actions and runs the effects.
 export { reduceList, createInitialListState, listEffectSignature, } from './state/virtualized-list-reducer.js';
 export { subscribeListDiagnostics } from './state/virtualized-list-diagnostics.js';
-export { SINGLE_COLUMN, chunkIntoRows, rowKeyExtractor, expandRowToken, expandRowViewability, lastItemOfRow, firstItemOfRow, } from './state/flat-list.js';
+export { SINGLE_COLUMN, chunkIntoRows, rowKeyExtractor, expandRowToken, expandRowViewability, lastItemOfRow, firstItemOfRow, removeClippedSubviewsOrDefault, } from './state/flat-list.js';
 export { flattenSections, unwrapEntryItem, sectionEntryKey, scrollLocationToFlatIndex, } from './state/section-list.js';
 export { registerPressableBehavior, PRESSABLE_TAG, } from './behaviors/pressable.js';
 export { registerTouchableOpacityBehavior, TOUCHABLE_OPACITY_TAG, } from './behaviors/touchable-opacity.js';

package/build/scroll-view-commands.js

@@ -1,9 +1,9 @@
-// ScrollView: the imperative + style-routing module (framework-agnostic, no 3-layer split:
-// ScrollView has no state machine). The imperative handle, the layout/visual style split for
-// the Android RefreshControl wrap, the scroll-event guard/forwarder, and the native sticky
-// scroll-attach are all platform- and framework-invariant, so they live here. The adapter
-// supplies the lifecycle (the node getter, the effect) and re-exports these.
-import { attachNativeEvent, dlog, flattenStyle, isSymbioteEvent, } from '@symbiote-native/engine';
+// ScrollView: the imperative + event-routing module (framework-agnostic, no 3-layer split:
+// ScrollView has no state machine). The imperative handle, the scroll-event guard/forwarder, and
+// the native sticky scroll-attach are platform- and framework-invariant, so they live here. The
+// Android RefreshControl wrap's style split moved out — see the note below. The adapter supplies
+// the lifecycle (the node getter, the effect) and re-exports these.
+import { attachNativeEvent, dlog, isSymbioteEvent, } from '@symbiote-native/engine';
 // THE ANDROID WRAP SPLIT LEFT THIS FILE ON 2026-09-18, and with it the last copy of RN's
 // `splitLayoutProps` key partition. Both halves are `SymbioteFabricProps.cpp` now
 // (`splitScrollViewStyle`, `foldRefreshWrapperProps`), reached off the tag and the tree rather than

package/build/state/flat-list.d.ts

@@ -1,5 +1,6 @@
 import { type IViewableItemsChangedInfo, type IViewToken } from './virtualized-list';
 export declare const SINGLE_COLUMN = 1;
+export declare function removeClippedSubviewsOrDefault<TValue>(removeClippedSubviews: TValue | null | undefined, os: string): TValue | boolean;
 export interface IRow<ItemT> {
     items: ItemT[];
     startIndex: number;

package/build/state/flat-list.js

@@ -6,6 +6,11 @@
 // only the element creation (createElement / h) for a row and the ref wiring.
 import { defaultKeyExtractor, } from './virtualized-list.js';
 export const SINGLE_COLUMN = 1;
+// FlatList.js's `removeClippedSubviewsOrDefault`: off-screen rows are clipped by default on
+// Android only (RN's `shouldUseRemoveClippedSubviewsAsDefaultOnIOS` is off in 0.86).
+export function removeClippedSubviewsOrDefault(removeClippedSubviews, os) {
+    return removeClippedSubviews ?? os === 'android';
+}
 export function chunkIntoRows(data, columns) {
     const rows = [];
     for (let start = 0; start < data.length; start += columns) {

package/build/state/modal.d.ts

@@ -1,3 +1,4 @@
+export declare function isModalVisible(visible: unknown): boolean;
 export type IModalState = {
     isRendered: boolean;
 };
@@ -8,4 +9,5 @@ export type IModalAction = {
     type: 'hide';
 };
 export declare function modalReducer(state: IModalState, action: IModalAction): IModalState;
-export declare function shouldRenderModal(isVisible: boolean, state: IModalState): boolean;
+export declare function shouldRenderModal(isVisible: boolean, state: IModalState, os?: string): boolean;
+export declare function modalVisibilityAction(isVisible: boolean): IModalAction | undefined;

package/build/state/modal.js

@@ -1,10 +1,12 @@
-// Modal: the logic half (framework-agnostic). RN keeps the modal mounted through its exit
-// animation (Modal.js _shouldShowModal: visible===true || state.isRendered===true) so the
-// native onDismiss event can arrive before the node unmounts. `isRendered` is PURELY that
-// keep-alive; it never itself fires onDismiss (on Fabric onDismiss is a real native
-// DirectEvent delivered via the host's onDismiss prop). The reducer mirrors RN's guarded
-// transitions: arm the keep-alive on show, drop it on hide. The adapter drives the transition
-// AFTER its render (React useEffect / Vue post-flush watch) so one keep-alive frame survives.
+// Modal logic, framework-agnostic. On iOS RN keeps the modal mounted through its exit animation
+// until native onDismiss arrives (Modal.js _shouldShowModal); only that event drops the
+// keep-alive, then the app's onDismiss runs. Android has no dismiss event: `visible` alone.
+import { Platform } from '@symbiote-native/engine';
+// Modal.js `defaultProps.visible = true`: defaultProps fill only `undefined`, so an unset
+// `visible` shows and an explicit `false`/`null` hides.
+export function isModalVisible(visible) {
+    return visible === undefined || visible === true;
+}
 // On first render the keep-alive matches `visible`: a modal that starts visible is rendered,
 // one that starts hidden contributes no node (the render gate returns null).
 export function createInitialModalState(isVisible) {
@@ -20,9 +22,13 @@ export function modalReducer(state, action) {
             return state.isRendered ? { isRendered: false } : state;
     }
 }
-// The visible gate with the keep-alive: a fully hidden modal (not visible AND no longer
-// rendered) contributes no node, exactly as RN's render returns null when _shouldShowModal()
-// is false.
-export function shouldRenderModal(isVisible, state) {
-    return isVisible || state.isRendered;
+// Modal.js `_shouldShowModal`: iOS keeps the node through its exit animation until the native
+// dismiss drops the keep-alive; Android shows on `visible` alone.
+export function shouldRenderModal(isVisible, state, os = Platform.OS) {
+    return os === 'ios' ? isVisible || state.isRendered : isVisible;
+}
+// Modal.js componentDidUpdate: false->true arms the keep-alive; true->false does NOTHING — only the
+// native `onDismiss` (iOS) drops it, via `{type: 'hide'}` from the adapter's dismiss handler.
+export function modalVisibilityAction(isVisible) {
+    return isVisible ? { type: 'show' } : undefined;
 }

package/build/state/virtualized-list-reducer.js

@@ -18,7 +18,7 @@
 // here, so a windowing / edge / viewability / MVCP bug — and the drift between three copies of it —
 // is fixed once for all adapters.
 import { dlog } from '@symbiote-native/engine';
-import { EMPTY_OFFSET, FIRST_INDEX, NO_CONTENT_LENGTH_SENT, NO_INDEX, averageMeasuredStride, buildOffsets, computeEndReached, computeMvcpAdjustment, computeStartReached, computeViewableSet, computeWindow, decideEdgeReached, diffViewable, highestMeasuredIndex, indexOfItem, isSettledLayout, maxMinimumViewTime, offsetForEnd, offsetForIndex, resolveAverageLength, resolveItemKey, throttleWindow, wrapFixedLayout, } from './virtualized-list.js';
+import { EMPTY_OFFSET, FIRST_INDEX, NO_CONTENT_LENGTH_SENT, NO_INDEX, averageMeasuredStride, buildOffsets, computeEndReached, computeMvcpAdjustment, computeStartReached, computeViewableSet, computeWindow, decideEdgeReached, diffViewable, highestMeasuredIndex, indexOfItem, isSettledLayout, maxMinimumViewTime, offsetForEnd, offsetForIndex, resolveAverageLength, resolveItemKey, throttleWindow, initialRenderRegion, wrapFixedLayout, } from './virtualized-list.js';
 import { recordCellMove, recordListFrame, } from './virtualized-list-diagnostics.js';
 export function createInitialListState() {
     return {
@@ -91,7 +91,7 @@ function deriveMetrics(state, inputs) {
         };
     }
     const target = computeWindow(count, offsets, lengths, state.scrollOffset, state.viewportLength, inputs.windowSize, inputs.initialNumToRender);
-    const throttled = throttleWindow(target, state.committedWindow, inputs.maxToRenderPerBatch);
+    const throttled = throttleWindow(target, state.committedWindow, inputs.maxToRenderPerBatch, initialRenderRegion(count, inputs.initialScrollIndex, inputs.initialNumToRender));
     state.committedWindow = throttled;
     state.metrics = {
         count,

package/build/state/virtualized-list.d.ts

@@ -13,6 +13,7 @@ export declare const NO_INDEX = -1;
 export declare const FULLY_VISIBLE_PERCENT = 100;
 export declare const ON_EDGE_REACHED_EPSILON = 0.001;
 export declare const NO_CONTENT_LENGTH_SENT = -1;
+export declare function invertedYStyleFor(os: string): IViewStyle;
 export declare const INVERTED_Y_STYLE: IViewStyle;
 export declare const INVERTED_X_STYLE: IViewStyle;
 export interface ICellLayout {
@@ -84,13 +85,20 @@ export declare function computeWindow(count: number, offsets: number[], lengths:
     first: number;
     last: number;
 };
+export declare function initialRenderRegion(count: number, initialScrollIndex: number | undefined, initialNumToRender: number): {
+    first: number;
+    last: number;
+};
 export declare function throttleWindow(target: {
     first: number;
     last: number;
 }, previous: {
     first: number;
     last: number;
-}, maxToRenderPerBatch: number): {
+}, maxToRenderPerBatch: number, initialRegion: {
+    first: number;
+    last: number;
+}): {
     first: number;
     last: number;
 };

package/build/state/virtualized-list.js

@@ -19,7 +19,7 @@
 // framework's own children (renderItem -> ReactNode / VNode), so there is no
 // Descriptor render fn for a list - the shared layer for lists is this STATE/logic
 // module, not a view/render-*.ts.
-import { dlog } from '@symbiote-native/engine';
+import { dlog, Platform } from '@symbiote-native/engine';
 // Defaults match RN. windowSize is measured in viewport-lengths (21 => ten screens
 // of buffer on each side of the visible region). initialNumToRender bounds the first
 // paint before any layout is measured. maxToRenderPerBatch / batching period mirror
@@ -46,8 +46,15 @@ export const ON_EDGE_REACHED_EPSILON = 0.001;
 // yet". Real content lengths are >= 0, so -1 can never collide with one.
 export const NO_CONTENT_LENGTH_SENT = -1;
 // Inversion flips the content container along the scroll axis; each cell re-flips so
-// its own content stays upright (RN does the same with a scale(-1) transform).
-export const INVERTED_Y_STYLE = { transform: [{ scaleY: -1 }] };
+// its own content stays upright. VirtualizedList.js `styles.verticallyInverted`: Android flips
+// with `scale: -1` because `scaleY: -1` can ANR on API 33+ (react-native#35350); the native side
+// then moves the scrollbar back via `isInvertedVirtualizedList`.
+export function invertedYStyleFor(os) {
+    return os === 'android'
+        ? { transform: [{ scale: -1 }] }
+        : { transform: [{ scaleY: -1 }] };
+}
+export const INVERTED_Y_STYLE = invertedYStyleFor(Platform.OS);
 export const INVERTED_X_STYLE = { transform: [{ scaleX: -1 }] };
 // nativeEvent payload guards. The payloads arrive as `unknown` off the wire, so they
 // are narrowed with runtime checks rather than cast.
@@ -166,13 +173,24 @@ export function computeWindow(count, offsets, lengths, scrollOffset, viewportLen
     }
     return { first, last };
 }
+// RN's `VirtualizedList._initialRenderRegion`: `initialNumToRender` cells from
+// `initialScrollIndex`, clamped to the data. What a list paints before it has a window of its own.
+export function initialRenderRegion(count, initialScrollIndex, initialNumToRender) {
+    const first = Math.max(FIRST_INDEX, Math.min(count - 1, Math.floor(initialScrollIndex ?? FIRST_INDEX)));
+    return { first, last: Math.min(count, first + initialNumToRender) - 1 };
+}
 // Clamp a freshly computed window against the previously-committed one so at most
 // maxToRenderPerBatch new cells are added on each side per tick (RN's incremental fill).
 // The window grows toward the target over successive batch ticks rather than snapping in
 // one render: cheaper first paint on a big jump.
-export function throttleWindow(target, previous, maxToRenderPerBatch) {
+//
+// With NO previous window - the list just received data - RN paints its initial region and grows
+// from there (`_createRenderMask` adds `_initialRenderRegion` to a window constrained from empty),
+// even when the viewport is already known. Snapping to the target instead mounted ~125 rows where
+// RN mounts 10 on a 420pt viewport (`stock-virtualized-suite.itest.tsx`).
+export function throttleWindow(target, previous, maxToRenderPerBatch, initialRegion) {
     if (previous.last < previous.first)
-        return target;
+        return initialRegion.last < initialRegion.first ? target : initialRegion;
     const first = Math.max(target.first, previous.first - maxToRenderPerBatch);
     const last = Math.min(target.last, previous.last + maxToRenderPerBatch);
     // Never present an empty window when the target is non-empty.

package/build/view/render-button.js

@@ -11,15 +11,6 @@
 // What is NOT here, because a layer below already does it: the `aria-*` -> `accessibilityState`
 // fold RN performs in `Button.js:326-331`. The engine folds those for every node
 // (`core/engine/src/accessibility-props.ts`), so repeating it here would fold twice.
-import { Platform } from '@symbiote-native/engine';
-// Button.js:394-437, one constant per literal so a value cannot drift silently. The LABEL's seven
-// went with `resolveButtonTextStyle` on 2026-09-18 — they live in `SymbioteFabricProps.cpp` beside
-// the rule that reads them and are deliberately not duplicated here.
-const ANDROID_BUTTON_BLUE = '#2196F3';
-const ANDROID_DISABLED_BACKGROUND = '#dfdfdf';
-const ANDROID_ELEVATION = 4;
-const ANDROID_DISABLED_ELEVATION = 0;
-const ANDROID_BORDER_RADIUS = 2;
 // `BUTTON_ACCESSIBILITY_ROLE` and `resolveButtonImportantForAccessibility` WERE HERE and are gone
 // (2026-09-18). Both are `foldButtonProps` in `SymbioteFabricProps.cpp` now, and neither had a
 // caller left afterwards — only its own unit test, which is the shape this project calls a mirror:

package/build/view/render-modal.js

@@ -73,10 +73,11 @@ export function renderModal(view, isRTL = I18nManager.isRTL) {
         // supportedOrientations/allowSwipeDismissal, Android hardwareAccelerated/
         // statusBarTranslucent/navigationBarTranslucent.
         supportedOrientations: view.supportedOrientations,
-        hardwareAccelerated: view.hardwareAccelerated,
+        // Modal.js `defaultProps = {hardwareAccelerated: false, visible: true}`.
+        hardwareAccelerated: view.hardwareAccelerated ?? false,
         statusBarTranslucent: view.statusBarTranslucent,
         navigationBarTranslucent: view.navigationBarTranslucent,
         allowSwipeDismissal: view.allowSwipeDismissal,
-        visible: view.visible,
+        visible: view.visible ?? true,
     }, [container]);
 }

package/build/view/render-touchable-native-feedback.js

@@ -4,14 +4,9 @@
 // both live here so every adapter inherits the exact same surface. The adapter only attaches these
 // statics onto its component value and nests the feedback View under its Pressable.
 import { Platform } from '@symbiote-native/engine';
-// Native foreground ripple is Android-only (API 23+). RN gates this on Platform.OS === 'android'
-// && Platform.Version >= 23. Version is a string on iOS (where the gate is irrelevant) and a
-// number on Android, so guard the type at runtime before the numeric compare, no cast.
-const ANDROID_FOREGROUND_MIN_VERSION = 23;
+// TouchableNativeFeedback.js:202 — the OS alone; RN's minSdk is past the old API-23 gate.
 export function canUseNativeForeground() {
-    return (Platform.OS === 'android' &&
-        typeof Platform.Version === 'number' &&
-        Platform.Version >= ANDROID_FOREGROUND_MIN_VERSION);
+    return Platform.OS === 'android';
 }
 export function selectableBackground(rippleRadius) {
     return {
@@ -27,15 +22,14 @@ export function selectableBackgroundBorderless(rippleRadius) {
         rippleRadius,
     };
 }
-// RN runs the color string through processColor (→ a native int); we have no native bridge here,
-// so we keep the string and let Android resolve it. A null color is the documented "no tint".
+// RN runs the color through processColor here; we keep the string and the engine's Android rule
+// converts it (Java reads it with getInt, a string would fail). A null color is "no tint".
 export function rippleBackground(color, borderless, rippleRadius) {
     return { type: 'RippleAndroid', color, borderless, rippleRadius };
 }
 // `backgroundProps` WAS HERE AND IS GONE (2026-09-18). It mapped the resolved background plus
 // `useForeground` onto the native slot Android reads, and that is the `#ifdef ANDROID` tail of
-// `foldCloneOntoChild` in `SymbioteFabricProps.cpp` — api-level gate included, since
-// `Platform.Version` on Android IS the api level and `androidApiLevel()` reads the same number.
+// `foldCloneOntoChild` in `SymbioteFabricProps.cpp`.
 //
 // A JS COPY OF A RULE THAT RUNS IN C++, with no runtime caller and no test, reachable only through
 // the package barrel. Found by asking what each `Platform.OS` branch still left in

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symbiote-native/components",
-  "version": "3.0.1",
+  "version": "3.1.1",
   "description": "Framework-agnostic component logic (state machines + render functions) for SymbioteNative — written once, inherited by every adapter (React, Vue, Angular, ...).",
   "license": "MIT",
   "repository": {
@@ -59,11 +59,11 @@
   },
   "peerDependencies": {
     "react-native": ">=0.86",
-    "@symbiote-native/engine": "^1.2.0"
+    "@symbiote-native/engine": "^1.3.0"
   },
   "devDependencies": {
     "@types/node": "^26.0.0",
-    "@symbiote-native/engine": "1.2.0"
+    "@symbiote-native/engine": "1.3.0"
   },
   "scripts": {
     "typecheck": "tsc --build",