Commit Graph
1290 Commits
Author SHA1 Message Date
Jorge Cabiedes Acosta 4075418c14 Add support for assymetrical border radii when using % (#46009)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46009

as title

Changelog: [Internal]

Reviewed By: NickGerleman

Differential Revision: D61148739

fbshipit-source-id: 7cc37f98ab441df2e0df7cfa0415791cb642caaf
2024-08-22 21:03:28 -07:00
Soe Lynn e1a1cdacf2 Update RNTester and HelloWorld to min iOS 15.1 (#46136)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46136

Changelog:
[iOS] - Update RNTester and HelloWorld template app to `min iOS 15.1`

Reviewed By: philIip, blakef

Differential Revision: D61604036

fbshipit-source-id: 9260b9b51a9c976792fd9d705b9b6a35a88a7f86
2024-08-21 12:11:58 -07:00
Tim Yung ed3ca0730c Appearance: Dedupe colorScheme Validation Logic (#46120)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46120

Currently, the implementation of `Appearance` duplicates the validation logic of string `colorScheme` values multiple times.

This leads to more complicated code and also unnecessary work in certain edge cases (e.g. when `NativeAppearance` is not registered).

This refactors `Appearance` to be simpler and to do less work. I've also configured `NativeAppearance.setColorScheme` to be non-nullable because it has existed since 2023.

Changelog:
[Internal]

Reviewed By: TheSavior

Differential Revision: D61567881

fbshipit-source-id: 61cb51709dc716ad97ae1397105414e74fe57a28
2024-08-21 01:48:58 -07:00
Nick Gerleman 387560a9af Make StaticViewConfigValidator permissive of extra attributes on SVC compared to native viewconfig (#45859)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45859

"Fabric without SVCs" configuration is nearly gone, and so it doesn't make sense to need to add no-op methods, on normally Paper only code, etc to satisfy native viewconfig. These particular warnings are then more often noise, than things we need to action on.

Checking for native code to be present can also break development where users are using distributed native app, slightly older than JS.

This keeps the warning, only if static viewconfigs are missing native view config attributes (i.e. new prop would only be exposed to Paper, instead of only exposed to Fabric)

Changelog: [Internal]

Reviewed By: javache

Differential Revision: D60575253

fbshipit-source-id: 1c118274b92eb7922c0dd92df060b24e44fceb3d
2024-08-20 18:58:07 -07:00
Nick Gerleman 3cd6d18aa8 Increase Example List Density (#46080)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46080

1. Force the examples to be alphabetized, where the hand-maintained list has some examples that are not
2. Remove reundant/not useful UI

Changelog: [Internal]

Reviewed By: cortinico

Differential Revision: D61430910

fbshipit-source-id: 1f3e116fe81502faa7a72f2720912e26c9f04bb2
2024-08-20 16:48:38 -07:00
Nick Gerleman d713349b0c Replace "elevation" in RNTester rows with box-shadow (#46076)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46076

This will add the shadows to iOS as well. let's see if anyone notices 🙂. I also removed dead styles, and removed some of the extra (excessive) padding specific to Android where the previous shadows would overlap.

Changelog: [Internal]

Reviewed By: rshest

Differential Revision: D61421903

fbshipit-source-id: 887fa5aa96e3b0b4f81114ee814897c218db2b76
2024-08-20 16:48:38 -07:00
Riccardo Cipolleschi 31cbc77f52 Add internal end to end tests for text and background color with border width (#46068)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46068

This change adds some internal E2E tests to verify that the text is rendered properly on top of a solid background color when borderWidth is set

## Changelog
[Internal] - Add E2E tests

Reviewed By: cortinico

Differential Revision: D61392253

fbshipit-source-id: 76e11821eba96ac75b055c5fe94365197c0f9be2
2024-08-20 04:38:45 -07:00
Riccardo Cipolleschi 0f4a405f28 Add Text example with BG and borderWidth
Summary:
This diff adds an example in RNTester to verify that we can draw text on top of a colored background and non uniform border radius.

As you can see from the test plan, the current code works well when:
* There is only the background color
* There is a background color and uniform cornerRadius
* There are non uniform border radius but the background is transparent.

The current code **does not** work when:
* there is a background and non-uniform border radius
* there is a background, uniform border radius and borderwidth

The reason why this happens is because:
* `RCTParagraphComponentView` draws the text in the View's main layer in the `drawRect` method
* `RCTViewComponentView` has a method `invalidateLayer` that, when there are non-uniform border radii o there is a borderWidth, it creates an extra `CALayer` with an image as content and that layer is put on top of the base layer, covering the text.

## Changelog
[Internal] - Add example to RNTester

Reviewed By: cortinico

Differential Revision: D61389317

fbshipit-source-id: 3e0a9e6c611190f90198a1b0b5855431b9f6ed12
2024-08-20 04:38:45 -07:00
Nishan 1a49892d57 fix: linear gradient color stop fix up spec (#45969)
Summary:
- Color stops needs to follow [fix up spec](https://drafts.csswg.org/css-images-4/#color-stop-fixup)
- Adds multiple stops syntax support. e.g. linear-gradient(red 30% 50%, green).
- Rename `position` to `positions` in object style API. Optional string array here makes more sense. We'll add number array support once `px` support is added. Will do it as a follow up to this PR.

TODOs: transition hint syntax support `linear-gradient(red, 50%, green)` (Done locally, dependent on this PR). `px` support.

## Changelog:
[GENERAL] [FIXED] - Linear gradient color stop spec.

<!-- Help reviewers and the release process by writing your own changelog entry.

Pick one each for the category and type tags:

For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests

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

Test Plan: - Added testcases in processBackgroundImage-test.js

Reviewed By: javache

Differential Revision: D61309203

Pulled By: NickGerleman

fbshipit-source-id: 884052c6841320048933361f38e6478ff4192736
2024-08-19 18:23:13 -07:00
Jorge Cabiedes Acosta 0f3ed90455 Add mix-blend-mode examples to rn-tester (#46006)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46006

Adding some extra examples for mix-blend-mode

And added E2E tests for each mix-blend-mode example

Changelog: [Internal]

Reviewed By: NickGerleman

Differential Revision: D60605636

fbshipit-source-id: 553f3a2c3b971c918530bdee5a73108c22bd936e
2024-08-19 11:07:46 -07:00
Christoph Purrer 6340662d4f Add C++ Turbo Module enum Event Emitter example (#46049)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46049

## Changelog:

[General] [Added] - Add C++ Turbo Module enum Event Emitter example

Reviewed By: kentwilliam

Differential Revision: D61336742

fbshipit-source-id: 81ac54020f4d88dc3c1235541d613a59235069a3
2024-08-19 08:26:20 -07:00
Phillip Pan e881a1184c convert TurboReactPackage to BaseReactPackage in oss (#46055)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46055

Changelog: [Android][Breaking]

BaseReactPackage is a 1:1 replacement for the deprecated TurboReactPackage. TurboReactPackage has been deprecated since 0.74. let's move the codebase to the recommended standard.

Reviewed By: cortinico

Differential Revision: D61329022

fbshipit-source-id: cef69e37bb2be7f6dccbab70d0996c33a8abf091
2024-08-16 17:41:32 -07:00
Sam Zhou 77154c64f0 Eliminate exact React.Element types in react-native codebase
Summary: Changelog: [Internal]

Reviewed By: alexmckenley

Differential Revision: D61389820

fbshipit-source-id: 566a4904c570e24f5beb965734020f8b9c1ed819
2024-08-16 07:30:09 -07:00
Joe Vilches d490354cd8 Add View box shadow e2e tests (#46054)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46054

tsia, more test = good

Changelog: [Internal]

Reviewed By: necolas

Differential Revision: D60938608

fbshipit-source-id: abce5ab7d42a7f7f626f0edc852aa1374f8029f0
2024-08-15 20:59:11 -07:00
Jorge Cabiedes Acosta d69dbd6f15 Add support for assymetrical bonder radii when using % (#45985)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45985

As title.

We can now create ellipses when using percentages. The algorithm for this is still flawed and to get it to be a 1:1 to web it will probably require a re-write of some of the logic but this should get us closer for now.

Some examples:

1. Border thinning on large single corner radii (100%)
 {F1798145800}
2. Thinning gets worse when having irregular border colors (100%)
 {F1798148002}

Changelog: [Internal]

Reviewed By: NickGerleman

Differential Revision: D61025927

fbshipit-source-id: 218d44af014bc8351c329ff1bca82658aebac38c
2024-08-15 12:35:15 -07:00
Blake Friedman bd3a3e3de0 Remove @react-native-community/cli direct dependencies (#45927)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45927

This was attempted earlier in the year, and was unsuccessful because HelloWorld had a hidden dependency on this.

Changelog: [General][Breaking] Projects that intend to use the community CLI will now have to declare that dependency instead of transitively having the react-native package handle this.

Reviewed By: GijsWeterings

Differential Revision: D60898346

fbshipit-source-id: 1d62615f718e06caf684f48ecfaf610bf1f51f8e
2024-08-14 12:55:50 -07:00
Nicola Corti 6dc01dad09 Do not depend on OSS SoLoader anymore (#45873)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45873

I'm removing the Gradle dependency on OSS SoLoader and stubbing it with our own implementation.
This will allow us to implement merging of further .so libraries and

As Fresco also depends on SoLoader, I had to stub the `NativeLoader` dependency as well.

Changelog:
[Android] [Breaking] - Do not depend on OSS SoLoader anymore and do not expose Fresco `api` dependency.

Reviewed By: mdvacca

Differential Revision: D60652007

fbshipit-source-id: 6e70a5c37ba9337fbe8772e192b886ba4693c7f1
2024-08-14 05:07:56 -07:00
Sam Zhou a622a43764 Replace all exact React.Element type in react-native with ExactReactElement_DEPRECATED (#45998)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45998

The exact `React.Element` type is deprecated and will be removed in a future version of Flow.

Changelog: [Internal]

Reviewed By: gkz

Differential Revision: D61205640

fbshipit-source-id: a029a3a46c7d8d9f94b0b931b991b2ce461151b2
2024-08-13 09:08:44 -07:00
Nicola Corti d01f1b3214 Add support for handling com.facebook.react.bridge.Dynamic as parameter type in TurboModules (#45944)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45944

This diff adds support having (Legacy) Native Modules with functions with parameters of type `Dynamic`.
This is currently blocking some libraries making it harder for them to migrate to New Architecture.

I've implemented it by adding a `DynamicNative` implementation of `Dynamic` which holds a reference of
the payload as a `folly::dynamic`.

Changelog:
[Android] [Added] - Add support for handling `com.facebook.react.bridge.Dynamic` as parameter type in TurboModules

Reviewed By: mdvacca, cipolleschi

Differential Revision: D60966684

fbshipit-source-id: 2e63bc53ede5277a9c12f1b19f05f6099f5f35f9
2024-08-12 12:56:38 -07:00
Ingrid Wang 8a390ba9b8 Mark setNetworkActivityIndicatorVisible as deprecated (#45950)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45950

Changelog:

[iOS][Deprecated] Deprecated StatusBar.setNetworkActivityIndicatorVisible

The status bar network activity indicator is deprecated in iOS 13. Setting its visibility has no effect in iOS 13 and later. It will be completely removed in a future release.

Reviewed By: philIip

Differential Revision: D60977517

fbshipit-source-id: 31e79113fffd0201c4393b61236d3911e82b40d1
2024-08-08 16:27:49 -07:00
Alex Hunt e9e5fb0141 Remove unstable_fuseboxEnabled API (#45926)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45926

Removes the temporary `unstable_fuseboxEnabled` API on both platforms. Fusebox is enabled by default on `main` since https://github.com/facebook/react-native/pull/45469.

Changelog: [Internal]

Reviewed By: cortinico

Differential Revision: D60893243

fbshipit-source-id: 7ca4550eafb979730c0c5829df4c200f11e0df30
2024-08-07 06:40:13 -07:00
Sam Zhou 5b96e90f77 Replace React.Element<any> and unnecessarily specific React.Element with React.MixedElement (#45923)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45923

Changelog: [Internal]

Reviewed By: gkz

Differential Revision: D60872182

fbshipit-source-id: b81fb43968c52cbfdb4a9fa57f1175aabc2a3939
2024-08-06 21:33:08 -07:00
Nishan b99675d78a feat: linear gradient ios (#45434)
Summary:
- Adds `background` prop that supports CSS's linear gradient. Later this can be extended to support various other gradients and possibly CSS's background image (less motivation as better solutions exists for image)
- Uses `CAGradientlayer` to draw Linear Gradient layers. So it is GPU optimised under the hood.
- Style supports JS object to specify `LinearGradient`, so it can support Animated libraries.

## Changelog:
[IOS] [ADDED] - linear gradient

<!-- Help reviewers and the release process by writing your own changelog entry.

Pick one each for the category and type tags:

[ANDROID|GENERAL|IOS|INTERNAL] [BREAKING|ADDED|CHANGED|DEPRECATED|REMOVED|FIXED|SECURITY] - Message

For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests

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

Test Plan:
- Check out `processBackground-test.js` for supported syntax testcases.
- Checkout example added in ViewExample.js

Although the PR is tested well but open to any changes/feedback on the approach taken.

Android PR - https://github.com/facebook/react-native/pull/45433. Separated the PRs to keep it easier to review. Both PRs can be reviewed individually.

Reviewed By: NickGerleman

Differential Revision: D60791581

Pulled By: joevilches

fbshipit-source-id: 051088fdf68d9fe20c0c306f1f1c591cbd77f3d5
2024-08-06 13:59:33 -07:00
Nick Gerleman 9035008427 Add Screenshot Tests for Image border, background, shadows (#45885)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45885

There are some gaps here right now, but Android API 31+ is looking good.

Changelog: [Internal]

Reviewed By: joevilches

Differential Revision: D60731848

fbshipit-source-id: f515270a61a00c362b584f0d1549d14098c2e385
2024-08-06 09:25:34 -07:00
Sam Zhou ae73fe462e Replace React$Element that will cause an error in the future
Summary:
For the ones where `React.MixedElement` would suffice, I change them to `React.MixedElement`. For everything else, I changed it to be `React.Element`

Changelog: [Internal]

Reviewed By: gkz

Differential Revision: D60798229

fbshipit-source-id: 40176b44769aade2c6b63a680d03c10056b2ddfa
2024-08-05 18:42:05 -07:00
Sam Zhou 4f47b385fa Cleanup all uses of internal flow type React$ElementRef in react-native (#45904)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45904

Flow will error on these dollar types soon. For all the ones changed here, they can all be further simplified.

Changelog: [Internal]

Reviewed By: gkz

Differential Revision: D60786768

fbshipit-source-id: e26bf0be1c4a933fc0bd8b59827e10cbd7242a83
2024-08-05 14:51:30 -07:00
Thomas Nardone a696d2ed6b Deprecate MapBuilder and remove Kotlin usages (#45743)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45743

This is a Java-centric class that can be replaced by Kotlin's map extensions.

Changelog:
[Android][Deprecated] Deprecate MapBuilder

Reviewed By: cortinico

Differential Revision: D60309106

fbshipit-source-id: 4a764fa1d59993dc735b2181a2270dc79a0e0396
2024-08-02 13:58:32 -07:00
Rubén Norte e14b5f1d6f Move default export of PerformanceObserver to named export (#45874)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45874

Changelog: [internal]

Move default export of `PerformanceObserver` to named export.

Reviewed By: sammy-SC

Differential Revision: D60597779

fbshipit-source-id: 39f82c1903aa32a5318b112cbb03b63e4e6d2fc0
2024-08-02 10:19:49 -07:00
Jorge Cabiedes Acosta 54a6438eaa Fix default imageSource on Filters example (#45799)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45799

No idea how I missed this but I don't think `defaultProps` is a thing in React Native? So the images were not showing

Changelog: [internal]

Reviewed By: joevilches

Differential Revision: D60392853

fbshipit-source-id: 27280033fb719340a809053d6ca98ac3f178c8c3
2024-08-01 10:38:53 -07:00
Nishan bd0aedc8c3 feat: linear gradient android (#45433)
Summary:
- Adds `background` prop that supports CSS's linear gradient. Later this can be extended to support various other gradients and possibly CSS's background image (less motivation as better solutions exists for image)
- Extended `CSSBackgroundDrawable` to draw Linear Gradient shader while preserving the border style support.
- Style supports JS object to specify `LinearGradient`, so it can support Animated libraries.

## Changelog:
[ANDROID] [ADDED] - linear gradient

<!-- Help reviewers and the release process by writing your own changelog entry.

Pick one each for the category and type tags:

[ANDROID|GENERAL|IOS|INTERNAL] [BREAKING|ADDED|CHANGED|DEPRECATED|REMOVED|FIXED|SECURITY] - Message

For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests

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

Test Plan:
- Check out `processBackground-test.js` for supported syntax testcases.
- Checkout examples added in `LinearGradientExample.js`

Although the PR is tested well but open to any changes/feedback on the approach taken.

iOS PR - https://github.com/facebook/react-native/pull/45433. Separated the PRs to keep it easier to review. Both PRs can be reviewed individually.

Reviewed By: joevilches

Differential Revision: D60493360

Pulled By: NickGerleman

fbshipit-source-id: 762929c4fe16d87cbbd9ebe83ecce96a9e13192c
2024-08-01 09:38:51 -07:00
Nick Gerleman f26027e3c0 BackgroundStyleApplicator and boxShadow in Text (#45830)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45830

Like the previous diffs, but for Text!

Changelog: [Internal]

Reviewed By: joevilches

Differential Revision: D60488060

fbshipit-source-id: 9ce89f65f44df75a83f86f14d2cbdfbf96f32a7c
2024-07-31 23:49:48 -07:00
Nick Gerleman 32d040380f Add Image Box Shadow Examples (#45781)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45781

This adds some RNTester examples for `boxShadow`, that render correctly when `ReactNativeFeatureFlags.enableBackgroundStyleApplicator()` is set!

Changelog: [Internal]

Reviewed By: joevilches

Differential Revision: D60367850

fbshipit-source-id: 3c9ae2bf906ae923c713b5f36cd2000f612fe3dc
2024-07-30 15:46:28 -07:00
Rubén Norte 8a4ddab2c2 Move MutationObserver to react-native/src/private (#45791)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45791

Changelog: [internal]

These files are safe to move because they haven't been enabled in OSS and people shouldn't be importing them directly.

Reviewed By: rshest

Differential Revision: D60377869

fbshipit-source-id: 02bc0335385859c0589a494de9b59b0c2ebc06f6
2024-07-30 10:08:22 -07:00
Rubén Norte e84d313209 Move IntersectionObserver to react-native/src/private (#45792)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45792

Changelog: [internal]

These files are safe to move because they haven't been enabled in OSS and people shouldn't be importing them directly.

Reviewed By: rshest

Differential Revision: D60377868

fbshipit-source-id: db0ec2839af91620fe8b6d3927ad0b809d1bdf23
2024-07-30 10:08:22 -07:00
Riccardo Cipolleschi 37cc7c7aec Create first test flow (#45574)
Summary:
## Context
Running manual tests when preparing a release, it's time consuming.
We have to do the cherry picks, wait for CI to finish, and then manually test 8 configurations.

Maestro is a tool that allow us to run E2E tests automatically, and we can wire it to CI.

## Change
Add a test flow for RNTester

## Changelog:
[Internal] - Exploration to integrate maestro

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

Test Plan: GHA

Reviewed By: blakef

Differential Revision: D60282147

Pulled By: cipolleschi

fbshipit-source-id: 4ecba84f0b2c7186de2bb9938043e73a0bd9a6bd
2024-07-26 09:57:46 -07:00
Nicola Corti 6ced6fe1b5 Move react_codegen_* + react_nativemodules_* libraries to static linking (#45639)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45639

There is a circular dependency between libreactnative.so and libreact_codegen_rncore.so which I'm breaking here.

Changelog:
[Internal] [Changed] - Move react_codegen_* + react_nativemodules_* libraries to static linking

Reviewed By: cipolleschi

Differential Revision: D55799200

fbshipit-source-id: 53f814636f016a8c93f40b0456686228dfb46888
2024-07-26 07:00:32 -07:00
Nicola Corti 52de8c70f2 Move several libs from default App CMake setup to static linking (#43909)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/43909

As we're moving towards a single `libreactnative.so` file, we need to remove several of our prefab targets. Here I'm cleaning up those that are not having an OnLoad.cpp file which needs to be loaded from SoLoader.

This is breaking for libraries using native dependencies via Prefab (i.e. search for `ReactAndroid::` in CMakeLists.txt files for your project).

If so, the CMakeLists.txt files should be updated as follows:

```diff
- ReactAndroid::react_render_debug
+ ReactAndroid::reactnative
```

This applies to every prefab dependencies (the example is just for `react_render_debug`

Changelog:
[General] [Breaking] - Remove several libs from default App CMake setup

Reviewed By: cipolleschi

Differential Revision: D55751683

fbshipit-source-id: 3aca7897852b5f323d60ede3c5036cae2f81e6c3
2024-07-26 07:00:32 -07:00
Nicola Corti bd4aec869b RNGP - Do not attempt to load JSC from other repositories (#45598)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45598

I've noticed we attempt to load JSC from the Sonatype Snapshot repository.
That is inefficient as we already know that JSC is available only inside node modules.
This change makes the repository resolution stricter by better specifying which
repo can download which dependency.

Changelog:
[Internal] [Changed] - Do not attempt to load JSC from other repositories

Reviewed By: cipolleschi

Differential Revision: D60116002

fbshipit-source-id: 21a2213708f5b0103860a59f3342f1bc0f59cdb9
2024-07-23 08:12:42 -07:00
Nicola Corti 0529818d36 Fix several build warnings on RN-Tester (#45569)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45569

Same as title

Changelog:
[Internal] [Changed] - Fix several build warnings on RN-Tester

Reviewed By: realsoelynn

Differential Revision: D60036158

fbshipit-source-id: 549b84f52594e1a442058222a3a45118739a1eb3
2024-07-22 12:16:12 -07:00
Nick Gerleman d9263fbdbb Enable ViewConfig validation in RNTester (#45530)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45530

Enable viewconfig validation for RNTester to catch where static and native viewconfigs are mismatched, during development or contribution time. This relies on `useNativeViewConfigsInBridgelessMode()` which is already enabled in `DefaultNewArchitectureEntryPoint` on Android, and seems to be in iOS AppDelegate `RCTRootViewFactory` as well.

We put it in an early place in the bundle before first render, since we don't have RNTester preludes right now, but I think it is still early enough?

Changelog: [Internal]

Reviewed By: javache

Differential Revision: D59946366

fbshipit-source-id: ae0c23b13a566489a88a7b4e408f61dce314b003
2024-07-19 09:37:03 -07:00
Rubén Norte 64c4e385cb Implement Long Tasks API for PerformanceObserver (#45473)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45473

This is a basic implementation of the Long Tasks API (https://w3c.github.io/longtasks/).

It detects and reports long tasks when using the Event Loop (in the modern RuntimeScheduler) when a new feature flag for this purpose is enabled.

This doesn't include attribution information at the moment.

Changelog: [internal]

Reviewed By: sammy-SC

Differential Revision: D55491870

fbshipit-source-id: e1ccad9cc6a35073b31230a8cf3a4660ab9a043d
2024-07-18 05:08:58 -07:00
Nick Gerleman f96a4c0d5d Camelize filter function names in object notation (#45503)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45503

Kebab case object literals are a pain as an API to give folks. Keep string parsing using the kebab-case web names, like in CSS, but keep object notation camelCase.

This is super super hacked up, and we should burn away all these viewconfig processors as soon as we can.

Changelog: [Internal]

Reviewed By: cortinico

Differential Revision: D59793095

fbshipit-source-id: 888cad31142d7aeed42687ab23c2023ac7e4882d
2024-07-17 20:35:17 -07:00
Blake Friedman 188a09ef69 fix linting noise (#45465)
Summary:
## Summary:
Fix linting warnings

Changelog: [Internal]

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

Test Plan:
```
$ eslint .
Done in 46.11s.
$ arc f
ok No lint issues.
```

Reviewed By: cipolleschi

Differential Revision: D59805820

Pulled By: blakef

fbshipit-source-id: f33d99a6a06607c3c3762881cc7c182804b981e1
2024-07-17 10:07:00 -07:00
Riccardo Cipolleschi 050006a7a7 Add example for Pressability with Native Driver in RNTester (#45413)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45413

## Changes
Add an example in RNTester to test that pressability with NativeDrivers works properly.

## Context
The pressability handling is a bit peculiar.
We have to handle 3 main behaviors:
* `PressIn` -> `PressOut` => triggers the `onPress`
* `PressIn` -> move inside the rectangle -> `PressOut` => triggers the `onPress`
* `PressIn` -> move outside the rectangle -> `PressOut` => cancel `onPress`.

For the first case, we detect whether the press happens inside a component in the Native layer only. And everything works.

When a move is involved, we:
1. Detect the initial press in the Native layer
2. We move the coursor and we delegate the detection of whether we are inside of a rect or not to the JS layer
3. The JS layer asks the C++ layer about the layout and decide whether we are in case 2 (move but still inside the rect) or in case 3 (move but outside the rect).

The problem is that with `nativeDriver` and animations, the C++ layer doesn't know about where the receiver view actually is.
This results in issues like the one shown by [#36504](https://github.com/facebook/react-native/issues/36504), where the onMove is not handled correctly.

## Solution
The solution is to keep detecting whether we are in the receiver view or not in the Native layer and pass the receiver view position and size back to JS so that the JS layer don't have to jump to C++ to make this decision.

We decided to pass the frame information because the JS layer is adding some padding and configurations to the final rectangle and we don't want to lose those configurations.

## Changelog
[General][Added] - Add example in RNTester to show that pressability works properly with NativeDrivers

Reviewed By: sammy-SC

Differential Revision: D58182480

fbshipit-source-id: 9ca4fb9a3ca1a8af52ccbe208cbfe8434175f87d
2024-07-16 07:20:51 -07:00
Riccardo Cipolleschi 7fd6c2c45e Fix CCI cache issues (#45460)
Summary:
CCI on main is broken. We suspect that's due to cache issues which restore a wrong layout for the Folly pod.
This PR is an attempt to fix it

## Changelog:
[Internal] - Fix missing folly base 64

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

Test Plan: CCI and GHA are green

Reviewed By: sammy-SC, huntie

Differential Revision: D59804748

Pulled By: cipolleschi

fbshipit-source-id: 44d6b169cf3319f4d7ee9e0a5833f07bc6ba4bb3
2024-07-16 06:26:07 -07:00
Joe Vilches 944d40f204 Add mix-blend-mode effects to iOS (#45304)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45304

Add support for most keyword values of mix-blend-mode on iOS and added RNTester Example
Missing compositing operators and global values

Changelog: [Internal]

Reviewed By: NickGerleman

Differential Revision: D59402969

fbshipit-source-id: b7e1aaed01fbf8f80e04ad0fa73d2ef63b5ad933
2024-07-15 18:10:17 -07:00
Joe Vilches a96272e27e Add drop-shadow test (#45306)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45306

Adding missing drop-shadow test to rn-tester.
Added with alpha-hotdog image to show we are creating the shadow with the alpha channel of the view.

Changelog: [Internal]

Reviewed By: cortinico

Differential Revision: D59410148

fbshipit-source-id: 5a03ee84313979f99585b8ca7e07abf9cdbe2396
2024-07-15 16:09:43 -07:00
generatedunixname89002005232357 85dd14c912 Revert D59170923 (#45447)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45447

This diff reverts D59170923
Breaking OSS build

Changelog: [Internal]

Reviewed By: blakef

Differential Revision: D59759991

fbshipit-source-id: 39aa0b447a90801d1da5a39461b33b4c4cc4197b
2024-07-15 13:44:09 -07:00
Peter Abbondanzo 018d0621c1 Declare public resources from images that are loaded by name (#45421)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45421

RNTester contains Android resources that are loaded by name and not resolved by Metro. As a result, these assets are not automatically linked when RNTester JS code is embedded in other projects. This is considered "legacy" loading and is generally discouraged, but is still showcased as an alernative way of loading resources.

I also modified the Image test to ensure that flag status is printed so it's obvious why the vector drawable hasn't loaded.

Changelog: [Internal]

Reviewed By: javache

Differential Revision: D59585555

fbshipit-source-id: d42fb44d8846d8e7c7aa01dca4cec89ae85a9195
2024-07-15 12:39:06 -07:00
Peter Abbondanzo aad9240fd4 Support loading vector drawables in ImageView (#45354)
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45354

Fresco has indicated that they have no plans to support loading vector assets and similar drawable types in Drawee-backed views ([issue](https://github.com/facebook/fresco/issues/329), [issue](https://github.com/facebook/fresco/issues/1463), [issue](https://github.com/facebook/fresco/issues/2463)). Guidance has been to instead load the vector drawable onto the backing image view ourselves. On the React Native side, having the ability to load vector drawables has been requested many times ([issue](https://github.com/facebook/react-native/issues/16651), [issue](https://github.com/facebook/react-native/issues/27502)).

I went this route over using a custom Fresco decoder for XML assets because vector drawables are compiled down into binary XML and I couldn't find a trivial, performant way to parse those files in a context-aware manner. This change only accounts for vector drawables, not any of the other XML-based drawable types (layer lists, level lists, state lists, 9-patch, etc.). Support could be added easily in the future by expanding the `getDrawableIfUnsupported` function.

## Changelog

[Android] [Added] - Added support for rendering XML assets provided to `Image`

Reviewed By: javache

Differential Revision: D59530172

fbshipit-source-id: 3d427c06238287e0a3b7f9570ac20e43d76126c7
2024-07-15 08:54:48 -07:00