1import { Code } from '@expo/html-elements';
2import { PropsWithChildren } from 'react';
3import { ScrollView, StyleSheet, ViewStyle } from 'react-native';
4
5type Props = PropsWithChildren<{
6  style?: ViewStyle;
7}>;
8
9export default function ConsoleBox({ children, style }: Props) {
10  return (
11    <ScrollView style={[styles.scrollView, style]} indicatorStyle="black">
12      <ScrollView contentContainerStyle={styles.contentContainer} horizontal indicatorStyle="black">
13        <Code style={styles.monoText}>{children}</Code>
14      </ScrollView>
15    </ScrollView>
16  );
17}
18
19const styles = StyleSheet.create({
20  scrollView: {
21    backgroundColor: '#fff',
22    borderWidth: 1,
23    borderColor: '#666',
24  },
25  contentContainer: {
26    padding: 6,
27  },
28  monoText: {
29    fontSize: 10,
30  },
31});
32