dsh-my-observability 0.3.0 → 0.3.2

package/lib/parts/replay.js

@@ -1,386 +0,0 @@
-// ── 轨迹回放面板（时间轴）──────────────────────────────────────────
-// 拆分的审计视图组件（搜索/组合过滤/导出/统计/高亮/hook）位于
-// replay-ext.js 片段（见 client.src.js 占位符顺序）。
-
-/** 请求插件 API（非 2xx 抛错；返回响应 JSON 的 value 字段）。 */
-function apiJson(path, options) {
-  return fetch(path, options).then(async (res) => {
-    const data = await res.json()
-    if (!res.ok) throw new Error(data.error?.message || `HTTP ${res.status}`)
-    return data.value
-  })
-}
-
-/** 事件类型 → 中文标签。 */
-function typeLabel(event) {
-  switch (event.type) {
-    case 'agent_status':
-      return strings.typeAgentStatus()
-    case 'llm_stream':
-      return strings.typeLlmStream()
-    case 'tool_call':
-      return strings.typeToolCall()
-    case 'tool_result':
-      return strings.typeToolResult()
-    case 'plugin_event':
-      return strings.typePluginEvent()
-    default:
-      return event.type
-  }
-}
-
-/** 事件类型 → 视觉类别（徽标/图标/节点共用，颜色语义一致）：
- *  status=info / llm=warn / call=accent / result=success / fail=danger /
- *  plugin=info（插件事件复用 info 色，图标区分）。 */
-function typeKind(event) {
-  if (event.type === 'agent_status') return 'status'
-  if (event.type === 'llm_stream') return 'llm'
-  if (event.type === 'tool_call') return 'call'
-  if (event.type === 'plugin_event') return 'plugin'
-  return event.data?.ok === false ? 'fail' : 'result'
-}
-
-/** 事件类型 → 类型图标（共享线性图标集，stroke=currentColor）。 */
-function typeIcon(event) {
-  const kind = typeKind(event)
-  if (kind === 'status') return icon.clock(15)
-  if (kind === 'llm') return icon.file(15)
-  if (kind === 'call') return icon.external(15)
-  if (kind === 'plugin') return icon.alert(15)
-  if (kind === 'fail') return icon.close(15)
-  return icon.check(15)
-}
-
-/** 时间戳 → HH:MM:SS。 */
-function timeText(time) {
-  try {
-    const date = new Date(time)
-    const pad = (n) => String(n).padStart(2, '0')
-    return `${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`
-  } catch {
-    return ''
-  }
-}
-
-/** agent 类型标记 → 中文。 */
-function agentTypeText(agentType) {
-  if (agentType === 'top') return strings.agentTop()
-  if (agentType === 'subagent') return strings.agentSub()
-  return strings.agentUnknown()
-}
-
-/** 模型流阶段 → 中文。 */
-function phaseText(phase) {
-  if (phase === 'start') return strings.phaseStart()
-  if (phase === 'end') return strings.phaseEnd()
-  if (phase === 'error') return strings.phaseError()
-  return phase
-}
-
-/** agent 状态事件摘要。 */
-function agentMeta(data) {
-  return `状态 ${data.status} · ${agentTypeText(data.agentType)}`
-}
-
-/** 模型流事件摘要（开始/结束/错误 + 统计）。 */
-function llmMeta(data) {
-  const stats = data.phase === 'start' ? '' : ` · ${data.chunks} chunks / ${data.chars} chars / ${data.ms}ms`
-  const error = data.message !== undefined ? `：${data.message}` : ''
-  return `${phaseText(data.phase)}${stats}${error}`
-}
-
-/** 工具调用事件摘要（名称 + 参数摘要）。 */
-function toolCallMeta(data) {
-  const args = data.args && data.args.summary !== undefined ? ` — ${data.args.summary}` : ''
-  return `${data.name}${args}`
-}
-
-/** 工具结果事件摘要（名称 + 成败 + 耗时）。 */
-function toolResultMeta(data) {
-  const result = data.ok === false ? strings.toolFail() : strings.toolOk()
-  return `${data.name} · ${result} · ${data.ms}ms`
-}
-
-/** 插件事件摘要（插件名 · 事件名 · 动作；issue #154）。 */
-function pluginEventMeta(data) {
-  const action = typeof data.action === 'string' && data.action !== '' ? data.action : data.event
-  return `${data.plugin} · ${data.event} · ${action}`
-}
-
-/** 事件 → 摘要文本（单行，尽力而为）。 */
-function eventMeta(event) {
-  const data = event.data || {}
-  if (event.type === 'agent_status') return agentMeta(data)
-  if (event.type === 'llm_stream') return llmMeta(data)
-  if (event.type === 'tool_call') return toolCallMeta(data)
-  if (event.type === 'tool_result') return toolResultMeta(data)
-  if (event.type === 'plugin_event') return pluginEventMeta(data)
-  return ''
-}
-
-/** 插件事件详情行（原因 + 参数键值对；非插件事件返回 null 不可展开）。 */
-function eventDetail(event) {
-  if (event?.type !== 'plugin_event') return null
-  const data = event.data || {}
-  const rows = []
-  if (typeof data.reason === 'string' && data.reason !== '') {
-    rows.push(
-      createElement(
-        'div',
-        { key: 'reason', className: 'dsh-my-observability-detail-row' },
-        createElement('span', { className: 'dsh-my-observability-detail-key' }, strings.detailReason()),
-        createElement('span', { className: 'dsh-my-observability-detail-value' }, data.reason),
-      ),
-    )
-  }
-  if (data.params !== null && typeof data.params === 'object') {
-    for (const [key, value] of Object.entries(data.params)) {
-      rows.push(
-        createElement(
-          'div',
-          { key, className: 'dsh-my-observability-detail-row' },
-          createElement('span', { className: 'dsh-my-observability-detail-key' }, key),
-          createElement('span', { className: 'dsh-my-observability-detail-value' }, String(value)),
-        ),
-      )
-    }
-  }
-  return rows.length > 0 ? rows : null
-}
-
-/** 单条事件行：节点圆点 + 类型图标 + 徽标/时间 + 摘要（hover/active 反馈）。
- *  摘要命中关键词时以 mark 高亮；插件事件可点击展开详情（原因/参数）。 */
-function EventRow({ event, keyword }) {
-  const meta = eventMeta(event)
-  const kind = typeKind(event)
-  const detail = eventDetail(event)
-  const [open, setOpen] = useState(false)
-  return createElement(
-    'button',
-    {
-      className: 'dsh-my-observability-event',
-      type: 'button',
-      'aria-expanded': detail !== null ? open : undefined,
-      onClick: detail !== null ? () => setOpen(!open) : undefined,
-    },
-    createElement('span', { className: `dsh-my-observability-node dsh-my-observability-node-${kind}` }),
-    createElement(
-      'span',
-      { className: `dsh-my-observability-event-icon dsh-my-observability-icon-${kind}` },
-      typeIcon(event),
-    ),
-    createElement(
-      'span',
-      { className: 'dsh-my-observability-event-body' },
-      createElement(
-        'span',
-        { className: 'dsh-my-observability-event-head' },
-        createElement(
-          'span',
-          { className: `dsh-my-observability-badge dsh-my-observability-badge-${kind}` },
-          typeLabel(event),
-        ),
-        createElement('span', { className: 'dsh-my-observability-time' }, timeText(event.time)),
-      ),
-      meta !== ''
-        ? createElement(
-            'span',
-            { className: 'dsh-my-observability-event-meta' },
-            createElement(HighlightText, { text: meta, keyword }),
-          )
-        : null,
-      detail !== null && open ? createElement('div', { className: 'dsh-my-observability-event-detail' }, detail) : null,
-    ),
-  )
-}
-
-/** 类型过滤按钮组（aria-pressed 选中态；plugin 过滤插件事件，issue #154）。 */
-function TypeFilter({ filter, onFilter }) {
-  const options = [
-    ['', strings.filterAll()],
-    ['agent_status', strings.filterStatus()],
-    ['llm_stream', strings.filterLlm()],
-    ['tool', strings.filterTools()],
-    ['plugin', strings.filterPlugin()],
-  ]
-  return createElement(
-    'div',
-    { className: 'dsh-my-observability-filters' },
-    options.map(([value, label]) =>
-      createElement(
-        'button',
-        {
-          key: value,
-          type: 'button',
-          className: `dsh-my-observability-chip${filter === value ? ' dsh-my-observability-chip-active' : ''}`,
-          'aria-pressed': filter === value,
-          onClick: () => onFilter(value),
-        },
-        label,
-      ),
-    ),
-  )
-}
-
-/** 拉取会话列表与事件（选中为空时自动选当前/首个会话）。 */
-async function loadReplayData(selected, currentSession, setters) {
-  try {
-    const list = await apiJson('/observability/api/sessions')
-    setters.setSessions(list)
-    if (selected === '' && list.length > 0) {
-      const preferred = list.some((s) => s.sessionId === currentSession) ? currentSession : list[0].sessionId
-      setters.setSelected(preferred)
-      return
-    }
-    const query =
-      selected !== ''
-        ? `/observability/api/events?sessionId=${encodeURIComponent(selected)}&limit=300`
-        : '/observability/api/events?limit=0'
-    setters.setEvents(await apiJson(query))
-    setters.setError('')
-  } catch (err) {
-    setters.setError(err instanceof Error ? err.message : String(err))
-  } finally {
-    setters.setLoading(false)
-  }
-}
-
-/** 下拉选项文案：可读标题（首条用户消息）优先，无标题回退 UUID 短显；
- *  附加事件数与时间，用户一眼看出"哪个对话"。 */
-function sessionOptionLabel(s) {
-  const title = typeof s.title === 'string' && s.title !== '' ? s.title : strings.sessionFallback(shortId(s.sessionId))
-  return `${title} · ${strings.eventCount(s.count)}`
-}
-
-/** 会话 id 短显示（UUID 取前 8 位）。 */
-function shortId(sessionId) {
-  return typeof sessionId === 'string' && sessionId.length > 8 ? `${sessionId.slice(0, 8)}…` : sessionId || ''
-}
-
-/** 工具栏：会话选择 + 手动刷新 + 类型过滤。 */
-function ReplayToolbar({ sessions, selected, onSelect, filter, onFilter, onRefresh }) {
-  return createElement(
-    'div',
-    { className: 'dsh-my-observability-toolbar' },
-    createElement(
-      'div',
-      { className: 'dsh-my-observability-toolbar-row' },
-      createElement(
-        'select',
-        {
-          className: 'dsh-my-observability-select',
-          value: selected,
-          disabled: sessions.length === 0,
-          onChange: (e) => onSelect(e.target.value),
-        },
-        sessions.length === 0
-          ? createElement('option', { value: '' }, strings.allSessions())
-          : sessions.map((s) =>
-              createElement('option', { key: s.sessionId, value: s.sessionId }, sessionOptionLabel(s)),
-            ),
-      ),
-      createElement(
-        'button',
-        {
-          type: 'button',
-          className: 'dsh-my-observability-iconbtn',
-          'aria-label': strings.refresh(),
-          title: strings.refresh(),
-          onClick: onRefresh,
-        },
-        icon.refresh(15),
-      ),
-    ),
-    createElement(TypeFilter, { filter, onFilter }),
-  )
-}
-
-/** 加载中状态（旋转刷新图标 + 次级色文案，不阻塞布局）。 */
-function LoadingState() {
-  return createElement(
-    'div',
-    { className: 'dsh-my-observability-state' },
-    icon.refresh(14),
-    createElement('span', null, strings.loading()),
-  )
-}
-
-/** 空状态（图标 + 主文案 + hint 两行结构）。 */
-function EmptyState() {
-  return createElement(
-    'div',
-    { className: 'dsh-my-observability-empty' },
-    createElement('span', { className: 'dsh-my-observability-empty-icon' }, icon.clock(20)),
-    createElement('span', null, strings.emptyEvents()),
-    createElement('span', { className: 'dsh-my-observability-empty-hint' }, strings.emptyEventsHint()),
-  )
-}
-
-/** 错误状态（错误色文案 + 重试按钮）。 */
-function ErrorState({ message, onRetry }) {
-  return createElement(
-    'div',
-    { className: 'dsh-my-observability-error' },
-    createElement('span', { className: 'dsh-my-observability-error-text' }, `${strings.loadError()}：${message}`),
-    createElement(
-      'button',
-      {
-        type: 'button',
-        className: 'dsh-my-observability-iconbtn',
-        'aria-label': strings.retry(),
-        title: strings.retry(),
-        onClick: onRetry,
-      },
-      icon.refresh(15),
-    ),
-  )
-}
-
-/** 轨迹回放主面板：会话选择 + 类型过滤 + 搜索/组合过滤 + 导出 + 统计 + 时间轴。
- *  状态与派生值集中在 replay-ext.js 的 useReplayState；本组件只拼装视图。
- *  面板可见时轮询、隐藏时暂停。 */
-function ReplayPanel(props) {
-  const s = useReplayState(props)
-  return createElement(
-    'div',
-    { className: 'dsh-my-observability-panel' },
-    createElement(ResourcePanel, { resource: s.resource }),
-    createElement(ReplayToolbar, {
-      sessions: s.sessions,
-      selected: s.selected,
-      onSelect: s.setSelected,
-      filter: s.filter,
-      onFilter: s.setFilter,
-      onRefresh: s.retry,
-    }),
-    createElement(SearchFilterBar, {
-      keyword: s.keyword,
-      onKeyword: s.setKeyword,
-      timeStart: s.timeStart,
-      onTimeStart: s.setTimeStart,
-      timeEnd: s.timeEnd,
-      onTimeEnd: s.setTimeEnd,
-      result: s.result,
-      onResult: s.setResult,
-      onClear: s.clearFilters,
-    }),
-    createElement(ExportBar, {
-      scope: s.scope,
-      onScope: s.setScope,
-      onExportJson: () => void s.onExport('json'),
-      onExportCsv: () => void s.onExport('csv'),
-      showStats: s.showStats,
-      onToggleStats: () => s.setShowStats((value) => !value),
-      disabled: !s.canExport,
-    }),
-    s.error !== '' ? createElement(ErrorState, { message: s.error, onRetry: s.retry }) : null,
-    s.loading && s.error === '' ? createElement(LoadingState, null) : null,
-    !s.loading && s.error === '' && s.filtered.length === 0
-      ? s.hasFilter
-        ? createElement(NoMatchesState, null)
-        : createElement(EmptyState, null)
-      : null,
-    s.showStats ? createElement(StatsPanel, { events: s.filtered }) : null,
-    createElement('div', { className: 'dsh-my-observability-timeline' }, s.rows),
-  )
-}

package/lib/parts/resource.js

@@ -1,80 +0,0 @@
-// ── 资源监控区块（写放大/资源超限预警，见 lib/resource-monitor.js）──────
-// 依赖 replay.js 先拼接（apiJson）与 i18n.js（strings）。纯函数声明文本。
-
-const RESOURCE_POLL_MS = 15000
-
-function fmtResourceBytes(bytes) {
-  if (!Number.isFinite(bytes)) return '-'
-  return `${(bytes / 1048576).toFixed(1)} MB`
-}
-
-/** 资源采样状态：可见时每 15s 轮询 /observability/api/resources。 */
-function useResourceState(visible) {
-  const [resource, setResource] = useState(null)
-  useEffect(() => {
-    if (!visible) return undefined
-    let alive = true
-    const tick = () => {
-      if (alive)
-        apiJson('/observability/api/resources')
-          .then(setResource)
-          .catch(() => {})
-    }
-    tick()
-    const timer = setInterval(tick, RESOURCE_POLL_MS)
-    return () => {
-      alive = false
-      clearInterval(timer)
-    }
-  }, [visible])
-  return resource
-}
-
-function ResourceMetric({ label, value }) {
-  return createElement(
-    'div',
-    { className: 'dsh-my-observability-resource-metric' },
-    createElement('span', { className: 'dsh-my-observability-resource-label' }, label),
-    createElement('span', { className: 'dsh-my-observability-resource-value' }, value),
-  )
-}
-
-/** 资源面板：四指标 + 告警列表（write-rate/file-size level=error 红色，cpu/memory warn 黄色）。 */
-function ResourcePanel({ resource }) {
-  if (resource === null || resource === undefined) {
-    return createElement('div', { className: 'dsh-my-observability-resource' }, strings.resourceLoading())
-  }
-  const alerts = Array.isArray(resource.alerts) ? resource.alerts : []
-  return createElement(
-    'div',
-    { className: 'dsh-my-observability-resource' },
-    createElement('div', { className: 'dsh-my-observability-resource-head' }, strings.resourceTitle()),
-    createElement(
-      'div',
-      { className: 'dsh-my-observability-resource-grid' },
-      createElement(ResourceMetric, { label: strings.resourceFile(), value: fmtResourceBytes(resource.fileBytes) }),
-      createElement(ResourceMetric, {
-        label: strings.resourceRate(),
-        value: `${fmtResourceBytes(resource.writeRateBytesPerHour)}/h`,
-      }),
-      createElement(ResourceMetric, {
-        label: strings.resourceCpu(),
-        value: `${Math.round(resource.cpuPercent ?? 0)}%`,
-      }),
-      createElement(ResourceMetric, { label: strings.resourceMem(), value: fmtResourceBytes(resource.memoryBytes) }),
-    ),
-    alerts.length > 0
-      ? createElement(
-          'div',
-          { className: 'dsh-my-observability-resource-alerts' },
-          alerts.map((alert) =>
-            createElement(
-              'div',
-              { className: `dsh-my-observability-resource-alert dsh-my-observability-resource-alert-${alert.level}` },
-              alert.message,
-            ),
-          ),
-        )
-      : null,
-  )
-}

package/lib/parts/styles.js

@@ -1,156 +0,0 @@
-// ── 样式（DSH 语义 token，随 activation 注入 / teardown 卸载）──────
-// 前缀 dsh-my-observability-（issue #54：与 dsh-my-guard 前缀分离，消除跨插件类名冲突）。
-const STYLES = `
-.dsh-my-observability-panel{display:flex;flex-direction:column;gap:10px;padding:2px 6px 8px;color:var(--dsw-alias-label-primary);font:var(--dsw-font-s-14)}
-.dsh-my-observability-toolbar{display:flex;flex-direction:column;gap:8px}
-.dsh-my-observability-toolbar-row{display:flex;align-items:center;gap:6px}
-.dsh-my-observability-select{flex:1;min-width:0;font:var(--dsw-font-xxs-12);color:var(--dsw-alias-label-primary);
-  background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l2);border-radius:6px;padding:4px 8px}
-.dsh-my-observability-select:disabled{opacity:.4;cursor:default}
-.dsh-my-observability-input{flex:1;min-width:0;font:var(--dsw-font-xxs-12);color:var(--dsw-alias-label-primary);
-  background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l2);border-radius:6px;padding:4px 8px}
-.dsh-my-observability-input::placeholder{color:var(--dsw-alias-label-tertiary)}
-.dsh-my-observability-repo-row{display:flex;gap:8px;align-items:center}
-.dsh-my-observability-repo-input{flex:1}
-.dsh-my-observability-iconbtn{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;
-  border:none;border-radius:50%;background:transparent;color:var(--dsw-alias-label-secondary);cursor:pointer;flex:none;
-  transition:background var(--ds-transition-duration-slow) var(--ds-ease-in-out), color var(--ds-transition-duration-slow) var(--ds-ease-in-out)}
-.dsh-my-observability-iconbtn svg{display:block}
-.dsh-my-observability-iconbtn:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-primary)}
-.dsh-my-observability-iconbtn:disabled{opacity:.4;cursor:default}
-.dsh-my-observability-filters{display:flex;gap:6px;flex-wrap:wrap}
-.dsh-my-observability-chip{font:var(--dsw-font-xxs-12);color:var(--dsw-alias-label-secondary);background:transparent;
-  border:1px solid var(--dsw-alias-border-l2);border-radius:999px;padding:2px 10px;cursor:pointer;
-  transition:background var(--ds-transition-duration-slow) var(--ds-ease-in-out), color var(--ds-transition-duration-slow) var(--ds-ease-in-out), border-color var(--ds-transition-duration-slow) var(--ds-ease-in-out)}
-.dsh-my-observability-chip:hover{background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-primary)}
-.dsh-my-observability-chip-active{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-interactive-primary);
-  background:color-mix(in srgb, var(--dsw-alias-interactive-primary) 12%, transparent)}
-/* ── 时间轴：左侧竖线 + 类型色节点圆点 + 类型图标行 ── */
-.dsh-my-observability-timeline{display:flex;flex-direction:column;gap:2px;max-height:calc(100vh - 240px);overflow-y:auto;
-  padding-left:14px;position:relative}
-.dsh-my-observability-timeline::before{content:'';position:absolute;left:5px;top:8px;bottom:8px;width:2px;border-radius:1px;
-  background:var(--dsw-alias-border-l2)}
-.dsh-my-observability-event{position:relative;display:flex;align-items:flex-start;gap:8px;box-sizing:border-box;width:100%;
-  margin:0;padding:5px 8px 5px 0;border:none;background:transparent;border-radius:8px;cursor:pointer;text-align:left;
-  font:var(--dsw-font-s-14);color:var(--dsw-alias-label-primary);
-  animation:dsh-my-observability-row-in 150ms var(--ds-ease-in-out);
-  transition:background var(--ds-transition-duration-slow) var(--ds-ease-in-out)}
-.dsh-my-observability-event:hover{background:var(--dsw-alias-interactive-bg-hover)}
-.dsh-my-observability-event:active{background:color-mix(in srgb, var(--dsw-alias-interactive-bg-hover) 55%, transparent)}
-.dsh-my-observability-node{position:absolute;left:-14px;top:50%;transform:translateY(-50%);width:12px;height:12px;flex:none;
-  box-sizing:border-box;border-radius:50%;background:var(--dsw-alias-bg-layer-2);border:2px solid var(--dsw-alias-label-tertiary)}
-.dsh-my-observability-node-status{border-color:var(--dsw-alias-state-info-primary)}
-.dsh-my-observability-node-llm{border-color:var(--dsw-alias-state-warn-primary)}
-.dsh-my-observability-node-call{border-color:var(--dsw-alias-accent)}
-.dsh-my-observability-node-plugin{border-color:var(--dsw-alias-state-info-primary)}
-.dsh-my-observability-node-result{border-color:var(--dsw-alias-state-success-primary)}
-.dsh-my-observability-node-fail{border-color:var(--dsw-alias-state-error-primary)}
-.dsh-my-observability-event-icon{flex:none;display:flex;align-items:center;margin-top:1px}
-.dsh-my-observability-icon-status{color:var(--dsw-alias-state-info-primary)}
-.dsh-my-observability-icon-llm{color:var(--dsw-alias-state-warn-primary)}
-.dsh-my-observability-icon-call{color:var(--dsw-alias-accent)}
-.dsh-my-observability-icon-plugin{color:var(--dsw-alias-state-info-primary)}
-.dsh-my-observability-icon-result{color:var(--dsw-alias-state-success-primary)}
-.dsh-my-observability-icon-fail{color:var(--dsw-alias-state-error-primary)}
-.dsh-my-observability-event-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
-.dsh-my-observability-event-head{display:flex;align-items:center;gap:8px;justify-content:space-between}
-.dsh-my-observability-badge{flex:none;font:var(--dsw-font-xxxs-strong-11);border-radius:4px;padding:1px 6px}
-.dsh-my-observability-badge-status{color:var(--dsw-alias-state-info-primary);background:color-mix(in srgb, var(--dsw-alias-state-info-primary) 14%, transparent)}
-.dsh-my-observability-badge-llm{color:var(--dsw-alias-state-warn-primary);background:color-mix(in srgb, var(--dsw-alias-state-warn-primary) 14%, transparent)}
-.dsh-my-observability-badge-call{color:var(--dsw-alias-accent);background:color-mix(in srgb, var(--dsw-alias-accent) 12%, transparent)}
-.dsh-my-observability-badge-plugin{color:var(--dsw-alias-state-info-primary);background:color-mix(in srgb, var(--dsw-alias-state-info-primary) 14%, transparent)}
-.dsh-my-observability-badge-result{color:var(--dsw-alias-state-success-primary);background:color-mix(in srgb, var(--dsw-alias-state-success-primary) 14%, transparent)}
-.dsh-my-observability-badge-fail{color:var(--dsw-alias-state-error-primary);background:color-mix(in srgb, var(--dsw-alias-state-error-primary) 14%, transparent)}
-.dsh-my-observability-time{flex:none;font:var(--dsw-font-xxxs-11);color:var(--dsw-alias-label-tertiary);white-space:nowrap}
-.dsh-my-observability-event-meta{font:var(--dsw-font-xxs-12);color:var(--dsw-alias-label-secondary);line-height:1.6;word-break:break-word}
-/* ── 插件事件详情展开（issue #154：原因/参数可查）── */
-.dsh-my-observability-event-detail{display:flex;flex-direction:column;gap:2px;margin-top:4px;padding:6px 8px;
-  border:1px solid var(--dsw-alias-border-l2);border-radius:6px;background:var(--dsw-alias-bg-layer-1)}
-.dsh-my-observability-detail-row{display:flex;gap:8px;font:var(--dsw-font-xxs-12);line-height:1.5;word-break:break-word}
-.dsh-my-observability-detail-key{flex:none;font:var(--dsw-font-xxxs-strong-11);color:var(--dsw-alias-label-tertiary);min-width:56px}
-.dsh-my-observability-detail-value{color:var(--dsw-alias-label-primary)}
-/* ── 状态区：loading / 空 / 错误 ── */
-.dsh-my-observability-state{display:flex;align-items:center;gap:6px;padding:8px 6px;font:var(--dsw-font-xxs-12);color:var(--dsw-alias-label-tertiary)}
-.dsh-my-observability-state svg{flex:none;animation:dsh-my-observability-spin 1s linear infinite}
-.dsh-my-observability-empty{display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 8px;text-align:center;
-  font:var(--dsw-font-xxs-12);color:var(--dsw-alias-label-tertiary);line-height:1.7}
-.dsh-my-observability-empty-icon{display:flex;color:var(--dsw-alias-label-tertiary)}
-.dsh-my-observability-empty-hint{display:block;color:var(--dsw-alias-label-dimmed);font:var(--dsw-font-xxxs-11)}
-.dsh-my-observability-error{display:flex;align-items:center;gap:6px;padding:8px 6px;font:var(--dsw-font-xxs-12);
-  color:var(--dsw-alias-state-error-primary);white-space:pre-wrap;word-break:break-all;line-height:1.7}
-.dsh-my-observability-error-text{flex:1;min-width:0}
-@keyframes dsh-my-observability-row-in{from{opacity:0;transform:translateY(1px)}to{opacity:1;transform:none}}
-@keyframes dsh-my-observability-spin{to{transform:rotate(360deg)}}
-/* ── 审计视图：搜索 / 组合过滤 / 导出 / 统计 / 高亮 ── */
-.dsh-my-observability-search-row{display:flex;align-items:center;gap:6px}
-.dsh-my-observability-search-row .dsh-my-observability-input{flex:1}
-.dsh-my-observability-time-row{display:flex;align-items:center;gap:6px}
-.dsh-my-observability-time-label{flex:none;font:var(--dsw-font-xxxs-11);color:var(--dsw-alias-label-tertiary)}
-.dsh-my-observability-time-input{flex:1;min-width:0}
-.dsh-my-observability-mark{background:color-mix(in srgb, var(--dsw-alias-state-warn-primary) 30%, transparent);
-  color:var(--dsw-alias-label-primary);border-radius:2px;padding:0 1px}
-.dsh-my-observability-export{display:flex;flex-direction:column;gap:6px}
-.dsh-my-observability-stats{display:flex;flex-direction:column;gap:6px;border:1px solid var(--dsw-alias-border-l2);
-  border-radius:6px;padding:8px}
-.dsh-my-observability-stats-title{font:var(--dsw-font-xs-strong-13);color:var(--dsw-alias-label-primary)}
-.dsh-my-observability-stats-table{width:100%;border-collapse:collapse;font:var(--dsw-font-xxs-12)}
-.dsh-my-observability-stats-table th,.dsh-my-observability-stats-table td{text-align:left;padding:3px 6px;
-  border-bottom:1px solid var(--dsw-alias-border-l2);color:var(--dsw-alias-label-secondary)}
-.dsh-my-observability-stats-table th{font:var(--dsw-font-xxxs-strong-11);color:var(--dsw-alias-label-tertiary)}
-.dsh-my-observability-stats-empty{font:var(--dsw-font-xxs-12);color:var(--dsw-alias-label-tertiary);padding:6px 2px}
-/* ── Git 面板 ── */
-.dsh-my-observability-status{font:var(--dsw-font-xxs-strong-12);color:var(--dsw-alias-label-secondary)}
-.dsh-my-observability-actions{display:flex;gap:8px;flex-wrap:wrap}
-.dsh-my-observability-btn{font:var(--dsw-font-xxs-strong-12);color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-layer-2);
-  border:1px solid var(--dsw-alias-border-l2);border-radius:6px;padding:4px 12px;cursor:pointer;
-  transition:background var(--ds-transition-duration-slow) var(--ds-ease-in-out), color var(--ds-transition-duration-slow) var(--ds-ease-in-out), border-color var(--ds-transition-duration-slow) var(--ds-ease-in-out)}
-.dsh-my-observability-btn:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}
-.dsh-my-observability-btn:disabled{opacity:.5;cursor:default}
-.dsh-my-observability-btn-primary{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-interactive-primary);
-  background:color-mix(in srgb, var(--dsw-alias-interactive-primary) 16%, transparent)}
-.dsh-my-observability-section{display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--dsw-alias-border-l2);padding-top:8px}
-.dsh-my-observability-section-title{font:var(--dsw-font-xs-strong-13);color:var(--dsw-alias-label-primary)}
-.dsh-my-observability-diff{max-height:240px;overflow:auto;font:var(--dsw-font-mono-xxs);font-size:11px;line-height:1.5;
-  color:var(--dsw-alias-label-secondary);background:var(--dsw-alias-bg-layer-1);border:1px solid var(--dsw-alias-border-l2);
-  border-radius:6px;padding:8px;white-space:pre-wrap;word-break:break-all}
-.dsh-my-observability-form{display:flex;flex-direction:column;gap:6px}
-.dsh-my-observability-type{flex:none;width:96px}
-.dsh-my-observability-textarea{min-height:52px;resize:vertical;font:var(--dsw-font-xxs-12)}
-.dsh-my-observability-feedback{font:var(--dsw-font-xxs-12);word-break:break-all;line-height:1.5}
-.dsh-my-observability-feedback-ok{color:var(--dsw-alias-state-success-primary)}
-.dsh-my-observability-feedback-error{color:var(--dsw-alias-state-error-primary)}
-.dsh-my-observability-issue{display:flex;flex-direction:column;gap:2px;border-radius:6px;padding:6px 8px;font:var(--dsw-font-xxs-12)}
-.dsh-my-observability-issue-error{background:color-mix(in srgb, var(--dsw-alias-state-error-primary) 12%, transparent)}
-.dsh-my-observability-issue-warning{background:color-mix(in srgb, var(--dsw-alias-state-warn-primary) 12%, transparent)}
-.dsh-my-observability-issue-info{background:color-mix(in srgb, var(--dsw-alias-state-info-primary) 10%, transparent)}
-.dsh-my-observability-issue-sev{font:var(--dsw-font-xxxs-strong-11);text-transform:uppercase}
-.dsh-my-observability-issue-error .dsh-my-observability-issue-sev{color:var(--dsw-alias-state-error-primary)}
-.dsh-my-observability-issue-warning .dsh-my-observability-issue-sev{color:var(--dsw-alias-state-warn-primary)}
-.dsh-my-observability-issue-info .dsh-my-observability-issue-sev{color:var(--dsw-alias-state-info-primary)}
-.dsh-my-observability-issue-rule{font:var(--dsw-font-mono-xxs);font-size:11px;color:var(--dsw-alias-label-secondary)}
-.dsh-my-observability-issue-msg{color:var(--dsw-alias-label-primary);line-height:1.5}
-.dsh-my-observability-review-ok{font:var(--dsw-font-xxs-strong-12);color:var(--dsw-alias-state-success-primary)}
-.dsh-my-observability-ai{font:var(--dsw-font-xxs-12);color:var(--dsw-alias-label-secondary);line-height:1.5;
-  border:1px dashed var(--dsw-alias-border-l2);border-radius:6px;padding:6px 8px}
-.dsh-my-observability-resource{border:1px solid var(--dsw-alias-border-l2);border-radius:8px;padding:8px;margin:0 0 8px}
-.dsh-my-observability-resource-head{font:var(--dsw-font-xxs-strong-12);color:var(--dsw-alias-label-primary);margin-bottom:6px}
-.dsh-my-observability-resource-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 10px}
-.dsh-my-observability-resource-metric{display:flex;justify-content:space-between;gap:8px;font:var(--dsw-font-xxs-12)}
-.dsh-my-observability-resource-label{color:var(--dsw-alias-label-secondary)}
-.dsh-my-observability-resource-value{color:var(--dsw-alias-label-primary);font-family:var(--dsw-font-mono-xxs)}
-.dsh-my-observability-resource-alerts{margin-top:6px;display:flex;flex-direction:column;gap:4px}
-.dsh-my-observability-resource-alert{font:var(--dsw-font-xxxs-11);border-radius:4px;padding:2px 6px}
-.dsh-my-observability-resource-alert-error{color:var(--dsw-alias-state-error-primary);background:color-mix(in srgb,var(--dsw-alias-state-error-primary) 12%,transparent)}
-.dsh-my-observability-resource-alert-warn{color:var(--dsw-alias-state-warn-primary);background:color-mix(in srgb,var(--dsw-alias-state-warn-primary) 12%,transparent)}
-`
-
-function injectStyles() {
-  if (typeof document === 'undefined' || typeof document.head === 'undefined') return () => {}
-  const style = document.createElement('style')
-  style.setAttribute('data-dsh-my-observability', 'styles')
-  style.textContent = STYLES
-  document.head.appendChild(style)
-  return () => {
-    if (style.parentNode !== null) style.parentNode.removeChild(style)
-  }
-}