rax-image - npm Package Compare versions

Comparing version 2.0.2 to 2.0.3

lib/index.d.ts

 import { ImageProps } from './types';
-declare function Image(props: ImageProps): JSX.Element;
+declare function Image({ source, fallbackSource, onLoad, onError, style, resizeMode, ...otherProps }: ImageProps): JSX.Element;
 export default Image;

lib/index.js

@@ -12,72 +12,92 @@ "use strict";
 
-function Image(props) {
-  var _useState = (0, _rax.useState)(props.source),
-      source = _useState[0],
-      setSource = _useState[1];
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
 
-  var onError = (0, _rax.useCallback)(function (e) {
-    var fallbackSource = props.fallbackSource,
-        _props$onError = props.onError,
-        onError = _props$onError === void 0 ? function () {} : _props$onError;
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
 
-    if (fallbackSource && fallbackSource.uri && source.uri !== fallbackSource.uri) {
-      setSource(fallbackSource);
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+var EMPTY_SOURCE = {};
+
+function Image(_a) {
+  var source = _a.source,
+      fallbackSource = _a.fallbackSource,
+      onLoad = _a.onLoad,
+      onError = _a.onError,
+      style = _a.style,
+      resizeMode = _a.resizeMode,
+      otherProps = __rest(_a, ["source", "fallbackSource", "onLoad", "onError", "style", "resizeMode"]);
+
+  source = source || EMPTY_SOURCE;
+  fallbackSource = fallbackSource || EMPTY_SOURCE;
+  var nativeProps = otherProps;
+
+  var _useState = (0, _rax.useState)({}),
+      errorState = _useState[0],
+      setErrorState = _useState[1];
+
+  nativeProps.onError = (0, _rax.useCallback)(function (e) {
+    if (errorState.uri === undefined) {
+      setErrorState({
+        uri: source.uri
+      });
     }
 
-    onError(e);
-  }, []);
-  var onLoad = (0, _rax.useCallback)(function (e) {
-    var _props$onLoad = props.onLoad,
-        onLoad = _props$onLoad === void 0 ? function () {} : _props$onLoad;
-
-    if (typeof e.success !== 'undefined') {
+    onError && onError(e);
+  }, [source.uri, onError, errorState]);
+  nativeProps.onLoad = (0, _rax.useCallback)(function (e) {
+    if (e.success !== null) {
       if (e.success) {
-        onLoad(e);
+        onLoad && onLoad(e);
       } else {
-        onError(e);
+        onError && onError(e);
       }
-    } else if (typeof e.currentTarget !== 'undefined') {
+    } else if (e.currentTarget != null) {
       if (e.currentTarget.naturalWidth > 1 && e.currentTarget.naturalHeight > 1) {
-        onLoad(e);
+        onLoad && onLoad(e);
       } else {
-        onError(e);
+        onError && onError(e);
       }
     }
-  }, []); // Source must a object
+  }, [onLoad, onError]);
 
-  if (source && source.uri) {
-    var _props$style = props.style,
-        style = _props$style === void 0 ? {} : _props$style;
-    var width = source.width,
-        height = source.height,
-        uri = source.uri;
-    var nativeProps = Object.assign(Object.assign({}, props), {
-      src: uri,
-      onLoad: onLoad,
-      onError: onError
-    });
-    nativeProps.style = Object.assign({
-      width: width,
-      height: height
-    }, style);
-    delete nativeProps.source; // for cover and contain
+  if (errorState.uri !== undefined) {
+    if (errorState.uri !== source.uri) {
+      errorState.uri = undefined;
+    } else if (fallbackSource.uri != null) {
+      source = fallbackSource;
+    }
+  }
 
-    var resizeMode = nativeProps.resizeMode || nativeProps.style.resizeMode;
+  var _source = source,
+      width = _source.width,
+      height = _source.height,
+      uri = _source.uri;
+  nativeProps.src = uri;
+  nativeProps.style = Object.assign({
+    width: width,
+    height: height
+  }, style); // for cover and contain
 
-    if (resizeMode) {
-      if (_universalEnv.isWeex) {
-        nativeProps.resize = resizeMode;
-        nativeProps.style.resizeMode = resizeMode;
-      } else {
-        nativeProps.style.objectFit = resizeMode;
-      }
-    } // Set default quality to "original" in weex avoid image be optimized unexpect
+  resizeMode = resizeMode || nativeProps.style.resizeMode;
 
+  if (resizeMode) {
+    if (_universalEnv.isWeex) {
+      nativeProps.resize = resizeMode;
+      nativeProps.style.resizeMode = resizeMode;
+    } else {
+      nativeProps.style.objectFit = resizeMode;
+    }
+  } // Set default quality to "original" in weex avoid image be optimized unexpect
 
-    return _universalEnv.isWeex ? (0, _rax.createElement)("image", _extends({
-      quality: "original"
-    }, nativeProps)) : (0, _rax.createElement)("img", nativeProps);
-  }
 
-  return null;
+  return _universalEnv.isWeex ? (0, _rax.createElement)("image", _extends({
+    quality: "original"
+  }, nativeProps)) : (0, _rax.createElement)("img", nativeProps);
 }
@@ -84,0 +104,0 @@

package.json

 {
   "name": "rax-image",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "description": "Image component for Rax.",
@@ -5,0 +5,0 @@ "license": "BSD-3-Clause",

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

32707

increased by2.6%

Lines of code

701

increased by3.7%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes