From 072d8ba2899f2601dad6d4b0333fdcb80555a7dd Mon Sep 17 00:00:00 2001
From: Ayesha Shafique <79274585+Aisha630@users.noreply.github.com>
Date: Mon, 4 Aug 2025 00:53:24 +0500
Subject: feat: Add reverse search capability for shell commands (#4793)

---
 packages/cli/src/ui/components/PrepareLabel.tsx | 48 +++++++++++++++++++++++++
 1 file changed, 48 insertions(+)
 create mode 100644 packages/cli/src/ui/components/PrepareLabel.tsx

(limited to 'packages/cli/src/ui/components/PrepareLabel.tsx')

diff --git a/packages/cli/src/ui/components/PrepareLabel.tsx b/packages/cli/src/ui/components/PrepareLabel.tsx
new file mode 100644
index 00000000..652a77a6
--- /dev/null
+++ b/packages/cli/src/ui/components/PrepareLabel.tsx
@@ -0,0 +1,48 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { Text } from 'ink';
+import { Colors } from '../colors.js';
+
+interface PrepareLabelProps {
+  label: string;
+  matchedIndex?: number;
+  userInput: string;
+  textColor: string;
+  highlightColor?: string;
+}
+
+export const PrepareLabel: React.FC<PrepareLabelProps> = ({
+  label,
+  matchedIndex,
+  userInput,
+  textColor,
+  highlightColor = Colors.AccentYellow,
+}) => {
+  if (
+    matchedIndex === undefined ||
+    matchedIndex < 0 ||
+    matchedIndex >= label.length ||
+    userInput.length === 0
+  ) {
+    return <Text color={textColor}>{label}</Text>;
+  }
+
+  const start = label.slice(0, matchedIndex);
+  const match = label.slice(matchedIndex, matchedIndex + userInput.length);
+  const end = label.slice(matchedIndex + userInput.length);
+
+  return (
+    <Text>
+      <Text color={textColor}>{start}</Text>
+      <Text color="black" bold backgroundColor={highlightColor}>
+        {match}
+      </Text>
+      <Text color={textColor}>{end}</Text>
+    </Text>
+  );
+};
-- 
cgit v1.2.3

