@vitraun/react-native 0.1.0 → 0.2.6

package/README.md

@@ -1,8 +1,10 @@
 # @vitraun/react-native
 
-Official Vitraun Try-On adapter for React Native apps. The SDK calls **embed-init**, loads the returned **`vtoUrl`** in a WebView, and forwards cart events to your app.
+Official Vitraun Virtual Try-On adapter for **React Native** apps.
 
-The integrator **does not** hardcode the try-on URL.
+Embeds try-on via WebView. The integrator **does not** hardcode the try-on URL — the SDK calls **embed-init**, receives **`vtoUrl`**, and loads that URL in a WebView.
+
+For **web** storefronts, use [`@vitraun/webar`](../webar/README.md) instead.
 
 ## Install
 
@@ -10,18 +12,11 @@ The integrator **does not** hardcode the try-on URL.
 npm install @vitraun/react-native react-native-webview
 ```
 
-Peer dependencies: `react`, `react-native`, `react-native-webview`.
+Peer dependencies: `react` (≥18), `react-native` (≥0.72), `react-native-webview` (≥13).
 
-## Prerequisites (Vitraun panel)
+Depends on [`@vitraun/core`](../core) for embed-init HTTP helpers.
 
-- Register **merchant ID** and **widget ID**
-- Enable **`allowWebView`** on the channel
-- Register **iOS bundle ID** and/or **Android package name**
-- Add camera permission:
-  - iOS: `NSCameraUsageDescription` in `Info.plist`
-  - Android: `CAMERA` in `AndroidManifest.xml`
-
-## Usage
+## Quick start
 
 ```tsx
 import { VitraunTryOn } from '@vitraun/react-native'
@@ -30,10 +25,10 @@ export const TryOnScreen = () => (
   <VitraunTryOn
     merchantId="vtrn-mch-key-00000000-0000-4000-8000-000000000001"
     widgetId="vtrn-wdg-key-00000000-0000-4000-8000-000000000002"
-    lang="pt-BR"
+    lang="en-US"
     platform="ios"
-    bundleId="com.sua.loja"
-    packageName="com.sua.loja"
+    bundleId="com.your.store"
+    packageName="com.your.store"
     isolatedSku="8028997081552"
     basketOpensIn="event"
     checkoutOpensIn="event"
@@ -51,7 +46,70 @@ export const TryOnScreen = () => (
 )
 ```
 
-## Init without UI
+## How it works
+
+1. The app renders `VitraunTryOn` (or calls `initializeVitraunSession`).
+2. The SDK triggers try-on by calling embed-init before the WebView loads.
+3. A WebView loads **`vtoUrl`** only; an injected bridge forwards **`postMessage`** events to `onEvent`.
+
+Shared embed-init logic lives in [`@vitraun/core`](../core).
+
+## Panel prerequisites
+
+- Register **merchant ID** and **widget ID** in the Vitraun panel
+- Enable **`allowWebView`** on the channel
+- Register **iOS bundle ID** and/or **Android package name**
+- Add camera permission:
+  - iOS: `NSCameraUsageDescription` in `Info.plist`
+  - Android: `CAMERA` in `AndroidManifest.xml`
+
+## Configuration
+
+| Option | Required | Description |
+|--------|----------|-------------|
+| `merchantId` | Yes | Public merchant key (`vtrn-mch-key-…`) |
+| `widgetId` | Yes | Public widget key (`vtrn-wdg-key-…`) |
+| `lang` | No | Locale (default `en-US`) |
+| `env` | No | Environment segment (empty = production; e.g. `staging`) |
+| `isolatedSku` | No | Single-product (PDP) mode |
+| `applySkus` | No | SKUs pre-applied on open |
+| `basketOpensIn` | No | `blank`, `self`, or `event` |
+| `checkoutOpensIn` | No | `blank`, `self`, or `event` |
+| `platform` | No | Sent in embed-init `app.platform` (e.g. `ios`, `android`) |
+| `bundleId` | No | iOS bundle ID (panel allowlist) |
+| `packageName` | No | Android package name (panel allowlist) |
+| `onEvent` | No | Cart / checkout / ready callbacks |
+| `onError` | No | Embed-init or load failure |
+| `onReady` | No | Called when WebView URL is ready |
+
+
+
+## Events
+
+| Event | Typical use |
+|-------|-------------|
+| `addToCart` | Add SKU to cart |
+| `removeFromCart` | Remove line item |
+| `redirectToCart` | Open checkout |
+| `analysisFinished` | Camera / analysis ready |
+
+```tsx
+<VitraunTryOn
+  merchantId="..."
+  widgetId="..."
+  onEvent={(event) => {
+    console.log(event.type, event.detail)
+  }}
+/>
+```
+
+```ts
+import { VITRAUN_VTO_DEFAULT_EVENT_TYPES } from '@vitraun/react-native'
+```
+
+## Advanced usage
+
+Init without the built-in component (custom WebView wrapper or preload):
 
 ```ts
 import { initializeVitraunSession } from '@vitraun/react-native'
@@ -61,30 +119,30 @@ const session = await initializeVitraunSession({
     merchantId: 'vtrn-mch-key-...',
     widgetId: 'vtrn-wdg-key-...',
     lang: 'en-US',
-    app: { platform: 'android', packageName: 'com.sua.loja' },
+    app: { platform: 'android', packageName: 'com.your.store' },
   },
 })
 
-// session.vtoUrl — load in your own WebView if needed
+// session.vtoUrl — load in your WebView
+// session.sessionToken — embed session JWT when required by channel
 ```
 
-## Staging
+Lower-level hook:
 
-```tsx
-<VitraunTryOn env="staging" merchantId="..." widgetId="..." />
+```ts
+import { useVitraunInit } from '@vitraun/react-native'
 ```
 
-## Events
-
-Same contract as `@vitraun/webar`:
+## Distribution
 
-- `addToCart`
-- `removeFromCart`
-- `redirectToCart`
-- `analysisFinished`
+Published via **npm** only (`npm install @vitraun/react-native`). There is no CDN script bundle for this package.
 
-## Related docs
+## Package exports
 
-- Mobile HTTP contract: [`../docs/mobile-sdk-contract.md`](../docs/mobile-sdk-contract.md)
-- iOS native stub: [`../ios/README.md`](../ios/README.md)
-- Android native stub: [`../android/README.md`](../android/README.md)
+| Export | Description |
+|--------|-------------|
+| `VitraunTryOn` | WebView component with embed-init |
+| `useVitraunInit` | Embed-init hook (loading / error / session) |
+| `initializeVitraunSession` | Init without UI (re-export from core) |
+| `handleVitraunWebViewMessage` | Parse `WebView` `onMessage` payload |
+| `buildInjectedJavaScriptBeforeContentLoaded` | Bridge + optional native config inject |

package/dist/index.d.ts

@@ -42,6 +42,8 @@ export type VitraunTryOnProps = {
   basketOpensIn?: VitraunTryOnBasketOpensIn
   checkoutOpensIn?: VitraunTryOnCheckoutOpensIn
   useSimplePage?: boolean
+  /** Desktop QR handoff; no effect on mobile WebView (already on phone). */
+  useQrCode?: boolean
   showDetails?: boolean
   showProductPrice?: boolean
   priceFrom?: number | null

package/dist/index.js

@@ -93,6 +93,9 @@ var buildNativeConfigOverrides = (props) => {
   if (props.useSimplePage != null) {
     overrides.useSimplePage = props.useSimplePage;
   }
+  if (props.useQrCode != null) {
+    overrides.useQrCode = props.useQrCode;
+  }
   if (props.showDetails != null) {
     overrides.showDetails = props.showDetails;
   }
@@ -265,6 +268,7 @@ var VitraunTryOn = (props) => {
     basketOpensIn,
     checkoutOpensIn,
     useSimplePage,
+    useQrCode,
     showDetails,
     showProductPrice,
     priceFrom,
@@ -343,6 +347,7 @@ var VitraunTryOn = (props) => {
         checkoutOpensIn,
         flow,
         useSimplePage,
+        useQrCode,
         showDetails,
         showProductPrice,
         priceFrom,
@@ -358,6 +363,7 @@ var VitraunTryOn = (props) => {
       checkoutOpensIn,
       flow,
       useSimplePage,
+      useQrCode,
       showDetails,
       showProductPrice,
       priceFrom,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vitraun/react-native",
-  "version": "0.1.0",
+  "version": "0.2.6",
   "description": "Vitraun Try-On React Native adapter (WebView + embed-init bridge)",
   "license": "SEE LICENSE IN LICENSE.txt",
   "repository": {