@symbiote-native/components 0.4.0 → 1.0.0

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

@@ -73,8 +73,9 @@ export interface IVirtualizedListHandle extends IScrollRoutingHandle {
     }): void;
 }
 export declare function readScrollOffset(event: ISymbioteEvent, horizontal: boolean): number | undefined;
+export declare function readLayoutOffset(event: ISymbioteEvent, horizontal: boolean): number | undefined;
 export declare function readLayoutLength(event: ISymbioteEvent, horizontal: boolean): number | undefined;
-export declare function buildOffsets(count: number, measured: Map<number, number>, fixedLayout: ((index: number) => ICellLayout) | undefined, averageLength: number): {
+export declare function buildOffsets(count: number, measured: Map<number, number>, measuredOffsets: Map<number, number>, fixedLayout: ((index: number) => ICellLayout) | undefined, averageLength: number, averageStride: number): {
     offsets: number[];
     lengths: number[];
     total: number;
@@ -96,7 +97,10 @@ export declare function throttleWindow(target: {
 export declare function visiblePercent(cellOffset: number, cellLength: number, scrollOffset: number, viewportLength: number): number;
 export declare function isCellViewable(percent: number, config: IViewabilityConfig): boolean;
 export declare function offsetForIndex(index: number, viewPosition: number, viewOffset: number, count: number, offsets: number[], lengths: number[], viewportLength: number): number;
+export declare const LAYOUT_EPSILON = 0.01;
+export declare function isSettledLayout(known: number | undefined, reported: number): boolean;
 export declare function averageMeasuredLength(measured: Map<number, number>): number;
+export declare function averageMeasuredStride(measuredOffsets: Map<number, number>, fallback: number): number;
 export declare function highestMeasuredIndex(measured: Map<number, number>): number;
 export declare function computeEndReached(total: number, scrollOffset: number, viewportLength: number, thresholdMultiplier: number): {
     distanceFromEnd: number;
@@ -152,7 +156,6 @@ export interface IListPlanParams {
     keyFor: (index: number) => string;
     stickyIndices?: ReadonlySet<number>;
     hasHeader: boolean;
-    hasSeparators: boolean;
 }
 export declare function buildListPlan(params: IListPlanParams): IListPlan;
 export type IMvcpAction = {

package/build/state/virtualized-list.js

@@ -65,6 +65,19 @@ export function readScrollOffset(event, horizontal) {
         return undefined;
     return readNumber(offset, horizontal ? 'x' : 'y');
 }
+// The cell's own position inside the scroll content, as the host reported it. Paired with
+// readLayoutLength at the same onLayout: this is the value buildOffsets stores VERBATIM, and it is
+// what lets the table describe where the content actually is rather than where a sum of heights
+// says it should be.
+export function readLayoutOffset(event, horizontal) {
+    const native = asRecord(event.nativeEvent);
+    if (native === undefined)
+        return undefined;
+    const layout = asRecord(native.layout);
+    if (layout === undefined)
+        return undefined;
+    return readNumber(layout, horizontal ? 'x' : 'y');
+}
 export function readLayoutLength(event, horizontal) {
     const native = asRecord(event.nativeEvent);
     if (native === undefined)
@@ -77,23 +90,53 @@ export function readLayoutLength(event, horizontal) {
 // Resolve every cell offset/length from the cache (or getItemLayout), filling gaps with
 // the running average so an unmeasured tail still has a plausible total. Returns the
 // per-index offset table plus the grand total extent.
-export function buildOffsets(count, measured, fixedLayout, averageLength) {
+//
+// THE COORDINATE SPACE IS THE HOST'S, NOT A MODEL'S. `measuredOffsets` holds each cell's raw y (x
+// when horizontal) exactly as onLayout reported it — content-container relative, so it carries the
+// container's padding, the list header, and whatever spacer stood above the cell at the time. A
+// measured cell is placed at that value VERBATIM. It is never re-derived from a neighbour, never
+// rebased onto a running sum. This is react-native's ListMetricsAggregator: `getCellMetricsApprox`
+// returns a laid-out cell's real frame untouched and approximates only what has never been seen.
+//
+// That "verbatim" is the whole safety property, and it is not a stylistic preference — it is the
+// fix for the canary going blank mid-scroll (diagnosed on device 2026-08-19). The table is not
+// merely an output: buildListPlan sizes the leading spacer from it, the host lays the window's
+// cells out below that spacer, and their measured y — spacer included — comes straight back in
+// here. It is a closed loop. Combining two measurements arithmetically inside that loop feeds the
+// model's own error back to itself: with a Yoga `gap` on the content container (the canary's .grid
+// has one) a spacer is an extra flex child, so its presence shifts the layout by one more gap than
+// any pure-arithmetic model predicts, and differencing two cells measured either side of that
+// change banks the difference. Measured, at one gap per recompute, unbounded — onScroll fires per
+// frame, so the spacer walks thousands of pixels away from reality within a second of dragging and
+// the window lands nowhere near the viewport. Regression test:
+// core/components/src/state/virtualized-list-feedback.test.ts.
+//
+// Unmeasured cells are the only place an estimate lives, and they advance by the average STRIDE
+// (measured cell-origin to cell-origin) rather than by the average LENGTH. A height is not the
+// distance to the next cell: separators, section gaps and container `gap` all live in between, and
+// sizing an unmeasured region by heights alone leaves it short by exactly that chrome.
+//
+// A fixed getItemLayout skips all of it — authoritative by contract, and its offsets are exact.
+export function buildOffsets(count, measured, measuredOffsets, fixedLayout, averageLength, averageStride) {
     const offsets = new Array(count);
     const lengths = new Array(count);
-    let running = EMPTY_OFFSET;
+    // What the average stride has left over once the average cell is accounted for: the chrome drawn
+    // BETWEEN two cells. Estimating with this rather than the stride itself keeps a cell whose own
+    // length IS known from being overwritten by an average — the stride is only ever used for the
+    // part nobody measured.
+    const interCellChrome = Math.max(EMPTY_OFFSET, averageStride - averageLength);
+    // Where the next cell goes when its own position has never been reported.
+    let cursor = EMPTY_OFFSET;
     for (let index = FIRST_INDEX; index < count; index += 1) {
-        offsets[index] = running;
-        let length;
-        if (fixedLayout !== undefined) {
-            length = fixedLayout(index).length;
-        }
-        else {
-            length = measured.get(index) ?? averageLength;
-        }
-        lengths[index] = length;
-        running += length;
+        const layout = fixedLayout?.(index);
+        const known = layout?.offset ?? measuredOffsets.get(index);
+        offsets[index] = known ?? cursor;
+        lengths[index] = layout?.length ?? measured.get(index) ?? averageLength;
+        cursor = offsets[index] + lengths[index] + interCellChrome;
     }
-    return { offsets, lengths, total: running };
+    const last = count - 1;
+    const total = count > FIRST_INDEX ? offsets[last] + lengths[last] : EMPTY_OFFSET;
+    return { offsets, lengths, total };
 }
 // Pick the resident window: every index whose box overlaps
 // [offset - buffer, offset + viewport + buffer]. The buffer is (windowSize - 1) / 2
@@ -103,7 +146,10 @@ export function computeWindow(count, offsets, lengths, scrollOffset, viewportLen
         return { first: FIRST_INDEX, last: NO_INDEX };
     // Before the viewport is known, paint a bounded prefix.
     if (viewportLength <= EMPTY_OFFSET) {
-        return { first: FIRST_INDEX, last: Math.min(count, initialNumToRender) - 1 };
+        return {
+            first: FIRST_INDEX,
+            last: Math.min(count, initialNumToRender) - 1,
+        };
     }
     const overscan = ((windowSize - 1) / 2) * viewportLength;
     const windowTop = scrollOffset - overscan;
@@ -149,7 +195,8 @@ export function isCellViewable(percent, config) {
     const itemThreshold = config.itemVisiblePercentThreshold;
     if (itemThreshold !== undefined)
         return percent >= itemThreshold;
-    const areaThreshold = config.viewAreaCoveragePercentThreshold ?? DEFAULT_VIEW_AREA_COVERAGE_PERCENT_THRESHOLD;
+    const areaThreshold = config.viewAreaCoveragePercentThreshold ??
+        DEFAULT_VIEW_AREA_COVERAGE_PERCENT_THRESHOLD;
     return percent > areaThreshold || percent >= FULLY_VISIBLE_PERCENT;
 }
 // Resolve an index to a pixel offset, optionally biasing where in the viewport the item
@@ -162,6 +209,24 @@ export function offsetForIndex(index, viewPosition, viewOffset, count, offsets,
     const positioned = cellOffset - viewPosition * (viewportLength - cellLength);
     return Math.max(EMPTY_OFFSET, positioned - viewOffset);
 }
+// Two layout readings are the SAME measurement unless they differ by more than this.
+//
+// A relayout does not reproduce a float bit-for-bit: the cell positions are derived from a spacer
+// height that is itself a float, so an onLayout that changed nothing observable still comes back a
+// few ulps off. Compared with ===, every one of those counts as a change — the reducer stores it,
+// the spacer derived from it moves in its last bits, Fabric commits the new value, Yoga relays out,
+// and the fresh onLayout starts the next turn. A loop at frame rate, from a difference no screen
+// can show. Device-measured 2026-08-19: 1203 recomputes over one short drag, its log full of
+// `27.33 -> 27.33 (-0.00)`.
+//
+// The smallest change a host can actually express is one device pixel — a third of a point at @3x —
+// so this sits ~30x below any real move and ~1e11 above the noise.
+export const LAYOUT_EPSILON = 0.01;
+// `known` is optional because a first measurement has nothing to settle against, and must count as
+// a change.
+export function isSettledLayout(known, reported) {
+    return known !== undefined && Math.abs(known - reported) < LAYOUT_EPSILON;
+}
 // Running average of known cell lengths, used to size not-yet-measured cells and the
 // trailing spacer so the total is plausible before full measurement.
 export function averageMeasuredLength(measured) {
@@ -172,6 +237,27 @@ export function averageMeasuredLength(measured) {
         sum += length;
     return sum / measured.size;
 }
+// Average origin-to-origin distance between two ADJACENT measured cells — the length plus whatever
+// chrome the list draws in the gap (a separator, a section gap, the content container's Yoga
+// `gap`). Only adjacent pairs qualify: across a hole the distance covers cells nobody measured.
+//
+// This is what an unmeasured cell advances by, and it is deliberately not averageMeasuredLength.
+// Sizing an unmeasured region by heights alone makes the model shorter than the content, so the
+// spacer standing in for that region under-reserves and everything below it slides up — the
+// jump-and-return the canary showed before the offsets became host-absolute. Falls back to the
+// length average while no adjacent pair has been measured yet.
+export function averageMeasuredStride(measuredOffsets, fallback) {
+    let sum = EMPTY_OFFSET;
+    let pairs = EMPTY_OFFSET;
+    for (const [index, offset] of measuredOffsets) {
+        const next = measuredOffsets.get(index + 1);
+        if (next === undefined)
+            continue;
+        sum += next - offset;
+        pairs += 1;
+    }
+    return pairs === EMPTY_OFFSET ? fallback : sum / pairs;
+}
 // The largest index whose length has actually been measured (RN
 // ListMetricsAggregator.getHighestMeasuredCellIndex). NO_INDEX when nothing is measured.
 export function highestMeasuredIndex(measured) {
@@ -204,7 +290,10 @@ export function computeStartReached(scrollOffset, viewportLength, thresholdMulti
 export function buildViewabilityPairs(onViewableItemsChanged, viewabilityConfig, pairs) {
     const result = [];
     if (onViewableItemsChanged !== undefined) {
-        result.push({ viewabilityConfig: viewabilityConfig ?? {}, onViewableItemsChanged });
+        result.push({
+            viewabilityConfig: viewabilityConfig ?? {},
+            onViewableItemsChanged,
+        });
     }
     if (pairs !== undefined)
         result.push(...pairs);
@@ -219,10 +308,13 @@ export function computeViewableSet(params) {
     for (let index = params.first; index <= params.last && index < params.count; index += 1) {
         const percent = visiblePercent(params.offsets[index], params.lengths[index], params.scrollOffset, params.viewportLength);
         const item = params.getItem(params.data, index);
-        const key = params.keyExtractor ? params.keyExtractor(item, index) : String(index);
+        const key = params.keyExtractor
+            ? params.keyExtractor(item, index)
+            : String(index);
         let anyViewable = false;
         for (const pair of params.pairs) {
-            if (pair.viewabilityConfig.waitForInteraction === true && !params.hasInteracted) {
+            if (pair.viewabilityConfig.waitForInteraction === true &&
+                !params.hasInteracted) {
                 continue;
             }
             if (isCellViewable(percent, pair.viewabilityConfig)) {
@@ -299,22 +391,33 @@ export function buildListPlan(params) {
     const forcedStickyCell = closestStickyIndex === NO_INDEX
         ? undefined
         : { index: closestStickyIndex, key: params.keyFor(closestStickyIndex) };
-    const windowLeadingExtent = params.first > FIRST_INDEX ? params.offsets[params.first] : EMPTY_OFFSET;
-    const leadingExtent = forcedStickyCell === undefined ? windowLeadingExtent : params.offsets[closestStickyIndex];
+    // A spacer stands in for a contiguous run of cells, so its extent is the distance from the first
+    // of them to the far edge of the last — a difference between two positions the host itself
+    // reported, never a sum of heights. That is what carries the chrome BETWEEN those cells
+    // (separators, section gaps, the container's Yoga `gap`) without the model having to know it
+    // exists, and it is why the spacer lands the following cell exactly where it already was: the
+    // spacer occupies one child slot, precisely as the region it replaces began and ended on a cell
+    // boundary. Summing heights instead under-reserves by the chrome; rebasing onto a running model
+    // re-introduces the feedback loop buildOffsets exists to avoid.
+    const regionExtent = (from, to) => to < from
+        ? EMPTY_OFFSET
+        : params.offsets[to] + params.lengths[to] - params.offsets[from];
+    const windowLeadingExtent = regionExtent(FIRST_INDEX, params.first - 1);
+    const leadingExtent = forcedStickyCell === undefined
+        ? windowLeadingExtent
+        : regionExtent(FIRST_INDEX, closestStickyIndex - 1);
     const gapExtent = forcedStickyCell === undefined
         ? EMPTY_OFFSET
-        : windowLeadingExtent -
-            params.offsets[closestStickyIndex] -
-            params.lengths[closestStickyIndex];
-    const renderedExtent = params.last >= params.first
-        ? params.offsets[params.last] + params.lengths[params.last] - params.offsets[params.first]
+        : regionExtent(closestStickyIndex + 1, params.first - 1);
+    const trailingExtent = params.last < params.count - 1
+        ? params.total - params.offsets[params.last + 1]
         : EMPTY_OFFSET;
-    const trailingExtent = params.total - windowLeadingExtent - renderedExtent;
     const stickyChildPositions = [];
     // The header (when present) is child 0; the leading spacer (when non-empty) is the next
-    // child; the forced sticky cell (when present) plus its own gap spacer follow. Each cell
-    // is one child; a separator after it (when ItemSeparatorComponent is set and this is not
-    // the last cell) is another.
+    // child; the forced sticky cell (when present) plus its own gap spacer follow. Each cell is
+    // EXACTLY one child — an ItemSeparatorComponent rides INSIDE the cell's own measuring wrapper
+    // (RN VirtualizedListCellRenderer.js:218-221), so it neither shifts these positions nor shows
+    // up in the geometry as chrome the spacers would have to account for separately.
     let childPosition = (params.hasHeader ? 1 : 0) + (leadingExtent > EMPTY_OFFSET ? 1 : 0);
     if (forcedStickyCell !== undefined) {
         stickyChildPositions.push(childPosition);
@@ -325,8 +428,6 @@ export function buildListPlan(params) {
         if (params.stickyIndices?.has(index) === true)
             stickyChildPositions.push(childPosition);
         childPosition += 1;
-        if (params.hasSeparators && index < params.last)
-            childPosition += 1;
     }
     return {
         leadingExtent,
@@ -348,7 +449,9 @@ export function computeMvcpAdjustment(params) {
         firstVisibleKey: newFirstVisibleKey,
         action: { kind: 'none' },
     };
-    if (prevKey === null || newFirstVisibleKey === null || prevKey === newFirstVisibleKey) {
+    if (prevKey === null ||
+        newFirstVisibleKey === null ||
+        prevKey === newFirstVisibleKey) {
         return settled;
     }
     let anchorIndex = NO_INDEX;
@@ -373,7 +476,10 @@ export function computeMvcpAdjustment(params) {
     const anchoredNearTop = autoThreshold !== undefined && params.scrollOffset <= autoThreshold;
     if (anchoredNearTop) {
         dlog(`VirtualizedList MVCP autoscroll-to-top (offset=${params.scrollOffset} <= ${autoThreshold})`);
-        return { firstVisibleKey: newFirstVisibleKey, action: { kind: 'autoscroll-top' } };
+        return {
+            firstVisibleKey: newFirstVisibleKey,
+            action: { kind: 'autoscroll-top' },
+        };
     }
     dlog(`VirtualizedList MVCP adjust +${insertedExtent}px ` +
         `(anchor "${prevKey}" moved ${minIndexForVisible}->${anchorIndex})`);
@@ -417,7 +523,10 @@ export function decideEdgeReached(params) {
     }
     // Re-arm once out of threshold so the next approach can fire again.
     if (!withinThreshold) {
-        return { shouldFire: false, nextSentForContentLength: NO_CONTENT_LENGTH_SENT };
+        return {
+            shouldFire: false,
+            nextSentForContentLength: NO_CONTENT_LENGTH_SENT,
+        };
     }
     return { shouldFire: false, nextSentForContentLength: sentForContentLength };
 }

package/build/state-style.d.ts

@@ -0,0 +1,15 @@
+export interface IPressStateArgument {
+    pressed: boolean;
+}
+export interface IResolvedStateStyle {
+    style: unknown;
+    activeStyle: unknown;
+}
+/**
+ * Splits an authored `style` into its resting and pressed halves, reading the value once.
+ *
+ * A non-callback passes through untouched with no active variant, which the engine reads as "leave
+ * slot 1 alone" — that is what makes one emission safe for an expression whose value cannot be
+ * known at compile time.
+ */
+export declare function resolveStateStyle(value: unknown): IResolvedStateStyle;

package/build/state-style.js

@@ -0,0 +1,47 @@
+// The runtime half of state-style lowering: splits an authored `style` into its resting and pressed
+// halves. Referenced by the code every lowering transform EMITS, never by app code.
+//
+// SHARED for the same reason `HOST_PRIMITIVES` and `specializeStateStyle` are — two adapters had
+// written byte-identical copies within an hour of each other, which is the duplication
+// `<adapters_stay_thin>` exists to stop. Each adapter re-exports it from its own `./state-style`
+// subpath so the emitted import specifier stays inside the package the app already depends on.
+//
+// WHY A HELPER EXISTS BESIDE THE INLINE GUARD, since a transform may emit either. Building the pair
+// needs the authored `style` expression, and the two emissions are NOT equivalent:
+//
+//   inline    typeof e === 'function' ? e({pressed:false}) : e   prints `e` on both props, so a
+//             `getStyle()` runs twice and a `flag ? a : b` can take DIFFERENT branches
+//   helper    resolveStateStyle(e)                               prints `e` once and calls its
+//             RESULT twice
+//
+// The rule the two must satisfy is `REFUSAL_CATEGORIES.emitStyleExpressionOnce`, and it is about
+// the output rather than the input: **an expression capable of DOING WORK is printed once.** A bare
+// name or a non-computed dotted path is a read, not work, so the inline form is legitimate there —
+// and it matters, because a helper returns one object, which a framework must spread, and a spread
+// costs the element its patch flag (Vue measured `12 /* STYLE, PROPS */` becoming
+// `16 /* FULL_PROPS */` plus a `mergeProps` per render on the hottest element in the tree).
+//
+// So the VERDICT is identical across adapters — every shape lowers — and only the cost differs,
+// exactly as compile-time substitution differs between a JSX path and an SFC one. The verdicts are
+// what `@symbiote-native/components/lowering-fixtures` pins.
+//
+// THE CONTRACT THIS IMPOSES ON APP CODE: a style callback must be PURE in `pressed`. Its result is
+// invoked twice under every emission, so a side-effecting body is observable now.
+function isStyleCallback(value) {
+    return typeof value === 'function';
+}
+/**
+ * Splits an authored `style` into its resting and pressed halves, reading the value once.
+ *
+ * A non-callback passes through untouched with no active variant, which the engine reads as "leave
+ * slot 1 alone" — that is what makes one emission safe for an expression whose value cannot be
+ * known at compile time.
+ */
+export function resolveStateStyle(value) {
+    if (!isStyleCallback(value))
+        return { style: value, activeStyle: undefined };
+    return {
+        style: value({ pressed: false }),
+        activeStyle: value({ pressed: true }),
+    };
+}

package/build/text-props.d.ts

@@ -0,0 +1,9 @@
+export type IEllipsizeMode = 'head' | 'middle' | 'tail' | 'clip';
+export interface ITextDefaultableProps {
+    ellipsizeMode?: IEllipsizeMode;
+    allowFontScaling?: boolean;
+}
+export declare function resolveTextProps<T extends ITextDefaultableProps>(props: T): T & {
+    ellipsizeMode: IEllipsizeMode;
+    allowFontScaling: boolean;
+};

package/build/text-props.js

@@ -0,0 +1,25 @@
+// The defaults RN's Text.js applies before handing props to native, folded once for every adapter.
+//
+// RN does this unconditionally on the outer (non-virtual) path, Text.js:289 and :291 (the two
+// lines between them, 288 and 290, are `accessible` and `disabled` — not part of this fold):
+//
+//   processedProps.allowFontScaling = allowFontScaling !== false;
+//   processedProps.ellipsizeMode = ellipsizeMode ?? 'tail';
+//
+// We declared both props in all four adapters and applied NEITHER default, so native fell back to
+// its own: `clip` instead of `tail`. Device-observed 2026-08-19 on examples/svelte — a Text with
+// numberOfLines={1} cut mid-word with no ellipsis at all. Nothing failed; the text was simply
+// wrong, which is why four adapters carried it.
+//
+// Both keys are emitted UNCONDITIONALLY, matching RN and — separately — keeping the key set
+// stable. A fold with two branches that emit different key sets is the exact hazard
+// .claude/rules/solid-descriptor-bridge.md §1 exists for, and Svelte's shim diffs the same way.
+export function resolveTextProps(props) {
+    return {
+        ...props,
+        ellipsizeMode: props.ellipsizeMode ?? 'tail',
+        // `!== false`, not `?? true`: RN treats an explicit `undefined` and a missing prop alike, and
+        // only a literal `false` opts out.
+        allowFontScaling: props.allowFontScaling !== false,
+    };
+}

package/build/view/render-activity-indicator.js

@@ -1,3 +1,29 @@
+// ACTIVITYINDICATOR IS NOT A LOWERABLE PRIMITIVE, AND WILL NOT BECOME ONE. Decided 2026-09-01.
+// It stays a component in every adapter; do not add it to `HOST_PRIMITIVES`.
+//
+// The reason is the `el('symbiote-view', wrapperProps, [el('symbiote-activity-indicator', …)])` at
+// the bottom of this file: the render SYNTHESIZES a node that is not the primitive itself. A lowered
+// tag is ONE engine node, and a host behavior's `foldPayload` maps props to props on that node — it
+// cannot create a child. Lowering would therefore drop the centering container and change layout,
+// which is an optimisation moving the observable surface, the one thing this design may not do.
+//
+// The wrapper is not over-building: RN's own `ActivityIndicator.js:112` renders a `<View>` around
+// the native spinner too, so the two nodes are inherent. And the container cannot be folded INTO the
+// spinner — it carries `alignItems`/`justifyContent`, which centre the spinner inside the space it
+// was given; moved onto the spinner they would centre its children, of which it has none.
+//
+// The two alternatives were priced and both cost more than the primitive is worth. A behavior that
+// CREATES a node needs a commit hook, i.e. a machine, i.e. a `-managed` tag split — a new category,
+// not a fold. Synthesising the container inside the engine's commit walk is NOT the `RCTVirtualText`
+// precedent it resembles: `viewNameFor` changes what one node IS and never ADDS one, so adding one
+// would make the retained and committed trees disagree on node count — which every counter, census
+// probe and benchmark in this repo assumes. Spinners are rare on a screen, so the per-instance cost
+// lowering removes is not measurably paid here; the objection to leaving it is uniformity, not speed.
+//
+// Under half A this costs an app NOTHING: `View` and `ActivityIndicator` are both ordinary imports
+// from the adapter barrel, so which one is internally a tag and which a component is invisible at
+// the call site. The general rule is in `.claude/rules/host-primitive-tier.md`.
+//
 // ActivityIndicator: the render half (framework-agnostic). RN wraps the native spinner
 // in a centering View and translates `size` in JS: 'small'/'large' map to a native size
 // enum AND a fixed box style; a numeric size never reaches native (it sizes the spinner
@@ -20,10 +46,16 @@ const CONTAINER_STYLE = {
 };
 function resolveSize(size) {
     if (size === 'small') {
-        return { sizeStyle: { width: SIZE_SMALL_PX, height: SIZE_SMALL_PX }, sizeProp: 'small' };
+        return {
+            sizeStyle: { width: SIZE_SMALL_PX, height: SIZE_SMALL_PX },
+            sizeProp: 'small',
+        };
     }
     if (size === 'large') {
-        return { sizeStyle: { width: SIZE_LARGE_PX, height: SIZE_LARGE_PX }, sizeProp: 'large' };
+        return {
+            sizeStyle: { width: SIZE_LARGE_PX, height: SIZE_LARGE_PX },
+            sizeProp: 'large',
+        };
     }
     return { sizeStyle: { width: size, height: size } };
 }
@@ -50,5 +82,7 @@ export function renderActivityIndicator(view, platform) {
         ...view.passthrough,
         style: [CONTAINER_STYLE, view.style],
     };
-    return el('symbiote-view', wrapperProps, [el('symbiote-activity-indicator', nativeProps)]);
+    return el('symbiote-view', wrapperProps, [
+        el('symbiote-activity-indicator', nativeProps),
+    ]);
 }

package/build/view/render-image/index.d.ts

@@ -53,4 +53,6 @@ export type IImageViewProps = {
     referrerPolicy?: string;
     passthrough: Record<string, unknown>;
 };
+export declare const IMAGE_VIEW_PROP_NAMES: readonly ["source", "defaultSource", "loadingIndicatorSource", "style", "resizeMode", "tintColor", "src", "srcSet", "alt", "width", "height", "crossOrigin", "referrerPolicy"];
+export declare function mapImageProps(view: IImageViewProps): Record<string, unknown>;
 export declare function renderImage(view: IImageViewProps): IDescriptor;

package/build/view/render-image/index.js

@@ -39,7 +39,13 @@ function expandSrcSet(srcSet, view, headers) {
             continue;
         if (scale === 1)
             useSrcForDefaultScale = false;
-        sources.push({ uri, scale, width: view.width, height: view.height, ...{ headers } });
+        sources.push({
+            uri,
+            scale,
+            width: view.width,
+            height: view.height,
+            ...{ headers },
+        });
     }
     if (useSrcForDefaultScale && view.src !== undefined) {
         sources.push({
@@ -65,7 +71,9 @@ function resolveSourceArray(view) {
         return expandSrcSet(view.srcSet, view, headers);
     }
     if (view.src !== undefined) {
-        return [{ uri: view.src, width: view.width, height: view.height, ...{ headers } }];
+        return [
+            { uri: view.src, width: view.width, height: view.height, ...{ headers } },
+        ];
     }
     if (view.source === undefined) {
         dlog('Image: no source / src / srcSet provided');
@@ -76,7 +84,9 @@ function resolveSourceArray(view) {
     // `source.uri && headers` branch; the array/number shapes pass through untouched.
     if (Object.keys(headers).length > 0 && sources.length === 1) {
         const [only] = sources;
-        if (typeof only === 'object' && only !== null && typeof Reflect.get(only, 'uri') === 'string') {
+        if (typeof only === 'object' &&
+            only !== null &&
+            typeof Reflect.get(only, 'uri') === 'string') {
             return [{ ...only, headers }];
         }
     }
@@ -102,7 +112,31 @@ function readSourceUri(source) {
     }
     return undefined;
 }
-export function renderImage(view) {
+// The names `renderImage` CONSUMES rather than forwards — the fold's input list, and the reason it
+// is exported: an adapter that splits props before calling renderImage was copying this list by
+// hand, and a name added here reached the copy only if someone remembered. The Image behavior's
+// `foldPayload` reads it too, so the flat path and the view path cannot drift apart.
+export const IMAGE_VIEW_PROP_NAMES = [
+    'source',
+    'defaultSource',
+    'loadingIndicatorSource',
+    'style',
+    'resizeMode',
+    'tintColor',
+    'src',
+    'srcSet',
+    'alt',
+    'width',
+    'height',
+    'crossOrigin',
+    'referrerPolicy',
+];
+// The whole of Image's prop mapping, with the `el()` wrap taken off. Split out because a LOWERED
+// `<symbiote-image>` has no component body to run it in: its behavior's `foldPayload` needs the same
+// bag at commit time, and a second implementation of this is the exact drift this file already paid
+// for once (`adapters/svelte/src/components/image/image-logic.ts` reproduces it by hand, with a
+// comment saying it had to because nothing here was exported).
+export function mapImageProps(view) {
     // `width` / `height` aliases fold into style (ImageProps.js:195,202); explicit
     // style keys win, matching RN's `{width, height}, ...style` ordering.
     const foldedStyle = view.width === undefined && view.height === undefined
@@ -128,6 +162,9 @@ export function renderImage(view) {
     if (view.loadingIndicatorSource !== undefined) {
         mapped.loadingIndicatorSrc = readSourceUri(view.loadingIndicatorSource);
     }
+    return mapped;
+}
+export function renderImage(view) {
     dlog('Image -> RCTImageView');
-    return el('symbiote-image', mapped);
+    return el('symbiote-image', mapImageProps(view));
 }

package/build/view/render-input-accessory-view.d.ts

@@ -6,4 +6,6 @@ export type IInputAccessoryViewViewProps = {
     style?: IStyleProp<IViewStyle>;
     passthrough: Record<string, unknown>;
 };
+export declare const INPUT_ACCESSORY_VIEW_PROP_NAMES: readonly ["nativeID", "backgroundColor", "style"];
+export declare function mapInputAccessoryViewProps(view: IInputAccessoryViewViewProps): Record<string, unknown>;
 export declare function renderInputAccessoryView(view: IInputAccessoryViewViewProps): IDescriptor;

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

@@ -4,15 +4,50 @@
 // the two by id. There is no JS-side translation: style / nativeID / backgroundColor map straight
 // onto the intrinsic and the user children (injected by the adapter) nest under it. Shared
 // verbatim across adapters: React and Vue both bridge this Descriptor.
-import { dlog } from '@symbiote-native/engine';
+import { dlog, } from '@symbiote-native/engine';
 import { el } from '../descriptor.js';
-export function renderInputAccessoryView(view) {
-    const props = { ...view.passthrough, style: view.style };
+// The names this fold CONSUMES, exported so an adapter splitting props before calling the render fn
+// reads the list instead of copying it — the drift `render-image.ts` records paying for once.
+export const INPUT_ACCESSORY_VIEW_PROP_NAMES = [
+    'nativeID',
+    'backgroundColor',
+    'style',
+];
+// The whole mapping, so the wrapper path and the lowered path share ONE implementation. There is no
+// aliasing here at all: every consumed name leaves under the same name, which is what makes the
+// fold idempotent by construction (asserted in `behaviors/input-accessory-view.test.ts`, not
+// assumed).
+//
+// The `undefined` guards on `nativeID` / `backgroundColor` are LOAD-BEARING, and the asymmetry with
+// the unguarded `style` above is not the tell it looks like.
+//
+// They were removed on 2026-09-01 on the reasoning `.claude/rules/fabric-boolean-event-gates.md`
+// states — `setProp` collapses an undefined value to an absent key, so a conditional write in a
+// shared render fn is cosmetic — and that reasoning was checked against a payload carrying no `id`,
+// which is exactly the case where it holds. The equivalence oracle caught it on its first run:
+//
+//   authored <InputAccessoryView id="p" testID="p" />
+//   guarded    RCTInputAccessoryView{testID, nativeID:"p"}
+//   unguarded  RCTInputAccessoryView{testID}              <- the alias result, deleted
+//
+// `nativeID` has an ALIAS SOURCE. The wrapper leaves `id` in `passthrough`, the renderer's
+// PROP_ALIASES renames it to `nativeID`, and a `nativeID: undefined` written afterwards deletes what
+// the rename just produced — last write wins, and `undefined` collapsing to "absent" is precisely
+// what makes it destructive rather than inert. So the guard is cosmetic for a key nothing else can
+// produce, and required for a key an alias also targets.
+export function mapInputAccessoryViewProps(view) {
+    const out = {
+        ...view.passthrough,
+        style: view.style,
+    };
     if (view.nativeID !== undefined)
-        props.nativeID = view.nativeID;
+        out.nativeID = view.nativeID;
     if (view.backgroundColor !== undefined)
-        props.backgroundColor = view.backgroundColor;
+        out.backgroundColor = view.backgroundColor;
+    return out;
+}
+export function renderInputAccessoryView(view) {
     dlog('InputAccessoryView -> RCTInputAccessoryView');
     // Empty structural children: the adapter appends the user children directly under the host.
-    return el('symbiote-input-accessory-view', props, []);
+    return el('symbiote-input-accessory-view', mapInputAccessoryViewProps(view), []);
 }

package/build/view/render-keyboard-avoiding-view.d.ts

@@ -1,4 +1,4 @@
-import type { IStyleProp, IViewStyle } from '@symbiote-native/engine';
+import type { IKeyboardEventName, IPlatformOSType, IStyleProp, IViewStyle } from '@symbiote-native/engine';
 export type IKeyboardAvoidingBehavior = 'height' | 'position' | 'padding';
 export declare const DEFAULT_VERTICAL_OFFSET = 0;
 export interface IMeasuredFrame {
@@ -11,7 +11,19 @@ export interface IKeyboardFrame {
 }
 export declare function readKeyboardFrame(payload: unknown): IKeyboardFrame | undefined;
 export declare function readLayoutFrame(layout: unknown): IMeasuredFrame | undefined;
-export declare function computeInset(frame: IMeasuredFrame | undefined, keyboard: IKeyboardFrame | undefined, verticalOffset: number): number;
+export type IKeyboardAvoidingEventNames = {
+    show: IKeyboardEventName;
+    hide: IKeyboardEventName;
+};
+export declare function keyboardAvoidingEventNamesFor(os: IPlatformOSType): IKeyboardAvoidingEventNames;
+export declare function readPrefersCrossFadeTransitions(query?: () => Promise<boolean>): Promise<boolean>;
+export type IComputeInsetOptions = {
+    behavior?: IKeyboardAvoidingBehavior;
+    previousInset?: number;
+    os?: IPlatformOSType;
+    prefersCrossFadeTransitions?: boolean;
+};
+export declare function computeInset(frame: IMeasuredFrame | undefined, keyboard: IKeyboardFrame | undefined, verticalOffset: number, options?: IComputeInsetOptions): number;
 export type IKeyboardAvoidingLayout = {
     kind: 'nested';
     wrapperStyle?: IStyleProp<IViewStyle>;