@symbiote-native/svelte 2.0.0 → 3.0.1

package/README.md

@@ -29,9 +29,9 @@ npm install @symbiote-native/svelte react-native svelte
 
 `react-native` and `svelte` stay your app's own top-level dependencies — this package only
 replaces the JS renderer that drives them. Every component is a `.svelte` SFC — there's no TSX
-alternative the way Vue offers — so the Metro wiring below isn't optional. There's no
-`create-symbiote` scaffolder yet, so it comes from [`examples/svelte`](../../examples/svelte)
-rather than a generator:
+alternative the way Vue offers — so the Metro wiring below isn't optional. `npx @symbiote-native/cli new`
+sets this up for a new app; wiring it into an existing one still follows
+[`examples/svelte`](../../examples/svelte) rather than a generator:
 
 - `metro.config.js` — point `babelTransformerPath` at
   `@symbiote-native/svelte/metro-svelte-transformer` (compiles `.svelte` on the way into the

package/build/components/flat-list/index.svelte

@@ -90,6 +90,10 @@
     };
   }
 
+  const rowKeyForRow = $derived(
+    (row: IRow<ItemT>): string => rowKeyExtractor(row, props.keyExtractor),
+  );
+
   const rowOnViewableItemsChanged = $derived.by(() => {
     const onChanged = props.onViewableItemsChanged;
     if (onChanged === undefined) return undefined;
@@ -251,7 +255,7 @@
     header={props.header}
     footer={props.footer}
     empty={props.empty}
-    keyExtractor={rowKeyExtractor}
+    keyExtractor={rowKeyForRow}
     getItemLayout={props.getItemLayout}
     horizontal={props.horizontal}
     inverted={props.inverted}

package/build/components/keyboard-avoiding-view/index.svelte

@@ -30,7 +30,9 @@
   import type { ShimElement } from '../../dom-shim';
   import {
     computeInset,
+    configureKeyboardAvoidingAnimation,
     keyboardAvoidingEventNamesFor,
+    readKeyboardAnimationTiming,
     readPrefersCrossFadeTransitions,
     readKeyboardFrame,
     readLayoutFrame,
@@ -68,11 +70,18 @@
     // was built: Svelte compiles a destructured prop into a live getter, so a `behavior` changed
     // after mount reaches the math on the next event, and 'height' mode feeds back the inset
     // CURRENTLY applied (RN's this.state.bottom) to cancel the shrink its own wrapper caused.
+    const previousInset = inset;
     const next = computeInset(frame, keyboard, keyboardVerticalOffset, {
       behavior,
-      previousInset: inset,
+      previousInset,
       prefersCrossFadeTransitions,
     });
+    // RN's `_updateBottomIfNecessary` skips the animation when the inset did not change.
+    if (next !== previousInset)
+      configureKeyboardAvoidingAnimation(
+        readKeyboardAnimationTiming(payload),
+        enabled,
+      );
     dlog(`KeyboardAvoidingView show -> inset ${next}`);
     inset = next;
   }

package/build/components/pressable/pressable-props.d.ts

@@ -13,7 +13,9 @@ export interface IPressableProps extends IAccessibilityProps, IAriaProps {
     disabled?: boolean;
     focusable?: boolean;
     cancelable?: boolean;
+    blockNativeResponder?: boolean;
     hitSlop?: IRectOffset;
+    testOnly_pressed?: boolean;
     pressRetentionOffset?: IRectOffset;
     unstable_pressDelay?: number;
     android_ripple?: IPressableAndroidRippleConfig;

package/build/components/touchable-highlight/touchable-highlight-props.d.ts

@@ -2,6 +2,8 @@ import type { ITouchableBaseProps } from '../touchable-base-props';
 export interface ITouchableHighlightProps extends ITouchableBaseProps {
     activeOpacity?: number;
     underlayColor?: string;
+    touchSoundDisabled?: boolean;
+    testOnly_pressed?: boolean;
     onShowUnderlay?: () => void;
     onHideUnderlay?: () => void;
 }

package/build/components/touchable-native-feedback/touchable-native-feedback-props.d.ts

@@ -5,4 +5,5 @@ export type ITouchableNativeFeedbackProps = Omit<IPressableProps, 'style' | 'chi
     background?: INativeFeedbackBackground;
     useForeground?: boolean;
     children?: Snippet;
+    touchSoundDisabled?: boolean;
 };

package/build/components/touchable-without-feedback/touchable-without-feedback-props.d.ts

@@ -1,2 +1,4 @@
 import type { ITouchableBaseProps } from '../touchable-base-props';
-export type ITouchableWithoutFeedbackProps = ITouchableBaseProps;
+export type ITouchableWithoutFeedbackProps = ITouchableBaseProps & {
+    touchSoundDisabled?: boolean;
+};

package/build/components/virtualized-list/index.svelte

@@ -40,10 +40,8 @@
 
 <script lang="ts" generics="ItemT">
   import {
-    DEFAULT_END_REACHED_THRESHOLD,
     DEFAULT_INITIAL_NUM_TO_RENDER,
     DEFAULT_MAX_TO_RENDER_PER_BATCH,
-    DEFAULT_START_REACHED_THRESHOLD,
     DEFAULT_UPDATE_CELLS_BATCHING_PERIOD,
     DEFAULT_WINDOW_SIZE,
     EMPTY_OFFSET,
@@ -128,11 +126,9 @@
       horizontal: props.horizontal === true,
       inverted: props.inverted === true,
       onEndReached: props.onEndReached,
-      onEndReachedThreshold:
-        props.onEndReachedThreshold ?? DEFAULT_END_REACHED_THRESHOLD,
+      onEndReachedThreshold: props.onEndReachedThreshold,
       onStartReached: props.onStartReached,
-      onStartReachedThreshold:
-        props.onStartReachedThreshold ?? DEFAULT_START_REACHED_THRESHOLD,
+      onStartReachedThreshold: props.onStartReachedThreshold,
       onRefresh: props.onRefresh,
       refreshing: props.refreshing,
       progressViewOffset: props.progressViewOffset,
@@ -252,7 +248,12 @@
           const info = effect.info;
           const map = effect.map;
           const fire = (): void => {
-            for (const pair of pairs) pair.onViewableItemsChanged(info);
+            for (const pair of pairs) {
+              pair.onViewableItemsChanged({
+                ...info,
+                viewabilityConfig: pair.viewabilityConfig,
+              });
+            }
             dispatch({ kind: 'viewable-fired', map });
           };
           if (viewableTimer !== null) {

package/build/components/virtualized-list/virtualized-list-props.d.ts

@@ -1,5 +1,5 @@
 import type { Snippet } from 'svelte';
-import type { IStyleProp, ISymbioteEvent, ISymbioteNode, IViewStyle } from '@symbiote-native/engine';
+import { type IStyleProp, type ISymbioteEvent, type ISymbioteNode, type IViewStyle } from '@symbiote-native/engine';
 import { type IAccessibilityProps, type IAriaProps, type ISeparatorProps, type ISeparators, type IViewabilityConfig, type IViewabilityConfigCallbackPair, type IViewableItemsChangedInfo, type IVirtualizedListHandle } from '@symbiote-native/components';
 import type { ISvelteClassValue } from '../../class-value';
 export type { IVirtualizedListHandle };
@@ -67,4 +67,4 @@ export interface IVirtualizedListProps<ItemT> extends IAccessibilityProps, IAria
     class?: ISvelteClassValue;
 }
 export type { ISeparators, ISeparatorProps, ISymbioteEvent, ISymbioteNode };
-export declare function pickAccessibilityProps<T extends IAccessibilityProps & IAriaProps>(props: T): IAccessibilityProps;
+export declare function pickAccessibilityProps<T extends IAccessibilityProps & IAriaProps>(props: T): IAccessibilityProps & IAriaProps;

package/build/components/virtualized-list/virtualized-list-props.js

@@ -1,14 +1,18 @@
-import { resolveAccessibilityProps, } from '@symbiote-native/components';
+import { ARIA_ALIAS_KEYS, } from '@symbiote-native/engine';
+import {} from '@symbiote-native/components';
 // Every IAccessibilityProps field, named explicitly (the object-bag convention this adapter's
 // custom-element host tags require — svelte-adapter-dom-shim skill §3g(c) — forbids a raw
 // `...rest` spread landing on a symbiote-* tag, so this mirrors React's `...accessibilityRest`
 // field-by-field instead of reusing its spread). Shared by every list component (VirtualizedList's
 // own host-bag construction AND FlatList's/VirtualizedSectionList's/SectionList's component-to-
 // component forwarding down to VirtualizedList) so the field list lives in exactly one place.
-// resolveAccessibilityProps folds aria-*/role into their accessibility* twins first (idempotent —
-// calling it twice, once per forwarding hop, is a documented no-op once the aria keys are gone).
+// It used to call `resolveAccessibilityProps` first, folding `aria-*`/`role` into their
+// `accessibility*` twins so there were canonical names to pick BY NAME. That fold is the device's
+// rule now, so the aria keys are picked and forwarded RAW instead (the loop at the end) and the
+// engine folds once, at the leaf. Picking twice across a forwarding hop stays a no-op for the same
+// reason folding twice was: a pick is idempotent.
 export function pickAccessibilityProps(props) {
-    const resolved = resolveAccessibilityProps(props);
+    const resolved = props;
     const picked = {};
     if (resolved.testID !== undefined)
         picked.testID = resolved.testID;
@@ -73,5 +77,21 @@ export function pickAccessibilityProps(props) {
         picked.onMagicTap = resolved.onMagicTap;
     if (resolved.onAccessibilityEscape !== undefined)
         picked.onAccessibilityEscape = resolved.onAccessibilityEscape;
+    // THE ARIA HALF, forwarded RAW and DERIVED from the engine's own list rather than named again
+    // here. `ARIA_ALIAS_KEYS` is exported for exactly this — its comment says a second hand-written
+    // copy is what `adapter-parity-audit.md` records going stale one member at a time — so this loop
+    // gains a new alias the day the engine does.
+    //
+    // Raw, because the fold is the device's rule (`foldAriaProps`, `SymbioteFabricProps.cpp`) and it
+    // reads these names literally off the bag it commits. Folding them here would be a second
+    // implementation of it, and the one this file used to hold: `resolveAccessibilityProps`.
+    for (const key of ARIA_ALIAS_KEYS) {
+        const value = props[key];
+        // `Object.assign` with a computed key, not `picked[key] = value`: the key is a union and the
+        // value is its correlated member type, which TypeScript cannot check across a loop. This is the
+        // spelling that stays sound without an `as`.
+        if (value !== undefined)
+            Object.assign(picked, { [key]: value });
+    }
     return picked;
 }

package/build/create-portal/index.js

@@ -55,7 +55,7 @@
 //   Node identity    | nodes are MOVED (the old   | content is re-created per TunnelOut
 //                    |   parent empties)          |
 import { pop, push, snippet, user_effect } from 'svelte/internal/client';
-import { appendChild as engineAppendChild, removeChild as engineRemoveChild, dlog, isSymbioteNode, SymbioteSurface, } from '@symbiote-native/engine';
+import { appendChild as engineAppendChild, removeChild as engineRemoveChild, componentOf, dlog, isSymbioteNode, SymbioteSurface, } from '@symbiote-native/engine';
 import { ShimComment, ShimElement, ShimNode } from '../dom-shim/index.js';
 // The Svelte flavour of React's `isSymbioteNode` guard, and it needs its own wording: React tells
 // the caller to check for a forgotten `.current`, which does not exist here. A Svelte host ref is
@@ -75,7 +75,7 @@ function targetLabel(target) {
         return `surface#${target.rootTag}`;
     if (target instanceof ShimElement)
         return target.tagName;
-    return target.component;
+    return componentOf(target);
 }
 // Attach the fragment host under `target` and hand back the matching detach. Three branches
 // because the three target kinds sit at different layers:

package/build/dom-shim/canonical-prop-names.js

@@ -79,6 +79,7 @@ export const CANONICAL_PROP_NAMES = [
     'backgroundColor',
     'barStyle',
     'behavior',
+    'blockNativeResponder',
     'blurOnSubmit',
     'blurRadius',
     'bounces',
@@ -178,6 +179,7 @@ export const CANONICAL_PROP_NAMES = [
     'onAccessibilityEscape',
     'onAccessibilityTap',
     'onBlur',
+    'onChangeText',
     'onContentSizeChange',
     'onDismiss',
     'onEndEditing',
@@ -290,6 +292,7 @@ export const CANONICAL_PROP_NAMES = [
     'submitBehavior',
     'supportedOrientations',
     'testID',
+    'testOnly_pressed',
     'textAlign',
     'textContentType',
     'thumbColor',

package/build/dom-shim/element.d.ts

@@ -10,6 +10,7 @@ export declare class ShimElement extends ShimElementBase {
     private doorBag;
     private pBag;
     private lastBag;
+    private ownsDoorBag;
     constructor(tagName: string, namespaceURI?: string);
     get nodeName(): string;
     private styleSlot;

package/build/dom-shim/element.js

@@ -26,7 +26,6 @@ import { createElement, dlog, routeProp, toPublicInstance, } from '@symbiote-nat
 import { descriptorFor } from '@symbiote-native/components';
 import { normalizeSvelteClass } from '../class-value.js';
 import { CANONICAL_BY_LOWER, CANONICAL_PROP_NAMES, } from './canonical-prop-names.js';
-import { foldHostBag } from './fold-host-bag.js';
 import { ShimNode } from './shim-node.js';
 import { discoverStyleCacheKey } from './style-cache.js';
 // The bag a not-yet-live element is diffed against in onMadeLive. A module constant rather than a
@@ -61,11 +60,19 @@ export class ShimElement extends ShimElementBase {
     // The four attribute doors write `doorBag`, `set p` writes `pBag`, `lastBag` is the folded merge.
     // Held in ONE object, `set p` deleted the `class` `from_tree` had written at clone time, so
     // `<view p={handlers} class="x">` committed with no style at all and nothing was red. Unreachable
-    // while an element used one door, which every lowered tag and adapter component does.
+    // while an element used one door, which nearly every element does.
     // Both LAZY: an element touching one door still allocates one object.
     doorBag = undefined;
     pBag = undefined;
     lastBag = EMPTY_BAG;
+    // COPY-ON-WRITE ownership of `doorBag`. `true` only while THIS element is the sole holder of the
+    // object `doorBag` points at, which lets `writeBagKey` mutate it in place instead of re-copying it
+    // on every one of an element's own sequential door writes. `cloneNode` hands the SAME object to a
+    // second element (§ below) and must clear this on both sides the moment it does, or a write on
+    // one clone would mutate the bag a sibling clone still reads — see
+    // `prop-bag-diff.test.ts`'s "a write to one clone does not leak into a sibling clone" for the
+    // isolation this exists to preserve.
+    ownsDoorBag = false;
     constructor(tagName, namespaceURI) {
         super();
         this.tagName = tagName;
@@ -78,7 +85,7 @@ export class ShimElement extends ShimElementBase {
     // no-opping — a `style` attribute on a bare tag crashed the mount. LAZY, for the reason
     // `.claude/rules/svelte-shim-is-the-per-node-create-path.md` records about the two Maps below it:
     // an eager field is one object per element, ~9 000 per create, in the window where GC is the
-    // largest bucket. Only `set_style` touches this, and no lowered element takes that path.
+    // largest bucket. Only `set_style` touches this, and a bag-carrying element never takes it.
     styleSlot = undefined;
     get style() {
         return (this.styleSlot ??= { cssText: '' });
@@ -120,12 +127,10 @@ export class ShimElement extends ShimElementBase {
         applyBagDiff(this.engineNode, prev, next);
         this.surface?.requestCommit();
     }
-    // A BARE tag's props arrive here, one key at a time, and they used to stop here: an inert Map,
-    // nothing routed, nothing committed, nothing red. That was survivable only while every host
-    // element in an app was produced by the lowering transform, which builds the `p` bag above —
-    // and it is exactly what made that transform load-bearing for CORRECTNESS on this adapter
-    // alone. Routing the key makes `<view testID="x">` and `<view p={{ testID: 'x' }}>` the same
-    // commit, so the transform goes back to being the optimisation it is everywhere else.
+    // A tag's props arrive here one key at a time, and they used to stop here: an inert Map, nothing
+    // routed, nothing committed, nothing red. Routing the key is what makes `<view testID="x">` and
+    // `<view p={{ testID: 'x' }}>` the same commit — the bag spelling is an optimisation, not the
+    // only way to reach the engine.
     //
     // `value` is `unknown`, not `string`: Svelte's `set_attribute` hands the raw value straight
     // through for a name with no prototype setter, so an object `style` or a number arrives
@@ -156,7 +161,17 @@ export class ShimElement extends ShimElementBase {
     // Not `private`: the prototype accessors installed at the bottom of this file are the third
     // writer, and they are defined from module scope because there are ~290 of them.
     writeBagKey(name, value) {
-        const door = { ...this.doorBag };
+        // COW: reuse `doorBag` in place only while this element is its SOLE owner (never cloned since
+        // its last write) — `cloneNode` clears the flag on both sides the instant a bag becomes shared
+        // (§ above). A fresh `{}` is `own`ed immediately: nothing else can reach it yet.
+        // Narrowed through a LOCAL, not through `owned`: TypeScript discards an aliased condition
+        // whose operands include a mutable property (`this.ownsDoorBag`), so the `!== undefined` leg
+        // never reached `this.doorBag` at the use site and this line did not compile.
+        const reusable = this.doorBag !== undefined && this.ownsDoorBag ? this.doorBag : undefined;
+        const owned = reusable !== undefined;
+        const door = reusable ?? { ...this.doorBag };
+        this.ownsDoorBag = true;
+        const prevValue = door[name];
         if (value === undefined)
             delete door[name];
         else
@@ -167,6 +182,21 @@ export class ShimElement extends ShimElementBase {
         this.lastBag = next;
         if (this.engineNode === undefined)
             return; // not live yet — onMadeLive() replays in full
+        // `foldedBag()` hands `door` straight back, BY REFERENCE, whenever there is no `p` bag to merge
+        // it with (its own "no `pBag`" branch) — so when `door` was mutated IN PLACE above (`owned`),
+        // `next` and `door` are the same object post-mutation, and a full `prev`-vs-`next` diff would
+        // be comparing that object against itself and finding nothing changed. The one key just written
+        // is the whole diff in that shape, by construction, so route it directly and skip the diff loop
+        // — this is what makes the COW above safe rather than merely silent (see
+        // `prop-bag-diff.test.ts`'s "commits an attribute written after it is live" style cases, which
+        // caught the alternative — a no-op write — the first time this was tried without this branch).
+        if (owned && this.pBag === undefined) {
+            const nextValue = next[name];
+            if (prevValue !== nextValue)
+                routeProp(this.engineNode, name, nextValue);
+            this.surface?.requestCommit();
+            return;
+        }
         applyBagDiff(this.engineNode, prev, next);
         this.surface?.requestCommit();
     }
@@ -176,10 +206,10 @@ export class ShimElement extends ShimElementBase {
         const door = this.doorBag;
         const bag = this.pBag;
         if (door === undefined)
-            return foldHostBag(this.tagName, normalizeBagClasses(bag ?? {}));
+            return normalizeBagClasses(bag ?? {});
         if (bag === undefined)
-            return foldHostBag(this.tagName, normalizeBagClasses(door));
-        return foldHostBag(this.tagName, normalizeBagClasses({ ...bag, ...door }));
+            return normalizeBagClasses(door);
+        return normalizeBagClasses({ ...bag, ...door });
     }
     // THE FIFTH DOOR, and it converges on the same bag as the other four. Svelte turns EVERY
     // `on<Name>` attribute into `$.event()`, whatever the name means to us — so this receives both
@@ -207,6 +237,12 @@ export class ShimElement extends ShimElementBase {
         clone.doorBag = this.doorBag;
         clone.pBag = this.pBag;
         clone.lastBag = this.lastBag;
+        // `doorBag` (if any) now has TWO owners. Neither may mutate it in place from here — the next
+        // write on either side must copy first and only then reclaims exclusive ownership of ITS OWN
+        // copy. Without this a clone's first `setAttribute` would mutate the master's (and every other
+        // sibling clone's) committed props in place.
+        this.ownsDoorBag = false;
+        clone.ownsDoorBag = false;
         if (deep === true) {
             for (const child of this.children)
                 clone.appendChild(child.cloneNode(true));

package/build/dom-shim/patch-globals.js

@@ -72,8 +72,8 @@ const FAKE_CUSTOM_ELEMENT_REGISTRY = {
 // rather than by reading. Svelte's `event()` (dom/elements/events.js) ends its teardown check with
 // a BARE `dom instanceof HTMLMediaElement`, no `typeof` guard, so an undeclared global throws
 // ReferenceError instead of yielding `undefined`. It is reached by every `on<Name>={fn}` an app
-// writes on a bare tag, which is why nothing hit it while the lowering transform funnelled every
-// handler through the `p` bag. Nothing of ours ever derives from it, so an empty class is enough:
+// writes on a bare tag, which is why nothing hit it while every handler went through the `p` bag.
+// Nothing of ours ever derives from it, so an empty class is enough:
 // `instanceof` only has to answer false.
 class FakeHTMLMediaElement {
 }

package/build/dom-shim/shim-node.d.ts

@@ -3,6 +3,10 @@ type IDocumentLike = {
     createTextNode(value: string): ShimNode;
 };
 export declare function registerShimDocumentFactory(factory: () => IDocumentLike): void;
+export declare function takeShimScanStats(): {
+    calls: number;
+    scanned: number;
+};
 export declare abstract class ShimNode {
     parent: ShimNode | null;
     children: ShimNode[];
@@ -25,6 +29,8 @@ export declare abstract class ShimNode {
     remove(): void;
     removeChild<T extends ShimNode>(child: T): T;
     set textContent(value: string);
+    private indexNearEnd;
+    private scannedIndexOf;
     private insertOne;
 }
 export {};

package/build/dom-shim/shim-node.js

@@ -25,6 +25,31 @@ function shimDocument() {
     }
     return documentFactory();
 }
+// How many insertBefore ref lookups fell through `indexNearEnd`'s bounded window into the full,
+// unbounded `children.indexOf` scan, and how much of the array each one walked. Read-and-zeroed
+// through `takeShimScanStats`, same shape as `core/engine/src/node.ts`'s `propStats`. This is the
+// JS-side twin of a question F-80 already answered for the engine's own `OP_INSERT_BEFORE`
+// (`std::find` over `siblings`, exonerated as too small): before `indexNearEnd` existed, Svelte's
+// OWN reconciler paid the identical linear scan a second time, one layer up, on every keyed
+// `{#each}` append — measured at 1.5M comparisons for a 1 000-row Append onto 1 000 standing
+// (`each-append-scan-cost.probe.test.ts`). A zero reading here now means every ref this run
+// needed was found in the tail window; a nonzero one means something inserts against a ref
+// further from the end than `TAIL_SCAN_WINDOW` covers, which is real work this counter still
+// prices honestly rather than hiding behind the fast path.
+const shimScanStats = { calls: 0, scanned: 0 };
+// Covers the measured case (a trailing block/component boundary anchor, one small constant hop
+// from the true end) with room to spare, without making the fallback-miss case pay a meaningfully
+// bigger constant before it gives up and scans properly.
+const TAIL_SCAN_WINDOW = 8;
+export function takeShimScanStats() {
+    const snapshot = {
+        calls: shimScanStats.calls,
+        scanned: shimScanStats.scanned,
+    };
+    shimScanStats.calls = 0;
+    shimScanStats.scanned = 0;
+    return snapshot;
+}
 export class ShimNode {
     parent = null;
     children = [];
@@ -131,6 +156,28 @@ export class ShimNode {
             this.appendChild(shimDocument().createTextNode(value));
         }
     }
+    // Bounded backward scan, O(TAIL_SCAN_WINDOW) not O(children.length). Covers the case that
+    // dominates a real Append: a keyed `{#each}` growing at the tail inserts every new row via
+    // `newRow.before(ref)` where `ref` is the block's own closing boundary anchor — measured
+    // (`each-append-scan-cost.probe.test.ts`) sitting a SMALL, constant distance from the true end
+    // (one extra trailing anchor from the component's own root fragment in the measured case, not
+    // necessarily always exactly one — hence a window, not a hardcoded offset). Returns `undefined`
+    // on a miss so the caller falls back to the full, always-correct scan; this never changes the
+    // result, only how cheaply the common case finds it.
+    indexNearEnd(ref) {
+        const { children } = this;
+        const start = Math.max(0, children.length - TAIL_SCAN_WINDOW);
+        for (let i = children.length - 1; i >= start; i -= 1) {
+            if (children[i] === ref)
+                return i;
+        }
+        return undefined;
+    }
+    scannedIndexOf(ref) {
+        shimScanStats.calls += 1;
+        shimScanStats.scanned += this.children.length;
+        return this.children.indexOf(ref);
+    }
     insertOne(node, ref) {
         detachFromParent(node);
         node.parent = this;
@@ -138,7 +185,7 @@ export class ShimNode {
             this.children.push(node);
         }
         else {
-            const index = this.children.indexOf(ref);
+            const index = this.indexNearEnd(ref) ?? this.scannedIndexOf(ref);
             this.children.splice(index < 0 ? this.children.length : index, 0, node);
         }
         if (this.engineNode !== undefined && this.surface !== undefined) {

package/build/dom-shim/text.js

@@ -16,7 +16,7 @@
 // Fabric (the reason Vue's renderer maps it to an anchor rather than an empty text); and a raw
 // text child of a non-Text parent is the invalid "text outside <Text>" shape. Found by
 // native-node-parity.test.ts, which diffs committed native trees against the Vue adapter.
-import { appendChild as engineAppendChild, createAnchor, createRawText, insertBefore as engineInsertBefore, isAnchor, removeChild as engineRemoveChild, setText, } from '@symbiote-native/engine';
+import { isTextContainer, appendChild as engineAppendChild, createAnchor, createRawText, insertBefore as engineInsertBefore, isAnchor, removeChild as engineRemoveChild, setText, } from '@symbiote-native/engine';
 import { ShimNode } from './shim-node.js';
 // Deliberately WIDER than Svelte's own whitespace class. `svelte/src/compiler/phases/patterns.js`
 // uses /[^ \t\r\n]/ and says why: "Not \S because that also removes explicit whitespace defined
@@ -49,7 +49,8 @@ const WHITESPACE_ONLY = /^[\s\u200b-\u200d\ufeff]+$/;
 function isFormattingWhitespace(value, parent) {
     if (!WHITESPACE_ONLY.test(value))
         return false;
-    return parent?.engineNode?.isText !== true;
+    const engineNode = parent?.engineNode;
+    return engineNode === undefined || !isTextContainer(engineNode);
 }
 export class ShimText extends ShimNode {
     value;

package/build/host-instance.js

@@ -9,7 +9,7 @@
 // RN's own findNodeHandle has). The node -> tag resolution itself belongs to the engine
 // (getNativeTag, keyed on the raw node in the commit mirror); this only adapts the
 // Svelte-shaped input (a ShimElement) onto it.
-import { getNativeTag, isSymbioteNode, toPublicInstance, dlog, } from '@symbiote-native/engine';
+import { componentOf, getNativeTag, isSymbioteNode, toPublicInstance, dlog, } from '@symbiote-native/engine';
 // `engineNode` alone does NOT identify a ShimElement: it is declared on the shared ShimNode base
 // (dom-shim/shim-node.ts), so a ShimText / ShimComment / ShimDocumentFragment satisfies it too,
 // and none of those is a host ref an interop library can hand back. `tagName` is ShimElement's
@@ -50,7 +50,7 @@ export function findNodeHandle(componentOrHandle) {
     const node = componentOrHandle.engineNode;
     if (node !== undefined && isSymbioteNode(node)) {
         const tag = getNativeTag(node) ?? null;
-        dlog(`findNodeHandle: component=${node.component} tag=${tag}`);
+        dlog(`findNodeHandle: component=${componentOf(node)} tag=${tag}`);
         return tag;
     }
     dlog('findNodeHandle: hostShim not live yet (engineNode undefined)');

package/build/modules/animated/index.d.ts

@@ -3,25 +3,7 @@ declare const drivers: {
     Value: typeof AnimatedValue;
     ValueXY: typeof AnimatedValueXY;
     Color: typeof AnimatedColor;
-    Easing: {
-        step0(n: number): number;
-        step1(n: number): number;
-        linear(t: number): number;
-        ease(t: number): number;
-        quad(t: number): number;
-        cubic(t: number): number;
-        poly(n: number): import("@symbiote-native/engine").IEasingFunction;
-        sin(t: number): number;
-        circle(t: number): number;
-        exp(t: number): number;
-        elastic(bounciness?: number): import("@symbiote-native/engine").IEasingFunction;
-        back(s?: number): import("@symbiote-native/engine").IEasingFunction;
-        bounce(t: number): number;
-        bezier(x1: number, y1: number, x2: number, y2: number): import("@symbiote-native/engine").IEasingFunction;
-        in(easing: import("@symbiote-native/engine").IEasingFunction): import("@symbiote-native/engine").IEasingFunction;
-        out(easing: import("@symbiote-native/engine").IEasingFunction): import("@symbiote-native/engine").IEasingFunction;
-        inOut(easing: import("@symbiote-native/engine").IEasingFunction): import("@symbiote-native/engine").IEasingFunction;
-    };
+    Easing: import("@symbiote-native/engine").IEasing;
     timing: typeof timing;
     spring: typeof spring;
     decay: typeof decay;
@@ -39,6 +21,28 @@ declare const drivers: {
     event: typeof event;
     forkEvent: typeof forkEvent;
     unforkEvent: typeof unforkEvent;
+} | {
+    Value: typeof AnimatedValue;
+    ValueXY: typeof AnimatedValueXY;
+    Color: typeof AnimatedColor;
+    Easing: import("@symbiote-native/engine").IEasing;
+    timing: (value: AnimatedValue, config: import("@symbiote-native/engine").ITimingConfig) => import("@symbiote-native/engine").ICompositeAnimation;
+    spring: (value: AnimatedValue, config: import("@symbiote-native/engine").ISpringConfig) => import("@symbiote-native/engine").ICompositeAnimation;
+    decay: (_value: AnimatedValue, _config: import("@symbiote-native/engine").IDecayConfig) => import("@symbiote-native/engine").ICompositeAnimation;
+    parallel: (animations: import("@symbiote-native/engine").ICompositeAnimation[], _config?: import("@symbiote-native/engine").IParallelConfig) => import("@symbiote-native/engine").ICompositeAnimation;
+    sequence: (animations: import("@symbiote-native/engine").ICompositeAnimation[]) => import("@symbiote-native/engine").ICompositeAnimation;
+    stagger: (_time: number, animations: import("@symbiote-native/engine").ICompositeAnimation[]) => import("@symbiote-native/engine").ICompositeAnimation;
+    loop: (_animation: import("@symbiote-native/engine").ICompositeAnimation) => import("@symbiote-native/engine").ICompositeAnimation;
+    delay: (_time: number) => import("@symbiote-native/engine").ICompositeAnimation;
+    add: typeof add;
+    subtract: typeof subtract;
+    multiply: typeof multiply;
+    divide: typeof divide;
+    modulo: typeof modulo;
+    diffClamp: typeof diffClamp;
+    event: typeof event;
+    forkEvent: typeof forkEvent;
+    unforkEvent: typeof unforkEvent;
 };
 interface IAnimatedNamespace {
     FlatList: typeof import('../../components/flat-list/index.svelte').default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symbiote-native/svelte",
-  "version": "2.0.0",
+  "version": "3.0.1",
   "description": "SymbioteNative's Svelte adapter — a DOM shim over stock compiled Svelte output driving real native iOS/Android views through the same engine as every other adapter.",
   "keywords": [
     "react-native",
@@ -73,22 +73,22 @@
   },
   "dependencies": {
     "typescript": "~6.0.0",
-    "@symbiote-native/components": "2.0.0",
+    "@symbiote-native/components": "3.0.1",
     "@symbiote-native/css-parser": "0.5.0"
   },
   "peerDependencies": {
     "svelte": ">=5.56.0",
     "react-native": ">=0.86",
-    "@symbiote-native/engine": "^0.5.0"
+    "@symbiote-native/engine": "^1.2.0"
   },
   "devDependencies": {
     "@vue/runtime-core": "^3.5.13",
     "react": "19.2.3",
     "svelte": "^5.56.0",
-    "@symbiote-native/engine": "0.5.0",
-    "@symbiote-native/react": "2.0.0",
-    "@symbiote-native/test-utils": "0.3.0",
-    "@symbiote-native/vue": "2.0.0"
+    "@symbiote-native/engine": "1.2.0",
+    "@symbiote-native/react": "3.0.1",
+    "@symbiote-native/test-utils": "0.4.1",
+    "@symbiote-native/vue": "3.0.1"
   },
   "scripts": {
     "typecheck": "tsc --build",

package/build/dom-shim/fold-host-bag.d.ts

@@ -1 +0,0 @@
-export { foldHostBag, FOLD_PLAN_BY_TAG as BY_TAG, type IHostBag, } from '@symbiote-native/components/fold-host-bag';

package/build/dom-shim/fold-host-bag.js

@@ -1,7 +0,0 @@
-// Moved to `@symbiote-native/components/fold-host-bag` (2026-09-01) and kept here as a re-export.
-//
-// It left this adapter the moment a SECOND adapter needed it: React's wrappers are being replaced
-// by bare intrinsic tags, and a bare tag has no wrapper to fold in — the same "third path" this
-// file was written for, arriving in an adapter that has no lowering transform either. A per-adapter
-// copy of a fold driven by a shared spec is the duplication `<adapters_stay_thin>` exists to stop.
-export { foldHostBag, FOLD_PLAN_BY_TAG as BY_TAG, } from '@symbiote-native/components/fold-host-bag';