@symbiote-native/react 1.0.0 → 2.0.0

package/build/components.js

@@ -1,19 +1,5 @@
-// Host primitives exposed to user code. They ARE the intrinsic tags — a capitalized export whose
-// value is the tag string — so an app writes `<View>` and React commits a host element directly,
-// with no component instance in between. The reconciler maps the tag through
-// `descriptorFor` to a Fabric view name at commit.
-// `View` and `Text` are the intrinsic TAGS, not components wrapping them. JSX resolves a
-// capitalized tag to the value in scope, and a value that is a STRING is a host element to React —
-// so `<View/>` compiles to `_jsx('symbiote-view', …)` with no component instance, while
-// `JSX.IntrinsicElements['symbiote-view']` still supplies the strict props (a bad prop is TS2322).
-//
-// The two folds their component bodies used to apply both moved down a layer, which is what let
-// the bodies go:
-//
-//   aria / accessibility   the engine folds every node in `fabricProps` (accessibility-props.ts)
-//   id -> nativeID,        the renderer folds by spec in `host-config`'s createInstance
-//   Text's defaults        (`foldHostBag`, driven by HOST_PRIMITIVES)
-//
-// A type annotation rather than `as const`: same literal type, no cast (`ts-js-best-practices`).
-export const View = 'symbiote-view';
-export const Text = 'symbiote-text';
+// The public PROP TYPES for the two strict intrinsics, and nothing else. There is no component and
+// no capitalized alias: an app writes `<view>` / `<text>`, React commits a host element directly,
+// and `JSX.IntrinsicElements` (jsx-runtime.ts) is what supplies these types to it. The reconciler
+// maps the tag through `descriptorFor` to a Fabric view name at commit.
+export {};

package/build/create-portal/index.js

@@ -14,7 +14,7 @@ import { isSymbioteNode, SymbioteSurface, } from '@symbiote-native/engine';
 import reconciler from '../host-config.js';
 export function createPortal(children, container, key) {
     if (!(container instanceof SymbioteSurface) && !isSymbioteNode(container)) {
-        throw new Error('createPortal target must be an already-mounted host node (e.g. a ref to a rendered <View>) — got something else. Did you forget `.current`/`.value`, or pass a CSS-selector-style string?');
+        throw new Error('createPortal target must be an already-mounted host node (e.g. a ref to a rendered <view>) — got something else. Did you forget `.current`/`.value`, or pass a CSS-selector-style string?');
     }
     // @ts-expect-error @types/react-reconciler's ReactPortal (containerInfo/implementation) and
     // react's own ReactPortal (type/props, a ReactElement) are different interfaces describing the

package/build/create-tunnel/index.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx } from "@symbiote-native/react/jsx-runtime";
 // createTunnel - the cross-surface answer to createPortal's same-surface-only scope. A real
 // createPortal cannot reach across two separate reconciler roots (see
 // github.com/facebook/react/issues/17147); the fix, same as pmndrs/tunnel-rat, is to not

package/build/descriptor-to-react/index.js

@@ -1,6 +1,6 @@
 // The descriptor→element bridge. A render function in @symbiote-native/components returns a
 // framework-agnostic `Descriptor` tree; this maps it onto React elements. The resulting
-// host element (`symbiote-view`, `symbiote-activity-indicator`, …) flows on through the
+// host element (`view`, `activity-indicator`, …) flows on through the
 // react-reconciler host config → engine → Fabric, exactly like a hand-written JSX host
 // element.
 import { createElement } from 'react';

package/build/host-config.js

@@ -99,17 +99,35 @@ const reconciler = createReconciler({
     },
     shouldSetTextContent: () => false,
     createInstance(type, props, _container, hostContext) {
-        const descriptor = descriptorFor(resolveIntrinsicTag(type, props));
+        // The INTRINSIC tag, kept in a binding rather than inlined, because it is needed twice: once
+        // to resolve the Fabric view name and once to hand the engine below. The host-behavior
+        // registry is keyed by TAG and never by Fabric name — `pressable` and a plain `View`
+        // both resolve to `RCTView`, so keying by the resolved name would put a press machine on every
+        // view in the app (`core/engine/src/host-behavior.ts`).
+        const tag = resolveIntrinsicTag(type, props);
+        const descriptor = descriptorFor(tag);
         if (hostContext.isInsideText && !descriptor.isText) {
-            throw new Error(`<${type}> can't be nested inside <Text>`);
+            throw new Error(`<${type}> can't be nested inside <text>`);
         }
-        const node = createElement(descriptor.component, descriptor.isText);
+        // The third argument is what makes a host behavior reachable AT ALL on this adapter. Dropping
+        // it degrades silently: `createElement`'s default is `tag = component`, so the lookup runs
+        // against `RCTView` / `RCTImageView`, matches nothing, and every behavior simply never
+        // attaches — no throw, no log, and no test goes red, because React ships no `register` entry
+        // today and so has never had a behavior to lose. That absence is exactly what hid this: the
+        // other four adapters all pass it (vue `renderer/index.ts`, svelte `dom-shim/element.ts`,
+        // solid `renderer.ts`, angular `renderer/index.ts`), and React is the one that did not.
+        //
+        // Inert on landing and deliberately so — nothing registers a behavior under a tag React emits.
+        // The `-managed` split is what keeps it inert once something does: React's TextInput and
+        // Switch wrappers emit `text-input-managed` / `switch-managed`, so a machine
+        // registered on the lowered tag cannot also attach to a wrapper-built node and run twice.
+        const node = createElement(descriptor.component, descriptor.isText, tag);
         applyProps(node, foldHostBag(type, props));
         return node;
     },
     createTextInstance(text, _container, hostContext) {
         if (!hostContext.isInsideText) {
-            throw new Error(`Text string "${text}" must be rendered inside a <Text>`);
+            throw new Error(`Text string "${text}" must be rendered inside a <text>`);
         }
         return createRawText(text);
     },

package/build/index.d.ts

@@ -1,38 +1,32 @@
-export type { ISymbioteIntrinsicTag } from './jsx';
-export { View, Text } from './components';
+import './register';
+export type { ISymbioteIntrinsicTag } from './jsx-runtime';
 export type { IViewProps, ITextProps } from './components';
 export type { IAccessibilityProps, IAriaProps, IAccessibilityRole, IRole, IAccessibilityStateValue, IAccessibilityValue, IAccessibilityActionInfo, } from '@symbiote-native/components';
 export type { IResponderProps } from './utils/responder-props';
-export { Image, setImageSourceResolver } from './components/image';
-export type { IImageProps, IImageSource, IImageSourceProp, IResizeMode, IImageSize, IImageCacheStatus, } from './components/image';
-export { ImageBackground } from './components/image-background';
-export type { IImageBackgroundProps } from './components/image-background';
-export { ScrollView } from './components/scroll-view';
-export type { IScrollViewProps, IScrollViewHandle, } from './components/scroll-view';
-export { TextInput } from './components/text-input';
-export type { ITextInputProps, ITextInputHandle, } from './components/text-input';
-export { InputAccessoryView } from './components/input-accessory-view';
-export type { IInputAccessoryViewProps } from './components/input-accessory-view';
+export { Image } from './modules/image';
+export { setImageSourceResolver } from '@symbiote-native/components';
+export type { IImageProps } from './components/image/image-props';
+export type { IImageSource, IImageSourceProp, IResizeMode, IImageSize, IImageCacheStatus, } from '@symbiote-native/components';
+export type { IImageBackgroundProps } from './components/image-background-props';
+export type { IScrollViewProps, IScrollViewHandle, } from './components/scroll-view/scroll-view-props';
+export type { ITextInputProps } from './components/text-input/text-input-props';
+export type { ITextInputHandle, ITextInputChangeEvent, } from '@symbiote-native/components';
+export type { IInputAccessoryViewProps } from './components/input-accessory-view-props';
 export { KeyboardAvoidingView } from './components/keyboard-avoiding-view';
 export type { IKeyboardAvoidingViewProps, IKeyboardAvoidingBehavior, } from './components/keyboard-avoiding-view';
 export { StatusBar } from './modules/status-bar';
 export type { IStatusBarProps, IStatusBarStyle } from './modules/status-bar';
-export { Switch } from './components/switch';
-export type { ISwitchProps, ISwitchTrackColor } from './components/switch';
-export { ActivityIndicator } from './components/activity-indicator';
-export type { IActivityIndicatorProps } from './components/activity-indicator';
-export { SafeAreaView } from './components/safe-area-view';
-export type { ISafeAreaViewProps } from './components/safe-area-view';
-export { RefreshControl } from './components/refresh-control';
-export type { IRefreshControlProps } from './components/refresh-control';
+export type { ISwitchProps } from './components/switch/switch-props';
+export type { ISwitchTrackColor, ISwitchChangeEvent, } from '@symbiote-native/components';
+export type { IActivityIndicatorProps } from './components/activity-indicator-props';
+export type { ISafeAreaViewProps } from './components/safe-area-view-props';
+export type { IRefreshControlProps } from './components/refresh-control-props';
 export { Modal } from './components/modal';
 export type { IModalProps, IModalAnimationType, IModalPresentationStyle, IModalOrientation, } from './components/modal';
-export { Pressable } from './components/pressable';
-export type { IPressableProps, IPressState } from './components/pressable';
-export { TouchableOpacity, TouchableHighlight, TouchableWithoutFeedback, } from './components/touchable';
-export type { ITouchableOpacityProps, ITouchableHighlightProps, ITouchableWithoutFeedbackProps, } from './components/touchable';
-export { Button } from './components/button';
-export type { IButtonProps } from './components/button';
+export type { IPressableProps, IPressState, } from './components/pressable/pressable-props';
+export type { ITouchableOpacityProps, ITouchableHighlightProps, } from './components/touchable/touchable-props';
+export type { ITouchableWithoutFeedbackProps } from './components/touchable-without-feedback/touchable-without-feedback-props';
+export type { IButtonProps } from './components/button-props';
 export { FlatList } from './components/flat-list';
 export type { IFlatListProps, IFlatListHandle } from './components/flat-list';
 export { SectionList } from './components/section-list';
@@ -68,7 +62,8 @@ export { PanResponder } from '@symbiote-native/engine';
 export type { IPanResponderGestureState, IPanResponderCallbacks, IGestureResponderHandlers, IPanResponderInstance, } from '@symbiote-native/engine';
 export { InteractionManager } from '@symbiote-native/engine';
 export type { IInteractionEvent, ISimpleTask, IPromiseTask, ITask, IHandle, } from '@symbiote-native/engine';
-export { TouchableNativeFeedback } from './components/touchable-native-feedback';
-export type { ITouchableNativeFeedbackProps, INativeFeedbackBackground, IThemeAttrBackground, IRippleBackground, } from './components/touchable-native-feedback';
+export { TouchableNativeFeedback } from '@symbiote-native/components';
+export type { INativeFeedbackBackground, IThemeAttrBackground, IRippleBackground, } from '@symbiote-native/components';
+export type { ITouchableNativeFeedbackProps } from './components/touchable-native-feedback/touchable-native-feedback-props';
 export type { ISymbioteEvent, ISymbioteNode, IRootTag, } from '@symbiote-native/engine';
 export type { ICellLayout, ISeparatorProps, ISeparators, IModalOrientationChangeEvent, IPressableAndroidRippleConfig, IEnterKeyHint, IInputMode, ISubmitBehavior, ITextInputSelection, IImageStatics, } from '@symbiote-native/components';

package/build/index.js

@@ -1,22 +1,19 @@
 // @symbiote-native/react: a react-reconciler host config (mutation mode) over
 // @symbiote-native/engine. React is a known-good driver: it proves the native pipe
 // and the shared clone-on-write engine before any non-React adapter has to.
-export { View, Text } from './components.js';
-export { Image, setImageSourceResolver } from './components/image/index.js';
-export { ImageBackground } from './components/image-background/index.js';
-export { ScrollView } from './components/scroll-view';
-export { TextInput } from './components/text-input/index.js';
-export { InputAccessoryView } from './components/input-accessory-view/index.js';
+// Bare side-effect import, deliberately NOT a re-export and deliberately not beside one of the
+// same specifier: it installs the engine's host behaviors, which is what makes a bare
+// `<pressable>` / `<text-input>` / `<switch>` carry its machine. Any other shape is dropped by
+// Metro's inlineRequires in a release build — see register.ts.
+import './register.js';
+// `Image` is a TAG — `<image>` — and the name now carries only RN's STATICS
+// (`Image.getSize(...)`), an imperative API with no view. The wrapper's whole source/style
+// translation runs on the tag as the engine's `registerImageBehavior`.
+export { Image } from './modules/image/index.js';
+export { setImageSourceResolver } from '@symbiote-native/components';
 export { KeyboardAvoidingView } from './components/keyboard-avoiding-view/index.js';
 export { StatusBar } from './modules/status-bar';
-export { Switch } from './components/switch';
-export { ActivityIndicator } from './components/activity-indicator';
-export { SafeAreaView } from './components/safe-area-view/index.js';
-export { RefreshControl } from './components/refresh-control/index.js';
 export { Modal } from './components/modal/index.js';
-export { Pressable } from './components/pressable/index.js';
-export { TouchableOpacity, TouchableHighlight, TouchableWithoutFeedback, } from './components/touchable/index.js';
-export { Button } from './components/button.js';
 export { FlatList } from './components/flat-list/index.js';
 export { SectionList } from './components/section-list/index.js';
 export { VirtualizedSectionList } from './components/virtualized-section-list/index.js';
@@ -74,4 +71,7 @@ export { InteractionManager } from '@symbiote-native/engine';
 // Android-only surface (the second-platform pass): a thin JS shim over an Android Fabric view,
 // inert on iOS (no native view -> degrades to a plain container). The Android-only MODULES
 // (ToastAndroid, PermissionsAndroid, BackHandler) sit in the engine block above.
-export { TouchableNativeFeedback } from './components/touchable-native-feedback/index.js';
+// `TouchableNativeFeedback` is now RN's STATIC NAMESPACE, not a component: the element is the tag
+// `<touchable-native-feedback>`, which commits no node of its own and clones onto its single child.
+// `TouchableNativeFeedback.Ripple(…)` / `.SelectableBackground(…)` are unchanged.
+export { TouchableNativeFeedback } from '@symbiote-native/components';

package/build/jsx-dev-runtime.d.ts

@@ -0,0 +1,3 @@
+export { jsxDEV } from 'react/jsx-dev-runtime';
+export { Fragment } from 'react/jsx-runtime';
+export type { JSX } from './jsx-runtime';

package/build/jsx-dev-runtime.js

@@ -0,0 +1,10 @@
+// The dev twin of `./jsx-runtime`, and it has to be its own file rather than an alias of it.
+//
+// TypeScript resolves the namespace from `<jsxImportSource>/jsx-dev-runtime` whenever `jsx` is
+// `react-jsxdev`, and Babel's automatic runtime imports `jsxDEV` — not `jsx`/`jsxs` — from that
+// same path in a development build. Solid points both subpaths at one file because its emitted
+// runtime is empty either way; ours carries real factories, so the two entries export different
+// names and pointing them at one file would leave a dev build importing a `jsxDEV` that is not
+// there.
+export { jsxDEV } from 'react/jsx-dev-runtime';
+export { Fragment } from 'react/jsx-runtime';

package/build/jsx-namespace.type-check.d.ts

@@ -0,0 +1 @@
+export declare const JSX_NAMESPACE_CHECK: number;

package/build/jsx-namespace.type-check.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "@symbiote-native/react/jsx-runtime";
+const strictIntrinsicAcceptsItsOwnProp = (_jsx("view", { testID: "jsx-namespace-check" }));
+const strictIntrinsicRejectsAnUnknownProp = (_jsx("view", { definitelyNotAViewProp: 1 }));
+export const JSX_NAMESPACE_CHECK = [
+    strictIntrinsicAcceptsItsOwnProp,
+    strictIntrinsicRejectsAnUnknownProp,
+].length;

package/build/jsx-runtime.d.ts

@@ -0,0 +1,62 @@
+import type { ICrossTypedIntrinsics } from '@symbiote-native/components';
+import type { Key } from 'react';
+import type { IViewProps, ITextProps } from './components';
+import type { IPressableProps } from './components/pressable/pressable-props';
+import type { IButtonProps } from './components/button-props';
+import type { IImageProps } from './components/image/image-props';
+import type { IImageBackgroundProps } from './components/image-background-props';
+import type { IInputAccessoryViewProps } from './components/input-accessory-view-props';
+import type { IRefreshControlProps } from './components/refresh-control-props';
+import type { ISafeAreaViewProps } from './components/safe-area-view-props';
+import type { ITouchableNativeFeedbackProps } from './components/touchable-native-feedback/touchable-native-feedback-props';
+import type { ITouchableOpacityProps, ITouchableHighlightProps } from './components/touchable/touchable-props';
+import type { ITouchableWithoutFeedbackProps } from './components/touchable-without-feedback/touchable-without-feedback-props';
+import type { IScrollViewProps } from './components/scroll-view/scroll-view-props';
+import type { ISwitchProps } from './components/switch/switch-props';
+import type { ITextInputProps } from './components/text-input/text-input-props';
+import type { IModalProps } from './components/modal';
+import type { IActivityIndicatorProps } from './components/activity-indicator-props';
+export { Fragment, jsx, jsxs } from 'react/jsx-runtime';
+interface IHostProps {
+    style?: unknown;
+    children?: import('react').ReactNode;
+    [key: string]: unknown;
+}
+export interface ICrossedPrimitiveProps {
+    view: IViewProps;
+    text: ITextProps;
+    pressable: IPressableProps;
+    button: IButtonProps;
+    image: IImageProps;
+    'image-background': IImageBackgroundProps;
+    'input-accessory-view': IInputAccessoryViewProps;
+    'refresh-control': IRefreshControlProps;
+    'safe-area-view': ISafeAreaViewProps;
+    'touchable-native-feedback': ITouchableNativeFeedbackProps;
+    'touchable-opacity': ITouchableOpacityProps;
+    'touchable-highlight': ITouchableHighlightProps;
+    'touchable-without-feedback': ITouchableWithoutFeedbackProps;
+    'scroll-view': IScrollViewProps;
+    switch: ISwitchProps;
+    'text-input': ITextInputProps;
+    modal: IModalProps;
+    'activity-indicator': IActivityIndicatorProps;
+}
+type IWithKey<Props> = Props & {
+    key?: Key | null;
+};
+export declare namespace JSX {
+    type ElementType = import('react').JSX.ElementType;
+    type Element = import('react').JSX.Element;
+    type ElementClass = import('react').JSX.ElementClass;
+    type ElementAttributesProperty = import('react').JSX.ElementAttributesProperty;
+    type ElementChildrenAttribute = import('react').JSX.ElementChildrenAttribute;
+    type LibraryManagedAttributes<C, P> = import('react').JSX.LibraryManagedAttributes<C, P>;
+    type IntrinsicAttributes = import('react').JSX.IntrinsicAttributes;
+    type IntrinsicClassAttributes<T> = import('react').JSX.IntrinsicClassAttributes<T>;
+    interface IntrinsicElements extends ICrossTypedIntrinsics<IHostProps, {
+        [K in keyof ICrossedPrimitiveProps]: IWithKey<ICrossedPrimitiveProps[K]>;
+    }> {
+    }
+}
+export type ISymbioteIntrinsicTag = keyof JSX.IntrinsicElements;

package/build/jsx-runtime.js

@@ -0,0 +1 @@
+export { Fragment, jsx, jsxs } from 'react/jsx-runtime';

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

@@ -45,7 +45,6 @@ export declare const Animated: {
     View: import("react").ComponentType<import("./create-animated-component").IAnimatedComponentProps>;
     Text: import("react").ComponentType<import("./create-animated-component").IAnimatedComponentProps>;
     Image: import("react").ComponentType<import("./create-animated-component").IAnimatedComponentProps>;
-    ScrollView: ReturnType<typeof createAnimatedComponent>;
     FlatList: ReturnType<typeof createAnimatedComponent>;
     SectionList: ReturnType<typeof createAnimatedComponent>;
     createAnimatedComponent: typeof createAnimatedComponent;

package/build/modules/animated/index.js

@@ -4,9 +4,6 @@
 // JS-driven). Both halves meet here in one `Animated` object so the
 // familiar surface (`Animated.timing(new Animated.Value(0), …).start()`) works.
 import { AnimatedValue, AnimatedValueXY, AnimatedColor, Easing, Platform, timing, spring, decay, parallel, sequence, stagger, loop, delay, add, subtract, multiply, divide, modulo, diffClamp, event, forkEvent, unforkEvent, } from '@symbiote-native/engine';
-import { View, Text } from '../../components.js';
-import { Image } from '../../components/image/index.js';
-import { ScrollView } from '../../components/scroll-view';
 import { FlatList } from '../../components/flat-list/index.js';
 import { SectionList } from '../../components/section-list/index.js';
 import { createAnimatedComponent } from './create-animated-component.js';
@@ -15,21 +12,22 @@ export { createAnimatedComponent } from './create-animated-component.js';
 // The pure graph leaves now live in @symbiote-native/engine (they extend AnimatedWithChildren,
 // no React); re-exported here so @symbiote-native/react's Animated surface is unchanged.
 export { AnimatedProps, AnimatedStyle, AnimatedTransform, } from '@symbiote-native/engine';
-// View/Text/Image are pure host primitives, so wrap them eagerly.
-const AnimatedView = createAnimatedComponent(View);
-const AnimatedText = createAnimatedComponent(Text);
-const AnimatedImage = createAnimatedComponent(Image);
-// RN's AnimatedExports.js:13-58 exposes all six animated components. The scrolling
-// containers (ScrollView/FlatList/SectionList) are wrapped behind LAZY getters,
-// mirroring RN's `get ScrollView() { return require(...) }`: ScrollView's module
-// chain pulls in scroll-view/sticky-header, which imports this Animated namespace
-// back, and a static `createAnimatedComponent(ScrollView)` at init would read ScrollView
-// inside its own TDZ. A memoized getter defers the wrap past module init, so the
-// cycle never fires. The wrappers carry no per-component animation logic; they only
-// add animated-prop support, keeping the adapter a thin layer over the engine.
-// The native scroll-event attach (Animated.event onto contentOffset) is owned by
-// ScrollView itself.
-let animatedScrollView;
+// The tags themselves: View/Text/Image are pure host primitives, so wrap them eagerly.
+const AnimatedView = createAnimatedComponent('view');
+const AnimatedText = createAnimatedComponent('text');
+// The tag, not the `Image` name: that one is the STATICS namespace now (`modules/image`).
+const AnimatedImage = createAnimatedComponent('image');
+// There is no `Animated.ScrollView` any more, and nothing replaced it — the whole API is
+// `<scroll-view style={{ opacity: v }} onScroll={Animated.event(…)}>`. A scroll wrapper's one
+// remaining animated job looked like the native scroll-event attach, and that is engine-side for
+// EVERY host node: `setEventListener` calls `bindAnimatedEvent` on any `on*` prop
+// (`core/engine/src/node.ts`), and an AnimatedNode written into any style key is resolved by
+// `routeProp`. Its lazy getter existed only to dodge a TDZ through `scroll-view/sticky-header`,
+// which is deleted with the wrapper.
+//
+// The two below REMAIN because the list family is tier 3: a render prop decides their output shape
+// in JS, so there is no tag for `<Animated.X>` to be an alias of. Both stay LAZY, mirroring RN's
+// own `get FlatList() { return require(...) }`.
 let animatedFlatList;
 let animatedSectionList;
 // The live, JS-driven driver namespace (real frames). RN's AnimatedImplementation.
@@ -67,10 +65,6 @@ export const Animated = {
     View: AnimatedView,
     Text: AnimatedText,
     Image: AnimatedImage,
-    get ScrollView() {
-        animatedScrollView ??= createAnimatedComponent(ScrollView);
-        return animatedScrollView;
-    },
     get FlatList() {
         animatedFlatList ??= createAnimatedComponent(FlatList);
         return animatedFlatList;

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

@@ -0,0 +1,3 @@
+import { type IImageStatics } from '@symbiote-native/components';
+export type { IImageStatics };
+export declare const Image: IImageStatics;

package/build/modules/image/index.js

@@ -0,0 +1,14 @@
+// RN's Image STATICS — `getSize`, `getSizeWithHeaders`, `prefetch`, `abortPrefetch`, `queryCache`,
+// `resolveAssetSource`.
+//
+// IN `modules/`, NOT `components/`. The primitive is the `<image>` tag and its fold runs in the
+// engine (`behaviors/image.ts`); what is left under the name `Image` is an imperative API with no
+// view, which is what this bucket is for (<adapter_src_follows_framework_idioms>). Sitting in
+// `components/` was what made a statics object read as a component.
+//
+// A NAMESPACE OBJECT rather than six bare functions, deliberately: `Alert`, `Share`, `Linking` and
+// `AppState` all take that shape, and an app porting from RN writes `Image.getSize(...)` verbatim.
+//
+// Shared verbatim via `imageStatics`, the same source every other adapter's Image uses.
+import { imageStatics } from '@symbiote-native/components';
+export const Image = imageStatics;

package/build/register.d.ts

@@ -0,0 +1 @@
+import '@symbiote-native/components/register';

package/build/register.js

@@ -0,0 +1,15 @@
+// Side-effect ONLY. Exports nothing, and must never be re-exported from the barrel.
+//
+// The fourteen calls live once, in `@symbiote-native/components/register` — they were identical in
+// all five adapters, and each copy carried a migration ledger justifying a call against a wrapper
+// that no longer exists. What is per-adapter is only the SPELLING of the import below: every
+// `*-tag.test.*` here reaches the registry through `import './register';`, and this adapter's own
+// barrel guard pins that line.
+//
+// WHY A SIDE-EFFECT SUBPATH AND NOT A BARREL EXPORT. Metro turns on `inlineRequires` for PRODUCTION
+// only: it moves a `require` down to the first place its binding is used as a VALUE, and
+// `export { X } from './x'` compiles to a lazy getter. A registration reached that way never
+// evaluates in a Release build — invisible to tsc, to vitest, and to grepping the bundle. A bare
+// `import` placed NEXT TO a re-export of the same specifier does not help either: Babel merges the
+// two into one dependency and the merged dependency stays lazy.
+import '@symbiote-native/components/register';

package/metro-css-parser.cjs

@@ -5,4 +5,5 @@
 // .cjs, not .js: this package is "type": "module", but Metro's babelTransformerPath loading needs
 // a require()-able file. createCssMetroTransformer() is a factory — Metro 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();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symbiote-native/react",
-  "version": "1.0.0",
+  "version": "2.0.0",
   "description": "SymbioteNative's React adapter — a react-reconciler host config (mutation mode) driving real native iOS/Android views through stock React Native Fabric.",
   "license": "MIT",
   "repository": {
@@ -39,9 +39,13 @@
       "default": "./build/bootstrap.js"
     },
     "./metro-css-parser": "./metro-css-parser.cjs",
-    "./state-style": {
-      "types": "./build/state-style.d.ts",
-      "default": "./build/state-style.js"
+    "./jsx-runtime": {
+      "types": "./build/jsx-runtime.d.ts",
+      "default": "./build/jsx-runtime.js"
+    },
+    "./jsx-dev-runtime": {
+      "types": "./build/jsx-dev-runtime.d.ts",
+      "default": "./build/jsx-dev-runtime.js"
     }
   },
   "files": [
@@ -53,20 +57,20 @@
   },
   "dependencies": {
     "react-reconciler": "^0.33.0",
-    "@symbiote-native/components": "1.0.0",
+    "@symbiote-native/components": "2.0.0",
     "@symbiote-native/css-parser": "0.5.0"
   },
   "peerDependencies": {
     "react": ">=19.0.0",
     "react-native": ">=0.86",
-    "@symbiote-native/engine": "^0.4.0"
+    "@symbiote-native/engine": "^0.5.0"
   },
   "devDependencies": {
     "@types/react": "^19.2.0",
     "@types/react-reconciler": "^0.32.2",
     "react": "19.2.3",
-    "@symbiote-native/test-utils": "0.3.0",
-    "@symbiote-native/engine": "0.4.0"
+    "@symbiote-native/engine": "0.5.0",
+    "@symbiote-native/test-utils": "0.3.0"
   },
   "scripts": {
     "typecheck": "tsc --build",

package/build/components/activity-indicator/index.android.d.ts

@@ -1,3 +0,0 @@
-import type { IActivityIndicatorProps } from './shared';
-export type { IActivityIndicatorProps } from './shared';
-export declare function ActivityIndicator(rawProps: IActivityIndicatorProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;

package/build/components/activity-indicator/index.android.js

@@ -1,17 +0,0 @@
-// AndroidProgressBar needs `styleAttr` (drives ProgressBar.setStyle(); missing it throws
-// "setStyle() not called") and `indeterminate: true`; default color is the theme (null) —
-// mirrors RN's ActivityIndicator.js android branch. Metro selects this file on an Android
-// host, no Platform.OS read needed.
-// device-verify-pending: confirmed by the absence of the setStyle() red box on a real host.
-import { descriptorToReact } from '../../descriptor-to-react/index.js';
-import { useActivityIndicatorLogic } from './shared.js';
-const PLATFORM = {
-    // RN: `color = Platform.OS === 'ios' ? GRAY : null`; Android lets the theme color it.
-    defaultColor: null,
-    nativeExtras: { styleAttr: 'Normal', indeterminate: true },
-};
-// A top-level named function, not a factory-returned closure: React Compiler's
-// component detection only walks top-level declarations (see shared.ts).
-export function ActivityIndicator(rawProps) {
-    return descriptorToReact(useActivityIndicatorLogic(rawProps, PLATFORM));
-}

package/build/components/activity-indicator/index.d.ts

@@ -1 +0,0 @@
-export * from './index.ios';

package/build/components/activity-indicator/index.ios.d.ts

@@ -1,3 +0,0 @@
-import type { IActivityIndicatorProps } from './shared';
-export type { IActivityIndicatorProps } from './shared';
-export declare function ActivityIndicator(rawProps: IActivityIndicatorProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;

package/build/components/activity-indicator/index.ios.js

@@ -1,16 +0,0 @@
-// ActivityIndicator on iOS: RCTActivityIndicatorView takes the size enum + a GRAY
-// default color and no extra native props. Also the base (activity-indicator.ts
-// re-exports it) for headless / web.
-import { descriptorToReact } from '../../descriptor-to-react/index.js';
-import { useActivityIndicatorLogic } from './shared.js';
-// RN's iOS default spinner color (Libraries/.../ActivityIndicator.js GRAY).
-const IOS_DEFAULT_COLOR = '#999999';
-const PLATFORM = {
-    defaultColor: IOS_DEFAULT_COLOR,
-    nativeExtras: {},
-};
-// A top-level named function, not a factory-returned closure: React Compiler's
-// component detection only walks top-level declarations (see shared.ts).
-export function ActivityIndicator(rawProps) {
-    return descriptorToReact(useActivityIndicatorLogic(rawProps, PLATFORM));
-}

package/build/components/activity-indicator/index.js

@@ -1,4 +0,0 @@
-// Base / default ActivityIndicator: re-exports the iOS build. Metro overrides this with
-// activity-indicator.ios.ts / .android.ts on a real host; under tsx / tsc / web the host
-// config resolves here. Filename is the selector, no Platform.OS read.
-export * from './index.ios.js';

package/build/components/activity-indicator/shared.d.ts

@@ -1,6 +0,0 @@
-import type { IActivityIndicatorPlatform, IActivityIndicatorProps as IActivityIndicatorBaseProps } from '@symbiote-native/components';
-export type { IActivityIndicatorPlatform } from '@symbiote-native/components';
-export type IActivityIndicatorProps = IActivityIndicatorBaseProps & {
-    className?: string;
-};
-export declare function useActivityIndicatorLogic(rawProps: IActivityIndicatorProps, platform: IActivityIndicatorPlatform): import("@symbiote-native/components").IDescriptor;

package/build/components/activity-indicator/shared.js

@@ -1,22 +0,0 @@
-// ActivityIndicator is the React lifecycle half. The render (size translation, wrapper +
-// spinner, color omission) lives framework-agnostic in @symbiote-native/components; here the
-// adapter only resolves props (accessibility, defaults), calls the render fn, and bridges
-// the Descriptor to a React element. No state, no effects: this component is render-only.
-//
-// The per-platform bits (iOS GRAY default + no extras; Android theme/null + styleAttr +
-// indeterminate) are supplied by the .ios/.android files via `IActivityIndicatorPlatform`.
-//
-// useActivityIndicatorLogic is a plain top-level hook, not a component factory returning a
-// closure: React Compiler's component/hook detection only walks top-level declarations, so
-// index.ios.ts / index.android.ts each declare their OWN top-level `ActivityIndicator`
-// function that calls this hook, rather than exporting whatever a factory here returns (same
-// shape as switch/shared.ts's useSwitchLogic).
-import { renderActivityIndicator, resolveAccessibilityProps, } from '@symbiote-native/components';
-export function useActivityIndicatorLogic(rawProps, platform) {
-    // The wrapper is a raw symbiote-view, not the View FC, so it never runs
-    // resolveAccessibilityProps itself, so fold aria/role here, then forward the resolved
-    // accessibility* surface (plus testID / onLayout) onto the wrapper via `passthrough`.
-    const props = resolveAccessibilityProps(rawProps);
-    const { animating = true, color, hidesWhenStopped = true, size = 'small', style, ...passthrough } = props;
-    return renderActivityIndicator({ animating, color, hidesWhenStopped, size, style, passthrough }, platform);
-}