From 1bfb403a1115fa1189e5d7a6748eef78031d693c Mon Sep 17 00:00:00 2001
From: albanqoku <alban.qoku7@gmail.com>
Date: Thu, 15 Mar 2018 10:37:49 +0000
Subject: [PATCH] Add single player wrapper div

Keeps structure consistent with the full player, and enable props like `className` and `wrapper`
Fixes https://github.com/CookPete/react-player/issues/346
---
 src/singlePlayer.js | 24 +++++++++++++++++-------
 1 file changed, 17 insertions(+), 7 deletions(-)

diff --git a/src/singlePlayer.js b/src/singlePlayer.js
index 1b4c961..544b3be 100644
--- a/src/singlePlayer.js
+++ b/src/singlePlayer.js
@@ -1,8 +1,10 @@
 import React, { Component } from 'react'
 
-import { propTypes, defaultProps } from './props'
+import { propTypes, defaultProps, DEPRECATED_CONFIG_PROPS } from './props'
+import { getConfig, omit, isEqual } from './utils'
 import Player from './Player'
-import { isEqual, getConfig } from './utils'
+
+const SUPPORTED_PROPS = Object.keys(propTypes)
 
 export default function createSinglePlayer (activePlayer) {
   return class SinglePlayer extends Component {
@@ -17,16 +19,24 @@ export default function createSinglePlayer (activePlayer) {
     componentWillUpdate (nextProps) {
       this.config = getConfig(nextProps, defaultProps)
     }
+    ref = player => {
+      this.player = player
+    }
     render () {
       if (!activePlayer.canPlay(this.props.url)) {
         return null
       }
+      const { style, width, height, wrapper: Wrapper } = this.props
+      const otherProps = omit(this.props, SUPPORTED_PROPS, DEPRECATED_CONFIG_PROPS)
       return (
-        <Player
-          {...this.props}
-          activePlayer={activePlayer}
-          config={getConfig(this.props, defaultProps)}
-        />
+        <Wrapper style={{ ...style, width, height }} {...otherProps}>
+          <Player
+            {...this.props}
+            ref={this.ref}
+            activePlayer={activePlayer}
+            config={getConfig(this.props, defaultProps)}
+          />
+        </Wrapper>
       )
     }
   }