@symbiote-native/react 0.2.4 → 0.2.5

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

@@ -1,89 +1,33 @@
-// 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.
+// StatusBar on Android: the declarative React half only. The native StatusBarManager driving
+// (applyStatusBarProps), the imperative statics (statusBarImperative), and the Android
+// currentHeight getter (statusBarCurrentHeight) all live in @symbiote-native/engine, shared
+// verbatim with every adapter (Vue's status-bar.ts, Angular's status-bar.ts drive the exact
+// same functions). This file supplies only what's React-specific: an FC that renders null and
+// re-applies props via useEffect on mount + every prop change, with the imperative statics
+// attached to the function object, exactly like RN's own StatusBar.
 //
-// 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).
+// Metro picks this file on an Android host, resolving '@symbiote-native/engine's relative
+// './status-bar' import to its own index.android.ts in turn (Android's native module is a
+// DIFFERENT shape from iOS — single-arg setHidden(hidden)/setStyle(style) plus
+// setColor/setTranslucent — all handled inside that engine module, not here).
 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);
-}
+import { applyStatusBarProps, statusBarImperative, statusBarCurrentHeight, } from '@symbiote-native/engine';
 // 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;
+// every prop change, same contract as iOS.
+const StatusBarAndroidComponent = props => {
+    const { barStyle, hidden, animated, 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);
+        applyStatusBarProps(props);
+        // eslint-disable-next-line react-hooks/exhaustive-deps -- deps are the primitive fields, not `props` itself, so an unchanged prop shape doesn't re-fire.
     }, [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);
-};
+const StatusBarAndroid = Object.assign(StatusBarAndroidComponent, statusBarImperative);
 // 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.
+// constant is absent. Read lazily (getter, not a value) so nothing touches native at import
+// time — the engine's Android impl resolves it on access.
 Object.defineProperty(StatusBarAndroid, 'currentHeight', {
-    get() {
-        return getNativeModule(STATUS_BAR_MANAGER)?.getConstants?.()
-            .HEIGHT;
-    },
+    get: statusBarCurrentHeight,
     enumerable: true,
 });
 export const StatusBar = StatusBarAndroid;

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

@@ -1,64 +1,29 @@
-// StatusBar on iOS: drives the iOS `StatusBarManager` TurboModule from its props
-// (and from static methods). The native contract matches React Native's own
-// NativeStatusBarManagerIOS spec:
-//   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.
+// StatusBar on iOS: the declarative React half only. The native `StatusBarManager`
+// TurboModule driving (applyStatusBarProps), the imperative statics (statusBarImperative),
+// and the iOS currentHeight stub all live in @symbiote-native/engine, shared verbatim with
+// every adapter (Vue's status-bar.ts, Angular's status-bar.ts drive the exact same functions).
+// This file supplies only what's React-specific: an FC that renders null and re-applies props
+// via useEffect on mount + every prop change, with the imperative statics attached to the
+// function object, exactly like RN's own StatusBar.
 //
-// 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.
+// Metro picks this file on an iOS host; the headless/tsx base (status-bar/index.ts) re-exports
+// it, which is also what a bare '@symbiote-native/engine' import resolves to under vitest — so
+// this file's own engine import is already vitest-correct, no platform-selection subtlety here.
 import { useEffect } from 'react';
-import { dlog, getNativeModule, STATUS_BAR_MANAGER, STATIC_HIDE_TRANSITION, hideTransition, } from '@symbiote-native/engine';
+import { applyStatusBarProps, statusBarImperative } 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;
+const StatusBarComponent = props => {
+    const { barStyle, hidden, animated, 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);
-        }
+        applyStatusBarProps(props);
+        // eslint-disable-next-line react-hooks/exhaustive-deps -- deps are the primitive fields, not `props` itself, so an unchanged prop shape doesn't re-fire.
     }, [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).
+// The imperative statics mirror the declarative component: non-throwing, a missing optional
+// native module is a no-op. currentHeight is Android-only; absent on iOS (RN sets it to null
+// on iOS), so it's intentionally not attached here.
+export const StatusBar = Object.assign(StatusBarComponent, statusBarImperative);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symbiote-native/react",
-  "version": "0.2.4",
+  "version": "0.2.5",
   "description": "SymbioteNative's React adapter — a react-reconciler host config (mutation mode) driving real native iOS/Android views through stock React Native Fabric.",
   "repository": {
     "type": "git",
@@ -36,9 +36,9 @@
   },
   "dependencies": {
     "react-reconciler": "^0.33.0",
-    "@symbiote-native/components": "0.2.3",
+    "@symbiote-native/components": "0.2.4",
     "@symbiote-native/css-parser": "0.2.1",
-    "@symbiote-native/engine": "0.1.4"
+    "@symbiote-native/engine": "0.1.5"
   },
   "peerDependencies": {
     "react": ">=19.0.0",