1"use strict"; 2var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) { 3 if (k2 === undefined) k2 = k; 4 var desc = Object.getOwnPropertyDescriptor(m, k); 5 if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) { 6 desc = { enumerable: true, get: function() { return m[k]; } }; 7 } 8 Object.defineProperty(o, k2, desc); 9}) : (function(o, m, k, k2) { 10 if (k2 === undefined) k2 = k; 11 o[k2] = m[k]; 12})); 13var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) { 14 Object.defineProperty(o, "default", { enumerable: true, value: v }); 15}) : function(o, v) { 16 o["default"] = v; 17}); 18var __importStar = (this && this.__importStar) || function (mod) { 19 if (mod && mod.__esModule) return mod; 20 var result = {}; 21 if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k); 22 __setModuleDefault(result, mod); 23 return result; 24}; 25Object.defineProperty(exports, "__esModule", { value: true }); 26exports.ErrorToast = void 0; 27/** 28 * Copyright (c) 650 Industries. 29 * Copyright (c) Meta Platforms, Inc. and affiliates. 30 * 31 * This source code is licensed under the MIT license found in the 32 * LICENSE file in the root directory of this source tree. 33 */ 34const react_1 = __importStar(require("react")); 35const react_native_1 = require("react-native"); 36const ErrorToastMessage_1 = require("./ErrorToastMessage"); 37const LogBoxData = __importStar(require("../Data/LogBoxData")); 38const LogBoxStyle = __importStar(require("../UI/LogBoxStyle")); 39function useSymbolicatedLog(log) { 40 // Eagerly symbolicate so the stack is available when pressing to inspect. 41 (0, react_1.useEffect)(() => { 42 LogBoxData.symbolicateLogLazy('stack', log); 43 LogBoxData.symbolicateLogLazy('component', log); 44 }, [log]); 45} 46function ErrorToast(props) { 47 const { totalLogCount, level, log } = props; 48 useSymbolicatedLog(log); 49 return (react_1.default.createElement(react_native_1.View, { style: toastStyles.container }, 50 react_1.default.createElement(react_native_1.Pressable, { style: { flex: 1 }, onPress: props.onPressOpen }, ({ 51 /** @ts-expect-error: react-native types are broken. */ 52 hovered, pressed, }) => (react_1.default.createElement(react_native_1.View, { style: [ 53 toastStyles.press, 54 { 55 // @ts-expect-error: web-only type 56 transitionDuration: '150ms', 57 backgroundColor: pressed 58 ? '#323232' 59 : hovered 60 ? '#111111' 61 : LogBoxStyle.getBackgroundColor(), 62 }, 63 ] }, 64 react_1.default.createElement(Count, { count: totalLogCount, level: level }), 65 react_1.default.createElement(ErrorToastMessage_1.ErrorToastMessage, { message: log.message }), 66 react_1.default.createElement(Dismiss, { onPress: props.onPressDismiss })))))); 67} 68exports.ErrorToast = ErrorToast; 69function Count({ count, level }) { 70 return (react_1.default.createElement(react_native_1.View, { style: [countStyles.inside, countStyles[level]] }, 71 react_1.default.createElement(react_native_1.Text, { style: countStyles.text }, count <= 1 ? '!' : count))); 72} 73function Dismiss({ onPress }) { 74 return (react_1.default.createElement(react_native_1.Pressable, { style: { 75 marginLeft: 5, 76 }, hitSlop: { 77 top: 12, 78 right: 10, 79 bottom: 12, 80 left: 10, 81 }, onPress: onPress }, ({ 82 /** @ts-expect-error: react-native types are broken. */ 83 hovered, pressed, }) => (react_1.default.createElement(react_native_1.View, { style: [dismissStyles.press, hovered && { opacity: 0.8 }, pressed && { opacity: 0.5 }] }, 84 react_1.default.createElement(react_native_1.Image, { source: require('@expo/metro-runtime/assets/close.png'), style: dismissStyles.image }))))); 85} 86const countStyles = react_native_1.StyleSheet.create({ 87 warn: { 88 backgroundColor: LogBoxStyle.getWarningColor(1), 89 }, 90 error: { 91 backgroundColor: LogBoxStyle.getErrorColor(1), 92 }, 93 log: { 94 backgroundColor: LogBoxStyle.getLogColor(1), 95 }, 96 inside: { 97 marginRight: 8, 98 minWidth: 22, 99 aspectRatio: 1, 100 paddingHorizontal: 4, 101 borderRadius: 11, 102 justifyContent: 'center', 103 alignItems: 'center', 104 }, 105 text: { 106 color: LogBoxStyle.getTextColor(1), 107 fontSize: 14, 108 lineHeight: 18, 109 textAlign: 'center', 110 fontWeight: '600', 111 textShadow: `0px 0px 3px ${LogBoxStyle.getBackgroundColor(0.8)}`, 112 }, 113}); 114const dismissStyles = react_native_1.StyleSheet.create({ 115 press: { 116 backgroundColor: '#323232', 117 height: 20, 118 width: 20, 119 borderRadius: 25, 120 alignItems: 'center', 121 justifyContent: 'center', 122 }, 123 image: { 124 height: 8, 125 width: 8, 126 }, 127}); 128const toastStyles = react_native_1.StyleSheet.create({ 129 container: { 130 height: 48, 131 justifyContent: 'center', 132 marginBottom: 4, 133 }, 134 press: { 135 borderWidth: 1, 136 borderRadius: 8, 137 overflow: 'hidden', 138 flexDirection: 'row', 139 alignItems: 'center', 140 borderColor: '#323232', 141 backgroundColor: LogBoxStyle.getBackgroundColor(), 142 flex: 1, 143 paddingHorizontal: 12, 144 }, 145}); 146//# sourceMappingURL=ErrorToast.js.map