npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

dsh-question-anchor

v0.1.2

Published

Anchor (锚点): a floating question anchor for the DSH Web GUI. When a session is selected from the sidebar, a floating vertical strip appears on the right edge of the screen listing the user's questions in that session; clicking a question jumps the convers

Readme

Anchor(锚点)

DSH Web GUI 的会话问题锚点插件。名字 "anchor" = 锚点:它只呈现"你"在这个会话里问过的问题,并锚定每条提问在会话中的位置。

功能

  • 从左侧 sidebar 选中一个会话后,屏幕右侧悬浮出现一个竖条浮动窗口(类似 VS Code 的代码缩略地图)。
  • 窗口里按顺序列出该会话中你的每条提问(问题文本缩略显示,编号 1..N)。
  • 点击某条问题,会话滚动到该问题所在位置,并短暂高亮该消息。
  • 随着会话滚动,当前位于视口顶部的问题会在列表中高亮。
  • 头部 "—" 按钮可把窗口折叠成右侧一个小竖标签,点击标签重新展开。
  • 没有会话/没有提问时窗口自动隐藏。

设置开关

设置 → 插件 → 插件配置 → Anchor 卡片 → 开关 栏:

  • 「启用 Anchor 问题锚点」复选框即时生效(开关即加载开关:关闭立即卸载浮动窗口,开启立即挂载)。
  • 状态持久化在浏览器 localStorage(anchor:enabled)。

热加载

该插件是热加载的:dsh web 的 client-hmr 每 500ms 轮询已注册 bundle 的 lib/client.js,内容变化会通过 SSE 推送,浏览器无需刷新即可重新加载本插件 (settings 卡片与浮动窗口一起重建)。修改 lib/client.js 后保存即可。

目录

anchor/
  package.json         # dsh.client 声明(platform: web, inject: slots+locale)
  lib/index.js         # host 半区占位(无 host 行为)
  lib/client.js        # 全部逻辑:浮动锚点 + 设置卡片
  cordis.patch.yml     # 把 anchor 行插入 bundle 组合
  restart-web.ps1      # 部署辅助:重启 dsh web 使插件进入启动清单

部署

  1. 把本目录 link 进 web profile 并在 dsh.profile.bundles 中登记:

    ~/.dsh/profiles/web/package.json:

    "dependencies": { ..., "anchor": "link:<本仓库本地目录>" },
    "dsh": { "profile": { "bundles": [ ..., "anchor" ] } }
  2. 在 profile 目录执行 pnpm install(生成 node_modules/anchor 链接)。

  3. 重启 dsh web(新增插件需要重启才会进入浏览器启动清单;已注册插件的内容 修改则无需重启,见"热加载")。可运行 .\restart-web.ps1 自动重启(旧控制台 窗口会显示已停止,可关闭;新服务器在后台运行,日志见 ~/.dsh/anchor-web-restart.out.log / .err.log)。

实现说明(DOM 契约)

插件不依赖任何会话数据接口,纯粹基于渲染后的 DOM:

  • 用户提问行:[data-chat-flow-kind="user"](ui-conversation 的 ChatNodeSeat 在每条节点行上输出 data-chat-flow-key / data-chat-flow-kind)。
  • 滚动容器:[data-conversation-scroll];主会话限定在中间列 [class$="_centerCol"](子会话/详情面板里的对话不会被算进来)。
  • 问题文本取自用户气泡 [class$="_bubble"] 的 innerText。
  • MutationObserver 监听 DOM 变化(会话切换、加载更早、新消息都会触发重建), 以 data-chat-flow-key 拼接签名去重,避免无谓重建。

类名后缀(_centerCol、_bubble)是 CSS Module 的稳定 local-name 后缀, 跨构建 hash 前缀变化也能匹配,与 dsh-bg 插件同一策略。