@symbiote-native/components 2.0.0 → 3.0.1

package/build/behaviors/touchable-highlight.js

@@ -1,17 +1,32 @@
 // TouchableHighlight as an ENGINE-NODE behavior, so it can be an intrinsic tag instead of a
 // framework component (`.claude/rules/host-primitive-tier.md`, tier 2).
 //
-// ONE NODE, THE SAME SIMPLIFICATION EVERY WRAPPER ALREADY SHIPS. RN's own TouchableHighlight
+// ONE NODE, THE SAME SIMPLIFICATION EVERY WRAPPER ALREADY SHIPPED. RN's own TouchableHighlight
 // renders a container View (the responder, the underlay backgroundColor, the whole accessibility
 // fold) and CLONES an extra opacity style onto its single child (TouchableHighlight.js:281-320,
-// `_createExtraStyles` + `cloneElement`) — closer to TouchableNativeFeedback's clone-onto-child
-// shape than to TouchableOpacity's true single node. Every wrapper (Svelte's own comment: "ITEM 7
-// IS DELIBERATELY NOT FIXED HERE... exactly as Solid and Angular decided") folds BOTH the underlay
-// and the child opacity onto the ONE node instead, because splitting them needs a child to target
-// and a framework component holding an opaque children snippet/slot cannot reach one safely. This
-// port keeps that already-shipped, already-cross-adapter simplification rather than reopening it —
-// `render-touchable-highlight.ts`'s own header says the shared layer "takes no position on where
-// they land", so this is a legitimate placement choice, not a new shortcut.
+// `_createExtraStyles` + `cloneElement`). This tag folds both onto the ONE node instead, in
+// `foldTouchableHighlightUnderlay` (`SymbioteFabricProps.cpp`) now — see that rule's own header.
+//
+// KNOWN GAP, and it predates both this port and the fix it reverts. Composing `opacity` onto the
+// SAME node as the underlay's `backgroundColor` fades the underlay itself, so `underlayColor:
+// 'black'` paints grey rather than black — every adapter's wrapper shipped this, and the rule's own
+// header above says so on purpose ("The port keeps that, it does not reopen it"). A 2026-09-15 fix
+// (fd39750b) closed it pointwise, in JS, on this one tag; this revert returns to the shared
+// (buggy) behavior every adapter already had, which is correct for THIS merge — a merge that also
+// changes behavior is unattributable.
+//
+// The reason the old header gave for not splitting it — "needs a child to target and a framework
+// component holding an opaque children slot cannot reach one safely" — no longer holds: that was
+// true of JS wrappers, not of the engine. The DESCENDANT seam this needs already exists: a rule
+// keyed on `IOwner.tagName`, the same shape `foldCloneOntoChild` uses to reach a
+// TouchableNativeFeedback child's own `fabricProps()` call and write onto ITS payload — the write
+// `IFirstChild` cannot do, since that seam only reads a child, from the PARENT's own call.
+//
+// TODO: what actually blocks it is one missing field. `IOwner` carries `{ props, tagName,
+// hasPressListener }`; the child would need the owner's `underlayShown` too (currently only on
+// `ISelf`, the node's own state) to decide whether to paint at all. Closing this is a new
+// descendant-keyed rule plus that one field on `IOwner`, not a `foldTouchableHighlightUnderlay`
+// rewrite.
 //
 // WHAT IS SHARED AND WHAT IS NEW. The underlay show/hide state machine
 // (createHighlightUnderlayHandlers/createHighlightUnderlayRuntime, `../state/touchable`) is already
@@ -27,19 +42,26 @@
 //
 // REGISTRATION IS THE HAZARD, not the machine — see `./pressable` for why each adapter's entry does
 // a bare `import './register';` that the barrel does not re-export.
-import { appListenerFor, markPropsDirty, registerHostBehavior, requestCommitFor, } from '@symbiote-native/engine';
-import { resolveTouchableFocusable } from '../view/render-pressable/index.js';
-import { accessibleUnlessOptedOut, booleanOr, createPressBehavior, } from './pressable.js';
+//
+// TODO(rn-parity, low priority): `TouchableHighlight.js:206-232` also gates the underlay show/hide
+// on `onFocus`/`onBlur` (TV remote) and skips its own press-triggered show/hide-after-delay
+// entirely when `Platform.isTV`. Neither is wired here. Deliberately not implemented — dead on
+// every device this project targets (no tvOS build). Audit skill, "Found, NOT fixed: TV
+// (Platform.isTV) focus/blur feedback on TouchableOpacity/Highlight".
+import { markPropsDirty, registerHostBehavior, requestCommitFor, setNodeUnderlayShown, propOf, } from '@symbiote-native/engine';
+import { resolveButtonDisabled } from '../view/render-button.js';
+import { asAccessibilityState, booleanOr, createPressBehavior, } from './pressable.js';
 import { createHighlightUnderlayHandlers, createHighlightUnderlayRuntime, hasTouchablePressHandler, } from '../state/touchable.js';
-import { resolveHighlightExtraStyles } from '../view/render-touchable-highlight.js';
 export const TOUCHABLE_HIGHLIGHT_TAG = 'touchable-highlight';
+// TouchableHighlight.js:194-197 — `disabled ?? accessibilityState.disabled` (RN omits aria-disabled
+// here, unlike Opacity/Button/NativeFeedback — an upstream inconsistency this matches rather than
+// "fixes"). Without it, `accessibilityState={{disabled: true}}` alone greys the label but a press
+// still fires here.
+const touchableHighlightDisabled = props => resolveButtonDisabled(booleanOr(props.disabled), undefined, asAccessibilityState(props.accessibilityState));
 const states = new WeakMap();
 function numberOr(value, fallback) {
     return typeof value === 'number' ? value : fallback;
 }
-function stringOr(value, fallback) {
-    return typeof value === 'string' ? value : fallback;
-}
 // Runs once per GESTURE, matching `./touchable-opacity`'s `refine` — the config it reads is
 // whatever the props hold when a finger lands, and the underlay handlers it builds read `shown`
 // through the closure below rather than owning it, so a re-arm reads the current props.
@@ -54,8 +76,9 @@ const refine = (node, config) => {
         onLongPress: config.onLongPress,
     });
     const underlay = createHighlightUnderlayHandlers({
-        delayPressOut: numberOr(node.props.delayPressOut, 0),
+        delayPressOut: numberOr(propOf(node, 'delayPressOut'), 0),
         hasPressHandler,
+        testOnlyPressed: propOf(node, 'testOnly_pressed') === true,
         schedule: (callback, ms) => {
             const id = setTimeout(() => {
                 state.timers.delete(id);
@@ -72,16 +95,21 @@ const refine = (node, config) => {
             if (state.shown === shown)
                 return;
             state.shown = shown;
+            // THE BIT, and nothing else. No style is resolved here: what a showing underlay looks like
+            // is `foldTouchableHighlightUnderlay` in the engine, which reads the same two props it
+            // already strips from the payload. `markPropsDirty` is still owed — the op marks the host's
+            // node, and this marks the JS side's so the commit walk visits it.
+            setNodeUnderlayShown(node, shown);
             markPropsDirty(node);
             requestCommitFor(node);
         },
         onShowUnderlay: () => {
-            const onShowUnderlay = node.props.onShowUnderlay;
+            const onShowUnderlay = propOf(node, 'onShowUnderlay');
             if (typeof onShowUnderlay === 'function')
                 onShowUnderlay();
         },
         onHideUnderlay: () => {
-            const onHideUnderlay = node.props.onHideUnderlay;
+            const onHideUnderlay = propOf(node, 'onHideUnderlay');
             if (typeof onHideUnderlay === 'function')
                 onHideUnderlay();
         },
@@ -105,41 +133,30 @@ const refine = (node, config) => {
         },
     };
 };
-// `id -> nativeID`, the fold every un-lowered wrapper's `foldHostBag` already applies. Not read off
-// `HOST_PRIMITIVES`, matching `./touchable-opacity`'s own inline check — that spec entry is
-// deliberately withheld until this primitive's wrapper collapses to one node everywhere.
-const foldPayload = props => {
-    const next = { ...props };
-    if (Object.hasOwn(next, 'id')) {
-        next.nativeID = next.id;
-        delete next.id;
-    }
-    next.accessible = accessibleUnlessOptedOut(props);
-    return next;
-};
-function tagFold(node) {
-    return props => {
-        const next = foldPayload(props);
-        const state = states.get(node);
-        const hasPressHandler = appListenerFor(node, 'press') !== undefined ||
-            appListenerFor(node, 'pressIn') !== undefined ||
-            appListenerFor(node, 'pressOut') !== undefined ||
-            appListenerFor(node, 'longPress') !== undefined;
-        const extra = state === undefined
-            ? undefined
-            : resolveHighlightExtraStyles({
-                shown: state.shown,
-                hasPressHandler,
-                underlayColor: stringOr(props.underlayColor, undefined),
-                activeOpacity: numberOr(props.activeOpacity, NaN) || undefined,
-            });
-        if (extra !== undefined) {
-            next.style = [props.style, extra.underlay, extra.child];
-        }
-        next.focusable = resolveTouchableFocusable(booleanOr(props.focusable), appListenerFor(node, 'press') !== undefined, booleanOr(props.disabled));
-        return next;
-    };
-}
+// THE UNDERLAY FOLD LEFT THIS FILE ON 2026-09-18, and with it the last `payloadFold` on this tag —
+// this behavior now costs ZERO trips into JS per commit, down from one on every commit it was dirty
+// in (which for a touchable is FIVE at mount alone, because the opacity settle re-commits it).
+//
+// THE NOTE IT REPLACES SAID THE UNDERLAY WAS "the genuine unportable article" BECAUSE IT IS BUILT
+// FROM LIVE PRESS STATE. Half right, and the half it got wrong is the reusable part: `shown` really
+// does flip mid-gesture and really is JS's, but the RULE was never made of it. Of four inputs, three
+// were already portable — `underlayColor` and `activeOpacity` are ordinary props (ones the engine
+// ALREADY strips), and `_hasPressHandler` is listener EXISTENCE, which has crossed since
+// `OP_SET_OWNED_LISTENER`. The fourth is one bit. "JS holds it" was never the same claim as "only JS
+// can compute it", and this is the third time that distinction has moved a rule.
+//
+// WHAT CROSSES AND WHAT DOES NOT. `setNodeUnderlayShown` sends the bit on a flip — twice a tap. The
+// hold timer, the `press`-then-`pressOut` ordering, the re-arm on a second tap and the
+// `onShowUnderlay` / `onHideUnderlay` callbacks all stay here, where Pressability is, because they
+// run at gesture rate and call into app code. That is the browser's line too: a UA paints `:active`,
+// the page decides what a click means.
+//
+// `focusable` left earlier the same day and carried a bug out with it — it read `props.disabled` off
+// the BAG, which the engine's pressable rule strips, so every DISABLED highlight stayed in the focus
+// order. One rule serves both touchable tags now (`foldPressableProps`), so there is no second copy
+// to drift; pinned in `core/engine/cpp/tests/js/touchable-focusable-payload.itest.ts`.
+//
+// The underlay's own contract: `core/engine/cpp/tests/js/touchable-highlight-underlay.itest.ts`.
 // A listener flip changes no payload by itself, so the commit after it is a no-op and no fold
 // re-runs (`IHostBehavior.onOwnedListenerChange`) — same reason `./touchable-opacity` carries this.
 function onOwnedListenerChange(node, name) {
@@ -156,7 +173,6 @@ export function createTouchableHighlightBehavior(disabledOf) {
     const machine = createPressBehavior(refine, disabledOf);
     return {
         ...machine,
-        foldPayload,
         attach(node) {
             states.set(node, {
                 shown: false,
@@ -179,14 +195,11 @@ export function createTouchableHighlightBehavior(disabledOf) {
 }
 // Idempotent: an adapter entry may be imported more than once in a bundle.
 export function registerTouchableHighlightBehavior() {
-    const touchable = createTouchableHighlightBehavior();
+    const touchable = createTouchableHighlightBehavior(touchableHighlightDisabled);
+    // Spread whole: the tag used to override `attach` purely to bind a per-node `payloadFold`, and
+    // with the underlay rule in the engine there is nothing left to add.
     registerHostBehavior(TOUCHABLE_HIGHLIGHT_TAG, {
         ...touchable,
-        // Only the TAG binds a per-node fold — see `./touchable-opacity`'s identical comment.
-        attach(node) {
-            touchable.attach(node);
-            node.payloadFold = tagFold(node);
-        },
         onOwnedListenerChange,
     });
 }

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

@@ -53,61 +53,33 @@
 // bare `import './register';` that the barrel does not re-export. Registered by ALL FIVE adapters
 // 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. There is no `-managed` twin and none is possible —
-// this tag commits no node, so a second spelling would have nothing to name.
-import { ARIA_ALIAS_KEYS, appListenerFor, dispatchViewCommand, foldAriaProps, markPropsDirty, Platform, registerHostBehavior, requestCommitFor, setBehaviorListener, } from '@symbiote-native/engine';
-import { resolveDisabledAccessibilityState, resolveTouchableFocusable, } from '../view/render-pressable/index.js';
-import { backgroundProps, selectableBackground, } from '../view/render-touchable-native-feedback.js';
-import { accessibleUnlessOptedOut, asAccessibilityState, attachPressMachine, booleanOr, detachPressMachine, } from './pressable.js';
+// TouchableNativeFeedback with two responders.
+import { SLOT_DERIVED_ALL, appListenerFor, dispatchViewCommand, markPropsDirty, Platform, registerHostBehavior, requestCommitFor, setBehaviorListener, } from '@symbiote-native/engine';
+import { resolveButtonDisabled } from '../view/render-button.js';
+import { asAccessibilityState, attachPressMachine, booleanOr, detachPressMachine, } 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
+// answer Button/Opacity resolve. The clone's own `accessibilityState`/`focusable` already use the
+// RAW `disabled` prop correctly (RN does too, :311-321,:369-371) — only the press machine, which
+// lives on the CHILD and reads the OWNER, was missing this.
+const touchableNativeFeedbackDisabled = props => resolveButtonDisabled(booleanOr(props.disabled), booleanOr(props['aria-disabled']), asAccessibilityState(props.accessibilityState));
 // Read once, like `./button`'s: the platform cannot change under a running app.
 const IS_ANDROID = Platform.OS === 'android';
-// TouchableNativeFeedback.js:349-390, verbatim and in RN's own order. A CLOSED list, not a
-// passthrough: RN clones exactly these and nothing else, so a prop it does not name stays behind.
-// `accessibilityState`, `accessible`, `focusable` and `nativeID` are cloned too and are computed
-// below; `onLayout` and `onAccessibilityAction` are cloned as LISTENERS and forwarded by
-// `FORWARDED_LISTENERS`.
-const CLONED_PROPS = [
-    'accessibilityHint',
-    'accessibilityLanguage',
-    'accessibilityLabel',
-    'accessibilityRole',
-    'accessibilityActions',
-    'accessibilityValue',
-    'importantForAccessibility',
-    'accessibilityViewIsModal',
-    'accessibilityLiveRegion',
-    'accessibilityElementsHidden',
-    'hasTVPreferredFocus',
-    'hitSlop',
-    'nextFocusDown',
-    'nextFocusForward',
-    'nextFocusLeft',
-    'nextFocusRight',
-    'nextFocusUp',
-    'testID',
-];
-// Owner props the cloned payload is COMPUTED from, on top of the verbatim list above. `focusable`
-// also derives from the `press` LISTENER, which is not a prop and is handled by
-// `onOwnedListenerChange` — a listener flip dirties no payload by itself.
-const DERIVED_FROM = [
-    'background',
-    'useForeground',
-    'accessible',
-    'accessibilityState',
-    'disabled',
-    'focusable',
-    'id',
-    'nativeID',
-];
-// Every owner name the child's payload reads. Without it the clone is correct at mount and frozen
-// forever after: `markPropsDirty` bubbles UP, so an owner write never reaches the child on its own.
-// The aria half comes off the engine's own list rather than a second copy of it.
-const SLOT_DERIVED = [
-    ...CLONED_PROPS,
-    ...DERIVED_FROM,
-    ...ARIA_ALIAS_KEYS,
-];
+// WHAT THE OWNER'S WRITES DIRTY, and it is EVERY name rather than a list of thirty.
+//
+// RN's clone list (`TouchableNativeFeedback.js:349-390`) lived here until 2026-09-18 as
+// `CLONED_PROPS` + `DERIVED_FROM` + `ARIA_ALIAS_KEYS`, feeding `slotDerived`. The clone itself is
+// `foldCloneOntoChild` in `SymbioteFabricProps.cpp`, so the list had stopped being the rule and
+// become a MIRROR of `kNativeFeedbackClonedKeys` — two lists that must agree, failing silently (the
+// clone goes stale on the one prop a list forgot) when they drift.
+//
+// `SLOT_DERIVED_ALL` is both the honest spelling and the cheaper one to keep: a `cloneElement` owner
+// re-clones on every render whatever changed, so it never derived its slot from a NAMED set in the
+// first place. The cost is a false dirty on an owner prop the clone does not carry, and for this tag
+// that is nearly empty — its owner is an anchor whose props reach Fabric nowhere else, so every name
+// it holds is either cloned or consumed by the press machine.
+const SLOT_DERIVED = [SLOT_DERIVED_ALL];
 // The two RN clones as EVENTS rather than props (:386-387). Owned, so the app's callback stashes on
 // the owner and a trampoline installed on the child reads it at dispatch time — which keeps a fresh
 // closure per render free, exactly as `ownedListeners` intends.
@@ -129,33 +101,11 @@ const PRESS_LISTENERS = [
     'responderMove',
     'responderTerminationRequest',
 ];
-function stringOr(value) {
-    return typeof value === 'string' ? value : undefined;
-}
-// The background dicts our own factories produce, narrowed on the discriminant rather than cast.
-// Anything else reads as "not supplied", which is RN's `background === undefined` branch.
-function asFeedbackBackground(value) {
-    if (typeof value !== 'object' || value === null)
-        return undefined;
-    const type = Reflect.get(value, 'type');
-    if (type !== 'ThemeAttrAndroid' && type !== 'RippleAndroid')
-        return undefined;
-    const attribute = Reflect.get(value, 'attribute');
-    const rippleRadius = Reflect.get(value, 'rippleRadius');
-    const radius = typeof rippleRadius === 'number' ? rippleRadius : undefined;
-    if (type === 'ThemeAttrAndroid') {
-        return attribute === 'selectableItemBackgroundBorderless'
-            ? { type, attribute, rippleRadius: radius }
-            : { type, attribute: 'selectableItemBackground', rippleRadius: radius };
-    }
-    const color = Reflect.get(value, 'color');
-    return {
-        type,
-        color: typeof color === 'string' ? color : null,
-        borderless: Reflect.get(value, 'borderless') === true,
-        rippleRadius: radius,
-    };
-}
+// `asFeedbackBackground` went with the fold, and `backgroundProps` — the slot pick it fed — followed
+// on 2026-09-18 as the orphan it had become. The first narrowed the app's `background` dict on its
+// 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];
@@ -207,47 +157,16 @@ export const nativeFeedbackRefinement = (node, config) => {
         },
     };
 };
-/**
- * `cloneElement(element, {…})` as a payload fold: the child's own props first, the owner's clone
- * list over them.
- *
- * OVERWRITING WITH `undefined` IS DELIBERATE and is RN's behaviour, not an accident of the spread.
- * React's `cloneElement` assigns every key of its config, so a TNF with no `accessibilityLabel`
- * clears the child's; `fabricProps` skips undefined values, which reproduces that exactly.
- *
- * Pure, as `IPayloadFold` requires — the owner is read, never written.
- */
-function cloneFold(owner, inner) {
-    return (props) => {
-        const next = {
-            ...(inner === undefined ? props : inner(props)),
-        };
-        // The owner's aria props are on the OWNER, so the engine's own fold at `fabricProps` — which
-        // reads the node being committed — never sees them. Run it here over the source bag instead of
-        // restating any of `:349-390`'s aria half; `hasAriaAlias` is the same sticky gate `fabricProps`
-        // uses, and the fold returns its input by identity when there is nothing to do.
-        const source = owner.hasAriaAlias
-            ? foldAriaProps(owner.props)
-            : owner.props;
-        for (const key of CLONED_PROPS)
-            next[key] = source[key];
-        // :369-372. `onPress` is an OWNED name, so it lives in the stash and never in `props`.
-        const disabled = booleanOr(source.disabled);
-        next.accessible = accessibleUnlessOptedOut(source);
-        next.focusable = resolveTouchableFocusable(booleanOr(source.focusable), appListenerFor(owner, 'press') !== undefined, disabled);
-        // :373. RN gives `id` unconditional priority over `nativeID`.
-        next.nativeID = stringOr(source.id) ?? stringOr(source.nativeID);
-        // :318-323 folded by the engine above, then :324-330: an explicit `disabled` overrides the
-        // aria/accessibilityState answer. Same helper every wrapper calls, so both paths agree.
-        next.accessibilityState = resolveDisabledAccessibilityState(asAccessibilityState(source.accessibilityState), disabled);
-        // :343-348 + :402. `getBackgroundProp` returns null off Android, so nothing is spread there.
-        if (IS_ANDROID) {
-            Object.assign(next, backgroundProps(asFeedbackBackground(source.background) ?? selectableBackground(), source.useForeground === true));
-        }
-        return next;
-    };
-}
-// Not RN's own list: RN drops these by never cloning them, and a lowered tag has no clone to omit
+// `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
+// rather than on the node's own (`IOwner`). The child of a TNF is whatever the app wrote, usually a
+// plain `<view>` with no tag at all, so nothing self-keyed could ever have reached it.
+//
+// What it cost to have had here: one JSI round trip per touchable per commit over an eighteen-key
+// bag, and `tag-rule-cost.itest.ts` prices a fold by what it MARSHALS rather than by what it does.
+//
+// Contract: `core/engine/cpp/tests/js/clone-onto-child-payload.itest.ts`.
+// Not RN's own list: RN drops these by never cloning them, and a tag has no clone to omit
 // them from — they would ride into the child's payload as keys no ViewConfig declares. Same strip
 // `./pressable`'s fold does for the machine-only half, applied to the owner's bag instead.
 //
@@ -272,6 +191,7 @@ function arm(owner, child) {
     attachPressMachine(child, {
         source: owner,
         refine: nativeFeedbackRefinement,
+        disabledOf: touchableNativeFeedbackDisabled,
     });
     for (const name of FORWARDED_LISTENERS) {
         forwardListener(owner, child, name, appListenerFor(owner, name) !== undefined);
@@ -296,9 +216,10 @@ function onChildInserted(node, child) {
     if (previous !== undefined)
         detachPressMachine(previous);
     node.childHost = child;
-    child.payloadFold = cloneFold(node, child.payloadFold);
     // The owner's props were very likely written BEFORE this child existed (React and Solid set props
-    // at createInstance), so the fold owes a run even though nothing was written since.
+    // at createInstance), so the CLONE owes a run even though nothing was written since. Still owed
+    // now that the rule is in C++ and no fold is chained here: the rule runs on the child's commit,
+    // and a child nothing dirtied has no commit.
     markPropsDirty(child);
     arm(node, child);
 }

package/build/behaviors/touchable-opacity.js

@@ -18,10 +18,17 @@
 //
 // REGISTRATION IS THE HAZARD, not the machine — see `./pressable` for why each adapter's entry
 // does a bare `import './register';` that the barrel does not re-export.
-import { AnimatedMock, AnimatedValue, Easing, Platform, appListenerFor, dlog, getExplicitStyle, markPropsDirty, registerHostBehavior, requestCommitFor, setAnimatedBehaviorStyle, timing, } from '@symbiote-native/engine';
-import { resolveTouchableFocusable } from '../view/render-pressable/index.js';
-import { accessibleUnlessOptedOut, booleanOr, createPressBehavior, } from './pressable.js';
-import { createTouchableFeedbackHandlers, createTouchableFeedbackRuntime, DEFAULT_ACTIVE_OPACITY, OPACITY_ACTIVE_GRANT_DURATION_MS, OPACITY_INACTIVE_DURATION_MS, RESTING_OPACITY, restingOpacityFromStyle, TOUCHABLE_MIN_PRESS_DURATION_MS, } from '../state/touchable.js';
+//
+// TODO(rn-parity, low priority): `TouchableOpacity.js:197-220` gates the active/inactive opacity
+// fade on `onFocus`/`onBlur` too (TV remote focus fires the same fade `onPress` triggers). Neither
+// name is wired into the feedback machine here; they pass through as ordinary, un-intercepted
+// event props. Deliberately not implemented — dead on every device this project targets (no tvOS
+// build, no example app; iOS/Android are the only targets). Audit skill, "Found, NOT fixed: TV
+// (Platform.isTV) focus/blur feedback on TouchableOpacity/Highlight".
+import { AnimatedMock, AnimatedValue, Easing, Platform, dlog, getExplicitStyle, markPropsDirty, registerHostBehavior, requestCommitFor, setAnimatedBehaviorStyle, timing, propOf, propsOf, } from '@symbiote-native/engine';
+import { resolveButtonDisabled } from '../view/render-button.js';
+import { asAccessibilityState, booleanOr, createPressBehavior, } from './pressable.js';
+import { createTouchableFeedbackHandlers, createTouchableFeedbackRuntime, DEFAULT_ACTIVE_OPACITY, OPACITY_ACTIVE_DURATION_MS, OPACITY_ACTIVE_GRANT_DURATION_MS, OPACITY_INACTIVE_DURATION_MS, RESTING_OPACITY, restingOpacityFromStyle, TOUCHABLE_MIN_PRESS_DURATION_MS, } from '../state/touchable.js';
 export const TOUCHABLE_OPACITY_TAG = 'touchable-opacity';
 const states = new WeakMap();
 // `modules/animated`'s barrel swaps the whole driver namespace for the mock when the host reports
@@ -58,13 +65,13 @@ const refine = (node, config) => {
     if (state === undefined)
         return config;
     const resting = restingOpacityOf(node);
-    const activeOpacity = numberOr(node.props.activeOpacity, DEFAULT_ACTIVE_OPACITY);
+    const activeOpacity = numberOr(propOf(node, 'activeOpacity'), DEFAULT_ACTIVE_OPACITY);
     const handlers = createTouchableFeedbackHandlers({
-        delayPressIn: numberOr(node.props.delayPressIn, 0),
-        delayPressOut: numberOr(node.props.delayPressOut, 0),
+        delayPressIn: numberOr(propOf(node, 'delayPressIn'), 0),
+        delayPressOut: numberOr(propOf(node, 'delayPressOut'), 0),
         // Read raw rather than off `config`, which has already defaulted the absent case to the press
         // machine's own 130 ms — a floor RN's Touchables never see (TOUCHABLE_MIN_PRESS_DURATION_MS).
-        minPressDuration: numberOr(node.props.minPressDuration, TOUCHABLE_MIN_PRESS_DURATION_MS),
+        minPressDuration: numberOr(propOf(node, 'minPressDuration'), TOUCHABLE_MIN_PRESS_DURATION_MS),
         schedule: (callback, ms) => {
             const id = setTimeout(() => {
                 state.timers.delete(id);
@@ -79,9 +86,14 @@ const refine = (node, config) => {
         now: Date.now,
     }, state.runtime, {
         activate(event) {
-            // 0, not 150 (TouchableOpacity.js:215-220): the duration is chosen by where the press-in
-            // came from, and every pressIn our engine produces is the grant-equivalent.
-            fadeTo(state, activeOpacity, OPACITY_ACTIVE_GRANT_DURATION_MS);
+            // TouchableOpacity.js:215-220 picks the duration from WHERE the press-in came from: our
+            // engine's own 'pressIn' event (an ordinary grant, or its delayed replay) is the 0ms leg;
+            // a drift-out/drift-back-in reactivation arrives as 'responderMove'
+            // (`state/pressable.ts`'s `handleResponderMove`) and gets the 150ms ease-back-in instead.
+            const duration = event.type === 'responderMove'
+                ? OPACITY_ACTIVE_DURATION_MS
+                : OPACITY_ACTIVE_GRANT_DURATION_MS;
+            fadeTo(state, activeOpacity, duration);
             config.onPressIn?.(event);
         },
         deactivate(event) {
@@ -98,25 +110,11 @@ const refine = (node, config) => {
         onPressOut: handlers.handlePressOut,
     };
 };
-const press = createPressBehavior(refine);
-// The `id -> nativeID` alias every primitive's spec entry declares, applied here because
-// `HOST_PRIMITIVES` deliberately withholds this primitive's entry until the other adapters'
-// wrappers collapse to one node (the note at its Pressable neighbour says why). A raw `id` is a key
-// no ViewConfig declares, so Fabric drops it and the nativeID is lost on device with nothing red.
-//
-// Unconditional priority when both are set, matching RN (`View.js:77-79`) and `foldHostBag`.
-const foldPayload = props => {
-    const folded = press.foldPayload === undefined ? props : press.foldPayload(props);
-    const next = { ...folded };
-    // TouchableOpacity.js:303. The tag is this primitive's only path, so unlike `pressable` there is
-    // no wrapper for it to disagree with.
-    next.accessible = accessibleUnlessOptedOut(props);
-    if (Object.hasOwn(next, 'id')) {
-        next.nativeID = next.id;
-        delete next.id;
-    }
-    return next;
-};
+// TouchableOpacity.js:186-189 — `disabled ?? aria-disabled ?? accessibilityState.disabled`, the
+// same three-way answer Button resolves, just never wired to this tag's OWN registration before.
+// Without it, a caller who sets only `accessibilityState={{disabled: true}}` (no `disabled` prop)
+// gets the greyed-out RN look but a press that still fires here — RN suppresses it.
+const touchableOpacityDisabled = props => resolveButtonDisabled(booleanOr(props.disabled), booleanOr(props['aria-disabled']), asAccessibilityState(props.accessibilityState));
 /**
  * The behavior as PARTS, so a tag that is a TouchableOpacity plus something — `button`, which RN
  * builds as exactly that (Button.js:283) — composes the fade instead of re-implementing it.
@@ -126,11 +124,11 @@ const foldPayload = props => {
  */
 export function createTouchableOpacityBehavior(disabledOf) {
     // Its own machine rather than the module-level `press`, so a composing tag can say what
-    // `disabled` MEANS to it. `foldPayload` below is the same function either way.
+    // `disabled` MEANS to it — the answer feeds the machine, not a payload: the props half of that
+    // question is `foldPressableProps` in `SymbioteFabricProps.cpp` and reads the authored bag.
     const machine = createPressBehavior(refine, disabledOf);
     return {
         ...machine,
-        foldPayload,
         attach(node) {
             const state = {
                 opacity: new AnimatedValue(RESTING_OPACITY),
@@ -157,14 +155,28 @@ export function createTouchableOpacityBehavior(disabledOf) {
             // (Button.js:331,337), so reading the prop here left an aria-only flip un-settled — the view
             // stayed at its active opacity while the press was already suppressed. RN's Button has no
             // such gap because it passes the resolved value DOWN as its touchable's prop.
-            const disabled = disabledOf?.(node.props) ?? node.props.disabled;
+            const props = propsOf(node);
+            const disabled = disabledOf?.(props) ?? props.disabled;
             const previous = state.settled;
             state.settled = { disabled, resting };
             if (previous === undefined) {
-                // RN's `Animated.View` carries `{opacity: anim}` in its style from the FIRST render, so a
-                // resting Touchable commits the key too — a tag that published nothing until the first
-                // press would differ from every wrapper on mount. Set rather than animate: this is the
-                // mount, and RN re-settles on componentDidUpdate only.
+                // NOT vendor parity, despite this comment's old claim: `TouchableOpacity-itest.js` ("does
+                // not render explicit opacity when using default") proves a resting, untouched
+                // TouchableOpacity commits no `opacity` key at all. Vendor's native-animated leaf is a
+                // separate channel from the ordinary style diff, so forcing non-flattening never implies
+                // publishing a value. Ours publishes anyway: `setAnimatedBehaviorStyle`/`bindAnimatedValue`
+                // (`host-binding.ts`) force `collapsable: false` and resolve+write the leaf's value in the
+                // SAME call. Untangling that is a change to shared animation infrastructure, not a one-line
+                // fix here — deferred, see the audit skill. Set rather than animate: this is the mount, and
+                // RN re-settles on componentDidUpdate only.
+                //
+                // TODO(rn-parity): skip this initial publish when `resting === RESTING_OPACITY` (1, Fabric's
+                // own opacity default) and no authored `style.opacity` needs another route to Fabric, so a
+                // resting default TouchableOpacity commits no `opacity` key — matching vendor. Needs
+                // `bindAnimatedValue`/`host-binding.ts` to separate "force collapsable:false" from "publish
+                // the leaf's value" (shared by every animated-behavior consumer, not just this tag), plus a
+                // new test for the untouched-default case (no existing case in touchable-opacity.test.ts
+                // covers it — every case authors an explicit style.opacity first).
                 state.opacity.setValue(resting);
                 return;
             }
@@ -189,21 +201,28 @@ export function createTouchableOpacityBehavior(disabledOf) {
         },
     };
 }
-// `focusable` is NOT in `foldPayload` above, because its middle leg — `onPress !== undefined`
-// (TouchableOpacity.js:338) — is an OWNED name and therefore lives in the stash, which a props-only
-// fold cannot reach. `./button` composes this behavior and resolves its own; the tag resolves it
-// here, over the node.
+// THIS TAG NOW COSTS ZERO TRIPS INTO JS (2026-09-18). `focusable` was the last thing here, and it
+// held out because its middle leg — `onPress !== undefined` (TouchableOpacity.js:338) — is an OWNED
+// name that lives in the stash and never becomes a prop, so a props-only rule could not see it.
 //
-// `props.disabled`, not `next.disabled`: the press fold strips it (MACHINE_ONLY_KEYS).
-function tagFold(node) {
-    return props => {
-        const next = foldPayload(props);
-        next.focusable = resolveTouchableFocusable(booleanOr(props.focusable), appListenerFor(node, 'press') !== undefined, booleanOr(props.disabled));
-        return next;
-    };
-}
-// A listener flip changes no payload by itself, so the commit after it is a no-op and no fold
-// re-runs (`IHostBehavior.onOwnedListenerChange`). `./button` carries the twin of this.
+// What moved was not the closure but ONE BIT. `setEventListener` already knew the flip (it computes
+// `wasWired !== isHandler` to fire `onOwnedListenerChange`); it now also records
+// `OP_SET_OWNED_LISTENER`, and `foldPressableProps` resolves the whole three-leg expression off the
+// node. The callback itself never left JS and never will — that is the split a browser draws too,
+// where the UA knows which elements carry a click handler and the handler's body stays the page's.
+//
+// So "a rule cannot read an owned listener" was two claims wearing one sentence, and only the one
+// about the FUNCTION was true. Contract:
+// `core/engine/cpp/tests/js/touchable-focusable-payload.itest.ts`.
+//
+// `./button` keeps its own fold and its own resolution, deliberately: it resolves `disabled` three
+// ways through the projection its derived children share, and it folds an Android view style and
+// ripple regardless — so moving only its `focusable` would duplicate that precedence and buy back
+// no crossing.
+// STILL NEEDED, and for a reason the wire did not remove: `markDirty` on the host marks the node
+// whose payload must be rebuilt, but the COMMIT still has to be asked for. A listener flip changes
+// no prop on this side, so nothing else would schedule one and the new answer would sit in the host
+// until some unrelated write happened to dirty the node.
 function onOwnedListenerChange(node, name) {
     if (name !== 'press')
         return;
@@ -212,16 +231,9 @@ function onOwnedListenerChange(node, name) {
 }
 // Idempotent: an adapter entry may be imported more than once in a bundle.
 export function registerTouchableOpacityBehavior() {
-    const touchable = createTouchableOpacityBehavior();
+    const touchable = createTouchableOpacityBehavior(touchableOpacityDisabled);
     registerHostBehavior(TOUCHABLE_OPACITY_TAG, {
         ...touchable,
-        // `attachHostBehavior` writes `behavior.foldPayload` into the field one line BEFORE it calls
-        // `attach`, so binding here is what stands. Only the TAG binds it — a composing behavior owns
-        // its own node's fold (`./button` sets one in `buildStructure`, which runs later still).
-        attach(node) {
-            touchable.attach(node);
-            node.payloadFold = tagFold(node);
-        },
         onOwnedListenerChange,
     });
 }