feat: Add logical border radius implementation (#35572)

mirror of https://github.com/facebook/react-native.git synced 2025-11-01 09:14:26 +00:00

Summary:
This PR implements logical border-radius as requested on https://github.com/facebook/react-native/issues/34425. This implementation includes the addition of the following style properties

- `borderEndEndRadius`, equivalent to `borderBottomEndRadius`.
- `borderEndStartRadius`, equivalent to `borderBottomStartRadius`.
- `borderStartEndRadius`, equivalent to `borderTopEndRadius`.
- `borderStartStartRadius`, equivalent to `borderTopStartRadius`.

## Changelog

[GENERAL] [ADDED] - Add logical border-radius implementation

Pull Request resolved: https://github.com/facebook/react-native/pull/35572

Test Plan:
1. Open the RNTester app and navigate to the `RTLExample` page
2. Test the new style properties through the `Logical Border Radii Start/End` section

https://user-images.githubusercontent.com/11707729/206623732-6d542347-93f9-40da-be97-f7dcd5f66ca9.mov

Reviewed By: necolas

Differential Revision: D42002043

Pulled By: NickGerleman

fbshipit-source-id: a0aa9783c280398b437aeb7a00c6eb3f767657a5

This commit is contained in:

Gabriel Donadel Dall'Agnol

2023-01-06 06:00:03 -08:00

committed by

Facebook GitHub Bot

parent 66927ec3aa

commit 4ae4984094

20 changed files with 234 additions and 32 deletions

									
										Libraries/NativeComponent/BaseViewConfig.ios.js
									
		+4
		
												View File
												
				@@ -221,6 +221,10 @@ const validAttributesForNonEventProps = {

				  borderBottomRightRadius: true,

				  borderBottomStartRadius: true,

				  borderBottomEndRadius: true,

				  borderEndEndRadius: true,

				  borderEndStartRadius: true,

				  borderStartEndRadius: true,

				  borderStartStartRadius: true,

				  display: true,

				  zIndex: true,