diff --git a/.flowconfig.android b/.flowconfig.android index 9ff8ac48e050fd..1349bd82fdc1d1 100644 --- a/.flowconfig.android +++ b/.flowconfig.android @@ -1,6 +1,7 @@ [ignore] ; We fork some components by platform .*/*[.]ios.js +.*/*[.]macos.js ; Ignore templates for 'react-native init' /template/.* diff --git a/Libraries/Color/normalizeColor.js b/Libraries/Color/normalizeColor.js index d3985cd12c6c01..f92b41a3e0767e 100755 --- a/Libraries/Color/normalizeColor.js +++ b/Libraries/Color/normalizeColor.js @@ -11,23 +11,16 @@ /* eslint no-bitwise: 0 */ 'use strict'; -const Platform = require('Platform'); // [TODO(macOS ISS#2323203) - -export type SemanticOrDynamicColorType = { - semantic?: string, - dynamic?: { - light: ?(string | number | SemanticOrDynamicColorType), - dark: ?(string | number | SemanticOrDynamicColorType), - }, -}; // ]TODO(macOS ISS#2323203) +const normalizeColorObject = require('normalizeColorObject'); // TODO(macOS ISS#2323203) +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203) function normalizeColor( color: ?( | string | number - | SemanticOrDynamicColorType + | NativeOrDynamicColorType ) /* TODO(macOS ISS#2323203) */, -): ?(number | SemanticOrDynamicColorType) /* TODO(macOS ISS#2323203) */ { +): ?(number | NativeOrDynamicColorType) /* TODO(macOS ISS#2323203) */ { const matchers = getMatchers(); let match; @@ -39,26 +32,14 @@ function normalizeColor( } // [TODO(macOS ISS#2323203) - if ( - typeof color === 'object' && - color !== null && - (Platform.OS === 'macos' || Platform.OS === 'ios') - ) { - if ('semantic' in color) { - // a macos semantic color + if (typeof color === 'object' && color !== null) { + const normalizedColorObj = normalizeColorObject(color); + + if (normalizedColorObj !== null) { return color; - } else if ('dynamic' in color && color.dynamic !== undefined) { - // a dynamic, appearance aware color - const dynamic = color.dynamic; - const dynamicColor: SemanticOrDynamicColorType = { - dynamic: { - light: normalizeColor(dynamic.light), - dark: normalizeColor(dynamic.dark), - }, - }; - return dynamicColor; } } + if (typeof color !== 'string') { return null; } // ]TODO(macOS ISS#2323203) diff --git a/Libraries/Color/normalizeColorObject.android.js b/Libraries/Color/normalizeColorObject.android.js new file mode 100644 index 00000000000000..93d3acb5aebc77 --- /dev/null +++ b/Libraries/Color/normalizeColorObject.android.js @@ -0,0 +1,22 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @format + * @flow + */ +// [TODO(macOS ISS#2323203) +'use strict'; + +export type NativeOrDynamicColorType = {}; + +function normalizeColorObject( + color: NativeOrDynamicColorType, +): ?(number | NativeOrDynamicColorType) { + return null; +} + +module.exports = normalizeColorObject; +// ]TODO(macOS ISS#2323203) diff --git a/Libraries/Color/normalizeColorObject.ios.js b/Libraries/Color/normalizeColorObject.ios.js new file mode 100644 index 00000000000000..018bf589d428d2 --- /dev/null +++ b/Libraries/Color/normalizeColorObject.ios.js @@ -0,0 +1,45 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @format + * @flow + */ +// [TODO(macOS ISS#2323203) +'use strict'; + +export type NativeOrDynamicColorType = { + semantic?: string, + dynamic?: { + light: ?(string | number | NativeOrDynamicColorType), + dark: ?(string | number | NativeOrDynamicColorType), + }, +}; + +function normalizeColorObject( + color: NativeOrDynamicColorType, +): ?(number | NativeOrDynamicColorType) { + if ('semantic' in color) { + // a macos semantic color + return color; + } else if ('dynamic' in color && color.dynamic !== undefined) { + const normalizeColor = require('normalizeColor'); + + // a dynamic, appearance aware color + const dynamic = color.dynamic; + const dynamicColor: NativeOrDynamicColorType = { + dynamic: { + light: normalizeColor(dynamic.light), + dark: normalizeColor(dynamic.dark), + }, + }; + return dynamicColor; + } + + return null; +} + +module.exports = normalizeColorObject; +// ]TODO(macOS ISS#2323203) diff --git a/Libraries/Color/normalizeColorObject.macos.js b/Libraries/Color/normalizeColorObject.macos.js new file mode 100644 index 00000000000000..2092ceff12f348 --- /dev/null +++ b/Libraries/Color/normalizeColorObject.macos.js @@ -0,0 +1,45 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @format + * @flow + */ +// [TODO(macOS ISS#2323203) +'use strict'; + +const normalizeColor = require('normalizeColor'); + +export type NativeOrDynamicColorType = { + semantic?: string, + dynamic?: { + light: ?(string | number | NativeOrDynamicColorType), + dark: ?(string | number | NativeOrDynamicColorType), + }, +}; + +function normalizeColorObject( + color: NativeOrDynamicColorType, +): ?(number | NativeOrDynamicColorType) { + if ('semantic' in color) { + // a macos semantic color + return color; + } else if ('dynamic' in color && color.dynamic !== undefined) { + // a dynamic, appearance aware color + const dynamic = color.dynamic; + const dynamicColor: NativeOrDynamicColorType = { + dynamic: { + light: normalizeColor(dynamic.light), + dark: normalizeColor(dynamic.dark), + }, + }; + return dynamicColor; + } + + return null; +} + +module.exports = normalizeColorObject; +// ]TODO(macOS ISS#2323203) diff --git a/Libraries/Components/ActivityIndicator/ActivityIndicator.js b/Libraries/Components/ActivityIndicator/ActivityIndicator.js index 241f17392837ef..7d9d1539f73f2d 100644 --- a/Libraries/Components/ActivityIndicator/ActivityIndicator.js +++ b/Libraries/Components/ActivityIndicator/ActivityIndicator.js @@ -19,7 +19,7 @@ const RCTActivityIndicatorViewNativeComponent = require('RCTActivityIndicatorVie import type {NativeComponent} from 'ReactNative'; import type {ViewProps} from 'ViewPropTypes'; -import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203) +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203) const RCTActivityIndicator = Platform.OS === 'android' @@ -54,7 +54,7 @@ type Props = $ReadOnly<{| * * See http://facebook.github.io/react-native/docs/activityindicator.html#color */ - color?: ?(string | SemanticOrDynamicColorType), // ]TODO(macOS ISS#2323203) + color?: ?(string | NativeOrDynamicColorType), // TODO(macOS ISS#2323203) /** * Size of the indicator (default is 'small'). diff --git a/Libraries/Components/ActivityIndicator/RCTActivityIndicatorViewNativeComponent.js b/Libraries/Components/ActivityIndicator/RCTActivityIndicatorViewNativeComponent.js index b0b8418515422f..00852da8e97e3f 100644 --- a/Libraries/Components/ActivityIndicator/RCTActivityIndicatorViewNativeComponent.js +++ b/Libraries/Components/ActivityIndicator/RCTActivityIndicatorViewNativeComponent.js @@ -15,7 +15,7 @@ const requireNativeComponent = require('requireNativeComponent'); import type {ViewProps} from 'ViewPropTypes'; import type {ViewStyleProp} from 'StyleSheet'; import type {NativeComponent} from 'ReactNative'; -import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203) +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203) type NativeProps = $ReadOnly<{| ...ViewProps, @@ -39,7 +39,7 @@ type NativeProps = $ReadOnly<{| * * See http://facebook.github.io/react-native/docs/activityindicator.html#color */ - color?: ?(string | SemanticOrDynamicColorType), + color?: ?(string | NativeOrDynamicColorType), // TODO(macOS ISS#2323203) /** * Size of the indicator (default is 'small'). diff --git a/Libraries/Components/DrawerAndroid/AndroidDrawerLayoutNativeComponent.js b/Libraries/Components/DrawerAndroid/AndroidDrawerLayoutNativeComponent.js index 7839a940fd1bdd..0563d25ae83ee4 100644 --- a/Libraries/Components/DrawerAndroid/AndroidDrawerLayoutNativeComponent.js +++ b/Libraries/Components/DrawerAndroid/AndroidDrawerLayoutNativeComponent.js @@ -16,9 +16,9 @@ import type {NativeComponent} from 'ReactNative'; import type {SyntheticEvent} from 'CoreEventTypes'; import type {ViewStyleProp} from 'StyleSheet'; import type React from 'React'; -import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203) +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203) -type ColorValue = null | string | SemanticOrDynamicColorType; +type ColorValue = null | string | NativeOrDynamicColorType; // TODO(macOS ISS#2323203) type DrawerStates = 'Idle' | 'Dragging' | 'Settling'; diff --git a/Libraries/Components/Picker/PickerIOS.ios.js b/Libraries/Components/Picker/PickerIOS.ios.js index 9b446efe4381f2..3454f0a69f9d48 100644 --- a/Libraries/Components/Picker/PickerIOS.ios.js +++ b/Libraries/Components/Picker/PickerIOS.ios.js @@ -24,7 +24,7 @@ import type {SyntheticEvent} from 'CoreEventTypes'; import type {ColorValue} from 'StyleSheetTypes'; import type {ViewProps} from 'ViewPropTypes'; import type {TextStyleProp} from 'StyleSheet'; -import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203) +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203) type PickerIOSChangeEvent = SyntheticEvent< $ReadOnly<{| @@ -36,7 +36,7 @@ type PickerIOSChangeEvent = SyntheticEvent< type RCTPickerIOSItemType = $ReadOnly<{| label: ?Label, value: ?(number | string), - textColor: ?(number | SemanticOrDynamicColorType), // ]TODO(macOS ISS#2323203) + textColor: ?(number | NativeOrDynamicColorType), // TODO(macOS ISS#2323203) |}>; type RCTPickerIOSType = Class< diff --git a/Libraries/Components/Picker/RCTPickerNativeComponent.js b/Libraries/Components/Picker/RCTPickerNativeComponent.js index 2196128b10d60b..0e1ed250778bf7 100644 --- a/Libraries/Components/Picker/RCTPickerNativeComponent.js +++ b/Libraries/Components/Picker/RCTPickerNativeComponent.js @@ -14,7 +14,7 @@ const requireNativeComponent = require('requireNativeComponent'); import type {SyntheticEvent} from 'CoreEventTypes'; import type {TextStyleProp} from 'StyleSheet'; import type {NativeComponent} from 'ReactNative'; -import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203) +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203) type PickerIOSChangeEvent = SyntheticEvent< $ReadOnly<{| @@ -26,7 +26,7 @@ type PickerIOSChangeEvent = SyntheticEvent< type RCTPickerIOSItemType = $ReadOnly<{| label: ?Label, value: ?(number | string), - textColor: ?(number | SemanticOrDynamicColorType), + textColor: ?(number | NativeOrDynamicColorType), // TODO(macOS ISS#2323203) |}>; type Label = Stringish | number; diff --git a/Libraries/Components/Switch/SwitchNativeComponent.js b/Libraries/Components/Switch/SwitchNativeComponent.js index a28785817f91fc..5d46d0f46d918d 100644 --- a/Libraries/Components/Switch/SwitchNativeComponent.js +++ b/Libraries/Components/Switch/SwitchNativeComponent.js @@ -17,7 +17,7 @@ const requireNativeComponent = require('requireNativeComponent'); import type {SwitchChangeEvent} from 'CoreEventTypes'; import type {ViewProps} from 'ViewPropTypes'; -import type {SemanticOrDynamicColorType} from 'normalizeColor'; // TODO(macOS ISS#2323203) +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203) type SwitchProps = $ReadOnly<{| ...ViewProps, @@ -35,17 +35,17 @@ export type NativeAndroidProps = $ReadOnly<{| enabled?: ?boolean, on?: ?boolean, - thumbTintColor?: ?(string | SemanticOrDynamicColorType), - trackTintColor?: ?(string | SemanticOrDynamicColorType), + thumbTintColor?: ?(string | NativeOrDynamicColorType), // TODO(macOS ISS#2323203) + trackTintColor?: ?(string | NativeOrDynamicColorType), // TODO(macOS ISS#2323203) |}>; // @see RCTSwitchManager.m export type NativeIOSProps = $ReadOnly<{| ...SwitchProps, - onTintColor?: ?(string | SemanticOrDynamicColorType), - thumbTintColor?: ?(string | SemanticOrDynamicColorType), - tintColor?: ?(string | SemanticOrDynamicColorType), + onTintColor?: ?(string | NativeOrDynamicColorType), // TODO(macOS ISS#2323203) + thumbTintColor?: ?(string | NativeOrDynamicColorType), // TODO(macOS ISS#2323203) + tintColor?: ?(string | NativeOrDynamicColorType), // TODO(macOS ISS#2323203) |}>; type SwitchNativeComponentType = Class< diff --git a/Libraries/Components/ToolbarAndroid/ToolbarAndroidNativeComponent.js b/Libraries/Components/ToolbarAndroid/ToolbarAndroidNativeComponent.js index 261bc0a6f3cc77..5dce58f2194ef3 100644 --- a/Libraries/Components/ToolbarAndroid/ToolbarAndroidNativeComponent.js +++ b/Libraries/Components/ToolbarAndroid/ToolbarAndroidNativeComponent.js @@ -16,7 +16,7 @@ import type {SyntheticEvent} from 'CoreEventTypes'; import type {ImageSource} from 'ImageSource'; import type {ViewProps} from 'ViewPropTypes'; import type {NativeComponent} from 'ReactNative'; -import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203) +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203) type Action = $ReadOnly<{| title: string, @@ -36,7 +36,7 @@ type NativeProps = $ReadOnly<{| nativeActions?: Array, |}>; -type ColorValue = null | string | SemanticOrDynamicColorType; +type ColorValue = null | string | NativeOrDynamicColorType; // TODO(macOS ISS#2323203) type ToolbarAndroidProps = $ReadOnly<{| ...ViewProps, diff --git a/Libraries/Components/Touchable/TouchableNativeFeedback.android.js b/Libraries/Components/Touchable/TouchableNativeFeedback.android.js index 57911ad9d93e5b..b56dda54d56cbb 100644 --- a/Libraries/Components/Touchable/TouchableNativeFeedback.android.js +++ b/Libraries/Components/Touchable/TouchableNativeFeedback.android.js @@ -24,7 +24,7 @@ const ensurePositiveDelayProps = require('ensurePositiveDelayProps'); const processColor = require('processColor'); import type {PressEvent} from 'CoreEventTypes'; -import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203) +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203) const rippleBackgroundPropType = PropTypes.shape({ type: PropTypes.oneOf(['RippleAndroid']), @@ -146,7 +146,7 @@ const TouchableNativeFeedback = createReactClass({ borderless: boolean, ): { type: 'RippleAndroid', - color: ?(number | SemanticOrDynamicColorType), + color: ?(number | NativeOrDynamicColorType), // TODO(macOS ISS#2323203) borderless: boolean, } { return { diff --git a/Libraries/ReactNative/getNativeComponentAttributes.js b/Libraries/ReactNative/getNativeComponentAttributes.js index 12a510f50c7a2f..ef28420179a9cb 100644 --- a/Libraries/ReactNative/getNativeComponentAttributes.js +++ b/Libraries/ReactNative/getNativeComponentAttributes.js @@ -21,7 +21,7 @@ const resolveAssetSource = require('resolveAssetSource'); const sizesDiffer = require('sizesDiffer'); const invariant = require('invariant'); const warning = require('fbjs/lib/warning'); -import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203) +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203) function getNativeComponentAttributes(uiViewClassName: string) { const viewConfig = UIManager.getViewManagerConfig(uiViewClassName); @@ -184,7 +184,7 @@ function getProcessorForType(typeName: string): ?(nextProp: any) => any { function processColorArray( colors: ?Array, -): ?Array { +): ?Array /* TODO(macOS ISS#2323203) */ { // ]TODO(macOS ISS#2323203) return colors == null ? null : colors.map(processColor); } diff --git a/Libraries/StyleSheet/StyleSheetTypes.js b/Libraries/StyleSheet/StyleSheetTypes.js index c2982b0642a217..76f05ede9fd261 100644 --- a/Libraries/StyleSheet/StyleSheetTypes.js +++ b/Libraries/StyleSheet/StyleSheetTypes.js @@ -11,9 +11,9 @@ 'use strict'; const AnimatedNode = require('AnimatedNode'); -import type {SemanticOrDynamicColorType} from 'normalizeColor'; // TODO(macOS ISS#2323203) +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203) -export type ColorValue = null | string | SemanticOrDynamicColorType; // TODO(macOS ISS#2323203) +export type ColorValue = null | string | NativeOrDynamicColorType; // TODO(macOS ISS#2323203) export type DimensionValue = null | number | string | AnimatedNode; /** diff --git a/Libraries/StyleSheet/processColor.js b/Libraries/StyleSheet/processColor.js index b49afd5d7b71c1..fb5daf53d6659b 100644 --- a/Libraries/StyleSheet/processColor.js +++ b/Libraries/StyleSheet/processColor.js @@ -11,14 +11,14 @@ 'use strict'; const Platform = require('Platform'); - +const processColorObject = require('processColorObject'); // TODO(macOS ISS#2323203) const normalizeColor = require('normalizeColor'); -import type {SemanticOrDynamicColorType} from 'normalizeColor'; // ]TODO(macOS ISS#2323203) +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; // TODO(macOS ISS#2323203) /* eslint no-bitwise: 0 */ function processColor( - color?: ?(string | number | SemanticOrDynamicColorType), -): ?(number | SemanticOrDynamicColorType) /* TODO(macOS ISS#2323203) */ { + color?: ?(string | number | NativeOrDynamicColorType), +): ?(number | NativeOrDynamicColorType) /* TODO(macOS ISS#2323203) */ { if (color === undefined || color === null) { return color; } @@ -28,23 +28,14 @@ function processColor( return undefined; } - // [TODO(macOS ISS#2323203) - if ( - typeof int32Color === 'object' && - (Platform.OS === 'macos' || Platform.OS === 'ios') - ) { - if ('dynamic' in int32Color && int32Color.dynamic !== undefined) { - const dynamic = int32Color.dynamic; - const dynamicColor = { - dynamic: { - light: processColor(dynamic.light), - dark: processColor(dynamic.dark), - }, - }; - return dynamicColor; + if (typeof int32Color === 'object') { + const processedColorObj = processColorObject(int32Color); + + if (processedColorObj !== null) { + return processedColorObj; } - return int32Color; } + if (typeof int32Color !== 'number') { return null; } // ]TODO(macOS ISS#2323203) diff --git a/Libraries/StyleSheet/processColorObject.android.js b/Libraries/StyleSheet/processColorObject.android.js new file mode 100644 index 00000000000000..f4bca8303002cc --- /dev/null +++ b/Libraries/StyleSheet/processColorObject.android.js @@ -0,0 +1,22 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @format + * @flow + */ +// [TODO(macOS ISS#2323203) +'use strict'; + +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; + +function processColorObject( + color: NativeOrDynamicColorType, +): ?NativeOrDynamicColorType { + return null; +} + +module.exports = processColorObject; +// ]TODO(macOS ISS#2323203) diff --git a/Libraries/StyleSheet/processColorObject.ios.js b/Libraries/StyleSheet/processColorObject.ios.js new file mode 100644 index 00000000000000..bfb86980754bd7 --- /dev/null +++ b/Libraries/StyleSheet/processColorObject.ios.js @@ -0,0 +1,33 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @format + * @flow + */ +// [TODO(macOS ISS#2323203) +'use strict'; + +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; +const processColor = require('processColor'); + +function processColorObject( + color: NativeOrDynamicColorType, +): ?NativeOrDynamicColorType { + if ('dynamic' in color && color.dynamic !== undefined) { + const dynamic = color.dynamic; + const dynamicColor: NativeOrDynamicColorType = { + dynamic: { + light: processColor(dynamic.light), + dark: processColor(dynamic.dark), + }, + }; + return dynamicColor; + } + return color; +} + +module.exports = processColorObject; +// ]TODO(macOS ISS#2323203) diff --git a/Libraries/StyleSheet/processColorObject.macos.js b/Libraries/StyleSheet/processColorObject.macos.js new file mode 100644 index 00000000000000..bfb86980754bd7 --- /dev/null +++ b/Libraries/StyleSheet/processColorObject.macos.js @@ -0,0 +1,33 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @format + * @flow + */ +// [TODO(macOS ISS#2323203) +'use strict'; + +import type {NativeOrDynamicColorType} from 'normalizeColorObject'; +const processColor = require('processColor'); + +function processColorObject( + color: NativeOrDynamicColorType, +): ?NativeOrDynamicColorType { + if ('dynamic' in color && color.dynamic !== undefined) { + const dynamic = color.dynamic; + const dynamicColor: NativeOrDynamicColorType = { + dynamic: { + light: processColor(dynamic.light), + dark: processColor(dynamic.dark), + }, + }; + return dynamicColor; + } + return color; +} + +module.exports = processColorObject; +// ]TODO(macOS ISS#2323203)