Commit Graph

177 Commits

Author SHA1 Message Date
James Isaac 820cfa1f3b Refine StyleSheet Flow types
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
2017-11-09 11:58:15 -08:00
Miguel Jimenez Esun 834b9d4e6e Adding @email tags to most of the tests
Reviewed By: rafeca

Differential Revision: D6185623

fbshipit-source-id: 30df83288fe85516d8d5a1617a4fb8fea826ed6f
2017-11-02 06:25:03 -07:00
ashoat 833b27483b Fix Flow errors at declaration of most major library components
Summary:
The relevant changes in the PR are to Libraries/StyleSheet/EdgeInsetsPropType.js; the rest are just removals of FlowIgnores.

The definition of the relevant types is [here](https://github.com/facebook/flow/blob/master/lib/react.js#L262-L271).

The long and short of it is that for whatever reason, Flow is unable to realize that `ReactPropsChainableTypeChecker` is a subtype of `ReactPropsCheckType` unless we assert it. Once we explicitly hint this to the typechecker, it realizes that `EdgeInsetsPropType` is indeed a valid React PropType, and stops complaining that it isn't.
Closes https://github.com/facebook/react-native/pull/16437

Differential Revision: D6109742

Pulled By: sahrens

fbshipit-source-id: e4e10720b68c912d0372d810409f389b65d7f4b1
2017-10-20 03:50:25 -07:00
Ramanpreet Nara 64284bf66e iOS: Implement margin(Start|End) styles for RN
Reviewed By: mmmulani

Differential Revision: D5884168

fbshipit-source-id: 4d37583ba79324e6cf8caaa20cecf865f28337f7
2017-10-18 19:33:31 -07:00
Ramanpreet Nara 0a70c026cb iOS: Implement padding(Start|End) styles for RN
Reviewed By: mmmulani

Differential Revision: D5876934

fbshipit-source-id: 55fc49e0fddeaf0e6541d3159f35783e02bd6260
2017-10-18 19:33:31 -07:00
Ramanpreet Nara 1b5f8d3ee5 iOS: Implement border(Top|Bottom)(Start|End)Radius and border(Start|End)(Color|Width) RN styles
Reviewed By: shergin

Differential Revision: D5874536

fbshipit-source-id: 5ad237bddb70745aef0341cddb172da5ee388c38
2017-10-18 19:33:31 -07:00
Ramanpreet Nara 38b5506599 iOS: Forward RN start/end styles to Yoga
Reviewed By: mmmulani

Differential Revision: D5853589

fbshipit-source-id: 9acee0993a25dce5f4b1ce506746b789b1c4c763
2017-10-18 19:33:31 -07:00
Alex Kotliarskyi 9c29ee1504 Standard Flow type for style prop
Reviewed By: sahrens

Differential Revision: D5978082

fbshipit-source-id: bd251ed3ecc1f15595e2f5ee941e3865a225c1fd
2017-10-04 14:38:02 -07:00
Sam Goldman a16ef18a80 Upgrade Flow to v0.56.0
Reviewed By: calebmer

Differential Revision: D5958715

fbshipit-source-id: 7feda03a9540e69bf8d9b4eb89720248ff43294f
2017-10-02 21:11:05 -07:00
Spencer Ahrens 68664ac106 Fix stylesheet registery
Reviewed By: fkgozali

Differential Revision: D5685564

fbshipit-source-id: 0946223108041575b16f05abff4a90867c6323f2
2017-08-23 08:54:39 -07:00
Caleb Meredith 90eaeb019b Upgrade fbsource/xplat/js to Flow v0.53.0
Reviewed By: avikchaudhuri

Differential Revision:
D5648819
Ninja: T20988071

fbshipit-source-id: 66e5b6747c79ae66b6eb69d40ede5e982c26174f
2017-08-17 18:45:01 -07:00
Garrett McCullough 404d74bd1e update docs for Transforms
Summary:
Documentation change only.

Filled out the Transforms docs a little more to indicate which props are now deprecated and to provide some guidance on the transform array since some values are expected to be strings and some are numbers

http://facebook.github.io/react-native/docs/transforms.html
Closes https://github.com/facebook/react-native/pull/15261

Differential Revision: D5518925

Pulled By: hramos

fbshipit-source-id: 9aacf2c23e85573e150feb8c34e8bed54ad565d5
2017-07-28 12:49:01 -07:00
amin roosta f7579381cc Fix typo
Summary: Closes https://github.com/facebook/react-native/pull/15208

Differential Revision: D5497862

Pulled By: javache

fbshipit-source-id: c4ace0deebf339aad037675fc32210b1a9c316eb
2017-07-26 07:08:51 -07:00
Pieter De Baets fc68dfbed6 Enable flow for TouchableHighlight
Reviewed By: fkgozali

Differential Revision: D5388762

fbshipit-source-id: bec790a5e2ae5dbaf0f7bd2681ef156e870ed797
2017-07-12 04:15:41 -07:00
Valentin Shergin b1e64a448a Refined type for `display` style property
Reviewed By: javache

Differential Revision: D5185158

fbshipit-source-id: 02fef3862e20e9a5023bfe57601c3cf92ac273e5
2017-06-20 17:16:46 -07:00
Joe Rickerby fa147f02e5 Update overflow docstring to add note on Android
Summary:
The overflow: visible option does not work on Android. This just add a little note to the docs of that property to make that clear.

See #3198  and https://react-native.canny.io/feature-requests/p/add-overflow-support-to-android .

Make it clear that this property is unavailable on Android. We had to figure this out by trial and error when porting an existing codebase, a small note in the docs would be helpful!

I could not find how to build the website - I tried `cd website && npm install && node ./server/generate.js` but I'm getting an error (*JSDOC_ERROR: There are no input files to process.*). But it is such a small change I can't see how it would break the docs build!
Closes https://github.com/facebook/react-native/pull/14103

Differential Revision: D5225814

Pulled By: shergin

fbshipit-source-id: a3136e791178d2a7090f324041be23628130199e
2017-06-18 19:45:27 -07:00
James Burnett 51c0e81557 remove disableAutomock from jest tests (new default) @bypass-lint
Reviewed By: cpojer

Differential Revision: D5237192

fbshipit-source-id: dccca52a91259d7fea27931f92bca94184a82d4a
2017-06-13 15:04:09 -07:00
Andrew Imm 50b11aa09b Update remaining PropTypes references
Reviewed By: bvaughn

Differential Revision: D5231309

fbshipit-source-id: d54ee4f73dae63124f4462c138383447829a2551
2017-06-12 16:03:09 -07:00
James Burnett 3360999431 disable automock by default in as many places as possible @bypass-lint
Reviewed By: cpojer

Differential Revision: D5190858

fbshipit-source-id: d3125cf81427dbbe3362ef1f958413394a6dc51d
2017-06-08 07:45:54 -07:00
G. Kay Lee ba17a80aeb Update LayoutPropTypes.js
Summary:
Thanks for submitting a PR! Please read these instructions carefully:

- [x] Explain the **motivation** for making this change.
- [ ] 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.

Copyediting documentaion

N/A

Sign the [CLA][2], if you haven't already.

Small pull requests are much easier to review and more likely to get merged. Make sure the PR does only one thing, otherwise please split it.

Make sure all **tests pass** on both [Travis][3] and [Circle CI][4]. PRs that break tests are unlikely to be merged.

For more info, see the ["Pull Requests"][5] section of our "Contributing" guidelines.

[1]: https://medium.com/martinkonicek/what-is-a-test-plan-8bfc840ec171#.y9lcuqqi9
[2]: https://code.facebook.com/cla
[3]: https://travis-ci.org/facebook/react-native
[4]: http://circleci.com/gh/facebook/react-native
[5]: https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md#pull-requests
Closes https://github.com/facebook/react-native/pull/14320

Differential Revision: D5184852

Pulled By: shergin

fbshipit-source-id: e47d69d9d4b3db64c496b6080d22ac38b9957055
2017-06-06 04:04:44 -07:00
Brian Vaughn 94c565a2c4 Flat ReactNative renderer bundle [WIP]
Reviewed By: trueadm

Differential Revision: D5013497

fbshipit-source-id: 1e23b08751b8b6e2dd570ff584c815c8a9b8f35f
2017-05-26 11:03:06 -07:00
Matt Mahoney 05ec85043b Add Prop type for View
Reviewed By: yungsters

Differential Revision: D5098891

fbshipit-source-id: 5e1304344744e57c4d7f97455f49e1444fb7a42b
2017-05-23 08:01:48 -07:00
Andres Suarez 37f3ce1f2c Fix parseFloat mistaken uses of "radix"
Summary: It doesn't take a radix. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseFloat

Reviewed By: yungsters

Differential Revision: D5000954

fbshipit-source-id: fe13896196f0369b1dce132cd4f30d086638740e
2017-05-03 23:00:39 -07:00
Eli White c7e0f56d75 Flowify Process Color
Reviewed By: achen1

Differential Revision: D4924691

fbshipit-source-id: 11ff623be63062f01cb71c7d77e1438d3e495035
2017-04-26 11:31:56 -07:00
Victor Ilyukevich 0d58669c81 Fix typo in documentation: "…controls how rows…"
Summary: Closes https://github.com/facebook/react-native/pull/13482

Differential Revision: D4883387

Pulled By: javache

fbshipit-source-id: fab3ce3136b18079a566e93fb3d388abc27dd41c
2017-04-13 05:52:45 -07:00
Emil Sjolander 4d69f4b2d1 Add display:none support to react native
Summary:
This diff adds display:none support to React Native. This enables hiding components which still calling their render method and keeping them within the state of your application. This enables preserving state in a component even though the component is not visible. Previously this was often implemented by rendering a component off screen as a work around. See below playground for usage.

```
class Playground extends React.Component {
  render() {
    return (
      <View style={{width: '100%', height: '100%', flexDirection: 'row', backgroundColor: 'white'}}>
        <View style={{width: 100, height: 100, display: 'none', backgroundColor: 'red'}}/>
        <View style={{width: 100, height: 100, backgroundColor: 'blue'}}/>
      </View>
    );
  }
}
```

Reviewed By: astreet

Differential Revision: D4611771

fbshipit-source-id: 0dbe0494d989df42994ab9ad5125d47f3233cc5a
2017-03-01 09:16:05 -08:00
Emil Sjolander 31f848a5fa Expose alignContent to react native
Summary:
This diff adds alignContent (https://developer.mozilla.org/en-US/docs/Web/CSS/align-content) support to React Native. This enables aligning the lines of multi-line content. See below playground for example usage.

```
class Playground extends React.Component {
  render() {
    return (
      <View style={{width: '100%', height: '100%', flexDirection: 'row', backgroundColor: 'white', flexWrap: 'wrap', alignContent: 'space-between'}}>
        <View style={{width: 100, height: 100, marginLeft: 10, marginTop: 10, backgroundColor: 'red'}}/>
        <View style={{width: 100, height: 100, marginLeft: 10, marginTop: 10, backgroundColor: 'red'}}/>
        <View style={{width: 100, height: 100, marginLeft: 10, marginTop: 10, backgroundColor: 'red'}}/>
        <View style={{width: 100, height: 100, marginLeft: 10, marginTop: 10, backgroundColor: 'red'}}/>
        <View style={{width: 100, height: 100, marginLeft: 10, marginTop: 10, backgroundColor: 'red'}}/>
        <View style={{width: 100, height: 100, marginLeft: 10, marginTop: 10, backgroundColor: 'red'}}/>
        <View style={{width: 100, height: 100, marginLeft: 10, marginTop: 10, backgroundColor: 'red'}}/>
      </View>
    );
  }
}
```

Reviewed By: astreet

Differential Revision: D4611803

fbshipit-source-id: ae7f6b4b7e9f4bc78d2502da948214294aad4dd2
2017-03-01 09:16:05 -08:00
Andrew Clark 41f1bcc5ac Sync React Native with React 16.0.0-alpha.3 (take 2)
Reviewed By: spicyj

Differential Revision: D4623242

fbshipit-source-id: 7ddb057cb47e005dda73070f45d108af40d93c8f
2017-02-27 17:30:30 -08:00
Andrew Clark 0a712f5335 Revert D4615201: Sync React Native with React 16.0.0-alpha.3
Differential Revision: D4615201

fbshipit-source-id: e86961f37209c73838b5a4a564bc81eb48a911c2
2017-02-27 14:04:58 -08:00
Andrew Clark 24a7665df5 Sync React Native with React 16.0.0-alpha.3
Reviewed By: sebmarkbage

Differential Revision: D4615201

fbshipit-source-id: fc62b44aa866e096faa1cb048db361bb8c6ab11f
2017-02-27 14:04:58 -08:00
Cristian Carlesso 570c564e77 Update Jest to 19.0.2
Reviewed By: cpojer

Differential Revision: D4608167

fbshipit-source-id: c30febe287b4a7ad0237039cfdd5b6bd6fb66d1d
2017-02-24 08:30:50 -08:00
desmondyao bac24dde16 Fix comments about Yoga in LayoutPropType.
Summary:
Just a small fix: change css-layout in LayoutPropTypes to Yoga.
Closes https://github.com/facebook/react-native/pull/12509

Differential Revision: D4606716

fbshipit-source-id: c4f6c05c50d241c988604137fd12086d8a1ffb94
2017-02-23 13:01:04 -08:00
Sebastian Markbage c3b25c9059 Patch up for future React Sync
Reviewed By: spicyj, bvaughn

Differential Revision: D4523259

fbshipit-source-id: 317a26ce3e9e48553a7f7c856dd6b48038b4b2ea
2017-02-08 14:50:43 -08:00
Valentin Shergin 1ab104a759 `direction` layout property was marked as iOS only
Reviewed By: fkgozali

Differential Revision: D4523017

fbshipit-source-id: 4972596719fec54616fedf9e8a0a271e745193ae
2017-02-08 14:31:09 -08:00
Valentin Shergin ec673d0771 Added support of `direction` style property
Summary: Now layout direction (LTR or LTR) can be specified not only for whole app but also for view subtree via `direction` style property.

Reviewed By: mmmulani

Differential Revision: D4510206

fbshipit-source-id: 4e56c5886b6e42f2343165eb76be897e681c5ba4
2017-02-06 21:00:16 -08:00
Janic Duplessis 0ed31eb3d6 BREAKING - Improve JS transform validation, add tests
Summary:
This improves JS validations of the transform object and makes it a bit stricter (hence the breaking change). When moving transform objects parsing to native (#10658) the validations got out of sync a bit, this makes sure JS validations are the same or stricter than the native ones to make sure we get consistent errors across platforms.

See #12110 for an example of an error that now gets caught by JS validations.

Also added snapshot tests for the errors to make sure `processTransform` throws when passing invalid values. It only tests the validation since the object parsing is now done natively for iOS and Android.

**Test plan**
Test that there are no errors in UIExplorer
Run new unit tests
Closes https://github.com/facebook/react-native/pull/12115

Differential Revision: D4488933

Pulled By: mkonicek

fbshipit-source-id: a714e6175b2892284a44c870506165099efec1ed
2017-02-02 06:28:31 -08:00
Ryan Gomba 7e869b9d0a Drive any numerical prop via NativeAnimated
Summary:
In theory, we should be able to animate any non-layout property, including custom ones. While there is still work to be done on the native side to fully enable this, we should start by dropping the prop whitelist.
Closes https://github.com/facebook/react-native/pull/10658

Differential Revision: D4379031

Pulled By: ericvicenti

fbshipit-source-id: fe9c30ea101e93a8b260d7d09a909fafbb82fee6
2017-01-26 18:28:53 -08:00
Emil Sjolander 3f49e743be Add percentage support to react native
Summary:
Adds support for percentage value in react native.

syntax: property: 100 | property | '100%'

supported properties:
padding
margin
width
height
minWidth
minHeight
maxWidth
maxHeight
flexBasis

```
class Playground extends React.Component {
  render() {
    return (
      <View style={{backgroundColor: 'white', padding: 10, paddingTop: 30, height: '100%'}}>
        <Text>
          If you want to quickly test out something,
          open the Playground.js file and start coding.
        </Text>
        <View style={{backgroundColor: 'red', height: 50, width: 50}}/>
        <View style={{backgroundColor: 'blue', height: '50%', width: '50%'}}/>
      </View>
    );
  }
}
```

Reviewed By: astreet

Differential Revision: D4376549

fbshipit-source-id: c41d68a7555396f95d063a7527ee081773ac56dc
2017-01-11 03:58:37 -08:00
Emil Sjolander 976abf87f2 Add baseline alignment support
Summary:
Add baseline alignment support to react native.

{F65372439}

```
class Playground extends React.Component {
  render() {
    return (
      <View style={{padding: 30, flexDirection: 'row', alignItems: 'baseline'}}>
        <View style={{width: 30, height: 10, backgroundColor: 'red'}}/>
        <View style={{width: 30, height: 20, backgroundColor: 'green'}}/>
        <View style={{width: 30, height: 30, backgroundColor: 'blue'}}/>
      </View>
    );
  }
}
```

Reviewed By: javache

Differential Revision: D4385099

fbshipit-source-id: d7caa6e4c086c4a62e24ef1d5db9c805c470ef2a
2017-01-08 04:43:31 -08:00
Brent Vatne 346858a552 Add StyleSheet.setStyleAttributePreprocessor
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
2016-11-29 15:28:32 -08:00
Emil Sjolander 5850165795 Add support for aspectRatio style prop
Summary:
Expose aspectRatio style prop from css-layout to React Native.

This means the following will now work:

    <View style={{backgroundColor: 'blue', aspectRatio: 1}}/>

Reviewed By: javache

Differential Revision: D4226472

fbshipit-source-id: c8709a7c0abbf77089a4e867879b42dcd9116f65
2016-11-23 07:43:28 -08:00
David Aurelio 3683beb88a RN: Update React (2/2)
Reviewed By: kentaromiura

Differential Revision: D4026114

fbshipit-source-id: 67808af91454d95941fea01eef58a4d9086f46e1
2016-11-04 05:43:44 -07:00
Tim Yung 7263c349c7 RN: Stop Deep Linking `ReactPropTypes`
Reviewed By: sebmarkbage

Differential Revision: D4025448

fbshipit-source-id: 4e9b6ee002a86f638fc57a4bbeb45bf35fabf74c
2016-10-14 18:59:10 -07:00
Neil Sarkar fea38570ff Fix minor typo in documentation of bottom property - "top" => "bottom"
Summary:
Super minor documentation fix.
Closes https://github.com/facebook/react-native/pull/10278

Differential Revision: D3984539

Pulled By: hramos

fbshipit-source-id: 81559df2173a2471152dc7725bb513a49e6d7c64
2016-10-06 16:58:35 -07:00
Emil Sjolander 0a9b6bedb3 BREAKING - Fix unconstraint sizing in main axis
Summary:
This fixes measuring of items in the main axis of a container. Previously items were in a lot of cases measured with UNSPECIFIED instead of AT_MOST. This was to support scrolling containers. The correct way to handle scrolling containers is to instead provide them with their own overflow value to activate this behavior. This is also similar to how the web works.

This is a breaking change. Most of your layouts will continue to function as before however some of them might not. Typically this is due to having a `flex: 1` style where it is currently a no-op due to being measured with an undefined size but after this change it may collapse your component to take zero size due to the implicit `flexBasis: 0` now being correctly treated. Removing the bad `flex: 1` style or changing it to `flexGrow: 1` should solve most if not all layout issues your see after this diff.

Reviewed By: majak

Differential Revision: D3876927

fbshipit-source-id: 81ea1c9d6574dd4564a3333f1b3617cf84b4022f
2016-09-26 06:13:56 -07:00
Emil Sjolander a6e1e33a50 Reverted commit D3855801
Summary: Introduce `overflow:scroll` so that scrolling can be implemented without the current overflow:visible hackiness. Currently we use AT_MOST to measure in the cross axis but not in the main axis. This was done to enable scrolling containers where children are not constraint in the main axis by their parent. This caused problems for non-scrolling containers though as it meant that their children cannot be measured correctly in the main axis. Introducing `overflow:scroll` fixes this.

Reviewed By: astreet

Differential Revision: D3855801

fbshipit-source-id: 3c365f9e6ef612fd9d9caaaa8c650e9702176e77
2016-09-14 11:28:34 -07:00
Emil Sjolander 1f9c9ecb4b BREAKING - Fix unconstraint sizing in main axis
Summary: Introduce `overflow:scroll` so that scrolling can be implemented without the current overflow:visible hackiness. Currently we use AT_MOST to measure in the cross axis but not in the main axis. This was done to enable scrolling containers where children are not constraint in the main axis by their parent. This caused problems for non-scrolling containers though as it meant that their children cannot be measured correctly in the main axis. Introducing `overflow:scroll` fixes this.

Reviewed By: astreet

Differential Revision: D3855801

fbshipit-source-id: 6077b0bcb68fe5ddd4aa22926acab40ff4d83949
2016-09-14 09:14:02 -07:00
David Aurelio 13994d5810 re-enable and fix tests
Summary:
When bringing back `node-haste` to React Native, I left an `fdescribe` in a test that led to ~70 tests being skipped.
This re-enables these tests, and fixes test failures

Reviewed By: cpojer

Differential Revision: D3811225

fbshipit-source-id: 67a16f385759bb829f1f3f559862eab7e78f2097
2016-09-03 01:13:37 -07:00
Emil Sjolander 899adf5343 Expose flexGrow, flexShrink, and flexBasis properties
Reviewed By: javache, astreet

Differential Revision: D3785140

fbshipit-source-id: a735602c53da72e3bce69ba30936c4ed25d76b88
2016-08-30 03:13:39 -07:00
Martin Kralik c0218957fd Updated documentation for hairlineWidth
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
2016-08-25 08:00:24 -07:00
Muraleekrishna c7d0bc73c2 Fix documentation inconsistancy with flexbox alignItems default value
Summary:
As per mozilla docs alignItems already has made `stretch` as default
value

https://developer.mozilla.org/en-US/docs/Web/CSS/align-items.

This resolves issue https://github.com/facebook/react-native/issues/8920
Closes https://github.com/facebook/react-native/pull/9397

Differential Revision: D3718410

fbshipit-source-id: 6c747396fd06652e17cb21a79b0dfa513841cabd
2016-08-15 20:28:30 -07:00
James Ide 8eed600d5b Define Flow types for style and stylesheet objects, more checking
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
2016-08-15 10:43:34 -07:00
Krzysztof Magiera 68b9a36858 Accept transforms list instead of matrix for transform view parameter.
Summary:
In #7916 I moved transform matrix decomposition logic from JS to java. The next step is to accept list of transforms instead oftransform matrix as a transform ReactProp. This way there is no extra processing required on JS side for the transform param (at least for android now) and this on the other hand allow us to execute transform updates (through offloaded animation) solely on the UI thread.

After this change there is a whole bunch of stuff from `Libraries/Utilities/MatrixMath.js` that can be deleted (methods like: determinant, inverse, transpose). Although astreet mentioned under one of my previous commits that the code is still being referenced internally at fb, so I decided not to delete it here.

**Test plan (required)**
Run UIExplorer Transform example before and after - compare the results
Run android unit test: com.facebook.react.uimanager.MatrixMathHelperTest
Closes https://github.com/facebook/react-native/pull/8892

Differential Revision: D3676017

Pulled By: astreet

fbshipit-source-id: 5275e30805a85c12c89bea44e8b3a2b2ec7b33fa
2016-08-05 10:58:42 -07:00
Yann Pringault 1234d27478 Uniformize links in LayoutPropTypes docs
Summary:
The links was a mix of W3Schools, CSS-Tricks and MDN.

Everything is now a MDN link now. [Why?](http://www.w3fools.com/)
Closes https://github.com/facebook/react-native/pull/9005

Differential Revision: D3613520

fbshipit-source-id: 86585613a822a9027f42b61ac5d0abb7c351fa80
2016-07-25 09:43:34 -07:00
Paul O’Shannessy 5db5ee9f55 Upgrade to React v15.3.0-rc.2
Summary:
There were several fixes to how calls to propType checkers. This is to
account for the new deprecation warning - React.PropTypes will not be
part of production builds in the future.

Note: There is still a warning about an invalid argument to `React.PropTypes.oneOf` (React is running that validation sooner now). Specifically [both of these](b1e49832ef/Libraries/Components/Touchable/TouchableWithoutFeedback.js (L44-L45)) because `View.AccessibilityTraits` is actually undefined in tests (didn't look into why you conditionally set that).

**Test plan (required)**

`npm test` & fixed all warnings due to proptype secret
Closes https://github.com/facebook/react-native/pull/8758

Reviewed By: zpao

Differential Revision: D3564288

Pulled By: bestander

fbshipit-source-id: 1ff1f90907f41855e364048aa730ccd239c522b4
2016-07-21 09:13:29 -07:00
Brent Vatne a564af853f Throw flow error when trying to access a style that is not defined on a stylesheet
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
2016-07-18 23:28:25 -07:00
Jeff Morrison 7795918eb4 Unrevert D3518381
Reviewed By: gabelevi

Differential Revision: D3522895

fbshipit-source-id: 52f28c7f3142566a07d8bc845be882aeda098809
2016-07-06 12:58:41 -07:00
Ian Childs 0fde81c816 Reverted commit D3518381
Reviewed By: gabelevi

Differential Revision: D3518381

fbshipit-source-id: 645c25191d5e7cff7689bd4dc583c478eba46496
2016-07-06 09:43:37 -07:00
Jeff Morrison a8e6a236cc fbobjc -> Flow v0.28
Reviewed By: gabelevi

Differential Revision: D3518381

fbshipit-source-id: 2dd5f89177aaefbd098ba1fd3c193da111ff14c7
2016-07-06 08:58:42 -07:00
David Aurelio bd60d828c5 Remove `node_modules/react` from the list of discoverable haste modules
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
2016-07-05 06:44:33 -07:00
Kevin Lacker 64cdc3547c Overhaul the Flexbox documentation
Summary: Closes https://github.com/facebook/react-native/pull/8395

Differential Revision: D3482652

Pulled By: lacker

fbshipit-source-id: 0bf8955341221b74f69ba24dcf5ab332c910a52c
2016-06-24 11:58:53 -07:00
Krzysztof Magiera a59afb98d5 Decompose transform matrix in native (for android).
Summary:
This diff translates implementation of transform matrix decomposition from JS to java. This is to support offloading animations of transform property, in which case it is required that we can calculate decomposed transform in the UI thread.

Since the matrix decomposition code is not being used for other platform I went ahead and deleted parts that are no longer being used.

**Test plan**
Run UIExplorer Transform example before and after - compare the results
Closes https://github.com/facebook/react-native/pull/7916

Reviewed By: ritzau

Differential Revision: D3398393

Pulled By: astreet

fbshipit-source-id: 9881c3f565e2050e415849b0f76a0cefe11c6afb
2016-06-21 11:28:29 -07:00
Pieter De Baets 78b892906b Support {min,max}{Width,Height} on RCTView
Reviewed By: majak

Differential Revision: D2939842

fbshipit-source-id: c8726f1160269e432afc7562c58886313e42963c
2016-06-15 09:58:52 -07:00
Fabian Eichinger d43e0db81e Add support for reverse flex directions on Android and iOS
Summary:
This PR adds support for both 'row-reverse' and 'column-reverse' for Android and iOS and is based on the changes in #6683 that looked like it's all but abandoned.
It also adds examples for the new directions to the "Layout - Flexbox" section of UIExplorer as well as some rad new colors to the section to make the difference between "row-reverse" and "flex-end" more apparent.

**Test plan (required)**
Tested inside of UIExplorer

Android
<img width="571" alt="screen shot 2016-06-05 at 7 42 14 pm" src="https://cloud.githubusercontent.com/assets/4332237/15807140/cf8e05de-2b55-11e6-9366-a2e3194cabf8.png">

iOS
<img width="578" alt="screen shot 2016-06-05 at 7 41 35 pm" src="https://cloud.githubusercontent.com/assets/4332237/15807143/dee8e9b8-2b55-11e6-8777-c30329fa54e8.png">
Closes https://github.com/facebook/react-native/pull/7938

Differential Revision: D3417182

fbshipit-source-id: e8c9f5976ca95b2d2069a5b31a20f6d6309eb3cc
2016-06-10 03:28:45 -07:00
Nick Lockwood d64368b9e2 Implement CSS z-index for iOS
Summary:
This diff implement the CSS z-index for React Native iOS views. We've had numerous pull request for this feature, but they've all attempted to use the `layer.zPosition` property, which is problematic for two reasons:

1. zPosition only affects rendering order, not event processing order. Views with a higher zPosition will appear in front of others in the hierarchy, but won't be the first to receive touch events, and may be blocked by views that are visually behind them.
2. when using a perspective transform matrix, views with a nonzero zPosition will be rendered in a different position due to parallax, which probably isn't desirable.

See https://github.com/facebook/react-native/pull/7825 for further discussion of this problem.

So instead of using `layer.zPosition`, I've implemented this by actually adjusting the order of the subviews within their parent based on the zIndex. This can't be done on the JS side because it would affect layout, which is order-dependent, so I'm doing it inside the view itself.

It works as follows:

1. The `reactSubviews` array is set, whose order matches the order of the JS components and shadowView components, as specified by the UIManager.
2. `didUpdateReactSubviews` is called, which in turn calls `sortedSubviews` (which lazily generates a sorted array of  `reactSubviews` by zIndex) and inserts the result into the view.
3.  If a subview is added or removed, or the zIndex of any subview is changed, the previous `sortedSubviews` array is cleared and  `didUpdateReactSubviews` is called again.

To demonstrate it working, I've modified the UIExplorer example from https://github.com/facebook/react-native/pull/7825

Reviewed By: javache

Differential Revision: D3365717

fbshipit-source-id: b34aa8bfad577bce023f8af5414f9b974aafd8aa
2016-06-07 07:43:49 -07:00
Spencer Ahrens e79f5d7e7a add StyleSheet.absoluteFill convenience constant
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
2016-06-06 16:13:42 -07:00
Sebastian Markbage 373537b281 Deprecate transformMatrix and decomposedMatrix
Summary:
transformMatrix only worked on iOS and there is an equivalent API that (mostly)
works cross platform.

decomposedMatrix could technically be passed on Android but it wasn't document and explicitly flagged as not working.

My goal is to deprecate both uses and then the only supported API is the `transform: [{ matrix: ... }]` form.

The only difference is that on Android the matrix gets decomposed.

Currently there is some special cased magic that renames transform -> transformMatrix or decomposedMatrix depending on platform.

https://github.com/facebook/react/blob/master/src/renderers/native/ReactNative/ReactNativeAttributePayload.js#L50

Therefore I'm adding an alias for both native platforms called just "transform".

Next I'll swap over the JS to always target the name "transform". The only difference is how the value is marshalled over the bridge in processTransform.

To do this, I have to clean up a few callers. Mostly that's just swapping to the new API.

For buildInterpolator this is a bit trickier but this fixes it for all our use cases (which is only the Navigator in AdsManager).

Reviewed By: vjeux

Differential Revision: D3239960

fb-gh-sync-id: 838edb6644c6cdd0716834f712042f226ff3136f
fbshipit-source-id: 838edb6644c6cdd0716834f712042f226ff3136f
2016-04-29 14:19:25 -07:00
Christoph Pojer d363b1f2e2 Update Jest APIs on fbsource
Reviewed By: javache

Differential Revision: D3229435

fb-gh-sync-id: b0e252d69e1f399a946fca6e98ef62ff44c2ef9c
fbshipit-source-id: b0e252d69e1f399a946fca6e98ef62ff44c2ef9c
2016-04-27 19:16:32 -07:00
sunnylqm 53355c692a Add a missing parenthese
Summary: Closes https://github.com/facebook/react-native/pull/6724

Differential Revision: D3115214

fb-gh-sync-id: 2b97ed162c15d8e6ad4ce4906a8b6fcba44864ca
fbshipit-source-id: 2b97ed162c15d8e6ad4ce4906a8b6fcba44864ca
2016-03-30 10:04:54 -07:00
Manas 21c433d998 Caches array length in flattenStyles methods for loop
Summary:Gains minor perf improvement in the for loop by caching the array length
Closes https://github.com/facebook/react-native/pull/6671

Differential Revision: D3102064

fb-gh-sync-id: 2303d83f3672a2768c60d0e5dae999b1dda0d6bd
fbshipit-source-id: 2303d83f3672a2768c60d0e5dae999b1dda0d6bd
2016-03-26 06:54:18 -07:00
Manas 9b9cc6b543 Documents StyleSheet.flatten()
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
2016-03-25 15:13:17 -07:00
Sebastian Markbage 433fb336af Refactor Attribute Processing (Step 4)
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
2016-03-24 15:13:24 -07:00
David Aurelio ad8a335864 Remove knowledge of fbjs from the packager
Summary:Follow-up to https://github.com/facebook/react-native/pull/5084

This…
- changes all requires within RN to `require('fbjs/lib/…')`
- updates `.flowconfig`
- updates `packager/blacklist.js`
- adapts tests
- removes things from `Libraries/vendor/{core,emitter}` that are also in fbjs
- removes knowledge of `fbjs` from the packager

Closes https://github.com/facebook/react-native/pull/5084

Reviewed By: bestander

Differential Revision: D2926835

fb-gh-sync-id: 2095e22b2f38e032599d1f2601722b3560e8b6e9
shipit-source-id: 2095e22b2f38e032599d1f2601722b3560e8b6e9
2016-03-02 04:28:38 -08:00
Pieter De Baets d97223bc3b Replace usages of hexToRgb with setNormalizedColorAlpha
Reviewed By: vjeux

Differential Revision: D2906507

fb-gh-sync-id: 671ec5b9f5a701891c3601a8f78968b99476a2b5
shipit-source-id: 671ec5b9f5a701891c3601a8f78968b99476a2b5
2016-02-09 14:58:34 -08:00
Christopher Chedeau 1c112762e3 Add support for number as colors
Summary: Closes https://github.com/facebook/react-native/pull/5805

Reviewed By: svcscm

Differential Revision: D2911330

Pulled By: javache

fb-gh-sync-id: b07c00a9271a161e3c88755434f6ffa34f4d519d
2016-02-08 04:04:38 -08:00
Christopher Chedeau e2873cf85f Change internal format from 0xaarrggbb to 0xrrggbbaa
Summary:
The hex8 specified version is #rrggbbaa so it would be great to have the internal representation be 0xrrggbbaa to prevent confusion.

This pull request changes the internals of normalizeColor. It changes a lot of lines but there isn't any big changes.

Small changes:
- Use | instead of + for number operations
- Use x << 24 instead of x * (1 << 24)
- Have hslToRgb return pre shifted number

processColor is still sending colors the 0xaarrggbb format to native and tests still pass without changes.
Closes https://github.com/facebook/react-native/pull/5792

Reviewed By: svcscm

Differential Revision: D2910589

Pulled By: vjeux

fb-gh-sync-id: 6dd353f2edd5127f1762e7a57a65379d2a58e0c1
2016-02-07 10:14:29 -08:00
Christopher Chedeau 1491668b35 ColorPropTypes support for isRequired and more precise description
Summary:
The previous implementation of ColorPropType was very hacky as it used `ReactPropTypes.oneOfType([colorValidator, ReactPropTypes.number])`. It turns out that oneOfType also accepts arbitrary functions instead of a type, but doesn't display any of the error message.

In this diff I properly implement isRequired (sadly we don't export `createChainableTypeChecker` in ReactPropTypes) and provide a lot more context that we have. I copy and pasted the way we displayed this context from the existing checkers.

**Test Plan**

When doing .isRequired and do not provide the value:

![simulator screen shot feb 1 2016 9 56 00 am](https://cloud.githubusercontent.com/assets/197597/12726239/61243f88-c8cb-11e5-889b-6594ffd85973.png)

When providing a bad value:

![simulator screen shot feb 1 2016 10 01 25 am](https://cloud.githubusercontent.com/assets/197597/12726244/6e80aa36-c8cb-11e5-9bd3-a8637de75496.png)
Closes https://github.com/facebook/react-native/pull/5671

Reviewed By: svcscm

Differential Revision: D2886760

Pulled By: vjeux

fb-gh-sync-id: d6be42b5768fca5463fe80fe4b144506d21b0832
2016-02-01 12:47:32 -08:00
Christopher Chedeau bee6988f94 Temporarily allow decimals on rgb() and rgba()
Summary:
Animating colors using Animated is currently interpolating rgb and rgba and doesn't round the intermediate values. We need to fix it there but it's not a straightforward change so reverting to the lax version here until we fix it inside of Animated (which is needed to work on web anyway).
Closes https://github.com/facebook/react-native/pull/5654

Reviewed By: svcscm

Differential Revision: D2885051

Pulled By: vjeux

fb-gh-sync-id: dab69b1da11131c9fab2fd08c434c73ec93d59d2
2016-01-31 22:46:38 -08:00
Christopher Chedeau c8a0a3eff6 Reimplement color processing
Summary:
**Problem:**

As I was trying to document what color formats we supported, I realized that our current implementation based on the open source project tinycolor supported some crazy things. A few examples that were all valid:

```
tinycolor('abc')
tinycolor(' #abc ')
tinycolor('##abc')
tinycolor('rgb 255 0 0')
tinycolor('RGBA(0, 1, 2)')
tinycolor('rgb (0, 1, 2)')
tinycolor('hsv(0, 1, 2)')
tinycolor({r: 10, g: 10, b: 10})
tinycolor('hsl(1%, 2, 3)')
tinycolor('rgb(1.0, 2.0, 3.0)')
tinycolor('rgb(1%, 2%, 3%)')
```

The integrations of tinycolor were also really bad. processColor added "support" for pure numbers and an array of colors!?? ColorPropTypes did some crazy trim().toString() and repeated a bad error message twice.

**Solution:**

While iteratively cleaning the file, I eventually ended up reimplementing it entierly. Major changes are:
- The API is now dead simple: returns null if it doesn't parse or returns the int32 representation of the color
- Stricter parsing of at
Closes https://github.com/facebook/react-native/pull/5529

Reviewed By: svcscm

Differential Revision: D2872015

Pulled By: nicklockwood

fb-gh-sync-id: df78244eefce6cf8e8ed2ea51f58d6b232de16f9
2016-01-29 09:13:32 -08:00
Janic Duplessis 1c6e837504 Add a deprecatedPropType module to show deprecation warnings
Summary:
To allow smoother API changes for users we often deprecate props and keep them around for a while before removing them. Right now it is all done manually, this adds a consistent way to show a warning when using a deprecated prop.

This also adds a deprecation warning of the website generated from the deprecatedPropType.

<img width="643" alt="screen shot 2016-01-26 at 7 43 08 pm" src="https://cloud.githubusercontent.com/assets/2677334/12600172/7af28fb0-c465-11e5-85e5-3786852bf522.png">

It also changes places where we added the warnings manually to use deprecatedPropType instead.
Closes https://github.com/facebook/react-native/pull/5566

Reviewed By: svcscm

Differential Revision: D2874629

Pulled By: nicklockwood

fb-gh-sync-id: c3c63bae7bbec26cc146029abd9aa5efbe73f795
2016-01-29 02:05:38 -08:00
Christopher Chedeau 2529179769 Remove min/max Width/Height in the docs
Summary:
An initial implementation was done on css-layout but isn't working correctly on many cases. The binding from React Native has been removed a long time ago. Let's not confuse people and remove it from the docs :)
Closes https://github.com/facebook/react-native/pull/5522

Reviewed By: svcscm

Differential Revision: D2859665

Pulled By: vjeux

fb-gh-sync-id: 4aa008dd93a6cea6b79a7bce444c94148791eee4
2016-01-27 18:26:56 -08:00
asmockler dad462258f Ensure perspective value is non-zero
Summary:
Setting `transform: {perspective: 0}` was causing app failure due to `NaN` produced by divide by zero in [MatrixMath.js](96553cf553/Libraries/Utilities/MatrixMath.js (L118)).

See issue #2616
Closes https://github.com/facebook/react-native/pull/5457

Reviewed By: svcscm

Differential Revision: D2851748

Pulled By: bestander

fb-gh-sync-id: d2872fb73b4d95ba0b6e5ed2bee814158645cf73
2016-01-25 06:01:53 -08:00
Kyle Corbitt cd89016ee7 PixelRatio.pixel()
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
2016-01-15 05:15:31 -08:00
StefanT a162f72655 Added ColorPropType
Summary:
Problem: https://github.com/facebook/react-native/issues/4708

Solution: Added a ColorPropType that validates the color used by the dev

Notes:
1) I'm working a Win8.1 machine and couldn't build the react-native using the github repo. As soon as I figure that out, I'll probably figure how to run the tests and how to add some for this feature.
2) It's my first pull request. Be gentle :)
Closes https://github.com/facebook/react-native/pull/4866

Reviewed By: bestander, svcscm

Differential Revision: D2783672

Pulled By: nicklockwood

fb-gh-sync-id: ca22aa3c0999188075681b5d20fff0631496e238
2015-12-23 10:08:38 -08:00
Justas Brazauskas 0e8b207cc3 Bugfix - Typos
Summary:
Fixed few typos in `./Examples` and `./Libraries` folders.
Closes https://github.com/facebook/react-native/pull/4788

Reviewed By: svcscm

Differential Revision: D2759918

Pulled By: androidtrunkagent

fb-gh-sync-id: d692b5c7f561822353e522f9d4dfde7e60b491cf
2015-12-15 09:09:32 -08:00
rocman 2244a86eea enable the minWidth/maxWidth/minHeight/maxHeight features
Summary: Closes https://github.com/facebook/react-native/pull/4183

Reviewed By: svcscm

Differential Revision: D2663931

Pulled By: nicklockwood

fb-gh-sync-id: 53d699fbb6041e3623eb78f1045cac28821efde8
2015-11-17 10:58:32 -08:00
Brent Vatne 0da2004e88 Expose additional private modules
Summary: - TextInputState as TextInput.State
- Touchable
- flattenStyle as StyleSheet.flatten
- ReactNativeART as ART

Original discussion in #1821
Closes https://github.com/facebook/react-native/pull/3308

Reviewed By: sebmarkbage

Differential Revision: D2527152

Pulled By: javache

fb-gh-sync-id: 19d4ef9d4c0e6587b9f0793e1ca624aebb034f3b
2015-11-05 03:35:18 -08:00
Krzysztof Magiera 0ed3048e39 Add deprecated transform props to View prop type definition.
Differential Revision: D2549973

fb-gh-sync-id: 96b5233fe4ed003760746d8cdb7f0496a67c63be
2015-10-16 07:30:26 -07:00
Sebastian Markbage 6244fd003d Refactor Attribute Processing (Step 3)
Reviewed By: @spicyj

Differential Revision: D2514193

fb-gh-sync-id: 8ba55014e8d052c69d8e1def327284ec974d6837
2015-10-06 15:36:32 -07:00
Felix Oghina 8f7748748e Revert [React Native] Refactor Attribute Processing (Step 3)
Reviewed By: @kmagiera, @mikearmstrong001

Differential Revision: D2512548

fb-gh-sync-id: bcae3a8c85bfcfa468f2128288a25f406d78cf08
2015-10-06 10:29:18 -07:00
Sebastian Markbage ac5b7548d2 Refactor Attribute Processing (Step 3)
Summary: Decouple processStyle from the main reconciliation. It is now a process
extension to the style attribute `transform`. This effectively decouples a
large portion of special cases and helper dependencies from the reconciler.

The transform attribute becomes translated into the transformMatrix attribute on
the native side so this becomes a little weird in that I have to special case
it. I don't think it is worth while having a general solution for this so I
intend to rename the native attribute to `transform` and just have it accept the
resolved transform. Then I can remove the special cases.

The next step is generalizing the flattenStyle function and optimizing it.

@​public

Reviewed By: @vjeux

Differential Revision: D2460465

fb-gh-sync-id: 243e7fd77d282b401bc2c028aec8d57f24522a8e
2015-10-06 10:28:41 -07:00
Pieter De Baets babdeb33ba Make processColor more efficient
Reviewed By: @nicklockwood, @vjeux

Differential Revision: D2507684
2015-10-05 10:15:34 -07:00
Pieter De Baets 7c1b6b0fb6 Vendor tinycolor; strip unnecessary components
Reviewed By: @vjeux

Differential Revision: D2503048
2015-10-05 04:41:26 -07:00
James Ide c649211147 Add unit tests to flattenStyle
Summary: The StyleSheet merging algorithm was modeled after `Object.assign` and the native spread operator. This diff converts `flattenStyle` to actually use `Object.assign`.
Closes https://github.com/facebook/react-native/pull/3048

Reviewed By: @​svcscm

Differential Revision: D2506387

Pulled By: @vjeux
2015-10-03 10:17:23 -07:00
Krzysztof Magiera 6c3fb77f30 Static type check for int params + migrate colorInt to just int.
Differential Revision: D2475618

committer: Service User <svcscm@fb.com>
2015-09-24 08:20:14 -07:00
Jason Brown 74f467b00a Add skewX and skewY to the transform style options
Summary: Closes https://github.com/facebook/react-native/pull/2652

Reviewed By: @​trunkagent, @​svcscm

Differential Revision: D2437758

Pulled By: @vjeux
2015-09-24 08:19:59 -07:00
Alexsander Akers 9a2d05d9b2 Move color processing to JS
Reviewed By: @vjeux

Differential Revision: D2346353
2015-09-17 17:20:45 -07:00
Martin Konicek 674abf1955 Flexbox docs
Summary: Documenting this as it wasn't obvious the defaults were different:
https://github.com/facebook/react-native/issues/2724

@​public

Reviewed By: @vjeux

Differential Revision: D2450283
2015-09-16 15:23:01 -07:00
Sebastian Markbage 890c2193d0 Kill old transform propTypes/attributes
Summary: I can't find anywhere these are being used by the bridge / native
views anymore. I don't think they work anymore. ART has a similar
API but uses a different code path.

We might as well clean this up. Makes it easier to reason about.

@​public

Reviewed By: @vjeux

Differential Revision: D2445353
2015-09-16 10:25:01 -07:00
Christopher Chedeau fa042eda50 Update TransformPropTypes.js 2015-09-16 10:24:43 -07:00