diff --git a/Libraries/StyleSheet/StyleSheet.js b/Libraries/StyleSheet/StyleSheet.js index c2579f21a36..ec20623d8a2 100644 --- a/Libraries/StyleSheet/StyleSheet.js +++ b/Libraries/StyleSheet/StyleSheet.js @@ -28,7 +28,9 @@ import type { ____TextStyleProp_Internal, ____ImageStyle_Internal, ____ImageStyleProp_Internal, - LayoutStyle, + ____LayoutStyle_Internal, + ____ShadowStyle_Internal, + ____TransformStyle_Internal, } from 'StyleSheetTypes'; /** @@ -155,6 +157,15 @@ export type ImageStyle = ____ImageStyle_Internal; */ export type DangerouslyImpreciseStyle = ____DangerouslyImpreciseStyle_Internal; +/** + * These types are simlilar to the style types above. They are objects of the + * possible style keys in that group. For example, ShadowStyle contains + * keys like `shadowColor` and `shadowRadius`. + */ +export type LayoutStyle = ____LayoutStyle_Internal; +export type ShadowStyle = ____ShadowStyle_Internal; +export type TransformStyle = ____TransformStyle_Internal; + let hairlineWidth = PixelRatio.roundToNearestPixel(0.4); if (hairlineWidth === 0) { hairlineWidth = 1 / PixelRatio.get(); diff --git a/Libraries/StyleSheet/StyleSheetTypes.js b/Libraries/StyleSheet/StyleSheetTypes.js index 44688ef7208..6ff412ce8a6 100644 --- a/Libraries/StyleSheet/StyleSheetTypes.js +++ b/Libraries/StyleSheet/StyleSheetTypes.js @@ -18,7 +18,7 @@ export opaque type ____StyleSheetInternalStyleIdentifier_Internal: number = numb export type ColorValue = null | string; export type DimensionValue = null | number | string | AnimatedNode; -export type LayoutStyle = $ReadOnly<{| +export type ____LayoutStyle_Internal = $ReadOnly<{| display?: 'none' | 'flex', width?: DimensionValue, height?: DimensionValue, @@ -92,7 +92,7 @@ export type LayoutStyle = $ReadOnly<{| direction?: 'inherit' | 'ltr' | 'rtl', |}>; -export type TransformStyle = $ReadOnly<{| +export type ____TransformStyle_Internal = $ReadOnly<{| transform?: $ReadOnlyArray< | {|+perspective: number | AnimatedNode|} | {|+rotate: string|} @@ -116,7 +116,7 @@ export type TransformStyle = $ReadOnly<{| >, |}>; -export type ShadowStyle = $ReadOnly<{| +export type ____ShadowStyle_Internal = $ReadOnly<{| shadowColor?: ColorValue, shadowOffset?: $ReadOnly<{| width?: number, @@ -127,9 +127,9 @@ export type ShadowStyle = $ReadOnly<{| |}>; export type ____ViewStyle_Internal = $ReadOnly<{| - ...$Exact, - ...$Exact, - ...$Exact, + ...$Exact<____LayoutStyle_Internal>, + ...$Exact<____ShadowStyle_Internal>, + ...$Exact<____TransformStyle_Internal>, backfaceVisibility?: 'visible' | 'hidden', backgroundColor?: ColorValue, borderColor?: ColorValue,