@tfcorp/consumer-app-react-native-sdk 2.0.0-beta.1

package/LICENSE

@@ -0,0 +1,70 @@
+True Fit SDK
+Copyright © 2026 True Fit Corp. All rights reserved.
+
+TRUE FIT SDK LICENSE AGREEMENT (EULA)
+
+This is a legal agreement between you (either an individual or an entity, "You")
+and True Fit Corp. ("True Fit") governing your use of the True Fit SDK, including
+all libraries, sample code, tools, and accompanying documentation (collectively,
+the "SDK"). By downloading, installing, or using the SDK, You agree to be bound
+by the terms of this Agreement. If You do not agree, do not download, install, or
+use the SDK.
+
+1. PROPRIETARY SOFTWARE
+   The SDK is proprietary software of True Fit. It is licensed, not sold. True
+   Fit retains all right, title, and interest in and to the SDK, including all
+   intellectual property rights therein.
+
+2. LICENSE GRANT
+   Subject to your compliance with this Agreement, True Fit grants You a
+   non-exclusive, non-transferable, revocable, worldwide license to:
+     - download and install the SDK;
+     - use the SDK to develop applications; and
+     - distribute applications incorporating the SDK to your customers.
+
+3. RESTRICTIONS
+   You may not:
+     - redistribute the SDK itself;
+     - sell, sublicense, or transfer the SDK independently;
+     - modify, reverse engineer, decompile, or disassemble the SDK, except where
+       such restriction is prohibited by applicable law;
+     - use the SDK to create a competing SDK or service.
+
+4. OWNERSHIP
+   Except for the limited license expressly granted in Section 2, no rights,
+   licenses, or interests in the SDK are granted to You. All rights not expressly
+   granted are reserved by True Fit.
+
+5. TERM AND TERMINATION
+   This Agreement is effective until terminated. It terminates automatically,
+   without notice, if You breach any of its terms. Upon termination, You must
+   cease all use of the SDK and destroy all copies in your possession or control.
+   Sections 1, 3, 4, and 6 through 9 survive termination.
+
+6. DISCLAIMER OF WARRANTY
+   THE SDK IS PROVIDED "AS IS" AND "AS AVAILABLE", WITHOUT WARRANTY OF ANY KIND,
+   EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE IMPLIED WARRANTIES OF
+   MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE, AND NON-INFRINGEMENT. TRUE
+   FIT DOES NOT WARRANT THAT THE SDK WILL BE UNINTERRUPTED OR ERROR-FREE.
+
+7. LIMITATION OF LIABILITY
+   TO THE MAXIMUM EXTENT PERMITTED BY APPLICABLE LAW, IN NO EVENT WILL TRUE FIT
+   BE LIABLE FOR ANY INDIRECT, INCIDENTAL, SPECIAL, CONSEQUENTIAL, OR PUNITIVE
+   DAMAGES, OR ANY LOSS OF PROFITS, REVENUE, OR DATA, ARISING OUT OF OR RELATED
+   TO YOUR USE OF OR INABILITY TO USE THE SDK, WHETHER IN CONTRACT, TORT, OR
+   OTHERWISE, EVEN IF TRUE FIT HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH
+   DAMAGES.
+
+8. GOVERNING LAW
+   This Agreement is governed by the laws of the Commonwealth of Massachusetts,
+   United States of America, without regard to its conflict-of-laws principles.
+   The state and federal courts located in Boston, Massachusetts have exclusive
+   jurisdiction over any dispute arising out of or relating to this Agreement.
+
+9. ENTIRE AGREEMENT
+   This Agreement constitutes the entire agreement between You and True Fit
+   regarding the SDK and supersedes all prior or contemporaneous understandings.
+   If any provision is held unenforceable, the remaining provisions remain in
+   full force and effect.
+
+For licensing inquiries, contact: dev@truefit.com

package/README.md

@@ -0,0 +1,210 @@
+# True Fit React Native WebView SDK
+
+React Native bridge for the True Fit recommendation WebView SDK on Android and iOS.
+
+The widget renders inline on a product page, sizes itself to its content, and
+presents the size modal full screen on its own. It uses the official True Fit
+`tfcapi` event contract for open/close, height, and recommendation events, and
+materializes the account sign-in popup (`window.open`) so shoppers can register
+and get a personalized recommendation.
+
+This package exposes a single native view:
+
+```tsx
+import {
+  TrueFitRecommendationView,
+  type TrueFitPresentationMode,
+  type TrueFitWidgetResult,
+} from 'consumer-app-react-native-sdk';
+
+export function ProductFitRecommendation() {
+  return (
+    <TrueFitRecommendationView
+      config={{
+        storeKey: 'nda',
+        storeStyle: '7093242789933',
+      }}
+      options={{
+        minWidgetHeight: 86,
+        maxWidgetHeight: 320,
+      }}
+      onPresentationModeChange={(mode: TrueFitPresentationMode, styleId) => {
+        console.log('True Fit mode', mode, styleId);
+      }}
+      onHeightChange={(height) => {
+        console.log('True Fit height', height);
+      }}
+      onWidgetResult={(result: TrueFitWidgetResult) => {
+        console.log('True Fit widget result', result);
+      }}
+      onAutoSizeSelect={({ styleId, size }) => {
+        console.log('True Fit auto size select', styleId, size);
+      }}
+    />
+  );
+}
+```
+
+## Props
+
+### `config`
+
+| Name          | Type                      | Default                                                                                                |
+| ------------- | ------------------------- | ------------------------------------------------------------------------------------------------------ |
+| `environment` | `'development' \| 'prod'` | `'prod'`                                                                                               |
+| `storeKey`    | `string`                  | Required                                                                                               |
+| `storeStyle`  | `string`                  | Required                                                                                               |
+| `uiLocale`    | `string`                  | Not set                                                                                                |
+| `scriptUrl`   | `string`                  | — (overrides `environment`; a full built-bundle URL. Raw Vite `.ts` dev entries are **not** supported) |
+
+### `options`
+
+| Name                                   | Type      | Default |
+| -------------------------------------- | --------- | ------- |
+| `minWidgetHeight`                      | `number`  | `86`    |
+| `maxWidgetHeight`                      | `number`  | `320`   |
+| `modalBackdropOpacity`                 | `number`  | `0.4`   |
+| `modalTransitionDurationMs`            | `number`  | `200`   |
+| `disableBackgroundScrollWhenModalOpen` | `boolean` | `true`  |
+| `heightAnimationDurationMs`            | `number`  | `180`   |
+| `debugLogging`                         | `boolean` | `false` |
+
+`maxWidgetHeight` must be tall enough to fit the widest inline layout (the CTA
+button plus the agentic suggestion chips row); content taller than this is
+clipped by the webview.
+
+## Events
+
+| Name                       | Payload                                                                                                                                                                               |
+| -------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `onPresentationModeChange` | `(mode: 'widget' \| 'modal', styleId?: string \| null)` — `styleId` identifies which product's flow opened/closed; `null` for changes that did not originate from an open/close event |
+| `onHeightChange`           | Current native view height in density-independent points                                                                                                                              |
+| `onWidgetResult`           | `TrueFitWidgetResult` — per-style recommendation state (`styleId`, `isWidgetVisible`, `isRegistered`, `isTraveling`, `isTravelingExternal`, `successType`)                            |
+| `onAutoSizeSelect`         | `{ styleId, size }` — fires when the widget auto-selects a size for a style                                                                                                           |
+
+`TrueFitWidgetResult.successType` is `'personal'` when the shopper has a
+profile-based recommendation, `'general'` for a generic one, and `null` when
+there is none.
+
+## Sign-in popup
+
+The widget's account sign-in opens the Keycloak login page via `window.open`.
+The SDK materializes it natively — a `WKWebView` presented as a form sheet on
+iOS, a second `WebView` in a full-screen `Dialog` on Android — sharing the same
+web session (cookies) as the widget so the post-login handshake completes and
+the personalized recommendation appears. No host-app wiring is required.
+
+## Architecture
+
+This package is a thin adapter. It contains no WebView, modal, JS bridge,
+configuration loader or resize implementation of its own — all of that lives in
+the standalone True Fit native SDKs, which this package depends on:
+
+```text
+React Native SDK (consumer-app-react-native-sdk)
+├── TypeScript public API (src/index.tsx)
+├── Android adapter (ViewManager + prop mappers) → depends on truefit-android-sdk
+└── iOS adapter (RCTViewManager + prop mappers)  → depends on TrueFitRecommendation pod
+```
+
+The adapters only map props to native config, forward native callbacks to JS
+events, and integrate the native view into React Native layout/lifecycle, so the
+widget behaviour matches the standalone native SDK sample apps exactly.
+
+## Native SDK dependencies
+
+**iOS** — the pod depends on `TrueFitRecommendation`. Your app's Podfile must
+make it resolvable. For local monorepo development, point it at the SDK path:
+
+```ruby
+# ios/Podfile
+pod 'TrueFitRecommendation', :path => '../../ios/ios-sdk'
+```
+
+Once the SDK is published, use the released version instead:
+
+```ruby
+pod 'TrueFitRecommendation', '~> 2.0.0'
+```
+
+**Android** — the adapter depends on the Android SDK. In the monorepo, include
+the SDK as a Gradle project so the adapter picks it up via
+`project(':truefit-android-sdk')`. In your app's `settings.gradle`:
+
+```gradle
+include(':truefit-android-sdk')
+project(':truefit-android-sdk').projectDir =
+    new File(rootProject.projectDir, '../../android/android-sdk')
+```
+
+If that project is absent, the adapter falls back to the published artifact
+`com.truefit:truefit-android-sdk:2.0.0` (add the GitHub Pages Maven repo
+`https://true-fit-corp.github.io/truefit-android-maven`).
+
+## Integration
+
+Install from the local workspace path:
+
+```sh
+pnpm add file:../react-native-sdk
+```
+
+Install iOS pods (after adding the `TrueFitRecommendation` pod line above):
+
+```sh
+cd ios
+pod install
+```
+
+React Native autolinking should register both platforms. If your Android app
+does not autolink local packages, add the package manually in
+`MainApplication`:
+
+```kotlin
+import com.truefit.reactnative.TrueFitRecommendationPackage
+
+override fun getPackages(): List<ReactPackage> =
+    PackageList(this).packages.apply {
+        add(TrueFitRecommendationPackage())
+    }
+```
+
+Use the view inside any product/detail screen. Give the parent enough width and
+avoid clipping if you want the modal expansion to remain visible:
+
+```tsx
+<View style={{ width: '100%', overflow: 'visible' }}>
+  <TrueFitRecommendationView
+    config={{
+      storeKey: 'your-store-key',
+      storeStyle: productStyleId,
+    }}
+  />
+</View>
+```
+
+Config values must be strings. If your API returns numeric product IDs, convert
+them before passing (e.g. `storeStyle: String(productStyleId)`).
+
+## Environments
+
+The native SDKs resolve the widget script URL from `config.environment`;
+consumers never pass raw URLs. Supported values are `'prod'` (the default,
+`https://consumer-v2.truefitcorp.com`) and `'development'`
+(`https://consumer-dev.truefitcorp.com`, for testing); both load
+`/tf-integration.js` from that origin. The SDK derives the HTML document's base URL / origin from that URL
+so the module fetch, the widget's `/api` calls, and its cookies are all
+same-origin.
+
+## Versioning & release order
+
+The React Native adapter depends on the native SDKs, so release them first:
+
+1. Publish `truefit-android-sdk` (Maven coordinate `com.truefit:truefit-android-sdk`)
+   and `TrueFitRecommendation` (CocoaPods) at the target version.
+2. Bump the matching version constraints in `android/build.gradle` and
+   `TrueFitReactNativeWebViewSdk.podspec`.
+3. Publish this React Native package.
+
+In the monorepo these steps are unnecessary — the adapter consumes the SDKs
+directly via the Gradle project include and the local pod path above.

package/TrueFitReactNativeWebViewSdk.podspec

@@ -0,0 +1,28 @@
+require 'json'
+
+package = JSON.parse(File.read(File.join(__dir__, 'package.json')))
+
+Pod::Spec.new do |s|
+  s.name         = 'TrueFitReactNativeWebViewSdk'
+  s.version      = package['version']
+  s.summary      = package['description']
+  s.license      = {
+    :type => 'Commercial',
+    :text => 'Copyright © 2026 True Fit Corp. All rights reserved. Use of this SDK is subject to the True Fit SDK License Agreement (EULA): https://www.truefit.com/legal/sdk-license',
+  }
+  s.authors      = { 'True Fit' => 'dev@truefit.com' }
+  s.homepage     = 'https://www.truefit.com'
+  s.platforms    = { :ios => '13.0' }
+  s.source       = { :path => '.' }
+  s.source_files = 'ios/**/*.{h,m,mm,swift}'
+  s.swift_version = '5.0'
+  s.dependency 'React-Core'
+
+  # The adapter reuses the standalone iOS SDK for all WebView / modal / bridge
+  # behaviour. The consuming app's Podfile must make this pod resolvable, e.g.
+  # for local monorepo development:
+  #   pod 'TrueFitRecommendation', :path => '../node_modules/consumer-app-react-native-sdk/../../ios/ios-sdk'
+  # or, once published:
+  #   pod 'TrueFitRecommendation', '~> 2.0.0'
+  s.dependency 'TrueFitRecommendation'
+end

package/android/build.gradle

@@ -0,0 +1,52 @@
+buildscript {
+  ext.kotlin_version = '2.0.21'
+  repositories {
+    google()
+    mavenCentral()
+  }
+  dependencies {
+    classpath 'com.android.tools.build:gradle:8.6.1'
+    classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
+  }
+}
+
+apply plugin: 'com.android.library'
+apply plugin: 'org.jetbrains.kotlin.android'
+
+android {
+  namespace 'com.truefit.reactnative'
+  compileSdk 35
+
+  defaultConfig {
+    minSdk 23
+  }
+
+  compileOptions {
+    sourceCompatibility JavaVersion.VERSION_17
+    targetCompatibility JavaVersion.VERSION_17
+  }
+
+  kotlinOptions {
+    jvmTarget = '17'
+  }
+}
+
+repositories {
+  google()
+  mavenCentral()
+}
+
+dependencies {
+  implementation 'com.facebook.react:react-android'
+
+  // Reuse the standalone Android SDK for all WebView / modal / bridge / resize
+  // behaviour. In the monorepo the host app includes the SDK as a Gradle
+  // project (:truefit-android-sdk); otherwise the published artifact is used.
+  // The SDK brings its own androidx.webkit / androidx.core transitively, so the
+  // adapter no longer declares a WebView implementation of its own.
+  if (findProject(':truefit-android-sdk') != null) {
+    implementation project(':truefit-android-sdk')
+  } else {
+    implementation 'com.truefit:truefit-android-sdk:2.0.0'
+  }
+}

package/android/src/main/AndroidManifest.xml

@@ -0,0 +1 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android" />

package/android/src/main/java/com/truefit/reactnative/TrueFitRecommendationPackage.kt

@@ -0,0 +1,13 @@
+package com.truefit.reactnative
+
+import com.facebook.react.ReactPackage
+import com.facebook.react.bridge.NativeModule
+import com.facebook.react.bridge.ReactApplicationContext
+import com.facebook.react.uimanager.ViewManager
+
+class TrueFitRecommendationPackage : ReactPackage {
+    override fun createNativeModules(reactContext: ReactApplicationContext): List<NativeModule> = emptyList()
+
+    override fun createViewManagers(reactContext: ReactApplicationContext): List<ViewManager<*, *>> =
+        listOf(TrueFitRecommendationViewManager())
+}

package/android/src/main/java/com/truefit/reactnative/TrueFitRecommendationProps.kt

@@ -0,0 +1,95 @@
+package com.truefit.reactnative
+
+import com.facebook.react.bridge.ReadableMap
+import com.facebook.react.bridge.ReadableType
+import com.truefit.recommendation.TrueFitEnvironment
+import com.truefit.recommendation.TrueFitRecommendationConfig
+import com.truefit.recommendation.TrueFitRecommendationOptions
+
+/**
+ * Adapter mappers from React Native `ReadableMap` props to the standalone
+ * Android SDK's configuration types. The SDK owns the config shape and
+ * behaviour; this file only translates the JS props into it.
+ */
+object TrueFitRecommendationProps {
+
+    /**
+     * Builds an SDK config from the JS `config` prop, or null when the required
+     * fields (storeKey, storeStyle) are absent — the adapter defers loading
+     * until they arrive, mirroring the SDK's required-config contract.
+     */
+    fun configOrNull(map: ReadableMap?): TrueFitRecommendationConfig? {
+        if (map == null) return null
+
+        val storeKey = map.stringOrNull("storeKey").orEmpty()
+        val storeStyle = map.stringOrNull("storeStyle").orEmpty()
+        if (storeKey.isBlank() || storeStyle.isBlank()) return null
+
+        return TrueFitRecommendationConfig(
+            storeKey = storeKey,
+            storeStyle = storeStyle,
+            environment = mapEnvironment(map.stringOrNull("environment")),
+            uiLocale = map.stringOrNull("uiLocale")?.takeIf { it.isNotBlank() },
+            userToken = map.stringOrNull("userToken")?.takeIf { it.isNotBlank() },
+            // A full script URL overrides `environment` (e.g. a built bundle).
+            // Raw Vite dev entries (.ts) are not supported by the SDK.
+            scriptUrlOverride = map.stringOrNull("scriptUrl")?.takeIf { it.isNotBlank() },
+        )
+    }
+
+    fun options(map: ReadableMap?): TrueFitRecommendationOptions {
+        val defaults = TrueFitRecommendationOptions()
+        if (map == null) return defaults
+
+        return TrueFitRecommendationOptions(
+            minWidgetHeightDp = map.intOrDefault("minWidgetHeight", defaults.minWidgetHeightDp),
+            maxWidgetHeightDp = map.intOrDefault("maxWidgetHeight", defaults.maxWidgetHeightDp),
+            modalBackdropOpacity = map.floatOrDefault("modalBackdropOpacity", defaults.modalBackdropOpacity),
+            modalTransitionDurationMs = map.longOrDefault(
+                "modalTransitionDurationMs",
+                defaults.modalTransitionDurationMs,
+            ),
+            disableBackgroundScrollWhenModalOpen = map.booleanOrDefault(
+                "disableBackgroundScrollWhenModalOpen",
+                defaults.disableBackgroundScrollWhenModalOpen,
+            ),
+            heightAnimationDurationMs = map.longOrDefault(
+                "heightAnimationDurationMs",
+                defaults.heightAnimationDurationMs,
+            ),
+            debugLogging = map.booleanOrDefault("debugLogging", defaults.debugLogging),
+        )
+    }
+
+    private fun mapEnvironment(name: String?): TrueFitEnvironment = when (name?.lowercase()) {
+        "development", "dev" -> TrueFitEnvironment.Development
+        "prod", "production" -> TrueFitEnvironment.Prod
+        else -> TrueFitEnvironment.Prod
+    }
+}
+
+private fun ReadableMap.stringOrNull(name: String): String? {
+    if (!hasKey(name) || isNull(name)) return null
+
+    return when (getType(name)) {
+        ReadableType.String -> getString(name)
+        ReadableType.Number -> {
+            val value = getDouble(name)
+            val longValue = value.toLong()
+            if (value == longValue.toDouble()) longValue.toString() else value.toString()
+        }
+        else -> null
+    }
+}
+
+private fun ReadableMap.intOrDefault(name: String, defaultValue: Int): Int =
+    if (hasKey(name) && !isNull(name)) getDouble(name).toInt() else defaultValue
+
+private fun ReadableMap.longOrDefault(name: String, defaultValue: Long): Long =
+    if (hasKey(name) && !isNull(name)) getDouble(name).toLong() else defaultValue
+
+private fun ReadableMap.floatOrDefault(name: String, defaultValue: Float): Float =
+    if (hasKey(name) && !isNull(name)) getDouble(name).toFloat() else defaultValue
+
+private fun ReadableMap.booleanOrDefault(name: String, defaultValue: Boolean): Boolean =
+    if (hasKey(name) && !isNull(name)) getBoolean(name) else defaultValue

package/android/src/main/java/com/truefit/reactnative/TrueFitRecommendationView.kt

@@ -0,0 +1,52 @@
+package com.truefit.reactnative
+
+import android.content.Context
+import android.view.ViewGroup
+import android.widget.FrameLayout
+import com.truefit.recommendation.TrueFitRecommendationView as SdkRecommendationView
+
+/**
+ * Thin React Native adapter over the standalone Android SDK view
+ * ([SdkRecommendationView]). All WebView setup, JS bridge handling, widget and
+ * modal rendering, configuration, resize/height handling, navigation, cleanup
+ * and the sign-in popup live in the SDK; [sdkView] is instantiated directly
+ * from it.
+ *
+ * This wrapper adds only the React Native-specific layout integration: React
+ * Native (both the old and new architecture) skips measure/layout for children
+ * that are added or resized natively, so we force a layout pass ourselves.
+ * Without this the WebView can render stale or blank after the SDK reparents it
+ * between the inline widget and the modal overlay. Because [SdkRecommendationView]
+ * bubbles its `requestLayout()` up to this parent, hooking it here covers the
+ * reparenting the SDK does internally.
+ */
+class TrueFitRecommendationView(context: Context) : FrameLayout(context) {
+
+    val sdkView = SdkRecommendationView(context)
+
+    init {
+        // The widget must not be clipped when the SDK animates its height.
+        clipChildren = false
+        clipToPadding = false
+        addView(
+            sdkView,
+            LayoutParams(
+                ViewGroup.LayoutParams.MATCH_PARENT,
+                ViewGroup.LayoutParams.MATCH_PARENT,
+            ),
+        )
+    }
+
+    private val measureAndLayout = Runnable {
+        measure(
+            MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY),
+            MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY),
+        )
+        layout(left, top, right, bottom)
+    }
+
+    override fun requestLayout() {
+        super.requestLayout()
+        post(measureAndLayout)
+    }
+}

package/android/src/main/java/com/truefit/reactnative/TrueFitRecommendationViewManager.kt

@@ -0,0 +1,91 @@
+package com.truefit.reactnative
+
+import com.facebook.react.bridge.Arguments
+import com.facebook.react.bridge.ReactContext
+import com.facebook.react.bridge.ReadableMap
+import com.facebook.react.bridge.WritableMap
+import com.facebook.react.common.MapBuilder
+import com.facebook.react.uimanager.SimpleViewManager
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.annotations.ReactProp
+import com.facebook.react.uimanager.events.RCTEventEmitter
+import com.truefit.recommendation.TrueFitRecommendationView.PresentationMode
+
+class TrueFitRecommendationViewManager : SimpleViewManager<TrueFitRecommendationView>() {
+    override fun getName(): String = REACT_CLASS
+
+    override fun createViewInstance(reactContext: ThemedReactContext): TrueFitRecommendationView {
+        val view = TrueFitRecommendationView(reactContext)
+        // React Native lays out in density-independent units; the SDK reports
+        // widget height in device pixels, so convert px -> dp here.
+        val density = reactContext.resources.displayMetrics.density
+
+        view.sdkView.onPresentationModeChanged = { mode, styleId ->
+            val event = Arguments.createMap().apply {
+                putString("mode", if (mode == PresentationMode.Modal) "modal" else "widget")
+                if (styleId != null) putString("styleId", styleId) else putNull("styleId")
+            }
+            emitEvent(view, "topPresentationModeChange", event)
+        }
+        view.sdkView.onHeightChanged = { heightPx ->
+            val event = Arguments.createMap().apply {
+                putDouble("height", heightPx / density.toDouble())
+            }
+            emitEvent(view, "topHeightChange", event)
+        }
+        view.sdkView.onWidgetResult = { result ->
+            val event = Arguments.createMap().apply {
+                putString("styleId", result.styleId)
+                putBoolean("isWidgetVisible", result.isWidgetVisible)
+                putBoolean("isRegistered", result.isRegistered)
+                putBoolean("isTraveling", result.isTraveling)
+                putBoolean("isTravelingExternal", result.isTravelingExternal)
+                if (result.successType != null) putString("successType", result.successType) else putNull("successType")
+            }
+            emitEvent(view, "topWidgetResult", event)
+        }
+        view.sdkView.onAutoSizeSelect = { styleId, size ->
+            val event = Arguments.createMap().apply {
+                putString("styleId", styleId)
+                putString("size", size)
+            }
+            emitEvent(view, "topAutoSizeSelect", event)
+        }
+        return view
+    }
+
+    @ReactProp(name = "config")
+    fun setConfig(view: TrueFitRecommendationView, config: ReadableMap?) {
+        // Config props arrive incrementally; only load once the required fields
+        // are present. The SDK guards against reloading an unchanged config.
+        TrueFitRecommendationProps.configOrNull(config)?.let(view.sdkView::load)
+    }
+
+    @ReactProp(name = "options")
+    fun setOptions(view: TrueFitRecommendationView, options: ReadableMap?) {
+        view.sdkView.options = TrueFitRecommendationProps.options(options)
+    }
+
+    override fun onDropViewInstance(view: TrueFitRecommendationView) {
+        view.sdkView.dispose()
+        super.onDropViewInstance(view)
+    }
+
+    override fun getExportedCustomDirectEventTypeConstants(): MutableMap<String, Any> = hashMapOf(
+        "topPresentationModeChange" to MapBuilder.of("registrationName", "onPresentationModeChange"),
+        "topHeightChange" to MapBuilder.of("registrationName", "onHeightChange"),
+        "topWidgetResult" to MapBuilder.of("registrationName", "onWidgetResult"),
+        "topAutoSizeSelect" to MapBuilder.of("registrationName", "onAutoSizeSelect"),
+    )
+
+    private fun emitEvent(view: TrueFitRecommendationView, eventName: String, payload: WritableMap) {
+        val reactContext = view.context as? ReactContext ?: return
+        reactContext
+            .getJSModule(RCTEventEmitter::class.java)
+            .receiveEvent(view.id, eventName, payload)
+    }
+
+    companion object {
+        const val REACT_CLASS = "TrueFitRecommendationView"
+    }
+}

package/ios/TrueFitRecommendationView.swift

@@ -0,0 +1,186 @@
+import React
+import TrueFitRecommendation
+import UIKit
+
+// Thin React Native adapter over the standalone iOS SDK
+// (`TrueFitRecommendation`). All WebView setup, JS bridge handling, widget and
+// modal rendering, configuration, resize/height handling, navigation, cleanup
+// and the sign-in popup live in the SDK. This class only:
+//   - maps React Native `NSDictionary` props to the SDK config/options types,
+//   - forwards the SDK's callbacks to React Native `RCTDirectEventBlock`s,
+//   - integrates the SDK view into React Native's layout/lifecycle.
+//
+// The class is named distinctly from the SDK's `TrueFitRecommendationView`; the
+// JS component name ("TrueFitRecommendationView") is derived from the view
+// manager, not this class, so the public API is unchanged.
+@objc(TrueFitReactNativeView)
+final class TrueFitReactNativeView: UIView {
+    private let recommendationView = TrueFitRecommendationView()
+
+    // Event callbacks bridged to React Native (see the view manager). styleId
+    // identifies which product's flow changed; nil when the change did not
+    // originate from an open/close event.
+    @objc var onPresentationModeChange: RCTDirectEventBlock?
+    @objc var onHeightChange: RCTDirectEventBlock?
+    @objc var onWidgetResult: RCTDirectEventBlock?
+    @objc var onAutoSizeSelect: RCTDirectEventBlock?
+
+    @objc var config: NSDictionary? {
+        didSet { applyConfig() }
+    }
+
+    // Remapped from the JS `options` prop (see the .m) to avoid colliding with
+    // UIView semantics; maps to the SDK's `TrueFitRecommendationOptions`.
+    @objc var reactOptions: NSDictionary? {
+        didSet {
+            recommendationView.options = Self.options(from: reactOptions)
+            // Options changed (e.g. min/max height); re-map so a still-valid
+            // config reloads through the SDK if needed.
+            applyConfig()
+        }
+    }
+
+    override init(frame: CGRect) {
+        super.init(frame: frame)
+        setup()
+    }
+
+    required init?(coder: NSCoder) {
+        super.init(coder: coder)
+        setup()
+    }
+
+    // The adapter is not part of the SDK view's internal retain cycle
+    // (webView configuration -> message handler -> SDK view), so it deinits
+    // when React Native releases it on unmount. Disposing here removes the
+    // message handler, breaking that cycle so the SDK view is released too.
+    deinit {
+        recommendationView.dispose()
+    }
+
+    private func setup() {
+        backgroundColor = .clear
+        clipsToBounds = false
+
+        recommendationView.translatesAutoresizingMaskIntoConstraints = false
+        addSubview(recommendationView)
+        // The SDK view self-sizes and reports its height; React Native drives
+        // this container's height from onHeightChange. Pin the SDK view to fill
+        // the container so it tracks the React Native-provided frame.
+        NSLayoutConstraint.activate([
+            recommendationView.leadingAnchor.constraint(equalTo: leadingAnchor),
+            recommendationView.trailingAnchor.constraint(equalTo: trailingAnchor),
+            recommendationView.topAnchor.constraint(equalTo: topAnchor),
+            recommendationView.bottomAnchor.constraint(equalTo: bottomAnchor),
+        ])
+
+        recommendationView.onPresentationModeChanged = { [weak self] mode, styleId in
+            self?.onPresentationModeChange?([
+                "mode": mode == .modal ? "modal" : "widget",
+                "styleId": styleId ?? NSNull(),
+            ])
+        }
+        recommendationView.onHeightChanged = { [weak self] height in
+            // iOS measurements are already in points, which are React Native's
+            // layout units — no conversion required.
+            self?.onHeightChange?(["height": height])
+        }
+        recommendationView.onWidgetResult = { [weak self] result in
+            self?.onWidgetResult?([
+                "styleId": result.styleId,
+                "isWidgetVisible": result.isWidgetVisible,
+                "isRegistered": result.isRegistered,
+                "isTraveling": result.isTraveling,
+                "isTravelingExternal": result.isTravelingExternal,
+                "successType": result.successType ?? NSNull(),
+            ])
+        }
+        recommendationView.onAutoSizeSelect = { [weak self] styleId, size in
+            self?.onAutoSizeSelect?(["styleId": styleId, "size": size])
+        }
+    }
+
+    private func applyConfig() {
+        // Config props arrive incrementally; only load once the required
+        // fields are present, mirroring the SDK's required-config contract.
+        guard let config,
+              let mapped = Self.config(from: config) else { return }
+        recommendationView.load(mapped)
+    }
+
+    // MARK: - Prop mapping
+
+    private static func config(from dictionary: NSDictionary) -> TrueFitRecommendationConfig? {
+        guard let storeKey = string(dictionary["storeKey"]), !storeKey.isEmpty,
+              let storeStyle = string(dictionary["storeStyle"]), !storeStyle.isEmpty
+        else {
+            return nil
+        }
+
+        let environment = string(dictionary["environment"]).flatMap(mapEnvironment) ?? .prod
+        let uiLocale = string(dictionary["uiLocale"])?.nonEmpty
+        let userToken = string(dictionary["userToken"])?.nonEmpty
+        // A full script URL overrides `environment` (e.g. a built bundle). Raw
+        // Vite dev entries (.ts) are not supported by the SDK.
+        let scriptUrlOverride = string(dictionary["scriptUrl"])?.nonEmpty
+
+        return TrueFitRecommendationConfig(
+            storeKey: storeKey,
+            storeStyle: storeStyle,
+            environment: environment,
+            uiLocale: uiLocale,
+            userToken: userToken,
+            scriptUrlOverride: scriptUrlOverride
+        )
+    }
+
+    private static func mapEnvironment(_ name: String) -> TrueFitEnvironment {
+        switch name.lowercased() {
+        case "development", "dev":
+            .development
+        case "prod", "production":
+            .prod
+        default:
+            .prod
+        }
+    }
+
+    private static func options(from dictionary: NSDictionary?) -> TrueFitRecommendationOptions {
+        var options = TrueFitRecommendationOptions()
+        guard let dictionary else { return options }
+
+        if let value = dictionary["minWidgetHeight"] as? NSNumber {
+            options.minWidgetHeight = CGFloat(value.doubleValue)
+        }
+        if let value = dictionary["maxWidgetHeight"] as? NSNumber {
+            options.maxWidgetHeight = CGFloat(value.doubleValue)
+        }
+        if let value = dictionary["modalBackdropOpacity"] as? NSNumber {
+            options.modalBackdropOpacity = CGFloat(value.doubleValue)
+        }
+        if let durationMs = dictionary["modalTransitionDurationMs"] as? NSNumber {
+            options.modalTransitionDuration = durationMs.doubleValue / 1000
+        }
+        if let value = dictionary["disableBackgroundScrollWhenModalOpen"] as? Bool {
+            options.disableBackgroundScrollWhenModalOpen = value
+        }
+        if let durationMs = dictionary["heightAnimationDurationMs"] as? NSNumber {
+            options.heightAnimationDuration = durationMs.doubleValue / 1000
+        }
+        if let value = dictionary["debugLogging"] as? Bool {
+            options.debugLogging = value
+        }
+
+        return options
+    }
+
+    private static func string(_ value: Any?) -> String? {
+        if let string = value as? String { return string }
+        if let number = value as? NSNumber { return number.stringValue }
+        return nil
+    }
+}
+
+private extension String {
+    var nonEmpty: String? { isEmpty ? nil : self }
+}

package/ios/TrueFitRecommendationViewManager.m

@@ -0,0 +1,12 @@
+#import <React/RCTViewManager.h>
+
+@interface RCT_EXTERN_MODULE(TrueFitRecommendationViewManager, RCTViewManager)
+
+RCT_EXPORT_VIEW_PROPERTY(config, NSDictionary)
+RCT_REMAP_VIEW_PROPERTY(options, reactOptions, NSDictionary)
+RCT_EXPORT_VIEW_PROPERTY(onPresentationModeChange, RCTDirectEventBlock)
+RCT_EXPORT_VIEW_PROPERTY(onHeightChange, RCTDirectEventBlock)
+RCT_EXPORT_VIEW_PROPERTY(onWidgetResult, RCTDirectEventBlock)
+RCT_EXPORT_VIEW_PROPERTY(onAutoSizeSelect, RCTDirectEventBlock)
+
+@end

package/ios/TrueFitRecommendationViewManager.swift

@@ -0,0 +1,12 @@
+import React
+
+@objc(TrueFitRecommendationViewManager)
+final class TrueFitRecommendationViewManager: RCTViewManager {
+    override static func requiresMainQueueSetup() -> Bool {
+        true
+    }
+
+    override func view() -> UIView! {
+        TrueFitReactNativeView()
+    }
+}

package/lib/commonjs/index.js

@@ -0,0 +1,85 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TrueFitRecommendationView = TrueFitRecommendationView;
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _jsxRuntime = require("react/jsx-runtime");
+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); }
+/**
+ * Which True Fit environment to point at. The native SDKs resolve the widget
+ * script URL from this internally; consumers never pass raw URLs.
+ */
+
+/**
+ * Per-style recommendation state emitted by the widget's `widgetResult` event.
+ * `successType` is `'personal'` when the shopper has a profile-based
+ * recommendation, `'general'` for a generic one, and `null` when there is none.
+ */
+
+const NativeTrueFitRecommendationView = (0, _reactNative.requireNativeComponent)('TrueFitRecommendationView');
+const DEFAULT_MIN_HEIGHT = 86;
+function TrueFitRecommendationView({
+  config,
+  options,
+  style,
+  onPresentationModeChange,
+  onHeightChange,
+  onWidgetResult,
+  onAutoSizeSelect
+}) {
+  const minHeight = options?.minWidgetHeight ?? DEFAULT_MIN_HEIGHT;
+  const [measuredHeight, setMeasuredHeight] = (0, _react.useState)(minHeight);
+  const [presentationMode, setPresentationMode] = (0, _react.useState)('widget');
+  const handleHeightChange = (0, _react.useCallback)(event => {
+    const nextHeight = Math.max(event.nativeEvent.height, minHeight);
+    setMeasuredHeight(nextHeight);
+    onHeightChange?.(nextHeight);
+  }, [minHeight, onHeightChange]);
+  const handlePresentationModeChange = (0, _react.useCallback)(event => {
+    const nextMode = event.nativeEvent.mode;
+    setPresentationMode(nextMode);
+    onPresentationModeChange?.(nextMode, event.nativeEvent.styleId ?? null);
+  }, [onPresentationModeChange]);
+  const handleWidgetResult = (0, _react.useCallback)(event => {
+    onWidgetResult?.(event.nativeEvent);
+  }, [onWidgetResult]);
+  const handleAutoSizeSelect = (0, _react.useCallback)(event => {
+    onAutoSizeSelect?.(event.nativeEvent);
+  }, [onAutoSizeSelect]);
+  const containerStyle = (0, _react.useMemo)(() => [styles.container, style, {
+    height: measuredHeight,
+    minHeight,
+    zIndex: presentationMode === 'modal' ? 1000 : undefined,
+    elevation: presentationMode === 'modal' ? 16 : undefined
+  }], [measuredHeight, minHeight, presentationMode, style]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    style: containerStyle,
+    collapsable: false,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(NativeTrueFitRecommendationView, {
+      config: config,
+      options: options,
+      style: styles.nativeView,
+      onHeightChange: handleHeightChange,
+      onPresentationModeChange: handlePresentationModeChange,
+      onWidgetResult: handleWidgetResult,
+      onAutoSizeSelect: handleAutoSizeSelect
+    })
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  container: {
+    width: '100%',
+    overflow: 'visible',
+    position: 'relative'
+  },
+  nativeView: {
+    width: '100%',
+    height: '100%'
+  }
+});
+var _default = exports.default = TrueFitRecommendationView;
+//# sourceMappingURL=index.js.map

package/lib/commonjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","NativeTrueFitRecommendationView","requireNativeComponent","DEFAULT_MIN_HEIGHT","TrueFitRecommendationView","config","options","style","onPresentationModeChange","onHeightChange","onWidgetResult","onAutoSizeSelect","minHeight","minWidgetHeight","measuredHeight","setMeasuredHeight","useState","presentationMode","setPresentationMode","handleHeightChange","useCallback","event","nextHeight","Math","max","nativeEvent","height","handlePresentationModeChange","nextMode","mode","styleId","handleWidgetResult","handleAutoSizeSelect","containerStyle","useMemo","styles","container","zIndex","undefined","elevation","jsx","View","collapsable","children","nativeView","StyleSheet","create","width","overflow","position","_default","exports"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/package.json

@@ -0,0 +1 @@
+{"type":"commonjs"}

package/lib/module/index.js

@@ -0,0 +1,79 @@
+"use strict";
+
+import React, { useCallback, useMemo, useState } from 'react';
+import { requireNativeComponent, StyleSheet, View } from 'react-native';
+
+/**
+ * Which True Fit environment to point at. The native SDKs resolve the widget
+ * script URL from this internally; consumers never pass raw URLs.
+ */
+
+/**
+ * Per-style recommendation state emitted by the widget's `widgetResult` event.
+ * `successType` is `'personal'` when the shopper has a profile-based
+ * recommendation, `'general'` for a generic one, and `null` when there is none.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+const NativeTrueFitRecommendationView = requireNativeComponent('TrueFitRecommendationView');
+const DEFAULT_MIN_HEIGHT = 86;
+export function TrueFitRecommendationView({
+  config,
+  options,
+  style,
+  onPresentationModeChange,
+  onHeightChange,
+  onWidgetResult,
+  onAutoSizeSelect
+}) {
+  const minHeight = options?.minWidgetHeight ?? DEFAULT_MIN_HEIGHT;
+  const [measuredHeight, setMeasuredHeight] = useState(minHeight);
+  const [presentationMode, setPresentationMode] = useState('widget');
+  const handleHeightChange = useCallback(event => {
+    const nextHeight = Math.max(event.nativeEvent.height, minHeight);
+    setMeasuredHeight(nextHeight);
+    onHeightChange?.(nextHeight);
+  }, [minHeight, onHeightChange]);
+  const handlePresentationModeChange = useCallback(event => {
+    const nextMode = event.nativeEvent.mode;
+    setPresentationMode(nextMode);
+    onPresentationModeChange?.(nextMode, event.nativeEvent.styleId ?? null);
+  }, [onPresentationModeChange]);
+  const handleWidgetResult = useCallback(event => {
+    onWidgetResult?.(event.nativeEvent);
+  }, [onWidgetResult]);
+  const handleAutoSizeSelect = useCallback(event => {
+    onAutoSizeSelect?.(event.nativeEvent);
+  }, [onAutoSizeSelect]);
+  const containerStyle = useMemo(() => [styles.container, style, {
+    height: measuredHeight,
+    minHeight,
+    zIndex: presentationMode === 'modal' ? 1000 : undefined,
+    elevation: presentationMode === 'modal' ? 16 : undefined
+  }], [measuredHeight, minHeight, presentationMode, style]);
+  return /*#__PURE__*/_jsx(View, {
+    style: containerStyle,
+    collapsable: false,
+    children: /*#__PURE__*/_jsx(NativeTrueFitRecommendationView, {
+      config: config,
+      options: options,
+      style: styles.nativeView,
+      onHeightChange: handleHeightChange,
+      onPresentationModeChange: handlePresentationModeChange,
+      onWidgetResult: handleWidgetResult,
+      onAutoSizeSelect: handleAutoSizeSelect
+    })
+  });
+}
+const styles = StyleSheet.create({
+  container: {
+    width: '100%',
+    overflow: 'visible',
+    position: 'relative'
+  },
+  nativeView: {
+    width: '100%',
+    height: '100%'
+  }
+});
+export default TrueFitRecommendationView;
+//# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","useMemo","useState","requireNativeComponent","StyleSheet","View","jsx","_jsx","NativeTrueFitRecommendationView","DEFAULT_MIN_HEIGHT","TrueFitRecommendationView","config","options","style","onPresentationModeChange","onHeightChange","onWidgetResult","onAutoSizeSelect","minHeight","minWidgetHeight","measuredHeight","setMeasuredHeight","presentationMode","setPresentationMode","handleHeightChange","event","nextHeight","Math","max","nativeEvent","height","handlePresentationModeChange","nextMode","mode","styleId","handleWidgetResult","handleAutoSizeSelect","containerStyle","styles","container","zIndex","undefined","elevation","collapsable","children","nativeView","create","width","overflow","position"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/package.json

@@ -0,0 +1 @@
+{"type":"module"}

package/lib/typescript/index.d.ts

@@ -0,0 +1,60 @@
+import React from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+/**
+ * Which True Fit environment to point at. The native SDKs resolve the widget
+ * script URL from this internally; consumers never pass raw URLs.
+ */
+export type TrueFitEnvironment = 'development' | 'prod';
+export type TrueFitRecommendationConfig = {
+    environment?: TrueFitEnvironment;
+    storeKey?: string;
+    storeStyle?: string;
+    uiLocale?: string;
+    /** Connect user token to seed into the Android widget cookie store. */
+    userToken?: string;
+    /**
+     * Full widget script URL that overrides `environment` (e.g. a built bundle).
+     * The WebView origin is derived from it. Raw Vite dev entries (`.ts`) are not
+     * supported.
+     */
+    scriptUrl?: string;
+};
+export type TrueFitRecommendationOptions = {
+    minWidgetHeight?: number;
+    maxWidgetHeight?: number;
+    modalBackdropOpacity?: number;
+    modalTransitionDurationMs?: number;
+    disableBackgroundScrollWhenModalOpen?: boolean;
+    heightAnimationDurationMs?: number;
+    debugLogging?: boolean;
+};
+export type TrueFitPresentationMode = 'widget' | 'modal';
+/**
+ * Per-style recommendation state emitted by the widget's `widgetResult` event.
+ * `successType` is `'personal'` when the shopper has a profile-based
+ * recommendation, `'general'` for a generic one, and `null` when there is none.
+ */
+export type TrueFitWidgetResult = {
+    styleId: string;
+    isWidgetVisible: boolean;
+    isRegistered: boolean;
+    isTraveling: boolean;
+    isTravelingExternal: boolean;
+    successType: string | null;
+};
+export type TrueFitAutoSizeSelect = {
+    styleId: string;
+    size: string;
+};
+export type TrueFitRecommendationViewProps = {
+    config?: TrueFitRecommendationConfig;
+    options?: TrueFitRecommendationOptions;
+    style?: StyleProp<ViewStyle>;
+    onPresentationModeChange?: (mode: TrueFitPresentationMode, styleId?: string | null) => void;
+    onHeightChange?: (height: number) => void;
+    onWidgetResult?: (result: TrueFitWidgetResult) => void;
+    onAutoSizeSelect?: (selection: TrueFitAutoSizeSelect) => void;
+};
+export declare function TrueFitRecommendationView({ config, options, style, onPresentationModeChange, onHeightChange, onWidgetResult, onAutoSizeSelect, }: TrueFitRecommendationViewProps): React.JSX.Element;
+export default TrueFitRecommendationView;
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAC9D,OAAO,EAGL,SAAS,EAGT,SAAS,EACV,MAAM,cAAc,CAAC;AAEtB;;;GAGG;AACH,MAAM,MAAM,kBAAkB,GAAG,aAAa,GAAG,MAAM,CAAC;AAExD,MAAM,MAAM,2BAA2B,GAAG;IACxC,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,uEAAuE;IACvE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,4BAA4B,GAAG;IACzC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,oCAAoC,CAAC,EAAE,OAAO,CAAC;IAC/C,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEzD;;;;GAIG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,EAAE,MAAM,CAAC;IAChB,eAAe,EAAE,OAAO,CAAC;IACzB,YAAY,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,OAAO,CAAC;IACrB,mBAAmB,EAAE,OAAO,CAAC;IAC7B,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAqBF,MAAM,MAAM,8BAA8B,GAAG;IAC3C,MAAM,CAAC,EAAE,2BAA2B,CAAC;IACrC,OAAO,CAAC,EAAE,4BAA4B,CAAC;IACvC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,wBAAwB,CAAC,EAAE,CAAC,IAAI,EAAE,uBAAuB,EAAE,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC5F,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,mBAAmB,KAAK,IAAI,CAAC;IACvD,gBAAgB,CAAC,EAAE,CAAC,SAAS,EAAE,qBAAqB,KAAK,IAAI,CAAC;CAC/D,CAAC;AAQF,wBAAgB,yBAAyB,CAAC,EACxC,MAAM,EACN,OAAO,EACP,KAAK,EACL,wBAAwB,EACxB,cAAc,EACd,cAAc,EACd,gBAAgB,GACjB,EAAE,8BAA8B,qBAgEhC;AAcD,eAAe,yBAAyB,CAAC"}

package/package.json

@@ -0,0 +1,50 @@
+{
+  "name": "@tfcorp/consumer-app-react-native-sdk",
+  "version": "2.0.0-beta.1",
+  "description": "React Native bridge for the True Fit recommendation WebView SDK.",
+  "main": "lib/commonjs/index.js",
+  "module": "lib/module/index.js",
+  "types": "lib/typescript/index.d.ts",
+  "react-native": "lib/module/index.js",
+  "source": "src/index.tsx",
+  "homepage": "https://www.truefit.com",
+  "author": "True Fit <dev@truefit.com>",
+  "license": "SEE LICENSE IN LICENSE",
+  "files": [
+    "lib",
+    "android",
+    "ios",
+    "*.podspec",
+    "react-native.config.js",
+    "!**/build",
+    "!**/__tests__",
+    "!**/.gradle",
+    "!**/*.tsbuildinfo"
+  ],
+  "peerDependencies": {
+    "react": "*",
+    "react-native": "*"
+  },
+  "devDependencies": {
+    "@types/react": "^18.2.0",
+    "del-cli": "^5.1.0",
+    "react": "18.2.0",
+    "react-native": "0.74.5",
+    "react-native-builder-bob": "^0.30.0",
+    "typescript": "^5.0.0"
+  },
+  "react-native-builder-bob": {
+    "source": "src",
+    "output": "lib",
+    "targets": [
+      "commonjs",
+      "module",
+      "typescript"
+    ]
+  },
+  "scripts": {
+    "typecheck": "tsc --noEmit",
+    "clean": "del-cli lib",
+    "build": "bob build"
+  }
+}

package/react-native.config.js

@@ -0,0 +1,12 @@
+module.exports = {
+  dependency: {
+    platforms: {
+      android: {
+        sourceDir: './android',
+      },
+      ios: {
+        podspecPath: './TrueFitReactNativeWebViewSdk.podspec',
+      },
+    },
+  },
+};