# Hooks & Customization

## Hooks

```tsx
import {
  useAgentKit,         // Full context access
  useAgentKitElement,  // Manually register an element
  useAgentKitRescan,   // Trigger a re-scan
  useAgentKitStatus,   // Monitor bridge status
} from 'react-native-agentkit';
```

## Manual Element Registration

For custom components that aren't auto-discovered:

```tsx
function CustomButton({ onPress, label }) {
  const ref = useRef(null);

  useAgentKitElement(
    'my-btn',
    {
      type: 'button',
      label,
      state: { disabled: false, selected: false },
      position: { x: 0, y: 0, width: 0, height: 0 },
      children: [],
      actions: ['tap'],
    },
    ref,
    { onPress }
  );

  return (
    <Pressable ref={ref} onPress={onPress}>
      <Text>{label}</Text>
    </Pressable>
  );
}
```

## Element Discovery

Elements are discovered via:

1. **`testID` prop** — Always included, highest priority
2. **Accessibility props** — `accessibilityLabel`, `accessibilityRole`
3. **Interactive handlers** — `onPress`, `onChangeText`, `onValueChange`
4. **Component type** — Pressable, TextInput, Switch, ScrollView, etc.

> 💡 **Tip**: Use `testID` on key elements for reliable AI agent targeting.

## Props

| Prop                    | Type      | Default     | Description                              |
| ----------------------- | --------- | ----------- | ---------------------------------------- |
| `port`                  | `number`  | `8347`      | Server port                              |
| `debug`                 | `boolean` | `false`     | Enable debug logging                     |
| `scanInterval`          | `number`  | `1000`      | Element scan interval (ms)               |
| `includeNonInteractive` | `boolean` | `false`     | Include non-interactive elements         |
| `includeScreenState`    | `boolean` | `true`      | Include screen state in responses        |
| `enabled`               | `boolean` | `true`      | Enable/disable the bridge                |
| `relayUrl`              | `string`  | —           | Cloud relay WebSocket URL for production |
| `channelId`             | `string`  | `"default"` | Channel ID for relay pairing             |
| `channelSecret`         | `string`  | —           | Shared secret for relay authentication   |