xref: /expo/packages/expo-router/build/views/Toast.js (revision 6c5f8b44)
1"use strict";
2var __importDefault = (this && this.__importDefault) || function (mod) {
3    return (mod && mod.__esModule) ? mod : { "default": mod };
4};
5Object.defineProperty(exports, "__esModule", { value: true });
6exports.Toast = exports.ToastWrapper = exports.CODE_FONT = void 0;
7const bottom_tabs_1 = require("@react-navigation/bottom-tabs");
8const react_1 = __importDefault(require("react"));
9const react_native_1 = require("react-native");
10const react_native_safe_area_context_1 = require("react-native-safe-area-context");
11exports.CODE_FONT = react_native_1.Platform.select({
12    default: 'Courier',
13    ios: 'Courier New',
14    android: 'monospace',
15});
16function useFadeIn() {
17    // Returns a React Native Animated value for fading in
18    const [value] = react_1.default.useState(() => new react_native_1.Animated.Value(0));
19    react_1.default.useEffect(() => {
20        react_native_1.Animated.timing(value, {
21            toValue: 1,
22            duration: 200,
23            useNativeDriver: true,
24        }).start();
25    }, []);
26    return value;
27}
28function ToastWrapper({ children }) {
29    const inTabBar = react_1.default.useContext(bottom_tabs_1.BottomTabBarHeightContext);
30    const Wrapper = inTabBar ? react_native_1.View : react_native_safe_area_context_1.SafeAreaView;
31    return (react_1.default.createElement(Wrapper, { collapsable: false, style: { flex: 1 } }, children));
32}
33exports.ToastWrapper = ToastWrapper;
34function Toast({ children, filename, warning, }) {
35    const filenamePretty = react_1.default.useMemo(() => {
36        if (!filename)
37            return undefined;
38        return 'app' + filename.replace(/^\./, '');
39    }, [filename]);
40    const value = useFadeIn();
41    return (react_1.default.createElement(react_native_1.View, { style: styles.container },
42        react_1.default.createElement(react_native_1.Animated.View, { style: [
43                styles.toast,
44                // @ts-expect-error: fixed is supported on web.
45                {
46                    position: react_native_1.Platform.select({
47                        web: 'fixed',
48                        default: 'absolute',
49                    }),
50                    opacity: value,
51                },
52            ] },
53            !warning && react_1.default.createElement(react_native_1.ActivityIndicator, { color: "white" }),
54            warning && react_1.default.createElement(react_native_1.Image, { source: require('expo-router/assets/error.png'), style: styles.icon }),
55            react_1.default.createElement(react_native_1.View, { style: { marginLeft: 8 } },
56                react_1.default.createElement(react_native_1.Text, { style: styles.text }, children),
57                filenamePretty && react_1.default.createElement(react_native_1.Text, { style: styles.filename }, filenamePretty)))));
58}
59exports.Toast = Toast;
60const styles = react_native_1.StyleSheet.create({
61    container: {
62        backgroundColor: 'transparent',
63        flex: 1,
64    },
65    icon: { width: 20, height: 20, resizeMode: 'contain' },
66    toast: {
67        alignItems: 'center',
68        borderWidth: 1,
69        borderColor: 'rgba(255,255,255,0.2)',
70        flexDirection: 'row',
71        bottom: 8,
72        left: 8,
73        paddingVertical: 8,
74        paddingHorizontal: 12,
75        borderRadius: 4,
76        backgroundColor: 'black',
77    },
78    text: { color: 'white', fontSize: 16 },
79    filename: {
80        fontFamily: exports.CODE_FONT,
81        opacity: 0.8,
82        color: 'white',
83        fontSize: 12,
84    },
85    code: { fontFamily: exports.CODE_FONT },
86});
87//# sourceMappingURL=Toast.js.map