Ovok Mobile SDK Documentation

Welcome to the Ovok Mobile SDK documentation! This comprehensive React Native SDK provides healthcare-focused components and utilities for building modern mobile applications.

Overview

The Ovok Mobile SDK is designed specifically for healthcare and medical applications, offering:

• Pre-built Components: Ready-to-use UI components following healthcare design patterns
• Authentication System: Secure sign-in with email/password and social providers
• Theme Integration: Consistent design system with Material Design 3
• TypeScript Support: Full type safety throughout the SDK

Quick Start

Creating a new project

Before using the SDK, you'll need to create an Ovok account and set up a project at register.ovok.com.

Obtaining Your Tenant Code

To get your organization's tenant code, use the Ovok API to receive organization codes via email:

curl -X POST https://api.ovok.com/organizations/code/email \
  -H "Content-Type: application/json" \
  -d '{"email": "your-email@example.com"}'

For detailed API documentation, refer to the Ovok API Reference.

Installation

To get started with the Ovok Mobile SDK, follow our comprehensive Installation & Setup Guide which covers:

• SDK installation
• Required dependencies
• Platform-specific configurations
• Complete setup examples

Basic Usage

Once you've completed the installation, wrap your app with the theme provider:

import React from "react";
import { Provider } from "@ovok/mobile";

export default function App() {
  return <Provider>{/* Your app content */}</Provider>;
}

Your First Component

Create a complete sign-in screen with theme integration:

import React from "react";
import { StyleSheet } from "react-native";
import { SignIn } from "@ovok/mobile";
import { useTranslation, useAppTheme } from "@ovok/mobile";

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
  },
});

export const LoginScreen = () => {
  const { t } = useTranslation();
  const theme = useAppTheme();

  return (
    <SignIn
      style={[
        styles.container,
        {
          backgroundColor: theme.colors.background,
          padding: theme.spacing(3),
        },
      ]}
    >
      <SignIn.Header>
        <SignIn.Header.Title>{t("auth.signIn.welcome")}</SignIn.Header.Title>
        <SignIn.Header.Description>
          {t("auth.signIn.description")}
        </SignIn.Header.Description>
      </SignIn.Header>

      <SignIn.EmailForm
        loginType="Patient"
        onSuccess={(response) => {
          console.log("Login successful:", response);
        }}
        onError={(error) => {
          console.error("Login failed:", error);
        }}
      />
    </SignIn>
  );
};

Key Features

• Security First: Secure authentication flows with industry-standard practices
• Design System: Material Design 3 components with consistent theming
• Cross-Platform: Native iOS and Android support
• TypeScript: Full type safety throughout the SDK
• Accessibility: Built-in accessibility features and screen reader support
• Localization: Multi-language support with translation keys
• Theme Integration: Customizable themes using useAppTheme hook

Components List

Authentication

• Sign-In - Complete authentication system with email/password and social login support
• Logout Button - Secure logout functionality with confirmation

Getting Help

• Component Documentation: Detailed API reference and examples for each component
• Code Examples: Complete, runnable examples showing real-world usage
• Troubleshooting: Common issues and solutions

Next Steps

Ready to get started? Follow these steps:

1. Installation & Setup - Complete installation guide with all dependencies
2. Authentication Components - Complete authentication flows
3. Sign-In Component - Email/password and social login