@pinwheel/react-native-pinwheel 3.2.5 → 3.3.0

package/README.md

@@ -11,14 +11,17 @@ $ npm install --save @pinwheel/react-native-pinwheel
 ```
 
 ## Configuration
-Some platform integrations may require camera access for verification purposes. Ensure the necessary permissions are configured in your project:
+Some platform integrations may require camera access for verification purposes. On Android, storage access is also required to enable direct deposit form downloads on API level 28 (Android 9) and below.
+Ensure the following permissions are configured in your project:
 
 **Android:** Add the following permission to your `AndroidManifest.xml`:
 ```
 <uses-permission android:name="android.permission.CAMERA" />
+
+<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" android:maxSdkVersion="28" />
 ```
 
-**iOS:** Add the following key and description to your `Info.plist`:
+**iOS:** Add the following entry to your `Info.plist`:
 ```
 <key>NSCameraUsageDescription</key>
 <string>We need access to your camera for verification purposes.</string>
@@ -71,7 +74,7 @@ Callback when a user successfully signs in to their payroll account.
 
 ### `onError`
 
-Callback whenever an error occurs during the modal flow. This does not necessarily mean that the flow cannot still complete successfully. These include such retryable events as the user inputting an incorrect password or MFA code and needs to reattempt it. Error codes can be seen [here](https://docs.pinwheelapi.com/docs/link-sdk-errors).
+Callback whenever an error occurs during the modal flow. This does not necessarily mean that the flow cannot still complete successfully. These include such retryable events as the user inputting an incorrect password or MFA code and needs to reattempt it. Error codes can be seen [here](https://docs.pinwheelapi.com/public/docs/link-errors#error-codes).
 
 | Type     | Required |
 | -------- | -------- |
@@ -109,6 +112,14 @@ Determines whether the SDK should respond to window insets on Android. This allo
 | ------- | -------- | ------- |
 | boolean | No       | true    |
 
+### `useDarkMode`
+
+Enables Link to run with a dark mode theme.
+
+| Type    | Required | Default |
+| ------- | -------- |---------|
+| boolean | No       | false   |
+
 ## Running The Example App Locally
 
 You may want to run the example app locally to get started.

package/RNPinwheelSDK.podspec

@@ -17,5 +17,5 @@ Pod::Spec.new do |s|
 
   install_modules_dependencies(s)
 
-  s.dependency 'PinwheelSDK', '3.1.1'
+  s.dependency 'PinwheelSDK', '3.2.1'
 end

package/android/build.gradle

@@ -32,7 +32,7 @@ repositories {
   google()
 }
 
-def PW_ANDROID_SDK_VERSION = '3.1.3'
+def PW_ANDROID_SDK_VERSION = '3.2.0'
 
 dependencies {
     def pwVersion = rootProject.hasProperty('pwVersion') ? rootProject.pwVersion : PW_ANDROID_SDK_VERSION

package/android/src/main/java/com/rtnpinwheel/Pinwheel.kt

@@ -20,6 +20,7 @@ class Pinwheel : FrameLayout {
   private var pinwheelFragment: PinwheelFragment? = null
   private var pinwheelEventListener: PinwheelEventListener? = null
   private var handleInsets: Boolean = true
+  private var useDarkMode: Boolean = false
   private var fragmentContainer: FrameLayout? = null
 
   constructor(context: Context) : super(context) {
@@ -75,6 +76,10 @@ class Pinwheel : FrameLayout {
     this.handleInsets = handleInsets
   }
 
+  fun setUseDarkMode(useDarkMode: Boolean) {
+    this.useDarkMode = useDarkMode
+  }
+
   fun getReactNativeVersion(): String {
     val version = ReactNativeVersion.VERSION
     return "${version["major"]}.${version["minor"]}.${version["patch"]}"
@@ -84,7 +89,7 @@ class Pinwheel : FrameLayout {
     Handler(Looper.getMainLooper()).post {
       if (this.pinwheelFragment == null) {
         this.token?.let {
-          val pinwheelFragment = PinwheelFragment.newInstance(it, "react native", "3.2.5", getReactNativeVersion(), this.handleInsets)
+          val pinwheelFragment = PinwheelFragment.newInstanceWithAdvancedOptions(it, "react native", "3.3.0", getReactNativeVersion(), this.handleInsets, this.useDarkMode)
           pinwheelEventListener?.let { listener ->
             pinwheelFragment.pinwheelEventListener = listener
           }

package/android/src/main/java/com/rtnpinwheel/PinwheelManager.kt

@@ -43,6 +43,11 @@ class PinwheelManager(private val reactContext: ReactApplicationContext) :
         view.setHandleInsets(handleInsets)
     }
 
+    @ReactProp(name = "useDarkMode")
+    override fun setUseDarkMode(view: Pinwheel, useDarkMode: Boolean) {
+        view.setUseDarkMode(useDarkMode)
+    }
+
     @ReactPropGroup(names = ["width", "height"], customType = "Style")
     fun setStyle(view: Pinwheel, index: Int, value: Int) {
         if (index == 0) propWidth = value

package/ios/RTNPinwheelManager.mm

@@ -15,10 +15,11 @@ RCT_EXPORT_MODULE(RTNPinwheel)
 #endif
 
 - (UIView *)view
-{   
+{
     return [[RTNPinwheelView alloc] init];
 }
 
 RCT_EXPORT_VIEW_PROPERTY(token, NSString);
+RCT_EXPORT_VIEW_PROPERTY(useDarkMode, BOOL);
 
-@end
+@end

package/ios/RTNPinwheelView.h

@@ -23,6 +23,7 @@ NS_ASSUME_NONNULL_BEGIN
 
 @property (nonatomic, strong, nullable) PinwheelWrapperVC *pinwheelWrapperVC;
 @property (nonatomic, strong) NSString *token;
+@property (nonatomic, assign) BOOL useDarkMode;
 
 - (instancetype)initWithFrame:(CGRect)frame token:(NSString *)token;
 

package/ios/RTNPinwheelView.mm

@@ -43,7 +43,7 @@ using namespace facebook::react;
     }
 
     if (self.token != nil) {
-        self.pinwheelWrapperVC = [[PinwheelWrapperVC alloc] initWithToken:self.token delegate:self sdk:@"react native" version: @"3.2.5"];
+        self.pinwheelWrapperVC = [[PinwheelWrapperVC alloc] initWithToken:self.token delegate:self sdk:@"react native" version:@"3.3.0" useDarkMode:self.useDarkMode];
         [self addSubview:self.pinwheelWrapperVC.view];
     }
 }
@@ -63,6 +63,11 @@ using namespace facebook::react;
         NSString* convertedToken = [NSString stringWithUTF8String:newViewProps.token.c_str()];
         [self setToken:convertedToken];
     }
+
+    if (oldViewProps.useDarkMode != newViewProps.useDarkMode) {
+        self.useDarkMode = newViewProps.useDarkMode;
+    }
+
     // Ensures that the view is always re-initialized whenever the props change, or the React Native component is
     // re-mounted. On the new architecture, there are optimizations which causes the view to be re-used in these
     // scenarios, whereas the ideal functionality here is to have the Link modal reset to the starting state.
@@ -134,8 +139,13 @@ Class<RCTComponentViewProtocol> RTNPinwheelCls(void)
 }
 
 - (void)initPinwheelWrapperVC {
-    if (self.token != nil && self.pinwheelWrapperVC == nil) {
-        self.pinwheelWrapperVC = [[PinwheelWrapperVC alloc] initWithToken:self.token delegate:self sdk:@"react native" version: @"3.2.5"];
+    if (self.pinwheelWrapperVC != nil) {
+        [self.pinwheelWrapperVC.view removeFromSuperview];
+        self.pinwheelWrapperVC = nil;
+    }
+
+    if (self.token != nil) {
+        self.pinwheelWrapperVC = [[PinwheelWrapperVC alloc] initWithToken:self.token delegate:self sdk:@"react native" version:@"3.3.0" useDarkMode:self.useDarkMode];
         [self addSubview:self.pinwheelWrapperVC.view];
     }
 }
@@ -147,6 +157,13 @@ Class<RCTComponentViewProtocol> RTNPinwheelCls(void)
     }
 }
 
+- (void)setUseDarkMode:(BOOL)newUseDarkMode {
+    if (_useDarkMode != newUseDarkMode) {
+        _useDarkMode = newUseDarkMode;
+        [self initPinwheelWrapperVC];
+    }
+}
+
 - (void)layoutSubviews
 {
   [super layoutSubviews];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pinwheel/react-native-pinwheel",
-  "version": "3.2.5",
+  "version": "3.3.0",
   "type": "module",
   "main": "src/index.ts",
   "types": "src/index.ts",

package/src/Pinwheel.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { LinkOptions } from './client-events/client';
-declare const Pinwheel: ({ linkToken, onLogin, onLoginAttempt, onSuccess, onError, onExit, onEvent, handleInsets, }: LinkOptions & {
+declare const Pinwheel: ({ linkToken, onLogin, onLoginAttempt, onSuccess, onError, onExit, onEvent, handleInsets, useDarkMode, }: LinkOptions & {
     handleInsets?: boolean;
+    useDarkMode?: boolean;
 }) => React.JSX.Element;
 export default Pinwheel;

package/src/Pinwheel.tsx

@@ -18,8 +18,10 @@ const Pinwheel = ({
   onExit,
   onEvent,
   handleInsets,
+  useDarkMode,
 }: LinkOptions & {
   handleInsets?: boolean;
+  useDarkMode?: boolean;
 }) => {
   const eventsListener = useCallback(
     (event: any) => {
@@ -80,6 +82,7 @@ const Pinwheel = ({
           style={{ flex: 1 }}
           token={linkToken}
           handleInsets={handleInsets ?? true}
+          useDarkMode={useDarkMode ?? false}
         />
       )}
     </SafeAreaView>

package/src/RTNPinwheelNativeComponent.d.ts

@@ -3,6 +3,7 @@ import type { HostComponent } from 'react-native';
 export interface NativeProps extends ViewProps {
     token: string;
     handleInsets: boolean;
+    useDarkMode: boolean;
 }
 declare const _default: HostComponent<NativeProps>;
 export default _default;

package/src/RTNPinwheelNativeComponent.ts

@@ -9,6 +9,7 @@ type Event = {
 export interface NativeProps extends ViewProps {
   token: string;
   handleInsets: boolean;
+  useDarkMode: boolean;
 }
 
 export default codegenNativeComponent<NativeProps>(