764475881/dsh-chat-width

README 摘要

dsh-chat-width 调宽 dsh 网页会话区的聊天内容宽度。dsh 原生把会话文字列限制在 748px ，在大屏上左右浪费大量空间；本插件通过客户端 CSS 把 --dsh-chat-content-width 覆盖为 1040px （默认值，可调）。 输入框、底部工具栏等宽度由同一变量派生（ calc(var(--dsh-chat-content-width) + 32px) ），会自动跟着变宽。 调整宽度 两种方式，任选其一： 1. 拖拽把手 （推荐）：会话文字列 右缘 （垂直中点）有一个细长的竖向把手，鼠标按住左右拖动即可实时调整宽度，松开自动记忆。 双击把手恢复默认值 1040px 。把手的半透明样式与主题融合，悬停/拖动时高亮。 2. 控制台 （F12）： 选择会记忆到 localStorage（键 dsh chat width ），下次打开页面仍生效。 安装 方式一：插件市场（推荐） —— 在 dsh 网页的设置 → 插件市场中搜索 dsh-chat-width ，一键安装。 方式二：命令行 （dsh = 0.1.0-rc.7）： 方式三：本地开发（link） ： 卸载同理：从 package.json 的 dependencies 与 bundles 移除， pnpm install ，重启。 原理 - 服务端占位 lib/index.js ：空 apply ，仅让 loader 行可挂载。 - 客户端 lib/client.js ：注册为 DSH 客户端模块，注入 覆盖： - .wSkVaW root.wSkVaW root （当前 dsh 版本的会话根元素类名） - [data-phase][data-phase] （版本无关兜底选择器，特异性 (0,2,0) 压过 dsh 自带定义） - 拖拽把手 .dsh-cw-handle 绝对定位锚定在文字列右缘： right: calc((100% - var(--dsh-chat-content-width)) / 2 - 7px) ，宽度变化由 CSS 变量实时驱动，无需 JS 计算位置；pointer 事件 + setPointerCapture 完成拖拽，松手写入 localStorage。 - 跟手映射 ：文字列居中布局下右缘位移 = 宽度变化的一半，因此拖拽时宽度按指针位移的 2× 变化，把手（锚定右缘）才能 1:1 跟随鼠标，且列始终居中、松手无回弹。 - 会话根元素可能在 boot 后才挂载（hero 阶段），插件用 MutationObserver 跟随根元素出现/切换并挂载把手。 详细设计决策见 docs/DESIGN.md。 开发 改完 lib/client.js 后，运行中的 dsh 会在约 1 秒内通过 HMR 热替换（无需重启）。

分类