Add support to control the style of <View> outside of <WebView> (#237)

LonelyCpp · Oct 9, 2023 · d43c5a9 · d43c5a9
1 parent fbe58f4
commit d43c5a9
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 1 deletion.
diff --git a/docs/props.mdx b/docs/props.mdx
@@ -273,6 +273,12 @@ changing these parameters might cause the player to restart or not change at all
 
 ---
 
+### `viewContainerStyle`
+
+A style prop that will be given to the webview container
+
+---
+
 ### `webViewStyle`
 
 A style prop that will be given to the webview

diff --git a/index.d.ts b/index.d.ts
@@ -88,6 +88,10 @@ export interface YoutubeIframeProps {
    * Sets the volume. Accepts an integer between `0` and `100`.
    */
   volume?: number;
+  /**
+   * A style prop that will be given to the webview container
+   */
+  viewContainerStyle?: StyleProp<ViewStyle>;
   /**
    * A style prop that will be given to the webview
    */

diff --git a/src/YoutubeIframe.js b/src/YoutubeIframe.js
@@ -33,6 +33,7 @@ const YoutubeIframe = (props, ref) => {
     play = false,
     mute = false,
     volume = 100,
+    viewContainerStyle,
     webViewStyle,
     webViewProps,
     useLocalHTML,
@@ -258,7 +259,7 @@ const YoutubeIframe = (props, ref) => {
   }, [useLocalHTML, contentScale, baseUrlOverride, allowWebViewZoom]);
 
   return (
-    <View style={{height, width}}>
+    <View style={[{height, width}, viewContainerStyle]}>
       <WebView
         bounces={false}
         originWhitelist={['*']}