react-native-hyperswitch-dev-sdk 0.4.1

package/ios/Views/Fabric/ApplePayView.mm

@@ -0,0 +1,89 @@
+#import "ApplePayView.h"
+#import <PassKit/PassKit.h>
+
+#import <react/renderer/components/HyperswitchSdkReactNativeSpec/ComponentDescriptors.h>
+#import <react/renderer/components/HyperswitchSdkReactNativeSpec/EventEmitters.h>
+#import <react/renderer/components/HyperswitchSdkReactNativeSpec/Props.h>
+#import <react/renderer/components/HyperswitchSdkReactNativeSpec/RCTComponentViewHelpers.h>
+
+#import "RCTFabricComponentsPlugins.h"
+
+using namespace facebook::react;
+
+@interface ApplePayView () <RCTApplePayViewViewProtocol>
+
+@property (nonatomic, strong, nullable) PKPaymentButton *button;
+
+@end
+
+@implementation ApplePayView {
+    PKPaymentButton *_paymentButton;
+}
+
++ (ComponentDescriptorProvider)componentDescriptorProvider
+{
+    return concreteComponentDescriptorProvider<ApplePayViewComponentDescriptor>();
+}
+
+- (instancetype)initWithFrame:(CGRect)frame
+{
+    if (self = [super initWithFrame:frame]) {
+        static const auto defaultProps = std::make_shared<const ApplePayViewProps>();
+        _props = defaultProps;
+
+        [self setupDefaultButton];
+    }
+
+    return self;
+}
+
+- (void)setupDefaultButton {
+    [self setupButtonWithType:PKPaymentButtonTypePlain style:PKPaymentButtonStyleBlack cornerRadius:4.0];
+}
+
+- (void)setupButtonWithType:(PKPaymentButtonType)type style:(PKPaymentButtonStyle)style cornerRadius:(CGFloat)cornerRadius {
+    [_paymentButton removeFromSuperview];
+
+    _paymentButton = [[PKPaymentButton alloc] initWithPaymentButtonType:type paymentButtonStyle:style];
+    _paymentButton.cornerRadius = cornerRadius;
+
+//    [_paymentButton addTarget:self action:@selector(applePayButtonTapped:) forControlEvents:UIControlEventTouchUpInside];
+
+    [self addSubview:_paymentButton];
+    self.contentView = _paymentButton;
+}
+
+- (PKPaymentButtonType)paymentButtonTypeFromString:(NSString *)type {
+    if ([type isEqualToString:@"buy"]) return PKPaymentButtonTypeBuy;
+    if ([type isEqualToString:@"setUp"]) return PKPaymentButtonTypeSetUp;
+    if ([type isEqualToString:@"inStore"]) return PKPaymentButtonTypeInStore;
+    if ([type isEqualToString:@"donate"]) return PKPaymentButtonTypeDonate;
+    if ([type isEqualToString:@"checkout"]) return PKPaymentButtonTypeCheckout;
+    if ([type isEqualToString:@"book"]) return PKPaymentButtonTypeBook;
+    if ([type isEqualToString:@"subscribe"]) return PKPaymentButtonTypeSubscribe;
+    return PKPaymentButtonTypePlain;
+}
+
+- (PKPaymentButtonStyle)paymentButtonStyleFromString:(NSString *)style {
+    if ([style isEqualToString:@"white"]) return PKPaymentButtonStyleWhite;
+    if ([style isEqualToString:@"whiteOutline"]) return PKPaymentButtonStyleWhiteOutline;
+    return PKPaymentButtonStyleBlack;
+}
+
+
+- (void)updateProps:(Props::Shared const &)props oldProps:(Props::Shared const &)oldProps
+{
+    [super updateProps:props oldProps:oldProps];
+}
+
+- (void)layoutSubviews {
+    [super layoutSubviews];
+    _paymentButton.frame = self.bounds;
+}
+
+Class<RCTComponentViewProtocol> ApplePayViewCls(void)
+{
+    return ApplePayView.class;
+}
+
+@end

package/ios/Views/Fabric/NativePaymentElementView.h

@@ -0,0 +1,21 @@
+//
+//  NativePaymentElementView.h
+//
+//  Fabric (New Architecture) component for RCTNativePaymentElement.
+//  Matches Android's PaymentElementViewManager (view name "RCTNativePaymentElement").
+//
+//  Old arch uses requireNativeComponent('NativePaymentWidget') →  NativePaymentWidget.swift
+//  New arch uses codegenNativeComponent('RCTNativePaymentElement') →  this file
+//
+
+#pragma once
+#import <React/RCTViewComponentView.h>
+#import <UIKit/UIKit.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface NativePaymentElementView : RCTViewComponentView
+
+@end
+
+NS_ASSUME_NONNULL_END

package/ios/Views/Fabric/NativePaymentElementView.mm

@@ -0,0 +1,200 @@
+//
+//  NativePaymentElementView.mm
+//
+//  Fabric (New Architecture) host view for the PaymentElement and CVCWidget.
+//  Component name: "RCTNativePaymentElement"   (matches PaymentElementNativeComponent.ts)
+//
+//  Architecture:
+//    ┌─────────────────────────────────────────────────────────────────────┐
+//    │  NativePaymentElementView  (RCTViewComponentView — Fabric host)     │
+//    │    • receives props via updateProps (widgetType, sdkAuth, options)  │
+//    │    • fires events via Fabric RCTNativePaymentElementEventEmitter     │
+//    │    └── NativePaymentWidgetView  (inner UIView — actual widget)      │
+//    │          • shared with the old-arch NativePaymentWidget ViewManager  │
+//    │          • registered in NativePaymentWidgetViewRegistry by tag      │
+//    └─────────────────────────────────────────────────────────────────────┘
+//
+//  The NativePaymentWidgetViewRegistry registration lets the old-arch view
+//  manager commands (confirmPayment, updateIntentInitForWidget, etc.) AND the
+//  NativePaymentElementModule TurboModule find the inner widget by React tag.
+//
+
+#import "NativePaymentElementView.h"
+#import "NativePaymentWidgetViewRegistry.h"
+
+#import <react/renderer/components/HyperswitchSdkReactNativeSpec/ComponentDescriptors.h>
+#import <react/renderer/components/HyperswitchSdkReactNativeSpec/EventEmitters.h>
+#import <react/renderer/components/HyperswitchSdkReactNativeSpec/Props.h>
+#import <react/renderer/components/HyperswitchSdkReactNativeSpec/RCTComponentViewHelpers.h>
+#import "RCTFabricComponentsPlugins.h"
+
+#if __has_include("HyperswitchSdkReactNative-Swift.h")
+#import "HyperswitchSdkReactNative-Swift.h"
+#else
+#import <HyperswitchSdkReactNative/HyperswitchSdkReactNative-Swift.h>
+#endif
+
+using namespace facebook::react;
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Helper: folly::dynamic (object) → NSDictionary via JSON round-trip
+// ─────────────────────────────────────────────────────────────────────────────
+static NSDictionary * _Nullable dynamicToDict(const folly::dynamic &dyn)
+{
+    if (!dyn.isObject() && !dyn.isArray()) {
+        return nil;
+    }
+    NSString *json = [NSString stringWithUTF8String:folly::toJson(dyn).c_str()];
+    NSData *data = [json dataUsingEncoding:NSUTF8StringEncoding];
+    id obj = [NSJSONSerialization JSONObjectWithData:data options:0 error:nil];
+    return [obj isKindOfClass:[NSDictionary class]] ? (NSDictionary *)obj : nil;
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Helper: NSDictionary → folly::dynamic via JSON round-trip
+// ─────────────────────────────────────────────────────────────────────────────
+static folly::dynamic dictToDynamic(NSDictionary * _Nullable dict)
+{
+    if (!dict) return folly::dynamic::object();
+    NSData *data = [NSJSONSerialization dataWithJSONObject:dict options:0 error:nil];
+    if (!data) return folly::dynamic::object();
+    NSString *json = [[NSString alloc] initWithData:data encoding:NSUTF8StringEncoding];
+    if (!json) return folly::dynamic::object();
+    return folly::parseJson(std::string([json UTF8String]));
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+@interface NativePaymentElementView () <RCTRCTNativePaymentElementViewProtocol>
+@end
+
+@implementation NativePaymentElementView {
+    NativePaymentWidgetView *_widgetView;
+}
+
+// ── Fabric component descriptor ──────────────────────────────────────────────
+
++ (ComponentDescriptorProvider)componentDescriptorProvider
+{
+    return concreteComponentDescriptorProvider<RCTNativePaymentElementComponentDescriptor>();
+}
+
+// ── Lifecycle ────────────────────────────────────────────────────────────────
+
+- (instancetype)initWithFrame:(CGRect)frame
+{
+    if (self = [super initWithFrame:frame]) {
+        _widgetView = [[NativePaymentWidgetView alloc] initWithFrame:frame];
+        [self addSubview:_widgetView];
+        [self setupEventForwarding];
+    }
+    return self;
+}
+
+- (void)prepareForRecycle
+{
+    [super prepareForRecycle];
+    // Remove the inner view from the Fabric registry so that dangling tag lookups fail
+    // cleanly.  The tag is the same integer as self.tag.
+    [[NativePaymentWidgetViewRegistry shared] unregisterForTag:@(self.tag)];
+    _widgetView.onPaymentResult = nil;
+    _widgetView.onPaymentEvent  = nil;
+}
+
+- (void)willMoveToWindow:(nullable UIWindow *)newWindow
+{
+    [super willMoveToWindow:newWindow];
+    if (newWindow == nil) {
+        [[NativePaymentWidgetViewRegistry shared] unregisterForTag:@(self.tag)];
+    }
+}
+
+// ── Props ────────────────────────────────────────────────────────────────────
+
+- (void)updateProps:(Props::Shared const &)props
+           oldProps:(Props::Shared const &)oldProps
+{
+    const auto &p = *std::static_pointer_cast<RCTNativePaymentElementProps const>(props);
+
+    NSString *widgetType   = [NSString stringWithUTF8String:p.widgetType.c_str()];
+    NSString *sdkAuth      = [NSString stringWithUTF8String:p.sdkAuthorization.c_str()];
+
+    _widgetView.widgetType        = widgetType.length > 0 ? widgetType : nil;
+    _widgetView.sdkAuthorization  = sdkAuth.length   > 0 ? sdkAuth    : nil;
+
+    // options is a folly::dynamic (arbitrary JS object). Convert → NSDictionary.
+    if (!p.options.isNull()) {
+        NSDictionary *optDict = dynamicToDict(p.options);
+        if (optDict) {
+            _widgetView.options = optDict;
+        }
+    }
+
+    // Notify the inner view that all props have been applied (mirrors
+    // the old-arch bridge calling didSetProps:changedProps: after KVC sets).
+    [_widgetView didSetProps];
+
+    // Register the inner widget view in the shared registry keyed by this
+    // component's React tag, so that NativePaymentWidget view-manager commands
+    // and NativePaymentElementModule TurboModule can find it by tag.
+    [[NativePaymentWidgetViewRegistry shared] registerView:_widgetView forTag:@(self.tag)];
+
+    [super updateProps:props oldProps:oldProps];
+}
+
+// ── Layout ───────────────────────────────────────────────────────────────────
+
+- (void)layoutSubviews
+{
+    [super layoutSubviews];
+    _widgetView.frame = self.bounds;
+}
+
+// ── Event forwarding (inner UIView → Fabric event emitter) ───────────────────
+
+- (void)setupEventForwarding
+{
+    __weak NativePaymentElementView *weakSelf = self;
+
+    // onPaymentResult: fired by NativePaymentWidgetView when a payment completes.
+    _widgetView.onPaymentResult = ^(NSDictionary *event) {
+        NativePaymentElementView *strongSelf = weakSelf;
+        if (!strongSelf) return;
+
+        auto em = std::dynamic_pointer_cast<const RCTNativePaymentElementEventEmitter>(
+            strongSelf->_eventEmitter);
+        if (!em) return;
+
+        NSString *result = event[@"result"] ?: @"";
+        RCTNativePaymentElementEventEmitter::OnPaymentResult payload;
+        payload.result = std::string([result UTF8String]);
+        em->onPaymentResult(std::move(payload));
+    };
+
+    // onPaymentEvent: fired for all intermediate payment events.
+    _widgetView.onPaymentEvent = ^(NSDictionary *event) {
+        NativePaymentElementView *strongSelf = weakSelf;
+        if (!strongSelf) return;
+
+        auto em = std::dynamic_pointer_cast<const RCTNativePaymentElementEventEmitter>(
+            strongSelf->_eventEmitter);
+        if (!em) return;
+
+        NSString *eventName = event[@"eventName"] ?: @"";
+        id payloadObj = event[@"payload"];
+
+        RCTNativePaymentElementEventEmitter::OnPaymentEvent paymentEvent;
+        paymentEvent.eventName = std::string([eventName UTF8String]);
+        if ([payloadObj isKindOfClass:[NSDictionary class]]) {
+            paymentEvent.payload = dictToDynamic((NSDictionary *)payloadObj);
+        }
+        em->onPaymentEvent(std::move(paymentEvent));
+    };
+}
+
+@end
+
+// Required by RCTFabricComponentsPlugins to auto-register the component.
+Class<RCTComponentViewProtocol> NativePaymentElementViewCls(void)
+{
+    return NativePaymentElementView.class;
+}

package/ios/Views/Fabric/NativePaymentWidgetViewRegistry.h

@@ -0,0 +1,37 @@
+//
+//  NativePaymentWidgetViewRegistry.h
+//
+//  Shared tag → UIView registry that bridges the old-arch NativePaymentWidget view manager
+//  and the new-arch (Fabric) NativePaymentElementView component.
+//
+//  Old arch: NativePaymentWidget view manager's commands (confirmPayment, etc.) use
+//            bridge.uiManager which finds NativePaymentWidgetView directly.
+//
+//  New arch: The Fabric NativePaymentElementView wraps an inner NativePaymentWidgetView.
+//            The React tag resolves to the Fabric host view, not the inner widget view.
+//            This registry lets commands find the inner NativePaymentWidgetView by tag.
+//
+
+#pragma once
+#import <UIKit/UIKit.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface NativePaymentWidgetViewRegistry : NSObject
+
+/// Shared singleton.
++ (instancetype)shared;
+
+/// Register the inner NativePaymentWidgetView for a given React tag.
+/// The registry holds a weak reference so deallocation is automatic.
+- (void)registerView:(UIView *)view forTag:(NSNumber *)tag;
+
+/// Remove the entry for the given React tag.
+- (void)unregisterForTag:(NSNumber *)tag;
+
+/// Return the inner NativePaymentWidgetView (or nil if none registered / already deallocated).
+- (nullable UIView *)viewForTag:(NSNumber *)tag;
+
+@end
+
+NS_ASSUME_NONNULL_END

package/ios/Views/Fabric/NativePaymentWidgetViewRegistry.m

@@ -0,0 +1,45 @@
+//
+//  NativePaymentWidgetViewRegistry.m
+//
+
+#import "NativePaymentWidgetViewRegistry.h"
+
+@implementation NativePaymentWidgetViewRegistry {
+    // Weak values so views are removed automatically when deallocated.
+    NSMapTable<NSNumber *, UIView *> *_map;
+}
+
++ (instancetype)shared {
+    static NativePaymentWidgetViewRegistry *sInstance = nil;
+    static dispatch_once_t sOnce;
+    dispatch_once(&sOnce, ^{
+        sInstance = [[NativePaymentWidgetViewRegistry alloc] init];
+    });
+    return sInstance;
+}
+
+- (instancetype)init {
+    if (self = [super init]) {
+        // Strong keys (NSNumber is value-like), weak object values.
+        _map = [NSMapTable strongToWeakObjectsMapTable];
+    }
+    return self;
+}
+
+- (void)registerView:(UIView *)view forTag:(NSNumber *)tag {
+    dispatch_async(dispatch_get_main_queue(), ^{
+        [self->_map setObject:view forKey:tag];
+    });
+}
+
+- (void)unregisterForTag:(NSNumber *)tag {
+    dispatch_async(dispatch_get_main_queue(), ^{
+        [self->_map removeObjectForKey:tag];
+    });
+}
+
+- (nullable UIView *)viewForTag:(NSNumber *)tag {
+    return [_map objectForKey:tag];
+}
+
+@end

package/ios/Views/Native/NativePaymentWidget.m

@@ -0,0 +1,26 @@
+//
+//  NativePaymentWidget.m
+//  Hyperswitch
+//
+//  Created by Harshit Srivastava on 05/03/26.
+//
+
+#import <React/RCTViewManager.h>
+#import <React/RCTUIManager.h>
+#import <React/RCTLog.h>
+
+@interface RCT_EXTERN_MODULE(NativePaymentWidget, RCTViewManager)
+
+RCT_EXPORT_VIEW_PROPERTY(widgetType, NSString)
+RCT_EXPORT_VIEW_PROPERTY(options, NSDictionary)
+RCT_EXPORT_VIEW_PROPERTY(sdkAuthorization, NSString)
+RCT_EXPORT_VIEW_PROPERTY(onPaymentEvent, RCTDirectEventBlock)
+RCT_EXPORT_VIEW_PROPERTY(onPaymentResult, RCTDirectEventBlock)
+
+RCT_EXTERN_METHOD(showWidget:(nonnull NSNumber *)reactTag)
+RCT_EXTERN_METHOD(removeWidget:(nonnull NSNumber *)reactTag)
+RCT_EXTERN_METHOD(confirmPayment:(nonnull NSNumber *)reactTag :(RCTResponseSenderBlock)responseCallback)
+RCT_EXTERN_METHOD(updateIntentInitForWidget:(nonnull NSNumber *)rootTag :(RCTResponseSenderBlock)responseCallback)
+RCT_EXTERN_METHOD(updateIntentCompleteForWidget:(nonnull NSNumber *)rootTag :(NSString)sdkAuthorization :(RCTResponseSenderBlock)responseCallback)
+RCT_EXTERN_METHOD(confirmPaymentCVC:(nonnull NSNumber *)reactTag :(NSString)paymentToken :(NSString)paymentMethodId :(RCTResponseSenderBlock)rnCallback)
+@end