Summary:
Changelog:
[Internal][Changed] - Remove keyExtractor from defaultProps as part of larger effort to remove defaultProps from VirtualizedList
[General][Changed] - Remove data as a prop for VirtualizedSectionList. In the reactnative.dev docs it mentions that sections is the equivalent for *SectionList: https://reactnative.dev/docs/sectionlist#sections
[General][Changed] - Change export type of VirtualizedSectionList and wrap component updates in act in test.
[Internal] - Remove FlowFixMe from VirtualizedSectionList
Reviewed By: kacieb
Differential Revision: D27271493
fbshipit-source-id: f83bdcce9c71c140c8a8fb6f0ecd9bb520fcb85b
Summary:
Changelog:
[Internal][Changed] -Remove keyExtractor from defaultProps as part of larger effort to remove defaultProps from VirtualizedList
Reviewed By: nadiia
Differential Revision: D26969588
fbshipit-source-id: b00922a339cbe471fcbf560ab4abdd9e48eda1fc
Summary:
Changelog:
[Internal][Changed] - Remove initialNumToRender from defaultProps as part of larger effort to remove defaultProps from VirtualizedList
Reviewed By: nadiia
Differential Revision: D26969585
fbshipit-source-id: 8674544c06b7b99eee693cc7508c9e4199232e98
Summary:
`React.ElementRef<HostComponent<mixed>>` is an inexact object type, which can not be spread into an exact object type, as is happening here. This error is masked in types-first mode, but causes the instance type of this component to be `any`. In a future version of Flow, this issue will be fixed, so this change unblocks upgrading Flow.
This change is likely to cause code using `TextInput` refs to find errors which were missed before.
Changelog:
[General][Fixed] - Fixed Flow typing of TextInput refs
Reviewed By: yungsters
Differential Revision: D26733314
fbshipit-source-id: 8aa26ce5b49357b279f76dd1767a17a9fb4dd4f1
Summary:
ES Modules implicitly enable strict mode. Adding the "use strict" directive is, therefore, not required.
This diff removes all "use strict" directives from ES modules.
Changelog:
[Internal]
Reviewed By: motiz88
Differential Revision: D26172715
fbshipit-source-id: 57957bcbb672c4c3e62b1db633cf425c1c9d6430
Summary:
There may be assumptions that `Native*.js` contains TurboModule. In order to avoid introducing unplanned breaking changes (especially right before the holidays), roll this back for now.
In doing so, I also realized that I forgot to migrate over `ScrollContentViewNativeComponent`. This does that, too.
Changelog:
[Internal]
Reviewed By: RSNara
Differential Revision: D25129324
fbshipit-source-id: 343c4b800969dab91f7cd9f2bf253788c94d38e6
Summary:
The Flow team has been building a new implementation of the system that typechecks the body of generic functions and classes. This system is more sound than the previous approach and detects errors that were uncaught previously. This diff turns on the new generic system by setting generate_tests=false in the .flowconfig, and suppresses newly discovered errors.
This diff modifies and re-signs some generated modules, because syncing from www pulled in a ton of other changes that have runtime differences, and I'm not equipped to verify that the changes are safe to land.
Changelog: [Internal]
Reviewed By: panagosg7
Differential Revision: D24801184
fbshipit-source-id: bb31fe4c5a4107d183649b436a548df5ff42e217
Summary:
Migrates `ScrollView` (and its related native components) to use `NativeComponentRegistry`. This will enable it to be configured using experiments to conditionally use the native `ViewConfig` or verify the static `ViewConfig`.
This also cleans up a bunch of the modules and types related to defining the native `ScrollView` component.
This also proposes adopting the same module naming protocol was has been adopted for TurboModules (i.e. `NativeScrollView` instead of `ScrollViewNativeComponent`).
Changelog:
[Internal]
Reviewed By: JoshuaGross
Differential Revision: D25098530
fbshipit-source-id: ff1394bfac023daf58e85d5f9068e4f8da3538be
Summary:
Have ScrollView use forwardRef so that the host component methods like `measure` and `measureLayout` are available without having to call `getNativeScrollRef`. Instead, you can use `<ScrollView ref={myRef} />` and directly call all methods of ScrollView and host components on `myRef`.
Previous usage:
```
const myRef = React.createRef<React.ElementRef<typeof ScrollView>>();
<ScrollView ref={myRef} />
const innerViewRef = myRef.current.getNativeScrollRef();
innerViewRef.measure();
```
New usage:
```
const myRef = React.createRef<React.ElementRef<typeof View>>();
<ScrollView ref={myRef} />
// now, myRef.current can be used directly as the ref
myRef.current.measure();
myRef.current.measureLayout();
// Additionally, myRef still has access to ScrollView methods
myRef.current.scrollTo(...);
```
Changes:
* Added deprecation warnings to ScrollView methods `getNativeScrollRef`, `getScrollableNode`, and `getScrollResponder`
* Added the forwardRef call to create `ForwardedScrollView` - this takes in `ref` and passes it into the class ScrollView as `scrollViewRef`.
* Forwarded the ref to the native scroll view using `setAndForwardRef`.
* Added statics onto `ForwardedScrollView` so that `ScrollView.Context` can still be accessed.
* Added type `ScrollViewImperativeMethods`, which lists the public methods of ScrollView.
* Converted all public methods of ScrollView to arrow functions. This is because they need to be bound to the forwarded ref.
* Bound all public methods of ScrollView to the forwarded ref in the `setAndForwardRef` call.
* Flow typed the final output (ForwardedScrollView) as an abstract component that takes in the props of the `ScrollView` class, and has all methods of both the inner host component (`measure`, `measureLayout`, etc) and the public methods (`scrollTo`, etc).
Changes to mockScrollView:
* Changed mockScrollView to be able to mock the function component instead of a class component
* Updated necessary tests
Changelog:
[General] [Changed] - Make ScrollView use forwardRef
Reviewed By: TheSavior
Differential Revision: D19304480
fbshipit-source-id: 6c359897526d9d5ac6bc6ab6d5f9d82bfc0d8af4
Summary:
This gets us on the latest Prettier 2.x:
https://prettier.io/blog/2020/03/21/2.0.0.html
Notably, this adds support for TypeScript 3.8,
which introduces new syntax, such as `import type`.
Reviewed By: zertosh
Differential Revision: D20636268
fbshipit-source-id: fca5833d003804333a05ba16325bbbe0e06d6c8a
Summary:
A few recent imports have explicitly added ".js" to the end of their path. This prevents Metro from resolving platform-specific JS files, e.g. "Foo.android.js" or "Foo.windows.js" instead of "Foo.js".
React Native Windows provides its own implementation of files in a few cases where stock React Native will share them between Android and iOS. We hope to reduce/eliminate these long term, but requiring explicit ".js" files currently breaks us in a couple of places where we have custom implementations.
This change is a quick regex replace of ES6 and CommonJS imports in 'Libraries/" to eliminate ".js".
## Changelog
[General] [Fixed] - Do not explicitly include ".js" in Library imports
Pull Request resolved: https://github.com/facebook/react-native/pull/28311
Test Plan: I haven't done any manual validation of this, but `flow-check` should catch any issues with this during CI.
Reviewed By: cpojer
Differential Revision: D20486466
Pulled By: TheSavior
fbshipit-source-id: 31e1ccc307967417d7d09c34c859f0b2b69eac84
Summary:
We will soon be enforcing that flow suppressions will only apply when on an error's primary location ([post](https://fb.workplace.com/groups/179614562644215/permalink/559286354677032/)). This diff uses the codemod created in D20008770 to move all suppression comments to their primary locations in the `xplat/js` flow root, and deletes suppression comments that are not on any primary locations.
This diff was generated with:
```
~/fbsource/fbcode/flow/packages/flow-dev-tools/bin/tool suppression-primary-locations --json-file ~/www/errors.json ~/fbsource/xplat/js
hg st -n | xargs grep -l -P '@(partially-)?generated' | xargs hg revert
hg st -n | xargs grep -l 'format' | xargs prettier --write
```
Changelog: [Internal]
bypass-lint
Reviewed By: dsainati1
Differential Revision: D20122544
fbshipit-source-id: d94e409aadb18bb399a1ddbf9f3f2494fe4fb54c
Summary:
Add a method to get the underlying host component of `FlatList`. Fix flow types in `FlatList` and `VirtualizedList`. Add test cases to test the behavior of the new function in all cases.
Changelog: [General] [Added] - Add getNativeScrollRef method to FlatList component
Reviewed By: TheSavior
Differential Revision: D18302202
fbshipit-source-id: 7005a2bc1dab207434be3f1f4d8fde0b11b3bb4d
Summary:
We are rolling out exact-by-default syntax to xplat/js.
I had to manually move around some comments to preserve proper placement.
Changelog: [Internal]
Reviewed By: jbrown215
Differential Revision: D18633611
fbshipit-source-id: 48f7468dcc55b1d00985419d035a61c6820b3abe
Summary:
still some generated files in www that need to land before we can release 0.111 here.
drop-conflicts
Changelog: [Internal]
(Note: this ignores all push blocking failures!)
Reviewed By: dsainati1
Differential Revision: D18278838
fbshipit-source-id: b20c3fefb3aab7c5fb614b33d846c7548184f49a
Summary:
These components had props that were poorly typed and let many things through. This diff tightens that all up.
The main difference in this diff is using `{...BaseProps, ...LocalProps }` instead of `BaseProps & LocalProps`.
The majority of the changes in this diff is reducing duplicated prop definitions. For example, FlatList defines a bunch of props that VirtualizedList also defines. Since FlatList extends those props, using spread now means that FlatList can't duplicate those props. So I've moved the definitions to the correct base file and deleted the duplicates.
Changelog:
[Internal]
Reviewed By: lunaleaps
Differential Revision: D17824459
fbshipit-source-id: 089ac4c58c3c9f70a9f28e517f2e9ecd8aab1a50
Summary:
These props are unusupported by the component they were being passed to.
Changelog:
[Internal]
Reviewed By: zackargyle
Differential Revision: D17839765
fbshipit-source-id: 13c80a07da2026b61070ffc93f26194b979ee8fc
Summary: FlatList and VirtualizedList were typing this value as any instead of using the actual type from ScrollView. I started with that change and then fixed the type to solve the other callsites in the codebase.
Reviewed By: zackargyle
Differential Revision: D17089934
fbshipit-source-id: bfc22cec9993904d779cad37b1de7cb3c0484d2c
Summary:
After some thought, we decided we don't need the flexibility of
separate horizontal and vertical props - it would be much nicer
to just have a single prop for the edge length and then the native
code can enable the booleans as appropriate.
Original PR: https://github.com/facebook/react-native/pull/26163
Original commit changeset: f72a9a890d90
Reviewed By: TheSavior
Differential Revision: D16997468
fbshipit-source-id: 7973262287a7ec2cee5957f8dc1806a0f28c1432
Summary:
Flatlist's `getItemCount` function is frequently called internally by VirtualizedList.
As with other functions, we can remove unnecessary operations with the `numColumns` value.
This makes it much more efficient.
## Changelog
[Internal] [Changed] - Better implementation for getItemCount on FlatList
Pull Request resolved: https://github.com/facebook/react-native/pull/26164
Test Plan: Not required
Differential Revision: D16989335
Pulled By: sahrens
fbshipit-source-id: b0075b2c2aeb9b9d7644c8bb18702a7cca8a4dce
Summary:
Need to add explicit type annotations in these areas to unblock types-first architecture for Flow. These are locations the codemod could not automatically handle.
I'll call out areas I need a close eye on in the comments.
Reviewed By: panagosg7
Differential Revision: D16659053
fbshipit-source-id: 167dd2abe093019b128676426374c1c62cf71e7f
Summary:
`<VirtualizedList />` will throw an error if the `renderItem` Prop component uses hooks. Function components without hooks and class components work without issue.
Super contrived Example
```{js}
function FlatListItem({ item }) {
React.useEffect(() => console.log(item),[])
return (<Text>{item}</Text>);
}
<FlatList data={[1, 2, 3]} renderItem={FlatListItem} />
```
Example Error:
```
Invariant Violation: Hooks can only be called inside the body of a function component. (https://fb.me/react-invalid-hook-call)
This error is located at:
in CellRenderer (at VirtualizedList.js:688)
in RCTScrollContentView (at ScrollView.js:976)
in RCTScrollView (at ScrollView.js:1115)
in ScrollView (at VirtualizedList.js:1081)
in VirtualizedList (at FlatList.js:632)
in FlatList (at WithoutScrollbars.js:21)
...
```
## Changelog
[General] [Added] - VirtualizedList ListItemComponent. An alternative to renderItem that accepts function components with hooks.
[General][Added] - FlatList ListItemComponent. An alternative to renderItem that accepts function components with hooks.
[General][Added] - VirtualizedList and FlatList tests and updated RNTester example
Pull Request resolved: https://github.com/facebook/react-native/pull/24832
Reviewed By: sahrens
Differential Revision: D15334020
Pulled By: cpojer
fbshipit-source-id: 882db722fd6e22f07260b08091b3456d1c66c2c8
Summary:
This is the next step in moving RN towards standard path-based requires. All the requires in `Libraries` have been rewritten to use relative requires with a few exceptions, namely, `vendor` and `Renderer/oss` since those need to be changed upstream. This commit uses relative requires instead of `react-native/...` so that if Facebook were to stop syncing out certain folders and therefore remove code from the react-native package, internal code at Facebook would not need to change.
See the umbrella issue at https://github.com/facebook/react-native/issues/24316 for more detail.
[General] [Changed] - Migrate "Libraries" from Haste to standard path-based requires
Pull Request resolved: https://github.com/facebook/react-native/pull/24749
Differential Revision: D15258017
Pulled By: cpojer
fbshipit-source-id: a1f480ea36c05c659b6f37c8f02f6f9216d5a323
Summary:
Flow typing can be annoying because the `renderItem` prop for FlatList always has to specifically be of type `React.Element`.
Since really we just want to return something renderable, it should be fine to type this as `React.Node` instead.
I'm not sure if this is valid, but it seems like since we just need to implant the `key` property, we should be able to accomplish this with a `React.Fragment` wrapper instead of needing to call `cloneElement`. Looking for feedback on if this is a sensible fix.
Changelog:
[General][Changed] Updated FlatList's renderItem Flow type from React.Element<any> to React.Node
Reviewed By: sahrens
Differential Revision: D14814805
fbshipit-source-id: ce6793dea5a92619babe048dcfddee0e4519979c
Summary: Android scrolling performance is very poor with this disabled. iOS has some KP with this enabled, so disable it for iOS.
Reviewed By: sahrens
Differential Revision: D13363494
fbshipit-source-id: efab77b5db9676dd0521ae4193465d45ac34dda3
Summary: This is one more step to remove `fbjs` from `react-native-github`. This changes both the internal and external code to use `invariant` from zertosh instead of the copy in fbjs.
Reviewed By: yungsters
Differential Revision: D13195941
fbshipit-source-id: 73564ca1715110e7da9c7ef56dc57374d61377e0
Summary:
This functionality was removed here: 636d01bbd0
This is just a step of cleanup
Reviewed By: yungsters
Differential Revision: D10515512
fbshipit-source-id: 6d24cc9c53c71924a82c67a4058585ee978de2d9
Summary:
`legacyImplementation` has caused a warning in FlatList for a long time. FlatList supports the use cases of the legacy implementation and should be adopted.
We will be removing the deprecated MetroListView and ListView components to reduce bundle sizes and the complexity of the codebase.
Reviewed By: yungsters
Differential Revision: D10245824
fbshipit-source-id: 60ff0d54974649b57bac9f9f29b769f34ca2701c
Summary: The legacy implementation doesn't provide additional functionality and has a negative impact on performance and user experience. The legacyImplementation prop is deprecated and will be removed in a future release.
Reviewed By: yungsters
Differential Revision: D10212762
fbshipit-source-id: 9b3416434ba392827b538c984c7ab4bcbe156e60
Summary: This change drops the year from the copyright headers and the LICENSE file.
Reviewed By: yungsters
Differential Revision: D9727774
fbshipit-source-id: df4fc1e4390733fe774b1a160dd41b4a3d83302a
Summary:
Currently, modifying a component that renders a FlatLists while Hot Reloading is enabled will trigger an invariant inside FlatList for changing viewabilityConfig on the fly. This happens because it checks object equality between the configs.
By checking equality of the config's *properties* instead, we maintain the efficacy of the invariant but keep it from falsely triggering during development.
Reviewed By: sahrens
Differential Revision: D9466129
fbshipit-source-id: 67149e9e70ad7b2e2584bb7ec03e2dea26ef45e8
Summary: Locking down view style so that invalid styles can't be passed into View.
Reviewed By: yungsters
Differential Revision: D9309097
fbshipit-source-id: 69e7e3c5626609cfd47c167027a55470c42228c8
Summary:
We ran into a problem trying to style the optional prop `ListHeaderComponent` in the `FlatList` library component. Essentially we wanted to make `ListHeaderComponent` a flex item that filled all of the empty space in the list if there was any. Unfortunately the `ListHeaderComponent` is later wrapped in a `View` that blocked our styling. The `View` component was necessary as it added styling to handle inverting the `FlatList`. Similarly `ListFooterComponent` was handled the same way.
We came up the simple solution of adding two new optional props, `ListHeaderComponentStyle` and `ListFooterComponentStyle`, that are of type `ViewStyleProp` that allow users to pass in styling for `ListHeaderComponent` and `ListFooterComponent`.
With this change we were able to do something like the following to get the header component to fill all empty space in the `FlatList`.
```
<FlatList
...
contentContainerStyle={{flexGrow: 1}}
ListHeaderComponent={<View style={{flex: 1}} />}
ListHeaderComponentStyle={{flexGrow: 1}}
...
/>
```
This solution will give users a lot more freedom when working with headers and footers.
Reviewed By: sahrens
Differential Revision: D8777038
fbshipit-source-id: f34116ce68548ea70223e639d0f84a099327f6b3
Summary:
Bump Prettier to use version 1.13.4
All code changes are caused by running Prettier and should only affect files that have an `format` header.
All other changes caused by yarn.
Reviewed By: ryanmce
Differential Revision: D8251255
fbshipit-source-id: 0b4445c35f1269d72730f2000002a27c1bc35914
Summary:
StrictMode compliance is important for Async Rendering and other Future Tech(tm).
Also clean up some lint.
== Test Plan ==
* No more StrictMode warnings for `FlatList` (`VirtualizedList` is another story....).
* props warnings still show up when appropriate.
Reviewed By: sophiebits
Differential Revision: D8026333
fbshipit-source-id: e6fa2f02d546b883df6f3cff8776c26c6ef91bc9
Summary:
This PR removes the need for having the `providesModule` tags in all the modules in the repository.
It configures Flow, Jest and Metro to get the module names from the filenames (`Libraries/Animated/src/nodes/AnimatedInterpolation.js` => `AnimatedInterpolation`)
* Checked the Flow configuration by running flow on the project root (no errors):
```
yarn flow
```
* Checked the Jest configuration by running the tests with a clean cache:
```
yarn jest --clearCache && yarn test
```
* Checked the Metro configuration by starting the server with a clean cache and requesting some bundles:
```
yarn run start --reset-cache
curl 'localhost:8081/IntegrationTests/AccessibilityManagerTest.bundle?platform=android'
curl 'localhost:8081/Libraries/Alert/Alert.bundle?platform=ios'
```
[INTERNAL] [FEATURE] [All] - Removed providesModule from all modules and configured tools.
Closes https://github.com/facebook/react-native/pull/18995
Reviewed By: mjesun
Differential Revision: D7729509
Pulled By: rubennorte
fbshipit-source-id: 892f760a05ce1fddb088ff0cd2e97e521fb8e825
Summary:
Migrating everything to import from StyleSheet instead of StyleSheetTypes.
Search and replaced
```
import type {StyleObj} from 'StyleSheetTypes';
```
to
```
import type {DangerouslyImpreciseStyleProp} from 'StyleSheet';
```
and then replacing `StyleObj` with `DangerouslyImpreciseStyleProp` and fixing up the remaining flow errors by hand.
Reviewed By: yungsters
Differential Revision: D7184077
fbshipit-source-id: b8dabb9d48038b5a997ab715687300bad57aa9d4
Luna Wei
Jimmy Zhang
Sam Goldman
Micha Reiser
Tim Yung
Mike Vitousek
George Zahariev
Kacie Bawiec
Michael Bolin
Nick Gerleman
Hans Halverson
Jordan Brown
Andres Suarez
Eli White
André Krüger
Spencer Ahrens
ifsnow
Logan Daniels
Alan Kenyon
James Ide
Fred Liu
Christoph Nakazawa
Marshall Roch
Héctor Ramos
Michael Ficaro
Peter van der Zee
Rubén Norte
Caleb Meredith
