Summary:
Added language to explain that you still need to add keys for each section even if you use a keyExtractor method.
No code changed; just clarified documentation.
Closes https://github.com/facebook/react-native/pull/15007
Differential Revision: D5425897
Pulled By: hramos
fbshipit-source-id: db44064a28a673feeda5a6765ea45217d3ae51e2
Summary:
The invariant condition doesn't allow scrolling to the last index
Here is a simple reproduction of the problem: https://snack.expo.io/BJ59gzWrZ
Surely, if the last item is rendered, we should be able to scroll to it without an invariant failing?
Tested locally that this change fixes the issue.
Closes https://github.com/facebook/react-native/pull/14934
Differential Revision: D5414535
Pulled By: shergin
fbshipit-source-id: 38dac4c0e2ae5e1e199a67ca0e98e8f7325e77f4
Summary:
It is quite confusing that the 'data:' uri scheme is not documented, but working.
It is very useful when getting e.g. an icon from a REST call.
Also, the mandatory size style for network & data images should be mentioned here, not only in the image guide.
<!--
Thank you for sending the PR!
If you changed any code, please provide us with clear instructions on how you verified your changes work. In other words, a test plan is *required*. Bonus points for screenshots and videos!
Please read the Contribution Guidelines at https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md to learn more about contributing to React Native.
Happy contributing!
-->
Closes https://github.com/facebook/react-native/pull/14826
Differential Revision: D5401671
Pulled By: hramos
fbshipit-source-id: 8f1f28a94095eeaccae9234e059e0983ba3556b2
Summary:
It's very important in complex UIs to be able to apply alpha channel-based masks to arbitrary content. Common use cases include adding gradient masks at the top or bottom of scroll views, creating masked text effects, feathering images, and generally just masking views while still allowing transparency of those views.
The original motivation for creating this component stemmed from work on `react-navigation`. As I tried to mimic behavior in the native iOS header, I needed to be able to achieve the effect pictured here (this is a screenshot from a native iOS application):
In this image, there are two masks:
- A mask on the back button chevron
- A gradient mask on the right button
In addition, the underlying view in the navigation bar is intended to be a UIBlurView. Thus, alpha masking is the only way to achieve this effect.
Behind the scenes, the `maskView` property on `UIView` is used. This is a shortcut to setting the mask on the CALayer directly.
This gives us the ability to mask any view with any other view. While building this component (and testing in the context of an Expo app), I was able to use a `GLView` (a view that renders an OpenGL context) to mask a `Video` component!
I chose to implement this only on iOS right now, as the Android implementation is a) significantly more complicated and b) will most likely not be as performant (especially when trying to mask more complex views).
Review the `<MaskedViewIOS>` section in the RNTester app, observe that views are masked appropriately.
Closes https://github.com/facebook/react-native/pull/14898
Differential Revision: D5398721
Pulled By: javache
fbshipit-source-id: 343af874e2d664541aca1fefe922cf7d82aea701
Summary:
New a Path instance will cause a slice call to exist path.
```js
// react-native/Libraries/ART/ARTSerializablePath.js
if (path instanceof SerializablePath) {
this.path = path.path.slice(0);
}
```
Most of d3's APIs can set context when we don't want to use d3's build-in path object. And in RN envirenment, we must use RN's path instance. So we can use RN's path as a context in d3 avoiding doing conversions from svg's path string to arrays. But with existing code, when Shape receive a `d` proprety, it new a path instance and will cause calling slice in a very large array.
Typical usage is as follows
```js
import React from 'react';
import { View, ART } from 'react-native';
import { line } from 'd3-shape';
import { scaleLinear } from 'd3-scale';
const { Path, Surface, Shape } = ART;
const width = 360;
const height = 300;
const data = [5,2,7,6,9,1,8,4,3];
const x = scaleLinear().range([0, width]).domain([0, data.length]);
const y = scaleLinear().range([height, 0]).domain([0, 9]);
const myline = line()
.x(function(d, i) {
return x(i);
})
.y(function(d) { return y(d); });
// use RN's ART Path
const path = Path();
myline.context(path)(data);
class TestArt extends React.Component {
render() {
return (
<View>
<Surface width={width} height={height}>
<Shape
stroke="red"
d={
// use RN's ART Path
path
// use d3's path
// myline(data)
}
/>
</Surface>
</View>
);
}
}
```
Closes https://github.com/facebook/react-native/pull/14551
Differential Revision: D5398653
Pulled By: javache
fbshipit-source-id: 1264acfb8844b60584604a664e0474f9e212d1d1
Summary:
React Native bundler (aka Metro Bundler) was splitted from the main codebase some time ago (now it lives [[https://github.com/facebook/metro-bundler|here]]). To make it more agnostic, polyfills will be moved out from it, so people who doesn't need them does not include them. However, RN will still need them, so the first step is to copy them back to RN so that we can provide them to Metro Bundler later.
We also include a way of passing the list of polyfills to include, as an `Array<string>`. The field is called `polyfills`, and defaults to the traditional list that is currently included in the package manager [see here](be1843cddc/packages/metro-bundler/src/defaults.js (L27-L37)).
In future commits, `metro-bundler` will be able to manage the `polyfills` array passed to it, and use it, instead of the pre-defined ones.
Reviewed By: davidaurelio
Differential Revision: D5381614
fbshipit-source-id: 749d536b781843ecb3067803e44398cd6df941f1
Summary:
Current description is misleading (without looking at implementation) to believe that both horizontal and vertical pagination are supported on both platforms. This comment clarifies that vertical pagination is not supported on Android.
Closes https://github.com/facebook/react-native/pull/14844
Differential Revision: D5393488
Pulled By: hramos
fbshipit-source-id: e79246a65e1011b2667e7eea67e85e17394026a8
Summary:
**Motivation**
This is a re-worked version of #14260, by shergin's suggestion.
For iOS, if you want to inherit from a native ViewManagers, your custom ViewManager will not automatically export the parents' props. So the only way to do this today, is to basically copy/paste the parent ViewManager-file, and add your own custom logic.
With this PR, this is made more extensible by exporting the `baseModuleName` (i.e. the iOS `superclass` of the ViewManager), and then using that value to re-establish the inheritance relationship in `requireNativeComponent`.
**Test plan**
I've run this with a test project, and it works fine there. But needs more testing.
Opened this PR as [per shergin's suggestion](https://github.com/facebook/react-native/pull/10946#issuecomment-311860545) though, so we can discuss approach.
**Discussion**
* Android already supports inheritance, so this change should be compatible with that. But, not every prop available on `UIManager.RCTView.NativeProps` is actually exported by every ViewManager. So should `UIManager.RCTView.NativeProps` still be merged with `viewConfig.NativeProps`, even if the individual ViewManager does not export/use them to begin with?
* Does this break other platforms? [UWP](https://github.com/Microsoft/react-native-windows)?
Closes https://github.com/facebook/react-native/pull/14775
Differential Revision: D5392953
Pulled By: shergin
fbshipit-source-id: 5212da616acfba50cc285e2997d183cf8b2cd09f
Summary:
In 0.46, as warning's advice, I use `ImageBackground` to replace `Image`s which used as background image wrapper, and in some cases, I also wrap `ImageBackground` with `TouchableHighlight` to make it clickable.
But here comes an error:
> Touchable child must either be native or forward setNativeProps to a native component
So I pick some code from `Image.ios.js` into `ImageBackground.js` to solve it.
Please help to review, thanks!
Closes https://github.com/facebook/react-native/pull/14884
Reviewed By: shergin
Differential Revision: D5380988
Pulled By: javache
fbshipit-source-id: 35fda029030a39e720b6266f5d0a27ea3ff145ef
Summary:
The primary use case for this is disabling swipe right when using react-navigation's swipe to go back feature.
Closes https://github.com/facebook/react-native/pull/14684
Differential Revision: D5386554
Pulled By: sahrens
fbshipit-source-id: 1e7c4caaa804f86977d391c1bdb62be69342b551
Summary:
This replaces all uses of `React.createClass` with `createReactClass` from the `create-react-class` package, attempting to match use of `var` and `const` according to local style.
Fixes#14620
Refs #14712
Closes https://github.com/facebook/react-native/pull/14729
Differential Revision: D5321810
Pulled By: hramos
fbshipit-source-id: ae7b40640b2773fd89c3fb727ec87f688bebf585
Summary:
Adding a Babel plugin that will analyze the file looking for any potential candidate to use `regenerator-runtime`, and if so, will inject dynamically the module. The module is injected per file, so we avoid polluting the global environment. The plugin is also able to inject the `require` call beforehand, so that the inliner can pick them and inline them.
The Babel plugin is part of `react-native-babel-preset`, so as long as you are using this preset you are safe. If not, you should include the specific transformer into your list of plugins, as `react-native-babel-preset/transforms/transform-regenerator-runtime-insertion.js`.
Reviewed By: davidaurelio
Differential Revision: D5321193
fbshipit-source-id: fd4805b28c8a2b986842e23570a64003370d2067
Summary:
There were still some references to "packager/" that are no longer used since the `packager` directory has been deleted after moving to Metro. Cleaned up the ones that were doing nothing and updated the references that are still meaningful.
Closes https://github.com/facebook/react-native/pull/14881
Reviewed By: cpojer
Differential Revision: D5380731
Pulled By: javache
fbshipit-source-id: 1355268f48db47343d0d38fae2598b64c8c01475
Summary:
<!--
Thank you for sending the PR!
If you changed any code, please provide us with clear instructions on how you verified your changes work. In other words, a test plan is *required*. Bonus points for screenshots and videos!
Please read the Contribution Guidelines at https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md to learn more about contributing to React Native.
Happy contributing!
-->
Closes https://github.com/facebook/react-native/pull/14764
Differential Revision: D5375730
Pulled By: javache
fbshipit-source-id: 776db77c4dc681edef5832552b220197225e9d3f
Summary:
Could have sworn we put this in a while ago...
Closes https://github.com/facebook/react-native/pull/14870
Differential Revision: D5376747
Pulled By: sahrens
fbshipit-source-id: d2bf3efea205defa48d6cd7f853739f17eb39ece
Summary: The method is being used in a test, so if a private method name mangling happens, the name of the method changes and the test fails.
Reviewed By: cpojer
Differential Revision: D5347967
fbshipit-source-id: ee964c2876bcfea5253d2ce7f9f02d4dbeebeab3
Summary:
Standard only-numeric (number pad) keyboard on iOS does not have any "Done" or "Enter" button, and this is often very badly hurt user experience.
Usually it can be solved by implementing custom `inputAccessoryView`, but RN does not have built-in support for customizing it.
So, this commit introduced limited support only for "Done" button (returnKeyType="done") and it should suite very well for the vast majority of use cases.
This is highly requested feature, see more details here:
https://github.com/facebook/react-native/issues/1190
Reviewed By: mmmulani
Differential Revision: D5268020
fbshipit-source-id: 90bd5bffac6aaa1fb7c5c2ac539b35b04d45918f
Summary:
Nothing really changed except that there is no code duplication in this part anymore.
More unification is coming!
Reviewed By: mmmulani
Differential Revision: D5144435
fbshipit-source-id: 390f795be3228907b254f8656783232013c36abe
Summary: Some basic same to both classes functionality was moved to base class, and it is just a beginning.
Reviewed By: mmmulani
Differential Revision: D5144429
fbshipit-source-id: 56c6400d46f4cf3c0058fe936cba524dd5d490df
Summary: RCTBackedTextInputViewProtocol is supposed to unify interface of backed text inputs which will make them accessible from managers and wrapper views.
Reviewed By: mmmulani
Differential Revision: D5144428
fbshipit-source-id: 473e7364d4af2edcd87c5555200e1325c38a8214
Summary: We have to have RCTTextView and RCTTextInput as much unified as possible, and this is a small step in this direction.
Reviewed By: javache
Differential Revision: D5143877
fbshipit-source-id: ee8fcab6093fe5d994c85110b07ea16e64fed262
Summary: `UITextField` surprisingly does not have `editable` property (only UITextView does), so we have to implement it ourselfs.
Reviewed By: javache
Differential Revision: D5153070
fbshipit-source-id: 5a76c623fc5c7c3eec10c600c942cf82c93833cd
Summary:
Thanks for submitting a PR! Please read these instructions carefully:
- [x] Explain the **motivation** for making this change.
- [x] Provide a **test plan** demonstrating that the code is solid.
- [x] Match the **code formatting** of the rest of the codebase.
- [x] Target the `master` branch, NOT a "stable" branch.
What existing problem does the pull request solve?
* Combined repeating `if` checks for clearer logic.
* `defaultBlue` is inlined because it is only used once for each OS.
- Updated the `Button.js` file in an existing project and all buttons behave exactly the same. Here is a simple demo:
- There is no change in the underlying logic of the code.
Closes https://github.com/facebook/react-native/pull/14455
Differential Revision: D5330112
Pulled By: hramos
fbshipit-source-id: 7fd1a0609f0bb2123208d0e1b3da2bc779f9583d
Summary: Changing AppContainer to render a wrapper component in it, if it exists. This wrapper is NOT a required property of AppContainer. Now, app-wide properties can be passed down via context to the container's children.
Reviewed By: sahrens, fkgozali
Differential Revision: D5283895
fbshipit-source-id: 8595e22c4b5ebf5d0e57f358152fba8a80cb2723
Summary: This regression was recently introduced when RCTTextField was splitted into two classes.
Reviewed By: mmmulani
Differential Revision: D5313055
fbshipit-source-id: 1027ddeed7ea9a4bf6f30b0182092f42588b83e3
Nivetha Singara Vadivelu
Dean G
Brian Vaughn
Maarten Schumacher
Eli White
Felix Oghina
Pieter De Baets
harry-g
Adam Miskiewicz
Héctor Ramos
Liu Zhanhong
Koen Punt
Kathy Gray
Miguel Jimenez Esun
Sean Wang
Christian Brevik
Patrick
Brent Vatne
Luke Rhodes
Seth Fitzsimmons
Christoph Nakazawa
James Ide
Marc Horowitz
Spencer Ahrens
superyarik
Spencer Ahrens
Valentin Shergin
Tim Yung
Kaibin Yin
Peter Pistorius
Christopher Chedeau
Summer Kitahara
Dapeng Gao
