npm package: @redacto.io/consent-sdk-react-native
Description: React Native SDK for integrating Redacto consent notices in mobile apps.
Latest version: 1.0.0

# @redacto.io/consent-sdk-react-native

React Native SDK for Redacto consent management. Port of [`@redacto.io/consent-sdk-react`](../consent-sdk-react) with the same API surface.

## Installation

```sh
pnpm add @redacto.io/consent-sdk-react-native react-native-svg
# Optional – required for TTS audio playback
pnpm add expo-av
```

> **Note:** `react-native-svg` must be linked for native builds. Follow the [react-native-svg setup guide](https://github.com/software-mansion/react-native-svg#installation).

## Components

### `RedactoNoticeConsent`

Modal consent component. Supports initial consent, reconsent, age verification, guardian form, and TTS playback.

```tsx
import { RedactoNoticeConsent } from "@redacto.io/consent-sdk-react-native";

<RedactoNoticeConsent
  noticeId="your-notice-uuid"
  accessToken={accessToken}
  refreshToken={refreshToken}
  onAccept={() => navigation.navigate("Dashboard")}
  onDecline={() => console.log("declined")}
/>
```

#### Props

| Prop | Type | Required | Description |
|------|------|----------|-------------|
| `noticeId` | `string` | ✓ | UUID of the consent notice |
| `accessToken` | `string` | ✓ | JWT access token |
| `refreshToken` | `string` | ✓ | JWT refresh token |
| `baseUrl` | `string` | | Override API base URL |
| `settings` | `Partial<Settings>` | | UI customisation (colours, border radius, fonts) |
| `language` | `string` | | Initial language code (e.g. `"en"`) |
| `blockUI` | `boolean` | | Block the modal from being dismissed |
| `applicationId` | `string` | | Application-specific UUID |
| `validateAgainst` | `"all" \| "required"` | | Validation mode |
| `includeFullyConsentedData` | `boolean` | | Include already-consented items |
| `reviewModeButtonText` | `string` | | CTA text in review mode |
| `onAccept` | `() => void` | ✓ | Called on successful consent |
| `onDecline` | `() => void` | ✓ | Called when user declines |
| `onError` | `(error: Error) => void` | | Called on API errors |

---

### `RedactoNoticeConsentInline`

Inline consent component. Auto-submits when all required elements are checked and an access token is available.

```tsx
import { RedactoNoticeConsentInline } from "@redacto.io/consent-sdk-react-native";

<RedactoNoticeConsentInline
  org_uuid="org-uuid"
  workspace_uuid="workspace-uuid"
  notice_uuid="notice-uuid"
  accessToken={accessToken}
  onAccept={() => console.log("accepted")}
  onValidationChange={(isValid) => setCanProceed(isValid)}
/>
```

#### Props

| Prop | Type | Required | Description |
|------|------|----------|-------------|
| `org_uuid` | `string` | ✓ | Organisation UUID |
| `workspace_uuid` | `string` | ✓ | Workspace UUID |
| `notice_uuid` | `string` | ✓ | Notice UUID |
| `accessToken` | `string` | | JWT access token (triggers auto-submit when set) |
| `baseUrl` | `string` | | Override API base URL |
| `language` | `string` | | Language code |
| `settings` | `Partial<Settings>` | | UI customisation |
| `applicationId` | `string` | | Application-specific UUID |
| `onAccept` | `() => void` | | Called on successful consent |
| `onDecline` | `() => void` | | Called when user declines |
| `onError` | `(error: Error) => void` | | Called on errors |
| `onValidationChange` | `(isValid: boolean) => void` | | Fires when validation state changes |

## TTS Audio

If `expo-av` is installed, TTS playback is automatically enabled. Install it and configure audio mode in your app entry point:

```ts
import { Audio } from "expo-av";
await Audio.setAudioModeAsync({ playsInSilentModeIOS: true });
```

## Configuration and env best practices

- The SDK is runtime-configured via props and does not read from `.env` directly.
- Keep API keys and server secrets on your backend only.
- In Expo apps, values read from `EXPO_PUBLIC_*` are bundled into the app and should only contain non-sensitive config like UUIDs and URLs.
- If you do not pass `baseUrl`, the SDK defaults to `https://api.redacto.io/consent` for both modal and inline components.

## License

Apache-2.0