react-power-picture - npm Package Compare versions

Comparing version 1.0.0 to 1.1.0

dist/index.es.js

@@ -89,2 +89,5 @@ import { Component } from 'react';
 
+    _this.ERROR_TOO_MANY_SOURCES = 'PowerPicture requires ONE prop of either \'source\' or \'sources\' but cannot accept both';
+    _this.ERROR_MISSING_SOURCE = 'PowerPicture requires either \'source\' or \'sources\' as a prop';
+
     _this.state = {
@@ -100,10 +103,19 @@ image: null,
     value: function componentDidMount() {
-      var sources = this.props.sources;
+      var _props = this.props,
+          source = _props.source,
+          sources = _props.sources;
 
+      var imgToLoad = void 0;
 
-      if (sources === undefined) {
-        throw new Error('PowerPicture requires sources as a prop');
+      if (sources) {
+        if (source) {
+          throw new Error(this.ERROR_TOO_MANY_SOURCES);
+        }
+        imgToLoad = this.getIdealSize(sources, window.innerWidth);
+      } else if (source) {
+        imgToLoad = source;
+      } else {
+        throw new Error(this.ERROR_MISSING_SOURCE);
       }
 
-      var imgToLoad = this.getIdealSize(sources, window.innerWidth);
       this.loadImage(imgToLoad);
@@ -124,9 +136,18 @@ }
 
-      var sources = this.props.sources;
+      var _props2 = this.props,
+          source = _props2.source,
+          sources = _props2.sources;
 
-      var imgToLoad = this.getIdealSize(sources, window.innerWidth);
+      var imgToLoad = source;
 
+      if (sources) {
+        imgToLoad = this.getIdealSize(sources, window.innerWidth);
+      }
+
       if (prevState.image !== null && imgToLoad !== prevState.image) {
-        this.setState({ loading: true }, function () {
-          _this2.loadImage(imgToLoad);
+        this.setState({
+          image: null,
+          loading: true
+        }, function () {
+          return _this2.loadImage(imgToLoad);
         });
@@ -165,6 +186,7 @@ }
 PowerPicture.propTypes = {
+  source: PropTypes.string,
   sources: PropTypes.arrayOf(PropTypes.shape({
     src: PropTypes.string,
     size: PropTypes.number
-  })).isRequired,
+  })),
   onError: PropTypes.func,
@@ -171,0 +193,0 @@ children: PropTypes.func

dist/index.js

@@ -94,2 +94,5 @@ 'use strict';
 
+    _this.ERROR_TOO_MANY_SOURCES = 'PowerPicture requires ONE prop of either \'source\' or \'sources\' but cannot accept both';
+    _this.ERROR_MISSING_SOURCE = 'PowerPicture requires either \'source\' or \'sources\' as a prop';
+
     _this.state = {
@@ -105,10 +108,19 @@ image: null,
     value: function componentDidMount() {
-      var sources = this.props.sources;
+      var _props = this.props,
+          source = _props.source,
+          sources = _props.sources;
 
+      var imgToLoad = void 0;
 
-      if (sources === undefined) {
-        throw new Error('PowerPicture requires sources as a prop');
+      if (sources) {
+        if (source) {
+          throw new Error(this.ERROR_TOO_MANY_SOURCES);
+        }
+        imgToLoad = this.getIdealSize(sources, window.innerWidth);
+      } else if (source) {
+        imgToLoad = source;
+      } else {
+        throw new Error(this.ERROR_MISSING_SOURCE);
       }
 
-      var imgToLoad = this.getIdealSize(sources, window.innerWidth);
       this.loadImage(imgToLoad);
@@ -129,9 +141,18 @@ }
 
-      var sources = this.props.sources;
+      var _props2 = this.props,
+          source = _props2.source,
+          sources = _props2.sources;
 
-      var imgToLoad = this.getIdealSize(sources, window.innerWidth);
+      var imgToLoad = source;
 
+      if (sources) {
+        imgToLoad = this.getIdealSize(sources, window.innerWidth);
+      }
+
       if (prevState.image !== null && imgToLoad !== prevState.image) {
-        this.setState({ loading: true }, function () {
-          _this2.loadImage(imgToLoad);
+        this.setState({
+          image: null,
+          loading: true
+        }, function () {
+          return _this2.loadImage(imgToLoad);
         });
@@ -170,6 +191,7 @@ }
 PowerPicture.propTypes = {
+  source: PropTypes.string,
   sources: PropTypes.arrayOf(PropTypes.shape({
     src: PropTypes.string,
     size: PropTypes.number
-  })).isRequired,
+  })),
   onError: PropTypes.func,
@@ -176,0 +198,0 @@ children: PropTypes.func

package.json

 {
   "name": "react-power-picture",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "A React component for rendering images both resposively and progressively",
@@ -5,0 +5,0 @@ "keywords": [

README.md

@@ -82,3 +82,3 @@ # React Power Picture
 
-You might consider React Power Picture to be a marriage of the two. My goad for this library to provide both progressive and responsive power.
+You might consider React Power Picture to be a marriage of the two. My goal for this library to provide both progressive and responsive power.
 
@@ -85,0 +85,0 @@ ## License

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

30703

increased by11.96%

Lines of code

333

increased by13.65%

No dependency changes