@symbiote-native/react 0.1.0

package/build/modules/layout-animation.js

@@ -0,0 +1,3 @@
+// LayoutAnimation moved to @symbiote-native/engine (a framework-agnostic native-bridge consumer
+// re-exported by every adapter). This thin re-export keeps @symbiote-native/react's surface identical.
+export { LayoutAnimation } from '@symbiote-native/engine';

package/build/modules/linking.d.ts

@@ -0,0 +1,2 @@
+export { Linking } from '@symbiote-native/engine';
+export type { IUrlEvent } from '@symbiote-native/engine';

package/build/modules/linking.js

@@ -0,0 +1,4 @@
+// Linking now lives framework-agnostic in @symbiote-native/engine (imperative native-bridge
+// module, no visual, no lifecycle). The React adapter re-exports it verbatim; the
+// platform split (linking.ios/linking.android) lives inside engine. See ADR 0019.
+export { Linking } from '@symbiote-native/engine';

package/build/modules/permissions-android.d.ts

@@ -0,0 +1,2 @@
+export { PermissionsAndroid, PERMISSIONS, RESULTS } from '@symbiote-native/engine';
+export type { IPermission, IPermissionStatus, IRationale } from '@symbiote-native/engine';

package/build/modules/permissions-android.js

@@ -0,0 +1,3 @@
+// PermissionsAndroid moved to @symbiote-native/engine (a framework-agnostic device-state module
+// re-exported by every adapter). This thin re-export keeps @symbiote-native/react's surface identical.
+export { PermissionsAndroid, PERMISSIONS, RESULTS } from '@symbiote-native/engine';

package/build/modules/settings.d.ts

@@ -0,0 +1 @@
+export { Settings } from '@symbiote-native/engine';

package/build/modules/settings.js

@@ -0,0 +1,4 @@
+// Settings now lives framework-agnostic in @symbiote-native/engine (imperative native-bridge
+// module, no visual, no lifecycle). The React adapter re-exports it verbatim so the
+// public surface is unchanged. See ADR 0019.
+export { Settings } from '@symbiote-native/engine';

package/build/modules/share.d.ts

@@ -0,0 +1,2 @@
+export { Share } from '@symbiote-native/engine';
+export type { IShareContent, IShareOptions, IShareAction } from '@symbiote-native/engine';

package/build/modules/share.js

@@ -0,0 +1,4 @@
+// Share now lives framework-agnostic in @symbiote-native/engine (imperative native-bridge
+// module, no visual, no lifecycle). The React adapter re-exports it verbatim; the
+// platform split (share.ios/share.android) lives inside engine. See ADR 0019.
+export { Share } from '@symbiote-native/engine';

package/build/modules/status-bar/index.android.d.ts

@@ -0,0 +1,3 @@
+import type { IStatusBarComponent } from './shared';
+export type { IStatusBarProps, IStatusBarStyle } from './shared';
+export declare const StatusBar: IStatusBarComponent;

package/build/modules/status-bar/index.android.js

@@ -0,0 +1,89 @@
+// StatusBar on Android: drives the Android StatusBarManager from props (and from the
+// static methods). Android's native module is a DIFFERENT shape from iOS: single-arg
+// setHidden(hidden) / setStyle(style) plus setColor/setTranslucent, same module name
+// ('StatusBarManager'). Metro picks this on an Android host; iOS keeps its own shape.
+//
+// The native-call logic stays in the adapter (not the engine): the platform module shape
+// diverges iOS/Android and the headless smokes import this file by name (tsx has no platform
+// picker, so routing through the engine barrel would resolve the iOS base on every platform).
+// The engine owns only the pure shared contract: types, constants, hideTransition.
+//
+// History: this used to be a no-op. Driving the window flags from the bridgeless surface
+// blanked the app: a status-bar relayout triggered stopSurface, which threw "Global was
+// not installed" because RN installs global.RN$stopSurface from its own renderer, which this
+// renderer replaces. Now that render.ts installs RN$stopSurface and tears surfaces down cleanly, the
+// relayout survives and the bar updates without blanking (verified on device: show/hide +
+// light/dark text). See render.ts installStopSurfaceGlobal + native-module-platform-routing.
+import { useEffect } from 'react';
+import { dlog, getNativeModule, processColor, STATUS_BAR_MANAGER, } from '@symbiote-native/engine';
+// processColor returns `unknown` (its result is platform-dependent); narrow to the
+// number Fabric/native expects, like RN's invariant before setColor. A non-number
+// (null for an unparseable color, headless identity passthrough of a string) is dropped.
+function applyBackgroundColor(manager, color, animated) {
+    const processed = processColor(color);
+    if (typeof processed !== 'number') {
+        dlog(`StatusBar android: backgroundColor ${String(color)} did not process to an int — skipping`);
+        return;
+    }
+    // RISK: driving the window background flag once blanked the bridgeless surface
+    // (see header). Routed cleanly here but DEVICE-VERIFY-PENDING.
+    dlog(`StatusBar android setColor -> ${processed} animated=${animated}`);
+    manager.setColor(processed, animated);
+}
+// Renders null and applies its props to the native module in an effect, on mount and on
+// every prop change, same contract as iOS, with the single-arg Android setters.
+const StatusBarAndroid = props => {
+    const { barStyle, hidden, animated = false, backgroundColor, translucent } = props;
+    useEffect(() => {
+        const manager = getNativeModule(STATUS_BAR_MANAGER);
+        if (manager === null) {
+            dlog('StatusBar android: StatusBarManager not resolvable — skipping');
+            return;
+        }
+        dlog(`StatusBar android -> barStyle=${barStyle} hidden=${hidden} translucent=${translucent} bg=${String(backgroundColor)}`);
+        if (barStyle !== undefined)
+            manager.setStyle(barStyle);
+        if (hidden !== undefined)
+            manager.setHidden(hidden);
+        if (translucent !== undefined)
+            manager.setTranslucent(translucent);
+        if (backgroundColor !== undefined)
+            applyBackgroundColor(manager, backgroundColor, animated);
+    }, [barStyle, hidden, animated, backgroundColor, translucent]);
+    return null;
+};
+StatusBarAndroid.setBarStyle = style => {
+    dlog(`StatusBar.setBarStyle android ${style}`);
+    getNativeModule(STATUS_BAR_MANAGER)?.setStyle(style);
+};
+StatusBarAndroid.setHidden = hidden => {
+    dlog(`StatusBar.setHidden android ${hidden}`);
+    getNativeModule(STATUS_BAR_MANAGER)?.setHidden(hidden);
+};
+StatusBarAndroid.setNetworkActivityIndicatorVisible = () => {
+    // No Android equivalent, an iOS-only concept.
+    dlog('StatusBar.setNetworkActivityIndicatorVisible (android no-op)');
+};
+StatusBarAndroid.setBackgroundColor = (color, animated = false) => {
+    dlog(`StatusBar.setBackgroundColor android ${String(color)}`);
+    const manager = getNativeModule(STATUS_BAR_MANAGER);
+    if (manager === null)
+        return;
+    applyBackgroundColor(manager, color, animated);
+};
+StatusBarAndroid.setTranslucent = translucent => {
+    // RISK: window translucent flag is device-verify-pending (may blank the surface).
+    dlog(`StatusBar.setTranslucent android ${translucent}`);
+    getNativeModule(STATUS_BAR_MANAGER)?.setTranslucent(translucent);
+};
+// Android exposes the bar height as a native constant; undefined if the module or the
+// constant is absent (older RN, or a fake that doesn't define getConstants). Read lazily
+// (getter, not a value) so nothing touches native at import time.
+Object.defineProperty(StatusBarAndroid, 'currentHeight', {
+    get() {
+        return getNativeModule(STATUS_BAR_MANAGER)?.getConstants?.()
+            .HEIGHT;
+    },
+    enumerable: true,
+});
+export const StatusBar = StatusBarAndroid;

package/build/modules/status-bar/index.d.ts

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

package/build/modules/status-bar/index.ios.d.ts

@@ -0,0 +1,3 @@
+import type { IStatusBarComponent } from './shared';
+export type { IStatusBarProps, IStatusBarStyle } from './shared';
+export declare const StatusBar: IStatusBarComponent;

package/build/modules/status-bar/index.ios.js

@@ -0,0 +1,64 @@
+// StatusBar on iOS: drives the iOS `StatusBarManager` TurboModule from its props
+// (and from static methods). The native contract is RN's spec at
+// .vendors/react-native/.../src/private/specs_DEPRECATED/modules/NativeStatusBarManagerIOS.js:
+//   setStyle(statusBarStyle?: string, animated: boolean)
+//   setHidden(hidden: boolean, withAnimation: 'none' | 'fade' | 'slide')
+//   setNetworkActivityIndicatorVisible(visible: boolean)
+// Only those three setters are mirrored as the hand-written interface, the typed trust
+// boundary getNativeModule<T> resolves against. Metro picks this on an iOS host.
+//
+// The native-call logic stays in the adapter (not the engine): the platform module shape
+// diverges iOS/Android and the headless smokes import this file by name (tsx has no
+// platform picker, so routing through the engine barrel would resolve the iOS base on every
+// platform). The engine owns only the pure shared contract: types, constants, hideTransition.
+import { useEffect } from 'react';
+import { dlog, getNativeModule, STATUS_BAR_MANAGER, STATIC_HIDE_TRANSITION, hideTransition, } from '@symbiote-native/engine';
+// StatusBar renders null and applies its props to the native module in an effect,
+// on mount and on every prop change. Simplification vs RN: RN maintains a
+// prop-merge stack so nested StatusBars compose (deepest/last wins). This module
+// direct-applies a single component's props, which is correct for one StatusBar.
+export const StatusBar = props => {
+    const { barStyle, hidden, animated = false, networkActivityIndicatorVisible } = props;
+    useEffect(() => {
+        // Resolve lazily inside the effect, not at import, keeps this module importable
+        // headless before a fake __turboModuleProxy is installed. Non-enforcing: a
+        // declarative StatusBar must NOT crash the whole render if the module can't resolve.
+        const manager = getNativeModule(STATUS_BAR_MANAGER);
+        if (manager === null) {
+            dlog('StatusBar: StatusBarManager not resolvable via __turboModuleProxy — skipping');
+            return;
+        }
+        dlog('StatusBar -> applying props to StatusBarManager');
+        if (barStyle !== undefined)
+            manager.setStyle(barStyle, animated);
+        if (hidden !== undefined)
+            manager.setHidden(hidden, hideTransition(animated));
+        if (networkActivityIndicatorVisible !== undefined) {
+            manager.setNetworkActivityIndicatorVisible(networkActivityIndicatorVisible);
+        }
+    }, [barStyle, hidden, animated, networkActivityIndicatorVisible]);
+    return null;
+};
+// The static API mirrors the declarative component: non-throwing. A missing optional
+// native module is a no-op.
+StatusBar.setBarStyle = (style, animated = false) => {
+    dlog('StatusBar.setBarStyle');
+    getNativeModule(STATUS_BAR_MANAGER)?.setStyle(style, animated);
+};
+StatusBar.setHidden = (hidden, animation = STATIC_HIDE_TRANSITION) => {
+    dlog('StatusBar.setHidden');
+    getNativeModule(STATUS_BAR_MANAGER)?.setHidden(hidden, animation);
+};
+StatusBar.setNetworkActivityIndicatorVisible = visible => {
+    dlog('StatusBar.setNetworkActivityIndicatorVisible');
+    getNativeModule(STATUS_BAR_MANAGER)?.setNetworkActivityIndicatorVisible(visible);
+};
+// Android-only on RN, inert on iOS (the iOS status bar has no background color and
+// is never translucent in RN's sense). Present so the contract is platform-uniform.
+StatusBar.setBackgroundColor = () => {
+    dlog('StatusBar.setBackgroundColor (ios no-op)');
+};
+StatusBar.setTranslucent = () => {
+    dlog('StatusBar.setTranslucent (ios no-op)');
+};
+// currentHeight is Android-only; absent on iOS (RN sets it to null on iOS).

package/build/modules/status-bar/index.js

@@ -0,0 +1,4 @@
+// Base / default StatusBar: re-exports the iOS build. Metro overrides this with
+// status-bar.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. See status-bar-shared.ts.
+export * from './index.ios';

package/build/modules/status-bar/shared.d.ts

@@ -0,0 +1,6 @@
+import type { FC } from 'react';
+import type { IStatusBarImperative, IStatusBarProps } from '@symbiote-native/engine';
+export type { IStatusBarProps, IStatusBarStyle, IStatusBarAnimation, } from '@symbiote-native/engine';
+export interface IStatusBarComponent extends FC<IStatusBarProps>, IStatusBarImperative {
+    currentHeight?: number;
+}

package/build/modules/status-bar/shared.js

@@ -0,0 +1,6 @@
+// StatusBar is the React-side contract. The pure types + the imperative API + applyStatusBarProps
+// live in @symbiote-native/engine (shared verbatim with every adapter); React supplies only the
+// declarative component shape: an FC that renders null and applies the props in an effect, with
+// the imperative statics attached to the function object (RN's StatusBar). IStatusBarComponent
+// is the one React-coupled type (it names React's FC), so it stays here, not in the engine.
+export {};

package/build/modules/text-input-state.d.ts

@@ -0,0 +1 @@
+export { currentlyFocusedInput, setInputFocused, setInputBlurred, blurTextInput, } from '@symbiote-native/engine';

package/build/modules/text-input-state.js

@@ -0,0 +1,3 @@
+// TextInputState moved to @symbiote-native/engine (a framework-agnostic module: Keyboard.dismiss
+// and TextInput both reach it). This thin re-export keeps the adapter's import path stable.
+export { currentlyFocusedInput, setInputFocused, setInputBlurred, blurTextInput, } from '@symbiote-native/engine';

package/build/modules/toast-android.d.ts

@@ -0,0 +1 @@
+export { ToastAndroid } from '@symbiote-native/engine';

package/build/modules/toast-android.js

@@ -0,0 +1,4 @@
+// ToastAndroid now lives framework-agnostic in @symbiote-native/engine (imperative
+// native-bridge module, no visual, no lifecycle). The React adapter re-exports it
+// verbatim so the public surface is unchanged. See ADR 0019.
+export { ToastAndroid } from '@symbiote-native/engine';

package/build/modules/vibration.d.ts

@@ -0,0 +1 @@
+export { Vibration } from '@symbiote-native/engine';

package/build/modules/vibration.js

@@ -0,0 +1,4 @@
+// Vibration now lives framework-agnostic in @symbiote-native/engine (imperative native-bridge
+// module, no visual, no lifecycle). The React adapter re-exports it verbatim; the
+// platform split (vibration.ios/vibration.android) lives inside engine. See ADR 0019.
+export { Vibration } from '@symbiote-native/engine';

package/build/reconciler-constants.d.ts

@@ -0,0 +1,7 @@
+export declare const LegacyRoot = 0;
+export declare const ConcurrentRoot = 1;
+export declare const NoEventPriority = 0;
+export declare const DiscreteEventPriority = 2;
+export declare const ContinuousEventPriority = 8;
+export declare const DefaultEventPriority = 32;
+export declare const IdleEventPriority = 268435456;

package/build/reconciler-constants.js

@@ -0,0 +1,12 @@
+// Inlined from react-reconciler/constants. The package ships CommonJS only, so
+// importing the subpath under ESM/bundler resolution is fragile; these values
+// are stable.
+// https://github.com/facebook/react/blob/main/packages/react-reconciler/src/ReactRootTags.js
+// https://github.com/facebook/react/blob/main/packages/react-reconciler/src/ReactEventPriorities.js
+export const LegacyRoot = 0;
+export const ConcurrentRoot = 1;
+export const NoEventPriority = 0;
+export const DiscreteEventPriority = 2;
+export const ContinuousEventPriority = 8;
+export const DefaultEventPriority = 32;
+export const IdleEventPriority = 268435456;

package/build/render.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from 'react';
+import { type IRootTag, type SymbioteSurface } from '@symbiote-native/engine';
+export declare function mount(rootTag: IRootTag, element: ReactNode): SymbioteSurface;
+export declare function unmount(rootTag: IRootTag): void;
+declare global {
+    var RN$stopSurface: ((surfaceId: number) => void) | undefined;
+}

package/build/render.js

@@ -0,0 +1,60 @@
+// Mount a React element tree onto a Fabric surface. The native host hands us a
+// rootTag (via AppRegistry.registerRunnable); we create a surface for it and let
+// the reconciler drive shared, which commits into nativeFabricUIManager.
+import { createSurface, disposeRoot, setEventDispatcher, dlog, } from '@symbiote-native/engine';
+import reconciler, { withDiscretePriority } from './host-config';
+import { LegacyRoot } from './reconciler-constants';
+const noop = () => { };
+// A native event runs the listener (which may call setState) outside React's
+// loop. Run it at discrete priority so the update takes the sync lane, then
+// flush that work synchronously to paint the result.
+setEventDispatcher(run => {
+    withDiscretePriority(run);
+    // @ts-expect-error flushSyncWork exists at runtime in react-reconciler 0.33
+    reconciler.flushSyncWork();
+});
+const containers = new Map();
+// Unmount a surface's React tree (render null → empty completeRoot, clearing the
+// native views) and drop its shared root container so a later mount on the same
+// rootTag rebuilds from scratch instead of cloning the stopped surface's dead handles.
+function teardown(rootTag) {
+    const container = containers.get(rootTag);
+    if (container === undefined)
+        return;
+    // @ts-expect-error updateContainerSync exists at runtime in react-reconciler 0.33
+    reconciler.updateContainerSync(null, container, null, noop);
+    // @ts-expect-error flushSyncWork exists at runtime in react-reconciler 0.33
+    reconciler.flushSyncWork();
+    containers.delete(rootTag);
+    disposeRoot(rootTag);
+}
+export function mount(rootTag, element) {
+    // A re-mount on a live rootTag (host restarted the surface without stopping it
+    // first) starts clean. Otherwise the stale container double-drives the surface.
+    teardown(rootTag);
+    const surface = createSurface(rootTag);
+    const container = reconciler.createContainer(surface, LegacyRoot, null, false, null, 'symbiote', noop, noop, noop, noop, null);
+    containers.set(rootTag, container);
+    // react-reconciler 0.33 exposes updateContainerSync + flushSyncWork for an
+    // immediate render/commit; @types 0.32 still lists the older updateContainer /
+    // flushSync names, so these calls are type-suppressed until the types catch up.
+    // @ts-expect-error updateContainerSync exists at runtime in react-reconciler 0.33
+    reconciler.updateContainerSync(element, container, null, noop);
+    // @ts-expect-error flushSyncWork exists at runtime in react-reconciler 0.33
+    reconciler.flushSyncWork();
+    return surface;
+}
+// Tear down a surface by rootTag, the public pair of `mount`. This is also the JS half of
+// the bridgeless `RN$stopSurface` contract (see installStopSurfaceGlobal): the native
+// AppRegistryBinding calls our global to stop a surface; we unmount its tree and dispose its root.
+export function unmount(rootTag) {
+    dlog(`unmount root=${rootTag}`);
+    teardown(rootTag);
+}
+function installStopSurfaceGlobal() {
+    globalThis.RN$stopSurface = (surfaceId) => {
+        unmount(surfaceId);
+    };
+    dlog('installed global.RN$stopSurface');
+}
+installStopSurfaceGlobal();

package/build/utils/responder-props.d.ts

@@ -0,0 +1 @@
+export type { IResponderProps } from '@symbiote-native/components';

package/build/utils/responder-props.js

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

package/build/utils/styles.d.ts

@@ -0,0 +1 @@
+export type { IViewStyle, ITextStyle, IStyleProp, IDimensionValue, IFlexAlign, IFlexJustify, ITransformProp, IBoxShadowValue, IDropShadowValue, IFilterFunction, IBlendMode, } from '@symbiote-native/engine';

package/build/utils/styles.js

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

package/metro-css-parser.cjs

@@ -0,0 +1,11 @@
+// Re-exports @symbiote-native/css-parser verbatim from INSIDE this package, so a consuming app's own
+// require('@symbiote-native/react/metro-css-parser') resolves css-parser relative to THIS file's
+// location (adapters/react/node_modules, where css-parser IS a real dependency — see
+// package.json), not relative to the app's own node_modules, which does not and should not
+// need to declare @symbiote-native/css-parser itself. Node resolves each require() relative to the
+// requiring FILE's own location, so this indirection is what actually removes the extra install
+// step, not pnpm hoisting (which does not propagate this transitively across workspace packages
+// the way a flat classic node_modules would). .cjs, not .js: this package is "type": "module",
+// and Metro's babelTransformerPath loading expects a require()-able module. See the
+// symbiote-sfc-style-compiler skill.
+module.exports = require('@symbiote-native/css-parser');

package/package.json

@@ -0,0 +1,53 @@
+{
+  "name": "@symbiote-native/react",
+  "version": "0.1.0",
+  "description": "SymbioteJS's React adapter — a react-reconciler host config (mutation mode) driving real native iOS/Android views through stock React Native Fabric.",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/OneEyed1366/symbiote-native.git",
+    "directory": "adapters/react"
+  },
+  "homepage": "https://github.com/OneEyed1366/symbiote-native/tree/master/adapters/react#readme",
+  "bugs": {
+    "url": "https://github.com/OneEyed1366/symbiote-native/issues"
+  },
+  "author": "Andrey Prokopenko <psevdoproger@gmail.com>",
+  "type": "module",
+  "main": "./build/index.js",
+  "module": "./build/index.js",
+  "types": "./build/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./build/index.d.ts",
+      "default": "./build/index.js"
+    },
+    "./metro-css-parser": "./metro-css-parser.cjs"
+  },
+  "files": [
+    "build",
+    "metro-css-parser.cjs"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "react-reconciler": "^0.33.0",
+    "@symbiote-native/components": "0.1.0",
+    "@symbiote-native/engine": "0.1.0",
+    "@symbiote-native/css-parser": "0.1.0"
+  },
+  "peerDependencies": {
+    "react": ">=19.0.0",
+    "react-native": ">=0.86"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.0",
+    "@types/react-reconciler": "^0.32.2",
+    "react": "19.2.3",
+    "@symbiote-native/test-utils": "0.0.0"
+  },
+  "scripts": {
+    "typecheck": "tsc --build",
+    "format": "prettier --write \"src/**/*.{ts,tsx}\""
+  }
+}