mcpField
S
superwall-editor

superwall-editor

github.com/superwall设计与 UI303.6k 次安装6 天前更新
代码仓库

关于 superwall-editor

superwall-editor 是用于创建、编辑和审查 Superwall 付费墙、引导流程及 web2app 流程的技能。它操作用户当前打开的浏览器编辑器,并实时发现可用工具,而非依赖固定工具名称。

主要功能

  1. 01连接实时编辑器会话
  2. 02发现当前工具及参数结构
  3. 03编辑付费墙和引导流程
  4. 04通过截图核验修改
  5. 05结束已连接的会话

适用场景

  1. 01创建或修改 Superwall 付费墙
  2. 02审查引导或 web2app 流程
  3. 03通过配对码连接
  4. 04查看浏览器中可用的工具

MCP 相关

该技能使用 MCP 网关所暴露的同一浏览器界面,连接实时编辑器会话并调用当时可用的工具。

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/superwall/skills --skill superwall-editor

安装后在 Claude Code 中输入/superwall-editor确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

references/
cli.md
design.md
native-elements.md
workflow.md
scripts/
sw-editor.sh

详细介绍

Superwall 付费墙编辑器

付费墙通过浏览器编辑器构建,该编辑器通过经过身份验证的中继公开其工具。此技能驱动的界面与 MCP 网关使用的界面相同,因此每个工具都会在用户当前打开的实时浏览器会话中运行。

适用场景

  • 用户想要构建、编辑或审核 Superwall 付费墙、引导流程或 web2app 流程。
  • 用户粘贴配对码,并要求你接手编辑。
  • 用户询问“你现在能运行哪些工具?”请通过浏览器发现工具,而不要凭记忆回答。

从这里开始:先连接,再发现

切勿凭记忆假定工具名称或签名。浏览器才是事实来源,工具集也会随版本更新而变化。

对于 --agent-name,请使用你的 Agent 所认可的标识名,例如 codex、claude 或 cursor。对于 Grok Build、Muse Code 或 CLI 参考中未列出的 Agent,请使用 other。

首选 API 启动流程:

  1. 创建自动公开 URL:scripts/sw-editor.sh expose --application-id <id> --paywall-id <id> --agent-name <agent> --open --wait
  2. 如果出现提示,请让用户完成浏览器授权。编辑器会自动公开;不要要求用户点击公开按钮。
  3. 发现当前可用的内容:scripts/sw-editor.sh tools
  4. 调用工具:scripts/sw-editor.sh call <tool-name> --args '<json>'

备用手动流程:

  1. 请用户提供编辑器 UI 中显示的配对码。
  2. 连接:scripts/sw-editor.sh attach <pairing-code> --agent-name <agent>
  3. 继续使用 tools 和 call。

完整 CLI 参考:references/cli.md。

如何构建和编辑

编排规则

  • 编辑前务必先建立连接。尽可能使用 expose --open --wait,否则使用 attach <pairing-code> --agent-name <agent>。tools、call、status、release 都需要已连接的会话。
  • 如果你有 SUPERWALL_API_KEY、应用 ID 和付费墙 ID,优先使用 expose --open --wait。它使用与手动配对相同的中继,但省去了人工输入配对码的步骤。
  • 调用本会话中尚未使用过的工具前,先运行 tools,确认工具存在并读取当前参数架构。工具在浏览器程序包中定义,因此编辑器更新后可以发布新增或重命名的工具,而无需更改此技能。
  • 每进行两三次修改,就使用 get_screenshot(如果工具列表中有此工具)进行验证。不要盲目操作。
  • 优先使用语义化工具(update_styles、set_text_content、set_dynamic_value、move_nodes),而不是对现有结构重新运行 write_html。参见 references/workflow.md。
  • 只要 UI 表示的是语义控件,就优先使用原生 sw-* 元素,而不是手工实现的 <div>。参见 references/native-elements.md。
  • 解析 CLI 输出时使用 jq,不要使用 Python。示例:sw-editor.sh call get_subtree --args '...' | jq -r '.content[0].text'
  • 用户完成后,释放连接:scripts/sw-editor.sh release。

出现问题时

  • session_not_ready:浏览器已断开连接或重新加载。请让用户重新打开编辑器标签页,然后重新连接。配对码会轮换,因此用户必须提供新的配对码。
  • session_locked:已有其他客户端连接。用户可能已从另一个 MCP 客户端连接,或者先前通过 CLI 连接后未断开。他们可以在编辑器界面中断开连接,然后你可以重试。
  • unauthorized:控制器令牌已过期。请使用新的配对码重新连接。
  • attach_failed: provide a valid current pairingCode:配对码约 10 分钟后过期,并会在断开连接时轮换。请让用户向你展示当前的配对码。

评论

支持 Markdown