LogBoxInspectorSection.js 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  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. * @flow strict-local
  8. * @format
  9. */
  10. 'use strict';
  11. import * as React from 'react';
  12. import StyleSheet from '../../StyleSheet/StyleSheet';
  13. import Text from '../../Text/Text';
  14. import View from '../../Components/View/View';
  15. import * as LogBoxStyle from './LogBoxStyle';
  16. type Props = $ReadOnly<{|
  17. heading: string,
  18. children: React.Node,
  19. action?: ?React.Node,
  20. |}>;
  21. function LogBoxInspectorSection(props: Props): React.Node {
  22. return (
  23. <View style={styles.section}>
  24. <View style={styles.heading}>
  25. <Text style={styles.headingText}>{props.heading}</Text>
  26. {props.action}
  27. </View>
  28. <View style={styles.body}>{props.children}</View>
  29. </View>
  30. );
  31. }
  32. const styles = StyleSheet.create({
  33. section: {
  34. marginTop: 15,
  35. },
  36. heading: {
  37. alignItems: 'center',
  38. flexDirection: 'row',
  39. paddingHorizontal: 12,
  40. marginBottom: 10,
  41. },
  42. headingText: {
  43. color: LogBoxStyle.getTextColor(1),
  44. flex: 1,
  45. fontSize: 18,
  46. fontWeight: '600',
  47. includeFontPadding: false,
  48. lineHeight: 20,
  49. },
  50. body: {
  51. paddingBottom: 10,
  52. },
  53. });
  54. export default LogBoxInspectorSection;