- Fix
corners
andsides
properties not being Partial. #83. - Also, read the README about React Native 0.76 brand new built-in shadow! ;)
- Fixed issue when the child size would change only one of its axis. #72.
- As a minor performance improvement, now sides will only be rendered if they are known to be visible. Before, if your height was X and the topStart and bottomStart radii were each X/2, the left side would still be rendered even it having the size 0.
- Fixed X offset not working in iOS. #65, #67. Many thanks, dmdmd and Youssef Henna!
- Fixed inner circle of corners being black. #56 (comment).
- Fixed the outer part of corners not being cropped. #56 (comment). Thanks once again, alexco2!
- setChildLayoutWidth/height will now only be called if the sizes in pixels changed, ignoring useless re-renders due to very small changes in the values that wouldn't change the result.
- Fixed Android's
The argument must be a React element, but you passed null.
error. #56. Thanks again, alexco2!
- Fixed
undefined is not an object (evaluating 'd.width')
error. #56. Thanks, alexco2! - Fixed
flex-start
not being the defaultalignSelf
style as it was before.
- Fixed missing
version
const export inindex.tsx
.
- Added missing
import React from 'react'
.
Major changes to improve the performance, simplify the library usage and improve the Developer Experience. An important update that consolidates this library's maturity.
stretch
property - #7.disabled
property - Easy and performance-friendly way to disable the shadow (but to keep rendering the children).containerViewProps
property.childrenViewProps
property.
-
Renamed
viewStyle
tostyle
. -
Renamed
containerViewStyle
tocontainerStyle
. -
Renamed
finalColor
toendColor
, to follow thestart/end
pattern of the following change. -
left
/right
insides
andcorners
were changed tostart
/end
for RTL friendliness -
sides
andcorners
properties are now objects instead of arrays.Note that you may still use
borderTopLeftRadius
etc instyle
besidesborderTopStartRadius
if you want to.
size
property. The size now can only be defined in the Shadow's or child'sstyle
'swidth
andheight
properties.radius
property. The radii now can only be defined in the Shadow's or child'sstyle
'sborderRadius
related properties, such asborderTopStartRadius
/borderTopLeftRadius
etc.-
Properties removed for the sake of simplicity of this package. Probably no one used them anyway. If you did use them and want or need them, open an issue about it with your use case. They are always active now. Before, they were active by default.getChildRadius
andgetViewStyleRadius
.
- Significant performance and RAM usage due to general refactorings, SVGs' simplification (with the same appearance), improved memoizations and micro performance improvements.
- Now using
colord
package instead ofpolished
to deal with colors' alpha.
- RTL in web.
- Error when there is more than a child. #38
- Error when there isn't a child. #38 (comment)
- Situational 1-pixel overlap of corners.
- Fixed Web Shadow when there are more than one being rendered. #53. Many thanks, @GreyJohnsonGit!
- Fixed paintInside gaps on iOS. #36. Thanks, @walterholohan!
- Changed
react-native-svg
peerDep version from'*'
to'^12.1.0'
to warn users using older and certainly incompatible versions. - Added
version
export, the package semver version.
- Fixed topRight corner using bottomRight radius on its positioning instead its own radius. #33. Thanks, @timqha!
- Changed finalColor default to transparent startColor instead of
#000
. This results in a better gradient when startColor isn't black. Explanation. As this (unlikely) may lead to unexpected visual results in your app, made this version a major. - Changed shadow wrapping View style from
width: '100%', height: '100%', position: 'absolute',
to...StyleSheet.absoluteFillObject
. This fixed a strange overflowing shadow on the first render that happened in some specific case. - Added
pointerEvents='none'
to the shadow wrapping view. Thanks, OriErel! #32 - Added
shadowViewProps
property to set additional properties to the shadow wrapping view. #32 - tsconfig -
module
fromcommonjs
toes6
,jsx
fromreact
toreact-native
, addedesModuleInterop: true
- Changed tsconfig target from
esnext
toes6
. #29
- Fixed the multi-children error being raised when > 1 child but
radius={0}
.
- This package now supports RTL. #26. Thanks @abdullahkn287 and @serzh-f!
- [Web] - Removed
shape-rendering: 'crispEdges'
from the SVG parts as since 5.0.0 the Web shadow is pixel perfect (by properly rounding the sizes) and this previous semi-solution is no longer needed.
- Renamed
getChildRadiusStyle
property togetChildRadius
. - Each corner radius is now limited using this. The link is for CSS but works in the same way for mobile. #15. Thanks for the limit suggestion, @jimmi-joensson!
- Added safeRender property to only render on the 2nd render and beyond -- so, no relative rendering on the first render. This is useful when you want a pill/circle like shadow and you are inputting a radius greater than the corresponding sizes. On the future there may be a prop specific for those cases to have them working right on the first render.
- In web looks like it's now completly free from the pixel gaps/overlaps on the 2nd render and beyond!
- Added pointerEvents='box-none' to the container and content views, so clicks/presses go through them and your child may receive them. #24. Thanks, @AdamSheaHewett
- Fixed onLayout changes not taking effect when
size
prop was true then switched to false and then a new render was made.
- Added
getViewStyleRadius
. #19. Thanks @rbozan! - Added support for
borderTopStartRadius
,borderTopEndRadius
,borderBottomStartRadius
,borderTopStartRadius
ingetChildRadiusStyle
and in the newgetViewStyleRadius
. Before, onlyleft, right, top, bottom
combinations were supported. - Code improvements.
- Added
types
to package.json to displayTypeScript Types
in https://reactnative.directory. - react-native-community/directory #707. Thanks, @Simek!
- Now using @sharcoux/slider instead of @react-native-community/slider
Not too many changes here, but they require a major semver change. It implements #13
paintInside
now defaults to true if theoffset
property is defined. Else, it keeps its default to false;- Changed
viewStyle
type fromViewStyle
toStyleProp<ViewStyle>
. Thanks, jimmi-joensson! - Renamed ShadowI to ShadowProps
- Shadow with automatic size is applied on the same render!. Lib rewritten to allow it. 1 month of pure suffering and despair trying to find new html/svg/react hacks to do what I wanted. :') #7, #8, #9,
- Now it works on Web (React Native Web / Expo)
- Added
getChildRadius
prop. - Added
paintInside
prop. - Added
viewStyle
prop. - Removed
contentViewStyle
prop. - Changed default
startColor
from'#00000010'
to'#00000020'
, so it's more noticeable when first trying the lib. - Looks like the pixel gaps/overlaps are all solved. It was a very long and frustrating marathon to achieve this!
- [code] Added a partial README filler, using this (mine!)
- Added Sandbox! Used it a lot while developing this lib.
- Changed minor functionalities
- Minor fixes
We are calling this 3.0.0 because 2.0.0 would be ambiguous. One could think that the 1.0.0 is a reference to the original react-native-shadow package and the 2.0.0 would just be the react-native-shadow-2.
- Fixed sides shadow position when not having top/left side shadow.
- Added offset