@symbiote-native/svelte 0.3.0 → 1.0.0

package/build/components/pressable/index.svelte

@@ -22,15 +22,18 @@
 </script>
 
 <script lang="ts">
+  import { onDestroy } from 'svelte';
   import {
     createPressHandlers,
     createPressRuntime,
+    disposePressRuntime,
     rippleProps,
     buildPressableListeners,
     resolveDisabledAccessibilityState,
     resolveAccessibilityProps,
     noteHoverNoop,
     DEFAULT_DELAY_LONG_PRESS_MS,
+    DEFAULT_MIN_PRESS_DURATION_MS,
     type IPressHost,
     type IPressState,
   } from '@symbiote-native/components';
@@ -50,6 +53,7 @@
     hitSlop,
     pressRetentionOffset,
     unstable_pressDelay = 0,
+    __minPressDuration = DEFAULT_MIN_PRESS_DURATION_MS,
     android_ripple,
     android_disableSound,
     onHoverIn,
@@ -61,7 +65,10 @@
     class: className,
     children,
     ...rest
-  }: IPressableProps = $props();
+  }: IPressableProps & {
+    /** @internal Touchable* mirrors RN's Pressability minPressDuration: 0 override. */
+    __minPressDuration?: number;
+  } = $props();
 
   let pressed = $state(false);
   // Plain setup-scope object, never `$state`: mutated by the machine on every event, never
@@ -85,8 +92,13 @@
       const id = setTimeout(callback, ms);
       return () => clearTimeout(id);
     },
+    now: Date.now,
   };
 
+  onDestroy(() => {
+    disposePressRuntime(runtime);
+  });
+
   $effect(() => {
     noteHoverNoop(onHoverIn, onHoverOut);
   });
@@ -107,6 +119,7 @@
         onLongPress,
         delayLongPress,
         unstable_pressDelay,
+        minPressDuration: __minPressDuration,
         hitSlop,
         pressRetentionOffset,
       },
@@ -115,38 +128,43 @@
     ),
   );
 
-  const resolvedAccessibilityState = $derived(
-    resolveDisabledAccessibilityState(accessibilityState, disabled),
-  );
-
-  // Folds aria-*/role into accessibility* — Pressable owns its host node directly (it does not
-  // compose View.svelte), so it must fold this itself, exactly like Vue's Pressable and every
-  // other Svelte component that hand-authors a raw host tag (RefreshControl.svelte, modal/
-  // index.svelte).
-  const resolved = $derived(
-    resolveAccessibilityProps({
-      ...rest,
-      accessibilityState: resolvedAccessibilityState,
-    }),
-  );
-
-  const resolvedStyle = $derived(
-    typeof style === 'function' ? style(state) : style,
-  );
-
   // android_ripple rides a dedicated inner View; on iOS rippleProps() returns undefined, so the
   // child renders unwrapped, no extra node — mirrors React's Pressable + touchable-native-feedback.
   const ripple = $derived(
     android_ripple !== undefined ? rippleProps(android_ripple) : undefined,
   );
 
-  const bag = $derived({
-    ...resolved,
-    style: resolvedStyle,
-    class: className,
-    hitSlop,
-    ...(android_disableSound !== undefined ? { android_disableSound } : {}),
-    ...buildPressableListeners(handlers, { disabled, cancelable }),
+  // ONE derived, not four. The accessibility fold and the style resolution used to be their own
+  // `$derived`s, each read by exactly this bag and by nothing else — a memo nobody can reuse, in
+  // exchange for a reaction-graph node per Pressable instance. A 1 000-row list mounts 2 000 of
+  // them, which made this component the largest single allocation site in a create profile.
+  // `handlers` and `ripple` stay separate BECAUSE they are read elsewhere: `handlers` must keep
+  // its identity across an unrelated bag change or every recompute re-registers native listeners,
+  // and `ripple` is read twice (the branch test and the inner view's own bag).
+  const bag = $derived.by(() => {
+    // Folds aria-*/role into accessibility* — Pressable owns its host node directly (it does not
+    // compose View.svelte), so it must fold this itself, exactly like Vue's Pressable and every
+    // other Svelte component that hand-authors a raw host tag (RefreshControl.svelte, modal/
+    // index.svelte).
+    const resolved = resolveAccessibilityProps({
+      ...rest,
+      accessibilityState: resolveDisabledAccessibilityState(
+        accessibilityState,
+        disabled,
+      ),
+    });
+    const next: Record<string, unknown> = {
+      ...resolved,
+      style: typeof style === 'function' ? style(state) : style,
+      class: className,
+      hitSlop,
+      ...buildPressableListeners(handlers, { disabled, cancelable }),
+    };
+    // Assigned rather than conditionally spread: `...(cond ? { x } : {})` allocated an empty
+    // object literal on every evaluation for the overwhelmingly common `undefined` case.
+    if (android_disableSound !== undefined)
+      next.android_disableSound = android_disableSound;
+    return next;
   });
 
   // See View.svelte's note on `{@attach}`.

package/build/components/pressable/index.svelte.d.ts

@@ -1,5 +1,9 @@
 import type { IPressableProps } from './pressable-props';
 export type { IPressableProps };
-declare const Index: import("svelte").Component<IPressableProps, {}, "">;
+type $$ComponentProps = IPressableProps & {
+    /** @internal Touchable* mirrors RN's Pressability minPressDuration: 0 override. */
+    __minPressDuration?: number;
+};
+declare const Index: import("svelte").Component<$$ComponentProps, {}, "">;
 type Index = ReturnType<typeof Index>;
 export default Index;

package/build/components/safe-area-view-props.d.ts

@@ -4,6 +4,7 @@ import type { IAccessibilityProps, IAriaProps } from '@symbiote-native/component
 import type { ISvelteClassValue } from '../class-value';
 export interface ISafeAreaViewProps extends IAccessibilityProps, IAriaProps {
     style?: IStyleProp<IViewStyle>;
+    id?: string;
     class?: ISvelteClassValue;
     onLayout?: (event: ISymbioteEvent) => void;
     children?: Snippet;

package/build/components/switch/index.svelte

@@ -3,7 +3,7 @@
   // render-only). Reuses the shared logic verbatim (switchReducer / valueFromChange /
   // shouldSnapBack, exactly like React's useReducer + Vue's ref-based reducer wiring) and
   // calls renderSwitch() itself for the prop assembly — its Descriptor is always exactly one
-  // `symbiote-switch` node with zero children (core/components/src/view/render-switch.ts). Root
+  // `symbiote-switch-managed` node with zero children (core/components/src/view/render-switch.ts). Root
   // stays a literal tag (bind:this needs a known tag); `createDescriptorChildrenSync` is still
   // wired for its (always-empty) children, matching every other category-1 component uniformly
   // — the same reason React still routes a childless Switch through descriptorToReact rather
@@ -131,4 +131,4 @@
   });
 </script>
 
-<symbiote-switch p={descriptor.props} bind:this={hostShim} />
+<symbiote-switch-managed p={descriptor.props} bind:this={hostShim} />

package/build/components/text-input/index.svelte

@@ -48,6 +48,10 @@
     setInputFocused,
     setInputBlurred,
     type ISymbioteEvent,
+    type ISymbioteNode,
+    type IMeasureOnSuccess,
+    type IMeasureInWindowOnSuccess,
+    type IMeasureLayoutOnSuccess,
   } from '@symbiote-native/engine';
   import { createDescriptorChildrenSync } from '../../descriptor-to-svelte';
   import { createAttachmentsSync } from '../../runes/attachments';
@@ -277,6 +281,43 @@
     ]);
   }
 
+  // The four host-ref methods, FORWARDED to the engine node rather than reimplemented.
+  //
+  // Without them a TextInput ref was poorer than any other host ref in the adapter: every other
+  // primitive hands back a node carrying measure/measureInWindow/measureLayout/setNativeProps, and
+  // this wrapper closed the node behind five methods of its own. The lowered path lost the opposite
+  // four, so the two paths were not "one narrowing the other" but two different surfaces.
+  // `ITextInputHandle` is the union of both halves, and `text-input.smoke.test.ts` derives what this
+  // component must expose from `buildTextInputHandle` — so a method added to core fails here rather
+  // than going missing on whichever path an app happened to take.
+  //
+  // Not typed as `satisfies ITextInputHandle`: these are instance-script exports, so the component's
+  // imperative surface is structurally invisible to the compiler — which is exactly why the test is
+  // the guard here and the type is the guard on React, Angular and Solid.
+  export function measure(callback: IMeasureOnSuccess): void {
+    hostShim?.engineNode?.measure(callback);
+  }
+
+  export function measureInWindow(callback: IMeasureInWindowOnSuccess): void {
+    hostShim?.engineNode?.measureInWindow(callback);
+  }
+
+  export function measureLayout(
+    relativeToNativeNode: ISymbioteNode | number,
+    onSuccess: IMeasureLayoutOnSuccess,
+    onFail?: () => void,
+  ): void {
+    hostShim?.engineNode?.measureLayout(
+      relativeToNativeNode,
+      onSuccess,
+      onFail,
+    );
+  }
+
+  export function setNativeProps(nativeProps: Record<string, unknown>): void {
+    hostShim?.engineNode?.setNativeProps(nativeProps);
+  }
+
   const descriptor = $derived(
     renderTextInput({
       multiline: isMultiline,
@@ -309,8 +350,23 @@
   });
 </script>
 
+<!--
+  The `-managed` tags, matching `renderTextInput`'s intrinsics. They resolve to the SAME native view
+  as the plain ones; the separate spelling is what keeps the host behavior off this node. The machine
+  is registered against `symbiote-text-input` / `…-multiline`, which only the LOWERING transform
+  emits, and this wrapper runs the same lifecycle itself (focus/blur mirror, event counter,
+  controlled write, autoFocus) — so sharing a tag would give one node two owners.
+
+  Written literally rather than as `<svelte:element this={descriptor.type}>` for the reason the
+  header records, which means this pair does NOT follow `render-text-input.ts` on its own: if those
+  intrinsics are renamed again, this file has to move with them. `text-input-tag.test.ts` is what
+  makes that a failing test instead of a silent double-owner.
+-->
 {#if isMultiline}
-  <symbiote-text-input-multiline p={descriptor.props} bind:this={hostShim} />
+  <symbiote-text-input-multiline-managed
+    p={descriptor.props}
+    bind:this={hostShim}
+  />
 {:else}
-  <symbiote-text-input p={descriptor.props} bind:this={hostShim} />
+  <symbiote-text-input-managed p={descriptor.props} bind:this={hostShim} />
 {/if}

package/build/components/text-input/index.svelte.d.ts

@@ -1,12 +1,17 @@
 import type { ITextInputProps } from './text-input-props';
 export type { ITextInputProps };
 export type { ITextInputHandle } from '@symbiote-native/components';
+import { type ISymbioteNode, type IMeasureOnSuccess, type IMeasureInWindowOnSuccess, type IMeasureLayoutOnSuccess } from '@symbiote-native/engine';
 declare const Index: import("svelte").Component<ITextInputProps, {
     focus: () => void;
     blur: () => void;
     clear: () => void;
     isFocused: () => boolean;
     setSelection: (start: number, end: number) => void;
+    measure: (callback: IMeasureOnSuccess) => void;
+    measureInWindow: (callback: IMeasureInWindowOnSuccess) => void;
+    measureLayout: (relativeToNativeNode: ISymbioteNode | number, onSuccess: IMeasureLayoutOnSuccess, onFail?: () => void) => void;
+    setNativeProps: (nativeProps: Record<string, unknown>) => void;
 }, "value">;
 type Index = ReturnType<typeof Index>;
 export default Index;

package/build/components/touchable-highlight/index.svelte

@@ -126,6 +126,7 @@
 </script>
 
 <Pressable
+  __minPressDuration={0}
   {...rest}
   style={containerStyle}
   onPress={handlePress}

package/build/components/touchable-native-feedback/touchable-native-feedback.svelte

@@ -40,7 +40,7 @@
   const nativeProps = $derived(backgroundProps(resolved, useForeground));
 </script>
 
-<Pressable {...rest}>
+<Pressable __minPressDuration={0} {...rest}>
   {#snippet children()}
     <symbiote-view p={nativeProps}>
       {@render content?.()}

package/build/components/touchable-opacity/index.svelte

@@ -168,6 +168,7 @@
 </script>
 
 <Pressable
+  __minPressDuration={0}
   {...rest}
   onPressIn={handlers.handlePressIn}
   onPressOut={handlers.handlePressOut}

package/build/components/touchable-without-feedback/index.svelte

@@ -64,6 +64,7 @@
 </script>
 
 <Pressable
+  __minPressDuration={0}
   {...rest}
   onPressIn={handlers.handlePressIn}
   onPressOut={handlers.handlePressOut}

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

@@ -1,14 +1,20 @@
 import { type ISymbioteNode } from '@symbiote-native/engine';
 import { ShimNode } from './shim-node';
 export type IShimPropBag = Record<string, unknown>;
-export declare class ShimElement extends ShimNode {
+export declare abstract class ShimElementBase extends ShimNode {
+}
+export declare class ShimElement extends ShimElementBase {
     readonly tagName: string;
     readonly namespaceURI: string | undefined;
-    private readonly attributes;
-    private readonly domListeners;
+    private attributes;
+    private domListeners;
     private lastBag;
     constructor(tagName: string, namespaceURI?: string);
     get nodeName(): string;
+    private styleSlot;
+    get style(): {
+        cssText: string;
+    };
     get p(): IShimPropBag;
     set p(bag: IShimPropBag | undefined);
     setAttribute(name: string, value: string): void;

package/build/dom-shim/element.js

@@ -10,10 +10,15 @@
 // A per-key diff in the setter is MANDATORY (§3g(c)), not an optimization: Svelte's
 // `set_custom_element_data` has no early-out guard and runs on every effect re-fire, so
 // without the diff every prop gets rewritten whenever any one of them changes.
-import { createElement, dlog, isDebug, routeProp, setEventListener, toPublicInstance, } from '@symbiote-native/engine';
+import { createElement, dlog, routeProp, setEventListener, toPublicInstance, } from '@symbiote-native/engine';
 import { descriptorFor } from '@symbiote-native/components';
 import { normalizeSvelteClass } from '../class-value.js';
+import { foldHostBag } from './fold-host-bag.js';
 import { ShimNode } from './shim-node.js';
+// The bag a not-yet-live element is diffed against in onMadeLive. A module constant rather than a
+// fresh `{}` per node: it is only ever read, and the identity lets applyBagDiff skip its second
+// pass outright on the create path.
+const EMPTY_BAG = Object.freeze({});
 // Diagnostic-only: a process-wide sequence so every `set p` call across every shim element in a
 // log dump is individually orderable against AnimatedProps reconcile#N / AnimatedView reduced#N
 // / hostShim identity-change#N, to see which one is driving which.
@@ -21,12 +26,26 @@ let globalSetPSeq = 0;
 // `on<Name>` handlers ride inside the prop bag (idiomatic Svelte 5 callback props — see the
 // skill's §3g(c) "most of §5 collapses" note) — they are not addEventListener-style DOM
 // listeners, so they are diffed and routed exactly like any other bag key, through routeProp.
-export class ShimElement extends ShimNode {
+// An empty layer that exists to be what `globalThis.Element` points at, and it is load-bearing.
+// Svelte's `get_setters` (internal/client/dom/elements/attributes.js) walks from the ELEMENT
+// INSTANCE up and STOPS when it reaches `Element.prototype`. While `Element` was `ShimElement`
+// itself, the first prototype step was already the stop, so the walk collected nothing and `p` —
+// which lives on `ShimElement.prototype`, one step past it — was invisible. `set_attributes` then
+// fell through to `setAttribute`, which writes an inert Map, and every prop vanished with nothing
+// red. The rule is therefore that `Element` must be a proper ANCESTOR of the class owning the
+// setters, never that class: `.claude/rules/svelte-shim-element-global-must-be-an-ancestor.md`.
+export class ShimElementBase extends ShimNode {
+}
+export class ShimElement extends ShimElementBase {
     tagName;
     namespaceURI;
-    attributes = new Map();
-    domListeners = new Map();
-    lastBag = {};
+    // Both LAZY, and that is a measured decision, not a style one. A lowered primitive carries its
+    // whole prop surface in the `p` bag, so neither map is ever written on the create path — but an
+    // eager field allocated two Maps per element regardless, 18 004 of them on a 1 000-row create,
+    // in a window where GC is the largest single bucket (29%).
+    attributes;
+    domListeners;
+    lastBag = EMPTY_BAG;
     constructor(tagName, namespaceURI) {
         super();
         this.tagName = tagName;
@@ -35,66 +54,85 @@ export class ShimElement extends ShimNode {
     get nodeName() {
         return this.tagName;
     }
+    // `set_style` writes `dom.style.cssText`, so a shim with no `.style` THROWS rather than
+    // 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.
+    styleSlot;
+    get style() {
+        return (this.styleSlot ??= { cssText: '' });
+    }
     // The single object-bag prop. The literal name is ours to choose (§3g(c)) — the adapter's
     // own View.svelte/Text.svelte/… emit `<symbiote-view p={bag}>`; app code never sees it.
     get p() {
         return this.lastBag;
     }
     set p(bag) {
-        const next = normalizeBagClasses(bag ?? {});
+        // The fold runs HERE rather than at element creation because an alias can arrive on an update
+        // (`id` bound to a signal), and it runs before the diff so `lastBag` is always the folded shape
+        // — otherwise a seeded default would look like a change on every single set.
+        const next = foldHostBag(this.tagName, normalizeBagClasses(bag ?? {}));
         const prev = this.lastBag;
         this.lastBag = next;
-        const changedKeys = diffKeys(prev, next);
-        dlog(`ShimElement set-p#${++globalSetPSeq} tag=${this.tagName} live=${this.engineNode !== undefined} ` +
-            `changedKeys=${changedKeys.join(',')}`);
+        // THUNK, not a string (see debug.ts's header): this setter runs once per element per create
+        // and the changed-key list is diagnostic only. Built eagerly it cost a Set, two key arrays, a
+        // join and a template literal on every one of 9 002 elements, with logging off.
+        dlog(() => `ShimElement set-p#${++globalSetPSeq} tag=${this.tagName} live=${this.engineNode !== undefined} ` +
+            `changedKeys=${diffKeys(prev, next).join(',')}`);
         if (this.engineNode === undefined)
             return; // not live yet — onMadeLive() replays `next` in full
         applyBagDiff(this.engineNode, prev, next);
         this.surface?.requestCommit();
     }
     setAttribute(name, value) {
-        this.attributes.set(name, value);
+        (this.attributes ??= new Map()).set(name, value);
     }
     getAttribute(name) {
-        return this.attributes.get(name) ?? null;
+        return this.attributes?.get(name) ?? null;
     }
     removeAttribute(name) {
-        this.attributes.delete(name);
+        this.attributes?.delete(name);
     }
     addEventListener(name, handler) {
-        this.domListeners.set(name, handler);
+        (this.domListeners ??= new Map()).set(name, handler);
         if (this.engineNode !== undefined)
             setEventListener(this.engineNode, name, handler);
     }
     removeEventListener(name) {
-        this.domListeners.delete(name);
+        this.domListeners?.delete(name);
         if (this.engineNode !== undefined)
             setEventListener(this.engineNode, name, undefined);
     }
     cloneNode(deep) {
         const clone = new ShimElement(this.tagName, this.namespaceURI);
-        for (const [key, value] of this.attributes)
-            clone.attributes.set(key, value);
+        if (this.attributes !== undefined)
+            clone.attributes = new Map(this.attributes);
         if (deep === true) {
             for (const child of this.children)
                 clone.appendChild(child.cloneNode(true));
         }
         return clone;
     }
-    // toPublicInstance grafts measure/measureInWindow/measureLayout/setNativeProps/focus/blur
-    // onto the node — the imperative API a `bind:this` host ref hands back, the same augmentation
-    // Vue's renderer applies at its own commit point (renderer/index.ts) and React gets from
-    // getPublicInstance. Mutates in place and returns the SAME node, so this is a safe drop-in for
-    // the previously-bare createElement() call.
+    // measure/measureInWindow/measureLayout/setNativeProps/focus/blur — the imperative API a
+    // `bind:this` host ref hands back — ride on the engine node's prototype, so toPublicInstance is
+    // the identity and this reads the same as Vue's renderer (renderer/index.ts) and React's
+    // getPublicInstance.
     createEngineNode() {
         const descriptor = descriptorFor(this.tagName);
-        return toPublicInstance(createElement(descriptor.component, descriptor.isText));
+        // The INTRINSIC TAG as the third argument, and this is the only place the tag alphabet still
+        // exists: `descriptor.component` is the Fabric view name (`symbiote-view` -> `RCTView`), so a
+        // host-behavior registry keyed by tag can only be reached from here. The argument defaults to
+        // `component`, so passing it changes nothing until a behavior is registered.
+        return toPublicInstance(createElement(descriptor.component, descriptor.isText, this.tagName));
     }
     onMadeLive() {
         const engineNode = this.engineNode;
         if (engineNode === undefined)
             return;
-        applyBagDiff(engineNode, {}, this.lastBag);
+        applyBagDiff(engineNode, EMPTY_BAG, this.lastBag);
+        if (this.domListeners === undefined)
+            return;
         for (const [name, handler] of this.domListeners)
             setEventListener(engineNode, name, handler);
     }
@@ -120,11 +158,25 @@ function normalizeBagClasses(bag) {
     }
     return next;
 }
+// Diagnostic only — the one caller is the `dlog` thunk above. The allocation-free twin below is
+// what the hot path uses; keep them in step.
 function diffKeys(prev, next) {
     const keys = new Set([...Object.keys(prev), ...Object.keys(next)]);
     return [...keys].filter(key => prev[key] !== next[key]);
 }
+// Deliberately NOT `for (const key of diffKeys(...))`: that materialized a Set, two key arrays,
+// a spread and a filtered array per element. Two direct passes route exactly the same keys —
+// changed-or-added from `next`, then dropped keys from `prev` as `undefined`, which is what
+// `next[key]` evaluated to in the old shape.
 function applyBagDiff(engineNode, prev, next) {
-    for (const key of diffKeys(prev, next))
-        routeProp(engineNode, key, next[key]);
+    for (const key of Object.keys(next)) {
+        if (prev[key] !== next[key])
+            routeProp(engineNode, key, next[key]);
+    }
+    if (prev === EMPTY_BAG)
+        return;
+    for (const key of Object.keys(prev)) {
+        if (!(key in next))
+            routeProp(engineNode, key, undefined);
+    }
 }

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

@@ -0,0 +1 @@
+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

@@ -0,0 +1,7 @@
+// 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';

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

@@ -24,7 +24,7 @@
 //
 // `customElements` IS patched, unlike the three above — see its own comment below.
 import { dlog } from '@symbiote-native/engine';
-import { ShimElement } from './element.js';
+import { ShimElement, ShimElementBase } from './element.js';
 import { ShimText } from './text.js';
 import { ShimComment } from './comment.js';
 import { ShimDocumentFragment } from './document-fragment.js';
@@ -70,7 +70,9 @@ export function patchGlobals() {
         customElements: g.customElements,
     };
     g.Node = ShimNode;
-    g.Element = ShimElement;
+    // ShimElementBase, NOT ShimElement: `get_setters` stops AT `Element.prototype`, so pointing this
+    // at the class that owns `p` hides `p` from every `set_attributes` caller. See element.ts.
+    g.Element = ShimElementBase;
     // Svelte's mandatory paths never distinguish HTMLElement/SVGElement from Element (we have
     // no `<svg>` primitives), so both alias the same class — real, extensible prototypes either
     // way, which is all `init_operations()` requires (§3a).

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

@@ -69,12 +69,23 @@ export class ShimNode {
         for (const node of nodes)
             this.appendChild(node);
     }
+    // The fragment branch is the rare one — every ordinary insert is a single node — but
+    // `normalizeInsertable` allocated a one-element array for it regardless, 23 006 of them on a
+    // 1 000-row create. Test the flag first and hand the node straight to insertOne.
     appendChild(node) {
+        if (!node.isDocumentFragment) {
+            this.insertOne(node, null);
+            return node;
+        }
         for (const single of normalizeInsertable(node))
             this.insertOne(single, null);
         return node;
     }
     insertBefore(node, ref) {
+        if (!node.isDocumentFragment) {
+            this.insertOne(node, ref);
+            return node;
+        }
         for (const single of normalizeInsertable(node))
             this.insertOne(single, ref);
         return node;

package/build/host-instance.js

@@ -22,9 +22,8 @@ function isShimElement(value) {
 }
 // The typed imperative handle (measure/measureInWindow/measureLayout/setNativeProps/focus/blur)
 // a `bind:this` host ref carries — the Svelte twin of a React `ref.current`/Vue template ref
-// already being an `IHostInstance`. `dom-shim/element.ts`'s `createEngineNode()` grafts
-// toPublicInstance onto every host node AT CREATION, so this call is idempotent (its own
-// isHostInstance guard short-circuits); this helper exists only to give app code a correctly
+// already being an `IHostInstance`. Every engine node carries those methods on its prototype, so
+// the toPublicInstance call below is the identity; this helper exists only to give app code a correctly
 // TYPED accessor off the SHIM value (`ShimElement`) instead of the bare `.engineNode` field,
 // with no `as` cast at the call site.
 export function hostInstance(shim) {

package/build/index.d.ts

@@ -1,3 +1,4 @@
+import './register';
 export { mount, unmount } from './render';
 export { AppRegistry, setHostRegistrar } from './modules/app-registry';
 export type { IComponentProvider, IWrapperComponentProvider, IAppParameters, IRunnable, IHostRegistrar, IRegistry, IHeadlessTask, ITaskProvider, ITaskCanceller, ITaskCancelProvider, } from './modules/app-registry';

package/build/index.js

@@ -9,6 +9,10 @@
 // `descriptorToSvelte` bridge was ever needed — each component below is hand-authored Svelte
 // markup mirroring its render-*.ts, reusing only the pure state/render logic. See skill §17/§18
 // for the one open async-exception repro and the honest cross-cutting gap list.
+// Bare side-effect import, deliberately NOT a re-export and deliberately not beside one of the
+// same specifier: it registers the press behavior with the engine's host-behavior registry. Any
+// other shape is dropped by Metro's inlineRequires in a release build — see register.ts.
+import './register.js';
 export { mount, unmount } from './render.js';
 export { AppRegistry, setHostRegistrar } from './modules/app-registry/index.js';
 export { View, Text, ActivityIndicator, Image, ImageBackground, InputAccessoryView, KeyboardAvoidingView, Switch, TextInput, Modal, SafeAreaView, RefreshControl, Pressable, TouchableOpacity, TouchableHighlight, TouchableWithoutFeedback, TouchableNativeFeedback, Button, ScrollView, ScrollViewStickyHeader, VirtualizedList, FlatList, VirtualizedSectionList, SectionList, } from './components/index.js';

package/build/preprocessor/lower-host-primitives.d.ts

@@ -0,0 +1,10 @@
+interface IMarkupInput {
+    readonly content: string;
+    readonly filename?: string;
+}
+export declare function lowerHostPrimitives(): {
+    markup(input: IMarkupInput): {
+        code: string;
+    };
+};
+export {};