Commit Graph

61 Commits

Author SHA1 Message Date
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
Christopher Chedeau a9607901e2 Updates from Tue 8 Sep 2015-09-08 16:54:44 -07:00
Gabe Levi 874f39bf7f [Flow] Clean up react-native for Flow v0.15.0 2015-09-04 16:51:18 -08:00
Alex Kotliarskyi 9649e7cc8d More updates 2015-07-27 12:24:01 -07:00
Christopher Chedeau 18e6094cab [ReactNative] Add overflow to the whitelisted Image props
Summary:
For some reason we're now spamming the logs everytime we render an Image because overflow is not defined in the whitelist. overflow: 'hidden' is needed for network images with cover mode.

The way we currently define those is not optimal where we try to factor as many things as possible into distinct propTypes. However for Text we're not even using this but we are getting all the ones from View (which many do not apply) and remove some that aren't needed.

It may be useful to cleanup this in the future but in the short term, it's better to remove this warning that doesn't have much value anyway.
2015-07-27 11:06:27 -08:00
Spencer Ahrens 902ffbbfb8 Updates from Wed July 15th 2015-07-15 19:05:08 +02:00
chirag04 915540d237 [transform] add perspective property to transform
Summary:
![matrixflip](https://cloud.githubusercontent.com/assets/1509831/8701143/607b069c-2b10-11e5-9c54-8b9767e74e16.gif)

cc @sahrens @vjeux
Closes https://github.com/facebook/react-native/pull/1980
Github Author: chirag04 <jain_chirag04@yahoo.com>
2015-07-15 08:08:29 -08:00
chirag04 548549ea9f [style] expose rotate x, y, z transforms
Summary:
Added rotateX, rotateY, rotateZ transforms.

cc @sahrens
Closes https://github.com/facebook/react-native/pull/1976
Github Author: chirag04 <jain_chirag04@yahoo.com>
2015-07-14 19:58:26 -08:00
Tadeu Zagallo 1607d8e9b4 Updates from Tue 16 Jun 2015-06-16 11:30:14 +01:00
Jan Monschke e2fc7d2362 Sort StyleProps alphabetically
Summary:
Sorting the StyleProps alphabetically makes it easier to scan through the list of available props e.g. in case of typos.

Filled out the FB CLA form just now.

Related to #1605
Closes https://github.com/facebook/react-native/pull/1607
Github Author: Jan Monschke <jan.monschke@gmail.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-06-15 13:29:46 -08:00
Spencer Ahrens 205e2659a1 Updates from Tue 9 Jun 2015-06-09 17:20:30 -07:00
fisherwebdev 1fc5e3d1e3 [Docs] Note about transformMatrix 2015-06-09 14:05:17 -07:00
Christopher Chedeau 1a12b95f7a [ReactNative] Revert D2134877 2015-06-08 13:49:28 -08:00
Christopher Chedeau c9e555f4b3 [ReactNative] Better error message when forgetting to wrap Animated 2015-06-08 12:44:32 -08:00
Spencer Ahrens 11b515b1b0 [ReactNative] clean lint in all of Libraries/ 2015-05-19 13:47:04 -08:00
Christopher Chedeau 2d9990ca2a [ReactNative] Better error message when passing an Animated to a View 2015-05-15 11:01:46 -08:00
Bill Fisher 89e26e92b6 [ReactNative] decompose transform matrix 2015-05-13 13:24:37 -07:00