diff --git a/packages/react-native/Libraries/LogBox/UI/AnsiHighlight.js b/packages/react-native/Libraries/LogBox/UI/AnsiHighlight.js
index df3ae6565ae4..8871f67c6bb0 100644
--- a/packages/react-native/Libraries/LogBox/UI/AnsiHighlight.js
+++ b/packages/react-native/Libraries/LogBox/UI/AnsiHighlight.js
@@ -87,7 +87,7 @@ export default function Ansi({
{parsedLines.map((items, i) => (
-
+
{items.map((bundle, key) => {
const textStyle =
bundle.fg && COLORS[bundle.fg]
@@ -101,6 +101,7 @@ export default function Ansi({
return (
{getText(bundle.content, key)}
diff --git a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorCodeFrame.js b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorCodeFrame.js
index 8611a6d8d261..07f7ae1f89ea 100644
--- a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorCodeFrame.js
+++ b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorCodeFrame.js
@@ -63,7 +63,7 @@ component CodeFrameDisplay(codeFrame: CodeFrame) {
onPress={() => {
openFileInEditor(codeFrame.fileName, codeFrame.location?.row ?? 0);
}}>
-
+
{getFileName()}
{getLocation()}
@@ -116,7 +116,7 @@ component AppInfo() {
}}
style={appInfoStyles.buildButton}
onPress={appInfo.onPress}>
-
+
{appInfo.appVersion} ({appInfo.engine})
diff --git a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorFooter.js b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorFooter.js
index 5d5092944e05..d8bd0cce650c 100644
--- a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorFooter.js
+++ b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorFooter.js
@@ -29,7 +29,10 @@ export default function LogBoxInspectorFooter(props: Props): React.Node {
return (
-
+
This error cannot be dismissed.
diff --git a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorFooterButton.js b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorFooterButton.js
index c1ecc8fb6d5c..3db512ed3d43 100644
--- a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorFooterButton.js
+++ b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorFooterButton.js
@@ -35,7 +35,9 @@ export default function LogBoxInspectorFooterButton(
}}
onPress={props.onPress}>
- {props.text}
+
+ {props.text}
+
diff --git a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorHeader.js b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorHeader.js
index 653a67a5a343..a5b5329d440e 100644
--- a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorHeader.js
+++ b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorHeader.js
@@ -36,7 +36,10 @@ export default function LogBoxInspectorHeader(props: Props): React.Node {
-
@@ -63,7 +66,10 @@ export default function LogBoxInspectorHeader(props: Props): React.Node {
onPress={() => props.onSelectIndex(prevIndex)}
/>
-
diff --git a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorMessageHeader.js b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorMessageHeader.js
index b54820b3be67..9ca2e4856799 100644
--- a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorMessageHeader.js
+++ b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorMessageHeader.js
@@ -32,7 +32,10 @@ component LogBoxInspectorMessageHeader(
return null;
}
return (
- onPress()}>
+ onPress()}>
... See More
);
@@ -42,12 +45,16 @@ component LogBoxInspectorMessageHeader(
{title}
-
+
- {'<'}
+
+ {'<'}
+
{frame.methodName}
- {' />'}
+
+ {' />'}
+
-
+
{frame.file != null ? getPrettyFileName(frame.file) : ''}
{frame.lineNumber != null ? `:${frame.lineNumber}` : ''}
@@ -122,7 +133,9 @@ component LogBoxInspectorReactFrames(log: LogBoxLog) {
}}
onPress={() => setCollapsed(!collapsed)}
style={componentStyles.collapseButton}>
- {getCollapseMessage()}
+
+ {getCollapseMessage()}
+
diff --git a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorSection.js b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorSection.js
index 12f3a97af269..f9620ac683fe 100644
--- a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorSection.js
+++ b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorSection.js
@@ -22,7 +22,9 @@ component LogBoxInspectorSection(
return (
- {heading}
+
+ {heading}
+
{action}
{children}
diff --git a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorSourceMapStatus.js b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorSourceMapStatus.js
index 5351316fc12e..4a321a5004c0 100644
--- a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorSourceMapStatus.js
+++ b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorSourceMapStatus.js
@@ -103,7 +103,9 @@ component LogBoxInspectorSourceMapStatus(
: {transform: [{rotate: state.rotate}]},
]}
/>
- Source Map
+
+ Source Map
+
);
}
diff --git a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorStackFrame.js b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorStackFrame.js
index d33b7bf8ca5f..e7b75d9b4f1e 100644
--- a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorStackFrame.js
+++ b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorStackFrame.js
@@ -44,11 +44,13 @@ component LogBoxInspectorStackFrame(
style={styles.frame}>
{frame.methodName}
{location}
diff --git a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorStackFrames.js b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorStackFrames.js
index 8487e6fa807d..b7fbc37cfcdb 100644
--- a/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorStackFrames.js
+++ b/packages/react-native/Libraries/LogBox/UI/LogBoxInspectorStackFrames.js
@@ -89,7 +89,7 @@ component LogBoxInspectorStackFrames(log: LogBoxLog, onRetry: () => void) {
}>
{log.symbolicated.status !== 'COMPLETE' && (
-
+
This call stack is not symbolicated. Some features are unavailable
such as viewing the function name or tapping to open files.
@@ -138,7 +138,9 @@ component StackFrameFooter(message: string, onPress: () => void) {
}}
onPress={onPress}
style={stackStyles.collapseButton}>
- {message}
+
+ {message}
+
);
diff --git a/packages/react-native/Libraries/LogBox/UI/LogBoxMessage.js b/packages/react-native/Libraries/LogBox/UI/LogBoxMessage.js
index 73fd359cc088..626428a99bbe 100644
--- a/packages/react-native/Libraries/LogBox/UI/LogBoxMessage.js
+++ b/packages/react-native/Libraries/LogBox/UI/LogBoxMessage.js
@@ -43,7 +43,11 @@ component TappableLinks(content: string, style: void | TextStyleProp) {
if (matches.length === 0) {
// No URLs detected. Just return the content.
- return {content};
+ return (
+
+ {content}
+
+ );
}
// URLs were detected. Construct array of Text nodes.
@@ -55,7 +59,11 @@ component TappableLinks(content: string, style: void | TextStyleProp) {
for (const linkRange of matches) {
if (startIndex < linkRange.lowerBound) {
const text = content.substring(startIndex, linkRange.lowerBound);
- fragments.push({text});
+ fragments.push(
+
+ {text}
+ ,
+ );
}
const link = content.substring(linkRange.lowerBound, linkRange.upperBound);
@@ -66,6 +74,7 @@ component TappableLinks(content: string, style: void | TextStyleProp) {
Linking.openURL(link);
}}
key={++indexCounter}
+ maxFontSizeMultiplier={1.5}
style={styles.linkText}>
{link}
,
@@ -77,13 +86,17 @@ component TappableLinks(content: string, style: void | TextStyleProp) {
if (startIndex < content.length) {
const text = content.substring(startIndex);
fragments.push(
-
+
{text}
,
);
}
- return {fragments};
+ return (
+
+ {fragments}
+
+ );
}
const cleanContent = (content: string) =>
@@ -98,7 +111,7 @@ component LogBoxMessage(
const {content, substitutions}: Message = message;
if (plaintext === true) {
- return {cleanContent(content)};
+ return {cleanContent(content)};
}
const resolvedMaxLength = maxLength != null ? maxLength : Infinity;
diff --git a/packages/react-native/Libraries/LogBox/UI/LogBoxNotificationCountBadge.js b/packages/react-native/Libraries/LogBox/UI/LogBoxNotificationCountBadge.js
index 1777de4d6956..5716be260ace 100644
--- a/packages/react-native/Libraries/LogBox/UI/LogBoxNotificationCountBadge.js
+++ b/packages/react-native/Libraries/LogBox/UI/LogBoxNotificationCountBadge.js
@@ -24,7 +24,10 @@ export default function LogBoxNotificationCountBadge(props: {
* when fixing the type of `StyleSheet.create`. Remove this comment to
* see the error. */}
-
+
{props.count <= 1 ? '!' : props.count}
diff --git a/packages/react-native/Libraries/LogBox/UI/LogBoxNotificationMessage.js b/packages/react-native/Libraries/LogBox/UI/LogBoxNotificationMessage.js
index ae5c182ae838..2243da1fb1bc 100644
--- a/packages/react-native/Libraries/LogBox/UI/LogBoxNotificationMessage.js
+++ b/packages/react-native/Libraries/LogBox/UI/LogBoxNotificationMessage.js
@@ -24,6 +24,7 @@ export default function LogBoxNotificationMessage(props: {
{props.message && (
diff --git a/packages/react-native/Libraries/LogBox/UI/__tests__/__snapshots__/LogBoxInspectorCodeFrame-test.js.snap b/packages/react-native/Libraries/LogBox/UI/__tests__/__snapshots__/LogBoxInspectorCodeFrame-test.js.snap
index a1dd32e9e801..79c187987664 100644
--- a/packages/react-native/Libraries/LogBox/UI/__tests__/__snapshots__/LogBoxInspectorCodeFrame-test.js.snap
+++ b/packages/react-native/Libraries/LogBox/UI/__tests__/__snapshots__/LogBoxInspectorCodeFrame-test.js.snap
@@ -69,6 +69,7 @@ exports[`LogBoxInspectorCodeFrame should dedupe if code frames are the same 1`]
}
>
MyComponent
MyComponent2
MyComponent3
MyComponent
MyComponent
+
https://reactnative.dev
-
+
and
+
https://reactnative.dev
-
+
and https:/
`;
exports[`LogBoxMessage Should make links tappable 1`] = `
-
+
+
normal
,
substitution
,
-
+
normal
,
]
`;
exports[`LogBoxMessage should render a plaintext message and clean the content 1`] = `
-
+
This should not start with Error:
`;
exports[`LogBoxMessage should render a plaintext message with no substitutions 1`] = `
-
+
normal substitution normal
`;
exports[`LogBoxMessage should render message 1`] = `
-
+
Some kind of message
`;
exports[`LogBoxMessage should render message truncated to 6 chars 1`] = `
-
+
Some
`;
exports[`LogBoxMessage should render message with substitution 1`] = `
Array [
-
+
normal
,
substitution
,
-
+
normal
,
]
`;
exports[`LogBoxMessage should render message with substitution, truncating the first word 3 letters in 1`] = `
-
+
nor
`;
exports[`LogBoxMessage should render message with substitution, truncating the second word 6 letters in 1`] = `
Array [
-
+
normal
,
substi
@@ -138,37 +175,49 @@ Array [
exports[`LogBoxMessage should render message with substitution, truncating the third word 2 letters in 1`] = `
Array [
-
+
normal
,
substitution
,
-
+
no
,
]
`;
exports[`LogBoxMessage should render the whole message when maxLength = message length 1`] = `
-
+
Some kind of message
`;
exports[`LogBoxMessage should render the whole message with substitutions when maxLength = message length 1`] = `
Array [
-
+
normal
,
substitution
,
-
+
normal
,
]