| 1 | /** |
| 2 | * Copyright (c) Meta Platforms, Inc. and 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 | * @flow |
| 8 | */ |
| 9 | |
| 10 | import type {BoxStyle} from './types'; |
| 11 | |
| 12 | /** |
| 13 | * This mirrors react-native/Libraries/Inspector/resolveBoxStyle.js (but without RTL support). |
| 14 | * |
| 15 | * Resolve a style property into it's component parts, e.g. |
| 16 | * |
| 17 | * resolveBoxStyle('margin', {margin: 5, marginBottom: 10}) |
| 18 | * -> {top: 5, left: 5, right: 5, bottom: 10} |
| 19 | */ |
| 20 | export default function resolveBoxStyle( |
| 21 | prefix: string, |
| 22 | style: Object, |
| 23 | ): BoxStyle | null { |
| 24 | let hasParts = false; |
| 25 | const result = { |
| 26 | bottom: 0, |
| 27 | left: 0, |
| 28 | right: 0, |
| 29 | top: 0, |
| 30 | }; |
| 31 | |
| 32 | const styleForAll = style[prefix]; |
| 33 | if (styleForAll != null) { |
| 34 | // eslint-disable-next-line no-for-of-loops/no-for-of-loops |
| 35 | for (const key of Object.keys(result)) { |
| 36 | result[key] = styleForAll; |
| 37 | } |
| 38 | hasParts = true; |
| 39 | } |
| 40 | |
| 41 | const styleForHorizontal = style[prefix + 'Horizontal']; |
| 42 | if (styleForHorizontal != null) { |
| 43 | result.left = styleForHorizontal; |
| 44 | result.right = styleForHorizontal; |
| 45 | hasParts = true; |
| 46 | } else { |
| 47 | const styleForLeft = style[prefix + 'Left']; |
| 48 | if (styleForLeft != null) { |
| 49 | result.left = styleForLeft; |
| 50 | hasParts = true; |
| 51 | } |
| 52 | |
| 53 | const styleForRight = style[prefix + 'Right']; |
| 54 | if (styleForRight != null) { |
| 55 | result.right = styleForRight; |
| 56 | hasParts = true; |
| 57 | } |
| 58 | |
| 59 | const styleForEnd = style[prefix + 'End']; |
| 60 | if (styleForEnd != null) { |
| 61 | // TODO RTL support |
| 62 | result.right = styleForEnd; |
| 63 | hasParts = true; |
| 64 | } |
| 65 | const styleForStart = style[prefix + 'Start']; |
| 66 | if (styleForStart != null) { |
| 67 | // TODO RTL support |
| 68 | result.left = styleForStart; |
| 69 | hasParts = true; |
| 70 | } |
| 71 | } |
| 72 | |
| 73 | const styleForVertical = style[prefix + 'Vertical']; |
| 74 | if (styleForVertical != null) { |
| 75 | result.bottom = styleForVertical; |
| 76 | result.top = styleForVertical; |
| 77 | hasParts = true; |
| 78 | } else { |
| 79 | const styleForBottom = style[prefix + 'Bottom']; |
| 80 | if (styleForBottom != null) { |
| 81 | result.bottom = styleForBottom; |
| 82 | hasParts = true; |
| 83 | } |
| 84 | |
| 85 | const styleForTop = style[prefix + 'Top']; |
| 86 | if (styleForTop != null) { |
| 87 | result.top = styleForTop; |
| 88 | hasParts = true; |
| 89 | } |
| 90 | } |
| 91 | |
| 92 | return hasParts ? result : null; |
| 93 | } |