react-progressive-image-loading - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

build/index.d.ts

 /// <reference types="react" />
 import * as React from "react";
-export interface ProgressiveImageProps extends React.HTMLProps<HTMLDivElement> {
+export declare type DivProps = React.HTMLProps<HTMLImageElement>;
+export declare type ImageProps = React.HTMLProps<HTMLDivElement>;
+export interface ProgressiveImageProps {
     preview: string;
     src: string;
+    background?: boolean;
 }
-export interface ProgressiveBackgroundImageProps extends React.HTMLProps<HTMLImageElement> {
-    preview: string;
-    src: string;
-    background: boolean;
-}
 export interface ProgressiveImageState {
@@ -16,3 +14,3 @@ src: string;
 }
-export declare class ProgressiveImage extends React.Component<ProgressiveImageProps & ProgressiveBackgroundImageProps, ProgressiveImageState> {
+export declare class ProgressiveImage extends React.Component<ProgressiveImageProps & DivProps & ImageProps, ProgressiveImageState> {
     private clonedProps;
@@ -19,0 +17,0 @@ componentWillMount(): void;

build/index.js

@@ -0,50 +1,70 @@
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __assign = (this && this.__assign) || Object.assign || function(t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+        s = arguments[i];
+        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+            t[p] = s[p];
+    }
+    return t;
+};
+import { assign } from "lodash";
 import * as React from "react";
-export class ProgressiveImage extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.clonedProps = {};
+var ProgressiveImage = (function (_super) {
+    __extends(ProgressiveImage, _super);
+    function ProgressiveImage() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.clonedProps = {};
+        return _this;
     }
-    componentWillMount() {
-        const { src, preview } = this.props;
+    ProgressiveImage.prototype.componentWillMount = function () {
+        var _this = this;
+        var _a = this.props, src = _a.src, preview = _a.preview;
         this.setState({ src: preview, blur: 10 });
         this.cloneProps();
-        fetch(src).then(() => this.setState({ src, blur: 0 }));
-    }
-    render() {
-        const { src, style, background } = this.props;
+        fetch(src).then(function () { return _this.setState({ src: src, blur: 0 }); });
+    };
+    ProgressiveImage.prototype.render = function () {
+        var _a = this.props, src = _a.src, style = _a.style, background = _a.background;
         return (React.createElement("div", null,
-            React.createElement("style", null, `
-                @-webkit-keyframes blur {
-                    0%  { -webkit-filter: blur(10px); }
-                    100% { -webkit-filter: blur(0); }
-                }
-                `),
+            React.createElement("style", null, "\n                @-webkit-keyframes blur {\n                    0%  { -webkit-filter: blur(10px); }\n                    100% { -webkit-filter: blur(0); }\n                }\n                "),
             background ?
-                React.createElement("div", Object.assign({ style: Object.assign(this.getBackgroundStyle(), style) }, this.clonedProps))
+                React.createElement("div", __assign({ style: assign(this.getBackgroundStyle(), style) }, this.clonedProps))
                 :
-                    React.createElement("img", Object.assign({ src: src, style: Object.assign(this.getStyle(), style) }, this.clonedProps))));
-    }
-    cloneProps() {
+                    React.createElement("img", __assign({ src: src, style: assign(this.getStyle(), style) }, this.clonedProps))));
+    };
+    ProgressiveImage.prototype.cloneProps = function () {
+        var _this = this;
         Object.keys(this.props)
-            .filter(prop => ["style", "src", "preview", "background"].indexOf(prop) === -1)
-            .forEach(prop => this.clonedProps[prop] = this.props[prop]);
-    }
-    getStyle() {
-        const { blur } = this.state;
+            .filter(function (prop) { return ["style", "src", "preview", "background"].indexOf(prop) === -1; })
+            .forEach(function (prop) { return _this.clonedProps[prop] = _this.props[prop]; });
+    };
+    ProgressiveImage.prototype.getStyle = function () {
+        var blur = this.state.blur;
         return {
-            filter: `blur(${blur}px)`,
+            filter: "blur(" + blur + "px)",
             animation: "blur 400ms",
             animationTimingFunction: "ease"
         };
-    }
-    getBackgroundStyle() {
-        const { src, blur } = this.state;
+    };
+    ProgressiveImage.prototype.getBackgroundStyle = function () {
+        var _a = this.state, src = _a.src, blur = _a.blur;
         return {
-            backgroundImage: `url(${src})`,
-            filter: `blur(${blur}px)`,
+            backgroundImage: "url(" + src + ")",
+            filter: "blur(" + blur + "px)",
             animation: "blur 400ms",
             animationTimingFunction: "ease"
         };
-    }
-}
+    };
+    return ProgressiveImage;
+}(React.Component));
+export { ProgressiveImage };
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "react-progressive-image-loading",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Progressively load images using a blur effect. Edit",
@@ -35,2 +35,3 @@ "main": "build/index.js",
   "devDependencies": {
+    "@types/lodash": "^4.14.63",
     "@types/react": "^15.0.23",
@@ -45,3 +46,6 @@ "condition-circle": "^1.5.0",
     "verifyConditions": "condition-circle"
+  },
+  "dependencies": {
+    "lodash": "^4.17.4"
   }
 }

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

18477

increased by9.03%

Lines of code

90

increased by25%

Worsened metrics

Dependency count

1

increased byInfinity%

Dev dependency count

7

increased by16.67%

Dependency changes

• + Addedlodash@^4.17.4

• + Addedlodash@4.17.21(transitive)