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
Summary:
We want to rename these types to be more clear what they are actually for. I did this with a find and replace:
```
import type {StyleProp} from 'StyleSheet';
```
to
```
import type {DangerouslyImpreciseStyleProp} from 'StyleSheet';
```
and `StyleProp` to `DangerouslyImpreciseStyleProp`.
Reviewed By: yungsters
Differential Revision: D7178609
fbshipit-source-id: 32952e0c3a8b6aceef306f1f3c18844feb18f1aa
Summary:
This type is being used in many places where a much simpler type is often better. In a real pinch this type can still be accessed as so:
```
function returnsStyleSheet(
): $Call<typeof StyleSheet.create, *> {
return StyleSheet.create({
root: {
background: 'white',
}
})
}
returnsStyleSheet().foo // foo doesn't exist
returnsStyleSheet().root // okay
```
Reviewed By: yungsters
Differential Revision: D7178524
fbshipit-source-id: 3c0ed03486ca00f1e287261e402fd47807f1fc3d
Summary: These types were barely used and unnecessary.
Reviewed By: yungsters
Differential Revision: D7177287
fbshipit-source-id: 63cb6d3aae4889a92b2c23f0df864b5657e6e1ee
Summary:
Includes React Native and its dependencies Fresco, Metro, and Yoga. Excludes samples/examples/docs.
find: ^(?:( *)|( *(?:[\*~#]|::))( )? *)?Copyright (?:\(c\) )?(\d{4})\b.+Facebook[\s\S]+?BSD[\s\S]+?(?:this source tree|the same directory)\.$
replace: $1$2$3Copyright (c) $4-present, Facebook, Inc.\n$2\n$1$2$3This source code is licensed under the MIT license found in the\n$1$2$3LICENSE file in the root directory of this source tree.
Reviewed By: TheSavior, yungsters
Differential Revision: D7007050
fbshipit-source-id: 37dd6bf0ffec0923bfc99c260bb330683f35553e
Summary:
Nice addition of the recent Flow types for style props in 9c29ee1504, however I think there are some slight issues in the definition.
`type Styles = {[key: string]: Object}` makes sense, as it's referring to the set of named style groups a user creates a `StyleSheet` from, e.g.
```javascript
const styles: StyleSheet = StyleSheet.create({
container: {
height: 20
},
text: {
color: '#999',
fontSize: 12,
},
}: Styles)
```
However `type StyleValue = {[key: string]: Object}` doesn't make sense. You actually want only the `Object` portion of that definition, presuming it's meant to be used like below:
```javascript
type MyTextProps = {
style: StyleProp,
}
<MyText style={{ color: '#999', fontSize: 12 }}>Hello</Text>
```
---
I've also added `void` to the `StyleValue`, as undefined seems to be handled fine, and can be a useful shorthand in JSX.
---
And finally, I've allowed nesting of style prop arrays, by making StyleProp self-referencing, as RN seems to flatten those without issue. This can be important if you're passing in a style prop quite high up the component tree, and sticking it in an array with other styles at several points while it's passed down.
N/A (These types aren't referenced anywhere else)
[INTERNAL] [MINOR] [StyleSheet] - Refine Flow types
Closes https://github.com/facebook/react-native/pull/16741
Reviewed By: frantic
Differential Revision: D6278010
Pulled By: TheSavior
fbshipit-source-id: 0170a233ab71d29f445786f5e695463f9730db3a
Summary:
**Motivation**
On Exponent we load fonts dynamically and assign their native names by appending a session id, so that fonts from one Exponent "experience" do not clash with each other. So, before sending the `fontFamily` to native, we want to change it to the Exponent-scoped `fontFamily`.
Example:
```js
// Before rendering your app
StyleSheet.setStyleAttributePreprocessor('fontFamily', _processFontFamily);
function _processFontFamily(name) {
// Pass system fonts through
if (!name || Constants.systemFonts.indexOf(name) >= 0) {
return name;
}
if (!Font.isLoaded(name)) {
if (__DEV__) {
console.error(`${name} is not a system font and has not been loaded through Exponent.Font.loadAsync. If you intended to use a system font, make sure you typed the name correctly and that it is supported by the current operating system. If this is a custom font, be sure to load it with Exponent.Font.loadAsync`);
} else {
return 'system';
}
}
return `ExponentFont-
Closes https://github.com/facebook/react-native/pull/11138
Differential Revision: D4245518
Pulled By: mkonicek
fbshipit-source-id: bd2452b1129d6675aa7b88e41351f8bb61fa20a3
Summary:
Not seeing a hairline thick line is a common source of confusion with a simple cause. Let's warn about it.
Closes https://github.com/facebook/react-native/pull/9589
Differential Revision: D3770879
Pulled By: mkonicek
fbshipit-source-id: f1637e17832982fa8fb9b7f485056c452b38b3db
Summary:
- Define a Styles type for the object that gets passed into StyleSheet.create
- Define a StyleSheet type that is returned from StyleSheet.create
- Clean up the type declarations in StyleSheet.create
Closes https://github.com/facebook/react-native/pull/8882
Differential Revision: D3587964
Pulled By: gabelevi
fbshipit-source-id: 629e0176484436848be69b1417638e1200a3669a
Summary:
I thought it would be useful to help clear out references to no longer used styles and also catch typos on style names to have flow error when we try to access a style that isn't defined.
Example:
```javascript
export default class AuthenticationScreen extends React.Component {
render() {
// This throws an error because `continer` is misspelled
return (
<View style={styles.continer} />
)
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
},
}
```
```javascript
export default class AuthenticationScreen extends React.Component {
render() {
// This throws an error because no fancyContainer style is defined
return (
<View style={[styles.container, styles.fancyContainer]} />
)
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
},
}
```
All credit goes to jeffmo in this tweet: https://twitter.com/lbljeffmo/status/755179096271888385
Also included in the PR is some cleanup on styles that
Closes https://github.com/facebook/react-native/pull/8876
Differential Revision: D3584983
Pulled By: yungsters
fbshipit-source-id: 0ee0e12ff3d976c137d932688e323c26690e0a52
Summary: This removes `node_modules/react` from the list of directories that are used for haste module resolutions. Modules required from React are now imported with `require('react/lib/…')`.
Reviewed By: astreet
Differential Revision: D3509863
fbshipit-source-id: 32cd34e2b8496f0a6676dbe6bb1eacc18124c01e
Summary:
It's annoying and inefficient to create styles like
```
wrapper: {
position: 'absolute',
left: 0,
right: 0,
top: 0,
bottom: 0,
},
```
all the time, so this makes a handy constant for reuse and a helper method to create customized
styles.
Reviewed By: devknoll
Differential Revision: D3389612
fbshipit-source-id: 88fbe9e8ca32a0bc937bf275cf5ae0739ee21302
Summary:Indicates the purpose and an alternative use for the method too.
Closes https://github.com/facebook/react-native/pull/6662
Differential Revision: D3099823
Pulled By: vjeux
fb-gh-sync-id: 44633161a3df9b11d44afaed72fe6127f0b6bf7b
fbshipit-source-id: 44633161a3df9b11d44afaed72fe6127f0b6bf7b
Summary:This avoids flattening styles in most common cases. It diffs against the nested
arrays. The special case is when a property gets removed, it creates an object
that stores the removed keys which then gets resolved using a second pass
through the nested array.
You can conceptually think of this algorithm as:
1) Diff and store changes as you go
2) If something was removed, flatten as necessary
I also merged in another commit that renames the StyleSheetRegistry to ReactNativePropRegistry. There is nothing in here that makes it specific to styles anymore. That's just a decoupled view attribute configuration option. This registry can be used for any set of nested props, if we even want to keep this feature at all.
Reviewed By: vjeux
Differential Revision: D2492885
fb-gh-sync-id: c976ac28b7e63545132c36da0ee0c1c562e7c9e5
shipit-source-id: c976ac28b7e63545132c36da0ee0c1c562e7c9e5
Summary:
This implements #5073. It adds a static method `PixelRatio.pixel()` which returns the smallest drawable line width, primarily for use in styles.
It also updates the example apps to use the new function.
Closes https://github.com/facebook/react-native/pull/5076
Reviewed By: svcscm
Differential Revision: D2799849
Pulled By: nicklockwood
fb-gh-sync-id: b83a77790601fe882affbf65531114e7c5cf4bdf
- Implemented response headers when using `XMLHttpRequest` | Nick Lockwood
- [ReactNative] Don't redbox on flow config errors | Spencer Ahrens
- [ReactNative] Fix suggestions in TextInput when setting value prop | Spencer Ahrens
- Link LinkingIOS in SampleApp | Nick Lockwood
- unify use of password and secureTextEntry for TextInput | Nick Lockwood
- Added random js queue+execution time sampling in react native | Bryce Redd
- [react_native] JS files from D1980312: [react_native] Fix webview | Andrei Coman
- [react-packager] Correct module extension regexp | Amjad Masad
- [react-packager] Implement the browser field package.json spec | Amjad Masad
- [ReactNative] Bring back crash reporting | Alex Kotliarskyi
- Remove duplicate word | Nick Lockwood
- NavigatorIOS navigationBarHidden property support | Nick Lockwood
- [Scroll] Include content insets in scroll events | Nick Lockwood
- [ReactNative] Use deprecated ix in TabBarExample | Amjad Masad
- [ReactNative] Expanded license on obj-c files | Christopher Chedeau
- [ReactNative] Expanded license on js files | Christopher Chedeau
- [ReactNative] Fix React Devtools integration | Alex Kotliarskyi
- [Text] Account for font leading so descenders are not clipped | James Ide
- [ReactNative] Expanded license on js packager files | Christopher Chedeau
- more UIExplorer flow | Basil Hosmer
- [react-packager] Pick up package changes while running | Amjad Masad
- Added a graph view and a ReactNative metric that displays current queue and execution time for the JS thread. | Bryce Redd
- [ReactNative] Add NativeModules and DeviceEventEmitter to react-native exports | Alex Kotliarskyi
- [ReactNative] Remove pushNotification prop from renderApplication | Eric Vicenti
- [react_native] Stub VibrationIOS on Android | Andy Street
- [ReactNative] Simplify and test interpolators | Christopher Chedeau
- [ReactNative] Increase timeout for obj-c tests | Christopher Chedeau
- [ReactNative] Updated RKText to new UIManager system | Nick Lockwood
- [ReactNative] Unforked RCTShadowView, moved RKTextView into FBReactKitTextModule | Nick Lockwood
- [ReactKit] Remove NativeModulesDeprecated | Spencer Ahrens
- [ReactNative] Allow single callbacks in NativeModules | Spencer Ahrens
- [ReactNative] s/RK/RCT in OSS | Spencer Ahrens
- [ReactNative] Cleanup StyleSheet API | Christopher Chedeau
- [RCTVibration] Basic Vibration API | Christopher Chedeau
- [React Native] Prevent crash in redbox code with two thrown errors | Ben Alpert
- [ReactNative] unbreak Android | Andrew Rasmussen
Eli White
Spencer Ahrens
Sophie Alpert
Naman Goel
James Isaac
Alex Kotliarskyi
Brent Vatne
David Aurelio
Martin Kralik
James Ide
sunnylqm
Manas
Sebastian Markbage
Kyle Corbitt
Amjad Masad
Christopher Chedeau
Ben Alpert