@youtyan/code-viewer 0.14.0 → 0.15.0

package/web/index.html

@@ -38,6 +38,7 @@
       <a class="app-menu-item" data-route="help" href="/help">Settings &amp; Help</a>
     </nav>
     <div class="global-actions">
+      <button id="search-btn" class="global-icon-action" title="search files (Ctrl+K) · Shift+click: grep (Ctrl+G)" aria-label="search files (Ctrl+K) · Shift+click: grep (Ctrl+G)"><span class="goi-icon" aria-hidden="true"></span></button>
       <button id="annotations-toggle" class="global-icon-action" title="code annotations" aria-label="code annotations"><span class="goi-icon" aria-hidden="true"></span><span id="annotations-count" hidden></span></button>
       <button id="doctor-btn" class="global-icon-action" title="environment doctor" aria-label="environment doctor"><span class="goi-icon" aria-hidden="true"></span><span id="doctor-badge" class="doctor-badge" hidden></span></button>
       <span class="global-actions-sep" aria-hidden="true"></span>
@@ -215,6 +216,7 @@
     <div class="app-panel-tabs" role="tablist" aria-label="panel">
       <button type="button" id="panel-tab-terminal" class="app-panel-tab" role="tab" data-panel="terminal" data-route="terminal" aria-selected="false">Terminal</button>
       <button type="button" id="panel-tab-tools" class="app-panel-tab" role="tab" data-panel="tools" data-route="tools" aria-selected="false">Tools</button>
+      <button type="button" id="panel-tab-search" class="app-panel-tab" role="tab" data-panel="search" data-route="search" aria-selected="false">Search</button>
       <span class="app-panel-spacer"></span>
       <div class="seg app-panel-layout-switch" role="group" aria-label="panel layout">
         <button type="button" data-panel-layout="overlay" class="active" aria-pressed="true">Overlay</button>
@@ -224,6 +226,7 @@
     </div>
     <div class="app-panel-bodies">
       <aside id="tools-sheet" class="tools-sheet" hidden aria-hidden="true" inert aria-label="tools"></aside>
+      <aside id="search-sheet" class="search-sheet" hidden aria-hidden="true" inert aria-label="search results"></aside>
       <aside id="terminal-sheet" class="terminal-sheet" hidden aria-hidden="true" inert aria-label="terminal"></aside>
     </div>
   </section>

package/web/style.css

@@ -303,6 +303,9 @@ body[data-code-font-size="xlarge"] {
 }
 
 .gdp-palette-label {
+  display: flex;
+  align-items: center;
+  gap: 6px;
   padding: 12px 16px 0;
   color: var(--fg-muted);
   font-size: 12px;
@@ -1064,6 +1067,21 @@ body.gdp-diff-page #repo-target-wrap {
   padding: 10px 10px 0;
   background: var(--bg);
 }
+/* Recently picked refs, same pill idiom as the quick chips. */
+.rp-recent {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  padding: 8px 10px 0;
+  background: var(--bg);
+}
+.rp-recent[hidden] { display: none; }
+.rp-chip-recent {
+  max-width: 180px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
 .rp-chip {
   /* Compact quick-fill pills; .current uses the same tinted-active idiom
      as the topbar toggles and header nav. */
@@ -1850,12 +1868,100 @@ body.gdp-history-page #topbar .ref-pickers {
 }
 .history-item .meta2 {
   display: flex;
-  gap: 8px;
+  flex-wrap: wrap;
+  gap: 4px 8px;
   color: var(--fg-muted);
   font-size: var(--ui-font-sm);
   margin-top: 2px;
 }
 .history-item .sha { font-family: "Monaspace Neon", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace; }
+/* Branch / tag decorations and the merge marker on a commit row. Chips
+   share the .rp-chip pill idiom; colour only, so the row height is stable. */
+/* Chips take their own line under sha / author / date so the meta row keeps
+   its width and the chips flow horizontally in the narrow panel. */
+.history-item .history-refs {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  flex-basis: 100%;
+  min-width: 0;
+}
+.history-ref {
+  display: inline-block;
+  max-width: 160px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  padding: 0 6px;
+  border: 1px solid var(--border);
+  border-radius: 999px;
+  background: var(--bg);
+  color: var(--fg-muted);
+  font-size: var(--ui-font-sm);
+  font-family: "Monaspace Neon", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
+  line-height: 16px;
+}
+.history-ref-head {
+  border-color: var(--accent);
+  background: var(--accent-subtle);
+  color: var(--accent);
+}
+.history-ref-tag {
+  border-color: color-mix(in srgb, var(--warning, #9a6700) 55%, var(--border));
+  color: var(--warning, #9a6700);
+}
+.history-ref-merge {
+  font-style: italic;
+}
+/* Rows inside a Shift+click range: tint only, the selected row keeps its
+   accent bar. */
+.history-item-in-range {
+  background: color-mix(in srgb, var(--accent-subtle) 35%, transparent);
+}
+/* Older / newer revision stepper in the file header. Same icon-button idiom
+   as the path copy button; a disabled side only fades (no size change). */
+.gdp-file-revision-nav {
+  display: inline-flex;
+  gap: 2px;
+  margin-left: 6px;
+}
+.gdp-file-revision-btn:disabled {
+  opacity: 0.35;
+  cursor: default;
+}
+.gdp-file-revision-btn:disabled:hover {
+  background: transparent;
+  color: var(--fg-muted);
+}
+#history-commit-info .hci-actions,
+.history-commit-info .hci-actions {
+  display: inline-flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 6px;
+  margin-left: auto;
+}
+#history-commit-info .hci-copy,
+.history-commit-info .hci-copy {
+  width: 26px;
+  padding: 0;
+  justify-content: center;
+}
+#history-commit-info .hci-copy.copied,
+.history-commit-info .hci-copy.copied { color: var(--success, var(--accent)); }
+#history-commit-info .hci-copy.failed,
+.history-commit-info .hci-copy.failed { color: var(--danger); }
+#history-commit-info .hci-parent[aria-pressed="true"],
+.history-commit-info .hci-parent[aria-pressed="true"] {
+  border-color: var(--accent);
+  background: var(--accent-subtle);
+  color: var(--accent);
+}
+#history-commit-info .hci-compare-label,
+.history-commit-info .hci-compare-label {
+  color: var(--fg-muted);
+  font-size: 12px;
+}
 .history-status {
   padding: 10px 14px;
   color: var(--fg-muted);
@@ -3725,6 +3831,7 @@ table.d2h-diff-table td.d2h-code-side-linenumber {
 #line-ref-pill-github-actions[hidden] {
   display: none;
 }
+#line-ref-pill-history,
 #line-ref-pill-github-open,
 #line-ref-pill-github-copy {
   display: inline-flex;
@@ -15014,6 +15121,7 @@ body.app-panel-docked .app-panel.app-panel-open {
    `web-src/test/docked-page-height.test.ts`。 */
 
 .tools-sheet,
+.search-sheet,
 .terminal-sheet {
   flex: 1 1 auto;
   min-width: 0;
@@ -15026,9 +15134,42 @@ body.app-panel-docked .app-panel.app-panel-open {
 /* パネルの中ではタブで 1 つだけ出す。閉じている側は本当に消す
    (右ドロワーの頃はスライドのために display を残していた)。 */
 .tools-sheet[hidden],
+.search-sheet[hidden],
 .terminal-sheet[hidden] {
   display: none;
 }
+/* Search results sheet: query row, palette-style controls, scrolling list. */
+.search-results-head {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex: 0 0 auto;
+  padding: 6px 10px 0;
+}
+.search-results-input {
+  flex: 1 1 auto;
+  min-width: 0;
+  height: var(--ui-control-md);
+  border: 1px solid var(--border);
+  border-radius: 8px;
+  background: var(--bg);
+  color: var(--fg);
+  font: inherit;
+  font-size: var(--ui-font-md);
+  padding: 0 10px;
+  outline: none;
+}
+.search-results-input:focus {
+  border-color: var(--accent);
+  box-shadow: 0 0 0 3px var(--accent-muted);
+}
+.search-results-controls { padding: 6px 10px 0; }
+.search-results-status { padding: 6px 10px; }
+.search-results-list {
+  flex: 1 1 auto;
+  min-height: 0;
+  overflow: auto;
+}
 
 /* ドロワー左端の掴みしろ。annotation パネルのリサイザーと同じ作り (境界を
    またぐ 8px の透明な帯) だが、ドロワーが画面の大半を覆って端が分かりにくい