PR adding handling of null values passed to matrix and tintColor props on Android. It should not happen from normal render method, but can still be passed with Animated or Reanimated through native updates or setNativeProps.
PR aligning handling of transform prop between web and native and adding proper handling of transform prop on web.
origin prop is now treated as transform-origin since it seems like the current behavior of this prop on native platforms.
transform prop cannot be an object with transform properties since it does not provide order of transformations which would lead to undefined behavior so this option has been removed.
RN style of transform prop (array of rotation objects) can now be used
font-size on web seems to be 16px by default and it is 12 in library - maybe we should align it somehow
removed maskTransform prop since it does not exist in SVG standard and did nothing on native side
fixed typo in Fabric Pattern updateProps method
Allow 'string' type for href and xlinkHref props in Image component.
Logic in the component allows passing 'string' values to the Image.resolveAssetSource by checking for its type, so it would be nice to reflect it on the properties types as well.
Up until now, trying to use reanimated with react-native-svg in react-native-web resulted in an error.
This adds a setNativeProps function to the web implementation to directly modify the transform and style props on a SVGElement ref.
Since there is a need to track the "last merged props" and those need to be reset on every render, the render method has been moved into the WebShape class and a tag string property has been added.
As g had some extra handling for x and y, a prepareProps function was added as well.
PR making Defs pass invalidate higher even though it does not conform to RNSVGContainer. Maybe it should be done another way round, making Defs component implement the protocol, since it does it already by having invalidate method.
Replaces PointerEvents.parsePointerEvents(pointerEventsStr) with PointerEvents.valueOf(pointerEventsStr.toUpperCase(Locale.US).replace("-", "_")). This is the implementation of the original method.
This PR is a bug fix and makes the pointer-events box-none work again after react-native 66 changes. It changes a bit how it should be used as I'll describe below. This solves #1807 .
I created a getHitSlopRect in the RenderableView that responds with a Rect that make the hit test detection fail on the react-native forcing it to run reactTagForTouch like it used to in previous versions.
This PR impacts pointer events box-none usage. This is an important change for me because it enables the usage of overlapping SVG keeping only the painted area as touchable elements, and not the whole SVG box.
PR fixing the behavior of setting color and tintColor values on SvgView component. Since we added proper annotations and macros on the native side, we don't have to call processColor on the JS side.
PR adding proper handling of pointerEvents in the library. Based on the comment by @RSNara :
> For all Android components, static ViewConfigs are generated from the components types + BaseVIewConfig.android.js. The BaseViewConfig for all android components is facebook/react-native@c5217f1/Libraries/NativeComponent/BaseViewConfig.android.js#L288-L297, which doesn't contain the pointerEvents validAttribute. So, React Native SVG components must re-declare the pointerEvents validAttribute. Otherwise, the pointerEvents validAttribute won't be in the static ViewConfig, which means React won't pass that prop to native with Static ViewConfigs.
We needed a way to trick codegen since we added our own pointerEvents with string type, and such prop is already present in ViewProps from react-native, but as a union of strings, so their types did not match. As codegen parses string literals, we include changed ViewProps type, without pointerEvents prop, so we satisfy both codegen and TS.
As for how pointerEvents are handled now:
iOS:
Paper: prop is passed in RCTViewManager but it looks like it does not matter what you pass there, since even if you set none, resulting in view.userInteractionEnabled = NO; (facebook/react-native@065db68/React/Views/RCTViewManager.m#L256), custom implementation of hitTest will not take it into account anyhow.
Fabric: we don’t use pointerEvents prop but it is not a problem since it is not used in the implementation of neither SvgView and RCTViewComponentView (it is used in hitTest method there, but we override it)
Android:
Paper: the prop was passed through ReactViewManager and was set on the view directly. But the setter for pointerEvents is not visible outside of ReactViewGroup . After adding Fabric integration for both platforms: BaseViewManager does not implement setter for pointerEvents so we have to add the prop by ourselves. Still, we cannot call the setter from ReactViewGroup since it is not visible, so all the logic for pointerEvents should be migrated to SvgView unfortunately or we should use reflection to get that method.
Despite that, it seems that behavior differs on Android and iOS since setting pointerEvents to none on Android makes the view not clickable, whereas on iOS it does not change anything.
If you built your app using `esbuild` (for example using [`@rnx-kit/metro-serializer-esbuild`](https://microsoft.github.io/rnx-kit/docs/tools/metro-serializer-esbuild)), then it complains that the imports do not exist for type imports.
Marking them explicitely as types fixes this issue, in addition to removing those import/exports from non-TS builds.
I also transformed them from an import + export statements to an `export … from …` statement.
PR adding update of _props after updateProps method in order for e.g. react-native-reanimated to pick correct props when running updates. Coauthored by @tomekzaw. It is needed since RCTMountingManager reads this field as oldProps: facebook/react-native@10e47b8/React/Fabric/Mounting/RCTMountingManager.mm#L306
PR transfering Fabric specs to TS, removing unnecessary @ReactProp adnotations, unifying inheritance hierarchy across platforms, adding custom types for color and image source props so they are parsed by react-native.
PR fixing the regression introduced in #1844. In that PR we set mRemovedFromReactViewHierarchy after one of SvgView's children has been removed, resulting in not being able to update it after one of the components in its hierarchy has been removed. In this PR the behavior has been changed, now we subscribe to startViewTransition which should be called only by react-native-screens when the screen starts its removal animation. It should still work for old issues as well as the new ones.
This PR should hopefully fix CI jobs for Example and FabricExample apps being cancelled by using matrix.working_directory variable in concurrency.group identifier.
On old react-native versions (e.g. 0.64.4), property setters on Android were handled differently, which resulted in calling Dynamic setters for e.g. fill, matrix and stroke prop. Since JS code has been changed, the props on the native side look a bit different. It lead to bugs in mentioned props, which was not spotted since the code was tested only on the newer versions of react-native, where new view managers are used and props do not resolve in Dynamic setters.
PR bumping library to RN 0.70-rc3, which might make it not compatible with earlier versions of RN on Fabric. It should come with the same change in other libraries.
In this PR, I had to remove macos code from Example since it breaks @react-native-community/cli resolution. Hopefully we can bring it back soon.
Most of Android changes for Fabric and bump of FabricExample to RN 0.69.2. iOS and JS changes are available in #1821.
The most notable change on Android is adding methods to components that accept String values of each NumberProp instead of Dynamic. Another change is changed structure of RenderableViewManager.java since we needed to abstract methods that belong only to components inheriting from VirtualView in order to be able to properly override them in their children.
Version of #1754 without usage of ComponentViews. It seems like a more proper way, but introduces the necessity of clearing whole state of each component on recycling for it not to be used when view is recycled.
Still known problems:
We stringify props of type NumberProp since codegen only accepts props of a single type. It is the fastest way of dealing with it, but maybe there could be a better way to handle it.
Image resolving should be probably handled the same as in RN core
SvgView needs to set opaque = NO so it is does not have black background (it comes from the fact that RCTViewComponentView overrides backgroundColor setter which in turn somehow messes with the view being opaque). All other svg components do it already so maybe it is not such an issue.
transform prop won't work when set natively since it is not parsed in Fabric
Props translateX and translateY are ignored on web. This PR is addressing it the same way as it is already done for originX and originY.
This PR is not addressing the issue of transform as stated in issue.
After #1800 merged, the refactoring 286c02f was performed and enum declaration was back to previous one.
So type error mentioned at #1210 for maskUnits should occurred again.
