@symbiote-native/vue 0.5.0 → 1.0.0

package/build/index.js

@@ -1,6 +1,11 @@
 // @symbiote-native/vue: a thin Vue 3 reconciler over @symbiote-native/engine. createRenderer maps
 // each RendererOptions call onto the engine's mutation API; all Fabric clone-on-write
 // lives in the engine, shared with every other adapter. App code names only @symbiote-native/vue.
+// Side-effect import, FIRST and deliberately not a re-export: it installs the engine-side press
+// machine that a lowered `<symbiote-pressable>` needs. `export * from './register'` or a bare
+// import sitting beside a re-export of the same specifier both go lazy under Metro's production
+// `inlineRequires` and the registration silently never runs in a release build. See register.ts.
+import './register.js';
 export { mount, unmount, setAppConfigurator } from './render.js';
 // The portal: Vue's own <Teleport>, guarded so `to` must be a node/surface this renderer actually
 // mounted (there is no querySelector). It MOVES host nodes, so it reaches any already-mounted

package/build/modules/animated/create-animated-component.d.ts

@@ -1,4 +1,4 @@
 import { type Component } from '@vue/runtime-core';
-export declare function createAnimatedComponent(Component: Component): import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+export declare function createAnimatedComponent(Component: Component | string): import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/build/modules/animated/create-animated-component.js

@@ -12,8 +12,11 @@ import { normalizeVueAttrs } from '../../utils/normalize-attrs.js';
 // the COMMITTED props (sticky-header passthrough). Named once here so render/reconcile agree.
 const PASSTHROUGH_PROP = 'passthroughAnimatedPropExplicitValues';
 // Reads either a functional component's or a stateful defineComponent's display name, without a
-// cast, for the wrapper's devtools name.
+// cast, for the wrapper's devtools name. A string base IS its own name — an intrinsic tag carries
+// no displayName to read.
 function baseName(component) {
+    if (typeof component === 'string')
+        return component;
     if (component === null ||
         (typeof component !== 'function' && typeof component !== 'object')) {
         return 'Anonymous';
@@ -26,6 +29,8 @@ function baseName(component) {
         return name;
     return 'Anonymous';
 }
+// The base may be an intrinsic TAG, not only a component: `Animated.View` is built over `View`,
+// and a primitive that becomes a public tag hands this a string. `h()` takes either.
 export function createAnimatedComponent(Component) {
     return defineComponent({
         name: `Animated(${baseName(Component)})`,
@@ -104,9 +109,18 @@ export function createAnimatedComponent(Component) {
                             : [reduced.style, passthroughStyle];
                 }
                 reduced.ref = captureRef;
-                // Forward the WHOLE slots object, not just `default`: the list containers take their
-                // content through named scoped slots (`item`, `sectionHeader`, ...), which a default-only
-                // forward drops silently - Animated.FlatList would commit empty cells.
+                // The WHOLE slots object, for a component base AND for a tag base. Not just `default`:
+                // the list containers take their content through named scoped slots (`item`,
+                // `sectionHeader`, ...), which a default-only forward drops silently — Animated.FlatList
+                // would commit empty cells.
+                //
+                // A string base needs no branch here, and the reason is worth recording because the code
+                // that reads it looks like it does. For an element Vue unwraps the object itself, calling
+                // `children.default()` and recursing on the RESULT rather than going back through `h`
+                // (`normalizeChildren`, the `shapeFlag & (1 | 64)` branch) — so a slot returning a lone
+                // VNode would be re-read as an object, found to have no `.default`, and dropped, with no
+                // error. That case cannot arise: Vue wraps every slot at initSlots so `slots.default()`
+                // returns an ARRAY whatever the author's function returned. Measured both spellings.
                 return h(Component, reduced, slots);
             };
         },

package/build/register.d.ts

@@ -0,0 +1 @@
+export {};

package/build/register.js

@@ -0,0 +1,35 @@
+// Side-effect ONLY. This module exports nothing, on purpose.
+//
+// A lowered `<symbiote-pressable>` is an element, so the press machine lives on the engine node
+// instead of inside a component — and it gets there by `registerPressableBehavior()` having run
+// before the first node of that tag is created. The entry imports this file as a bare
+// `import './register';`.
+//
+// WHY IT CANNOT BE A RE-EXPORT, and why this file has no exports to re-export in the first place.
+// Metro turns on `inlineRequires` for production only: it moves a `require()` down to the first
+// place its binding is USED, and a barrel's `export { X } from './x'` compiles to a lazy getter. A
+// module reached only that way never evaluates unless something names X as a VALUE, so its
+// registration silently never happens — in RELEASE builds only, invisible to tsc, to vitest, and
+// even to grepping the bundle, because the code IS bundled and simply never runs. A bare
+// `import './register';` placed NEXT TO a re-export of the same specifier does not help either:
+// Babel merges the two into one dependency and the merged one stays lazy. See CLAUDE.md, "Never
+// make correctness depend on a module's load-time side effect".
+//
+// `adapters/vue/src/index.test.ts` pins the barrel against both halves of that.
+import { registerImageBehavior, registerInputAccessoryViewBehavior, registerPressableBehavior, registerSwitchBehavior, registerTextInputBehavior, } from '@symbiote-native/components';
+registerPressableBehavior();
+// Only the LOWERED tags carry this — the wrapper renders `symbiote-text-input-managed` and
+// keeps running its own lifecycle. One owner per node; see `component-names/shared.ts`.
+registerTextInputBehavior();
+// Same reason as TextInput: the wrapper renders `symbiote-switch-managed` and runs its own
+// lastNativeReport/snap-back lifecycle, so the engine's copy attaches only to the bare tag.
+registerSwitchBehavior();
+// Image owns no runtime — its behavior is a prop FOLD and nothing else, and it is registered on the
+// same `symbiote-image` the wrapper already emits rather than on a `-managed` twin. That is safe
+// only because the mapping is idempotent, which `core/components/src/behaviors/image.test.ts`
+// asserts rather than assumes; a wrapper-built node simply folds a second time and nothing moves.
+registerImageBehavior();
+// Fold-only, and it shares the wrapper's tag for the same reason Image does: the mapping has no
+// aliasing at all, so a wrapper-built node folding a second time moves nothing.
+// `core/components/src/behaviors/input-accessory-view.test.ts` asserts that rather than assuming it.
+registerInputAccessoryViewBehavior();

package/build/renderer/index.js

@@ -3,14 +3,47 @@
 // drives the exact same retained tree React does: the proof the core is framework-
 // agnostic.
 import { createRenderer } from '@vue/runtime-core';
-import { appendChild, createAnchor, createElement, createRawText, dlog, insertBefore, removeChild, routeProp, setText, toPublicInstance, RAW_TEXT_COMPONENT, SymbioteSurface, } from '@symbiote-native/engine';
+import { appendChild, createAnchor, createElement, createRawText, dlog, insertBefore, removeChild, routeProp, setProp, setText, toPublicInstance, RAW_TEXT_COMPONENT, SymbioteSurface, } from '@symbiote-native/engine';
 import { descriptorFor } from '@symbiote-native/components';
+import { normalizeVueAttrKey } from '../utils/normalize-attrs.js';
 function isSurface(parent) {
     return parent instanceof SymbioteSurface;
 }
 function isRawText(node) {
     return node.component === RAW_TEXT_COMPONENT;
 }
+// RN's Text.js applies two defaults on the way to native (core/components/src/text-props.ts:
+// ellipsizeMode 'tail', allowFontScaling true unless literally false). The Vue <Text> wrapper
+// folded them with resolveTextProps; a template that the SFC transformer lowered to the
+// intrinsic `symbiote-text` has no wrapper, so the renderer seeds them instead. Without this a
+// numberOfLines={1} line clips mid-word with no ellipsis — device-observed, and silent.
+const TEXT_DEFAULTS = new Map([
+    ['ellipsizeMode', 'tail'],
+    ['allowFontScaling', true],
+]);
+function seedTextDefaults(node) {
+    for (const [key, value] of TEXT_DEFAULTS)
+        setProp(node, key, value);
+}
+// RN's `id` is the modern W3C-named alias for `nativeID` — View.js copies it over
+// (`processedProps.nativeID = id`), so the two name ONE native prop. React folds it in its
+// component wrapper and Svelte and Solid in their transforms; Vue had it nowhere, so `<View
+// id="x">` reached Fabric with an unknown `id` and no `nativeID`, silently and on device only.
+// It lives in the renderer rather than in a transform because that covers all four Vue paths at
+// once — lowered SFC, lowered TSX, the component wrapper, and a hand-written
+// `h('symbiote-view', { id })` no compiler ever sees.
+//
+// Caveat, and it matches what Solid's compile-time rename already does: with BOTH `id` and
+// `nativeID` on one element the last patchProp wins, where upstream gives `id` priority
+// unconditionally. Honouring that needs per-node state to remember an `id` arrived; no example or
+// test sets both, so the state is not worth carrying.
+const PROP_ALIASES = new Map([['id', 'nativeID']]);
+// An explicit `undefined` must NOT clear one of those defaults: RN treats a missing prop and an
+// explicit undefined alike, and only a literal `false` opts out of allowFontScaling. Reached
+// only when a value is already undefined, so it costs nothing on the hot path.
+function textDefaultFor(node, key) {
+    return node.isText ? TEXT_DEFAULTS.get(key) : undefined;
+}
 // One renderer per mounted surface: the options close over the surface so every mutation
 // can ask it to (microtask-coalesced) recommit. Vue has no resetAfterCommit; instead
 // requestCommit() collapses a burst of insert/patchProp within one tick into a single
@@ -19,13 +52,23 @@ export function createSymbioteRenderer(surface) {
     const options = {
         createElement(type) {
             const descriptor = descriptorFor(type);
-            const node = createElement(descriptor.component, descriptor.isText);
-            // Graft the imperative public-instance API (measure / setNativeProps / focus / …) onto
-            // the raw node so a template/function ref to a host element exposes it exactly like
-            // React's getPublicInstance. toPublicInstance mutates in place and returns the SAME node
-            // identity, so the engine commit mirror (keyed on the raw node) still resolves it — the
-            // ref must keep holding this raw node by identity (shallowRef), never a deep ref.
-            dlog(`vue createElement ${descriptor.component} -> public instance`);
+            // `type` as the third argument, not just `descriptor.component`: the behavior registry is
+            // keyed by the INTRINSIC TAG (`symbiote-pressable`), while a node only ever carries the
+            // resolved Fabric name (`RCTView`). This is the one place that still holds both, so a
+            // lowered primitive whose machine lives on the engine node can be matched at all.
+            const node = createElement(descriptor.component, descriptor.isText, type);
+            if (descriptor.isText)
+                seedTextDefaults(node);
+            // The imperative public-instance API (measure / setNativeProps / focus / …) is already on
+            // the node's prototype, so a template/function ref to a host element exposes it exactly
+            // like React's getPublicInstance and toPublicInstance is the identity. The ref must keep
+            // holding this raw node by identity (shallowRef), never a deep ref — the engine commit
+            // mirror is keyed on it.
+            //
+            // The message is a THUNK, not a template literal: this runs once per node — 9 000 times on
+            // one benchmark press — and a literal is built at the call site before dlog can decide
+            // anything (see core/engine/src/debug.ts).
+            dlog(() => `vue createElement ${descriptor.component} -> public instance`);
             return toPublicInstance(node);
         },
         createText(text) {
@@ -110,11 +153,17 @@ export function createSymbioteRenderer(surface) {
         patchProp(el, key, _prev, next) {
             if (isSurface(el))
                 return;
+            // Kebab -> camel happens HERE, not only inside a component wrapper: the SFC transformer
+            // lowers View/Text to their intrinsic tags (metro-vue-transformer.cjs), so those props
+            // arrive one key at a time with no component to fold the bag. Idempotent for the wrapped
+            // path, which already normalized.
+            const normalized = normalizeVueAttrKey(key);
+            const name = PROP_ALIASES.get(normalized) ?? normalized;
             // routeProp makes the prop-vs-event decision from the node's ViewConfig (onPress on a
             // View becomes a listener; onTintColor on a Switch stays a prop), shared with React. The
             // class/style merge (explicit :style always winning, regardless of which of Vue's two
             // independent patchProp calls lands last) is centralized there too (core/engine/src/node.ts).
-            routeProp(el, key, next);
+            routeProp(el, name, next === undefined ? textDefaultFor(el, name) : next);
             surface.requestCommit();
         },
         // RN has no querySelector / scope-id / innerHTML. The first two are inert; static

package/build/runtime-helpers/index.d.ts

@@ -2,7 +2,11 @@ export * from '@vue/runtime-core';
 import { type ObjectDirective } from '@vue/runtime-core';
 import { type ISymbioteNode } from '@symbiote-native/engine';
 export { Teleport, type ITeleportTarget } from '../create-portal';
+export declare function normalizeProps(props: Record<string, unknown> | null | undefined): Record<string, unknown> | null;
+export declare function normalizeStyle(value: unknown): unknown;
+export declare function mergeProps(...args: Record<string, unknown>[]): Record<string, unknown>;
 export declare const vShow: ObjectDirective<ISymbioteNode, boolean>;
+export declare const vModelText: ObjectDirective<ISymbioteNode, unknown>;
 type ISystemModifier = 'ctrl' | 'shift' | 'alt' | 'meta';
 type IEventModifier = ISystemModifier | 'stop' | 'prevent' | 'self' | 'left' | 'middle' | 'right' | 'exact';
 type IModifierGuardableEvent = {

package/build/runtime-helpers/index.js

@@ -6,16 +6,100 @@
 // real HTMLElement - we have no DOM, so this module supplies our OWN implementation under the
 // same export name instead of leaving `v-show` a silent no-op.
 //
-// Scope: this covers only Vue's own template directives (v-show, Teleport); native-element
-// v-model is a separate, out-of-scope case.
+// Scope: Vue's own template directives (v-show, Teleport) and, since host-primitive lowering
+// landed, `v-model` on an ELEMENT — see vModelText below for why that stopped being out of scope.
 export * from '@vue/runtime-core';
-import { getCurrentInstance, warn, } from '@vue/runtime-core';
-import { setNativeProps, whenCommitted, } from '@symbiote-native/engine';
+import { getCurrentInstance, mergeProps as baseMergeProps, normalizeClass, normalizeStyle as baseNormalizeStyle, warn, } from '@vue/runtime-core';
+import { requestCommitFor, setNativeProps, setProp, whenCommitted, } from '@symbiote-native/engine';
+import { descriptorFor, SWITCH_TAG } from '@symbiote-native/components';
 // Shadows runtime-core's own Teleport for every compiled `from 'vue'` import (see the header):
 // same component, plus a runtime guard on `to`. Lives in ../create-portal so the adapter's portal
 // sits where every other adapter's does; re-exported here because THIS is the module Metro
 // rewrites `vue` to, and an `export *` alone would resolve `Teleport` to the unguarded original.
 export { Teleport } from '../create-portal/index.js';
+// Shadows @vue/shared's own `normalizeProps` for every compiled `from 'vue'` import, for ONE
+// divergence: a FUNCTION-valued `style` survives it.
+//
+// `v-bind="obj"` compiles to `_normalizeProps(_guardReactiveProps(obj))`, and Vue's version runs
+// `normalizeStyle` over the style key. That helper knows array / string / object and returns
+// `undefined` for a function — so `style: ({ pressed }) => …` arriving inside a spread is destroyed
+// before any adapter code runs, with no error and nothing red. A functional style is a React Native
+// idiom the engine resolves in `routeProp` (`isStyleCallback`); Vue's normaliser is DOM-shaped and
+// cannot know that.
+//
+// Measured 2026-09-01 through the real SFC pipeline, which is the ONLY path that reaches this:
+// `h(Component, { ...bag })` skips `normalizeProps` entirely and shows the style arriving intact,
+// so a probe written that way reports the bug as absent.
+//
+//   <View v-bind="bag">       fn style   committed {testID}              <- style gone
+//   <Pressable v-bind="bag">  fn style   committed {testID}              <- style gone
+//   either, object style                 committed {testID, opacity}     <- fine
+//
+// EVERY primitive, not only the stateful ones — both arms measured. Only `style`: `normalizeClass`
+// has no equivalent hazard that anyone has shown, and an override wider than the measured defect is
+// how one adapter's problem becomes a shared law.
+//
+// MIRRORS Vue's four lines rather than delegating to them, because hiding the key from the original
+// and restoring it afterwards would mutate the caller's object twice. The normalisation itself is
+// still Vue's — only the dispatch is ours, and `normalize-props.test.ts` pins it against the
+// compiled path.
+export function normalizeProps(props) {
+    if (!props)
+        return null;
+    const { class: klass, style } = props;
+    if (klass && typeof klass !== 'string')
+        props.class = normalizeClass(klass);
+    if (style && typeof style !== 'function')
+        props.style = baseNormalizeStyle(style);
+    return props;
+}
+// The SECOND door to the same defect, and the one the first fix missed. `v-bind="rest"` standing
+// beside a separate `:style="fn"` does not compile to `normalizeProps` at all — it compiles to
+// `mergeProps`, whose own `style` branch is `ret.style = normalizeStyle([ret.style, toMerge.style])`.
+// The array branch of `normalizeStyle` drops a function element, so the callback dies here too:
+//
+//   <View v-bind="bag" />                  normalizeProps   <- fixed above
+//   <View v-bind="rest" :style="fn" />     mergeProps       <- fixed here
+//   <View :style="fn" />                   neither          <- was never broken
+//
+// Delegates the whole merge — classes, event-handler concatenation, key precedence — and only
+// rescues the callback afterwards, scanning the args in mergeProps' own order so LAST wins. A
+// later non-function `style` clears it again, which is that same precedence.
+//
+// The merge itself cannot be preserved when one side is a callback: a function returns a COMPLETE
+// style, so there is nothing to merge it into. It replaces, which is also how React Native's own
+// contract reads it (`Pressable.js`: `ViewStyleProp | ((state) => ViewStyleProp)` — the callback is
+// top-level, never an array element, so `:style="[a, fn]"` is out of contract here exactly as it is
+// there, and is deliberately NOT rescued).
+// The THIRD door, and the one that decides whether the state-style split can leave the transforms
+// at all. A `:style` binding on a lowered element compiles to `_normalizeStyle(expr)` whenever the
+// compiler cannot keep it on the cheap patch-flag path — an inline arrow and a call expression both
+// do, a bare identifier does not. So `<Pressable :style="({pressed}) => …" />` loses its callback
+// here, and today nothing notices because the lowering transform rewrites that attribute into a
+// resting/active pair before Vue ever emits the helper.
+//
+// A TOP-LEVEL function is preserved; one nested inside an array is not, and that asymmetry is the
+// contract rather than an omission. React Native types the prop
+// `ViewStyleProp | ((state) => ViewStyleProp)` (`Pressable.js`), so the callback is top-level or it
+// is not a callback, and the engine's `isStyleCallback` reads it the same way. Rescuing an array
+// element would invent a shape neither side supports.
+export function normalizeStyle(value) {
+    if (typeof value === 'function')
+        return value;
+    return baseNormalizeStyle(value);
+}
+export function mergeProps(...args) {
+    const merged = baseMergeProps(...args);
+    let callback;
+    for (const arg of args) {
+        if (arg === null || arg === undefined || !('style' in arg))
+            continue;
+        callback = typeof arg.style === 'function' ? arg.style : undefined;
+    }
+    if (callback !== undefined)
+        merged.style = callback;
+    return merged;
+}
 // whenCommitted, not a direct call: Vue's `mounted` hook fires synchronously during the patch
 // pass, but this renderer coalesces the actual Fabric commit onto a microtask
 // (surface.requestCommit()), so the node may have no committed tag yet - the same async-commit
@@ -33,6 +117,127 @@ export const vShow = {
     // Drop a still-pending first-commit wait if the element unmounts before it ever lands.
     unmounted: el => pendingShowCommits.get(el)?.(),
 };
+const modelStates = new WeakMap();
+// Runtime guards, not casts: both slots are read out of untyped bags — `vnode.props` and
+// `node.props` are `Record<string, unknown>` — and `typeof x === 'function'` alone narrows to the
+// bare `Function`, which carries no signature.
+function isModelAssign(value) {
+    return typeof value === 'function';
+}
+function isValueChangeListener(value) {
+    return typeof value === 'function';
+}
+// Vue merges duplicate handlers into an array, so the assigner is either a function or a list of
+// them — the same shape upstream's `getModelAssigner` normalises.
+function modelAssigner(props) {
+    const bound = props?.['onUpdate:modelValue'] ?? props?.['onUpdate:value'];
+    if (isModelAssign(bound))
+        return bound;
+    if (!Array.isArray(bound))
+        return undefined;
+    const fns = bound.filter(isModelAssign);
+    return value => fns.forEach(fn => fn(value));
+}
+function modelText(value) {
+    if (typeof value === 'string')
+        return value;
+    return value === undefined || value === null ? '' : String(value);
+}
+// `.trim` and `.number` are pure transforms of the text and behave exactly as upstream. `.lazy` is
+// NOT: upstream implements it by listening to `change` instead of `input`, and this renderer has
+// only the one native stream (RN fires `onChange` per keystroke), so there is no second event to
+// switch to. It warns rather than silently behaving like the eager form.
+function applyModelModifiers(state, text) {
+    const trimmed = state.trim ? text.trim() : text;
+    if (!state.number)
+        return trimmed;
+    const parsed = Number.parseFloat(trimmed);
+    return Number.isNaN(parsed) ? trimmed : parsed;
+}
+function modelStateFor(el) {
+    const existing = modelStates.get(el);
+    if (existing !== undefined)
+        return existing;
+    const state = {
+        assign: undefined,
+        appListener: undefined,
+        trim: false,
+        number: false,
+        listener: (text, event) => {
+            state.appListener?.(text, event);
+            state.assign?.(applyModelModifiers(state, text));
+        },
+    };
+    modelStates.set(el, state);
+    return state;
+}
+// Re-read every beat rather than installed once: the app's own `onValueChange` binding is written
+// by `patchProp` during the same patch, so anything captured earlier is either missing or stale. A
+// prop that is already OUR listener means nothing overwrote it and the app half is unchanged.
+function syncModelListener(el, state) {
+    const current = el.props.onValueChange;
+    if (current === state.listener)
+        return;
+    state.appListener = isValueChangeListener(current) ? current : undefined;
+    setProp(el, 'onValueChange', state.listener);
+}
+// Vue's compiler picks the directive by ELEMENT, and for anything it does not recognise as a DOM
+// input it emits `vModelText` — including a lowered `<symbiote-switch>`. Stringifying there is what
+// upstream must do (a DOM input's value IS a string) and what we must not: the Switch behavior
+// reads `props.value === true`, so `String(true)` pins the control OFF and no tap can move it.
+// Device-confirmed on `examples/vue-sfc` 2026-09-02, both switches on `CanaryScreen`.
+//
+// Resolved through the shared descriptor table rather than a literal Fabric name, so the check
+// follows the platform the bundle actually loaded (iOS `Switch`, Android `AndroidSwitch`) instead
+// of carrying a copy of both.
+const SWITCH_COMPONENT = descriptorFor(SWITCH_TAG).component;
+function isSwitchNode(el) {
+    return el.component === SWITCH_COMPONENT;
+}
+function syncModelValue(el, value) {
+    // The READ half needs no branch: the behavior calls `onValueChange(value, event)` for both
+    // primitives, and `applyModelModifiers` passes a non-string through untouched.
+    if (isSwitchNode(el)) {
+        setProp(el, 'value', value === true);
+        requestCommitFor(el);
+        return;
+    }
+    setProp(el, 'value', modelText(value));
+    // The behavior's `afterCommit` is what turns a changed `value` into the stale-safe
+    // setTextAndSelection command, and nothing else in this patch is going to ask for a commit — the
+    // template no longer carries a `value` binding at all once `v-model` owns it.
+    requestCommitFor(el);
+}
+export const vModelText = {
+    // `created` runs BEFORE props are patched, which is exactly what the value half needs: the
+    // behavior seeds its `lastNativeText` mirror from `value` on the FIRST commit, and a value that
+    // arrives after that seed reads as a divergence and commands redundant text down to native.
+    created(el, { value, modifiers }) {
+        const state = modelStateFor(el);
+        state.trim = modifiers.trim === true;
+        state.number = modifiers.number === true;
+        if (modifiers.lazy === true) {
+            warn('v-model.lazy has no effect here: this renderer has one native text stream, so there is no ' +
+                'second event to defer to.');
+        }
+        syncModelValue(el, value);
+    },
+    mounted(el, { value }, vnode) {
+        const state = modelStateFor(el);
+        state.assign = modelAssigner(vnode.props);
+        syncModelListener(el, state);
+        syncModelValue(el, value);
+    },
+    updated(el, { value }, vnode) {
+        const state = modelStateFor(el);
+        state.assign = modelAssigner(vnode.props);
+        syncModelListener(el, state);
+        syncModelValue(el, value);
+    },
+    unmounted(el) {
+        modelStates.delete(el);
+    },
+};
 const SYSTEM_MODIFIERS = [
     'ctrl',
     'shift',

package/build/state-style.d.ts

@@ -0,0 +1 @@
+export { resolveStateStyle, type IPressStateArgument, type IResolvedStateStyle, } from '@symbiote-native/components/state-style';

package/build/state-style.js

@@ -0,0 +1,13 @@
+// Re-export only. The implementation is shared (`@symbiote-native/components`) because two adapters
+// had written byte-identical copies; this file exists so the code a transform EMITS keeps importing
+// from the adapter package the app already depends on, rather than reaching past it.
+//
+// Imported from the SUBPATH, not the barrel: every adapter barrel re-exports
+// `@symbiote-native/components` wholesale, so a name on that barrel silently becomes public API on
+// all five — which is how a transform internal nearly shipped as a supported export.
+//
+// Present on every adapter, including those with no lowering transform yet: a per-framework subpath
+// that four of five declare is exactly the silent gap `tests/package-subpath-parity.test.ts` exists
+// to catch, and the file costs a re-export. Deliberately NOT on the public barrel — the emitted
+// code names it, app code does not.
+export { resolveStateStyle, } from '@symbiote-native/components/state-style';

package/build/utils/normalize-attrs.d.ts

@@ -1 +1,2 @@
+export declare function normalizeVueAttrKey(key: string): string;
 export declare function normalizeVueAttrs(attrs: Record<string, unknown>): Record<string, unknown>;

package/build/utils/normalize-attrs.js

@@ -12,21 +12,27 @@ const KEBAB_SEGMENT = /-([a-z])/g;
 function toCamel(key) {
     return key.replace(KEBAB_SEGMENT, (_match, char) => char.toUpperCase());
 }
+// The per-KEY half, for the path that never sees a whole attrs bag: a host primitive lowered to
+// its intrinsic tag by the SFC transformer reaches the renderer one patchProp call at a time,
+// with no component in between to fold the bag. Returns the key unchanged (same string identity)
+// whenever there is nothing to convert, which is every key on the hot path.
+export function normalizeVueAttrKey(key) {
+    if (!key.includes('-'))
+        return key;
+    if (key.startsWith('aria-') || key.startsWith('data-'))
+        return key;
+    return toCamel(key);
+}
+// Always returns a PLAIN copy, never the input. An earlier version handed the input back when no
+// key needed converting - which is every SFC/TSX bag, since `@press` / `:style` already arrive
+// camel - and that gave callers Vue's attrs PROXY to read from. In production, not just dev, that
+// proxy's get trap is `track(target, "get", "")` before every value
+// (runtime-core.esm-bundler.js:8357), so each of Pressable's ~16 per-render attr reads paid two
+// map lookups it did not need. The copy loop reads every key through the trap once regardless, so
+// the only thing the early return ever saved was this one object.
 export function normalizeVueAttrs(attrs) {
-    let changed = false;
     const out = {};
-    for (const key of Object.keys(attrs)) {
-        if (key.includes('-') &&
-            !key.startsWith('aria-') &&
-            !key.startsWith('data-')) {
-            out[toCamel(key)] = attrs[key];
-            changed = true;
-        }
-        else {
-            out[key] = attrs[key];
-        }
-    }
-    // Return the original object when nothing converted (the already-camel / TSX path): avoids a
-    // per-render allocation and keeps attrs identity stable.
-    return changed ? out : attrs;
+    for (const key of Object.keys(attrs))
+        out[normalizeVueAttrKey(key)] = attrs[key];
+    return out;
 }

package/metro-css-parser.cjs

@@ -9,4 +9,5 @@
 // directly instead, since it needs the individual parse/compile functions, not a Metro transformer
 // object. createCssMetroTransformer is a factory — babelTransformerPath needs the actual
 // {transform, getCacheKey} object it returns, not the css-parser package barrel.
-module.exports = require('@symbiote-native/css-parser').createCssMetroTransformer();
+module.exports =
+  require('@symbiote-native/css-parser').createCssMetroTransformer();