feat(run): search the console output (#528)

The Run console had no search, so finding a line meant scrolling long output by hand.

Cmd/Ctrl+F, a toolbar button and the context menu open a find bar over the whole buffer with match case, words and regex, a match counter, next and previous navigation, and highlighting that keeps output colours. It expands a fold hiding the current match, and works for test output and stack trace consoles too.

Co-authored-by: itning <[email protected]>

src/features/run/Run.module.css

@@ -81,6 +81,14 @@
 
 /* Console */
 
+.consoleWrap {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  min-height: 0;
+}
+
 .console {
   flex: 1;
   min-height: 0;
@@ -107,6 +115,10 @@
   min-width: 0;
 }
 
+.match {
+  border-radius: 2px;
+}
+
 .line {
   position: absolute;
   top: 0;
@@ -748,6 +760,36 @@
   vertical-align: text-bottom;
   background: transparent;
 }
+
+/* Find bar (⌘F) */
+.find {
+  flex: none;
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  padding: 4px 8px;
+  background: var(--bg-elev);
+  border-bottom: 1px solid var(--border);
+}
+.findField {
+  flex: 0 1 360px;
+  min-width: 160px;
+}
+.findCount {
+  font-family: var(--font-mono);
+  font-size: var(--fs-small);
+  color: var(--fg-subtle);
+  padding: 0 6px;
+  white-space: nowrap;
+  min-width: 56px;
+}
+.findCountNone {
+  color: var(--danger);
+}
+.findSpacer {
+  flex: 1;
+}
+
 .console:focus .inputCaret {
   background: var(--fg);
   animation: caretBlink 1s steps(1) infinite;