feat: add React hooks for device state monitoring (#38)

* feat(hooks): add hooks directory structure and utilities

- Create src/hooks/ directory for React hooks
- Add barrel export file (index.ts) with all hook exports
- Add utils.ts with platform-specific low battery threshold
  - iOS: 20% threshold (matches iOS low power mode)
  - Android: 15% threshold (matches Android low battery warning)

* feat(hooks): implement battery monitoring hooks

Add React hooks for battery state monitoring:
- useBatteryLevel(): Returns battery level (0.0-1.0)
- useBatteryLevelIsLow(): Returns level when below threshold
- usePowerState(): Returns comprehensive power state object

All hooks use polling-based updates (5s interval for battery,
2s for low battery detection)

* feat(hooks): implement headphone detection hooks

Add React hooks for audio device detection:
- useIsHeadphonesConnected(): Any headphone connection
- useIsWiredHeadphonesConnected(): Wired headphone connection
- useIsBluetoothHeadphonesConnected(): Bluetooth audio connection

All hooks poll every 1s for connection state changes.

* feat(hooks): implement brightness monitoring hook

Add useBrightness() hook for screen brightness monitoring:
- iOS: Returns brightness level (0.0-1.0), polls every 500ms
- Android: Returns -1 (not supported on Android)

* feat(hooks): export all hooks from main entry point

Re-export all 7 React hooks from src/index.ts:
- useBatteryLevel, useBatteryLevelIsLow, usePowerState
- useIsHeadphonesConnected, useIsWiredHeadphonesConnected,
  useIsBluetoothHeadphonesConnected
- useBrightness

* feat(example): add HooksDemo screen to showcase app

Add interactive hooks demonstration screen:
- Battery section: level, charging state, low battery warning
- Audio Output section: headphone connection status
- Display section: brightness level (iOS only)
- Real-time timestamp tracking for value updates

Update App.tsx with tab navigation:
- Properties tab: existing DeviceInfoScreen
- Hooks Demo tab: new HooksDemo screen

* feat(example): add hooks performance benchmarks

Add hooks benchmark file with performance tests:
- Hook registration time
- Hook cleanup validation (1000 cycles, no memory leaks)
- Callback latency benchmark

Update BenchmarkScreen with:
- React Hooks Performance section
- Pass/fail badges for each benchmark
- Threshold vs actual value display

* docs: add React hooks documentation

Add comprehensive hooks documentation:
- docs/api/hooks.md: Complete API reference for all 7 hooks
  with signatures, return types, and platform support tables
- docs/guide/react-hooks.md: Usage guide with 5+ examples
  including battery monitoring, headphone detection, brightness
- docs/api/migration.md: Updated with hooks comparison table
  and migration examples from react-native-device-info

Update rspress.config.ts with navigation links:
- Add React Hooks to Guide nav and sidebar
- Add React Hooks to API Reference nav and sidebar

* chore: clear comments/docs

* chore: clear comments

* fix(showcase): use SafeAreaView, StatusBar.currentHeight

* fix: address PR review feedback

- useBrightness: skip polling on Android where brightness is unsupported
- HooksDemo: fix stale closure in useTimestampedValue with functional update
- useBatteryLevel: improve code pattern consistency with other hooks
- BenchmarkScreen: fix HTML entity rendering in threshold text

* docs: remove unnecessary section from hooks guide

* docs: more clearer

* feat: refactor

* docs: update docs

* chore: setState with functional pattern & update docs

Author: l2hyunwoo

docs/docs/api/hooks.md

@@ -0,0 +1,359 @@
+# React Hooks
+
+React hooks for monitoring runtime device properties. These hooks provide reactive access to device state, automatically re-rendering your components when values change.
+
+## Import
+
+```typescript
+import {
+  useBatteryLevel,
+  useBatteryLevelIsLow,
+  usePowerState,
+  useIsHeadphonesConnected,
+  useIsWiredHeadphonesConnected,
+  useIsBluetoothHeadphonesConnected,
+  useBrightness,
+} from 'react-native-nitro-device-info';
+```
+
+---
+
+## Battery Hooks
+
+### `useBatteryLevel()`
+
+Monitor battery level changes in real-time.
+
+```typescript
+function useBatteryLevel(): number | null
+```
+
+**Returns**: Battery level (0.0 to 1.0), or `null` during initial load.
+
+**Platform Support**:
+| Platform | Supported |
+|----------|-----------|
+| iOS | ✅ |
+| Android | ✅ |
+
+**Example**:
+
+```tsx
+import { useBatteryLevel } from 'react-native-nitro-device-info';
+
+function BatteryIndicator() {
+  const batteryLevel = useBatteryLevel();
+
+  if (batteryLevel === null) {
+    return <Text>Loading...</Text>;
+  }
+
+  return <Text>Battery: {Math.round(batteryLevel * 100)}%</Text>;
+}
+```
+
+---
+
+### `useBatteryLevelIsLow()`
+
+Monitor for low battery conditions with platform-specific thresholds.
+
+```typescript
+function useBatteryLevelIsLow(): number | null
+```
+
+**Returns**: Battery level when below threshold, or `null` if battery is not low.
+
+**Thresholds**:
+- **iOS**: 20% (matches iOS low power mode trigger)
+- **Android**: 15% (matches Android low battery warning)
+
+**Platform Support**:
+| Platform | Supported |
+|----------|-----------|
+| iOS | ✅ |
+| Android | ✅ |
+
+**Example**:
+
+```tsx
+import { useBatteryLevelIsLow } from 'react-native-nitro-device-info';
+
+function LowBatteryWarning() {
+  const lowBattery = useBatteryLevelIsLow();
+
+  if (lowBattery !== null) {
+    return (
+      <View style={styles.warning}>
+        <Text>Low Battery: {Math.round(lowBattery * 100)}%</Text>
+      </View>
+    );
+  }
+
+  return null;
+}
+```
+
+---
+
+### `usePowerState()`
+
+Monitor comprehensive power state including battery level, charging status, and low power mode.
+
+```typescript
+function usePowerState(): Partial<PowerState>
+```
+
+**Returns**: A `Partial<PowerState>` object. All properties are optional and may be `undefined` during initial load or if unavailable on the platform:
+- `batteryLevel?: number` - Battery charge level (0.0 to 1.0)
+- `batteryState?: BatteryState` - Charging status ('unknown', 'unplugged', 'charging', 'full')
+- `lowPowerMode?: boolean` - Whether low power mode is enabled (iOS only)
+
+**Platform Support**:
+| Platform | Supported | Notes |
+|----------|-----------|-------|
+| iOS | ✅ | Full support including lowPowerMode |
+| Android | ✅ | lowPowerMode always false |
+
+**Example**:
+
+```tsx
+import { usePowerState } from 'react-native-nitro-device-info';
+
+function PowerStatus() {
+  const powerState = usePowerState();
+
+  return (
+    <View>
+      <Text>Level: {Math.round((powerState.batteryLevel ?? 0) * 100)}%</Text>
+      <Text>Status: {powerState.batteryState ?? 'unknown'}</Text>
+      <Text>Low Power: {powerState.lowPowerMode ? 'Yes' : 'No'}</Text>
+    </View>
+  );
+}
+```
+
+---
+
+## Headphone Hooks
+
+### `useIsHeadphonesConnected()`
+
+Monitor headphone connection state (wired or Bluetooth).
+
+```typescript
+function useIsHeadphonesConnected(): boolean
+```
+
+**Returns**: `true` if any headphones are connected, `false` otherwise.
+
+**Platform Support**:
+| Platform | Supported |
+|----------|-----------|
+| iOS | ✅ |
+| Android | ✅ |
+
+**Example**:
+
+```tsx
+import { useIsHeadphonesConnected } from 'react-native-nitro-device-info';
+
+function AudioOutput() {
+  const headphonesConnected = useIsHeadphonesConnected();
+
+  return (
+    <Text>
+      Audio: {headphonesConnected ? 'Headphones' : 'Speaker'}
+    </Text>
+  );
+}
+```
+
+---
+
+### `useIsWiredHeadphonesConnected()`
+
+Monitor wired headphone connection state.
+
+```typescript
+function useIsWiredHeadphonesConnected(): boolean
+```
+
+**Returns**: `true` if wired headphones are connected, `false` otherwise.
+
+**Platform Support**:
+| Platform | Supported |
+|----------|-----------|
+| iOS | ✅ |
+| Android | ✅ |
+
+**Example**:
+
+```tsx
+import { useIsWiredHeadphonesConnected } from 'react-native-nitro-device-info';
+
+function WiredAudioStatus() {
+  const wiredConnected = useIsWiredHeadphonesConnected();
+
+  return (
+    <Icon
+      name={wiredConnected ? 'headphones' : 'headphones-off'}
+      color={wiredConnected ? 'green' : 'gray'}
+    />
+  );
+}
+```
+
+---
+
+### `useIsBluetoothHeadphonesConnected()`
+
+Monitor Bluetooth headphone/audio device connection state.
+
+```typescript
+function useIsBluetoothHeadphonesConnected(): boolean
+```
+
+**Returns**: `true` if Bluetooth audio devices are connected, `false` otherwise.
+
+**Platform Support**:
+| Platform | Supported |
+|----------|-----------|
+| iOS | ✅ |
+| Android | ✅ |
+
+**Example**:
+
+```tsx
+import { useIsBluetoothHeadphonesConnected } from 'react-native-nitro-device-info';
+
+function BluetoothAudioStatus() {
+  const bluetoothConnected = useIsBluetoothHeadphonesConnected();
+
+  return (
+    <Icon
+      name="bluetooth"
+      color={bluetoothConnected ? 'blue' : 'gray'}
+    />
+  );
+}
+```
+
+---
+
+## Display Hooks
+
+### `useBrightness()`
+
+Monitor screen brightness changes (iOS only).
+
+```typescript
+function useBrightness(): number | null
+```
+
+**Returns**:
+- **iOS**: Brightness level (0.0 to 1.0), or `null` during initial load
+- **Android**: `-1` (not supported)
+
+**Platform Support**:
+| Platform | Supported | Notes |
+|----------|-----------|-------|
+| iOS | ✅ | Real-time brightness monitoring |
+| Android | ❌ | Returns -1 |
+
+**Example**:
+
+```tsx
+import { useBrightness } from 'react-native-nitro-device-info';
+import { Platform } from 'react-native';
+
+function BrightnessIndicator() {
+  const brightness = useBrightness();
+
+  if (Platform.OS === 'android') {
+    return <Text>Brightness monitoring is iOS only</Text>;
+  }
+
+  if (brightness === null) {
+    return <Text>Loading...</Text>;
+  }
+
+  return <Text>Brightness: {Math.round(brightness * 100)}%</Text>;
+}
+```
+
+---
+
+## Platform Support Summary
+
+| Hook | iOS | Android |
+|------|-----|---------|
+| `useBatteryLevel` | ✅ | ✅ |
+| `useBatteryLevelIsLow` | ✅ | ✅ |
+| `usePowerState` | ✅ | ✅ |
+| `useIsHeadphonesConnected` | ✅ | ✅ |
+| `useIsWiredHeadphonesConnected` | ✅ | ✅ |
+| `useIsBluetoothHeadphonesConnected` | ✅ | ✅ |
+| `useBrightness` | ✅ | ❌ (-1) |
+
+---
+
+## Best Practices
+
+### Handle Loading States
+
+```tsx
+const batteryLevel = useBatteryLevel();
+
+if (batteryLevel === null) {
+  return <LoadingSpinner />;
+}
+```
+
+### Memoize Dependent Components
+
+```tsx
+const BatteryIcon = React.memo(({ level }: { level: number }) => {
+  return <Icon name={getBatteryIcon(level)} />;
+});
+
+function Parent() {
+  const level = useBatteryLevel();
+  return level !== null && <BatteryIcon level={level} />;
+}
+```
+
+### Platform-Specific Handling
+
+```tsx
+import { Platform } from 'react-native';
+
+function BrightnessControl() {
+  const brightness = useBrightness();
+
+  if (Platform.OS === 'android') {
+    return null; // Not supported on Android
+  }
+
+  return <BrightnessSlider value={brightness} />;
+}
+```
+
+---
+
+## Migration from react-native-device-info
+
+These hooks are designed to be drop-in replacements:
+
+```tsx
+// Before (react-native-device-info)
+import { useBatteryLevel } from 'react-native-device-info';
+
+// After (react-native-nitro-device-info)
+import { useBatteryLevel } from 'react-native-nitro-device-info';
+
+// Usage remains identical
+const batteryLevel = useBatteryLevel();
+```
+
+See the [Migration Guide](/api/migration) for more details.