fixed the size of loading icon (#6)

* fixed the size of loading icon

* add header and height constraint

* updated version

Author: ali-718

README.md

@@ -128,6 +128,7 @@ export default App;
 | `hideSpinner` | `bool` | no       | render spinner while image loads or not |
 | `onError` | `func` | no       | if image fails to load (returns error details) |
 | `onLoad` | `func` | no       | if image loads successfully (returns image headers) |
+| `headers` | `object` | no       | Custom headers for image  |
 
 Any additional props are passed down to underlying `<img />` component.
 

example/src/modules/ErrorRender/ErrorRender.js

@@ -6,6 +6,7 @@ export const ErrorRender = ({
   handleRetry = () => {},
   icon: Icon,
   height,
+  width,
 }) => {
   const handler = useRef();
 
@@ -18,7 +19,17 @@ export const ErrorRender = ({
   if (Icon) return <div onClick={_handleRetry}>{Icon}</div>;
   return (
     <span
-      style={{ color: reloadIconColor, fontSize: height / 2 }}
+      style={{
+        color: reloadIconColor,
+        fontSize:
+          width < height
+            ? height / 2 < 50
+              ? height / 2
+              : 50
+            : width / 2 < 50
+            ? width / 2
+            : 50,
+      }}
       onClick={_handleRetry}
       className="assetcrush-reload"
     >

example/src/modules/ImageCrush.js

@@ -20,6 +20,7 @@ const ImageCrush = ({
   height,
   acEnv = "production",
   alt = '',
+  headers = {},
   ...props
 }) => {
   const [image, setImage] = useState("");
@@ -44,7 +45,7 @@ const ImageCrush = ({
     const key = getKey();
     let headers = {};
 
-    fetch(imageUrl, { headers: { "assetcrush-key": key, "ac-env": acEnv } })
+    fetch(imageUrl, { headers: { "assetcrush-key": key, "ac-env": acEnv, ...headers } })
       .then((r) => {
         headers = r.headers;
         return r.blob();

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@assetcrush/reactjs-sdk",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "A simple reactjs library to resize image on fly",
   "main": "dist/index.js",
   "types": "index.d.ts",