cc-viewer 1.0.13 → 1.0.15

package/README.md

@@ -33,6 +33,7 @@ ccv --uninstall
 - Real-time capture of all API requests from Claude Code, including streaming responses
 - Left panel shows request method, URL, duration, and status code
 - Automatically identifies and labels Main Agent and Sub Agent requests (with sub-types: Bash, Task, Plan, General)
+- Request list auto-scrolls to the selected item (centered on mode switch, nearest on manual click)
 - Right panel supports Request / Response tab switching
 - Request Body expands `messages`, `system`, `tools` one level by default
 - Response Body fully expanded by default
@@ -60,6 +61,8 @@ Click the "Chat mode" button in the top right to parse Main Agent's full convers
 - System text auto-filtered, showing only real user input
 - Multi-session segmented display (auto-segmented after `/compact`, `/clear`, etc.)
 - Each message shows a timestamp accurate to the second, derived from API request timing
+- Each message has a "View Request" link to jump back to raw mode at the corresponding API request
+- Bidirectional mode sync: switching to chat mode scrolls to the conversation matching the selected request; switching back scrolls to the selected request
 - Settings panel: toggle default collapse state for tool results and thinking blocks
 - Global settings: toggle filtering of irrelevant requests (count_tokens, heartbeat) from the request list
 

package/dist/assets/index-B05wFUK_.css

@@ -0,0 +1 @@
+body{margin:0;background-color:#0d0d0d}*{scrollbar-width:thin;scrollbar-color:#3a3a3a #0d0d0d}*::-webkit-scrollbar{width:6px;height:6px}*::-webkit-scrollbar-track{background:#0d0d0d}*::-webkit-scrollbar-thumb{background:#3a3a3a;border-radius:3px}*::-webkit-scrollbar-thumb:hover{background:#555}.diff-view{background:#1a1a2e;border:1px solid #2a2a3e;border-radius:8px;padding:8px 12px}.diff-line-del{background:#ef444426;color:#fca5a5;padding:0 4px}.diff-line-add{background:#22c55e26;color:#86efac;padding:0 4px}.code-highlight{color:#e6edf3}.hl-keyword{color:#ff7b72}.hl-string{color:#a5d6ff}.hl-comment{color:#8b949e;font-style:italic}.hl-number{color:#79c0ff}.hl-linenum{color:#484f58;-webkit-user-select:none;user-select:none}.chat-md pre{background:#0d1117;border:1px solid #2a2a2a;border-radius:6px;padding:12px;overflow-x:auto;font-size:13px;line-height:1.5}.chat-md code{background:#1a1a2e;padding:2px 6px;border-radius:4px;font-size:13px;color:#e5e7eb}.chat-md pre code{background:none;padding:0}.chat-md p{margin:6px 0}.chat-md ul,.chat-md ol{padding-left:20px;margin:6px 0}.chat-md li{margin:2px 0}.chat-md h1,.chat-md h2,.chat-md h3{margin:12px 0 6px;color:#fff}.chat-md h1{font-size:1.3em}.chat-md h2{font-size:1.15em}.chat-md h3{font-size:1.05em}.chat-md blockquote{border-left:3px solid #3b82f6;margin:8px 0;padding:4px 12px;color:#9ca3af}.chat-md table{border-collapse:collapse;margin:8px 0;font-size:13px}.chat-md th,.chat-md td{border:1px solid #2a2a2a;padding:6px 10px}.chat-md th{background:#1a1a1a;color:#fff}.chat-md a{color:#60a5fa}.chat-md hr{border:none;border-top:1px solid #2a2a2a;margin:12px 0}.chat-md strong{color:#f1f5f9}.chat-md em{color:#cbd5e1}._headerBar_wnllt_2{display:flex;align-items:center;justify-content:space-between;width:100%;height:100%}._titleText_wnllt_11{color:#fff;font-size:18px;cursor:pointer}._titleArrow_wnllt_17{font-size:12px;margin-left:4px}._tokenStatsTag_wnllt_23{border-radius:12px;cursor:pointer;background:#2a2a2a;border:1px solid #3a3a3a;color:#ccc}._tokenStatsIcon_wnllt_31{margin-right:4px}._liveTag_wnllt_36{border-radius:12px}._liveTagText_wnllt_40{margin-left:4px}._countdownStrong_wnllt_45{font-variant-numeric:tabular-nums}._langSelector_wnllt_50,._settingsBtn_wnllt_61{color:#888;font-size:12px;cursor:pointer;-webkit-user-select:none;user-select:none;border:1px solid #555;border-radius:4px;padding:2px 8px}._settingsBtn_wnllt_61:hover{color:#bbb;border-color:#777}._settingsItem_wnllt_77{display:flex;justify-content:space-between;align-items:center;padding:12px 0}._settingsLabel_wnllt_84{font-size:14px}._tokenStatsEmpty_wnllt_89{padding:8px 4px;color:#999;font-size:13px}._tokenStatsContainer_wnllt_96{min-width:240px}._modelCard_wnllt_101{border:1px solid #333;border-radius:6px;padding:8px 10px}._modelCardSpaced_wnllt_107{margin-bottom:10px}._modelName_wnllt_113{font-size:13px;font-weight:600;color:#e5e5e5;margin-bottom:8px;padding-bottom:4px;border-bottom:1px solid #333}._statsTable_wnllt_123{width:100%;border-collapse:collapse}._th_wnllt_128{padding:2px 12px;font-size:12px;font-family:monospace;white-space:nowrap;color:#888;font-weight:400;text-align:right}._td_wnllt_138{padding:2px 12px;font-size:12px;font-family:monospace;white-space:nowrap;color:#e5e5e5;text-align:right}._label_wnllt_147{padding:2px 12px;font-size:12px;font-family:monospace;white-space:nowrap;color:#aaa;font-weight:400;text-align:left}._rowBorder_wnllt_157{border-bottom:1px solid #2a2a2a}._promptExportBar_wnllt_162{margin-bottom:12px}._promptScrollArea_wnllt_166{max-height:500px;overflow:auto}._promptEmpty_wnllt_171{color:#999;padding:12px}._promptTimestamp_wnllt_177{color:#666;font-size:12px;margin:12px 0 4px;padding-bottom:6px}._textPromptCard_wnllt_185{margin:4px 0;background:#141414;border-radius:6px;border:1px solid #303030;padding:10px 14px}._preText_wnllt_194{white-space:pre-wrap;word-break:break-word;font-size:13px;line-height:1.6;color:#d9d9d9;margin:4px 0}._systemCollapse_wnllt_204{margin:4px 0;background:#1a1a1a;border:1px solid #303030;border-radius:6px}._systemLabel_wnllt_211{color:#888;font-size:12px}._preSys_wnllt_216{white-space:pre-wrap;word-break:break-word;font-size:12px;line-height:1.5;color:#999;margin:0}._centerEmpty_1cxb0_1{display:flex;align-items:center;justify-content:center;height:100%}._scrollContainer_1cxb0_8{overflow:auto;height:100%}._listItem_1cxb0_13{cursor:pointer;padding:8px 12px;border-left:3px solid transparent;border-bottom:1px solid #1f1f1f;transition:background .15s}._listItem_1cxb0_13:hover{background:#151515}._listItemActive_1cxb0_25{background:#1a2332;border-left-color:#3b82f6}._listItemActive_1cxb0_25:hover{background:#1a2332}._itemContent_1cxb0_34{width:100%;min-width:0}._itemHeader_1cxb0_39{display:flex;align-items:center;gap:6px;margin-bottom:4px;font-size:12px}._tagNoMargin_1cxb0_47{margin:0;font-size:12px}._modelName_1cxb0_52{font-size:12px}._time_1cxb0_56{font-size:12px;color:#6b7280;margin-left:auto}._detailRow_1cxb0_62{display:flex;gap:8px;font-size:12px;align-items:center}._urlText_1cxb0_69{color:#555;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}._duration_1cxb0_78{color:#6b7280;flex-shrink:0}._statusOk_1cxb0_83{color:#10b981;flex-shrink:0}._statusErr_1cxb0_88{color:#ef4444;flex-shrink:0}._statusDefault_1cxb0_93{color:#9ca3af;flex-shrink:0}._usageBox_1cxb0_98{background:#111;border-radius:4px;padding:3px 6px;margin-top:4px;font-size:12px;color:#6b7280;line-height:1.6}._cacheDot_1cxb0_108{display:inline-block;width:6px;height:6px;border-radius:50%;margin:0 3px;vertical-align:middle}._cacheDotLoss_1cxb0_117{background-color:#8b1a1a;cursor:help}._cacheDotNormal_1cxb0_122{background-color:#3a3a3a}._GzYRV{line-height:1.2;white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word}._3eOF8{margin-right:5px;font-weight:700}._3eOF8+._3eOF8{margin-left:-5px}._1MFti{cursor:pointer}._f10Tu{font-size:1.2em;margin-right:5px;-webkit-user-select:none;-moz-user-select:none;user-select:none}._1UmXx:after{content:"▸"}._1LId0:after{content:"▾"}._1pNG9{margin-right:5px}._1pNG9:after{content:"...";font-size:.8em}._2IvMF{background:#eee}._2bkNM{margin:0;padding:0 10px}._1BXBN{margin:0;padding:0}._1MGIk{font-weight:600;margin-right:5px;color:#000}._3uHL6{color:#000}._2T6PJ,._1Gho6{color:#df113a}._vGjyY{color:#2a3f3c}._1bQdo{color:#0b75f5}._3zQKs{color:#469038}._1xvuR{color:#43413d}._oLqym,._2AXVT,._2KJWg{color:#000}._11RoI{background:#002b36}._17H2C,._3QHg2,._3fDAz{color:#fdf6e3}._2bSDX{font-weight:bolder;margin-right:5px;color:#fdf6e3}._gsbQL{color:#fdf6e3}._LaAZe,._GTKgm{color:#81b5ac}._Chy1W{color:#cb4b16}._2bveF{color:#d33682}._2vRm-{color:#ae81ff}._1prJR{color:#268bd2}._container_1h2lr_1{background:#0d1117;border-radius:6px;border:1px solid #2a2a2a;padding:12px;font-size:13px;font-family:monospace;overflow:auto}._container_1iit6_1{height:100%;overflow:auto;padding:0 16px}._emptyState_1iit6_7{display:flex;align-items:center;justify-content:center;height:100%}._urlSection_1iit6_14{padding:12px 0;border-bottom:1px solid #1f1f1f;display:flex;align-items:flex-start}._urlLeft_1iit6_21{flex:1;min-width:0}._tokenStatsBox_1iit6_26{flex-shrink:0;padding-left:12px;display:flex;align-items:center}._tokenGrid_1iit6_33{display:flex;border:1px solid #303030;border-radius:6px;overflow:hidden;min-width:360px;font-size:11px;line-height:1.6}._tokenRows_1iit6_43{flex:1}._tokenRow_1iit6_43{display:flex}._tokenRowBorder_1iit6_51{border-top:1px solid #303030}._tokenLabel_1iit6_55{color:#888;padding:4px 8px;white-space:nowrap;font-weight:600}._tokenTd_1iit6_62{flex:1;color:#d1d5db;text-align:right;padding:4px 8px;font-family:monospace;white-space:nowrap}._tokenHitRate_1iit6_71{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#d1d5db;padding:4px 8px;font-family:monospace;white-space:nowrap;border-left:1px solid #303030;min-width:100px}._tokenHitRateLabel_1iit6_84{color:#888;font-size:10px;font-family:sans-serif}._tokenRowBorder_1iit6_51 td{border-top:1px solid #303030}._urlText_1iit6_94{color:#d1d5db;font-size:13px;margin-bottom:8px;word-break:break-all}._metaText_1iit6_101,._headersContainer_1iit6_105{font-size:12px}._headerRow_1iit6_109{display:flex;padding:4px 0;border-bottom:1px solid #1f1f1f}._headerKey_1iit6_115{min-width:200px;flex-shrink:0}._headerValue_1iit6_120{word-break:break-all;margin-left:8px}._streamingBox_1iit6_125{padding:20px;background:#1a1a1a;border-radius:6px;border:1px solid #2a2a2a}._bodyToolbar_1iit6_132{display:flex;gap:8px;margin-bottom:8px}._rawTextPre_1iit6_138{background:#0d1117;border:1px solid #2a2a2a;border-radius:6px;padding:12px;font-size:12px;color:#e5e7eb;overflow:auto;max-height:600px;white-space:pre-wrap;word-break:break-all}._tabContent_1iit6_151{padding:12px 0}._collapseSpacing_1iit6_155{margin-bottom:16px}._bodyLabel_1iit6_159{margin:0}._bodyHeader_1iit6_163{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}._diffSection_1iit6_170{margin-bottom:16px}._diffToggle_1iit6_174{display:inline-block;margin-bottom:8px;cursor:pointer}._diffIcon_1iit6_180{font-size:12px;margin-left:4px}._wrapper_1o255_1{margin:6px 0}._header_1o255_5{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}._filePath_1o255_12{color:#a78bfa;font-size:12px;font-weight:600}._toggle_1o255_18{color:#6b7280;font-size:11px;cursor:pointer;-webkit-user-select:none;user-select:none}._code_1o255_25{margin:0;font-size:12px;line-height:1.5;overflow:auto}._plainResult_1uh60_1{background:#111;border-radius:6px;font-size:12px}._plainTitle_1uh60_7{font-size:11px}._plainPre_1uh60_11{color:#d1d5db;margin:0;white-space:pre-wrap;word-break:break-all;font-size:12px;padding:8px 12px}._codeResult_1uh60_20{background:#0d1117;border-radius:6px;border:1px solid #1e2a3a;overflow:hidden}._codeHeader_1uh60_27{display:flex;justify-content:space-between;align-items:center;padding:4px 10px;background:#161b22;border-bottom:1px solid #1e2a3a}._codeTitle_1uh60_36{font-size:11px;color:#8b949e}._codeToggle_1uh60_41{font-size:11px;color:#484f58;cursor:pointer;-webkit-user-select:none;user-select:none}._codePre_1uh60_48{margin:0;padding:8px 12px;font-size:12px;line-height:1.5;overflow:auto;max-height:500px}._markdownBody_1uh60_57{padding:8px 12px;font-size:13px;line-height:1.6;overflow:auto;max-height:500px}._tag_17wfp_1{display:inline-block;font-size:10px;color:#6b7280;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:3px;padding:0 4px;margin-left:6px;cursor:pointer;line-height:18px;vertical-align:middle;transition:color .2s,border-color .2s;-webkit-user-select:none;user-select:none}._tag_17wfp_1:hover{color:#93c5fd;border-color:#93c5fd4d}._tagActive_17wfp_22{color:#93c5fd;border-color:#93c5fd40}._tagLoading_17wfp_27{cursor:wait;opacity:.7}._spinner_17wfp_32{display:inline-block;width:10px;height:10px;border:1.5px solid rgba(147,197,253,.3);border-top-color:#93c5fd;border-radius:50%;animation:_spin_17wfp_32 .6s linear infinite;margin-right:3px;vertical-align:middle}@keyframes _spin_17wfp_32{to{transform:rotate(360deg)}}._avatar_1xxv7_3{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}._avatarImg_1xxv7_13{width:32px;height:32px;border-radius:50%;flex-shrink:0;object-fit:cover}._bubble_1xxv7_21{border-radius:8px;padding:10px 14px;max-width:100%;font-size:14px;line-height:1.6;word-break:break-word}._messageRow_1xxv7_32{display:flex;gap:10px;padding:8px 0}._messageRowEnd_1xxv7_38{display:flex;gap:10px;padding:8px 0;justify-content:flex-end}._contentCol_1xxv7_47{min-width:0;flex:1}._contentColLimited_1xxv7_52{min-width:0;max-width:80%;width:fit-content}._labelRow_1xxv7_60{display:flex;justify-content:space-between;align-items:center;margin-bottom:2px}._labelRight_1xxv7_67{display:flex;align-items:center;gap:4px;flex-shrink:0;margin-left:auto}._labelText_1xxv7_75{font-size:11px}._timeText_1xxv7_79,._timeTextNoMargin_1xxv7_85{font-size:10px;color:#6b7280;flex-shrink:0}._labelTextRight_1xxv7_91{font-size:11px;margin-left:auto}._bubbleUser_1xxv7_98{background:#1668dc;color:#e5e7eb}._bubbleAssistant_1xxv7_104{background:#141414;color:#e5e7eb}._bubblePlan_1xxv7_110{background:#141428;border:5px solid #1668dc;font-size:12px;color:#e5e7eb}._bubbleSubAgent_1xxv7_118{background:#1a1a2e;color:#e5e7eb}._bubbleSelection_1xxv7_124{background:#1a3a1a;color:#e5e7eb}._systemTagLabel_1xxv7_132{font-size:12px}._skillLabel_1xxv7_136{font-size:12px;color:#a78bfa}._systemTagPre_1xxv7_141{font-size:12px;color:#9ca3af;white-space:pre-wrap;word-break:break-all;margin:0}._collapseMargin_1xxv7_149{margin:4px 0}._collapseNoMargin_1xxv7_153{margin:0}._thinkingLabel_1xxv7_159{font-size:12px}._toolBox_1xxv7_165{background:#1a1a2e;border:1px solid #2a2a3e;border-radius:8px;padding:8px 12px;margin:6px 0;font-size:12px}._toolLabel_1xxv7_174{color:#a78bfa}._codePre_1xxv7_180{font-size:12px;margin:4px 0 0;white-space:pre-wrap;word-break:break-all;background:#0d1117;border-radius:4px;padding:6px 8px}._pathTag_1xxv7_192{color:#7dd3fc;font-size:11px}._descSpan_1xxv7_199{color:#6b7280;font-weight:400}._secondarySpan_1xxv7_204{color:#6b7280}._patternSpan_1xxv7_208{color:#fbbf24}._kvContainer_1xxv7_214{margin-top:4px;font-size:11px}._kvItem_1xxv7_219{margin:2px 0}._kvKey_1xxv7_223{color:#7dd3fc}._kvValue_1xxv7_227{color:#9ca3af}._toolResult_1xxv7_233{background:#111827;border:1px solid #1e293b;border-radius:6px;padding:6px 10px;margin:2px 0 6px;font-size:11px}._toolResultLabel_1xxv7_242{font-size:11px}._compactLabel_1xxv7_248{font-size:12px;color:#93c5fd}._compactPre_1xxv7_253{font-size:12px;color:#d1d5db;white-space:pre-wrap;word-break:break-all;margin:0}._viewRequestBtn_1xxv7_263{font-size:10px;color:#555;cursor:pointer;margin-left:6px;flex-shrink:0}._viewRequestBtn_1xxv7_263:hover{color:#93c5fd}._optionList_1xxv7_277{padding-left:8px}._optionDesc_1xxv7_281{color:#555;margin-left:6px;font-weight:400}._questionText_1xxv7_289{font-size:13px;color:#ccc;margin-bottom:4px}._questionSpacing_1xxv7_295{margin-bottom:10px}._option_1xxv7_277{font-size:12px;padding:1px 0}._centerEmpty_1j3v3_1{display:flex;align-items:center;justify-content:center;height:100%}._container_1j3v3_8{height:100%;overflow:auto;padding:16px 24px;display:flex;flex-direction:column}._sessionDividerText_1j3v3_16{font-size:11px;color:#555}._lastResponseLabel_1j3v3_21{font-size:11px}._resizer_yamj2_1{width:6px;cursor:col-resize;background:#1f1f1f;flex-shrink:0;transition:background .2s}._resizer_yamj2_1:hover{background:#3b82f6}._layout_lzqdt_1{height:100vh;overflow:hidden}._header_lzqdt_6{background:#111;border-bottom:1px solid #1f1f1f;padding:0 24px;height:60px;line-height:60px}._content_lzqdt_14{flex:1;overflow:hidden}._mainContainer_lzqdt_19{display:flex;height:100%}._leftPanel_lzqdt_24{flex-shrink:0;border-right:1px solid #1f1f1f;display:flex;flex-direction:column;background:#0a0a0a}._leftPanelHeader_lzqdt_32{padding:10px 16px;border-bottom:1px solid #1f1f1f;font-size:13px;color:#9ca3af;font-weight:500;display:flex;justify-content:space-between;align-items:center}._leftPanelCount_lzqdt_43{font-size:12px;color:#555;font-weight:400}._leftPanelBody_lzqdt_49{flex:1;overflow:hidden}._rightPanel_lzqdt_54{flex:1;overflow:hidden;background:#0d0d0d}._modalActions_lzqdt_60{margin-bottom:12px}._spinCenter_lzqdt_64{text-align:center;padding:40px}._emptyCenter_lzqdt_69{text-align:center;color:#999;padding:40px}._logListItem_lzqdt_75{cursor:pointer;padding:8px 12px}._logItemRow_lzqdt_80{display:flex;align-items:center;width:100%;justify-content:space-between}._logFileIcon_lzqdt_87{margin-right:8px;color:#3b82f6}._folderIcon_lzqdt_92{margin-right:8px}._logTag_lzqdt_96{margin-left:8px}._loadingOverlay_lzqdt_100{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000bf;display:flex;align-items:center;justify-content:center;z-index:9999}._loadingText_lzqdt_113{color:#fff;font-size:16px;font-weight:700}._footer_lzqdt_119{height:18px;background:#000;display:flex;align-items:center;justify-content:flex-end;padding:0 12px;flex-shrink:0}._footerRight_lzqdt_129{display:flex;align-items:center;gap:6px;font-size:11px;color:#555}._footerLink_lzqdt_137{display:inline-flex;align-items:center;gap:3px;color:#555;text-decoration:none}._footerLink_lzqdt_137:hover{color:#888}._footerIcon_lzqdt_149{width:12px;height:12px}._footerDivider_lzqdt_154{color:#333}._footerText_lzqdt_158{color:#555}