rn-system-bar 3.2.2 → 3.2.4

package/README.md

@@ -1,797 +1,327 @@
-# rn-system-bar v3
+# rn-system-bar
 
-> Control Android & iOS system bars, brightness, volume, orientation, theme, and screen casting from React Native.
-
-Supports **React Native CLI · Expo Dev Client · TypeScript · New Architecture (TurboModules)**
+Control Android & iOS system bars, brightness, volume, orientation, network, battery, haptics, font scale and screen flags from React Native — with zero Expo dependency.
 
 ---
 
-## 📦 Installation
+## Installation
 
-```bash
+```sh
 npm install rn-system-bar
 # or
 yarn add rn-system-bar
 ```
 
-**iOS** — run after install:
+iOS — run pod install after installing:
 
-```bash
+```sh
 cd ios && pod install
 ```
 
-**Android** — auto-linked, no manual steps required.
-
 ---
 
-## 🏗 Architecture
-
-```
-React Native App
-      │
-      ▼
-rn-system-bar  (TypeScript API + Platform guard)
-      │
-      ├─ Android ──► SystemBarModule.kt
-      │               ├ WindowInsetsController (API 30+)
-      │               ├ AudioManager
-      │               ├ ActivityInfo
-      │               ├ DisplayManager        ← system screencast
-      │               └ MediaRouter           ← app-only cast
-      │
-      └─ iOS ──────► SystemBarModule.swift
-                      ├ UIKit / AVFoundation
-                      ├ UIScreen.screens      ← system screencast
-                      └ (AirPlay = system-managed, no public API)
-```
+## Platform coverage
+
+| Feature                                       | Android | iOS      |
+| --------------------------------------------- | ------- | -------- |
+| Navigation bar color / visibility / style     | ✅      | stub     |
+| Status bar color / style / visibility         | ✅      | ✅       |
+| Brightness get / set / listen                 | ✅      | ✅       |
+| Volume get / set / listen                     | ✅      | get only |
+| Keep screen on                                | ✅      | ✅       |
+| Immersive mode                                | ✅      | stub     |
+| Secure screen                                 | ✅      | stub     |
+| Orientation                                   | ✅      | ✅       |
+| Network info + listener                       | ✅      | ✅       |
+| Battery info + listener                       | ✅      | ✅       |
+| Haptic feedback                               | ✅      | ✅       |
+| System screencast (HDMI / Miracast / AirPlay) | ✅      | ✅       |
+| Font scale + listener                         | ✅      | ✅       |
 
 ---
 
-## 📁 Folder Structure
+## API Reference
 
-```
-rn-system-bar/
-├ index.ts
-├ rn-system-bar.podspec
-│
-├ src/
-│  ├ SystemBar.ts       ← all imperative JS/TS APIs
-│  ├ types.ts           ← all TypeScript types
-│  ├ useSystemBar.ts    ← React hooks
-│  └ useTheme.ts        ← theme singleton + useTheme hook
-│
-├ specs/
-│  └ NativeSystemBar.ts ← TurboModule spec (New Architecture)
-│
-├ android/
-│  └ src/main/java/com/systembar/
-│     ├ SystemBarModule.kt
-│     └ SystemBarPackage.kt
-│
-└ ios/
-   ├ SystemBarModule.swift
-   └ SystemBarModule.m
-```
-
----
-
-## 🚀 Quick Start
-
-```tsx
-import React, { useEffect } from "react";
-import { View, Button } from "react-native";
-import * as SystemBar from "rn-system-bar";
-import { useSystemBar, useTheme } from "rn-system-bar";
-
-export default function App() {
-  const { isDark } = useTheme();
-
-  useSystemBar({
-    navigationBarColor: isDark ? "#000000" : "#ffffff",
-    navigationBarButtonStyle: isDark ? "light" : "dark",
-    statusBarStyle: isDark ? "light" : "dark",
-    keepScreenOn: true,
-  });
-
-  return (
-    <View>
-      <Button title="Immersive" onPress={() => SystemBar.immersiveMode(true)} />
-      <Button
-        title="Landscape"
-        onPress={() => SystemBar.setOrientation("landscape")}
-      />
-    </View>
-  );
-}
-```
-
----
-
-## 🎨 Theme
-
-### `useTheme()`
-
-Reads the OS colour scheme and lets you override it manually. All `useTheme()` consumers across the app share one singleton — changing the mode in one place updates every subscriber instantly.
-
-```tsx
-import { useTheme } from "rn-system-bar";
-
-const { isDark, mode, setMode } = useTheme();
-
-// isDark  → true | false  (resolved, always concrete)
-// mode    → "system" | "dark" | "light"
-// setMode → (mode: ThemeMode) => void
-
-// Follow OS (default)
-setMode("system");
-
-// Force dark
-setMode("dark");
-
-// Force light
-setMode("light");
-```
-
-### `setGlobalThemeMode(mode)` — imperative, outside components
-
-```ts
-import { setGlobalThemeMode } from "rn-system-bar";
-
-// Call from anywhere — navigation handlers, async callbacks, etc.
-setGlobalThemeMode("dark");
-```
-
-### `useThemeSystemBar(config)` — theme + system bar in one hook
-
-Automatically re-applies the correct config whenever the theme changes (OS switch or manual `setMode`). Returns the full `ThemeState` so you can also read `isDark` / `mode` / `setMode`.
-
-```tsx
-import { useThemeSystemBar } from "rn-system-bar";
-
-const { isDark, mode, setMode } = useThemeSystemBar({
-  // Applied when dark
-  dark: {
-    navigationBarColor:       "#000000",
-    navigationBarButtonStyle: "light",
-    statusBarColor:           "#000000",
-    statusBarStyle:           "light",
-  },
-  // Applied when light
-  light: {
-    navigationBarColor:       "#ffffff",
-    navigationBarButtonStyle: "dark",
-    statusBarColor:           "#ffffff",
-    statusBarStyle:           "dark",
-  },
-  // Always applied on both themes (theme-specific values win)
-  base: {
-    keepScreenOn: true,
-    orientation:  "portrait",
-  },
-});
-
-// Manual toggle buttons
-<Button title="Dark"   onPress={() => setMode("dark")}   />
-<Button title="Light"  onPress={() => setMode("light")}  />
-<Button title="System" onPress={() => setMode("system")} />
-```
-
----
-
-## 🔵 Navigation Bar — `Android only`
-
-> All navigation bar APIs are automatically guarded with `Platform.OS === "android"`.
-> Calling them on iOS prints a dev-only warning and is a no-op — no crash.
-
-### `setNavigationBarColor(color)`
-
-| Value           | Result                                                        |
-| --------------- | ------------------------------------------------------------- |
-| `"#rrggbb"`     | Solid colour                                                  |
-| `"transparent"` | Fully transparent — content draws edge-to-edge behind the bar |
-| `"translucent"` | Semi-transparent system scrim — frosted-glass effect          |
+### Navigation Bar (Android only)
 
 ```ts
-import { setNavigationBarColor } from "rn-system-bar";
+import {
+  setNavigationBarColor,
+  setNavigationBarVisibility,
+  setNavigationBarButtonStyle,
+  setNavigationBarStyle,
+  setNavigationBarBehavior,
+} from "rn-system-bar";
 
 setNavigationBarColor("#1a1a2e"); // solid hex
-setNavigationBarColor("transparent"); // edge-to-edge / glass
+setNavigationBarColor("transparent"); // edge-to-edge
 setNavigationBarColor("translucent"); // frosted glass
-```
-
-### `setNavigationBarVisibility(mode)`
 
-```ts
-import { setNavigationBarVisibility } from "rn-system-bar";
-
-setNavigationBarVisibility("hidden"); // hide nav bar
-setNavigationBarVisibility("visible"); // show nav bar
-```
-
-### `setNavigationBarButtonStyle(style)`
-
-Controls the icon colour of the navigation bar buttons (back, home, recents).
-
-```ts
-import { setNavigationBarButtonStyle } from "rn-system-bar";
-
-setNavigationBarButtonStyle("light"); // white icons — use on dark backgrounds
-setNavigationBarButtonStyle("dark"); // dark icons  — use on light backgrounds
-```
-
-### `setNavigationBarStyle(style)`
-
-Higher-level wrapper that maps to button style — `"dark"` / `"auto"` → dark icons; `"light"` / `"inverted"` → light icons.
-
-```ts
-import { setNavigationBarStyle } from "rn-system-bar";
-
-setNavigationBarStyle("dark"); // dark icons
-setNavigationBarStyle("light"); // light icons
-setNavigationBarStyle("auto"); // follows system
-setNavigationBarStyle("inverted"); // opposite of system
+setNavigationBarVisibility("hidden"); // "visible" | "hidden"
+setNavigationBarButtonStyle("light"); // "light" | "dark"
+setNavigationBarStyle("dark"); // "auto" | "inverted" | "light" | "dark"
+setNavigationBarBehavior("overlay-swipe"); // "overlay-swipe" | "inset-swipe" | "inset-touch"
 ```
 
-### `setNavigationBarBehavior(behavior)`
+---
 
-Controls how hidden bars re-appear after a swipe gesture.
+### Status Bar
 
 ```ts
-import { setNavigationBarBehavior } from "rn-system-bar";
+import {
+  setStatusBarColor,
+  setStatusBarStyle,
+  setStatusBarVisibility,
+} from "rn-system-bar";
 
-setNavigationBarBehavior("overlay-swipe"); // bar appears temporarily on swipe (API 30+)
-setNavigationBarBehavior("inset-swipe"); // bar pushes content on swipe
-setNavigationBarBehavior("inset-touch"); // bar pushes content on touch
+setStatusBarColor("#000000"); // Android only — hex | "transparent" | "translucent"
+setStatusBarStyle("light"); // "light" | "dark"
+setStatusBarVisibility(false); // hide status bar
 ```
 
 ---
 
-## 🔴 Status Bar
-
-### `setStatusBarColor(color)` — Android only
-
-| Value           | Result                                             |
-| --------------- | -------------------------------------------------- |
-| `"#rrggbb"`     | Solid colour                                       |
-| `"transparent"` | Fully transparent — content draws under status bar |
-| `"translucent"` | Semi-transparent system scrim                      |
-
-```ts
-import { setStatusBarColor } from "rn-system-bar";
-
-setStatusBarColor("#000000"); // solid black
-setStatusBarColor("transparent"); // content visible behind status bar
-setStatusBarColor("translucent"); // frosted glass
-```
-
-### `setStatusBarStyle(style)` — Android + iOS
+### Brightness
 
 ```ts
-import { setStatusBarStyle } from "rn-system-bar";
-
-setStatusBarStyle("light"); // white text/icons — use on dark backgrounds
-setStatusBarStyle("dark"); // dark text/icons  — use on light backgrounds
-```
-
-### `setStatusBarVisibility(visible)` — Android + iOS
+import {
+  setBrightness,
+  getBrightness,
+  onBrightnessChange,
+} from "rn-system-bar";
 
-```ts
-import { setStatusBarVisibility } from "rn-system-bar";
+setBrightness(0.5); // 0.0–1.0
+const level = await getBrightness(); // returns 0.0–1.0
 
-setStatusBarVisibility(false); // hide status bar (fullscreen)
-setStatusBarVisibility(true); // show status bar
+const unsub = onBrightnessChange((brightness) => {
+  console.log("Brightness:", brightness);
+});
+unsub(); // stop listening
 ```
 
 ---
 
-## ☀️ Brightness
-
-### `setBrightness(level)`
-
-```ts
-import { setBrightness } from "rn-system-bar";
-
-setBrightness(1.0); // maximum brightness
-setBrightness(0.5); // 50%
-setBrightness(0.01); // minimum (0.0 is clamped to 0.01)
-```
-
-### `getBrightness()` → `Promise<number>`
+### Volume
 
 ```ts
-import { getBrightness } from "rn-system-bar";
-
-const level = await getBrightness(); // 0.0 – 1.0
-console.log("Brightness:", level);
-```
-
-### `onBrightnessChange(callback)` → unsubscribe
+import {
+  setVolume,
+  getVolume,
+  setVolumeHUDVisible,
+  onVolumeChange,
+} from "rn-system-bar";
 
-Fires on every brightness change. On Android, polls every 500 ms since `Settings.System` doesn't broadcast changes.
+setVolume(0.8); // 0.0–1.0, defaults to "music" stream
+setVolume(0.5, "ring"); // "music" | "ring" | "notification" | "alarm" | "system"
+const vol = await getVolume("music");
 
-```ts
-import { onBrightnessChange } from "rn-system-bar";
+setVolumeHUDVisible(false); // Android only — suppress system volume UI
 
-const unsub = onBrightnessChange((brightness) => {
-  console.log("New brightness:", brightness); // 0.0 – 1.0
+const unsub = onVolumeChange((volume, stream) => {
+  console.log(`${stream} volume: ${volume}`);
 });
-
-// Stop listening
 unsub();
 ```
 
 ---
 
-## 🔊 Volume
-
-### `setVolume(level, stream?)`
-
-> **iOS note:** `setVolume()` is a no-op on iOS due to Apple restrictions. `getVolume()` works normally.
+### Screen
 
 ```ts
-import { setVolume } from "rn-system-bar";
+import { keepScreenOn, immersiveMode, setSecureScreen } from "rn-system-bar";
 
-setVolume(0.8); // 80% — defaults to "music" stream
-setVolume(0.5, "ring"); // 50% ring volume
-setVolume(1.0, "alarm"); // max alarm volume
-setVolume(0.3, "notification");
-setVolume(0.6, "system");
+keepScreenOn(true); // prevent display sleep
+immersiveMode(true); // Android only — hide both bars
+setSecureScreen(true); // Android only — block screenshots / screen recording
 ```
 
-| Stream           | Description             |
-| ---------------- | ----------------------- |
-| `"music"`        | Media / music (default) |
-| `"ring"`         | Ringtone                |
-| `"notification"` | Notifications           |
-| `"alarm"`        | Alarms                  |
-| `"system"`       | UI sounds               |
+---
 
-### `getVolume(stream?)` → `Promise<number>`
+### Orientation
 
 ```ts
-import { getVolume } from "rn-system-bar";
+import { setOrientation } from "rn-system-bar";
 
-const vol = await getVolume("music"); // 0.0 – 1.0
+// "portrait" | "landscape" | "landscape-left" | "landscape-right" | "auto"
+setOrientation("landscape");
+setOrientation("auto"); // follow system auto-rotate
 ```
 
-### `setVolumeHUDVisible(visible)` — Android only
+---
 
-Show or hide the system volume popup when `setVolume` is called.
+### Network
 
 ```ts
-import { setVolumeHUDVisible } from "rn-system-bar";
-
-setVolumeHUDVisible(false); // silent volume change — no popup
-setVolumeHUDVisible(true); // show the popup (default behaviour)
-```
-
-### `onVolumeChange(callback)` → unsubscribe
+import { getNetworkInfo, onNetworkChange } from "rn-system-bar";
 
-Fires when the volume changes via hardware buttons or another app.
-
-```ts
-import { onVolumeChange } from "rn-system-bar";
+const info = await getNetworkInfo();
+// {
+//   type: "wifi" | "cellular" | "none" | "unknown",
+//   isConnected: boolean,
+//   isAirplaneMode: boolean,   // Android only
+//   ssid: string | null,       // Android only, requires location permission
+//   cellularGeneration: string | null,  // Android only
+// }
 
-const unsub = onVolumeChange((volume, stream) => {
-  console.log(`${stream} volume: ${volume}`); // e.g. "music volume: 0.7"
+const unsub = onNetworkChange((info) => {
+  console.log("Network:", info.type, info.isConnected);
 });
-
-// Stop listening
 unsub();
 ```
 
 ---
 
-## 📺 Screen
-
-### `keepScreenOn(enable)` — Android + iOS
-
-Prevents the screen from sleeping while the app is in the foreground.
-
-```ts
-import { keepScreenOn } from "rn-system-bar";
-
-keepScreenOn(true); // prevent sleep
-keepScreenOn(false); // allow sleep (default)
-```
-
-### `immersiveMode(enable)` — Android only
-
-Hides both status bar and navigation bar. Bars temporarily reappear on swipe.
+### Battery
 
 ```ts
-import { immersiveMode } from "rn-system-bar";
-
-immersiveMode(true); // full immersive — both bars hidden
-immersiveMode(false); // restore both bars
-```
-
-### `setSecureScreen(enable)` — Android only
-
-Prevents the screen from being captured via screenshots or screen recording. Applies `FLAG_SECURE` to the window.
+import { getBatteryInfo, onBatteryChange } from "rn-system-bar";
 
-```ts
-import { setSecureScreen } from "rn-system-bar";
+const info = await getBatteryInfo();
+// {
+//   level: number,       // 0–100, -1 if unknown
+//   state: "charging" | "discharging" | "full" | "unknown",
+//   isCharging: boolean,
+//   isLow: boolean,      // true when level <= 20 and not charging
+// }
 
-setSecureScreen(true); // block screenshots and screen recording
-setSecureScreen(false); // allow captures (default)
+const unsub = onBatteryChange((info) => {
+  if (info.isLow) console.warn("Battery low:", info.level);
+});
+unsub();
 ```
 
 ---
 
-## 🔄 Orientation
-
-### `setOrientation(mode)` — Android + iOS
+### Haptics
 
 ```ts
-import { setOrientation } from "rn-system-bar";
+import { haptic } from "rn-system-bar";
 
-setOrientation("portrait"); // lock portrait
-setOrientation("landscape"); // lock landscape (either side)
-setOrientation("landscape-left"); // lock landscape — specific side
-setOrientation("landscape-right"); // lock landscape — specific side
-setOrientation("auto"); // unlock — follows device sensor
+haptic("light"); // subtle tap
+haptic("medium"); // default
+haptic("heavy"); // strong tap
+haptic("success"); // notification — success
+haptic("warning"); // notification — warning
+haptic("error"); // notification — error
+haptic("selection"); // selection tick
 ```
 
-> **Android note:** When the device's auto-rotate toggle is **ON**, `"portrait"` / `"landscape"` use sensor-based variants so the device can still rotate within the axis. When auto-rotate is **OFF**, orientation is hard-locked.
-
 ---
 
-## 📡 System Screencast
-
-Detects OS-level external display state — HDMI, Miracast (Android), AirPlay mirror (iOS). This is the **system** casting state, not your app specifically.
+### System Screencast (HDMI / Miracast / AirPlay)
 
-### `getSystemScreencastInfo()` → `Promise<SystemScreencastInfo>`
+Detects OS-level external displays — HDMI, Miracast on Android; AirPlay mirror on iOS.
 
 ```ts
-import { getSystemScreencastInfo } from "rn-system-bar";
+import {
+  getSystemScreencastInfo,
+  onSystemScreencastChange,
+} from "rn-system-bar";
 
 const info = await getSystemScreencastInfo();
 // {
-//   isCasting:   true,
-//   displayName: "Living Room TV",
-//   displays: [{ id: 1, name: "Living Room TV", isValid: true }]
+//   isCasting: boolean,
+//   displayName: string | null,
+//   displays: Array<{ id: number, name: string, isValid: boolean }>,
 // }
-```
-
-### `onSystemScreencastChange(callback)` → unsubscribe
-
-```ts
-import { onSystemScreencastChange } from "rn-system-bar";
 
 const unsub = onSystemScreencastChange((info) => {
-  if (info.isCasting) {
-    console.log("Now casting to:", info.displayName);
-  } else {
-    console.log("Casting stopped");
-  }
+  console.log("Casting:", info.isCasting, info.displayName);
 });
-
-// Stop listening
 unsub();
 ```
 
-### `useSystemScreencast()` hook
-
-```tsx
-import { useSystemScreencast } from "rn-system-bar";
-
-const { isCasting, displayName, displays } = useSystemScreencast();
-
-return <Text>{isCasting ? `Casting to ${displayName}` : "Not casting"}</Text>;
-```
-
 ---
 
-## 📲 App-Only Cast (Android)
-
-Cast **only this app's screen** to a nearby TV or Chromecast — the whole system is not mirrored. Uses Android `MediaRouter` internally, no Google Play Services required.
-
-> **iOS:** AirPlay is fully system-managed on iOS. Apple provides no public API for app-only casting. All `AppCast` functions are safe to call on iOS — they are no-ops that return idle state immediately.
-
-### State machine
-
-```
-idle → scanning → connecting → connected → disconnecting → idle
-                     ↕ error at any point
-```
-
-### `useAppCast()` hook — recommended
-
-The easiest way to manage casting. Handles initial state fetch, event subscription, and auto-stops the scan on unmount (battery-safe).
-
-```tsx
-import { useAppCast } from "rn-system-bar";
-
-export default function CastScreen() {
-  const {
-    state, // "idle" | "scanning" | "connecting" | "connected" | "disconnecting"
-    devices, // AppCastDevice[] — found nearby devices
-    connectedDevice, // AppCastDevice | null — currently active
-    error, // string | null — last error message
-    scan, // () => void — start discovery
-    stopScan, // () => void — stop discovery
-    connect, // (deviceId: string, pin?: string) => void
-    disconnect, // () => void
-  } = useAppCast();
-
-  return (
-    <View>
-      {state === "idle" && <Button title="Find TVs" onPress={scan} />}
-
-      {state === "scanning" && (
-        <>
-          <Text>Scanning…</Text>
-          <Button title="Stop" onPress={stopScan} />
-        </>
-      )}
-
-      {devices.map((device) => (
-        <View key={device.id}>
-          <Text>{device.name}</Text>
-          {device.description && <Text>{device.description}</Text>}
-          <Button
-            title={`Cast to ${device.name}`}
-            onPress={() => connect(device.id)}
-          />
-        </View>
-      ))}
-
-      {state === "connecting" && (
-        <Text>Connecting to {connectedDevice?.name}…</Text>
-      )}
-
-      {state === "connected" && (
-        <>
-          <Text>Casting to {connectedDevice?.name}</Text>
-          <Button title="Stop Casting" onPress={disconnect} />
-        </>
-      )}
-
-      {error && <Text style={{ color: "red" }}>Error: {error}</Text>}
-    </View>
-  );
-}
-```
-
-### With pairing PIN
-
-```tsx
-const { devices, connect } = useAppCast();
-
-// If requiresPairing is true, pass the PIN as the second argument
-connect(device.id, "1234");
-```
-
-### Imperative API (without hook)
+### Font Scale
 
 ```ts
-import {
-  startAppCastScan,
-  stopAppCastScan,
-  connectAppCast,
-  disconnectAppCast,
-  getAppCastInfo,
-  onAppCastChange,
-} from "rn-system-bar";
-
-// Subscribe first
-const unsub = onAppCastChange((info) => {
-  console.log("Cast state:", info.state);
-  console.log("Devices:", info.devices);
-  if (info.state === "connected") {
-    console.log("Casting to:", info.connectedDevice?.name);
-  }
-  if (info.error) console.warn("Error:", info.error);
-});
-
-// Start scan
-startAppCastScan();
-
-// Connect when a device appears
-connectAppCast("device_route_id_123");
-// With pairing PIN
-connectAppCast("device_route_id_123", "9876");
+import { getFontScaleInfo, onFontScaleChange } from "rn-system-bar";
 
-// Stop casting
-disconnectAppCast();
-
-// Stop scanning
-stopAppCastScan();
-
-// Get current state without subscribing
-const info = await getAppCastInfo();
+const info = await getFontScaleInfo();
+// {
+//   fontScale: number,   // 1.0 = default; larger = user has increased text size
+//   density: number,     // screen pixel density
+// }
 
-// Clean up
+const unsub = onFontScaleChange((info) => {
+  console.log("Font scale changed:", info.fontScale);
+});
 unsub();
 ```
 
 ---
 
-## 🪝 `useSystemBar()` hook
+## React Hooks
 
-Apply multiple system bar settings declaratively in one call. Re-applies only when the config object actually changes (deep comparison via JSON).
+### `useSystemBar` — declarative config
 
-```tsx
+```ts
 import { useSystemBar } from "rn-system-bar";
 
 useSystemBar({
-  // Navigation bar (Android-only — safe to include on iOS)
   navigationBarColor: "transparent",
-  navigationBarVisibility: "visible",
   navigationBarButtonStyle: "light",
-  navigationBarStyle: "dark",
-  navigationBarBehavior: "overlay-swipe",
-
-  // Status bar
-  statusBarColor: "transparent", // Android only
   statusBarStyle: "light",
-  statusBarVisible: true,
-
-  // Screen
   keepScreenOn: true,
-  immersiveMode: false, // Android only
-  secureScreen: false, // Android only
   brightness: 0.8,
   orientation: "portrait",
 });
 ```
 
-All fields are optional. Only the ones you pass will be applied.
+### `useThemeSystemBar` — theme-aware config
 
----
+```ts
+import { useThemeSystemBar } from "rn-system-bar";
+
+const { isDark, mode, setMode } = useThemeSystemBar({
+  dark: { navigationBarColor: "#000000", statusBarStyle: "light" },
+  light: { navigationBarColor: "#ffffff", statusBarStyle: "dark" },
+  base: { keepScreenOn: true },
+});
+```
 
-## 📱 Platform Support Matrix
-
-| Feature                       | Android |  iOS  |
-| ----------------------------- | :-----: | :---: |
-| `setNavigationBarColor`       |   ✅    |  ❌   |
-| `setNavigationBarVisibility`  |   ✅    |  ❌   |
-| `setNavigationBarButtonStyle` |   ✅    |  ❌   |
-| `setNavigationBarStyle`       |   ✅    |  ❌   |
-| `setNavigationBarBehavior`    |   ✅    |  ❌   |
-| `setStatusBarColor`           |   ✅    |  ❌   |
-| `setStatusBarStyle`           |   ✅    |  ✅   |
-| `setStatusBarVisibility`      |   ✅    |  ✅   |
-| `setBrightness`               |   ✅    |  ✅   |
-| `getBrightness`               |   ✅    |  ✅   |
-| `onBrightnessChange`          |   ✅    |  ✅   |
-| `setVolume`                   |   ✅    | ❌ \* |
-| `getVolume`                   |   ✅    |  ✅   |
-| `setVolumeHUDVisible`         |   ✅    |  ❌   |
-| `onVolumeChange`              |   ✅    |  ❌   |
-| `keepScreenOn`                |   ✅    |  ✅   |
-| `immersiveMode`               |   ✅    |  ❌   |
-| `setSecureScreen`             |   ✅    |  ❌   |
-| `setOrientation`              |   ✅    |  ✅   |
-| `getSystemScreencastInfo`     |   ✅    |  ✅   |
-| `onSystemScreencastChange`    |   ✅    |  ✅   |
-| `useSystemScreencast`         |   ✅    |  ✅   |
-| `startAppCastScan`            |   ✅    | ❌ †  |
-| `connectAppCast`              |   ✅    | ❌ †  |
-| `disconnectAppCast`           |   ✅    | ❌ †  |
-| `useAppCast`                  |   ✅    | ❌ †  |
-| `useTheme`                    |   ✅    |  ✅   |
-| `useThemeSystemBar`           |   ✅    |  ✅   |
-| `useSystemBar`                |   ✅    |  ✅   |
-
-> \* `setVolume` is a no-op on iOS — Apple does not allow apps to set system volume.
-> † App-only cast APIs are no-ops on iOS — AirPlay is system-managed with no public API.
+### `useSystemScreencast`
 
----
+```ts
+import { useSystemScreencast } from "rn-system-bar";
 
-## 📐 Full Type Reference
+const { isCasting, displayName, displays } = useSystemScreencast();
+```
+
+### `useTheme`
 
 ```ts
-// Theme
-type ThemeMode = "system" | "dark" | "light";
-
-interface ThemeState {
-  isDark: boolean;
-  mode: ThemeMode;
-  setMode: (mode: ThemeMode) => void;
-}
-
-// Navigation bar
-type NavigationBarColorValue = string | "transparent" | "translucent";
-type NavigationBarBehavior = "overlay-swipe" | "inset-swipe" | "inset-touch";
-type NavigationBarButtonStyle = "light" | "dark";
-type NavigationBarStyle = "auto" | "inverted" | "light" | "dark";
-type NavigationBarVisibility = "visible" | "hidden";
-
-// Status bar
-type StatusBarColorValue = string | "transparent" | "translucent";
-type StatusBarStyle = "light" | "dark";
-
-// Orientation
-type Orientation =
-  | "portrait"
-  | "landscape"
-  | "landscape-left"
-  | "landscape-right"
-  | "auto";
-
-// Volume
-type VolumeStream = "music" | "ring" | "notification" | "alarm" | "system";
-
-// System screencast
-interface ScreencastDisplay {
-  id: number;
-  name: string;
-  isValid: boolean;
-}
-interface SystemScreencastInfo {
-  isCasting: boolean;
-  displayName: string | null;
-  displays: ScreencastDisplay[];
-}
-
-// App-only cast
-type AppCastState =
-  | "idle"
-  | "scanning"
-  | "connecting"
-  | "connected"
-  | "disconnecting";
-
-interface AppCastDevice {
-  id: string;
-  name: string;
-  description: string | null;
-  signalStrength: number | null; // 0–100 or null
-  requiresPairing: boolean;
-}
-
-interface AppCastInfo {
-  state: AppCastState;
-  devices: AppCastDevice[];
-  connectedDevice: AppCastDevice | null;
-  error: string | null;
-}
+import { useTheme } from "rn-system-bar";
+
+const { isDark, mode, setMode } = useTheme();
+setMode("dark"); // "dark" | "light" | "system"
 ```
 
 ---
 
-## 🆕 New Architecture (TurboModules)
-
-Add to your `react-native.config.js`:
-
-```js
-module.exports = {
-  dependencies: {
-    "rn-system-bar": {
-      platforms: {
-        android: {
-          packageImportPath: "import com.systembar.SystemBarPackage;",
-        },
-      },
-    },
-  },
-};
-```
+## Permissions
 
-The `specs/NativeSystemBar.ts` file is pre-configured for codegen.
+### Android
 
----
+Add to `AndroidManifest.xml` if you need to write system brightness:
+
+```xml
+<uses-permission
+  android:name="android.permission.WRITE_SETTINGS"
+  tools:ignore="ProtectedPermissions" />
+```
+
+### iOS
 
-## 📋 Changelog
+No additional permissions required. Note:
 
-### v3.2 (current)
+- `setVolume` is a no-op on iOS (AVAudioSession restriction).
+- `setSecureScreen` / `immersiveMode` are no-ops on iOS.
+- `isAirplaneMode`, `ssid`, and `cellularGeneration` in `NetworkInfo` are always `false` / `null` on iOS.
 
-- **New:** `setNavigationBarColor("transparent" | "translucent")` — edge-to-edge and frosted-glass nav bar
-- **New:** `setStatusBarColor("transparent" | "translucent")` — same for status bar
-- **New:** `useTheme()` — reactive OS dark/light mode with manual override (`"system"` | `"dark"` | `"light"`)
-- **New:** `setGlobalThemeMode()` — imperative theme setter, usable outside components
-- **New:** `useThemeSystemBar()` — auto-applies themed bar config on every theme change
-- **New:** `getSystemScreencastInfo()` / `onSystemScreencastChange()` / `useSystemScreencast()` — OS-level external display detection
-- **New:** `startAppCastScan()` / `connectAppCast()` / `disconnectAppCast()` / `useAppCast()` — in-app MediaRouter casting to TV/Chromecast (Android)
-- **Deprecated:** `getScreencastInfo()` → use `getSystemScreencastInfo()`
-- **Deprecated:** `onScreencastChange()` → use `onSystemScreencastChange()`
-- **Deprecated:** `useScreencast()` → use `useSystemScreencast()`
+---
 
-### v3.1
+## License
 
-- Removed `expo-navigation-bar` dependency — all navigation bar APIs now go directly to native Kotlin/Swift
-- Added `onBrightnessChange()` realtime listener
-- Added `onVolumeChange()` realtime listener
-- Added `setSecureScreen()` for screenshot blocking
+MIT