Add support for percentage on borderRadius ViewStyle props

[jorge-cab]

Summary: Why? Previously we didn't support using percentages like:

style={{
  width=100,
  height=100,
  borderRadius='100%',
}}

These percentages refer to the corresponding dimension of the border box.

What? Change the unit type for BorderRadii values to ValueUnit. This type allows us to have an object containing a float, and a UnitType properties. With this we conditionally calculate the corresponding point (dp) value for a given percentage (considering size). Ex:

result = {raw_percentage_value} / 100 * (min(height, width) / 2)

We know the maximum border radius for our current implementation is half the dp of the shorter side of our view, hence why we consider half our minimum view side as equivalent to 100%.

Note: We still don't support vertical/horizontal border radii

Differential Revision: D56198302

[facebook-github-bot]

This pull request was exported from Phabricator. Differential Revision: D56198302

[jacobp100]

This isn’t quite right. If you put a border radius of 100% on a rectangle in CSS, you’ll get an ellipse. If you do it here, you’ll get a pill shape

[facebook-github-bot]

This pull request has been merged in facebook/react-native@9c4ee6df087f9bc3024d893f1d87d54646661512.