@sagepilot-ai/react-native-sdk 0.2.2 → 0.2.3

package/dist/{index.cjs → index.mjs}

@@ -1,34 +1,3 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/index.ts
-var index_exports = {};
-__export(index_exports, {
-  SagepilotChat: () => SagepilotChat,
-  SagepilotChatError: () => SagepilotChatError,
-  SagepilotChatProvider: () => SagepilotChatProvider,
-  createAsyncStorageCacheStorage: () => createAsyncStorageCacheStorage,
-  createKeychainTokenStorage: () => createKeychainTokenStorage,
-  useSagepilotChat: () => useSagepilotChat
-});
-module.exports = __toCommonJS(index_exports);
-
 // src/core/errors/SagepilotChatError.ts
 var SagepilotChatError = class extends Error {
   constructor(code, message, options = {}) {
@@ -46,7 +15,7 @@ var SagepilotChatError = class extends Error {
 
 // src/core/config/constants.ts
 var SDK_NAME = "@sagepilot-ai/react-native-sdk";
-var SDK_VERSION = "0.2.0";
+var SDK_VERSION = "0.2.3";
 var DEFAULT_HOST = "https://app.sagepilot.ai";
 var DEFAULT_WIDGET_HOST = "https://app.sagepilot.ai";
 var CUSTOMER_API_PREFIX = "/customer-api/v1";
@@ -732,9 +701,9 @@ var SagepilotReactNativeChat = class {
     this.hostedChatView = { screen: "messages" };
     return this.showHostedChat();
   }
-  presentMessageComposer(message) {
+  presentMessageComposer(message, options) {
     this.requireConfigured();
-    this.hostedChatView = { screen: "composer", message };
+    this.hostedChatView = { screen: "composer", message, mode: options?.mode ?? "auto" };
     return this.showHostedChat();
   }
   dismiss() {
@@ -834,7 +803,9 @@ var SagepilotReactNativeChat = class {
       url.searchParams.set("jwt", this.legacyWidgetJwt);
     }
     if (this.hostedChatView.screen === "composer") {
-      url.searchParams.set("new", "true");
+      if (this.hostedChatView.mode === "new") {
+        url.searchParams.set("new", "true");
+      }
       if (this.hostedChatView.message) {
         url.searchParams.set("topic", this.hostedChatView.message);
       }
@@ -1064,7 +1035,9 @@ var SagepilotChat = {
   stopUnreadPolling: () => internalSagepilotChat.stopUnreadPolling(),
   present: () => internalSagepilotChat.present(),
   presentMessages: () => internalSagepilotChat.presentMessages(),
-  presentMessageComposer: (message) => internalSagepilotChat.presentMessageComposer(message),
+  presentMessageComposer: (message, options) => {
+    return internalSagepilotChat.presentMessageComposer(message, options);
+  },
   dismiss: () => internalSagepilotChat.dismiss(),
   hide: () => internalSagepilotChat.hide(),
   toggle: () => internalSagepilotChat.toggle(),
@@ -1090,9 +1063,19 @@ function createAsyncStorageCacheStorage(asyncStorage) {
 }
 
 // src/ui/SagepilotChatProvider.ts
-var import_react = require("react");
-var import_react_native = require("react-native");
-var import_react_native_webview = require("react-native-webview");
+import { createElement, useCallback, useEffect, useRef, useState } from "react";
+import {
+  ActivityIndicator,
+  KeyboardAvoidingView,
+  Modal,
+  Platform,
+  Pressable,
+  SafeAreaView,
+  StyleSheet,
+  Text,
+  View
+} from "react-native";
+import { WebView } from "react-native-webview";
 
 // src/core/webview/mobileBridge.ts
 function isHostedBridgeMessage(value) {
@@ -1173,6 +1156,28 @@ var mobileWebViewBridgeScript = `
       } catch (error) {}
     }, true);
 
+    document.addEventListener("focusin", function (event) {
+      try {
+        var target = event.target && event.target.closest
+          ? event.target
+          : event.target && event.target.parentElement;
+        if (target && target.closest && target.closest("input, textarea, [contenteditable='true']")) {
+          sendToReactNative({ type: "sagepilot:keyboard_focus" });
+        }
+      } catch (error) {}
+    }, true);
+
+    document.addEventListener("focusout", function (event) {
+      try {
+        var target = event.target && event.target.closest
+          ? event.target
+          : event.target && event.target.parentElement;
+        if (target && target.closest && target.closest("input, textarea, [contenteditable='true']")) {
+          sendToReactNative({ type: "sagepilot:keyboard_blur" });
+        }
+      } catch (error) {}
+    }, true);
+
     ensureViewport();
     injectMobileStyles();
     sendToReactNative({ type: "sagepilot:ready" });
@@ -1180,6 +1185,10 @@ var mobileWebViewBridgeScript = `
   })();
 `;
 
+// src/specs/SagepilotInsetsViewNativeComponent.ts
+import codegenNativeComponent from "react-native/Libraries/Utilities/codegenNativeComponent";
+var SagepilotInsetsViewNativeComponent_default = codegenNativeComponent("SagepilotInsetsView");
+
 // src/ui/SagepilotChatProvider.ts
 function readPresentationState() {
   return {
@@ -1222,30 +1231,62 @@ function readUrlOrigin(url) {
 var hostedChatWebViewProps = {
   allowFileAccess: true,
   allowFileAccessFromFileURLs: true,
+  bounces: false,
   domStorageEnabled: true,
   javaScriptEnabled: true,
+  overScrollMode: "never",
+  scrollEnabled: Platform.OS !== "android",
   setSupportMultipleWindows: false,
   sharedCookiesEnabled: true,
   thirdPartyCookiesEnabled: true
 };
+var AndroidInsetsView = Platform.OS === "android" ? SagepilotInsetsViewNativeComponent_default : View;
+var emptyAndroidInsets = { top: 0, bottom: 0 };
 function SagepilotChatProvider({
   children,
   closeLabel = "Close",
   loadingLabel = "Loading chat"
 }) {
-  const [state, setState] = (0, import_react.useState)(readPresentationState);
-  const webFrameRef = (0, import_react.useRef)(null);
-  const nativeWebViewRef = (0, import_react.useRef)(null);
-  (0, import_react.useEffect)(() => {
+  const [state, setState] = useState(readPresentationState);
+  const [androidModalInsets, setAndroidModalInsets] = useState(emptyAndroidInsets);
+  const webFrameRef = useRef(null);
+  const nativeWebViewRef = useRef(null);
+  useEffect(() => {
     return internalSagepilotChat.onStateChange(() => {
       setState(readPresentationState());
     });
   }, []);
+  const handleAndroidInsetsChange = useCallback((event) => {
+    const nextBottomInset = event.nativeEvent?.bottom;
+    const nextTopInset = event.nativeEvent?.top;
+    if (typeof nextBottomInset !== "number" || typeof nextTopInset !== "number" || !Number.isFinite(nextBottomInset) || !Number.isFinite(nextTopInset)) return;
+    setAndroidModalInsets({
+      top: Math.max(0, nextTopInset),
+      bottom: Math.max(0, nextBottomInset)
+    });
+  }, []);
   const showCloseButton = state.presentation?.showCloseButton ?? false;
   const presentationStyle = state.presentation?.style ?? "sheet";
   const isFullScreenModal = presentationStyle === "fullScreen";
   const animationType = presentationStyle === "fullScreen" || presentationStyle === "push" ? "slide" : "fade";
-  const ModalContainer = import_react_native.Platform.OS === "ios" && isFullScreenModal ? import_react_native.SafeAreaView : import_react_native.View;
+  const ModalContainer = Platform.OS === "ios" && isFullScreenModal ? SafeAreaView : View;
+  const NativeModalContainer = Platform.OS === "android" ? AndroidInsetsView : ModalContainer;
+  const ChatContentContainer = Platform.OS === "ios" ? KeyboardAvoidingView : View;
+  const nativeModalContainerProps = Platform.OS === "android" ? { style: styles.container, onInsetsChange: handleAndroidInsetsChange } : { style: styles.container };
+  const chatContentContainerProps = Platform.OS === "ios" ? {
+    behavior: "padding",
+    enabled: true,
+    keyboardVerticalOffset: 0,
+    style: styles.modalContent
+  } : {
+    style: [
+      styles.modalContent,
+      Platform.OS === "android" ? {
+        paddingTop: androidModalInsets.top,
+        paddingBottom: androidModalInsets.bottom
+      } : null
+    ].filter(Boolean)
+  };
   const handleWebViewMessage = (event) => {
     internalSagepilotChat.handleHostedBridgeMessage(parseHostedBridgeMessage(event.nativeEvent?.data));
   };
@@ -1260,8 +1301,8 @@ function SagepilotChatProvider({
     if (!script || !nativeWebViewRef.current) return;
     nativeWebViewRef.current.injectJavaScript(script);
   };
-  (0, import_react.useEffect)(() => {
-    if (import_react_native.Platform.OS !== "web" || typeof window === "undefined") return;
+  useEffect(() => {
+    if (Platform.OS !== "web" || typeof window === "undefined") return;
     const trustedWidgetOrigin = readUrlOrigin(state.conversationUrl);
     if (!trustedWidgetOrigin) return;
     const handleWindowMessage = (event) => {
@@ -1271,41 +1312,41 @@ function SagepilotChatProvider({
     window.addEventListener("message", handleWindowMessage);
     return () => window.removeEventListener("message", handleWindowMessage);
   }, [state.conversationUrl]);
-  (0, import_react.useEffect)(() => {
-    if (import_react_native.Platform.OS !== "web" || !state.isPresented) return;
+  useEffect(() => {
+    if (Platform.OS !== "web" || !state.isPresented) return;
     postIdentityToWebFrame();
   }, [state.isPresented, state.conversationUrl, state.configured]);
-  (0, import_react.useEffect)(() => {
-    if (import_react_native.Platform.OS === "web" || !state.isPresented) return;
+  useEffect(() => {
+    if (Platform.OS === "web" || !state.isPresented) return;
     postIdentityToNativeWebView();
   }, [state.isPresented, state.conversationUrl, state.configured]);
-  if (import_react_native.Platform.OS === "web") {
-    return (0, import_react.createElement)(
-      import_react_native.View,
+  if (Platform.OS === "web") {
+    return createElement(
+      View,
       { style: styles.root },
       children,
-      state.configured && !state.isPresented && state.shouldPreload && state.preloadUrl ? (0, import_react.createElement)("iframe", {
+      state.configured && !state.isPresented && state.shouldPreload && state.preloadUrl ? createElement("iframe", {
         src: state.preloadUrl,
         style: styles.webPreloadFrame,
         title: "Sagepilot chat preload"
       }) : null,
-      state.configured && state.isPresented && state.conversationUrl ? (0, import_react.createElement)(
-        import_react_native.View,
+      state.configured && state.isPresented && state.conversationUrl ? createElement(
+        View,
         { style: styles.webOverlay },
-        (0, import_react.createElement)(
-          import_react_native.View,
+        createElement(
+          View,
           { style: styles.webPanel },
-          showCloseButton ? (0, import_react.createElement)(
-            import_react_native.Pressable,
+          showCloseButton ? createElement(
+            Pressable,
             {
               accessibilityRole: "button",
               accessibilityLabel: closeLabel,
               onPress: () => internalSagepilotChat.dismiss(),
               style: styles.webCloseButton
             },
-            (0, import_react.createElement)(import_react_native.Text, { style: styles.closeText }, closeLabel)
+            createElement(Text, { style: styles.closeText }, closeLabel)
           ) : null,
-          (0, import_react.createElement)("iframe", {
+          createElement("iframe", {
             ref: webFrameRef,
             src: state.conversationUrl,
             style: styles.webFrame,
@@ -1316,63 +1357,69 @@ function SagepilotChatProvider({
       ) : null
     );
   }
-  return (0, import_react.createElement)(
-    import_react_native.View,
+  return createElement(
+    View,
     { style: styles.root },
     children,
-    state.configured && !state.isPresented && state.shouldPreload && state.preloadUrl ? (0, import_react.createElement)(import_react_native_webview.WebView, {
+    state.configured && !state.isPresented && state.shouldPreload && state.preloadUrl ? createElement(WebView, {
       ...hostedChatWebViewProps,
       source: { uri: state.preloadUrl },
       style: styles.preloadWebview,
       injectedJavaScriptBeforeContentLoaded: getInjectedWebViewScript(),
       onMessage: handleWebViewMessage
     }) : null,
-    (0, import_react.createElement)(
-      import_react_native.Modal,
+    createElement(
+      Modal,
       {
         visible: state.configured && state.isPresented,
         animationType,
         presentationStyle: isFullScreenModal ? "fullScreen" : "pageSheet",
+        statusBarTranslucent: Platform.OS === "android",
+        navigationBarTranslucent: Platform.OS === "android",
         onRequestClose: () => internalSagepilotChat.dismiss()
       },
-      (0, import_react.createElement)(
-        ModalContainer,
-        { style: styles.container },
-        showCloseButton ? (0, import_react.createElement)(
-          import_react_native.View,
-          { style: styles.header },
-          (0, import_react.createElement)(
-            import_react_native.Pressable,
-            {
-              accessibilityRole: "button",
-              accessibilityLabel: closeLabel,
-              onPress: () => internalSagepilotChat.dismiss(),
-              style: styles.closeButton
-            },
-            (0, import_react.createElement)(import_react_native.Text, { style: styles.closeText }, closeLabel)
-          )
-        ) : null,
-        state.conversationUrl ? (0, import_react.createElement)(import_react_native_webview.WebView, {
-          ...hostedChatWebViewProps,
-          ref: nativeWebViewRef,
-          source: { uri: state.conversationUrl },
-          style: styles.webview,
-          startInLoadingState: true,
-          injectedJavaScriptBeforeContentLoaded: getInjectedWebViewScript(),
-          onMessage: handleWebViewMessage,
-          onLoadEnd: postIdentityToNativeWebView,
-          renderLoading: () => (0, import_react.createElement)(
-            import_react_native.View,
-            { style: styles.loading },
-            (0, import_react.createElement)(import_react_native.ActivityIndicator, null),
-            (0, import_react.createElement)(import_react_native.Text, { style: styles.loadingText }, loadingLabel)
-          )
-        }) : null
+      createElement(
+        NativeModalContainer,
+        nativeModalContainerProps,
+        createElement(
+          ChatContentContainer,
+          chatContentContainerProps,
+          showCloseButton ? createElement(
+            View,
+            { style: styles.header },
+            createElement(
+              Pressable,
+              {
+                accessibilityRole: "button",
+                accessibilityLabel: closeLabel,
+                onPress: () => internalSagepilotChat.dismiss(),
+                style: styles.closeButton
+              },
+              createElement(Text, { style: styles.closeText }, closeLabel)
+            )
+          ) : null,
+          state.conversationUrl ? createElement(WebView, {
+            ...hostedChatWebViewProps,
+            ref: nativeWebViewRef,
+            source: { uri: state.conversationUrl },
+            style: styles.webview,
+            startInLoadingState: true,
+            injectedJavaScriptBeforeContentLoaded: getInjectedWebViewScript(),
+            onMessage: handleWebViewMessage,
+            onLoadEnd: postIdentityToNativeWebView,
+            renderLoading: () => createElement(
+              View,
+              { style: styles.loading },
+              createElement(ActivityIndicator, null),
+              createElement(Text, { style: styles.loadingText }, loadingLabel)
+            )
+          }) : null
+        )
       )
     )
   );
 }
-var styles = import_react_native.StyleSheet.create({
+var styles = StyleSheet.create({
   root: {
     flex: 1
   },
@@ -1380,6 +1427,11 @@ var styles = import_react_native.StyleSheet.create({
     flex: 1,
     backgroundColor: "#ffffff"
   },
+  modalContent: {
+    flex: 1,
+    width: "100%",
+    backgroundColor: "#ffffff"
+  },
   header: {
     minHeight: 48,
     alignItems: "flex-end",
@@ -1453,7 +1505,7 @@ var styles = import_react_native.StyleSheet.create({
     borderStyle: "none"
   },
   loading: {
-    ...import_react_native.StyleSheet.absoluteFillObject,
+    ...StyleSheet.absoluteFillObject,
     alignItems: "center",
     justifyContent: "center",
     backgroundColor: "#ffffff"
@@ -1466,7 +1518,7 @@ var styles = import_react_native.StyleSheet.create({
 });
 
 // src/hooks/useSagepilotChat.ts
-var import_react2 = require("react");
+import { useCallback as useCallback2, useEffect as useEffect2, useState as useState2 } from "react";
 function readState() {
   const state = SagepilotChat.getState();
   return {
@@ -1478,23 +1530,25 @@ function readState() {
   };
 }
 function useSagepilotChat() {
-  const [state, setState] = (0, import_react2.useState)(readState);
-  (0, import_react2.useEffect)(() => {
+  const [state, setState] = useState2(readState);
+  useEffect2(() => {
     return SagepilotChat.onStateChange(() => {
       setState(readState());
     });
   }, []);
-  const present = (0, import_react2.useCallback)(() => SagepilotChat.present(), []);
-  const presentMessages = (0, import_react2.useCallback)(() => SagepilotChat.presentMessages(), []);
-  const presentMessageComposer = (0, import_react2.useCallback)((message) => SagepilotChat.presentMessageComposer(message), []);
-  const dismiss = (0, import_react2.useCallback)(() => SagepilotChat.dismiss(), []);
-  const hide = (0, import_react2.useCallback)(() => SagepilotChat.hide(), []);
-  const toggle = (0, import_react2.useCallback)(() => SagepilotChat.toggle(), []);
-  const identify = (0, import_react2.useCallback)((identity) => {
+  const present = useCallback2(() => SagepilotChat.present(), []);
+  const presentMessages = useCallback2(() => SagepilotChat.presentMessages(), []);
+  const presentMessageComposer = useCallback2((message, options) => {
+    return SagepilotChat.presentMessageComposer(message, options);
+  }, []);
+  const dismiss = useCallback2(() => SagepilotChat.dismiss(), []);
+  const hide = useCallback2(() => SagepilotChat.hide(), []);
+  const toggle = useCallback2(() => SagepilotChat.toggle(), []);
+  const identify = useCallback2((identity) => {
     return SagepilotChat.identify(identity);
   }, []);
-  const logout = (0, import_react2.useCallback)(() => SagepilotChat.logout(), []);
-  const getUnreadCount = (0, import_react2.useCallback)(() => SagepilotChat.getUnreadCount(), []);
+  const logout = useCallback2(() => SagepilotChat.logout(), []);
+  const getUnreadCount = useCallback2(() => SagepilotChat.getUnreadCount(), []);
   return {
     ...state,
     present,
@@ -1508,12 +1562,11 @@ function useSagepilotChat() {
     getUnreadCount
   };
 }
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
+export {
   SagepilotChat,
   SagepilotChatError,
   SagepilotChatProvider,
   createAsyncStorageCacheStorage,
   createKeychainTokenStorage,
   useSagepilotChat
-});
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sagepilot-ai/react-native-sdk",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "description": "Sagepilot AI React Native chat SDK",
   "keywords": [
     "sagepilot",
@@ -11,28 +11,38 @@
     "sdk"
   ],
   "license": "MIT",
-  "type": "module",
-  "main": "./dist/index.cjs",
-  "module": "./dist/index.js",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "react-native": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.js",
-      "require": "./dist/index.cjs"
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
     }
   },
   "files": [
     "LICENSE.md",
-    "android",
+    "android/build.gradle",
+    "android/src",
     "dist",
     "ios",
     "react-native.config.js",
+    "src/specs",
     "README.md"
   ],
+  "codegenConfig": {
+    "name": "SagepilotReactNativeSdkSpec",
+    "type": "components",
+    "jsSrcsDir": "./src/specs",
+    "android": {
+      "javaPackageName": "ai.sagepilot.reactnativesdk"
+    }
+  },
   "sideEffects": false,
   "scripts": {
-    "build": "tsup src/index.ts --format esm,cjs --dts --clean --external react --external react-native --external react-native-webview",
+    "build": "tsup",
     "typecheck": "tsc --noEmit",
     "prepublishOnly": "npm run typecheck && npm run build"
   },

package/react-native.config.js

@@ -2,7 +2,11 @@ module.exports = {
   dependency: {
     platforms: {
       ios: {},
-      android: {}
+      android: {
+        sourceDir: "./android",
+        packageImportPath: "import ai.sagepilot.reactnativesdk.SagepilotReactNativeSdkPackage;",
+        packageInstance: "new SagepilotReactNativeSdkPackage()"
+      }
     }
   }
 };

package/src/specs/SagepilotInsetsViewNativeComponent.ts

@@ -0,0 +1,17 @@
+import type { HostComponent, ViewProps } from "react-native";
+import type { DirectEventHandler, Double } from "react-native/Libraries/Types/CodegenTypes";
+import codegenNativeComponent from "react-native/Libraries/Utilities/codegenNativeComponent";
+
+export type SagepilotInsetsChangeEvent = Readonly<{
+  top: Double;
+  bottom: Double;
+  imeBottom: Double;
+  systemBarsBottom: Double;
+  keyboardVisible: boolean;
+}>;
+
+export interface NativeProps extends ViewProps {
+  onInsetsChange?: DirectEventHandler<SagepilotInsetsChangeEvent>;
+}
+
+export default codegenNativeComponent<NativeProps>("SagepilotInsetsView") as HostComponent<NativeProps>;

package/android/.gitkeep

@@ -1 +0,0 @@
-