@rematter/pylon-react-native 0.1.4

package/ios/RNPylonChatView.swift

@@ -0,0 +1,332 @@
+//
+//  RNPylonChatView.swift
+//  RNPylonChat
+//
+//  Wrapper around PylonChatView for React Native
+//
+
+import Foundation
+import UIKit
+import React
+import WebKit
+
+// Import PylonChat from parent directory
+// 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 {
+            if let pylonView = pylonChatView {
+                pylonView.topInset = CGFloat(truncating: topInset)
+            }
+        }
+    }
+    
+    // Event callbacks - renamed to avoid collision with PylonChatListener methods
+    @objc var rctOnPylonLoaded: RCTBubblingEventBlock?
+    @objc var rctOnPylonInitialized: RCTBubblingEventBlock?
+    @objc var rctOnPylonReady: RCTBubblingEventBlock?
+    @objc var rctOnChatOpened: RCTBubblingEventBlock?
+    @objc var rctOnChatClosed: RCTBubblingEventBlock?
+    @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
+        if let pylonView = pylonChatView {
+            // Convert point to pylonView's coordinate space
+            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,
+            primaryColor: primaryColor as String?,
+            debugMode: debugMode,
+            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,
+            avatarUrl: userAvatarUrl as String?,
+            emailHash: userEmailHash as String?,
+            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)
+    }
+}
+
+// MARK: - PylonChatListener
+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])
+    }
+}
+
+// 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 }
+            view.openChat()
+        }
+    }
+    
+    @objc func closeChat(_ reactTag: NSNumber) {
+        bridge.uiManager.addUIBlock { _, viewRegistry in
+            guard let view = viewRegistry?[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 }
+            view.showChatBubble()
+        }
+    }
+    
+    @objc func hideChatBubble(_ reactTag: NSNumber) {
+        bridge.uiManager.addUIBlock { _, viewRegistry in
+            guard let view = viewRegistry?[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 }
+            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 }
+            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 }
+            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 }
+            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 }
+            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 }
+            view.showKnowledgeBaseArticle(articleId as String)
+        }
+    }
+}

package/ios/RNPylonChatViewManager.m

@@ -0,0 +1,55 @@
+//
+//  RNPylonChatViewManager.m
+//  RNPylonChat
+//
+//  React Native bridge to PylonChat iOS SDK
+//
+
+#import <React/RCTViewManager.h>
+#import <React/RCTBridgeModule.h>
+
+@interface RCT_EXTERN_MODULE(RNPylonChatViewManager, RCTViewManager)
+
+// Config props
+RCT_EXPORT_VIEW_PROPERTY(appId, NSString)
+RCT_EXPORT_VIEW_PROPERTY(widgetBaseUrl, NSString)
+RCT_EXPORT_VIEW_PROPERTY(widgetScriptUrl, NSString)
+RCT_EXPORT_VIEW_PROPERTY(enableLogging, BOOL)
+RCT_EXPORT_VIEW_PROPERTY(debugMode, BOOL)
+RCT_EXPORT_VIEW_PROPERTY(primaryColor, NSString)
+
+// User props
+RCT_EXPORT_VIEW_PROPERTY(userEmail, NSString)
+RCT_EXPORT_VIEW_PROPERTY(userName, NSString)
+RCT_EXPORT_VIEW_PROPERTY(userAvatarUrl, NSString)
+RCT_EXPORT_VIEW_PROPERTY(userEmailHash, NSString)
+RCT_EXPORT_VIEW_PROPERTY(userAccountId, NSString)
+RCT_EXPORT_VIEW_PROPERTY(userAccountExternalId, NSString)
+
+// Coordinate space adjustment
+RCT_EXPORT_VIEW_PROPERTY(topInset, NSNumber)
+
+// Event callbacks - remap JS prop names (onX) to Swift property names (rctOnX) to avoid protocol collision
+RCT_REMAP_VIEW_PROPERTY(onPylonLoaded, rctOnPylonLoaded, RCTBubblingEventBlock)
+RCT_REMAP_VIEW_PROPERTY(onPylonInitialized, rctOnPylonInitialized, RCTBubblingEventBlock)
+RCT_REMAP_VIEW_PROPERTY(onPylonReady, rctOnPylonReady, RCTBubblingEventBlock)
+RCT_REMAP_VIEW_PROPERTY(onChatOpened, rctOnChatOpened, RCTBubblingEventBlock)
+RCT_REMAP_VIEW_PROPERTY(onChatClosed, rctOnChatClosed, RCTBubblingEventBlock)
+RCT_REMAP_VIEW_PROPERTY(onUnreadCountChanged, rctOnUnreadCountChanged, RCTBubblingEventBlock)
+RCT_REMAP_VIEW_PROPERTY(onMessageReceived, rctOnMessageReceived, RCTBubblingEventBlock)
+RCT_REMAP_VIEW_PROPERTY(onPylonError, rctOnPylonError, RCTBubblingEventBlock)
+
+// Imperative methods
+RCT_EXTERN_METHOD(openChat:(nonnull NSNumber *)reactTag)
+RCT_EXTERN_METHOD(closeChat:(nonnull NSNumber *)reactTag)
+RCT_EXTERN_METHOD(showChatBubble:(nonnull NSNumber *)reactTag)
+RCT_EXTERN_METHOD(hideChatBubble:(nonnull NSNumber *)reactTag)
+RCT_EXTERN_METHOD(showNewMessage:(nonnull NSNumber *)reactTag message:(NSString *)message isHtml:(BOOL)isHtml)
+RCT_EXTERN_METHOD(setNewIssueCustomFields:(nonnull NSNumber *)reactTag fields:(NSDictionary *)fields)
+RCT_EXTERN_METHOD(setTicketFormFields:(nonnull NSNumber *)reactTag fields:(NSDictionary *)fields)
+RCT_EXTERN_METHOD(updateEmailHash:(nonnull NSNumber *)reactTag emailHash:(NSString *)emailHash)
+RCT_EXTERN_METHOD(showTicketForm:(nonnull NSNumber *)reactTag slug:(NSString *)slug)
+RCT_EXTERN_METHOD(showKnowledgeBaseArticle:(nonnull NSNumber *)reactTag articleId:(NSString *)articleId)
+
+@end
+

package/ios/RNPylonChatViewManager.swift

@@ -0,0 +1,23 @@
+//
+//  RNPylonChatViewManager.swift
+//  RNPylonChat
+//
+//  React Native bridge to PylonChat iOS SDK
+//
+
+import Foundation
+import UIKit
+import React
+
+@objc(RNPylonChatViewManager)
+class RNPylonChatViewManager: RCTViewManager {
+
+    override static func requiresMainQueueSetup() -> Bool {
+        return true
+    }
+
+    override func view() -> UIView! {
+        return RNPylonChatView()
+    }
+}
+

package/lib/PylonChatView.d.ts

@@ -0,0 +1,27 @@
+import React from "react";
+import { ViewStyle } from "react-native";
+import type { PylonChatListener, PylonConfig, PylonUser } from "./types";
+export interface PylonChatViewRef {
+    openChat: () => void;
+    closeChat: () => void;
+    showChatBubble: () => void;
+    hideChatBubble: () => void;
+    showNewMessage: (message: string, isHtml?: boolean) => void;
+    setNewIssueCustomFields: (fields: Record<string, any>) => void;
+    setTicketFormFields: (fields: Record<string, any>) => void;
+    updateEmailHash: (emailHash: string | null) => void;
+    showTicketForm: (slug: string) => void;
+    showKnowledgeBaseArticle: (articleId: string) => void;
+}
+export interface PylonChatViewInternalRef extends PylonChatViewRef {
+    clickElementAtSelector: (selector: string) => void;
+}
+interface PylonChatViewProps {
+    config: PylonConfig;
+    user?: PylonUser;
+    style?: ViewStyle;
+    listener?: PylonChatListener;
+    topInset?: number;
+}
+export declare const PylonChatView: React.ForwardRefExoticComponent<PylonChatViewProps & React.RefAttributes<PylonChatViewInternalRef>>;
+export default PylonChatView;

package/lib/PylonChatView.js

@@ -0,0 +1,78 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PylonChatView = void 0;
+const react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const NativePylonChatView = (0, react_native_1.requireNativeComponent)("RNPylonChatView");
+const COMMANDS = {
+    openChat: "openChat",
+    closeChat: "closeChat",
+    showChatBubble: "showChatBubble",
+    hideChatBubble: "hideChatBubble",
+    showNewMessage: "showNewMessage",
+    setNewIssueCustomFields: "setNewIssueCustomFields",
+    setTicketFormFields: "setTicketFormFields",
+    updateEmailHash: "updateEmailHash",
+    showTicketForm: "showTicketForm",
+    showKnowledgeBaseArticle: "showKnowledgeBaseArticle",
+    clickElementAtSelector: "clickElementAtSelector",
+};
+exports.PylonChatView = react_1.default.forwardRef(({ config, user, style, listener, topInset = 0 }, ref) => {
+    const nativeRef = (0, react_1.useRef)(null);
+    const dispatchCommand = (commandName, args = []) => {
+        const handle = (0, react_native_1.findNodeHandle)(nativeRef.current);
+        if (handle) {
+            react_native_1.UIManager.dispatchViewManagerCommand(handle, commandName, args);
+        }
+    };
+    // Expose imperative methods via ref
+    (0, react_1.useImperativeHandle)(ref, () => ({
+        openChat: () => dispatchCommand(COMMANDS.openChat),
+        closeChat: () => dispatchCommand(COMMANDS.closeChat),
+        showChatBubble: () => dispatchCommand(COMMANDS.showChatBubble),
+        hideChatBubble: () => dispatchCommand(COMMANDS.hideChatBubble),
+        showNewMessage: (message, isHtml = false) => dispatchCommand(COMMANDS.showNewMessage, [message, isHtml]),
+        setNewIssueCustomFields: (fields) => dispatchCommand(COMMANDS.setNewIssueCustomFields, [fields]),
+        setTicketFormFields: (fields) => dispatchCommand(COMMANDS.setTicketFormFields, [fields]),
+        updateEmailHash: (emailHash) => dispatchCommand(COMMANDS.updateEmailHash, [emailHash]),
+        showTicketForm: (slug) => dispatchCommand(COMMANDS.showTicketForm, [slug]),
+        showKnowledgeBaseArticle: (articleId) => dispatchCommand(COMMANDS.showKnowledgeBaseArticle, [articleId]),
+        clickElementAtSelector: (selector) => dispatchCommand(COMMANDS.clickElementAtSelector, [selector]),
+    }), []);
+    return (<NativePylonChatView ref={nativeRef} style={style} appId={config.appId} widgetBaseUrl={config.widgetBaseUrl} widgetScriptUrl={config.widgetScriptUrl} enableLogging={config.enableLogging} debugMode={config.debugMode} primaryColor={config.primaryColor} userEmail={user?.email} userName={user?.name} userAvatarUrl={user?.avatarUrl} userEmailHash={user?.emailHash} userAccountId={user?.accountId} userAccountExternalId={user?.accountExternalId} topInset={topInset} onPylonLoaded={() => listener?.onPylonLoaded?.()} onPylonInitialized={() => listener?.onPylonInitialized?.()} onPylonReady={() => listener?.onPylonReady?.()} onChatOpened={() => listener?.onChatOpened?.()} onChatClosed={(event) => listener?.onChatClosed?.(event.nativeEvent.wasOpen)} onUnreadCountChanged={(event) => listener?.onUnreadCountChanged?.(event.nativeEvent.count)} onMessageReceived={(event) => listener?.onMessageReceived?.(event.nativeEvent.message)} onPylonError={(event) => listener?.onPylonError?.(event.nativeEvent.error)} onInteractiveBoundsChanged={(event) => listener?.onInteractiveBoundsChanged?.(event.nativeEvent)}/>);
+});
+exports.PylonChatView.displayName = "PylonChatView";
+exports.default = exports.PylonChatView;

package/lib/PylonChatWidget.android.d.ts

@@ -0,0 +1,19 @@
+import React from "react";
+import type { PylonChatViewRef } from "./PylonChatView";
+import type { PylonChatWidgetProps } from "./PylonChatWidget";
+/**
+ * Android implementation using proxy-based touch pass-through.
+ *
+ * State Management:
+ * - isChatOpen is ONLY set by native events (onChatOpened/onChatClosed)
+ * - Imperative methods (openChat/closeChat) call native, which then fires events
+ * - This ensures state is always synced with native layer
+ *
+ * Touch Pass-Through Strategy:
+ * 1. Native reports interactive element positions via onInteractiveBoundsChanged
+ * 2. React renders clickable Pressable views at those positions
+ * 3. When chat is closed: WebView has pointerEvents="none" (passes touches through)
+ * 4. Touches hit background OR proxy
+ * 5. Proxy clicked → calls openChat() → fires onChatOpened → state updates → WebView enabled
+ */
+export declare const PylonChatWidget: React.ForwardRefExoticComponent<PylonChatWidgetProps & React.RefAttributes<PylonChatViewRef>>;

package/lib/PylonChatWidget.android.js

@@ -0,0 +1,144 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PylonChatWidget = void 0;
+const react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const PylonChatView_1 = require("./PylonChatView");
+/**
+ * Android implementation using proxy-based touch pass-through.
+ *
+ * State Management:
+ * - isChatOpen is ONLY set by native events (onChatOpened/onChatClosed)
+ * - Imperative methods (openChat/closeChat) call native, which then fires events
+ * - This ensures state is always synced with native layer
+ *
+ * Touch Pass-Through Strategy:
+ * 1. Native reports interactive element positions via onInteractiveBoundsChanged
+ * 2. React renders clickable Pressable views at those positions
+ * 3. When chat is closed: WebView has pointerEvents="none" (passes touches through)
+ * 4. Touches hit background OR proxy
+ * 5. Proxy clicked → calls openChat() → fires onChatOpened → state updates → WebView enabled
+ */
+exports.PylonChatWidget = (0, react_1.forwardRef)(({ config, user, listener, style, topInset }, ref) => {
+    // State synced ONLY via native events - single source of truth
+    // TODO: Consider useSyncExternalStore for a more resilient solution in the future.
+    const [isChatOpen, setIsChatOpen] = (0, react_1.useState)(false);
+    const [interactiveBounds, setInteractiveBounds] = (0, react_1.useState)([]);
+    // Internal ref has additional methods not exposed to SDK users.
+    const chatRef = (0, react_1.useRef)(null);
+    // Forward ref methods - these call native, which fires events that update state
+    // CRITICAL: DO NOT set state directly here - let events handle it
+    (0, react_1.useImperativeHandle)(ref, () => ({
+        openChat: () => {
+            chatRef.current?.openChat();
+        },
+        closeChat: () => {
+            chatRef.current?.closeChat();
+        },
+        showChatBubble: () => chatRef.current?.showChatBubble(),
+        hideChatBubble: () => chatRef.current?.hideChatBubble(),
+        showNewMessage: (message, isHtml) => chatRef.current?.showNewMessage(message, isHtml),
+        setNewIssueCustomFields: (fields) => chatRef.current?.setNewIssueCustomFields(fields),
+        setTicketFormFields: (fields) => chatRef.current?.setTicketFormFields(fields),
+        updateEmailHash: (emailHash) => chatRef.current?.updateEmailHash(emailHash),
+        showTicketForm: (slug) => chatRef.current?.showTicketForm(slug),
+        showKnowledgeBaseArticle: (articleId) => chatRef.current?.showKnowledgeBaseArticle(articleId),
+    }));
+    // CRITICAL: State is ONLY updated by these event handlers.
+    // The flow is: imperative method → native JS call → Pylon widget event → native callback → React event.
+    const handleChatOpened = (0, react_1.useCallback)(() => {
+        setIsChatOpen(true);
+        listener?.onChatOpened?.();
+    }, [listener]);
+    const handleChatClosed = (0, react_1.useCallback)((wasOpen) => {
+        setIsChatOpen(false);
+        listener?.onChatClosed?.(wasOpen);
+    }, [listener]);
+    const handleBoundsChanged = (0, react_1.useCallback)((bounds) => {
+        setInteractiveBounds((prev) => {
+            const existing = prev.findIndex((b) => b.selector === bounds.selector);
+            // If bounds are 0,0,0,0 it means element is hidden - remove it
+            const isHidden = bounds.left === 0 &&
+                bounds.top === 0 &&
+                bounds.right === 0 &&
+                bounds.bottom === 0;
+            if (existing >= 0) {
+                const updated = [...prev];
+                if (isHidden) {
+                    updated.splice(existing, 1);
+                }
+                else {
+                    updated[existing] = bounds;
+                }
+                return updated;
+            }
+            if (isHidden) {
+                return prev;
+            }
+            return [...prev, bounds];
+        });
+    }, []);
+    const handleProxyPress = (0, react_1.useCallback)((selector) => {
+        // Trigger a click on the WebView element by its ID selector.
+        // This kind of only works for areas with a single clickable element.
+        // Really what htis needs to become is pass a coordinate to the webview, we look up whatever thing is at that
+        // coordinate, and click it. Which is very sophisticated and hacky.
+        chatRef.current?.clickElementAtSelector(selector);
+    }, []);
+    return (<>
+      <react_native_1.View style={[react_native_1.StyleSheet.absoluteFill, style]} pointerEvents={isChatOpen ? "auto" : "none"}>
+        {/* The actual WebView - disabled when chat is closed */}
+        <PylonChatView_1.PylonChatView ref={chatRef} style={react_native_1.StyleSheet.absoluteFillObject} config={config} user={user} topInset={topInset} listener={{
+            ...listener,
+            onChatOpened: handleChatOpened,
+            onChatClosed: handleChatClosed,
+            onInteractiveBoundsChanged: handleBoundsChanged,
+        }}/>
+      </react_native_1.View>
+      {!isChatOpen &&
+            interactiveBounds.map((bounds, index) => (<react_native_1.Pressable key={`${bounds.selector}-${index}`} style={{
+                    position: "absolute",
+                    left: bounds.left,
+                    top: bounds.top,
+                    width: bounds.right - bounds.left,
+                    height: bounds.bottom - bounds.top,
+                    backgroundColor: __DEV__ && config.debugMode ? "rgba(0,255,0,0.2)" : undefined,
+                    borderWidth: __DEV__ && config.debugMode ? 2 : 0,
+                    borderColor: __DEV__ && config.debugMode ? "cyan" : undefined,
+                }} onPress={() => handleProxyPress(bounds.selector)}/>))}
+    </>);
+});
+exports.PylonChatWidget.displayName = "PylonChatWidget";