React Native

npm install @swake/rn-swake-sdk lucide-react-native react-native-svg
# or
yarn add @swake/rn-swake-sdk lucide-react-native react-native-svg
# or
pnpm add @swake/rn-swake-sdk lucide-react-native react-native-svg

import Swake, { SwakeProvider } from '@swake/react-native';

// 1. Initialise before any component renders
Swake.init({
  apiKey: 'ep_live_your_key_here',
});

export default function App() {
  return (
    // 2. Wrap your app so modals and overlays can render
    <SwakeProvider>
      <NavigationContainer>
        <RootNavigator />
      </NavigationContainer>
    </SwakeProvider>
  );
}

Swake.init({
  apiKey: 'ep_live_your_key_here',
  baseUrl: 'https://api.swake.io',       // custom API endpoint
  debug: false,                          // verbose logging
  appVersion: '2.1.0',                   // auto-detected if omitted

  // Shake gesture
  shakeToReport: true,
  shakeThreshold: 2.5,                  // g-force
  shakeCooldown: 10000,                 // ms between prompts

  // Floating trigger button
  trigger: { /* see Trigger Button section */ },

  // Surveys
  surveys: { /* see Surveys & NPS section */ },

  // Breadcrumbs
  breadcrumbs: { /* see Breadcrumbs section */ },

  // Global theme
  theme: { /* see Theme Customization section */ },
});

import Swake from '@swake/react-native';

async function onLoginSuccess(user: User) {
  await Swake.identify({
    userId: user.id,              // required — your internal user ID
    email: user.email,            // optional but recommended
    name: user.name,              // optional
    metadata: {                   // optional — custom traits
      plan: 'pro',
      company: 'Acme Corp',
    },
  });
}

function onLogout() {
  Swake.clearIdentity();
}

// Open with defaults
Swake.showFeedbackForm();

// Open with options
Swake.showFeedbackForm({
  defaultType: 'feature',         // pre-select a type
  showTypeSelector: true,         // show bug / idea / help tabs
  title: "What's on your mind?",  // header text
  placeholder: 'Tell us more...', // description placeholder
  theme: { primaryColor: '#0EA5E9' },  // per-call theme override
});

// Opens the feedback form (equivalent to showFeedbackForm)
Swake.open();

// Opens the bug reporter instead
Swake.open('bug');

// Open the bug reporter
Swake.showBugReporter();

// With a theme override
Swake.showBugReporter({
  theme: { primaryColor: '#EF4444' },
});

// Enabled by default in init:
Swake.init({
  apiKey: '...',
  shakeToReport: true,   // default
  shakeThreshold: 2.5,   // g-force sensitivity
  shakeCooldown: 10000,   // ms between prompts
});

// Toggle at runtime
Swake.setShakeToReport(false); // disable temporarily

import Swake from '@swake/react-native';

const submission = await Swake.submitFeedback({
  type: 'bug',           // 'bug' | 'feature' | 'question'
  title: 'Checkout button unresponsive',
  description: 'Tapping the checkout button on iOS 17 does nothing.',
  attachments: [         // optional — max 5 files
    { uri: photo.uri, filename: 'screenshot.png', mimeType: 'image/png' },
  ],
});

console.log('Created:', submission.id);

Swake.init({
  apiKey: '...',
  trigger: {
    position: 'bottom-right',   // 'bottom-left' | 'top-right' | 'top-left'
    icon: 'chat',               // 'feedback' | 'bug' | 'idea' | { uri: '...' }
    label: 'Feedback',          // optional — makes it an extended FAB
    hidden: false,              // start hidden, show later
    topOffset: 0,               // additional spacing from top (when position is 'top-*')
    bottomOffset: 0,            // additional spacing from bottom (when position is 'bottom-*')
    style: {
      backgroundColor: '#6366F1',
      size: 56,                 // diameter in dp
      borderRadius: 28,         // half of size = circle
      shadow: true,
    },
  },
});

// Show / hide at runtime
Swake.setTriggerVisible(false);
Swake.setTriggerVisible(true);

// Example: FAB positioned above React Navigation bottom tabs
Swake.init({
  apiKey: '...',
  trigger: {
    position: 'bottom-right',
    bottomOffset: 60,  // tab bar height + some padding
  },
});

// Example: FAB below a custom top header
Swake.init({
  apiKey: '...',
  trigger: {
    position: 'top-right',
    topOffset: 50,  // header height
  },
});

Swake.init({
  apiKey: '...',
  surveys: {
    enabled: true,          // enable survey rendering (default: true)
    autoShow: true,         // show after identify() (default: true)
    delay: 3000,            // ms before presenting (default: 3000)
    cooldown: 86_400_000,   // min ms between surveys (default: 24h)
  },
});

// Re-check eligibility and show if a survey matches
await Swake.checkSurveys();

// Force-show a specific survey by ID (bypasses cooldown)
await Swake.showSurvey('surv_01HW...');

Swake.onSurveyShown(({ id, type }) => {
  console.log('Survey shown:', type, id);
});

Swake.onSurveyCompleted(({ survey, response }) => {
  console.log('Completed', survey.type, response.answers.length, 'answers');
});

Swake.onSurveyDismissed(({ id }) => {
  console.log('Dismissed:', id);
});

import { PollWidget } from '@swake/react-native';

<PollWidget
  surveyId="surv_01HW..."  // optional — auto-picks first eligible if omitted
  onVote={(index) => console.log('Voted option', index)}
  onDismiss={() => console.log('Poll dismissed')}
/>

// Open the native board UI (no WebView needed)
Swake.openVotingBoard('public-roadmap', {
  theme: { colorScheme: 'dark' },  // optional
});

// Fetch board items
const { items, hasMore } = await Swake.getBoardItems('public-roadmap', {
  sort: 'votes',   // 'votes' | 'recent'
  page: 1,
});

// Cast a vote (requires identify)
const result = await Swake.vote('public-roadmap', items[0].id);
// { status: 'voted', voteCount: 42 }

// Remove a vote
await Swake.removeVote('public-roadmap', items[0].id);

import Swake from '@swake/react-native';

// Badge count
const unread = await Swake.getUnreadCount();

// List notifications
const { notifications, pagination } = await Swake.listNotifications({
  unreadOnly: true,
  limit: 20,
});

// Mark as read
await Swake.markNotificationRead(notifications[0].id);
await Swake.markAllNotificationsRead();

// Register
await Swake.registerPushToken('apns', deviceToken);  // iOS
await Swake.registerPushToken('fcm', deviceToken);   // Android
await Swake.registerPushToken('expo', expoPushToken); // Expo

// Unregister on logout
await Swake.unregisterPushToken(deviceToken);

Swake.init({
  apiKey: '...',
  theme: {
    primaryColor: '#8B5CF6',
    successColor: '#10B981',
    dangerColor: '#EF4444',
    backgroundColor: '#FFFFFF',
    surfaceColor: '#F9FAFB',
    overlayColor: 'rgba(0,0,0,0.5)',
    textColor: '#111827',
    textSecondary: '#6B7280',
    borderColor: '#E5E7EB',
    borderRadius: 12,
    fontFamily: 'Inter',
    colorScheme: 'light',   // 'light' | 'dark' | 'system'
  },
});

Swake.showFeedbackForm({
  theme: { primaryColor: '#0EA5E9' },
});

Swake.openVotingBoard('roadmap', {
  theme: { colorScheme: 'dark' },
});

Swake.init({
  apiKey: '...',
  breadcrumbs: {
    enabled: true,              // default: true
    maxEntries: 50,             // ring buffer size (max: 100)
    captureNavigation: true,    // screen changes
    captureNetwork: true,       // HTTP requests
    captureConsole: true,       // console.error / console.warn
  },
});

import { useNavigationContainerRef } from '@react-navigation/native';
import Swake from '@swake/react-native';

function App() {
  const navRef = useNavigationContainerRef();

  return (
    <NavigationContainer
      ref={navRef}
      onStateChange={() => Swake.setNavigationRef(navRef)}
    >
      <RootNavigator />
    </NavigationContainer>
  );
}

// Add a custom breadcrumb
Swake.addBreadcrumb({
  category: 'custom',    // 'navigation' | 'network' | 'console' | 'custom'
  message: 'User tapped checkout',
  data: { cartTotal: 49.99 },
});

// Read current trail
const trail = Swake.getBreadcrumbs();

// Clear
Swake.clearBreadcrumbs();

import { offlineQueue } from '@swake/react-native';

// Check queue size
console.log('Pending items:', offlineQueue.size);

// Force flush (sends everything now)
await offlineQueue.flush();

// Clear all queued items
await offlineQueue.clear();

Fully integrate the Swake SDK (feedback infra: forms, bug reports, surveys, notifications, voting boards). Additive: a Swake/network error must NEVER break boot or existing behavior. Never guess or fake APIs.

1. FIRST read the docs (source of truth for package, peers, init/identify, provider, native setup). Fetch with a browser User-Agent (a plain fetch returns 403), e.g. curl -sL -A "Mozilla/5.0" "https://swake.io/docs/sdk?framework=react-native" (match the framework param). Then detect the stack; if no matching SDK exists, STOP and report.
2. ASK the user (AskUserQuestion tool) for API key (ep_live_...) + base/portal URL + board slug → env + .env.example (placeholders only). Then ASK to confirm which peers to install: required (lucide-react-native, react-native-svg) + optional per feature (async-storage, view-shot, shake, image-picker, webview). Install approved only.
3. Mount the provider once at the app root, above navigation.
4. Call init() once, idempotently. With onboarding, set surveys.autoShow:false + init lazily on the first main screen. Theme→your palette; re-init on dark toggle.
5. identify() with a stable ID + metadata; clearIdentity() on logout.
6. Route every call via one wrapper (try/catch + configured/initialized guard); feed breadcrumbs. Native: iOS usage strings + pods; strip Android ACTIVITY_RECOGNITION.
7. Verify on Android AND iOS release builds: a real submission hits the dashboard; no surveys over onboarding. Report changes, manual steps, assumptions.