Replace js Dimensions with shadow view in InputAccessoryViewExample

Reviewed By: mmmulani

Differential Revision: D7196168

fbshipit-source-id: 031ed5ab24d1075f775ec71e5b78d32e03fe8f6f

Libraries/Text/TextInput/RCTInputAccessoryShadowView.h

@@ -0,0 +1,7 @@
+// Copyright 2004-present Facebook. All Rights Reserved.
+
+#import <React/RCTShadowView.h>
+
+@interface RCTInputAccessoryShadowView : RCTShadowView
+
+@end

Libraries/Text/TextInput/RCTInputAccessoryShadowView.m

@@ -0,0 +1,15 @@
+// Copyright 2004-present Facebook. All Rights Reserved.
+
+#import "RCTInputAccessoryShadowView.h"
+
+#import <React/RCTUtils.h>
+
+@implementation RCTInputAccessoryShadowView
+
+- (void)insertReactSubview:(RCTShadowView *)subview atIndex:(NSInteger)atIndex
+{
+  [super insertReactSubview:subview atIndex:atIndex];
+  subview.width = (YGValue) { RCTScreenSize().width, YGUnitPoint };
+}
+
+@end

Libraries/Text/TextInput/RCTInputAccessoryViewManager.m

@@ -7,6 +7,7 @@
 
 #import "RCTInputAccessoryViewManager.h"
 
+#import "RCTInputAccessoryShadowView.h"
 #import "RCTInputAccessoryView.h"
 
 @implementation RCTInputAccessoryViewManager
@@ -23,6 +24,11 @@ RCT_EXPORT_MODULE()
   return [[RCTInputAccessoryView alloc] initWithBridge:self.bridge];
 }
 
+- (RCTShadowView *)shadowView
+{
+  return [RCTInputAccessoryShadowView new];
+}
+
 RCT_REMAP_VIEW_PROPERTY(backgroundColor, inputAccessoryView.backgroundColor, UIColor)
 
 @end

RNTester/js/InputAccessoryViewExample.js

@@ -13,7 +13,6 @@
 
 const Alert = require('Alert');
 const Button = require('Button');
-const Dimensions = require('Dimensions');
 const InputAccessoryView = require('InputAccessoryView');
 const React = require('React');
 const ScrollView = require('ScrollView');
@@ -36,9 +35,8 @@ class TextInputBar extends React.PureComponent<*, *> {
   state = {text: ''};
 
   render() {
-    const {width} = Dimensions.get('window');
     return (
-      <View style={[styles.textInputContainer, {width}]}>
+      <View style={styles.textInputContainer}>
         <TextInput
           style={styles.textInput}
           onChangeText={text => {