1/**
2 * Copyright (c) 650 Industries.
3 * Copyright (c) Meta Platforms, Inc. and affiliates.
4 *
5 * This source code is licensed under the MIT license found in the
6 * LICENSE file in the root directory of this source tree.
7 */
8import React from 'react';
9import { ScrollView, StyleSheet, Text, View } from 'react-native';
10import { Ansi } from '../UI/AnsiHighlight';
11import { LogBoxButton } from '../UI/LogBoxButton';
12import * as LogBoxStyle from '../UI/LogBoxStyle';
13import { CODE_FONT } from '../UI/constants';
14import { formatProjectFilePath } from '../formatProjectFilePath';
15import openFileInEditor from '../modules/openFileInEditor';
16import { LogBoxInspectorSection } from './LogBoxInspectorSection';
17export function LogBoxInspectorCodeFrame({ codeFrame }) {
18    if (codeFrame == null) {
19        return null;
20    }
21    function getFileName() {
22        return formatProjectFilePath(process.env.EXPO_PROJECT_ROOT, codeFrame?.fileName);
23    }
24    function getLocation() {
25        const location = codeFrame?.location;
26        if (location != null) {
27            return ` (${location.row}:${location.column + 1 /* Code frame columns are zero indexed */})`;
28        }
29        return null;
30    }
31    return (React.createElement(LogBoxInspectorSection, { heading: "Source" },
32        React.createElement(View, { style: styles.box },
33            React.createElement(View, { style: styles.frame },
34                React.createElement(ScrollView, { horizontal: true },
35                    React.createElement(Ansi, { style: styles.content, text: codeFrame.content }))),
36            React.createElement(LogBoxButton, { backgroundColor: {
37                    default: 'transparent',
38                    pressed: LogBoxStyle.getBackgroundDarkColor(1),
39                }, style: styles.button, onPress: () => {
40                    openFileInEditor(codeFrame.fileName, codeFrame.location?.row ?? 0);
41                } },
42                React.createElement(Text, { style: styles.fileText },
43                    getFileName(),
44                    getLocation())))));
45}
46const styles = StyleSheet.create({
47    box: {
48        backgroundColor: LogBoxStyle.getBackgroundColor(),
49        borderWidth: 1,
50        borderColor: '#323232',
51        marginLeft: 10,
52        marginRight: 10,
53        marginTop: 5,
54        borderRadius: 3,
55    },
56    frame: {
57        padding: 10,
58        borderBottomColor: LogBoxStyle.getTextColor(0.1),
59        borderBottomWidth: 1,
60    },
61    button: {
62        paddingTop: 10,
63        paddingBottom: 10,
64    },
65    content: {
66        color: LogBoxStyle.getTextColor(1),
67        fontSize: 12,
68        includeFontPadding: false,
69        lineHeight: 20,
70        fontFamily: CODE_FONT,
71    },
72    fileText: {
73        userSelect: 'none',
74        color: LogBoxStyle.getTextColor(0.5),
75        textAlign: 'center',
76        flex: 1,
77        fontSize: 16,
78        includeFontPadding: false,
79        fontFamily: CODE_FONT,
80    },
81});
82//# sourceMappingURL=LogBoxInspectorCodeFrame.js.map