@symbiote-native/components 0.5.0 → 2.0.0

package/build/behaviors/touchable-highlight.js

@@ -0,0 +1,192 @@
+// 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
+// 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.
+//
+// WHAT IS SHARED AND WHAT IS NEW. The underlay show/hide state machine
+// (createHighlightUnderlayHandlers/createHighlightUnderlayRuntime, `../state/touchable`) is already
+// framework-agnostic — every wrapper already calls it. New here is only WHERE `shown` lives (a
+// WeakMap keyed by node, the same shape `./touchable-opacity`'s `states` map uses) and how a flip
+// reaches Fabric: `markPropsDirty` + `requestCommitFor`, the same primitives `./pressable`'s
+// `setPressed` composer uses to re-fold after an internal state change — NOT
+// `setAnimatedBehaviorStyle`, which exists for a continuously-driven `AnimatedValue` and would be
+// the wrong tool for a discrete boolean swap with no easing.
+//
+// The press machine is `./pressable`'s, composed through `createPressBehavior` — one node may hold
+// exactly one press machine, so this tag must not also register the plain `pressable` behavior.
+//
+// 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';
+import { createHighlightUnderlayHandlers, createHighlightUnderlayRuntime, hasTouchablePressHandler, } from '../state/touchable.js';
+import { resolveHighlightExtraStyles } from '../view/render-touchable-highlight.js';
+export const TOUCHABLE_HIGHLIGHT_TAG = 'touchable-highlight';
+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.
+const refine = (node, config) => {
+    const state = states.get(node);
+    if (state === undefined)
+        return config;
+    const hasPressHandler = hasTouchablePressHandler({
+        onPress: config.onPress,
+        onPressIn: config.onPressIn,
+        onPressOut: config.onPressOut,
+        onLongPress: config.onLongPress,
+    });
+    const underlay = createHighlightUnderlayHandlers({
+        delayPressOut: numberOr(node.props.delayPressOut, 0),
+        hasPressHandler,
+        schedule: (callback, ms) => {
+            const id = setTimeout(() => {
+                state.timers.delete(id);
+                callback();
+            }, ms);
+            state.timers.add(id);
+            return () => {
+                clearTimeout(id);
+                state.timers.delete(id);
+            };
+        },
+    }, state.runtime, {
+        setShown: (shown) => {
+            if (state.shown === shown)
+                return;
+            state.shown = shown;
+            markPropsDirty(node);
+            requestCommitFor(node);
+        },
+        onShowUnderlay: () => {
+            const onShowUnderlay = node.props.onShowUnderlay;
+            if (typeof onShowUnderlay === 'function')
+                onShowUnderlay();
+        },
+        onHideUnderlay: () => {
+            const onHideUnderlay = node.props.onHideUnderlay;
+            if (typeof onHideUnderlay === 'function')
+                onHideUnderlay();
+        },
+    });
+    return {
+        ...config,
+        // TouchableHighlight.js:203, verbatim: RN hands Pressability a 0 floor here too — what holds
+        // the underlay visible is the hold TIMER above, not a press-duration floor.
+        minPressDuration: 0,
+        onPress: (event) => {
+            underlay.handlePress(event);
+            config.onPress?.(event);
+        },
+        onPressIn: (event) => {
+            underlay.handlePressIn(event);
+            config.onPressIn?.(event);
+        },
+        onPressOut: (event) => {
+            underlay.handlePressOut(event);
+            config.onPressOut?.(event);
+        },
+    };
+};
+// `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;
+    };
+}
+// 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) {
+    if (name !== 'press')
+        return;
+    markPropsDirty(node);
+    requestCommitFor(node);
+}
+/**
+ * The behavior as PARTS, mirroring `./touchable-opacity`'s shape — a tag that is a
+ * TouchableHighlight plus something composes this instead of re-implementing the underlay.
+ */
+export function createTouchableHighlightBehavior(disabledOf) {
+    const machine = createPressBehavior(refine, disabledOf);
+    return {
+        ...machine,
+        foldPayload,
+        attach(node) {
+            states.set(node, {
+                shown: false,
+                runtime: createHighlightUnderlayRuntime(),
+                timers: new Set(),
+            });
+            machine.attach(node);
+        },
+        detach(node) {
+            machine.detach(node);
+            const state = states.get(node);
+            if (state === undefined)
+                return;
+            for (const id of state.timers)
+                clearTimeout(id);
+            state.timers.clear();
+            states.delete(node);
+        },
+    };
+}
+// Idempotent: an adapter entry may be imported more than once in a bundle.
+export function registerTouchableHighlightBehavior() {
+    const touchable = createTouchableHighlightBehavior();
+    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.d.ts

@@ -0,0 +1,20 @@
+import { type IPressConfigRefinement } from './pressable';
+export declare const TOUCHABLE_NATIVE_FEEDBACK_TAG = "touchable-native-feedback";
+/**
+ * TNF's own Pressability config, applied to whatever node carries the responder.
+ *
+ * SHARED WITH `./button`, which is what this file's arrival makes possible. Button's Android arm
+ * held a private copy with a comment saying a future `touchable-native-feedback` tag could not
+ * reuse it "while the wrappers wrap" — the tag is here now and the responder node is a parameter
+ * either way, so the copy is gone.
+ *
+ * `minPressDuration: 0` is UNCONDITIONAL in RN (:226), not Android-gated: TNF has no feedback
+ * machine of its own to hold, and the press machine's 130 ms deactivation floor would only defer
+ * `onPressOut` — which on Android leaves `setPressed(false)` ~130 ms late and the ripple lit after
+ * the finger is gone. The two view commands ARE Android-gated (:257,:276): the ripple is a drawable
+ * Android animates off the view's pressed state, and the JS responder consumes the touch before
+ * Android's own pressed handling ever runs, so without them the background is installed and never
+ * moves.
+ */
+export declare const nativeFeedbackRefinement: IPressConfigRefinement;
+export declare function registerTouchableNativeFeedbackBehavior(): void;

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

@@ -0,0 +1,333 @@
+// TouchableNativeFeedback as an ENGINE-NODE behavior — the one primitive that must commit NO NODE
+// OF ITS OWN (`.claude/rules/host-primitive-tier.md`, tier 2).
+//
+// RN'S TNF RENDERS NOTHING. `render()` takes `React.Children.only(this.props.children)`
+// (TouchableNativeFeedback.js:289) and returns `cloneElement(element, {…}, ...children)` (:339) —
+// the child IS the responder, carries the ripple background, and takes the whole accessibility
+// fold. All five of our adapters render a `Pressable` around a feedback `View` instead, so every
+// TNF in every app commits a node RN does not, and the mistake has already spread: our Pressable
+// wrapper and our TouchableOpacity wrapper both copied that inner view from here
+// (`.claude/rules/adapter-parity-audit.md`, "the OTHER half turned up a gap on BOTH paths").
+//
+// WHY THE FIX CANNOT BE PER ADAPTER. At the FRAMEWORK level React, Vue and Solid can clone a child
+// element; Svelte's children arrive as a snippet and Angular's through `<ng-content>`, and neither
+// can have props written onto them there. At the ENGINE level all five can reach the child node.
+// So the clone belongs below the frameworks, once, or it is five copies of one fold.
+//
+// ---------------------------------------------------------------------------------------------
+// THE SHAPE, and which existing engine seam does each half:
+//
+//   commits nothing     the tag resolves to ANCHOR_COMPONENT (component-names), so the node is
+//                       BORN skipped: `renderableChildren` (commit.ts) drops it and flattens its
+//                       child into the grandparent's renderable list. Not a new concept — that is
+//                       precisely what an anchor is, and TNF is its third instance after Vue's
+//                       fragment placeholders and Angular's non-painting component hosts.
+//   finds its child     `onChildInserted`, the one hook this needed. `buildStructure` cannot do it:
+//                       it runs at `attach`, inside `createElement`, and the child is the
+//                       FRAMEWORK'S and does not exist yet.
+//   clones the props    a `payloadFold` on the CHILD reading the owner's bag, re-run because
+//                       `slotDerived` marks the child's props dirty on every owner write. The
+//                       alternative — redirecting each prop onto the child through `slotPropsExcept`
+//                       — was rejected: adapters disagree about ORDER (React writes props before
+//                       children, Vue mounts children before props), so a redirect silently drops
+//                       every prop written before the child arrives, on some adapters only.
+//   presses             the press machine on the CHILD, reading the OWNER (`attachPressMachine`'s
+//                       `source`). It cannot live on the owner: `bubble` (events/index.ts) skips
+//                       anchors for listener lookup, and `handOverNativeResponder` has no Fabric
+//                       handle to hand native for an uncommitted node. So a responder on this tag
+//                       could never fire — checked before the design, not after.
+// ---------------------------------------------------------------------------------------------
+// KNOWN LIMITS, stated rather than left to be found:
+//
+// 1. EXACTLY ONE CHILD, as RN enforces with `React.Children.only`. A second child lands INSIDE the
+//    first (the ordinary `childHost` redirect) rather than throwing. Nothing in RN's surface
+//    produces that shape.
+// 2. A child REMOVED from a still-mounted TNF leaves its press machine armed until the TNF itself
+//    unmounts (`detach` releases whatever `childHost` then holds). Unreachable through the
+//    frameworks we drive: Solid's remove-then-reinsert move and Svelte's parking both move the TNF,
+//    never its single child, and there is no sibling to reorder it against.
+// 3. `style` is NOT cloned, matching RN — its clone list (:342-390) is closed, and a `style` on a
+//    TNF stays on a node that never commits. RN's TNF declares no style prop either.
+//
+// REGISTRATION IS THE HAZARD, not the machine — see `./pressable` for why each adapter entry does a
+// 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';
+export const TOUCHABLE_NATIVE_FEEDBACK_TAG = 'touchable-native-feedback';
+// 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,
+];
+// 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.
+//
+// Both are Fabric BOOLEAN-GATED events (`.claude/rules/fabric-boolean-event-gates.md`), so the
+// trampoline goes in only while the app has one wired: `setBehaviorListener` writes and clears the
+// flag with it, and installing eagerly would light the gate on every TNF child in the tree.
+const FORWARDED_LISTENERS = [
+    'layout',
+    'accessibilityAction',
+];
+const PRESS_LISTENERS = [
+    'press',
+    'pressIn',
+    'pressOut',
+    'pressMove',
+    'longPress',
+    'startShouldSetResponder',
+    '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,
+    };
+}
+// 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.
+ *
+ * SHARED WITH `./button`, which is what this file's arrival makes possible. Button's Android arm
+ * held a private copy with a comment saying a future `touchable-native-feedback` tag could not
+ * reuse it "while the wrappers wrap" — the tag is here now and the responder node is a parameter
+ * either way, so the copy is gone.
+ *
+ * `minPressDuration: 0` is UNCONDITIONAL in RN (:226), not Android-gated: TNF has no feedback
+ * machine of its own to hold, and the press machine's 130 ms deactivation floor would only defer
+ * `onPressOut` — which on Android leaves `setPressed(false)` ~130 ms late and the ripple lit after
+ * the finger is gone. The two view commands ARE Android-gated (:257,:276): the ripple is a drawable
+ * Android animates off the view's pressed state, and the JS responder consumes the touch before
+ * Android's own pressed handling ever runs, so without them the background is installed and never
+ * 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);
+        },
+    };
+};
+/**
+ * `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
+// 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.
+//
+// (`background` / `useForeground` / `disabled` / `hitSlop` never reach the child's props at all —
+// the fold only ever ADDS to the child's own bag — so nothing needs stripping here. Kept as a
+// comment rather than an empty constant so the next reader does not go looking for the strip.)
+// The app's callback, read at dispatch time so a fresh closure per render costs nothing.
+function trampolineFor(owner, name) {
+    return (event) => {
+        const listener = appListenerFor(owner, name);
+        if (typeof listener === 'function')
+            listener(event);
+    };
+}
+function forwardListener(owner, child, name, wired) {
+    setBehaviorListener(child, name, wired ? trampolineFor(owner, name) : undefined);
+}
+// The machine plus the forwarded listeners. Split from adoption because a parked subtree comes back
+// with its child and its fold intact but its machine torn down — `attach` re-runs this, and must
+// NOT re-chain the fold.
+function arm(owner, child) {
+    attachPressMachine(child, {
+        source: owner,
+        refine: nativeFeedbackRefinement,
+    });
+    for (const name of FORWARDED_LISTENERS) {
+        forwardListener(owner, child, name, appListenerFor(owner, name) !== undefined);
+    }
+}
+function attach(node) {
+    // First attach has no child yet; a re-attach after the sweep does. See `arm`.
+    if (node.childHost !== undefined)
+        arm(node, node.childHost);
+}
+function detach(node) {
+    const child = node.childHost;
+    if (child !== undefined)
+        detachPressMachine(child);
+}
+function onChildInserted(node, child) {
+    const previous = node.childHost;
+    if (previous === child)
+        return;
+    // A replaced child: release the machine still armed on the one that left. `removeChild` clears
+    // `childHost` (node.ts), so this only runs when a framework inserts without removing first.
+    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.
+    markPropsDirty(child);
+    arm(node, child);
+}
+// `focusable` is a function of a LISTENER, and a listener flip changes no payload by itself — so
+// the commit after it is a no-op and no fold re-runs (`IHostBehavior.onOwnedListenerChange`).
+function onOwnedListenerChange(node, name, wired) {
+    const child = node.childHost;
+    if (child === undefined)
+        return;
+    if (FORWARDED_LISTENERS.includes(name)) {
+        forwardListener(node, child, name, wired);
+        return;
+    }
+    if (name !== 'press')
+        return;
+    markPropsDirty(child);
+    requestCommitFor(child);
+}
+// Idempotent: an adapter entry may be imported more than once in a bundle.
+export function registerTouchableNativeFeedbackBehavior() {
+    const behavior = {
+        attach,
+        detach,
+        onChildInserted,
+        onOwnedListenerChange,
+        // Owned on the OWNER, which is where the app writes them, and read from there by the machine
+        // on the child (`attachPressMachine`'s `source`) and by the trampolines above.
+        ownedListeners: [...PRESS_LISTENERS, ...FORWARDED_LISTENERS],
+        slotDerived: SLOT_DERIVED,
+    };
+    registerHostBehavior(TOUCHABLE_NATIVE_FEEDBACK_TAG, behavior);
+}

package/build/behaviors/touchable-opacity.d.ts

@@ -0,0 +1,12 @@
+import { type IHostBehavior } from '@symbiote-native/engine';
+import { type IDisabledResolver } from './pressable';
+export declare const TOUCHABLE_OPACITY_TAG = "touchable-opacity";
+/**
+ * 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.
+ *
+ * Safe to hand to two tags: every piece of runtime is keyed by NODE (`states`), and `press` is
+ * itself already shared that way.
+ */
+export declare function createTouchableOpacityBehavior(disabledOf?: IDisabledResolver): IHostBehavior;
+export declare function registerTouchableOpacityBehavior(): void;