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

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

Installation

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.

Components

RedactoNoticeConsent

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

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.

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:

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