ClaudeMods
☰
ZH-CN
● 0 人在线 · 浏览 0 次
赞助提交作品
GitHub 仓库 · 发布者 oMaN-Rod

mosaic-widget

每次工具调用都会增加一块、按工具着色的马赛克,直到整个会话拼成一幅图。

oMaN-Rod@oMaN-Rod

oMaN-Rod/claude-code-widgets/tree/main/plugins/mosaic-widget

已翻译

关于这个 mod

Claude Code Widgets

显示在 Claude Code 提示列下方,或在全屏时停靠在文字记录旁的小卡片。每个小工具都是独立的插件,可以用斜杠命令切换。

最初只有几个实用的小工具(上下文、用量、文件树),后来越做越多:现在共有 61 个小工具,从 git 状态和回合计时器,到像素螃蟹、地牢探索和 Tetris 都有。

安装

添加 marketplace,然后安装布局插件和你想要的小工具:

/plugin marketplace add oMaN-Rod/claude-code-widgets
/plugin install widgets@claude-code-widgets
/plugin install context-widget@claude-code-widgets

每个小工具都需要 widgets,也就是负责放置卡片的布局插件。

需要支持 mod(function hook)的 Claude Code 版本。mod API 目前处于早期体验阶段,版本更新时可能发生变化。

小工具

布局

所有小工具都需要。

| 插件 | 命令 | 显示内容 | | --- | --- | --- | | widgets | /widgets [side\|above\|below\|close\|<columns>\|width <widget> <columns\|reset>] | 将卡片放在提示列下方、上方,或在全屏时停靠在文字记录旁 |

会话

Claude 正在做什么,以及花费了多少。

| 插件 | 命令 | 显示内容 | | --- | --- | --- | | context-widget | /context-widget [auto\|detailed\|grid\|top\|bar\|line] | 将上下文窗口显示为堆叠条,每个 /context 类别使用一种颜色 | | usage-widget | /usage-widget | 每个速率限制窗口的条形图、重置倒计时,以及会话花费 | | timer-widget | /timer-widget [on\|off\|clear] | 当前回合经过的时间,以及上一次、平均和最长回合时间与迷你图 | | activity-widget | /activity-widget [on\|off\|clear] | 最新的工具调用、执行时长,以及是否失败 | | tasks-widget | /tasks-widget [on\|off\|clear] | Claude 正在处理的任务列表,以及进度条 | | checks-widget | /checks-widget [on\|off\|clear] | 最近的测试、lint 和构建运行结果:成功或失败、耗时,以及距今多久 | | timeline-widget | /timeline-widget [on\|off] | 将回合显示为图表:时间轴上每次工具调用一条长条,平行调用会堆叠排列 | | board-widget | /board-widget [on\|off\|clear] | Claude 通过 pin 工具自行写入的状态板:目标、发现和待解问题 | | forecast-widget | /forecast-widget [on\|off\|clear] | 以图表显示每回合的上下文增长量,以及压缩前剩余的回合数 | | guard-widget | /guard-widget [on\|off\|clear] | 本次会话的权限检查:允许、询问和拒绝的项目,以及反复要求你处理的内容 | | stream-widget | /stream-widget [on\|off] | 实时每秒 token 量表和迷你图,写作时根据文字长度估算 | | sessions-widget | /sessions-widget [on\|off] | 这台机器上打开的其他 Claude Code 会话:文件夹、分支、忙碌或空闲状态 |

项目与 git

工作树的状态。

| 插件 | 命令 | 显示内容 | | --- | --- | --- | | file-tree-widget | /file-tree-widget | 项目目录;点击即可展开文件夹 | | git-widget | /git-widget | 分支、领先/落后、已暂存、已修改与未跟踪的数量,以及最近一次 commit | | changes-widget | /changes-widget [on\|off\|clear] | 本次会话编辑过的文件,最近编辑的排在前面,并显示每个文件的编辑次数 | | commits-widget | /commits-widget | 会话开始后创建的 commit | | todos-widget | /todos-widget | 受跟踪文件中的 TODO、FIXME、HACK 和 XXX 注释,计数并列出 | | diff-widget | /diff-widget [on\|off\|clear] | 最近一次编辑,以语法高亮显示差异 | | watch-widget | /watch-widget [on\|off\|run\|stop], /watch <command> | /watch bun test 会在每次编辑后重新运行命令,显示成功或失败指示灯和最近失败的几行内容 | | map-widget | /map-widget [on\|off\|clear] | 受跟踪文件的像素地图;Claude 读过的文件亮蓝色,编辑过的亮绿色 |

时间与专注

不依赖会话的时钟、计时器和提醒。

| 插件 | 命令 | 显示内容 | | --- | --- | --- | | pomodoro-widget | /pomodoro-widget [on\|off\|start\|break\|stop\|<minutes>] | 专注计时器,包含倒计时、进度条和已完成会话的数量 | | countdown-widget | /countdown-widget [on\|off\|clear], /countdown <HH:MM\|<n>m\|<n>h> [label] | 你设置的截止时间还剩多久,附进度条和时间到达时的 toast | | clocks-widget | /clocks-widget [on\|off\|add <zone>\|remove <zone>\|clear] | 在你添加的时区旁显示本地时间,例如 Asia/Tokyo | | notes-widget | /notes-widget [on\|off\|clear], /note <text\|done <n>> | 可跨会话保留的置顶笔记;/note <text> 会添加一条,/note done <n> 会移除它 | | coffee-widget | /coffee-widget [on\|off\|refill\|<minutes>] | 一杯会在 90 分钟内喝完的咖啡,提醒你休息 |

场景

会对回合、工具调用、检查和上下文用量做出反应的像素艺术。

| 插件 | 命令 | 显示内容 | | --- | --- | --- | | pet-widget | /pet-widget [on\|off\|<mood>] | 像素螃蟹 Clawd:回合进行时工作,工具调用失败时头晕,测试通过时开心。会跨会话积累 XP 并升级;badges-widget 颁发徽章后会戴上帽子;打开两个会话时,会留在你最后输入提示的那个会话中 | | aquarium-widget | /aquarium-widget [on\|off\|demo] | 每个正在运行的工具调用和代理各有一条鱼 | | skyline-widget | /skyline-widget [on\|off\|demo\|clear] | 每回合一栋建筑,每次工具调用一层楼 | | train-widget | /train-widget [on\|off] | 火车头在本回合每次工具调用拉着一节车厢,并按工具着色 | | garden-widget | /garden-widget [on\|off\|reset] | 一株植物:每次工具调用长出一片叶子,检查通过时开花,调用失败时枯萎 | | campfire-widget | /campfire-widget [on\|off\|stoke] | 工具调用越多,篝火烧得越旺;空闲时逐渐只剩余烬 | | constellation-widget | /constellation-widget [on\|off\|clear] | 每回合一颗星,连成星座,九颗后会获得名称 | | fireworks-widget | /fireworks-widget [on\|off\|demo] | 检查通过时在夜空中放烟花,失败时出现哑炮 | | invaders-widget | /invaders-widget [on\|off\|demo\|clear] | 每次检查失败就出现一个入侵者;检查通过时会将它们击落 | | weather-widget | /weather-widget [on\|off\|live\|<percent>] | 上下文还有空间时是晴天,接近压缩时变成暴风雨 | | boss-widget | /boss-widget [on\|off] | 将上下文用量显示为首领生命条;压缩会击败它并开始下一个等级 | | sky-widget | /sky-widget [on\|off] | 按你的当地时间显示天空:白天是太阳,晚上是月亮;会话运行越久,星星越多 | | world-widget | /world-widget [on\|off\|clear] | 将所有内容放在一个场景中:天空随时钟变化,天气随上下文变化,每回合一座高塔,工具调用组成一列火车,还有一只漫步的螃蟹 | | quest-widget | /quest-widget [on\|off\|reset] | 将会话变成地牢探索:每回合一个房间,每次工具调用一只怪物,检查通过时获得战利品;英雄会跨会话保留 | | race-widget | /race-widget [on\|off\|clear] | 平行子代理变成赛道上的赛车,每次工具调用前进一步,完成时登上领奖台 |

可视化

由工具活动驱动的抽象图像。

| 插件 | 命令 | 显示内容 | | --- | --- | --- | | mosaic-widget | /mosaic-widget [on\|off\|clear] | 每次工具调用一块,按工具着色;失败时为红色 | | sorting-widget | /sorting-widget [on\|off\|step] | 正在排序的条形图,每次工具调用交换一次 | | equalizer-widget | /equalizer-widget [on\|off] | 每次工具调用都会跳动、空闲时回落的电平表 | | rain-widget | /rain-widget [on\|off] | 随回合繁忙程度加速落下的代码雨 | | orbit-widget | /orbit-widget [on\|off] | 小型太阳系;工具调用运行时行星会加速 | | life-widget | /life-widget [on\|off\|reset] | Conway's Game of Life;每次工具调用都会放下一架滑翔机 | | donut-widget | /donut-widget [on\|off] | 旋转的 3D 甜甜圈;工具调用运行时转得更快 | | pipes-widget | /pipes-widget [on\|off] | pipes 屏幕保护程序;会话空闲时延伸,Claude 工作时暂停 | | maze-widget | /maze-widget [on\|off\|new] | 以项目文件夹为种子的第一人称迷宫探索 | | marquee-widget | /marquee-widget [on\|off\|clear\|<text>] | 滚动会话事件的 LED 跑马灯;其他文字会发布成你自己的标题 |

游戏

Snake、2048 和 Tetris 会自动游玩,直到你点击棋盘并接管按键。

| 插件 | 命令 | 显示内容 | | --- | --- | --- | | snake-widget | /snake-widget [on\|off] | Snake;在你接管按键前会自动游玩 | | 2048-widget | /2048-widget [on\|off] | 2048;在你接管按键前会自动游玩 | | tetris-widget | /tetris-widget [on\|off] | Tetris;在你接管按键前会自动游玩 | | minesweeper-widget | /minesweeper-widget [on\|off] | Minesweeper:点击揭开格子,右键或按 f 插旗,按 r 重新开始 | | breakout-widget | /breakout-widget [on\|off\|reset] | 自动游玩的打砖块游戏;每次工具调用增加一排砖块 | | typer-widget | /typer-widget [on\|off] | 打字游戏:你自己的文件名中的文字会落下,你要在它们落地前打出来 |

只是好玩

| 插件 | 命令 | 显示内容 | | --- | --- | --- | | fortune-widget | /fortune-widget [on\|off\|next] | 每回合都会变化的一行运势 | | 8ball-widget | /8ball-widget [on\|off], /8ball <question> | /8ball <question> 会给出可靠性存疑的答案 | | badges-widget | /badges-widget [on\|off\|reset] | 跨会话获得的成就,解锁时显示 toast | | sigil-widget | /sigil-widget [on\|off\|clear] | 根据本次会话活动生成的像素徽记,旁边还有更早会话的徽记画廊 | | sound-widget | /sound-widget [on\|off\|mute\|test] | 每次工具调用一个音符,检查通过时一个和弦,失败时一声嗡鸣,并附钢琴卷帘(音频仅在 macOS 播放) |

小工具的放置位置、启用状态和查看模式,会在每个会话中保存并恢复。

注意事项

  • /widgets width pet 60 设置单个小工具卡片可以增长到的宽度(默认是 40 列);/widgets width pet reset 会恢复设置。
  • /widgets side 只有在全屏布局(/tui fullscreen)中才会将卡片停靠在文字记录旁。在默认布局中,它会退回到提示列下方。
  • 像素艺术使用终端区块字符绘制,只显示在终端中。
  • sound-widget 只在 macOS 播放音频;其他平台保持静音,只绘制钢琴卷帘。
  • board-widget 会注册一个 Claude 可以调用的 pin 工具,因此状态板开启时,它的描述会成为上下文的一部分。
  • watch-widget 通过 sh -c 运行你的命令,不可用时退回到 cmd /c。
  • 接管游戏,以及进行 Minesweeper,都需要点击棋盘;全屏布局会报告这次点击。

开发

plugins/ 下的每个插件都是一个 mod:包含 manifest、hooks 模块及其测试。

claude --plugin-dir plugins            # 加载此 checkout 中的所有插件
claude plugin validate plugins/<name>  # 检查 manifest 和 hooks 模块
claude plugin test plugins/<name>      # 运行插件测试

插件彼此不能互相 import,因此 widgets 会通过 $.widgets(plugins/widgets/hooks/kit.tsx)共享卡片堆叠和像素渲染器,每个小工具都会调用它。

许可证

MIT

安装

请先查看作者 README 确认 marketplace 和插件名称;命令可能随仓库结构改变。

claude plugin marketplace add oMaN-Rod/claude-code-widgets
claude plugin install mosaic-widget
原文 / README

Claude Code Widgets

Small cards that sit under the Claude Code prompt, or docked beside the transcript in fullscreen. Each widget is its own mod, toggled with a slash command.

It started with a few useful ones (context, usage, file tree) and then got carried away: there are now 61 widgets, from git status and a turn timer to a pixel crab, a dungeon crawl and Tetris.

Install

Add the marketplace, then install the layout plugin and whichever widgets you want:

/plugin marketplace add oMaN-Rod/claude-code-widgets
/plugin install widgets@claude-code-widgets
/plugin install context-widget@claude-code-widgets

Every widget needs widgets, the layout plugin that places the cards.

Requires a Claude Code version with mod (function hook) support. The mod API is early access and may change between releases.

Widgets

Layout

Required by every widget.

| Plugin | Command | What it shows | | --- | --- | --- | | widgets | /widgets [side\|above\|below\|close\|<columns>\|width <widget> <columns\|reset>] | Places the cards: below the prompt, above it, or docked beside the transcript in fullscreen |

Session

What Claude is doing and what it is costing.

| Plugin | Command | What it shows | | --- | --- | --- | | context-widget | /context-widget [auto\|detailed\|grid\|top\|bar\|line] | The context window as a stacked bar, one colour per /context category | | usage-widget | /usage-widget | A bar per rate-limit window, time to reset, session cost | | timer-widget | /timer-widget [on\|off\|clear] | The running turn's elapsed time, plus last, average and longest turn and a sparkline | | activity-widget | /activity-widget [on\|off\|clear] | The latest tool calls with their duration and whether they failed | | tasks-widget | /tasks-widget [on\|off\|clear] | The task list Claude is working through, with a progress bar | | checks-widget | /checks-widget [on\|off\|clear] | The latest test, lint and build runs: pass or fail, duration and how long ago | | timeline-widget | /timeline-widget [on\|off] | The turn as a chart: one bar per tool call on a time axis, parallel calls stacked | | board-widget | /board-widget [on\|off\|clear] | A status board Claude writes itself through a pin tool: goal, findings and open questions | | forecast-widget | /forecast-widget [on\|off\|clear] | Context growth per turn as a chart, with the turns left before compaction | | guard-widget | /guard-widget [on\|off\|clear] | Permission checks this session: allowed, asked and denied, with what you keep being asked about | | stream-widget | /stream-widget [on\|off] | A live tokens-per-second gauge and sparkline while Claude is writing (estimated from text length) | | sessions-widget | /sessions-widget [on\|off] | The other Claude Code sessions open on this machine: folder, branch, busy or idle |

Project and git

The state of the working tree.

| Plugin | Command | What it shows | | --- | --- | --- | | file-tree-widget | /file-tree-widget | The project directory; folders expand on click | | git-widget | /git-widget | Branch, ahead/behind, staged, changed and untracked counts, and the last commit | | changes-widget | /changes-widget [on\|off\|clear] | Files edited this session, most recent first, with an edit count each | | commits-widget | /commits-widget | The commits made since the session started | | todos-widget | /todos-widget | TODO, FIXME, HACK and XXX comments in tracked files, counted and listed | | diff-widget | /diff-widget [on\|off\|clear] | The last edit as a syntax-highlighted diff | | watch-widget | /watch-widget [on\|off\|run\|stop], /watch <command> | /watch bun test reruns the command after every edit: a pass or fail light and the last failing lines | | map-widget | /map-widget [on\|off\|clear] | A pixel map of the tracked files, lit blue where Claude has read and green where it has edited |

Time and focus

Clocks, timers and reminders that do not depend on the session.

| Plugin | Command | What it shows | | --- | --- | --- | | pomodoro-widget | /pomodoro-widget [on\|off\|start\|break\|stop\|<minutes>] | A focus timer with a countdown, a progress bar and a count of finished sessions | | countdown-widget | /countdown-widget [on\|off\|clear], /countdown <HH:MM\|<n>m\|<n>h> [label] | Time left to a deadline you set, with a progress bar and a toast when it arrives | | clocks-widget | /clocks-widget [on\|off\|add <zone>\|remove <zone>\|clear] | Your local time beside the time zones you add, such as Asia/Tokyo | | notes-widget | /notes-widget [on\|off\|clear], /note <text\|done <n>> | Pinned notes kept across sessions; /note <text> adds one, /note done <n> removes it | | coffee-widget | /coffee-widget [on\|off\|refill\|<minutes>] | A cup that empties over 90 minutes and nudges you to take a break |

Scenes

Pixel art that reacts to turns, tool calls, checks and context usage.

| Plugin | Command | What it shows | | --- | --- | --- | | pet-widget | /pet-widget [on\|off\|<mood>] | Clawd, a pixel crab: works during a turn, dizzy when a tool call fails, happy when tests pass. Earns XP and levels up across sessions, wears a hat once badges-widget has awarded a badge, and with two sessions open stays in the one you last prompted | | aquarium-widget | /aquarium-widget [on\|off\|demo] | A fish for every running tool call and agent | | skyline-widget | /skyline-widget [on\|off\|demo\|clear] | One building per turn, one floor per tool call | | train-widget | /train-widget [on\|off] | A locomotive pulling one wagon per tool call this turn, coloured by tool | | garden-widget | /garden-widget [on\|off\|reset] | A plant: a leaf per tool call, a flower when checks pass, wilting when a call fails | | campfire-widget | /campfire-widget [on\|off\|stoke] | A campfire that burns higher with tool calls and dies down to embers when idle | | constellation-widget | /constellation-widget [on\|off\|clear] | A star per turn, joined into a constellation that gets a name after nine | | fireworks-widget | /fireworks-widget [on\|off\|demo] | A night sky that sets off fireworks when checks pass, and a dud when they fail | | invaders-widget | /invaders-widget [on\|off\|demo\|clear] | An invader arrives for every failing check; passing checks shoot them down | | weather-widget | /weather-widget [on\|off\|live\|<percent>] | Clear sky when context has room, a storm near compaction | | boss-widget | /boss-widget [on\|off] | Context usage as a boss health bar; compaction defeats it and starts the next level | | sky-widget | /sky-widget [on\|off] | The sky at your local time: sun by day, moon by night, more stars the longer the session runs | | world-widget | /world-widget [on\|off\|clear] | One scene for everything: sky by the clock, weather by context, a tower per turn, a train of tool calls and a wandering crab | | quest-widget | /quest-widget [on\|off\|reset] | The session as a dungeon crawl: a room per turn, a monster per tool call, loot when checks pass; the hero is kept across sessions | | race-widget | /race-widget [on\|off\|clear] | Parallel subagents as cars on a track, one stride per tool call, with a podium as they finish |

Visualizers

Abstract pictures driven by tool activity.

| Plugin | Command | What it shows | | --- | --- | --- | | mosaic-widget | /mosaic-widget [on\|off\|clear] | One tile per tool call, coloured by tool; failures are red | | sorting-widget | /sorting-widget [on\|off\|step] | A bar chart being sorted, one swap per tool call | | equalizer-widget | /equalizer-widget [on\|off] | Level meters that jump with each tool call and fall back to rest | | rain-widget | /rain-widget [on\|off] | Falling code rain that speeds up the busier the turn gets | | orbit-widget | /orbit-widget [on\|off] | A small solar system; the planets speed up while tool calls run | | life-widget | /life-widget [on\|off\|reset] | Conway's Game of Life; every tool call drops a glider | | donut-widget | /donut-widget [on\|off] | The spinning 3D donut; it spins faster while tool calls run | | pipes-widget | /pipes-widget [on\|off] | The pipes screensaver; it grows while the session is idle and pauses while Claude works | | maze-widget | /maze-widget [on\|off\|new] | A first-person walk through a maze seeded by the project folder | | marquee-widget | /marquee-widget [on\|off\|clear\|<text>] | An LED ticker scrolling session events; any other text posts your own headline |

Games

Snake, 2048 and Tetris play themselves until you click the board and take the keys.

| Plugin | Command | What it shows | | --- | --- | --- | | snake-widget | /snake-widget [on\|off] | Snake; it plays itself until you take the keys | | 2048-widget | /2048-widget [on\|off] | 2048; it plays itself until you take the keys | | tetris-widget | /tetris-widget [on\|off] | Tetris; it plays itself until you take the keys | | minesweeper-widget | /minesweeper-widget [on\|off] | Minesweeper: click to reveal, right-click or f to flag, r to restart | | breakout-widget | /breakout-widget [on\|off\|reset] | A self-playing brick breaker; every tool call adds a row of bricks | | typer-widget | /typer-widget [on\|off] | A typing game: words from your own file names fall, and you type them before they land |

Just for fun

| Plugin | Command | What it shows | | --- | --- | --- | | fortune-widget | /fortune-widget [on\|off\|next] | A one-line fortune that changes with every turn | | 8ball-widget | /8ball-widget [on\|off], /8ball <question> | /8ball <question> gives an answer of doubtful reliability | | badges-widget | /badges-widget [on\|off\|reset] | Achievements earned across sessions, with a toast when one unlocks | | sigil-widget | /sigil-widget [on\|off\|clear] | A pixel emblem generated from this session's activity, beside a gallery of the ones from earlier sessions | | sound-widget | /sound-widget [on\|off\|mute\|test] | A note per tool call, a chord when checks pass, a buzz on failure, with a piano roll (audio plays on macOS only) |

Placement, which widgets are on, and view modes are saved and restored in every session.

Notes

  • /widgets width pet 60 sets how wide one widget's card may grow (the default is 40 columns); /widgets width pet reset puts it back.
  • /widgets side docks the cards beside the transcript only in the fullscreen layout (/tui fullscreen). In the default layout it falls back to below the prompt.
  • The pixel art is drawn with terminal block characters and shows in the terminal only.
  • sound-widget plays audio on macOS only; elsewhere it stays silent and just draws the piano roll.
  • board-widget registers a pin tool that Claude can call, so its description is part of the context while the board is on.
  • watch-widget runs your command through sh -c, falling back to cmd /c.
  • Taking over a game, and playing Minesweeper at all, needs a mouse click on the board, which the fullscreen layout reports.

Develop

Each plugin under plugins/ is a mod: a manifest, a hooks module and its tests.

claude --plugin-dir plugins            # load every plugin from this checkout
claude plugin validate plugins/<name>  # check a manifest and hooks module
claude plugin test plugins/<name>      # run its tests

Plugins cannot import from one another, so widgets shares card stacking and the pixel renderer as $.widgets (plugins/widgets/hooks/kit.tsx), which every widget calls.

License

MIT

更多类似作品