Turn off debug logging of MaxSizedBox errors by default. (#1228)

packages/cli/src/ui/components/shared/MaxSizedBox.test.tsx

@@ -5,11 +5,17 @@
  */
 
 import { render } from 'ink-testing-library';
-import { MaxSizedBox } from './MaxSizedBox.js';
+import { MaxSizedBox, setMaxSizedBoxDebugging } from './MaxSizedBox.js';
 import { Box, Text } from 'ink';
 import { describe, it, expect } from 'vitest';
 
 describe('<MaxSizedBox />', () => {
+  // Make sure MaxSizedBox logs errors on invalid configurations.
+  // This is useful for debugging issues with the component.
+  // It should be set to false in production for perfornance and to avoid
+  // cluttering the console if there are ignoreable issues.
+  setMaxSizedBoxDebugging(true);
+
   it('renders children without truncation when they fit', () => {
     const { lastFrame } = render(
       <MaxSizedBox maxWidth={80} maxHeight={10}>

packages/cli/src/ui/components/shared/MaxSizedBox.tsx

@@ -10,7 +10,11 @@ import stringWidth from 'string-width';
 import { Colors } from '../../colors.js';
 import { toCodePoints } from '../../utils/textUtils.js';
 
-const enableDebugLog = true;
+let enableDebugLog = false;
+
+export function setMaxSizedBoxDebugging(value: boolean) {
+  enableDebugLog = value;
+}
 
 function debugReportError(message: string, element: React.ReactNode) {
   if (!enableDebugLog) return;