rn-system-bar 3.2.3 → 3.2.4

package/src/types.ts

@@ -14,20 +14,17 @@ export type StatusBarStyle = "light" | "dark";
 
 /**
  * Navigation bar color value.
- *
- * - Any CSS hex string  →  solid colour      e.g. "#1a1a2e", "#000"
- * - `"transparent"`     →  fully transparent  (FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS +
- *                           transparent color; content draws behind bar)
- * - `"translucent"`     →  semi-transparent   (FLAG_TRANSLUCENT_NAVIGATION)
+ * - Any hex string  →  solid colour      e.g. "#1a1a2e"
+ * - `"transparent"` →  fully transparent
+ * - `"translucent"` →  semi-transparent
  */
 export type NavigationBarColorValue = string | "transparent" | "translucent";
 
 /**
  * Status bar background color value.
- *
- * - Any CSS hex string  →  solid colour
- * - `"transparent"`     →  fully transparent  (draws behind content)
- * - `"translucent"`     →  semi-transparent
+ * - Any hex string  →  solid colour
+ * - `"transparent"` →  fully transparent
+ * - `"translucent"` →  semi-transparent
  */
 export type StatusBarColorValue = string | "transparent" | "translucent";
 
@@ -35,19 +32,11 @@ export type StatusBarColorValue = string | "transparent" | "translucent";
 //  Theme
 // ─────────────────────────────────────────────
 
-/**
- * "system"  → follow the OS Appearance (dark/light).
- * "dark"    → force dark.
- * "light"   → force light.
- */
 export type ThemeMode = "system" | "dark" | "light";
 
 export interface ThemeState {
-  /** Resolved dark-mode flag. Always a concrete boolean. */
   isDark: boolean;
-  /** Currently active override ("system" = following OS). */
   mode: ThemeMode;
-  /** Set the override mode. Pass "system" to revert to OS. */
   setMode: (mode: ThemeMode) => void;
 }
 
@@ -66,7 +55,7 @@ export type VolumeStream =
   | "system";
 
 // ─────────────────────────────────────────────
-//  System screencast  (external display / HDMI)
+//  System screencast  (external display / HDMI / AirPlay)
 // ─────────────────────────────────────────────
 
 export interface ScreencastDisplay {
@@ -75,49 +64,77 @@ export interface ScreencastDisplay {
   isValid: boolean;
 }
 
-/** Result of getSystemScreencastInfo() — physical/HDMI/Miracast external display. */
 export interface SystemScreencastInfo {
   isCasting: boolean;
   displayName: string | null;
   displays: ScreencastDisplay[];
 }
 
+/** @deprecated Use SystemScreencastInfo */
+export interface ScreencastInfo extends SystemScreencastInfo {}
+
 // ─────────────────────────────────────────────
-//  App-only cast  (MediaRouter — Chromecast / TV)
+//  Network
 // ─────────────────────────────────────────────
 
-/** Connection state of the in-app cast session. */
-export type AppCastState =
-  | "idle"
-  | "scanning"
-  | "connecting"
-  | "connected"
-  | "disconnecting";
-
-/** A discovered castable device (TV, Chromecast, etc.). */
-export interface AppCastDevice {
-  /** Unique route ID from MediaRouter. */
-  id: string;
-  /** Human-readable device name e.g. "Living Room TV". */
-  name: string;
-  /** Device description / model string (may be null). */
-  description: string | null;
-  /** Signal strength 0–100, or null if unavailable. */
-  signalStrength: number | null;
-  /** Whether a pairing/PIN step is required. */
-  requiresPairing: boolean;
+export type NetworkType = "wifi" | "cellular" | "none" | "unknown";
+
+export interface NetworkInfo {
+  /** Connection medium. */
+  type: NetworkType;
+  /** True when the device has an active internet connection. */
+  isConnected: boolean;
+  /** True when airplane mode is on (Android only; always false on iOS). */
+  isAirplaneMode: boolean;
+  /** Wi-Fi SSID — Android only, requires location permission; null on iOS. */
+  ssid: string | null;
+  /** Cellular generation e.g. "4g" | "5g" — Android only; null on iOS. */
+  cellularGeneration: string | null;
 }
 
-/** Full snapshot of in-app cast state. */
-export interface AppCastInfo {
-  state: AppCastState;
-  /** Devices found during the last scan. */
-  devices: AppCastDevice[];
-  /** The device currently connected (or connecting). */
-  connectedDevice: AppCastDevice | null;
-  /** Error message from the last failed operation. */
-  error: string | null;
+// ─────────────────────────────────────────────
+//  Battery
+// ─────────────────────────────────────────────
+
+export type BatteryState = "charging" | "discharging" | "full" | "unknown";
+
+export interface BatteryInfo {
+  /** Battery level 0–100, or -1 if unknown. */
+  level: number;
+  state: BatteryState;
+  isCharging: boolean;
+  /** True when level ≤ 20 and not charging. */
+  isLow: boolean;
 }
 
-/** @deprecated Use SystemScreencastInfo */
-export interface ScreencastInfo extends SystemScreencastInfo {}
+// ─────────────────────────────────────────────
+//  Haptics
+// ─────────────────────────────────────────────
+
+export type HapticPattern =
+  | "light"
+  | "medium"
+  | "heavy"
+  | "success"
+  | "warning"
+  | "error"
+  | "selection";
+
+// ─────────────────────────────────────────────
+//  Font Scale
+// ─────────────────────────────────────────────
+
+export interface FontScaleInfo {
+  /**
+   * System font scale multiplier (1.0 = default).
+   * Android: from Configuration.fontScale.
+   * iOS: derived from UIContentSizeCategory.
+   */
+  fontScale: number;
+  /**
+   * Screen pixel density.
+   * Android: DisplayMetrics.density.
+   * iOS: UIScreen.main.scale.
+   */
+  density: number;
+}

package/src/useSystemBar.ts

@@ -2,15 +2,17 @@
 //  rn-system-bar · useSystemBar.ts
 // ─────────────────────────────────────────────
 
-import { useCallback, useEffect, useRef, useState } from "react";
+import { useEffect, useState } from "react";
 import * as SystemBar from "./SystemBar";
 import type {
-  AppCastInfo,
+  BatteryInfo,
+  FontScaleInfo,
   NavigationBarBehavior,
   NavigationBarButtonStyle,
   NavigationBarColorValue,
   NavigationBarStyle,
   NavigationBarVisibility,
+  NetworkInfo,
   Orientation,
   ScreencastInfo,
   StatusBarColorValue,
@@ -37,7 +39,6 @@ export interface SystemBarConfig {
   statusBarColor?: StatusBarColorValue;
   statusBarStyle?: StatusBarStyle;
   statusBarVisible?: boolean;
-  statusBarAnimated?: boolean;
 
   // Screen
   keepScreenOn?: boolean;
@@ -61,75 +62,46 @@ export interface SystemBarConfig {
 // ─────────────────────────────────────────────
 
 export const useSystemBar = (config: SystemBarConfig): void => {
-  const configRef = useRef("");
   const configStr = JSON.stringify(config);
 
   useEffect(() => {
-    if (configRef.current === configStr) return;
-    configRef.current = configStr;
-
-    const apply = async () => {
-      if (config.navigationBarColor !== undefined)
-        SystemBar.setNavigationBarColor(config.navigationBarColor);
-      if (config.navigationBarVisibility !== undefined)
-        SystemBar.setNavigationBarVisibility(config.navigationBarVisibility);
-      if (config.navigationBarButtonStyle !== undefined)
-        SystemBar.setNavigationBarButtonStyle(config.navigationBarButtonStyle);
-      if (config.navigationBarStyle !== undefined)
-        SystemBar.setNavigationBarStyle(config.navigationBarStyle);
-      if (config.navigationBarBehavior !== undefined)
-        SystemBar.setNavigationBarBehavior(config.navigationBarBehavior);
-      if (config.statusBarColor !== undefined)
-        SystemBar.setStatusBarColor(config.statusBarColor);
-      if (config.statusBarStyle !== undefined)
-        SystemBar.setStatusBarStyle(config.statusBarStyle);
-      if (config.statusBarVisible !== undefined)
-        SystemBar.setStatusBarVisibility(config.statusBarVisible);
-      if (config.keepScreenOn !== undefined)
-        SystemBar.keepScreenOn(config.keepScreenOn);
-      if (config.immersiveMode !== undefined)
-        SystemBar.immersiveMode(config.immersiveMode);
-      if (config.brightness !== undefined)
-        SystemBar.setBrightness(config.brightness);
-      if (config.orientation !== undefined)
-        SystemBar.setOrientation(config.orientation);
-      if (config.secureScreen !== undefined)
-        SystemBar.setSecureScreen(config.secureScreen);
-    };
-
-    apply().catch(() => {
-      if (__DEV__)
-        console.warn(
-          "[rn-system-bar] useSystemBar: one or more settings failed.",
-        );
-    });
+    if (config.navigationBarColor !== undefined)
+      SystemBar.setNavigationBarColor(config.navigationBarColor);
+    if (config.navigationBarVisibility !== undefined)
+      SystemBar.setNavigationBarVisibility(config.navigationBarVisibility);
+    if (config.navigationBarButtonStyle !== undefined)
+      SystemBar.setNavigationBarButtonStyle(config.navigationBarButtonStyle);
+    if (config.navigationBarStyle !== undefined)
+      SystemBar.setNavigationBarStyle(config.navigationBarStyle);
+    if (config.navigationBarBehavior !== undefined)
+      SystemBar.setNavigationBarBehavior(config.navigationBarBehavior);
+    if (config.statusBarColor !== undefined)
+      SystemBar.setStatusBarColor(config.statusBarColor);
+    if (config.statusBarStyle !== undefined)
+      SystemBar.setStatusBarStyle(config.statusBarStyle);
+    if (config.statusBarVisible !== undefined)
+      SystemBar.setStatusBarVisibility(config.statusBarVisible);
+    if (config.keepScreenOn !== undefined)
+      SystemBar.keepScreenOn(config.keepScreenOn);
+    if (config.immersiveMode !== undefined)
+      SystemBar.immersiveMode(config.immersiveMode);
+    if (config.brightness !== undefined)
+      SystemBar.setBrightness(config.brightness);
+    if (config.orientation !== undefined)
+      SystemBar.setOrientation(config.orientation);
+    if (config.secureScreen !== undefined)
+      SystemBar.setSecureScreen(config.secureScreen);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [configStr]);
 };
 
 // ─────────────────────────────────────────────
 //  ThemedSystemBarConfig + useThemeSystemBar
-//
-//  Combines useTheme() + useSystemBar() — nav/status bars
-//  automatically update whenever the theme changes (OS or manual).
-//
-//  @example
-//  const { isDark, mode, setMode } = useThemeSystemBar({
-//    dark:  { navigationBarColor: "#000000", statusBarStyle: "light" },
-//    light: { navigationBarColor: "#ffffff", statusBarStyle: "dark"  },
-//    base:  { keepScreenOn: true },
-//  });
 // ─────────────────────────────────────────────
 
 export interface ThemedSystemBarConfig {
-  /** Config applied when the resolved theme is DARK. */
   dark?: SystemBarConfig;
-  /** Config applied when the resolved theme is LIGHT. */
   light?: SystemBarConfig;
-  /**
-   * Static config merged under both themes.
-   * Theme-specific (dark/light) values always win.
-   */
   base?: SystemBarConfig;
 }
 
@@ -157,12 +129,6 @@ export type { ThemeMode, ThemeState };
 
 // ─────────────────────────────────────────────
 //  useSystemScreencast
-//  Tracks OS-level external display state.
-//  Android: DisplayManager (HDMI / Miracast / Presentation display).
-//  iOS:     UIScreen.screens (AirPlay mirror).
-//
-//  @example
-//  const { isCasting, displayName, displays } = useSystemScreencast();
 // ─────────────────────────────────────────────
 
 export const useSystemScreencast = (): SystemScreencastInfo => {
@@ -183,9 +149,8 @@ export const useSystemScreencast = (): SystemScreencastInfo => {
   return info;
 };
 
-/** @deprecated Renamed to useSystemScreencast() */
-// useSystemBar.ts — useScreencast
-export const useScreencast = () => {
+/** @deprecated Use useSystemScreencast() */
+export const useScreencast = (): ScreencastInfo => {
   const [info, setInfo] = useState<ScreencastInfo>({
     isCasting: false,
     displayName: null,
@@ -193,7 +158,6 @@ export const useScreencast = () => {
   });
 
   useEffect(() => {
-    // Guard: if method doesn't exist on native module, bail silently
     SystemBar.getScreencastInfo()
       .then(setInfo)
       .catch(() => {
@@ -202,13 +166,10 @@ export const useScreencast = () => {
             "[rn-system-bar] getSystemScreencastInfo not available. Rebuild native.",
           );
       });
-
     let unsub: (() => void) | undefined;
     try {
       unsub = SystemBar.onScreencastChange(setInfo);
-    } catch {
-      // native listener not available
-    }
+    } catch {}
     return () => unsub?.();
   }, []);
 
@@ -216,79 +177,89 @@ export const useScreencast = () => {
 };
 
 // ─────────────────────────────────────────────
-//  UseAppCastReturn + useAppCast
-//
-//  In-app device discovery + casting via Android MediaRouter.
-//  Mirrors ONLY this app's screen — NOT the whole system.
-//  iOS always returns idle (AirPlay is system-managed, no public API).
-//
-//  Flow:
-//    1. Mount the component — calls getAppCastInfo() for initial state
-//    2. call scan()                → state = "scanning", devices populate
-//    3. call connect(device.id)    → state = "connecting" → "connected"
-//    4. call disconnect()          → state = "disconnecting" → "idle"
-//    5. Unmount                    → scan auto-stopped (battery safe)
-//
-//  @example
-//  const { state, devices, connectedDevice, error,
-//          scan, stopScan, connect, disconnect } = useAppCast();
-//
-//  <Button title="Find TVs" onPress={scan} />
-//  {devices.map(d => (
-//    <Button key={d.id} title={`Cast to ${d.name}`}
-//            onPress={() => connect(d.id)} />
-//  ))}
-//  {connectedDevice && (
-//    <Button title="Stop casting" onPress={disconnect} />
-//  )}
+//  useNetwork
 // ─────────────────────────────────────────────
 
-export interface UseAppCastReturn extends AppCastInfo {
-  /** Start scanning for nearby castable devices (TV, Chromecast, etc.). */
-  scan: () => void;
-  /** Stop the device discovery scan. */
-  stopScan: () => void;
-  /**
-   * Connect to a discovered device and begin casting this app's screen.
-   * @param deviceId   The `id` field from `AppCastDevice`.
-   * @param pairingPin Optional PIN string if `requiresPairing` is true.
-   */
-  connect: (deviceId: string, pairingPin?: string) => void;
-  /** End the active cast session and return to idle. */
-  disconnect: () => void;
-}
-
-export const useAppCast = (): UseAppCastReturn => {
-  const [info, setInfo] = useState<AppCastInfo>({
-    state: "idle",
-    devices: [],
-    connectedDevice: null,
-    error: null,
+/**
+ * Subscribe to network state. Fires immediately with the current snapshot,
+ * then on every connectivity change.
+ *
+ * @example
+ * const { isConnected, type } = useNetwork();
+ */
+export const useNetwork = (): NetworkInfo => {
+  const [info, setInfo] = useState<NetworkInfo>({
+    type: "unknown",
+    isConnected: false,
+    isAirplaneMode: false,
+    ssid: null,
+    cellularGeneration: null,
   });
 
   useEffect(() => {
-    // Sync initial state
-    SystemBar.getAppCastInfo()
+    SystemBar.getNetworkInfo()
       .then(setInfo)
       .catch(() => {});
+    const unsub = SystemBar.onNetworkChange(setInfo);
+    return () => unsub();
+  }, []);
 
-    // Subscribe to all cast events (device found/lost, state changes, errors)
-    const unsub = SystemBar.onAppCastChange(setInfo);
+  return info;
+};
+
+// ─────────────────────────────────────────────
+//  useBattery
+// ─────────────────────────────────────────────
 
-    return () => {
-      unsub();
-      // Auto-stop scan on unmount — avoids background battery drain
-      SystemBar.stopAppCastScan();
-    };
+/**
+ * Subscribe to battery state. Fires immediately with the current snapshot,
+ * then on every level / state change.
+ *
+ * @example
+ * const { level, isCharging, isLow } = useBattery();
+ */
+export const useBattery = (): BatteryInfo => {
+  const [info, setInfo] = useState<BatteryInfo>({
+    level: -1,
+    state: "unknown",
+    isCharging: false,
+    isLow: false,
+  });
+
+  useEffect(() => {
+    SystemBar.getBatteryInfo()
+      .then(setInfo)
+      .catch(() => {});
+    const unsub = SystemBar.onBatteryChange(setInfo);
+    return () => unsub();
   }, []);
 
-  const scan = useCallback(() => SystemBar.startAppCastScan(), []);
-  const stopScan = useCallback(() => SystemBar.stopAppCastScan(), []);
-  const connect = useCallback(
-    (id: string, pin?: string) => SystemBar.connectAppCast(id, pin),
-    [],
-  );
-  const disconnect = useCallback(() => SystemBar.disconnectAppCast(), []);
+  return info;
+};
+
+// ─────────────────────────────────────────────
+//  useFontScale
+// ─────────────────────────────────────────────
+
+/**
+ * Subscribe to system font scale changes (accessibility text size).
+ *
+ * @example
+ * const { fontScale, density } = useFontScale();
+ */
+export const useFontScale = (): FontScaleInfo => {
+  const [info, setInfo] = useState<FontScaleInfo>({
+    fontScale: 1,
+    density: 1,
+  });
+
+  useEffect(() => {
+    SystemBar.getFontScaleInfo()
+      .then(setInfo)
+      .catch(() => {});
+    const unsub = SystemBar.onFontScaleChange(setInfo);
+    return () => unsub();
+  }, []);
 
-  return { ...info, scan, stopScan, connect, disconnect };
+  return info;
 };