text: /**
   * Sample React Native App
   * https://github.com/facebook/react-native
   *
   * @format
   * @flow strict-local
   */
  
  import React from 'react';
  import {
    SafeAreaView,
    StyleSheet,
    ScrollView,
    View,
    Text,
    StatusBar,
  } from 'react-native';
  
  import {
    Header,
    LearnMoreLinks,
    Colors,
    DebugInstructions,
    ReloadInstructions,
  } from 'react-native/Libraries/NewAppScreen';
  
  const App: () => React$Node = () => {
    return (
      [
        [StatusBar, { barStyle: 'dark-content' }],
        [SafeAreaView,
          [ScrollView, { contentInsetAdjustmentBehavior: 'automatic', style: styles.scrollView },
            [Header],
            global.HermesInternal == null ? null : (
              [View, {style: styles.engine},
                [Text, {style: styles.footer}, 'Engine: Hermes']
              ]
            ),
            [View, {style: styles.body},
              [View, {style: styles.sectionContainer},
                [Text, {style: styles.sectionTitle}, 'Step One'],
                [Text, {style: styles.sectionDescription},
                  "Edit [Text, {style: styles.highlight}, 'App.js'] to change this",
                  "screen and then come back to see your edits."],
              ],
              [View, {style: styles.sectionContainer},
                [Text, {style: styles.sectionTitle}, 'See Your Changes'],
                [Text, {style: styles.sectionDescription}, [ReloadInstructions]],
              ],
              [View, {style: styles.sectionContainer},
                [Text, {style: styles.sectionTitle}, 'Debug'],
                [Text, {style: styles.sectionDescription}, [DebugInstructions]],
              ],
              [View, {style: styles.sectionContainer},
                [Text, {style: styles.sectionTitle}, 'Learn More'],
                [Text, {style: styles.sectionDescription}, 'Read the docs to discover what to do next:'],
              ],
              [LearnMoreLinks],
            ]
          ]
        ]
      ]
    );
  };
  
  const styles = StyleSheet.create({
    scrollView: {
      backgroundColor: Colors.lighter,
    },
    engine: {
      position: 'absolute',
      right: 0,
    },
    body: {
      backgroundColor: Colors.white,
    },
    sectionContainer: {
      marginTop: 32,
      paddingHorizontal: 24,
    },
    sectionTitle: {
      fontSize: 24,
      fontWeight: '600',
      color: Colors.black,
    },
    sectionDescription: {
      marginTop: 8,
      fontSize: 18,
      fontWeight: '400',
      color: Colors.dark,
    },
    highlight: {
      fontWeight: '700',
    },
    footer: {
      color: Colors.dark,
      fontSize: 12,
      fontWeight: '600',
      padding: 4,
      paddingRight: 12,
      textAlign: 'right',
    },
  });
  
  export default App;
  