@customerglu/react-native-customerglu 4.0.0 → 4.1.2

package/README.md

@@ -1,30 +1,225 @@
-# CustomerGlu SDK
+<p align="center">
+  <h1 align="center">CustomerGlu React Native SDK</h1>
+  <p align="center">In-app gamification, rewards, and engagement campaigns for React Native — unified API across iOS and Android.</p>
+</p>
 
-CustomerGlu SDK provides you Express Installation requiring minimal technical effort, with out of the box methods for every functionality.
+<p align="center">
+  <a href="https://www.npmjs.com/package/@customerglu/react-native-customerglu"><img src="https://img.shields.io/npm/v/@customerglu/react-native-customerglu?label=npm&color=blue" alt="npm"></a>
+  <a href="https://docs.customerglu.com/sdk/mobile-sdks#react-native"><img src="https://img.shields.io/badge/docs-customerglu.com-green" alt="Documentation"></a>
+  <a href="https://github.com/customerglu/CG-SDK-React-Native/blob/main/LICENSE"><img src="https://img.shields.io/badge/license-MIT-lightgrey" alt="License"></a>
+</p>
 
-# Pre-Requisites
+<p align="center">
+  <b>All CustomerGlu SDKs share the same version number.</b><br>
+  iOS <code>4.1.2</code> · Android <code>4.1.2</code> · React Native <code>4.1.2</code>
+</p>
 
-### iOS
-Supports IOS 12.0+ and requires Xcode 12 or above to build.
+---
 
-### Android
-Supports API 21 and above. Please ensure the minSDKVersion in the app's build.gradle file reflects the same.
+## Table of Contents
 
+- [Requirements](#requirements)
+- [Installation](#installation)
+- [Quick Start](#quick-start)
+- [Banner Widgets](#banner-widgets)
+- [Features](#features)
+- [What's New in 4.1.2](#whats-new-in-400)
+- [Troubleshooting](#troubleshooting)
+- [Native SDKs](#native-sdks)
+- [Documentation](#documentation)
 
-# Installation
+---
 
-### Option 1
-Add the CustomerGlu React Native plugin in package.json file 
-``` 
-"@customerglu/react-native-customerglu": "^3.1.2"
-``` 
+## Requirements
 
-### Option 2  
-Run this command With npm:
-``` 
+| Platform | Minimum |
+|----------|---------|
+| React Native | 0.71+ |
+| iOS | 14.0+ / Xcode 13+ |
+| Android | API 21 (Android 5.0)+ |
+| Node.js | 16+ |
+
+---
+
+## Installation
+
+### npm
+
+```bash
 npm install @customerglu/react-native-customerglu
-``` 
+```
+
+### Yarn
+
+```bash
+yarn add @customerglu/react-native-customerglu
+```
+
+### iOS Setup
+
+Install the native CocoaPods dependency:
+
+```bash
+cd ios && pod install && cd ..
+```
+
+The React Native SDK automatically pulls in the native iOS SDK (`CustomerGlu 4.1.2`) via CocoaPods.
+
+### Android Setup
+
+The native Android SDK (`com.customerglu:CustomerGluLibrary:4.1.2`) is resolved automatically via Maven Central.
+
+Ensure `mavenCentral()` is in your **project-level** `build.gradle` (or `settings.gradle`):
+
+```gradle
+// build.gradle (project)
+allprojects {
+    repositories {
+        mavenCentral()
+    }
+}
+```
+
+```gradle
+// OR settings.gradle (newer projects)
+dependencyResolutionManagement {
+    repositories {
+        mavenCentral()
+    }
+}
+```
+
+No additional Android configuration is required.
+
+---
+
+## Quick Start
+
+### 1. Configure Your Write Key
+
+#### iOS — `Info.plist`
+
+```xml
+<key>CUSTOMERGLU_WRITE_KEY</key>
+<string>YOUR_WRITE_KEY</string>
+```
+
+#### Android — `AndroidManifest.xml`
+
+```xml
+<meta-data
+    android:name="CUSTOMERGLU_WRITE_KEY"
+    android:value="YOUR_WRITE_KEY" />
+```
+
+You can find your write key in the [CustomerGlu Dashboard](https://dashboard.customerglu.com) under **Settings → SDK Keys**.
+
+### 2. Register a User
+
+```typescript
+import { CustomerGlu } from '@customerglu/react-native-customerglu';
+
+// Register user (call once after login / app launch)
+await CustomerGlu.registerDevice('user-123');
+```
+
+### 3. Common Operations
+
+```typescript
+// Open the rewards wallet
+CustomerGlu.openWallet();
+
+// Load all campaigns
+CustomerGlu.loadAllCampaigns();
+
+// Send a custom event
+CustomerGlu.sendEventData({
+  eventName: 'purchase',
+  eventProperties: { amount: 99 },
+});
+
+// Update user attributes
+CustomerGlu.updateProfile({ plan: 'premium' });
+```
+
+---
+
+## Banner Widgets
+
+Embed native banner widgets in your React Native views using `CGBannerWidget`:
+
+```tsx
+import { CGBannerWidget } from '@customerglu/react-native-customerglu';
+
+function HomeScreen() {
+  return (
+    <CGBannerWidget
+      bannerId="home_rewards_banner"
+      style={{ width: '100%' }}
+    />
+  );
+}
+```
+
+The SDK handles rendering, styling, native widget inflation, and click actions automatically based on your dashboard configuration. Banner height is managed dynamically — native widgets measure their content and resize the React Native container.
+
+---
+
+## Features
+
+| Feature | Description |
+|---------|-------------|
+| **Cross-platform** | Single TypeScript API for iOS and Android |
+| **Entry Points** | Floating buttons, banners, embedded views |
+| **Native Widgets** | DYNAMIC_MULTISTEP progress widgets rendered natively (no WebView) |
+| **Campaigns** | Bottom sheets, popups, full-screen campaigns |
+| **Real-time** | SSE-based live nudges and state updates |
+| **Deep Linking** | Campaign navigation handling |
+| **Analytics** | Event tracking and diagnostics |
+| **Multi-region** | ME, US, and default API endpoints — resolved automatically |
+
+---
+
+## What's New in 4.1.2
+
+- **DYNAMIC_MULTISTEP native rendering** — three widget variants (MS1, MS2, MS3) rendered natively on both iOS and Android instead of WebView for better performance and native feel
+- **Auto-height bridge** — native widgets broadcast measured height via `CGBANNER_FINAL_HEIGHT` to resize React Native containers dynamically
+- **iOS overflow support** — `clipsToBounds = NO` on the bridge view enables MS3 expand/collapse animation overflow
+- **19 configurable nativeStyle fields** — colors, fonts, border radius, shimmer, and more — all controlled via dashboard
+
+---
+
+## Troubleshooting
+
+| Issue | Solution |
+|-------|----------|
+| `pod install` fails | Run `pod repo update` then retry; ensure Xcode CLT is installed |
+| Android build error | Verify `mavenCentral()` in repositories; ensure Java 17+ |
+| Banner not showing | Check `bannerId` matches dashboard config; ensure `registerDevice` succeeded |
+| Height not updating | Confirm `CGBannerWidget` has `overflow: 'visible'` in its style if using MS3 expand |
+| Module not found | Clear caches: `npx react-native start --reset-cache` |
+
+---
+
+## Native SDKs
+
+The React Native SDK wraps the native SDKs. For advanced customization or standalone native apps:
+
+| Platform | Package | Install |
+|----------|---------|---------|
+| **iOS** | `CustomerGlu` | [CocoaPods](https://cocoapods.org/pods/CustomerGlu) · [SPM](https://github.com/customerglu/CG-iOS-SDK) |
+| **Android** | `com.customerglu:CustomerGluLibrary:4.1.2` | [Maven Central](https://central.sonatype.com/artifact/com.customerglu/CustomerGluLibrary) |
+
+---
+
+## Documentation
+
+Full SDK docs, guides, and API reference:
+
+**[https://docs.customerglu.com/sdk/mobile-sdks#react-native](https://docs.customerglu.com/sdk/mobile-sdks#react-native)**
+
+---
 
-# Initialisation & Functionalities
+## License
 
-Please refer to the [Documentation here](https://docs.customerglu.com/sdk/mobile-sdks#react-native)
+[MIT](LICENSE)

package/ReactNativeCustomerglu.podspec

@@ -19,7 +19,7 @@ Pod::Spec.new do |s|
 
   s.source_files = "ios/**/*.{h,m,mm,cpp,swift}"
   s.private_header_files = "ios/generated/**/*.h"
-  s.dependency "CustomerGlu", "4.0.0"
+  s.dependency "CustomerGlu", "4.1.2"
 
   # Use install_modules_dependencies helper to install the dependencies if React Native version >=0.71.0.
   # See https://github.com/facebook/react-native/blob/febf6b7f33fdb4904669f99d795eba4c0f95d7bf/scripts/cocoapods/new_architecture.rb#L79.

package/android/build.gradle

@@ -101,9 +101,8 @@ dependencies {
   implementation "com.facebook.react:react-android"
   implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
   implementation 'com.google.code.gson:gson:2.8.6'
-  // Use local CustomerGlu SDK for testing
-  implementation project(':CustomerGluLibrary')
-  // implementation 'com.customerglu:CustomerGluLibrary:3.1.2'
+  // For local testing: implementation project(':CustomerGluLibrary')
+  implementation 'com.customerglu:CustomerGluLibrary:4.1.2'
 
 }
 

package/ios/IosBannerView.mm

@@ -53,6 +53,7 @@
             [self addSubview:self->_bannerView];
             self->_bannerView.frame = self.bounds;
             self->_bannerView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
+            self.clipsToBounds = NO;
             self->_bannerInitialized = YES;
             [self setNeedsLayout];
         

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@customerglu/react-native-customerglu",
-  "version": "4.0.0",
-  "description": "CustomerGlu React Native plugin",
+  "version": "4.1.2",
+  "description": "CustomerGlu React Native SDK \u2014 in-app gamification, rewards, and engagement campaigns for iOS and Android.",
   "source": "./src/index.tsx",
   "main": "./lib/commonjs/index.js",
   "module": "./lib/module/index.js",
@@ -48,7 +48,17 @@
   "keywords": [
     "react-native",
     "ios",
-    "android"
+    "android",
+    "gamification",
+    "rewards",
+    "engagement",
+    "campaigns",
+    "in-app",
+    "customerglu",
+    "sdk",
+    "banners",
+    "nudges",
+    "entry-points"
   ],
   "repository": {
     "type": "git",