feat(ui): add solid background color option for input prompt (#16563)

Co-authored-by: Alexander Farber <farber72@outlook.de>

packages/cli/src/ui/utils/__snapshots__/ui-sizing.test.ts.snap

@@ -1,20 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`ui-sizing > calculateMainAreaWidth > should match snapshot for interpolation range 1`] = `
-{
-  "100": 95,
-  "104": 98,
-  "108": 101,
-  "112": 104,
-  "116": 107,
-  "120": 110,
-  "124": 113,
-  "128": 116,
-  "132": 119,
-  "80": 78,
-  "84": 82,
-  "88": 85,
-  "92": 88,
-  "96": 92,
-}
-`;

packages/cli/src/ui/utils/terminalUtils.ts

@@ -0,0 +1,22 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import process from 'node:process';
+
+/**
+ * Returns the color depth of the current terminal.
+ * Returns 24 (TrueColor) if unknown or not a TTY.
+ */
+export function getColorDepth(): number {
+  return process.stdout.getColorDepth ? process.stdout.getColorDepth() : 24;
+}
+
+/**
+ * Returns true if the terminal has low color depth (less than 24-bit).
+ */
+export function isLowColorDepth(): boolean {
+  return getColorDepth() < 24;
+}

packages/cli/src/ui/utils/ui-sizing.test.ts

@@ -29,43 +29,19 @@ describe('ui-sizing', () => {
 
   describe('calculateMainAreaWidth', () => {
     it.each([
-      // width, useFullWidth, alternateBuffer, expected
-      [80, true, false, 80],
-      [100, true, false, 100],
-      [80, true, true, 79], // -1 for alternate buffer
-      [100, true, true, 99],
-
-      // Default behavior (useFullWidth true)
-      [100, true, false, 100],
-
-      // useFullWidth: false (Smart sizing)
-      [80, false, false, 78], // 98% of 80
-      [132, false, false, 119], // 90% of 132
-      [200, false, false, 180], // 90% of 200 (>= 132)
-
-      // Interpolation check
-      [106, false, false, 100], // Approx middle
+      // expected, width, altBuffer
+      [80, 80, false],
+      [100, 100, false],
+      [79, 80, true],
+      [99, 100, true],
     ])(
-      'should return %i when width=%i, useFullWidth=%s, altBuffer=%s',
-      (width, useFullWidth, altBuffer, expected) => {
+      'should return %i when width=%i and altBuffer=%s',
+      (expected, width, altBuffer) => {
         mocks.isAlternateBufferEnabled.mockReturnValue(altBuffer);
-        const settings = createSettings(useFullWidth);
+        const settings = createSettings();
 
         expect(calculateMainAreaWidth(width, settings)).toBe(expected);
       },
     );
-
-    it('should match snapshot for interpolation range', () => {
-      mocks.isAlternateBufferEnabled.mockReturnValue(false);
-      const settings = createSettings(false);
-
-      const results: Record<number, number> = {};
-      // Test range from 80 to 132
-      for (let w = 80; w <= 132; w += 4) {
-        results[w] = calculateMainAreaWidth(w, settings);
-      }
-
-      expect(results).toMatchSnapshot();
-    });
   });
 });

packages/cli/src/ui/utils/ui-sizing.ts

@@ -4,34 +4,15 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { lerp } from '../../utils/math.js';
 import { type LoadedSettings } from '../../config/settings.js';
 import { isAlternateBufferEnabled } from '../hooks/useAlternateBuffer.js';
 
-const getMainAreaWidthInternal = (terminalWidth: number): number => {
-  if (terminalWidth <= 80) {
-    return Math.round(0.98 * terminalWidth);
-  }
-  if (terminalWidth >= 132) {
-    return Math.round(0.9 * terminalWidth);
-  }
-
-  // Linearly interpolate between 80 columns (98%) and 132 columns (90%).
-  const t = (terminalWidth - 80) / (132 - 80);
-  const percentage = lerp(98, 90, t);
-
-  return Math.round(percentage * terminalWidth * 0.01);
-};
-
 export const calculateMainAreaWidth = (
   terminalWidth: number,
   settings: LoadedSettings,
 ): number => {
-  if (settings.merged.ui.useFullWidth) {
-    if (isAlternateBufferEnabled(settings)) {
-      return terminalWidth - 1;
-    }
-    return terminalWidth;
+  if (isAlternateBufferEnabled(settings)) {
+    return terminalWidth - 1;
   }
-  return getMainAreaWidthInternal(terminalWidth);
+  return terminalWidth;
 };