@rematter/pylon-react-native 0.1.4 → 0.1.6

package/android/src/main/java/com/pylonchat/reactnative/RNPylonChatView.kt

@@ -18,96 +18,107 @@ import com.pylon.chatwidget.PylonUser
  * This is kept as minimal as possible to avoid interfering with touch pass-through.
  */
 class RNPylonChatView(context: Context) : FrameLayout(context) {
-    
+
     private var pylonChatView: PylonChatView? = null
     private var config: PylonConfig? = null
     private var user: PylonUser? = null
-    
+
     // Config properties
     var appId: String? = null
         set(value) {
             field = value
             updateConfig()
         }
-    
+
     var widgetBaseUrl: String? = null
         set(value) {
             field = value
             updateConfig()
         }
-    
+
     var widgetScriptUrl: String? = null
         set(value) {
             field = value
             updateConfig()
         }
-    
+
     var enableLogging: Boolean = true
         set(value) {
             field = value
             updateConfig()
         }
-    
+
     var debugMode: Boolean = false
         set(value) {
             field = value
             updateConfig()
         }
-    
+
     var primaryColor: String? = null
         set(value) {
             field = value
             updateConfig()
         }
-    
+
     // User properties
     var userEmail: String? = null
         set(value) {
             field = value
             updateUser()
         }
-    
+
     var userName: String? = null
         set(value) {
             field = value
             updateUser()
         }
-    
+
     var userAvatarUrl: String? = null
         set(value) {
             field = value
             updateUser()
         }
-    
+
     var userEmailHash: String? = null
         set(value) {
             field = value
             updateUser()
         }
-    
+
     var userAccountId: String? = null
         set(value) {
             field = value
             updateUser()
         }
-    
+
     var userAccountExternalId: String? = null
         set(value) {
             field = value
             updateUser()
         }
 
+    // Safe area top inset for coordinate space adjustment
+    var topInset: Float = 0f
+        set(value) {
+            field = value
+            // Apply to pylonChatView if it exists
+            pylonChatView?.let {
+                // Note: Android PylonChat doesn't have topInset support yet,
+                // but we store it here for future use or coordinate adjustments
+            }
+        }
+
     init {
         layoutParams = LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT)
     }
-    
+
     // Track pointer events setting
     private var pointerEventsMode = "auto"
-    
+
     fun setPointerEventsMode(mode: String) {
         pointerEventsMode = mode
     }
-    
+
     /**
      * This is the CRITICAL method for pointerEvents.
      * By returning false here when pointerEvents="none", we tell React Native's
@@ -139,7 +150,7 @@ class RNPylonChatView(context: Context) : FrameLayout(context) {
 
     private fun updateConfig() {
         val id = appId ?: return
-        
+
         config = PylonConfig.build(id) {
             this.enableLogging = this@RNPylonChatView.enableLogging
             this.primaryColor = this@RNPylonChatView.primaryColor
@@ -147,14 +158,14 @@ class RNPylonChatView(context: Context) : FrameLayout(context) {
             this@RNPylonChatView.widgetBaseUrl?.let { this.widgetBaseUrl = it }
             this@RNPylonChatView.widgetScriptUrl?.let { this.widgetScriptUrl = it }
         }
-        
+
         recreatePylonView()
     }
-    
+
     private fun updateUser() {
         val email = userEmail ?: return
         val name = userName ?: return
-        
+
         user = PylonUser(
             email = email,
             name = name,
@@ -163,48 +174,48 @@ class RNPylonChatView(context: Context) : FrameLayout(context) {
             accountId = userAccountId,
             accountExternalId = userAccountExternalId
         )
-        
+
         recreatePylonView()
     }
-    
+
     private fun recreatePylonView() {
         val cfg = config ?: return
         val usr = user ?: return
-        
+
         // Remove old view
         pylonChatView?.let { removeView(it) }
-        
+
         // Create new PylonChatView
         val newView = PylonChatView(context, cfg, usr)
         newView.setListener(object : PylonChatListener {
             override fun onPylonLoaded() {
                 sendEvent("onPylonLoaded", Arguments.createMap())
             }
-            
+
             override fun onPylonInitialized() {
                 sendEvent("onPylonInitialized", Arguments.createMap())
             }
-            
+
             override fun onPylonReady() {
                 sendEvent("onPylonReady", Arguments.createMap())
             }
-            
+
             override fun onMessageReceived(message: String) {
                 val params = Arguments.createMap()
                 params.putString("message", message)
                 sendEvent("onMessageReceived", params)
             }
-            
+
             override fun onChatOpened() {
                 sendEvent("onChatOpened", Arguments.createMap())
             }
-            
+
             override fun onChatClosed() {
                 val params = Arguments.createMap()
                 params.putBoolean("wasOpen", true)
                 sendEvent("onChatClosed", params)
             }
-            
+
             override fun onInteractiveBoundsChanged(selector: String, left: Float, top: Float, right: Float, bottom: Float) {
                 // Convert pixels to density-independent pixels (dp) for React Native.
                 val density = resources.displayMetrics.density
@@ -216,57 +227,57 @@ class RNPylonChatView(context: Context) : FrameLayout(context) {
                 params.putDouble("bottom", (bottom / density).toDouble())
                 sendEvent("onInteractiveBoundsChanged", params)
             }
-            
+
             override fun onPylonError(error: String) {
                 val params = Arguments.createMap()
                 params.putString("error", error)
                 sendEvent("onPylonError", params)
             }
-            
+
             override fun onUnreadCountChanged(count: Int) {
                 val params = Arguments.createMap()
                 params.putInt("count", count)
                 sendEvent("onUnreadCountChanged", params)
             }
-            
+
             override fun onFileChooserLaunched(requestCode: Int) {
                 // Handle file chooser if needed
             }
         })
-        
+
         newView.layoutParams = LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT)
         addView(newView)
         pylonChatView = newView
     }
-    
+
     private fun sendEvent(eventName: String, params: WritableMap) {
         val reactContext = context as ReactContext
         reactContext
             .getJSModule(RCTEventEmitter::class.java)
             .receiveEvent(id, eventName, params)
     }
-    
+
     // Imperative methods
     fun openChat() {
         pylonChatView?.openChat()
     }
-    
+
     fun closeChat() {
         pylonChatView?.closeChat()
     }
-    
+
     fun showChatBubble() {
         pylonChatView?.showChatBubble()
     }
-    
+
     fun hideChatBubble() {
         pylonChatView?.hideChatBubble()
     }
-    
+
     fun showNewMessage(message: String, isHtml: Boolean) {
         pylonChatView?.showNewMessage(message, isHtml)
     }
-    
+
     fun setNewIssueCustomFields(fields: Map<String, Any?>) {
         @Suppress("UNCHECKED_CAST")
         pylonChatView?.setNewIssueCustomFields(fields as Map<String, Any>)
@@ -276,19 +287,19 @@ class RNPylonChatView(context: Context) : FrameLayout(context) {
         @Suppress("UNCHECKED_CAST")
         pylonChatView?.setTicketFormFields(fields as Map<String, Any>)
     }
-    
+
     fun updateEmailHash(emailHash: String?) {
         pylonChatView?.setEmailHash(emailHash)
     }
-    
+
     fun showTicketForm(slug: String) {
         pylonChatView?.showTicketForm(slug)
     }
-    
+
     fun showKnowledgeBaseArticle(articleId: String) {
         pylonChatView?.showKnowledgeBaseArticle(articleId)
     }
-    
+
     fun clickElementAtSelector(selector: String) {
         // Trigger a click on the element with the given ID selector.
         // This is used for Android's proxy-based touch pass-through system.

package/android/src/main/java/com/pylonchat/reactnative/RNPylonChatViewManager.kt

@@ -15,7 +15,7 @@ import com.pylon.chatwidget.PylonConfig
 import com.pylon.chatwidget.PylonUser
 
 class RNPylonChatViewManager : SimpleViewManager<RNPylonChatView>() {
-    
+
     companion object {
         const val REACT_CLASS = "RNPylonChatView"
         const val COMMAND_OPEN_CHAT = 1
@@ -67,7 +67,7 @@ class RNPylonChatViewManager : SimpleViewManager<RNPylonChatView>() {
     fun setPointerEvents(view: RNPylonChatView, pointerEvents: String?) {
         val mode = pointerEvents ?: "auto"
         view.setPointerEventsMode(mode)
-        
+
         when (mode) {
             "none" -> {
                 // Don't handle any touches - let them pass through
@@ -128,6 +128,12 @@ class RNPylonChatViewManager : SimpleViewManager<RNPylonChatView>() {
         view.userAccountExternalId = id
     }
 
+    // Coordinate space adjustment
+    @ReactProp(name = "topInset", defaultFloat = 0f)
+    fun setTopInset(view: RNPylonChatView, inset: Float) {
+        view.topInset = inset
+    }
+
     // Event names
     override fun getExportedCustomDirectEventTypeConstants(): MutableMap<String, Any> {
         return MapBuilder.builder<String, Any>()

package/ios/RNPylonChatView.swift

@@ -14,61 +14,61 @@ import WebKit
 // Note: PylonChat files will be added to Xcode project from ../../ios/PylonChat/
 
 class RNPylonChatView: UIView {
-    
+
     private var pylonChatView: PylonChatView?
     private var config: PylonConfig?
     private var user: PylonUser?
-    
+
     // Config properties
     @objc var appId: NSString = "" {
         didSet { updateConfig() }
     }
-    
+
     @objc var widgetBaseUrl: NSString? {
         didSet { updateConfig() }
     }
-    
+
     @objc var widgetScriptUrl: NSString? {
         didSet { updateConfig() }
     }
-    
+
     @objc var enableLogging: Bool = true {
         didSet { updateConfig() }
     }
-    
+
     @objc var debugMode: Bool = false {
         didSet { updateConfig() }
     }
-    
+
     @objc var primaryColor: NSString? {
         didSet { updateConfig() }
     }
-    
+
     // User properties
     @objc var userEmail: NSString? {
         didSet { updateUser() }
     }
-    
+
     @objc var userName: NSString? {
         didSet { updateUser() }
     }
-    
+
     @objc var userAvatarUrl: NSString? {
         didSet { updateUser() }
     }
-    
+
     @objc var userEmailHash: NSString? {
         didSet { updateUser() }
     }
-    
+
     @objc var userAccountId: NSString? {
         didSet { updateUser() }
     }
-    
+
     @objc var userAccountExternalId: NSString? {
         didSet { updateUser() }
     }
-    
+
     // Safe area top inset for coordinate space adjustment
     @objc var topInset: NSNumber = 0 {
         didSet {
@@ -77,7 +77,7 @@ class RNPylonChatView: UIView {
             }
         }
     }
-    
+
     // Event callbacks - renamed to avoid collision with PylonChatListener methods
     @objc var rctOnPylonLoaded: RCTBubblingEventBlock?
     @objc var rctOnPylonInitialized: RCTBubblingEventBlock?
@@ -87,28 +87,28 @@ class RNPylonChatView: UIView {
     @objc var rctOnUnreadCountChanged: RCTBubblingEventBlock?
     @objc var rctOnMessageReceived: RCTBubblingEventBlock?
     @objc var rctOnPylonError: RCTBubblingEventBlock?
-    
+
     override init(frame: CGRect) {
         super.init(frame: frame)
         setupView()
     }
-    
+
     required init?(coder: NSCoder) {
         super.init(coder: coder)
         setupView()
     }
-    
+
     private func setupView() {
         backgroundColor = .clear
     }
-    
+
     // Override pointInside to make React Native call hitTest
     public override func point(inside point: CGPoint, with event: UIEvent?) -> Bool {
         // Always return true so React Native will call hitTest
         // The actual hit detection happens in hitTest
         return true
     }
-    
+
     // Forward hit testing to the embedded PylonChatView
     public override func hitTest(_ point: CGPoint, with event: UIEvent?) -> UIView? {
         // If we have a PylonChatView, let it handle hit testing
@@ -117,14 +117,14 @@ class RNPylonChatView: UIView {
             let convertedPoint = convert(point, to: pylonView)
             return pylonView.hitTest(convertedPoint, with: event)
         }
-        
+
         // If no PylonChatView yet, pass through (return nil)
         return nil
     }
-    
+
     private func updateConfig() {
         guard (appId as String).isEmpty == false else { return }
-        
+
         config = PylonConfig(
             appId: appId as String,
             enableLogging: enableLogging,
@@ -133,14 +133,14 @@ class RNPylonChatView: UIView {
             widgetBaseUrl: widgetBaseUrl as String?,
             widgetScriptUrl: widgetScriptUrl as String?
         )
-        
+
         recreatePylonView()
     }
-    
+
     private func updateUser() {
         guard let email = userEmail as String?,
               let name = userName as String? else { return }
-        
+
         user = PylonUser(
             email: email,
             name: name,
@@ -149,75 +149,75 @@ class RNPylonChatView: UIView {
             accountId: userAccountId as String?,
             accountExternalId: userAccountExternalId as String?
         )
-        
+
         recreatePylonView()
     }
-    
+
     private func recreatePylonView() {
         guard let config = config, let user = user else { return }
-        
+
         // Remove old view
         pylonChatView?.removeFromSuperview()
-        
+
         // Create new PylonChatView
         let newView = PylonChatView(config: config, user: user)
         newView.listener = self
         newView.topInset = CGFloat(truncating: topInset)
         newView.translatesAutoresizingMaskIntoConstraints = false
-        
+
         addSubview(newView)
-        
+
         NSLayoutConstraint.activate([
             newView.topAnchor.constraint(equalTo: topAnchor),
             newView.leadingAnchor.constraint(equalTo: leadingAnchor),
             newView.trailingAnchor.constraint(equalTo: trailingAnchor),
             newView.bottomAnchor.constraint(equalTo: bottomAnchor)
         ])
-        
+
         pylonChatView = newView
-        
+
         // Force layout
         setNeedsLayout()
         layoutIfNeeded()
     }
-    
+
     // Imperative methods (called from React Native)
     func openChat() {
         pylonChatView?.openChat()
     }
-    
+
     func closeChat() {
         pylonChatView?.closeChat()
     }
-    
+
     func showChatBubble() {
         pylonChatView?.showChatBubble()
     }
-    
+
     func hideChatBubble() {
         pylonChatView?.hideChatBubble()
     }
-    
+
     func showNewMessage(_ message: String, isHtml: Bool) {
         pylonChatView?.showNewMessage(message, isHtml: isHtml)
     }
-    
+
     func setNewIssueCustomFields(_ fields: [String: Any]) {
         pylonChatView?.setNewIssueCustomFields(fields)
     }
-    
+
     func setTicketFormFields(_ fields: [String: Any]) {
         pylonChatView?.setTicketFormFields(fields)
     }
-    
+
     func updateEmailHash(_ emailHash: String?) {
         pylonChatView?.updateEmailHash(emailHash)
     }
-    
+
     func showTicketForm(_ slug: String) {
         pylonChatView?.showTicketForm(slug)
     }
-    
+
     func showKnowledgeBaseArticle(_ articleId: String) {
         pylonChatView?.showKnowledgeBaseArticle(articleId)
     }
@@ -228,31 +228,31 @@ extension RNPylonChatView: PylonChatListener {
     func onPylonLoaded() {
         rctOnPylonLoaded?([:])
     }
-    
+
     func onPylonInitialized() {
         rctOnPylonInitialized?([:])
     }
-    
+
     func onPylonReady() {
         rctOnPylonReady?([:])
     }
-    
+
     func onMessageReceived(message: String) {
         rctOnMessageReceived?(["message": message])
     }
-    
+
     func onChatOpened() {
         rctOnChatOpened?([:])
     }
-    
+
     func onChatClosed(wasOpen: Bool) {
         rctOnChatClosed?(["wasOpen": wasOpen])
     }
-    
+
     func onPylonError(error: String) {
         rctOnPylonError?(["error": error])
     }
-    
+
     func onUnreadCountChanged(count: Int) {
         rctOnUnreadCountChanged?(["count": count])
     }
@@ -261,71 +261,90 @@ extension RNPylonChatView: PylonChatListener {
 // MARK: - Imperative method helpers
 extension RNPylonChatViewManager {
     @objc func openChat(_ reactTag: NSNumber) {
-        bridge.uiManager.addUIBlock { _, viewRegistry in
-            guard let view = viewRegistry?[reactTag] as? RNPylonChatView else { return }
+        self.bridge.uiManager.addUIBlock { uiManager, viewRegistry in
+            // Use uiManager.view(forReactTag:) instead of viewRegistry
+            guard let uiManager = uiManager else {
+                print("⚠️ RNPylonChat: uiManager is nil")
+                return
+            }
+
+            guard let view = uiManager.view(forReactTag: reactTag) as? RNPylonChatView else {
+                print("⚠️ RNPylonChat: Could not find view for reactTag: \(reactTag)")
+                return
+            }
+
             view.openChat()
         }
     }
-    
+
     @objc func closeChat(_ reactTag: NSNumber) {
-        bridge.uiManager.addUIBlock { _, viewRegistry in
-            guard let view = viewRegistry?[reactTag] as? RNPylonChatView else { return }
+        self.bridge.uiManager.addUIBlock { uiManager, _ in
+            guard let uiManager = uiManager,
+                  let view = uiManager.view(forReactTag: reactTag) as? RNPylonChatView else { return }
             view.closeChat()
         }
     }
-    
+
     @objc func showChatBubble(_ reactTag: NSNumber) {
-        bridge.uiManager.addUIBlock { _, viewRegistry in
-            guard let view = viewRegistry?[reactTag] as? RNPylonChatView else { return }
+        self.bridge.uiManager.addUIBlock { uiManager, _ in
+            guard let uiManager = uiManager,
+                  let view = uiManager.view(forReactTag: reactTag) as? RNPylonChatView else { return }
             view.showChatBubble()
         }
     }
-    
+
     @objc func hideChatBubble(_ reactTag: NSNumber) {
-        bridge.uiManager.addUIBlock { _, viewRegistry in
-            guard let view = viewRegistry?[reactTag] as? RNPylonChatView else { return }
+        self.bridge.uiManager.addUIBlock { uiManager, _ in
+            guard let uiManager = uiManager,
+                  let view = uiManager.view(forReactTag: reactTag) as? RNPylonChatView else { return }
             view.hideChatBubble()
         }
     }
-    
+
     @objc func showNewMessage(_ reactTag: NSNumber, message: NSString, isHtml: Bool) {
-        bridge.uiManager.addUIBlock { _, viewRegistry in
-            guard let view = viewRegistry?[reactTag] as? RNPylonChatView else { return }
+        self.bridge.uiManager.addUIBlock { uiManager, _ in
+            guard let uiManager = uiManager,
+                  let view = uiManager.view(forReactTag: reactTag) as? RNPylonChatView else { return }
             view.showNewMessage(message as String, isHtml: isHtml)
         }
     }
-    
+
     @objc func setNewIssueCustomFields(_ reactTag: NSNumber, fields: NSDictionary) {
-        bridge.uiManager.addUIBlock { _, viewRegistry in
-            guard let view = viewRegistry?[reactTag] as? RNPylonChatView else { return }
+        self.bridge.uiManager.addUIBlock { uiManager, _ in
+            guard let uiManager = uiManager,
+                  let view = uiManager.view(forReactTag: reactTag) as? RNPylonChatView else { return }
             view.setNewIssueCustomFields(fields as! [String: Any])
         }
     }
-    
+
     @objc func setTicketFormFields(_ reactTag: NSNumber, fields: NSDictionary) {
-        bridge.uiManager.addUIBlock { _, viewRegistry in
-            guard let view = viewRegistry?[reactTag] as? RNPylonChatView else { return }
+        self.bridge.uiManager.addUIBlock { uiManager, _ in
+            guard let uiManager = uiManager,
+                  let view = uiManager.view(forReactTag: reactTag) as? RNPylonChatView else { return }
             view.setTicketFormFields(fields as! [String: Any])
         }
     }
-    
+
     @objc func updateEmailHash(_ reactTag: NSNumber, emailHash: NSString?) {
-        bridge.uiManager.addUIBlock { _, viewRegistry in
-            guard let view = viewRegistry?[reactTag] as? RNPylonChatView else { return }
+        self.bridge.uiManager.addUIBlock { uiManager, _ in
+            guard let uiManager = uiManager,
+                  let view = uiManager.view(forReactTag: reactTag) as? RNPylonChatView else { return }
             view.updateEmailHash(emailHash as String?)
         }
     }
-    
+
     @objc func showTicketForm(_ reactTag: NSNumber, slug: NSString) {
-        bridge.uiManager.addUIBlock { _, viewRegistry in
-            guard let view = viewRegistry?[reactTag] as? RNPylonChatView else { return }
+        self.bridge.uiManager.addUIBlock { uiManager, _ in
+            guard let uiManager = uiManager,
+                  let view = uiManager.view(forReactTag: reactTag) as? RNPylonChatView else { return }
             view.showTicketForm(slug as String)
         }
     }
-    
+
     @objc func showKnowledgeBaseArticle(_ reactTag: NSNumber, articleId: NSString) {
-        bridge.uiManager.addUIBlock { _, viewRegistry in
-            guard let view = viewRegistry?[reactTag] as? RNPylonChatView else { return }
+        self.bridge.uiManager.addUIBlock { uiManager, _ in
+            guard let uiManager = uiManager,
+                  let view = uiManager.view(forReactTag: reactTag) as? RNPylonChatView else { return }
             view.showKnowledgeBaseArticle(articleId as String)
         }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rematter/pylon-react-native",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "description": "Pylon Chat SDK for React Native",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",