resolveBoxStyle.js 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  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. 'use strict';
  11. const I18nManager = require('../ReactNative/I18nManager');
  12. /**
  13. * Resolve a style property into its component parts.
  14. *
  15. * For example:
  16. *
  17. * > resolveProperties('margin', {margin: 5, marginBottom: 10})
  18. * {top: 5, left: 5, right: 5, bottom: 10}
  19. *
  20. * If no parts exist, this returns null.
  21. */
  22. function resolveBoxStyle(
  23. prefix: string,
  24. style: Object,
  25. ): ?$ReadOnly<{|
  26. bottom: number,
  27. left: number,
  28. right: number,
  29. top: number,
  30. |}> {
  31. let hasParts = false;
  32. const result = {
  33. bottom: 0,
  34. left: 0,
  35. right: 0,
  36. top: 0,
  37. };
  38. // TODO: Fix issues with multiple properties affecting the same side.
  39. const styleForAll = style[prefix];
  40. if (styleForAll != null) {
  41. for (const key of Object.keys(result)) {
  42. result[key] = styleForAll;
  43. }
  44. hasParts = true;
  45. }
  46. const styleForHorizontal = style[prefix + 'Horizontal'];
  47. if (styleForHorizontal != null) {
  48. result.left = styleForHorizontal;
  49. result.right = styleForHorizontal;
  50. hasParts = true;
  51. } else {
  52. const styleForLeft = style[prefix + 'Left'];
  53. if (styleForLeft != null) {
  54. result.left = styleForLeft;
  55. hasParts = true;
  56. }
  57. const styleForRight = style[prefix + 'Right'];
  58. if (styleForRight != null) {
  59. result.right = styleForRight;
  60. hasParts = true;
  61. }
  62. const styleForEnd = style[prefix + 'End'];
  63. if (styleForEnd != null) {
  64. const constants = I18nManager.getConstants();
  65. if (constants.isRTL && constants.doLeftAndRightSwapInRTL) {
  66. result.left = styleForEnd;
  67. } else {
  68. result.right = styleForEnd;
  69. }
  70. hasParts = true;
  71. }
  72. const styleForStart = style[prefix + 'Start'];
  73. if (styleForStart != null) {
  74. const constants = I18nManager.getConstants();
  75. if (constants.isRTL && constants.doLeftAndRightSwapInRTL) {
  76. result.right = styleForStart;
  77. } else {
  78. result.left = styleForStart;
  79. }
  80. hasParts = true;
  81. }
  82. }
  83. const styleForVertical = style[prefix + 'Vertical'];
  84. if (styleForVertical != null) {
  85. result.bottom = styleForVertical;
  86. result.top = styleForVertical;
  87. hasParts = true;
  88. } else {
  89. const styleForBottom = style[prefix + 'Bottom'];
  90. if (styleForBottom != null) {
  91. result.bottom = styleForBottom;
  92. hasParts = true;
  93. }
  94. const styleForTop = style[prefix + 'Top'];
  95. if (styleForTop != null) {
  96. result.top = styleForTop;
  97. hasParts = true;
  98. }
  99. }
  100. return hasParts ? result : null;
  101. }
  102. module.exports = resolveBoxStyle;