feat: Add Fabric implementation of inset logical properties

[gabrieldonadel]

Summary

This PR implements inset logical properties as requested on #34425. This implementation includes the addition of the following style properties

• inset, equivalent to top, bottom, right and left.
• insetBlock, equivalent to top and bottom.
• insetBlockEnd, equivalent to bottom.
• insetBlockStart, equivalent to top.
• insetInline, equivalent to right and left.
• insetInlineEnd, equivalent to right or left.
• insetInlineStart, equivalent to right or left.

Changelog

[GENERAL] [ADDED] - Add Fabric implementation of inset logical properties

Test Plan

1. Open the RNTester app and navigate to the View page
2. Test the new style properties through the Insets section

Android	iOS

[analysis-bot]

Platform	Engine	Arch	Size (bytes)	Diff
ios	-	universal	n/a	--

Base commit: 9f78517
Branch: main

[analysis-bot]

Platform	Engine	Arch	Size (bytes)	Diff
android	hermes	arm64-v8a	8,467,354	+632
android	hermes	armeabi-v7a	7,787,208	+1,235
android	hermes	x86	8,942,212	+1,549
android	hermes	x86_64	8,799,859	+1,235
android	jsc	arm64-v8a	9,652,983	+174
android	jsc	armeabi-v7a	8,386,725	+717
android	jsc	x86	9,716,974	+778
android	jsc	x86_64	10,194,432	+510

Base commit: 9f78517
Branch: main

[pull-bot]

PR build artifact for d833603 is ready.
To use, download tarball from "Artifacts" tab in this CircleCI job then run yarn add <path to tarball> in your React Native project.

[NickGerleman]

We should give top/bottom precedence over BlockStart/BlockEnd, to match the resolution Yoga will do when given Start/End vs Left/Right. I.e. cardinal direction wins over flow relative direction. The group below this one can be matched for props which lose precedence to ones already set.

I think all the other values should be fine as is. E.g. “insetInlineStart” is the standard conformant name, so it should clobber RN’s “start”. Horizontal/Vertical and All don’t have existing props, so precedence doesn’t matter for them.

[gabrieldonadel]

got it @NickGerleman, I've just pushed a commit fixing this

[NickGerleman]

Thanks for the contribution. As a heads up, I’m mostly off the grid until January. Your last change should also be ready to merge internally, but I’m wanting to follow up with a screenshot test that we can’t do in OSS right now, that’s on my queue.

[facebook-github-bot]

@ryancat has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

[pull-bot]

PR build artifact for b4cd397 is ready.
To use, download tarball from "Artifacts" tab in this CircleCI job then run yarn add <path to tarball> in your React Native project.

[facebook-github-bot]

@ryancat merged this pull request in 9669c10.

[NickGerleman]

@gabrieldonadel would you be able to make a PR to https://github.com/facebook/react-native-deprecated-modules/tree/main/deprecated-react-native-prop-types with these changes as well? Same for the last PR once that is merged.

There's a non-ideal situation where we deprecated RN's provided prop-types and moved them to a different repo, but we recently un-deprecated it after feedback we removed it too quickly. It is bundled (and enforced) as part of RN again, but we haven't yet brought the code back to the repo.

In the meantime, prop changes end up touching three different repos (react-native, react-native-deprecated-modules, react-native-website). Though the issue will be better once prop-types are removed in a couple releases, or if we can copy the package back to the RN monorepo before then (FYI @hoxyq).

[gabrieldonadel]

Sure thing @NickGerleman, here is the PR -> facebook/react-native-deprecated-modules#12