Merge pull request #53 from dcgudeman/propType-change

updated propTypes for height and width to be union type of string and number.

Author: fakiolinho

README.md

@@ -31,7 +31,7 @@ Check [here](https://codesandbox.io/s/mqx0ql55qp)
 * spinningBubbles
 * spokes
 
-## Example
+## Examples
 
 ```javascript
 import React from 'react';
@@ -44,15 +44,26 @@ const Example = ({ type, color }) => (
 export default Example;
 ```
 
+```javascript
+import React from 'react';
+import ReactLoading from 'react-loading';
+
+const Example = ({ type, color }) => (
+	<ReactLoading type={type} color={color} height={'20%'} width={'20%'} />
+);
+
+export default Example;
+```
+
 ### Props
 
 | Name | Type | Default Value |
 |:------:|:------:|:---------------:|
 | type | String | balls |
 | color | String | `#ffffff` |
 | delay | Number | 0 (msecs) |
-| height | Number | 64 (px) |
-| width | Number | 64 (px) |
+| height | Number or String | 64 (px) |
+| width | Number or String | 64 (px) |
 | className | String | `''` |
 
 

lib/__tests__/react-loading.spec.jsx

@@ -51,4 +51,12 @@ describe('test Loading component', () => {
 
     expect(enzymeWrapper.instance().timeout).not.toEqual(undefined);
   });
+
+  it('allows setting height and width with strings without propTypes warnings', () => {
+    const spyConsoleError = jest.spyOn(global.console, 'error');
+    const enzymeWrapper = shallow(<Loading height="20%" width="20%" />);
+    expect(enzymeWrapper).toHaveLength(1);
+    expect(spyConsoleError).not.toHaveBeenCalled();
+    spyConsoleError.mockRestore();
+  });
 });

lib/react-loading.jsx

@@ -8,8 +8,14 @@ export default class Loading extends Component {
     color: PropTypes.string,
     delay: PropTypes.number,
     type: PropTypes.string,
-    height: PropTypes.number,
-    width: PropTypes.number,
+    height: PropTypes.oneOfType([
+      PropTypes.string,
+      PropTypes.number,
+    ]),
+    width: PropTypes.oneOfType([
+      PropTypes.string,
+      PropTypes.number,
+    ]),
   };
 
   static defaultProps = {