@weibaohui/context-razor 0.3.0 → 0.4.1

package/README.md

@@ -10,9 +10,11 @@
 ## 核心功能
 
 - **逐条列出**：当前会话模型可见的每条上下文（用户/助手/工具结果）按序排列，带预览、字符数与 ≈token 估算，点 ⋯ 查看全文与真实 usage
+- **占比标注**：每条的 token 徽章同时显示其占全部上下文的百分比（如 `≈5728 · 15%`），一眼看出谁是上下文大头
+- **类型筛选**：按类型一键过滤——用户 / 注入 / 助手，以及各工具名（bash、skill、read、edit…按会话实际出现的动态生成）。多选 toggle，与 token 量级筛选正交叠加
 - **超阈值标红**：可调阈值（默认 500 token，本地记忆），超限条目红色高亮；「只看超阈值」过滤 + 「token 高→低」排序，大头一眼可见
-- **精确裁剪**：勾选任意条目一键删除——连续段自动合并处理。删除走宿主 surface replace 协议（与官方 compaction 同款机制），**不经 LLM 总结**，删了什么、删了多少完全由你决定
-- **不重排**：本插件不会改变上下文条目顺序，只会剔除选中条目；排序下拉仅影响页面显示（上下文顺序 / 原始序号 / token 高→低），模型可见顺序始终由会话 surface 决定
+- **精确裁剪**：勾选任意条目一键删除——连续段自动合并处理。删除走宿主 surface replace 协议（与官方 compaction 同款机制），**不经 LLM 总结**，删了什么、删了多少完全由你决定。每行尾部带 ✕ 快捷按钮，**单条直接删**与勾选后**多选批量删**走同一确认弹窗
+- **不重排**：本插件不会改变上下文条目顺序，只会剔除选中条目；「token 高→低」排序仅影响页面显示，模型可见顺序始终由会话 surface 决定
 - **安全护栏**：会话运行中禁止裁剪（等当前回合结束）；每次替换附带一条 notice 标记消息，模型知道这段历史被你移除了，需要时会主动向你确认
 - **非破坏**：append-only 日志保留全部痕迹（宿主机制如此）。「删除」= 从模型视野与界面投影中移除
 

package/client/bundle.js

@@ -64,9 +64,10 @@ window.__ModuleLoader__.load({
       busyTag: '运行中',
       sortLabel: '排序',
       sortOrder: '上下文顺序',
-      sortSeq: '原始序号',
       sortTokens: 'token 高→低',
       orderNote: '本插件不会改变上下文条目顺序，只会剔除选中条目。',
+      legendTitle: '按 token 量级筛选（点选高亮某一档）',
+      kindFilterLabel: '类型',
       selectVisible: '选中可见',
       selectVisibleHint: '选中当前显示的全部条目（配合色块筛选）',
       clearSelect: '清空选择',
@@ -88,6 +89,8 @@ window.__ModuleLoader__.load({
       deleteTitle: '确认裁剪',
       deleteConfirm: '即将把 {n} 条消息（约 {tokens} token）从模型视野中移除，替换为一条标记消息。日志中保留痕迹，此操作不可恢复。继续？',
       deleteBusyHint: '会话正在运行，等当前回合结束后再裁剪',
+      deleteOne: '删除此条',
+      deleteOneHint: '删除此条（约 {tokens} token）',
       deleteOk: '执行',
       cancel: '取消',
       deletedToast: '已删除 {n} 条（约 {tokens} token）',
@@ -103,9 +106,10 @@ window.__ModuleLoader__.load({
       busyTag: 'running',
       sortLabel: 'Sort',
       sortOrder: 'Context order',
-      sortSeq: 'Original seq',
       sortTokens: 'tokens high→low',
       orderNote: 'This plugin never reorders context entries; it only removes the selected ones.',
+      legendTitle: 'Filter by token tier (click to isolate a band)',
+      kindFilterLabel: 'Type',
       selectVisible: 'Select shown',
       selectVisibleHint: 'Select every currently shown entry (pairs with tier filters)',
       clearSelect: 'Clear selection',
@@ -127,6 +131,8 @@ window.__ModuleLoader__.load({
       deleteTitle: 'Confirm trim',
       deleteConfirm: 'About to remove {n} messages (≈{tokens} tokens) from the model view, replaced by one marker message. Traces stay in the log; this cannot be undone. Continue?',
       deleteBusyHint: 'Session is running — trim after the current turn finishes',
+      deleteOne: 'Delete this entry',
+      deleteOneHint: 'Delete this entry (≈{tokens} tokens)',
       deleteOk: 'Delete',
       cancel: 'Cancel',
       deletedToast: 'Deleted {n} entries (≈{tokens} tokens)',
@@ -141,9 +147,10 @@ window.__ModuleLoader__.load({
 
     const kindI18n = (key) => 'kind' + key[0].toUpperCase() + key.slice(1)
 
-    /** 排序：order = 投影原序（模型可见序）；seq = 原始序号升序（裁剪过的会话里与 order 不同：标记消息 seq 大但在中间）；tokens = 降序（并列按 seq，缺 token 沉底）。 */
+    /** 排序：order = 投影原序（模型可见序）；tokens = 降序（并列按 seq，缺 token 沉底）。
+     *  只有两档且都是显示层——裁剪过的会话里 seq 升序 ≠ 模型可见序（replace 标记 seq 大但位置在中间），
+     *  与「本页展示模型可见上下文」相悖，故不提供 seq 档。 */
     function sortEntries(entries, sortBy) {
-      if (sortBy === 'seq') return [...entries].sort((a, b) => a.seq - b.seq)
       if (sortBy !== 'tokens') return entries
       return [...entries].sort((a, b) => {
         const va = a.tokens, vb = b.tokens
@@ -175,6 +182,38 @@ window.__ModuleLoader__.load({
       return { kind: entry.kind, label: t(kindI18n(entry.kind)) }
     }
 
+    /**
+     * 筛选用稳定分类键，与 entryChip 的可见口径一致：
+     *   tool  → 'tool:<工具名>'（无工具名则 'tool:'，按钮文案退回「工具」）
+     *   user 注入 → 'injected'（sourceKind !== 'user' 的 user 消息，统一一档；
+     *     细分来源在 chip 的 title 与详情里已可见，筛选层不再切分，避免按钮爆炸）
+     *   user / assistant → 自身
+     * 「按钮文案」与 chip 同源（categoryLabel），用户在两处看到的是同一个词。
+     */
+    function entryCategory(entry) {
+      if (entry.kind === 'tool') return 'tool:' + (typeof entry.tool === 'string' ? entry.tool : '')
+      if (entry.kind === 'user' && entry.sourceKind && entry.sourceKind !== 'user') return 'injected'
+      return entry.kind
+    }
+    function categoryLabel(cat, t) {
+      if (cat === 'user') return t('kindUser')
+      if (cat === 'assistant') return t('kindAssistant')
+      if (cat === 'injected') return t('kindInjected')
+      if (cat.lastIndexOf('tool:', 0) === 0) {
+        const name = cat.slice(5)
+        return name || t('kindTool')
+      }
+      return cat
+    }
+
+    /** 该条 token 占全部上下文的百分比文案；total 非正或 part 为 0 返回 null（不显示）。 */
+    function pctOf(part, total) {
+      if (!total || !part) return null
+      const p = part / total * 100
+      if (p < 0.1) return '<0.1%'
+      return (p >= 10 ? p.toFixed(0) : p.toFixed(1)) + '%'
+    }
+
     // ── 彩虹分级：颜色越暖 = 占用越多 ────────────────────────────────────────
     // 固定对数档位（相邻约 ×2.5），跨会话语义稳定：绿→黄绿→黄→橙→红→品红。
     // 档位是「这条消息吃掉多少典型上下文预算」的粗标尺，不随会话内最大值缩放。
@@ -225,6 +264,13 @@ window.__ModuleLoader__.load({
     .rz-swatch.tier-3{background:hsl(32,80%,45%)}
     .rz-swatch.tier-4{background:hsl(8,75%,48%)}
     .rz-swatch.tier-5{background:hsl(320,65%,50%)}
+    .rz-kindsbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
+    .rz-kinds{display:inline-flex;gap:4px;align-items:center;flex-wrap:wrap}
+    .rz-kinds.filtering .rz-kindbtn:not(.on){opacity:.45}
+    .rz-kindbtn{display:inline-flex;align-items:center;gap:5px;padding:2px 10px;border-radius:999px;border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-secondary);font-size:11.5px;cursor:pointer;font-family:var(--dsw-font-family);white-space:nowrap}
+    .rz-kindbtn:hover{border-color:var(--dsw-alias-border-l3);background:var(--dsw-alias-interactive-bg-hover)}
+    .rz-kindbtn.on{color:var(--dsw-alias-state-business-primary);border-color:var(--dsw-alias-state-business-primary);font-weight:600}
+    .rz-kindcount{font-size:10px;opacity:.7}
     .rz-list{display:flex;flex-direction:column;gap:6px}
     .rz-row{display:flex;gap:10px;align-items:center;padding:8px 12px;border-radius:10px;border:1px solid var(--dsw-alias-border-l1);border-left:3px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-1);cursor:pointer;text-align:left;width:100%}
     .rz-row:hover{background:var(--dsw-alias-interactive-bg-hover)}
@@ -232,6 +278,9 @@ window.__ModuleLoader__.load({
     .rz-row-preview{flex:0 1 340px;min-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--dsw-alias-label-primary);font-size:13px;text-decoration:none}
     .rz-row-preview:hover{text-decoration:underline;text-underline-offset:3px}
     .rz-row-meta{color:var(--dsw-alias-label-tertiary);font-size:11px;flex:none}
+    .rz-row-del{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin-left:4px;border-radius:6px;border:1px solid transparent;background:transparent;color:var(--dsw-alias-label-tertiary);font-size:13px;line-height:1;cursor:pointer;flex:none}
+    .rz-row-del:hover:not(:disabled){color:var(--dsw-alias-state-error-primary);border-color:var(--dsw-alias-state-error-primary);background:hsla(0,75%,50%,.08)}
+    .rz-row-del:disabled{opacity:.35;cursor:not-allowed}
     .rz-badge.tier-0{color:hsl(120,55%,40%);border-color:hsla(120,55%,40%,.45);background:hsla(120,55%,40%,.10)}
     .rz-badge.tier-1{color:hsl(90,60%,38%);border-color:hsla(90,60%,38%,.45);background:hsla(90,60%,38%,.10)}
     .rz-badge.tier-2{color:hsl(60,70%,36%);border-color:hsla(60,70%,36%,.45);background:hsla(60,70%,36%,.12)}
@@ -264,10 +313,12 @@ window.__ModuleLoader__.load({
 
     const Chip = ({ kind, label, title }) => h('span', { className: 'rz-chip ' + kind, title }, label)
 
-    const TokenBadge = ({ entry }) => {
+    const TokenBadge = ({ entry, total }) => {
       const tier = tierOf(entry)
-      return h('span', { className: 'rz-badge tier-' + tier, title: RAZOR_TIERS[tier].label + ' token' },
-        '≈' + formatNum(entry.tokens))
+      const pct = pctOf(entry.tokens, total)
+      const title = RAZOR_TIERS[tier].label + ' token' + (pct ? ' · ' + pct + ' ' + (total ? 'of ≈' + formatNum(total) + ' token' : 'of context') : '')
+      return h('span', { className: 'rz-badge tier-' + tier, title },
+        '≈' + formatNum(entry.tokens) + (pct ? ' · ' + pct : ''))
     }
 
     /** 分页列表：先渲染 pageSize 行，按需增长（大会话一次挂几千行会卡）。 */
@@ -282,14 +333,14 @@ window.__ModuleLoader__.load({
     }
 
     /** 单条全文弹窗（正文经 /entry 异步补全）。 */
-    function DetailModal({ detail, t, onClose }) {
+    function DetailModal({ detail, t, total, onClose }) {
       if (!detail) return null
       return h('div', { className: 'rz-dlg-backdrop', onClick: onClose },
         h('div', { className: 'rz-dlg', onClick: e => e.stopPropagation() },
           h('h3', null, t('detailTitle') + ' · ' + t('seqLabel', { seq: detail.seq })),
           h('div', { className: 'rz-stats', style: { marginBottom: 10 } },
             h(Chip, { ...entryChip(detail, t) }),
-            h(TokenBadge, { entry: detail }),
+            h(TokenBadge, { entry: detail, total }),
             h('span', { className: 'rz-label', title: 'seq ' + detail.seq }, formatDateTime(detail.time)),
             h('span', { className: 'rz-label' }, t('detailChars', { chars: formatNum(detail.chars) })),
             detail.usage && h('span', { className: 'rz-label' }, t('detailUsage', {
@@ -320,10 +371,11 @@ window.__ModuleLoader__.load({
       const [ctxLoading, setCtxLoading] = useState(false)
       const [error, setError] = useState(null)
       const [tierFilter, setTierFilter] = useState(() => new Set())
+      const [kindFilter, setKindFilter] = useState(() => new Set())
       const [sortBy, setSortBy] = useState('order')
       const [selected, setSelected] = useState(() => new Set())
       const [detail, setDetail] = useState(null)
-      const [confirming, setConfirming] = useState(false)
+      const [confirming, setConfirming] = useState(null) // null | number[] 待裁剪 seqs（单条/多选同源）
       const [deleting, setDeleting] = useState(false)
       const [toast, setToast] = useState(null)
       const sessionRef = useRef('')
@@ -354,16 +406,34 @@ window.__ModuleLoader__.load({
         if (!context) return []
         let rows = context.entries
         if (tierFilter.size > 0) rows = rows.filter(e => tierFilter.has(tierOf(e)))
+        if (kindFilter.size > 0) rows = rows.filter(e => kindFilter.has(entryCategory(e)))
         return sortEntries(rows, sortBy)
-      }, [context, tierFilter, sortBy])
+      }, [context, tierFilter, kindFilter, sortBy])
 
-      const selectedTokens = useMemo(() => {
-        if (!context) return 0
-        const bySeq = new Map(context.entries.map(e => [e.seq, e]))
+      // 当前上下文里实际出现的分类（cat/count/tokens），按条数降序——决定渲染哪些按钮。
+      const categories = useMemo(() => {
+        if (!context) return []
+        const seen = new Map()
+        for (const e of context.entries) {
+          const c = entryCategory(e)
+          const prev = seen.get(c) || { count: 0, tokens: 0 }
+          prev.count += 1
+          prev.tokens += (e.tokens || 0)
+          seen.set(c, prev)
+        }
+        return [...seen.entries()]
+          .map(([cat, v]) => ({ cat, count: v.count, tokens: v.tokens }))
+          .sort((a, b) => b.count - a.count || b.tokens - a.tokens)
+      }, [context])
+
+      const entriesBySeq = useMemo(() => context ? new Map(context.entries.map(e => [e.seq, e])) : null, [context])
+      const sumSeqs = (seqs) => {
         let sum = 0
-        for (const seq of selected) { const e = bySeq.get(seq); if (e) sum += e.tokens }
+        if (entriesBySeq) for (const seq of seqs) { const e = entriesBySeq.get(seq); if (e) sum += e.tokens || 0 }
         return sum
-      }, [context, selected])
+      }
+      const selectedTokens = useMemo(() => sumSeqs(selected), [selected, entriesBySeq])
+      const confirmTokens = useMemo(() => confirming ? sumSeqs(confirming) : 0, [confirming, entriesBySeq])
 
       const toggleRow = (seq) => setSelected(prev => {
         const next = new Set(prev)
@@ -377,6 +447,12 @@ window.__ModuleLoader__.load({
         else next.add(i)
         return next
       })
+      const toggleKind = (cat) => setKindFilter(prev => {
+        const next = new Set(prev)
+        if (next.has(cat)) next.delete(cat)
+        else next.add(cat)
+        return next
+      })
       const selectVisible = () => setSelected(new Set(visible.map(e => e.seq)))
 
       const openDetail = (entry) => {
@@ -387,17 +463,18 @@ window.__ModuleLoader__.load({
       }
 
       const doDelete = async () => {
+        if (!confirming || confirming.length === 0) return
         setDeleting(true)
         try {
-          const r = await fetch(API + '/delete', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ session: sessionId, seqs: [...selected] }) })
+          const r = await fetch(API + '/delete', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ session: sessionId, seqs: confirming }) })
           const d = await r.json().catch(() => ({}))
           if (!r.ok) throw new Error(d.error || 'HTTP ' + r.status)
-          setConfirming(false)
+          setConfirming(null)
           setSelected(new Set())
           showToast(t('deletedToast', { n: d.removed, tokens: formatNum(d.tokensRemoved) }))
           refreshAll()
         } catch (e) {
-          setConfirming(false)
+          setConfirming(null)
           setError(e.message)
         } finally { setDeleting(false) }
       }
@@ -421,9 +498,21 @@ window.__ModuleLoader__.load({
               t('selectVisible') + (visible.length ? ` (${visible.length})` : '')),
             h('select', { className: 'rz-select', value: sortBy, onChange: e => setSortBy(e.target.value), title: t('sortLabel'), 'aria-label': t('sortLabel') },
               h('option', { value: 'order' }, t('sortOrder')),
-              h('option', { value: 'seq' }, t('sortSeq')),
               h('option', { value: 'tokens' }, t('sortTokens'))),
             h('button', { className: 'rz-btn', onClick: refreshAll, title: t('refresh') }, t('refresh'))),
+          // 类型筛选：与 chip 同口径的可点选按钮（user/injected/assistant/tool:<名>），
+          // 多选 toggle，与 tier 量级筛选正交叠加。按钮带条数；hover 看 token 占比。
+          categories.length > 0 && h('div', { key: 'kinds', className: 'rz-kindsbar' },
+            h('span', { className: 'rz-label' }, t('kindFilterLabel')),
+            h('span', { className: 'rz-kinds' + (kindFilter.size > 0 ? ' filtering' : '') },
+              categories.map(({ cat, count, tokens }) =>
+                h('button', { key: cat,
+                  className: 'rz-kindbtn' + (kindFilter.has(cat) ? ' on' : ''),
+                  title: categoryLabel(cat, t) + ' · ' + count + ' 条 · ≈' + formatNum(tokens) + ' token'
+                    + (context.totalTokens ? '（' + (pctOf(tokens, context.totalTokens) || '0%') + '）' : ''),
+                  onClick: () => toggleKind(cat) },
+                  categoryLabel(cat, t),
+                  h('span', { className: 'rz-kindcount' }, count))))),
           selected.size > 0 && h('div', { key: 'sel', className: 'rz-stats' },
             h('span', null, t('selectedStats', { n: selected.size, tokens: formatNum(selectedTokens) })),
             h('span', { className: 'rz-spacer' }),
@@ -431,7 +520,7 @@ window.__ModuleLoader__.load({
               h('button', { className: 'rz-btn', onClick: () => setSelected(new Set()) }, t('clearSelect')),
               h('button', { className: 'rz-btn rz-btn-danger', disabled: !canDelete,
                 title: busy ? t('deleteBusyHint') : undefined,
-                onClick: () => setConfirming(true) },
+                onClick: () => setConfirming([...selected]) },
                 t('deleteSelected') + ` (${selected.size})`))),
           visible.length === 0
             ? h('div', { key: 'empty', className: 'rz-empty' }, t('emptyContext'))
@@ -442,15 +531,19 @@ window.__ModuleLoader__.load({
                       role: 'button', tabIndex: 0, onClick: () => toggleRow(entry.seq),
                       onKeyDown: e => e.key === 'Enter' && toggleRow(entry.seq) },
                     h('input', { type: 'checkbox', checked: selected.has(entry.seq), onClick: e => e.stopPropagation(), onChange: () => toggleRow(entry.seq) }),
-                    h(TokenBadge, { entry }),
+                    h(TokenBadge, { entry, total: context.totalTokens }),
                     h(Chip, { ...entryChip(entry, t) }),
                     h('span', { className: 'rz-row-preview', title: entry.preview,
                         onClick: e => { e.stopPropagation(); openDetail(entry) } }, entry.preview || ' '),
-                    h('span', { className: 'rz-row-meta', title: 'seq ' + entry.seq }, formatDateTime(entry.time)))
+                    h('span', { className: 'rz-row-meta', title: 'seq ' + entry.seq }, formatDateTime(entry.time)),
+                    h('button', { className: 'rz-row-del', type: 'button', disabled: busy,
+                        title: busy ? t('deleteBusyHint') : t('deleteOneHint', { tokens: formatNum(entry.tokens) }),
+                        'aria-label': t('deleteOne'),
+                        onClick: e => { e.stopPropagation(); if (!busy) setConfirming([entry.seq]) } }, '✕'))
                 } })),
-          detail && h(DetailModal, { detail, t, onClose: () => setDetail(null) }),
-          confirming && h(ConfirmDialog, { n: selected.size, tokens: formatNum(selectedTokens), deleting, t,
-            onCancel: () => setConfirming(false), onOk: doDelete }),
+          detail && h(DetailModal, { detail, t, total: context.totalTokens, onClose: () => setDetail(null) }),
+          confirming && confirming.length > 0 && h(ConfirmDialog, { n: confirming.length, tokens: formatNum(confirmTokens), deleting, t,
+            onCancel: () => setConfirming(null), onOk: doDelete }),
         ],
         toast && h('div', { className: 'rz-toast' }, toast))
     }
@@ -462,7 +555,7 @@ window.__ModuleLoader__.load({
     module.exports = {
       name: CLIENT_NAME,
       inject: ['slots', 'locale'],
-      __internals: { NS, ZH, EN, sortEntries, tierOf, RAZOR_TIERS, formatDateTime, entryChip },
+      __internals: { NS, ZH, EN, sortEntries, tierOf, RAZOR_TIERS, formatDateTime, entryChip, entryCategory, categoryLabel, pctOf },
       __boot(container, opts = {}) {
         ensureStyles()
         const t = opts.t || ((key, vars) => {

package/client/index.js

@@ -54,9 +54,10 @@ const ZH = {
   busyTag: '运行中',
   sortLabel: '排序',
   sortOrder: '上下文顺序',
-  sortSeq: '原始序号',
   sortTokens: 'token 高→低',
   orderNote: '本插件不会改变上下文条目顺序，只会剔除选中条目。',
+  legendTitle: '按 token 量级筛选（点选高亮某一档）',
+  kindFilterLabel: '类型',
   selectVisible: '选中可见',
   selectVisibleHint: '选中当前显示的全部条目（配合色块筛选）',
   clearSelect: '清空选择',
@@ -78,6 +79,8 @@ const ZH = {
   deleteTitle: '确认裁剪',
   deleteConfirm: '即将把 {n} 条消息（约 {tokens} token）从模型视野中移除，替换为一条标记消息。日志中保留痕迹，此操作不可恢复。继续？',
   deleteBusyHint: '会话正在运行，等当前回合结束后再裁剪',
+  deleteOne: '删除此条',
+  deleteOneHint: '删除此条（约 {tokens} token）',
   deleteOk: '执行',
   cancel: '取消',
   deletedToast: '已删除 {n} 条（约 {tokens} token）',
@@ -93,9 +96,10 @@ const EN = {
   busyTag: 'running',
   sortLabel: 'Sort',
   sortOrder: 'Context order',
-  sortSeq: 'Original seq',
   sortTokens: 'tokens high→low',
   orderNote: 'This plugin never reorders context entries; it only removes the selected ones.',
+  legendTitle: 'Filter by token tier (click to isolate a band)',
+  kindFilterLabel: 'Type',
   selectVisible: 'Select shown',
   selectVisibleHint: 'Select every currently shown entry (pairs with tier filters)',
   clearSelect: 'Clear selection',
@@ -117,6 +121,8 @@ const EN = {
   deleteTitle: 'Confirm trim',
   deleteConfirm: 'About to remove {n} messages (≈{tokens} tokens) from the model view, replaced by one marker message. Traces stay in the log; this cannot be undone. Continue?',
   deleteBusyHint: 'Session is running — trim after the current turn finishes',
+  deleteOne: 'Delete this entry',
+  deleteOneHint: 'Delete this entry (≈{tokens} tokens)',
   deleteOk: 'Delete',
   cancel: 'Cancel',
   deletedToast: 'Deleted {n} entries (≈{tokens} tokens)',
@@ -131,9 +137,10 @@ const PAGE_SIZE = 150
 
 const kindI18n = (key) => 'kind' + key[0].toUpperCase() + key.slice(1)
 
-/** 排序：order = 投影原序（模型可见序）；seq = 原始序号升序（裁剪过的会话里与 order 不同：标记消息 seq 大但在中间）；tokens = 降序（并列按 seq，缺 token 沉底）。 */
+/** 排序：order = 投影原序（模型可见序）；tokens = 降序（并列按 seq，缺 token 沉底）。
+ *  只有两档且都是显示层——裁剪过的会话里 seq 升序 ≠ 模型可见序（replace 标记 seq 大但位置在中间），
+ *  与「本页展示模型可见上下文」相悖，故不提供 seq 档。 */
 function sortEntries(entries, sortBy) {
-  if (sortBy === 'seq') return [...entries].sort((a, b) => a.seq - b.seq)
   if (sortBy !== 'tokens') return entries
   return [...entries].sort((a, b) => {
     const va = a.tokens, vb = b.tokens
@@ -165,6 +172,38 @@ function entryChip(entry, t) {
   return { kind: entry.kind, label: t(kindI18n(entry.kind)) }
 }
 
+/**
+ * 筛选用稳定分类键，与 entryChip 的可见口径一致：
+ *   tool  → 'tool:<工具名>'（无工具名则 'tool:'，按钮文案退回「工具」）
+ *   user 注入 → 'injected'（sourceKind !== 'user' 的 user 消息，统一一档；
+ *     细分来源在 chip 的 title 与详情里已可见，筛选层不再切分，避免按钮爆炸）
+ *   user / assistant → 自身
+ * 「按钮文案」与 chip 同源（categoryLabel），用户在两处看到的是同一个词。
+ */
+function entryCategory(entry) {
+  if (entry.kind === 'tool') return 'tool:' + (typeof entry.tool === 'string' ? entry.tool : '')
+  if (entry.kind === 'user' && entry.sourceKind && entry.sourceKind !== 'user') return 'injected'
+  return entry.kind
+}
+function categoryLabel(cat, t) {
+  if (cat === 'user') return t('kindUser')
+  if (cat === 'assistant') return t('kindAssistant')
+  if (cat === 'injected') return t('kindInjected')
+  if (cat.lastIndexOf('tool:', 0) === 0) {
+    const name = cat.slice(5)
+    return name || t('kindTool')
+  }
+  return cat
+}
+
+/** 该条 token 占全部上下文的百分比文案；total 非正或 part 为 0 返回 null（不显示）。 */
+function pctOf(part, total) {
+  if (!total || !part) return null
+  const p = part / total * 100
+  if (p < 0.1) return '<0.1%'
+  return (p >= 10 ? p.toFixed(0) : p.toFixed(1)) + '%'
+}
+
 // ── 彩虹分级：颜色越暖 = 占用越多 ────────────────────────────────────────
 // 固定对数档位（相邻约 ×2.5），跨会话语义稳定：绿→黄绿→黄→橙→红→品红。
 // 档位是「这条消息吃掉多少典型上下文预算」的粗标尺，不随会话内最大值缩放。
@@ -215,6 +254,13 @@ const STYLE = `<style>
 .rz-swatch.tier-3{background:hsl(32,80%,45%)}
 .rz-swatch.tier-4{background:hsl(8,75%,48%)}
 .rz-swatch.tier-5{background:hsl(320,65%,50%)}
+.rz-kindsbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
+.rz-kinds{display:inline-flex;gap:4px;align-items:center;flex-wrap:wrap}
+.rz-kinds.filtering .rz-kindbtn:not(.on){opacity:.45}
+.rz-kindbtn{display:inline-flex;align-items:center;gap:5px;padding:2px 10px;border-radius:999px;border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-secondary);font-size:11.5px;cursor:pointer;font-family:var(--dsw-font-family);white-space:nowrap}
+.rz-kindbtn:hover{border-color:var(--dsw-alias-border-l3);background:var(--dsw-alias-interactive-bg-hover)}
+.rz-kindbtn.on{color:var(--dsw-alias-state-business-primary);border-color:var(--dsw-alias-state-business-primary);font-weight:600}
+.rz-kindcount{font-size:10px;opacity:.7}
 .rz-list{display:flex;flex-direction:column;gap:6px}
 .rz-row{display:flex;gap:10px;align-items:center;padding:8px 12px;border-radius:10px;border:1px solid var(--dsw-alias-border-l1);border-left:3px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-bg-layer-1);cursor:pointer;text-align:left;width:100%}
 .rz-row:hover{background:var(--dsw-alias-interactive-bg-hover)}
@@ -222,6 +268,9 @@ const STYLE = `<style>
 .rz-row-preview{flex:0 1 340px;min-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--dsw-alias-label-primary);font-size:13px;text-decoration:none}
 .rz-row-preview:hover{text-decoration:underline;text-underline-offset:3px}
 .rz-row-meta{color:var(--dsw-alias-label-tertiary);font-size:11px;flex:none}
+.rz-row-del{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin-left:4px;border-radius:6px;border:1px solid transparent;background:transparent;color:var(--dsw-alias-label-tertiary);font-size:13px;line-height:1;cursor:pointer;flex:none}
+.rz-row-del:hover:not(:disabled){color:var(--dsw-alias-state-error-primary);border-color:var(--dsw-alias-state-error-primary);background:hsla(0,75%,50%,.08)}
+.rz-row-del:disabled{opacity:.35;cursor:not-allowed}
 .rz-badge.tier-0{color:hsl(120,55%,40%);border-color:hsla(120,55%,40%,.45);background:hsla(120,55%,40%,.10)}
 .rz-badge.tier-1{color:hsl(90,60%,38%);border-color:hsla(90,60%,38%,.45);background:hsla(90,60%,38%,.10)}
 .rz-badge.tier-2{color:hsl(60,70%,36%);border-color:hsla(60,70%,36%,.45);background:hsla(60,70%,36%,.12)}
@@ -254,10 +303,12 @@ const STYLE = `<style>
 
 const Chip = ({ kind, label, title }) => h('span', { className: 'rz-chip ' + kind, title }, label)
 
-const TokenBadge = ({ entry }) => {
+const TokenBadge = ({ entry, total }) => {
   const tier = tierOf(entry)
-  return h('span', { className: 'rz-badge tier-' + tier, title: RAZOR_TIERS[tier].label + ' token' },
-    '≈' + formatNum(entry.tokens))
+  const pct = pctOf(entry.tokens, total)
+  const title = RAZOR_TIERS[tier].label + ' token' + (pct ? ' · ' + pct + ' ' + (total ? 'of ≈' + formatNum(total) + ' token' : 'of context') : '')
+  return h('span', { className: 'rz-badge tier-' + tier, title },
+    '≈' + formatNum(entry.tokens) + (pct ? ' · ' + pct : ''))
 }
 
 /** 分页列表：先渲染 pageSize 行，按需增长（大会话一次挂几千行会卡）。 */
@@ -272,14 +323,14 @@ function PagedList({ items, render, t }) {
 }
 
 /** 单条全文弹窗（正文经 /entry 异步补全）。 */
-function DetailModal({ detail, t, onClose }) {
+function DetailModal({ detail, t, total, onClose }) {
   if (!detail) return null
   return h('div', { className: 'rz-dlg-backdrop', onClick: onClose },
     h('div', { className: 'rz-dlg', onClick: e => e.stopPropagation() },
       h('h3', null, t('detailTitle') + ' · ' + t('seqLabel', { seq: detail.seq })),
       h('div', { className: 'rz-stats', style: { marginBottom: 10 } },
         h(Chip, { ...entryChip(detail, t) }),
-        h(TokenBadge, { entry: detail }),
+        h(TokenBadge, { entry: detail, total }),
         h('span', { className: 'rz-label', title: 'seq ' + detail.seq }, formatDateTime(detail.time)),
         h('span', { className: 'rz-label' }, t('detailChars', { chars: formatNum(detail.chars) })),
         detail.usage && h('span', { className: 'rz-label' }, t('detailUsage', {
@@ -310,10 +361,11 @@ function RazorPage({ t, fixedSessionId }) {
   const [ctxLoading, setCtxLoading] = useState(false)
   const [error, setError] = useState(null)
   const [tierFilter, setTierFilter] = useState(() => new Set())
+  const [kindFilter, setKindFilter] = useState(() => new Set())
   const [sortBy, setSortBy] = useState('order')
   const [selected, setSelected] = useState(() => new Set())
   const [detail, setDetail] = useState(null)
-  const [confirming, setConfirming] = useState(false)
+  const [confirming, setConfirming] = useState(null) // null | number[] 待裁剪 seqs（单条/多选同源）
   const [deleting, setDeleting] = useState(false)
   const [toast, setToast] = useState(null)
   const sessionRef = useRef('')
@@ -344,16 +396,34 @@ function RazorPage({ t, fixedSessionId }) {
     if (!context) return []
     let rows = context.entries
     if (tierFilter.size > 0) rows = rows.filter(e => tierFilter.has(tierOf(e)))
+    if (kindFilter.size > 0) rows = rows.filter(e => kindFilter.has(entryCategory(e)))
     return sortEntries(rows, sortBy)
-  }, [context, tierFilter, sortBy])
+  }, [context, tierFilter, kindFilter, sortBy])
 
-  const selectedTokens = useMemo(() => {
-    if (!context) return 0
-    const bySeq = new Map(context.entries.map(e => [e.seq, e]))
+  // 当前上下文里实际出现的分类（cat/count/tokens），按条数降序——决定渲染哪些按钮。
+  const categories = useMemo(() => {
+    if (!context) return []
+    const seen = new Map()
+    for (const e of context.entries) {
+      const c = entryCategory(e)
+      const prev = seen.get(c) || { count: 0, tokens: 0 }
+      prev.count += 1
+      prev.tokens += (e.tokens || 0)
+      seen.set(c, prev)
+    }
+    return [...seen.entries()]
+      .map(([cat, v]) => ({ cat, count: v.count, tokens: v.tokens }))
+      .sort((a, b) => b.count - a.count || b.tokens - a.tokens)
+  }, [context])
+
+  const entriesBySeq = useMemo(() => context ? new Map(context.entries.map(e => [e.seq, e])) : null, [context])
+  const sumSeqs = (seqs) => {
     let sum = 0
-    for (const seq of selected) { const e = bySeq.get(seq); if (e) sum += e.tokens }
+    if (entriesBySeq) for (const seq of seqs) { const e = entriesBySeq.get(seq); if (e) sum += e.tokens || 0 }
     return sum
-  }, [context, selected])
+  }
+  const selectedTokens = useMemo(() => sumSeqs(selected), [selected, entriesBySeq])
+  const confirmTokens = useMemo(() => confirming ? sumSeqs(confirming) : 0, [confirming, entriesBySeq])
 
   const toggleRow = (seq) => setSelected(prev => {
     const next = new Set(prev)
@@ -367,6 +437,12 @@ function RazorPage({ t, fixedSessionId }) {
     else next.add(i)
     return next
   })
+  const toggleKind = (cat) => setKindFilter(prev => {
+    const next = new Set(prev)
+    if (next.has(cat)) next.delete(cat)
+    else next.add(cat)
+    return next
+  })
   const selectVisible = () => setSelected(new Set(visible.map(e => e.seq)))
 
   const openDetail = (entry) => {
@@ -377,17 +453,18 @@ function RazorPage({ t, fixedSessionId }) {
   }
 
   const doDelete = async () => {
+    if (!confirming || confirming.length === 0) return
     setDeleting(true)
     try {
-      const r = await fetch(API + '/delete', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ session: sessionId, seqs: [...selected] }) })
+      const r = await fetch(API + '/delete', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ session: sessionId, seqs: confirming }) })
       const d = await r.json().catch(() => ({}))
       if (!r.ok) throw new Error(d.error || 'HTTP ' + r.status)
-      setConfirming(false)
+      setConfirming(null)
       setSelected(new Set())
       showToast(t('deletedToast', { n: d.removed, tokens: formatNum(d.tokensRemoved) }))
       refreshAll()
     } catch (e) {
-      setConfirming(false)
+      setConfirming(null)
       setError(e.message)
     } finally { setDeleting(false) }
   }
@@ -411,9 +488,21 @@ function RazorPage({ t, fixedSessionId }) {
           t('selectVisible') + (visible.length ? ` (${visible.length})` : '')),
         h('select', { className: 'rz-select', value: sortBy, onChange: e => setSortBy(e.target.value), title: t('sortLabel'), 'aria-label': t('sortLabel') },
           h('option', { value: 'order' }, t('sortOrder')),
-          h('option', { value: 'seq' }, t('sortSeq')),
           h('option', { value: 'tokens' }, t('sortTokens'))),
         h('button', { className: 'rz-btn', onClick: refreshAll, title: t('refresh') }, t('refresh'))),
+      // 类型筛选：与 chip 同口径的可点选按钮（user/injected/assistant/tool:<名>），
+      // 多选 toggle，与 tier 量级筛选正交叠加。按钮带条数；hover 看 token 占比。
+      categories.length > 0 && h('div', { key: 'kinds', className: 'rz-kindsbar' },
+        h('span', { className: 'rz-label' }, t('kindFilterLabel')),
+        h('span', { className: 'rz-kinds' + (kindFilter.size > 0 ? ' filtering' : '') },
+          categories.map(({ cat, count, tokens }) =>
+            h('button', { key: cat,
+              className: 'rz-kindbtn' + (kindFilter.has(cat) ? ' on' : ''),
+              title: categoryLabel(cat, t) + ' · ' + count + ' 条 · ≈' + formatNum(tokens) + ' token'
+                + (context.totalTokens ? '（' + (pctOf(tokens, context.totalTokens) || '0%') + '）' : ''),
+              onClick: () => toggleKind(cat) },
+              categoryLabel(cat, t),
+              h('span', { className: 'rz-kindcount' }, count))))),
       selected.size > 0 && h('div', { key: 'sel', className: 'rz-stats' },
         h('span', null, t('selectedStats', { n: selected.size, tokens: formatNum(selectedTokens) })),
         h('span', { className: 'rz-spacer' }),
@@ -421,7 +510,7 @@ function RazorPage({ t, fixedSessionId }) {
           h('button', { className: 'rz-btn', onClick: () => setSelected(new Set()) }, t('clearSelect')),
           h('button', { className: 'rz-btn rz-btn-danger', disabled: !canDelete,
             title: busy ? t('deleteBusyHint') : undefined,
-            onClick: () => setConfirming(true) },
+            onClick: () => setConfirming([...selected]) },
             t('deleteSelected') + ` (${selected.size})`))),
       visible.length === 0
         ? h('div', { key: 'empty', className: 'rz-empty' }, t('emptyContext'))
@@ -432,15 +521,19 @@ function RazorPage({ t, fixedSessionId }) {
                   role: 'button', tabIndex: 0, onClick: () => toggleRow(entry.seq),
                   onKeyDown: e => e.key === 'Enter' && toggleRow(entry.seq) },
                 h('input', { type: 'checkbox', checked: selected.has(entry.seq), onClick: e => e.stopPropagation(), onChange: () => toggleRow(entry.seq) }),
-                h(TokenBadge, { entry }),
+                h(TokenBadge, { entry, total: context.totalTokens }),
                 h(Chip, { ...entryChip(entry, t) }),
                 h('span', { className: 'rz-row-preview', title: entry.preview,
                     onClick: e => { e.stopPropagation(); openDetail(entry) } }, entry.preview || ' '),
-                h('span', { className: 'rz-row-meta', title: 'seq ' + entry.seq }, formatDateTime(entry.time)))
+                h('span', { className: 'rz-row-meta', title: 'seq ' + entry.seq }, formatDateTime(entry.time)),
+                h('button', { className: 'rz-row-del', type: 'button', disabled: busy,
+                    title: busy ? t('deleteBusyHint') : t('deleteOneHint', { tokens: formatNum(entry.tokens) }),
+                    'aria-label': t('deleteOne'),
+                    onClick: e => { e.stopPropagation(); if (!busy) setConfirming([entry.seq]) } }, '✕'))
             } })),
-      detail && h(DetailModal, { detail, t, onClose: () => setDetail(null) }),
-      confirming && h(ConfirmDialog, { n: selected.size, tokens: formatNum(selectedTokens), deleting, t,
-        onCancel: () => setConfirming(false), onOk: doDelete }),
+      detail && h(DetailModal, { detail, t, total: context.totalTokens, onClose: () => setDetail(null) }),
+      confirming && confirming.length > 0 && h(ConfirmDialog, { n: confirming.length, tokens: formatNum(confirmTokens), deleting, t,
+        onCancel: () => setConfirming(null), onOk: doDelete }),
     ],
     toast && h('div', { className: 'rz-toast' }, toast))
 }
@@ -452,7 +545,7 @@ const CLIENT_NAME = '@weibaohui/context-razor'
 module.exports = {
   name: CLIENT_NAME,
   inject: ['slots', 'locale'],
-  __internals: { NS, ZH, EN, sortEntries, tierOf, RAZOR_TIERS, formatDateTime, entryChip },
+  __internals: { NS, ZH, EN, sortEntries, tierOf, RAZOR_TIERS, formatDateTime, entryChip, entryCategory, categoryLabel, pctOf },
   __boot(container, opts = {}) {
     ensureStyles()
     const t = opts.t || ((key, vars) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@weibaohui/context-razor",
-  "version": "0.3.0",
+  "version": "0.4.1",
   "description": "dsh 插件 · 上下文剃刀：把当前会话上下文逐条列出（角色/预览/≈token，cl100k 估算），超阈值标红，勾选后精确裁剪——不经 LLM 总结，删了什么一目了然。",
   "license": "MIT",
   "keywords": [