mirror of
https://github.com/status-im/react-native.git
synced 2025-01-10 01:25:39 +00:00
c8a0a3eff6
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
39 lines
1.0 KiB
JavaScript
39 lines
1.0 KiB
JavaScript
/**
|
|
* Copyright (c) 2015-present, Facebook, Inc.
|
|
* All rights reserved.
|
|
*
|
|
* This source code is licensed under the BSD-style license found in the
|
|
* LICENSE file in the root directory of this source tree. An additional grant
|
|
* of patent rights can be found in the PATENTS file in the same directory.
|
|
*
|
|
* @providesModule processColor
|
|
*/
|
|
'use strict';
|
|
|
|
var Platform = require('Platform');
|
|
|
|
var normalizeColor = require('normalizeColor');
|
|
|
|
/* eslint no-bitwise: 0 */
|
|
function processColor(color) {
|
|
if (color === undefined || color === null) {
|
|
return color;
|
|
}
|
|
|
|
var int32Color = normalizeColor(color);
|
|
if (int32Color === null) {
|
|
return undefined;
|
|
}
|
|
|
|
if (Platform.OS === 'android') {
|
|
// Android use 32 bit *signed* integer to represent the color
|
|
// We utilize the fact that bitwise operations in JS also operates on
|
|
// signed 32 bit integers, so that we can use those to convert from
|
|
// *unsigned* to *signed* 32bit int that way.
|
|
int32Color = int32Color | 0x0;
|
|
}
|
|
return int32Color;
|
|
}
|
|
|
|
module.exports = processColor;
|