Skip to content

Commit b47fae8

Browse files
marlenecotamarlenecota
authored
add normalize/processColorObject.js for ios and macos (#146)
* add normalize/processColorObject.js for ios and macos * run prettier * Fix NativeColorType reference in normalizeColorObject * return null in normalizeColorObject for invalid objects * import NativeOrDynamicColorType from normalizeColorObject * remove strict-local * add normalize/processColorObject.android.js * normalize/processColorObject param * missed one NativeOrDynamicColorType import * NativeOrDynamicColorType as processColorObject's return type * ignore macos files in android's flowconfig * Move normalizeColor require * Add/fix TODO(macOS ISS#2323203) comments
1 parent ffdf6bf commit b47fae8

19 files changed

+244
-71
lines changed

‎.flowconfig.android‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
[ignore]
22
; We fork some components by platform
33
.*/*[.]ios.js
4+
.*/*[.]macos.js
45

56
; Ignore templates for 'react-native init'
67
<PROJECT_ROOT>/template/.*

‎Libraries/Color/normalizeColor.js‎

Lines changed: 9 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -11,23 +11,16 @@
1111
/* eslint no-bitwise: 0 */
1212
'use strict';
1313

14-
const Platform = require('Platform'); // [TODO(macOS ISS#2323203)
15-
16-
export type SemanticOrDynamicColorType = {
17-
semantic?: string,
18-
dynamic?: {
19-
light: ?(string | number | SemanticOrDynamicColorType),
20-
dark: ?(string | number | SemanticOrDynamicColorType),
21-
},
22-
}; // ]TODO(macOS ISS#2323203)
14+
const normalizeColorObject = require('normalizeColorObject'); // TODO(macOS ISS#2323203)
15+
import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203)
2316

2417
function normalizeColor(
2518
color: ?(
2619
| string
2720
| number
28-
| SemanticOrDynamicColorType
21+
| NativeOrDynamicColorType
2922
) /* TODO(macOS ISS#2323203) */,
30-
): ?(number | SemanticOrDynamicColorType) /* TODO(macOS ISS#2323203) */ {
23+
): ?(number | NativeOrDynamicColorType) /* TODO(macOS ISS#2323203) */ {
3124
const matchers = getMatchers();
3225
let match;
3326

@@ -39,26 +32,14 @@ function normalizeColor(
3932
}
4033

4134
// [TODO(macOS ISS#2323203)
42-
if (
43-
typeof color === 'object' &&
44-
color !== null &&
45-
(Platform.OS === 'macos' || Platform.OS === 'ios')
46-
) {
47-
if ('semantic' in color) {
48-
// a macos semantic color
35+
if (typeof color === 'object' && color !== null) {
36+
const normalizedColorObj = normalizeColorObject(color);
37+
38+
if (normalizedColorObj !== null) {
4939
return color;
50-
} else if ('dynamic' in color && color.dynamic !== undefined) {
51-
// a dynamic, appearance aware color
52-
const dynamic = color.dynamic;
53-
const dynamicColor: SemanticOrDynamicColorType = {
54-
dynamic: {
55-
light: normalizeColor(dynamic.light),
56-
dark: normalizeColor(dynamic.dark),
57-
},
58-
};
59-
return dynamicColor;
6040
}
6141
}
42+
6243
if (typeof color !== 'string') {
6344
return null;
6445
} // ]TODO(macOS ISS#2323203)

‎Libraries/Color/normalizeColorObject.android.js‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
/**
2+
* Copyright (c) Facebook, Inc. and its affiliates.
3+
*
4+
* This source code is licensed under the MIT license found in the
5+
* LICENSE file in the root directory of this source tree.
6+
*
7+
* @format
8+
* @flow
9+
*/
10+
// [TODO(macOS ISS#2323203)
11+
'use strict';
12+
13+
export type NativeOrDynamicColorType = {};
14+
15+
function normalizeColorObject(
16+
color: NativeOrDynamicColorType,
17+
): ?(number | NativeOrDynamicColorType) {
18+
return null;
19+
}
20+
21+
module.exports = normalizeColorObject;
22+
// ]TODO(macOS ISS#2323203)

‎Libraries/Color/normalizeColorObject.ios.js‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
/**
2+
* Copyright (c) Facebook, Inc. and its affiliates.
3+
*
4+
* This source code is licensed under the MIT license found in the
5+
* LICENSE file in the root directory of this source tree.
6+
*
7+
* @format
8+
* @flow
9+
*/
10+
// [TODO(macOS ISS#2323203)
11+
'use strict';
12+
13+
export type NativeOrDynamicColorType = {
14+
semantic?: string,
15+
dynamic?: {
16+
light: ?(string | number | NativeOrDynamicColorType),
17+
dark: ?(string | number | NativeOrDynamicColorType),
18+
},
19+
};
20+
21+
function normalizeColorObject(
22+
color: NativeOrDynamicColorType,
23+
): ?(number | NativeOrDynamicColorType) {
24+
if ('semantic' in color) {
25+
// a macos semantic color
26+
return color;
27+
} else if ('dynamic' in color && color.dynamic !== undefined) {
28+
const normalizeColor = require('normalizeColor');
29+
30+
// a dynamic, appearance aware color
31+
const dynamic = color.dynamic;
32+
const dynamicColor: NativeOrDynamicColorType = {
33+
dynamic: {
34+
light: normalizeColor(dynamic.light),
35+
dark: normalizeColor(dynamic.dark),
36+
},
37+
};
38+
return dynamicColor;
39+
}
40+
41+
return null;
42+
}
43+
44+
module.exports = normalizeColorObject;
45+
// ]TODO(macOS ISS#2323203)

‎Libraries/Color/normalizeColorObject.macos.js‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
/**
2+
* Copyright (c) Facebook, Inc. and its affiliates.
3+
*
4+
* This source code is licensed under the MIT license found in the
5+
* LICENSE file in the root directory of this source tree.
6+
*
7+
* @format
8+
* @flow
9+
*/
10+
// [TODO(macOS ISS#2323203)
11+
'use strict';
12+
13+
const normalizeColor = require('normalizeColor');
14+
15+
export type NativeOrDynamicColorType = {
16+
semantic?: string,
17+
dynamic?: {
18+
light: ?(string | number | NativeOrDynamicColorType),
19+
dark: ?(string | number | NativeOrDynamicColorType),
20+
},
21+
};
22+
23+
function normalizeColorObject(
24+
color: NativeOrDynamicColorType,
25+
): ?(number | NativeOrDynamicColorType) {
26+
if ('semantic' in color) {
27+
// a macos semantic color
28+
return color;
29+
} else if ('dynamic' in color && color.dynamic !== undefined) {
30+
// a dynamic, appearance aware color
31+
const dynamic = color.dynamic;
32+
const dynamicColor: NativeOrDynamicColorType = {
33+
dynamic: {
34+
light: normalizeColor(dynamic.light),
35+
dark: normalizeColor(dynamic.dark),
36+
},
37+
};
38+
return dynamicColor;
39+
}
40+
41+
return null;
42+
}
43+
44+
module.exports = normalizeColorObject;
45+
// ]TODO(macOS ISS#2323203)

‎Libraries/Components/ActivityIndicator/ActivityIndicator.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ const RCTActivityIndicatorViewNativeComponent = require('RCTActivityIndicatorVie
1919

2020
import type {NativeComponent} from 'ReactNative';
2121
import type {ViewProps} from 'ViewPropTypes';
22-
import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203)
22+
import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203)
2323

2424
const RCTActivityIndicator =
2525
Platform.OS === 'android'
@@ -54,7 +54,7 @@ type Props = $ReadOnly<{|
5454
*
5555
* See http://facebook.github.io/react-native/docs/activityindicator.html#color
5656
*/
57-
color?: ?(string | SemanticOrDynamicColorType), // ]TODO(macOS ISS#2323203)
57+
color?: ?(string | NativeOrDynamicColorType), // TODO(macOS ISS#2323203)
5858

5959
/**
6060
* Size of the indicator (default is 'small').

‎Libraries/Components/ActivityIndicator/RCTActivityIndicatorViewNativeComponent.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ const requireNativeComponent = require('requireNativeComponent');
1515
import type {ViewProps} from 'ViewPropTypes';
1616
import type {ViewStyleProp} from 'StyleSheet';
1717
import type {NativeComponent} from 'ReactNative';
18-
import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203)
18+
import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203)
1919

2020
type NativeProps = $ReadOnly<{|
2121
...ViewProps,
@@ -39,7 +39,7 @@ type NativeProps = $ReadOnly<{|
3939
*
4040
* See http://facebook.github.io/react-native/docs/activityindicator.html#color
4141
*/
42-
color?: ?(string | SemanticOrDynamicColorType),
42+
color?: ?(string | NativeOrDynamicColorType), // TODO(macOS ISS#2323203)
4343

4444
/**
4545
* Size of the indicator (default is 'small').

‎Libraries/Components/DrawerAndroid/AndroidDrawerLayoutNativeComponent.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,9 +16,9 @@ import type {NativeComponent} from 'ReactNative';
1616
import type {SyntheticEvent} from 'CoreEventTypes';
1717
import type {ViewStyleProp} from 'StyleSheet';
1818
import type React from 'React';
19-
import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203)
19+
import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203)
2020

21-
type ColorValue = null | string | SemanticOrDynamicColorType;
21+
type ColorValue = null | string | NativeOrDynamicColorType; // TODO(macOS ISS#2323203)
2222

2323
type DrawerStates = 'Idle' | 'Dragging' | 'Settling';
2424

‎Libraries/Components/Picker/PickerIOS.ios.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ import type {SyntheticEvent} from 'CoreEventTypes';
2424
import type {ColorValue} from 'StyleSheetTypes';
2525
import type {ViewProps} from 'ViewPropTypes';
2626
import type {TextStyleProp} from 'StyleSheet';
27-
import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203)
27+
import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203)
2828

2929
type PickerIOSChangeEvent = SyntheticEvent<
3030
$ReadOnly<{|
@@ -36,7 +36,7 @@ type PickerIOSChangeEvent = SyntheticEvent<
3636
type RCTPickerIOSItemType = $ReadOnly<{|
3737
label: ?Label,
3838
value: ?(number | string),
39-
textColor: ?(number | SemanticOrDynamicColorType), // ]TODO(macOS ISS#2323203)
39+
textColor: ?(number | NativeOrDynamicColorType), // TODO(macOS ISS#2323203)
4040
|}>;
4141

4242
type RCTPickerIOSType = Class<

‎Libraries/Components/Picker/RCTPickerNativeComponent.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ const requireNativeComponent = require('requireNativeComponent');
1414
import type {SyntheticEvent} from 'CoreEventTypes';
1515
import type {TextStyleProp} from 'StyleSheet';
1616
import type {NativeComponent} from 'ReactNative';
17-
import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203)
17+
import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203)
1818

1919
type PickerIOSChangeEvent = SyntheticEvent<
2020
$ReadOnly<{|
@@ -26,7 +26,7 @@ type PickerIOSChangeEvent = SyntheticEvent<
2626
type RCTPickerIOSItemType = $ReadOnly<{|
2727
label: ?Label,
2828
value: ?(number | string),
29-
textColor: ?(number | SemanticOrDynamicColorType),
29+
textColor: ?(number | NativeOrDynamicColorType), // TODO(macOS ISS#2323203)
3030
|}>;
3131

3232
type Label = Stringish | number;

0 commit comments

Comments
 (0)