import React from "react";
import { StyleSheet } from "react-native";
import CodeHighlighter from "react-native-code-highlighter";
import { atomOneDarkReasonable } from "react-syntax-highlighter/dist/esm/styles/hljs";

const CODE_STR = `var hello = "world"`;

export default function HighlightComponent() {
    return (
        <CodeHighlighter
            hljsStyle={atomOneDarkReasonable}
            containerStyle={styles.codeContainer}
            textStyle={styles.text}
            language="typescript"
        >
            {CODE_STR}
        </CodeHighlighter>
    );
}

const styles = StyleSheet.create({
    codeContainer: {
        padding: 16,
        minWidth: "100%",
    },
    text: {
        fontSize: 16,
    },
});