feat(New WebView Prop): [iOS] add hideKeyboardAccessoryView option (#67)

* add hideKeyboardAccessoryView option

* add hideKeyboardAccessoryView prop to reference

docs/Reference.md

@@ -43,6 +43,7 @@ This document lays out the current public properties and methods for the React N
 - [`useWebKit`](Reference.md#usewebkit)
 - [`url`](Reference.md#url)
 - [`html`](Reference.md#html)
+- [`hideKeyboardAccessoryView`](Reference.md#hidekeyboardaccessoryview)
 
 ## Methods Index
 
@@ -483,6 +484,16 @@ If true, use WKWebView instead of UIWebView.
 | ------ | -------- |
 | string | No       |
 
+---
+
+### `hideKeyboardAccessoryView`
+
+If true, this will hide the keyboard accessory view (< > and Done) when using the WKWebView.
+
+| Type    | Required | Platform |
+| ------- | -------- | -------- |
+| boolean | No       | iOS      |
+
 ## Methods
 
 ### `extraNativeComponentConfig()`

ios/RNCWKWebView.h

@@ -35,6 +35,7 @@ shouldStartLoadForRequest:(NSMutableDictionary<NSString *, id> *)request
 #endif
 @property (nonatomic, assign) UIEdgeInsets contentInset;
 @property (nonatomic, assign) BOOL automaticallyAdjustContentInsets;
+@property (nonatomic, assign) BOOL hideKeyboardAccessoryView;
 
 - (void)postMessage:(NSString *)message;
 - (void)injectJavaScript:(NSString *)script;

ios/RNCWKWebView.m

@@ -9,8 +9,20 @@
 #import <React/RCTConvert.h>
 #import <React/RCTAutoInsetsProtocol.h>
 
+#import "objc/runtime.h"
+
 static NSString *const MessageHanderName = @"ReactNative";
 
+// runtime trick to remove WKWebView keyboard default toolbar
+// see: http://stackoverflow.com/questions/19033292/ios-7-uiwebview-keyboard-issue/19042279#19042279
+@interface _SwizzleHelperWK : NSObject @end
+@implementation _SwizzleHelperWK
+-(id)inputAccessoryView
+{
+  return nil;
+}
+@end
+
 @interface RNCWKWebView () <WKUIDelegate, WKNavigationDelegate, WKScriptMessageHandler, UIScrollViewDelegate, RCTAutoInsetsProtocol>
 @property (nonatomic, copy) RCTDirectEventBlock onLoadingStart;
 @property (nonatomic, copy) RCTDirectEventBlock onLoadingFinish;
@@ -24,6 +36,7 @@ static NSString *const MessageHanderName = @"ReactNative";
 @implementation RNCWKWebView
 {
   UIColor * _savedBackgroundColor;
+  BOOL _savedHideKeyboardAccessoryView;
 }
 
 - (void)dealloc
@@ -97,7 +110,7 @@ static NSString *const MessageHanderName = @"ReactNative";
 #endif
 
     [self addSubview:_webView];
-
+    [self setHideKeyboardAccessoryView: _savedHideKeyboardAccessoryView];
     [self visitSource];
   } else {
     [_webView.configuration.userContentController removeScriptMessageHandlerForName:MessageHanderName];
@@ -198,6 +211,42 @@ static NSString *const MessageHanderName = @"ReactNative";
   [_webView loadRequest:request];
 }
 
+-(void)setHideKeyboardAccessoryView:(BOOL)hideKeyboardAccessoryView
+{
+    
+    if (_webView == nil) {
+        _savedHideKeyboardAccessoryView = hideKeyboardAccessoryView;
+        return;
+    }
+
+    if (_savedHideKeyboardAccessoryView == false) {
+        return;
+    }
+    
+    UIView* subview;
+    for (UIView* view in _webView.scrollView.subviews) {
+        if([[view.class description] hasPrefix:@"WK"])
+            subview = view;
+    }
+    
+    if(subview == nil) return;
+    
+    NSString* name = [NSString stringWithFormat:@"%@_SwizzleHelperWK", subview.class.superclass];
+    Class newClass = NSClassFromString(name);
+    
+    if(newClass == nil)
+    {
+        newClass = objc_allocateClassPair(subview.class, [name cStringUsingEncoding:NSASCIIStringEncoding], 0);
+        if(!newClass) return;
+        
+        Method method = class_getInstanceMethod([_SwizzleHelperWK class], @selector(inputAccessoryView));
+        class_addMethod(newClass, @selector(inputAccessoryView), method_getImplementation(method), method_getTypeEncoding(method));
+        
+        objc_registerClassPair(newClass);
+    }
+    
+    object_setClass(subview, newClass);
+}
 
 - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
 {

ios/RNCWKWebViewManager.m

@@ -43,6 +43,7 @@ RCT_EXPORT_VIEW_PROPERTY(dataDetectorTypes, WKDataDetectorTypes)
 #endif
 RCT_EXPORT_VIEW_PROPERTY(contentInset, UIEdgeInsets)
 RCT_EXPORT_VIEW_PROPERTY(automaticallyAdjustContentInsets, BOOL)
+RCT_EXPORT_VIEW_PROPERTY(hideKeyboardAccessoryView, BOOL)
 
 /**
  * Expose methods to enable messaging the webview.

js/WebView.ios.js

@@ -261,6 +261,7 @@ class WebView extends React.Component<WebViewSharedProps, State> {
         automaticallyAdjustContentInsets={
           this.props.automaticallyAdjustContentInsets
         }
+        hideKeyboardAccessoryView={this.props.hideKeyboardAccessoryView}
         onLoadingStart={this._onLoadingStart}
         onLoadingFinish={this._onLoadingFinish}
         onLoadingError={this._onLoadingError}

js/WebViewTypes.js

@@ -219,6 +219,11 @@ export type IOSWebViewProps = $ReadOnly<{|
    * @platform ios
    */
   allowsInlineMediaPlayback?: ?boolean,
+  /**
+   * Hide the accessory view when the keyboard is open. Default is false to be
+   * backward compatible.
+   */
+  hideKeyboardAccessoryView?: ?boolean,
 |}>;
 
 export type AndroidWebViewProps = $ReadOnly<{|