@onairos/react-native 3.1.14 → 3.1.16

package/README.md

@@ -1,404 +0,0 @@
-# Onairos React Native SDK
-
-A React Native SDK for integrating Onairos authentication and AI model training into your mobile applications. This package provides a complete solution for social media platform connection, secure authentication, and AI model training.
-
-## Features
-
-- Universal onboarding flow with multi-platform support
-- Multi-platform OAuth authentication (Pinterest, YouTube, LinkedIn, Gmail, Reddit)
-- Real-time AI model training with Socket.io integration
-- Secure credential management with biometric authentication
-- PIN-based security with validation and encryption
-- Deep linking support for OAuth callbacks
-- Email verification and account management
-- Existing user detection and data confirmation
-- Background training optimization
-- Comprehensive error handling and retry logic
-- Haptic feedback integration
-- Customizable UI components
-- Full TypeScript support
-
-## Installation
-
-```bash
-npm install @onairos/react-native
-# or
-yarn add @onairos/react-native
-```
-
-### TypeScript Support
-
-The package includes full TypeScript declarations. Import types directly:
-
-```typescript
-import { OnairosButton, OnairosCredentials, PlatformConfig } from '@onairos/react-native';
-
-// Type your component props
-const MyComponent: React.FC<{ credentials: OnairosCredentials }> = ({ credentials }) => {
-  // Your component code
-};
-
-// Type your handlers
-const handleResolved = (apiUrl: string, accessToken: string, loginDetails: any) => {
-  console.log('Authentication successful:', { apiUrl, accessToken, loginDetails });
-};
-```
-
-### Required Dependencies
-
-The package requires the following dependencies:
-
-```bash
-# Core dependencies
-yarn add @gorhom/bottom-sheet react-native-reanimated react-native-gesture-handler react-native-safe-area-context
-
-# Authentication dependencies
-yarn add react-native-webview react-native-keychain 
-
-# UI dependencies
-yarn add react-native-vector-icons
-
-# Network and encryption
-yarn add @react-native-community/netinfo react-native-rsa-native react-native-crypto-js
-```
-
-### iOS Setup
-
-1. Install pods:
-```bash
-cd ios && pod install
-```
-
-2. Add the following to your `Info.plist`:
-```xml
-<key>CFBundleURLTypes</key>
-<array>
-  <dict>
-    <key>CFBundleURLSchemes</key>
-    <array>
-      <!-- <string>onairosreact</string> -->
-      <string>onairosanime</string>
-    </array>
-  </dict>
-</array>
-
-<!-- Add for biometric authentication -->
-<key>NSFaceIDUsageDescription</key>
-<string>We use Face ID to securely access your Onairos account</string>
-```
-
-3. Configure your OAuth providers in the project settings and register the callback URLs.
-
-### Android Setup
-
-1. Add the following to your `android/app/src/main/AndroidManifest.xml`:
-```xml
-<activity>
-  <!-- ... -->
-  <intent-filter>
-    <action android:name="android.intent.action.VIEW" />
-    <category android:name="android.intent.category.DEFAULT" />
-    <category android:name="android.intent.category.BROWSABLE" />
-    <!-- <data android:scheme="onairosreact" /> -->
-    <data android:scheme="onairosanime" />
-  </intent-filter>
-</activity>
-```
-
-2. Add biometric permissions:
-```xml
-<uses-permission android:name="android.permission.USE_BIOMETRIC" />
-```
-
-## Usage
-
-📖 **[Quick Integration Guide](./QUICK_INTEGRATION_GUIDE.md) - Start here for immediate copy-paste setup!**
-
-📖 **For comprehensive usage examples in both JavaScript and TypeScript, see [USAGE_EXAMPLES.md](./USAGE_EXAMPLES.md)**
-
-### Important: Setup Portal Host
-
-For modals and overlays to appear properly, you must wrap your app with the `PortalHost` component:
-
-```javascript
-import { PortalHost } from '@onairos/react-native';
-
-export default function App() {
-  return (
-    <PortalHost>
-      {/* Your app content goes here */}
-      <MainNavigator />
-    </PortalHost>
-  );
-}
-```
-
-### Basic Button Integration
-
-1. Import the OnairosButton component:
-```javascript
-import { OnairosButton } from '@onairos/react-native';
-```
-
-2. Use the component in your app:
-```javascript
-export default function App() {
-  const handleResolved = (apiUrl, accessToken, loginDetails) => {
-    console.log('Authentication successful:', { apiUrl, accessToken, loginDetails });
-    // Store the tokens and proceed with your app logic
-  };
-
-  return (
-    <View style={styles.container}>
-      <OnairosButton
-        AppName="YourApp"
-        requestData={{
-          "Social Media": {
-            "Profile Information": "Access to your basic profile data",
-            "Post History": "Access to your post history for analysis"
-          },
-          "Content": {
-            "Images": "Access to image data for AI training",
-            "Text": "Access to text data for AI training"
-          }
-        }}
-        returnLink="your-app://auth-callback"
-        onResolved={handleResolved}
-        buttonType="pill"
-        color="#00BFA5"
-      />
-    </View>
-  );
-}
-```
-
-### Initialize OAuth Service
-
-Add this to your app's entry point to handle deep linking for OAuth:
-
-```javascript
-import { initializeOAuthService } from '@onairos/react-native';
-
-// In your app's entry point
-useEffect(() => {
-  // Set up OAuth deep linking
-  initializeOAuthService();
-  
-  // Clean up when component unmounts
-  return () => {
-    cleanupOAuthService();
-  };
-}, []);
-```
-
-### Working with Secure Storage
-
-```javascript
-import { storeCredentials, getCredentials, hasCredentials } from '@onairos/react-native';
-
-// Check if user has stored credentials
-const checkAuth = async () => {
-  const hasExisting = await hasCredentials();
-  
-  if (hasExisting) {
-    // Get credentials with biometric authentication
-    const credentials = await getCredentials({
-      useBiometrics: true,
-      biometricPrompt: {
-        title: 'Authenticate to continue',
-        subtitle: 'Please verify your identity'
-      }
-    });
-    
-    if (credentials) {
-      // User is authenticated
-      console.log('User authenticated:', credentials.username);
-    }
-  } else {
-    // Redirect to onboarding flow
-    setShowOnboarding(true);
-  }
-};
-```
-
-## API Reference
-
-### Main Components
-
-#### `OnairosButton`
-
-The main entry point for Onairos authentication with full training flow support.
-
-| Prop | Type | Required | Description |
-|------|------|----------|-------------|
-| AppName | string | Yes | Your application name |
-| requestData | object | Yes | Platform-specific OAuth scopes and data requests |
-| returnLink | string | Yes | Deep link URL for OAuth callback |
-| embedd | boolean | No | Whether to use embedded flow (default: false) |
-| color | string | No | Button color (default: #00BFA5) |
-| icon | string | No | Button icon name (default: 'auto_awesome') |
-| onResolved | function | Yes | Callback for successful auth with (apiUrl, accessToken, loginDetails) |
-| login | boolean | No | Enable login mode (default: false) |
-| buttonType | 'circle' \| 'pill' | No | Button style (default: 'circle') |
-| debug | boolean | No | Enable debug mode (default: false) |
-| test | boolean | No | Enable test mode (default: false) |
-
-#### `UniversalOnboarding`
-
-The universal onboarding flow component.
-
-| Prop | Type | Required | Description |
-|------|------|----------|-------------|
-| visible | boolean | Yes | Whether the onboarding is visible |
-| onClose | function | Yes | Callback when onboarding is closed |
-| AppName | string | Yes | Your application name |
-| requestData | object | Yes | Platform-specific OAuth scopes |
-| returnLink | string | Yes | Deep link URL for OAuth callback |
-| onComplete | function | Yes | Callback when onboarding is complete |
-| embedd | boolean | No | Whether to use embedded flow |
-| debug | boolean | No | Enable debug mode |
-| test | boolean | No | Enable test mode |
-
-#### `TrainingModal`
-
-Email authentication and training progress modal.
-
-| Prop | Type | Required | Description |
-|------|------|----------|-------------|
-| visible | boolean | Yes | Whether the modal is visible |
-| onCancel | function | Yes | Callback when modal is cancelled |
-| onComplete | function | Yes | Callback when training is complete |
-| modelKey | string | No | Model key for training |
-| username | string | No | Username for training |
-| isPrimaryAuth | boolean | No | Whether this is primary authentication |
-| autoFocusEmailInput | boolean | No | Auto-focus email input on show |
-
-#### `WelcomeScreen`
-
-New welcome flow component with modern UI.
-
-| Prop | Type | Required | Description |
-|------|------|----------|-------------|
-| visible | boolean | Yes | Whether the screen is visible |
-| onClose | function | Yes | Callback when screen is closed |
-| onComplete | function | Yes | Callback when flow is complete |
-
-#### `Overlay`
-
-Data request overlay component.
-
-| Prop | Type | Required | Description |
-|------|------|----------|-------------|
-| visible | boolean | Yes | Whether the overlay is visible |
-| onClose | function | Yes | Callback when overlay is closed |
-| onAccept | function | Yes | Callback when request is accepted |
-| AppName | string | Yes | Your application name |
-| requestData | object | Yes | Data being requested |
-| biometricType | 'FaceID' \| 'TouchID' \| 'BiometricID' | No | Type of biometric auth to use |
-
-### Utility Functions
-
-#### Secure Storage
-
-- `storeCredentials(credentials, options)`: Store credentials securely
-- `getCredentials(options)`: Retrieve credentials with optional biometric auth
-- `hasCredentials()`: Check if user has stored credentials
-- `deleteCredentials()`: Delete stored credentials
-- `updateCredentials(updates, options)`: Update specific fields in credentials
-- `generateDeviceUsername()`: Generate a device-specific unique username
-- `verifyCredentials(credentials)`: Verify if credentials are valid
-
-#### OAuth Service
-
-- `connectPlatform(platform)`: Initiate OAuth flow for a specific platform
-- `disconnectPlatform(platform, credentials)`: Disconnect a platform
-- `initializeOAuthService()`: Initialize OAuth service handlers
-- `cleanupOAuthService()`: Clean up OAuth service handlers
-- `storePlatformConnection(platform, connectionData, credentials)`: Store platform connection
-
-#### API Communication
-
-- `validateCredentials(username, options)`: Validate user credentials with the API
-- `createAccount(credentials, options)`: Create a new user account
-- `authenticate(credentials, options)`: Authenticate with the API using credentials
-- `refreshToken(refreshToken, options)`: Refresh authentication token
-- `getPlatformData(accessToken, platform, options)`: Get user's connected platform data
-- `getUserProfile(accessToken, options)`: Get user profile information
-- `updatePlatformConnections(accessToken, platforms, options)`: Update user platform connections
-
-## Development and Testing
-
-### Setup Development Environment
-
-1. Clone the repository:
-```bash
-git clone https://github.com/onairos/onairos-react-native.git
-cd onairos-react-native
-```
-
-2. Install dependencies:
-```bash
-yarn install
-```
-
-3. Run the typecheck:
-```bash
-yarn typecheck
-```
-
-### Building the Package
-
-```bash
-npm run build:all
-```
-
-### Testing with a Local App
-
-1. Link the package locally:
-```bash
-# In your package directory
-yarn link
-
-# In your app directory
-yarn link @onairos/react-native
-```
-
-2. Run your app and test the integration.
-
-## Troubleshooting
-
-### OAuth Callback Issues
-
-- Ensure your deep link schemes are properly configured in both iOS and Android
-- Check that the callback URLs match what's registered with your OAuth providers
-- Ensure all required permissions are enabled in your app configurations
-
-### Biometric Authentication Issues
-
-- Ensure proper permissions are set in Info.plist and AndroidManifest.xml
-- Test on physical devices as simulators may not support all biometric features
-- For iOS, ensure that Face ID/Touch ID is enabled and set up on the device
-
-### Platform Specific Issues
-
-#### iOS
-
-- For keychain issues, check that the Keychain Sharing capability is enabled
-- Ensure the bundle identifier is consistent with your OAuth configuration
-
-#### Android
-
-- For deep linking issues, check the androidManifest.xml configuration
-- Ensure that biometric hardware is available on test devices
-
-## Contributing
-
-1. Fork the repository
-2. Create your feature branch (`git checkout -b feature/amazing-feature`)
-3. Commit your changes (`git commit -m 'Add some amazing feature'`)
-4. Push to the branch (`git push origin feature/amazing-feature`)
-5. Open a Pull Request
-
-## License
-
-MIT

package/lib/commonjs/components/OnairosButton.js

@@ -1,290 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.OnairosButton = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactNative = require("react-native");
-var _reactNativeLinearGradient = _interopRequireDefault(require("react-native-linear-gradient"));
-var _UniversalOnboarding = require("./UniversalOnboarding");
-var _WelcomeScreen = _interopRequireDefault(require("./WelcomeScreen"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-const {
-  width
-} = _reactNative.Dimensions.get('window');
-const OnairosButton = exports.OnairosButton = /*#__PURE__*/(0, _react.forwardRef)(({
-  AppName,
-  buttonType = 'normal',
-  buttonWidth = 180,
-  buttonHeight = 48,
-  hasStroke = false,
-  enabled = true,
-  buttonForm = 'default',
-  onResolved,
-  onRejection,
-  preCheck,
-  color = '#1BA9D4',
-  swerv = false,
-  darkMode = false,
-  returnLink,
-  preferredPlatform,
-  autoFetch = false,
-  inferenceData,
-  textLayout = 'right',
-  textColor = 'black',
-  proofMode = false,
-  webpageName,
-  debug = false,
-  testMode = false,
-  requestData,
-  onPress,
-  primaryAuthOnly = false,
-  useNewWelcomeFlow = false
-}, ref) => {
-  const [isLoading, setIsLoading] = (0, _react.useState)(false);
-  const [isPressed, setIsPressed] = (0, _react.useState)(false);
-  const [showOnboarding, setShowOnboarding] = (0, _react.useState)(false);
-  console.log('[OnairosButton] Initializing. Initial showOnboarding:', showOnboarding);
-  (0, _react.useEffect)(() => {
-    console.log('[OnairosButton] LogEffect: showOnboarding state changed to:', showOnboarding);
-  }, [showOnboarding]);
-
-  // Expose methods via ref
-  (0, _react.useImperativeHandle)(ref, () => ({
-    trigger: async () => {
-      await handlePress();
-      return Promise.resolve();
-    },
-    reset: async () => {
-      return Promise.resolve();
-    }
-  }));
-  const handlePress = async () => {
-    console.log('[OnairosButton] handlePress called.');
-    if (!enabled || isLoading) return;
-    setIsLoading(true);
-    try {
-      if (preCheck) {
-        const shouldProceed = await preCheck();
-        if (!shouldProceed) {
-          console.log('[OnairosButton] Precheck failed. Setting showOnboarding to false (indirectly, by not setting to true).');
-          onRejection === null || onRejection === void 0 || onRejection('Precheck validation failed');
-          setIsLoading(false);
-          return;
-        }
-      }
-      console.log('[OnairosButton] handlePress: Setting showOnboarding to true.');
-      setShowOnboarding(true);
-      setIsLoading(false);
-    } catch (error) {
-      console.error('[OnairosButton] Error in handlePress:', error);
-      onRejection === null || onRejection === void 0 || onRejection(error instanceof Error ? error.message : 'Unknown error');
-      setIsLoading(false);
-    }
-  };
-
-  // Compute button text based on buttonForm
-  const getButtonText = () => {
-    switch (buttonForm) {
-      case 'connect':
-        return 'Connect Onairos';
-      case 'login':
-        return 'Sign in with Onairos';
-      case 'signup':
-        return 'Sign up with Onairos';
-      default:
-        return 'Connect Onairos';
-    }
-  };
-
-  // Handle onboarding completion
-  const handleOnboardingComplete = (0, _react.useCallback)((token, email) => {
-    console.log('[OnairosButton] handleOnboardingComplete: Setting showOnboarding to false.');
-    setShowOnboarding(false);
-    if (onResolved) {
-      // Call onResolved with the token and email
-      onResolved(token, email);
-    }
-    if (onPress) {
-      onPress();
-    }
-  }, [onResolved, onPress]);
-
-  // Handle onboarding close
-  const handleOnboardingClose = (0, _react.useCallback)(() => {
-    console.log('[OnairosButton] handleOnboardingClose: Setting showOnboarding to false.');
-    setShowOnboarding(false);
-    if (onRejection) {
-      onRejection('User closed onboarding');
-    }
-  }, [onRejection]);
-  console.log('[OnairosButton] Rendering JSX with props:', {
-    AppName,
-    buttonType,
-    buttonWidth,
-    buttonHeight,
-    hasStroke,
-    enabled,
-    buttonForm,
-    onResolved,
-    onRejection,
-    preCheck,
-    color,
-    swerv,
-    darkMode,
-    returnLink,
-    preferredPlatform,
-    autoFetch,
-    inferenceData,
-    textLayout,
-    textColor,
-    proofMode,
-    webpageName,
-    debug,
-    testMode,
-    requestData,
-    onPress,
-    primaryAuthOnly,
-    useNewWelcomeFlow
-  });
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
-    style: [styles.button, buttonType === 'pill' && styles.pillButton, hasStroke && styles.strokedButton, {
-      width: buttonWidth,
-      height: buttonHeight
-    }, swerv && styles.swervButton, !enabled && styles.disabledButton],
-    onPress: handlePress,
-    disabled: !enabled || isLoading,
-    onPressIn: () => setIsPressed(true),
-    onPressOut: () => setIsPressed(false)
-  }, /*#__PURE__*/_react.default.createElement(_reactNativeLinearGradient.default, {
-    colors: ['#f5e7c1', '#C7A047', '#8B6914'],
-    start: {
-      x: 0,
-      y: 0
-    },
-    end: {
-      x: 1,
-      y: 0
-    },
-    style: {
-      position: 'absolute',
-      left: 0,
-      right: 0,
-      top: 0,
-      bottom: 0,
-      borderRadius: buttonType === 'pill' ? 24 : 8
-    }
-  }), isLoading ? /*#__PURE__*/_react.default.createElement(_reactNative.ActivityIndicator, {
-    size: "small",
-    color: "#FFFFFF"
-  }) : /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    style: styles.buttonContent
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    style: styles.logoContainer
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
-    source: require('../assets/images/onairos_logo.png'),
-    style: styles.logoImage,
-    resizeMode: "contain"
-  })), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
-    style: [styles.buttonText, {
-      color: '#FFFFFF'
-    }]
-  }, getButtonText())))), useNewWelcomeFlow ? /*#__PURE__*/_react.default.createElement(_WelcomeScreen.default, {
-    visible: showOnboarding,
-    onClose: handleOnboardingClose,
-    onComplete: handleOnboardingComplete
-  }) : /*#__PURE__*/_react.default.createElement(_UniversalOnboarding.UniversalOnboarding, {
-    visible: showOnboarding,
-    onClose: handleOnboardingClose,
-    AppName: AppName,
-    requestData: requestData || {
-      Small: {
-        type: 'Small',
-        descriptions: 'Basic tier',
-        reward: 'Free access'
-      },
-      Medium: {
-        type: 'Medium',
-        descriptions: 'Standard tier',
-        reward: 'Premium features'
-      },
-      Large: {
-        type: 'Large',
-        descriptions: 'Premium tier',
-        reward: 'Full personalization'
-      }
-    },
-    returnLink: returnLink || 'onairosevents://auth/callback',
-    onComplete: handleOnboardingComplete,
-    debug: debug,
-    test: testMode,
-    preferredPlatform: preferredPlatform,
-    primaryAuthOnly: primaryAuthOnly
-  }));
-});
-const styles = _reactNative.StyleSheet.create({
-  button: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'center',
-    paddingVertical: 12,
-    paddingHorizontal: 16,
-    borderRadius: 8,
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 2
-    },
-    shadowOpacity: 0.2,
-    shadowRadius: 4,
-    elevation: 3,
-    overflow: 'hidden'
-  },
-  buttonContent: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'center'
-  },
-  logoContainer: {
-    width: 24,
-    height: 24,
-    // borderRadius: 12, // Removed to eliminate circle shape
-    // backgroundColor: '#FFFFFF', // Removed to eliminate white background
-    alignItems: 'center',
-    justifyContent: 'center',
-    marginRight: 4
-  },
-  logoText: {
-    color: '#C7A047',
-    fontWeight: 'bold',
-    fontSize: 14
-  },
-  logoImage: {
-    width: 20,
-    height: 20
-  },
-  pillButton: {
-    borderRadius: 24
-  },
-  strokedButton: {
-    backgroundColor: 'transparent',
-    borderWidth: 1
-  },
-  swervButton: {
-    transform: [{
-      rotate: '-2deg'
-    }]
-  },
-  disabledButton: {
-    opacity: 0.6
-  },
-  buttonText: {
-    fontSize: 16,
-    fontWeight: '600',
-    textAlign: 'center'
-  }
-});
-var _default = exports.default = OnairosButton;
-//# sourceMappingURL=OnairosButton.js.map