6.0.6

Author: ftzi

CHANGELOG.md

@@ -1,3 +1,6 @@
+## 6.0.6 - 2022-07-21
+* Fixed Web Shadow when there are more than one being rendered. [#53](https://github.com/SrBrahma/react-native-shadow-2/issues/53). Many thanks, [@GreyJohnsonGit](https://github.com/GreyJohnsonGit)!
+
 ## 6.0.5 - 2022-05-01
 * Fixed Android crash when `distance` and a radius are both 0. [#47](https://github.com/SrBrahma/react-native-shadow-2/issues/47). Many thanks, [@Czino](https://github.com/Czino)!
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-shadow-2",
-  "version": "6.0.5",
+  "version": "6.0.6",
   "description": "Cross-platform shadow for React Native. Improved version of the abandoned react-native-shadow package",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",

sandbox/src/src/index.tsx

@@ -10,7 +10,7 @@ import { cornerToStyle, objFromKeys } from './utils';
 
 /** Package Semver. Used on the [Snack](https://snack.expo.dev/@srbrahma/react-native-shadow-2-sandbox)
  * and somehow may be useful to you. */
-export const version = '6.0.5';
+export const version = '6.0.6';
 
 const isWeb = Platform.OS === 'web';
 

src/index.tsx

@@ -10,7 +10,7 @@ import { cornerToStyle, objFromKeys } from './utils';
 
 /** Package Semver. Used on the [Snack](https://snack.expo.dev/@srbrahma/react-native-shadow-2-sandbox)
  * and somehow may be useful to you. */
-export const version = '6.0.5';
+export const version = '6.0.6';
 
 const isWeb = Platform.OS === 'web';
 
@@ -54,7 +54,7 @@ const sidesArray = ['left', 'right', 'top', 'bottom'] as const;
 /** Generates a sufficiently unique suffix to add to gradient ids and prevent collisions. */
 const generateGradientIdSuffix = (() => {
   let shadowGradientIdCounter = 0;
-  return () => String(shadowGradientIdCounter++)
+  return () => String(shadowGradientIdCounter++);
 })();
 
 
@@ -456,10 +456,7 @@ export const Shadow: React.FC<ShadowProps> = ({
       }
 
     </>);
-  }, [
-    safeRender, width, height, startColorProp, finalColorProp, radii, distance, distanceWithAdditional, heightWithAdditional,
-    widthWithAdditional, paintInside, sidesProp, cornersProp, isRTL,
-  ]);
+  }, [distance, paintInside, safeRender, width, height, startColorProp, finalColorProp, radii, distanceWithAdditional, heightWithAdditional, isRTL, gradientIdSuffix, widthWithAdditional, sidesProp, cornersProp]);
 
   const result = useMemo(() => {
     return (