中文EN

@lucagiftzek/dsh-artifacts

uinpmMIT

DSH 侧栏里的 Artifacts 标签页:列出 agent 产出的文件并就地预览、支持实时刷新,另提供 artifact 模板工具。

下载量 / Downloads
455

安装

dsh plugin --profile web add @lucagiftzek/dsh-artifacts

沙箱测试

这个插件还没测过。提交测试 →

README

dsh-artifacts 2

![npm](https://www.npmjs.com/package/@lucagiftzek/dsh-artifacts)

An Artifacts tab that previews every file your agents make, with live reload, version history and templates.

Install from npm: dsh plugin --profile web add @lucagiftzek/dsh-artifacts, or from GitHub: dsh plugin --profile web add github:lucagiftzek/dsh-artifacts.

dsh plugin --profile web add dsh-better-sidebar   # the tab host, skip if installed
dsh plugin --profile web add @lucagiftzek/dsh-artifacts
# or from GitHub: dsh plugin --profile web add github:lucagiftzek/dsh-artifacts
# restart dsh web; the /report/ server module goes into your reverse proxy (see Install / operate)

<sub>Screenshot from a demo DSH instance with sample data.</sub>

Artifacts for the DeepSeek Harness web GUI: a sidebar tab, a server, a bridge and

a CLI that together turn ~/reports/ into a Claude/ChatGPT/Gemini-class artifact

system, with lower long-term token use, real web apps, two-way interaction with

the chat, version history, and image / speech / video generation.

agent ──write/edit .md, .html, app/──▶ ~/reports/ ──▶ artifact server (in your DSH reverse proxy)

▲ │ md→html, apps, media, _lib, bridge, API

│ artifact inbox / state ▼

└──── chat ◀── dsh.send / forms / pick-and-ask ── Artifacts sidebar tab (iframe)

What is in the box

Part · Path · Role

Sidebar tab · src/client.jsx → lib/client.js · list (This chat / All, search, kinds, Hidden) with thumbnails and a download icon per row, detail with Preview / Source / Changes, the media and file viewer page, downloads, version arrows + restore, pick-and-ask, "Fix with agent", public toggle, de-list, trash, inbox banner; chat links to ~/reports/* open here rendered

Server module · server/artifacts_server.py, files.py, viewer.py · imported by your DSH reverse proxy; owns /report/ and /report-public/: rendering, the enclosure page for media and files, downloads, Range, thumbnails, listing state

Indexer · server/indexer.py · niced child process: incremental transcript attribution + version snapshots

Bridge · server/bridge.js · injected into every served HTML page: window.dsh, Claude/OpenAI aliases, live reload

Media + AI · server/media.py · Mistral (Vibe subscription) chat + FLUX images, Voxtral TTS/STT, DashScope, local ComfyUI, Gemini video (opt-in)

Kit · contrib/artifact-kit · Markdown → themed HTML (kpi, charts, callouts, timeline, progress, columns, details, mermaid, math, actions, forms, media, figures, pull quotes, lead, footnotes; templates report, dashboard, plan, comparison, brief, article)

CLI · contrib/artifact · the agent interface: new, list, add, remove, relist, retitle, show, versions, diff, restore, inbox, state, state-set, public, media, libs, motion, export

Motion · contrib/motion.py + motion/ (npm: hyperframes) · animated explainers as code: artifact new X --type motion scaffolds X.html (player: scrubber, scene chips, timed change requests, export buttons, latest render) + X.motion/index.html (HyperFrames composition, one paused GSAP timeline); artifact motion check/snapshot/voice/export; renders locally or on a remote host over ssh+rsync (DSH_MOTION_REMOTE_HOSTS)

Templates · src/engine/*.ts → lib/engine/ + templates/ (scripts/sync-templates.sh) · reusable layouts, see [Templates](#templates): agent tools artifact_templates, artifact_template_info, artifact_from_template, artifact_template_save and the same in the CLI (JSON Schema validation, assets copied, lossless JSON output)

Agent tools + skill · lib/index.js → lib/tools.js, lib/listing.js (src/*.ts) · registered by the node half at start with guarded dynamic imports: the four template tools and artifact_list, artifact_add, artifact_remove, artifact_update; the packaged skill publish-artifact is registered with the host skill registry

Library shelf · vendor/ (scripts/vendor.sh) · React, ReactDOM, Babel, Recharts, Tailwind, preact-htm, Chart.js, d3, three, mermaid, KaTeX, lucide, marked, PapaParse, Leaflet, GSAP (+ plugins under gsap/), HyperFrames player/runtime at /report/_lib/

Skill · skills/publish-artifact/SKILL.md · how agents should use all of the above (registered automatically; a copy in ~/.dsh/skills wins)

Why v2 (what was broken in v1)

1. "This chat" was usually empty. Attribution rescanned a chat's transcripts on

every index request, keyed on the global file list (any new file anywhere forced

a 10-100 s rescan; the client waited 2 s), and it ignored tool/ptc-dispatch-start

rows whose arguments are objects, that is every write made from inside run_code.

v2 tails each zstd transcript frame by frame from a stored cursor (full backfill

of 892 MB: 75 s once; steady state: milliseconds) and also records explicit

claims from the CLI ($DSH_SESSION_ID). Index requests are ~30 ms with ETag/304.

2. The .md opened instead of the page. .md requested by a browser now renders

(?raw=1 or curl gets the source), md+html pairs are one artifact, /report/x.html

is rendered on the fly from x.md, and chat links to ~/reports/* open the

rendered artifact in the tab.

3. Kit pages did not adapt to text length. Long words, KPI values, table cells,

headings and TOC entries now wrap; widths adapt to the content (wide tables get a

wide page); chart label space is measured, long x labels rotate, labels with

commas parse, ticks are round numbers.

Token economics

  • Templates before everything: a known kind of deliverable is a JSON data file (a few

KB) filled into a finished layout, instead of a page written from scratch.

  • Markdown first (35-40 % fewer output tokens than hand-written HTML on a typical

report, far more with

…(truncated)

以上内容来自 npm 上的 README,我们只做格式化,不改内容。

版本

npm 上共发布:3,最后更新 2026-11-02

链接

GitHub · Homepage · npm

同类插件