MCP 工具参考

所有工具返回 MCP 内容块的 content 数组。文本工具返回 { type: "text", text: "<json-string>" }。图像工具返回 { type: "image", data: "<base64>", mimeType: "image/png" }。失败时设置 isError: true 并在文本块中包含错误消息。

文件工具

`list-files`

列出当前用户的 Flowstep 文件。输入

参数	类型	默认值	描述
`orderByCreation`	`boolean`	`true`	按创建日期排序
`limit`	`integer` (1–100)	`20`	返回的文件数
`offset`	`integer` (≥0)	`0`	分页偏移

输出 — 文件对象的 JSON 数组。

[
  {
    "id": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
    "name": "Dashboard redesign",
    "created_at": "2026-04-30T15:02:13.120152+00:00",
    "updated_at": "2026-04-30T15:02:13.120152+00:00",
    "owner": true,
    "url": "https://app.flowstep.ai/file?activeFileId=5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0"
  }
]

`get-file`

按 ID 获取单个文件。文件内容被有意省略 — 使用 get-screen 或 get-screen-image 检查屏幕，使用 get-design-guidelines 检索附加的设计准则。输入

参数	类型	描述
`id`	`uuid`	文件 ID

输出 — JSON 文件对象。

{
  "file": {
    "id": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
    "name": "Dashboard redesign",
    "project_id": "81cb84d6-c69f-492c-a895-7421b60d1a6d",
    "created_at": "2026-04-30T15:02:13.120152+00:00",
    "updated_at": "2026-04-30T15:02:13.120152+00:00",
    "access_level": "private",
    "owner": true,
    "url": "https://app.flowstep.ai/file?activeFileId=5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0"
  },
  "user_access_level": "write"
}

`create-file`

创建新的 Flowstep 文件。输入

参数	类型	描述
`title`	`string` (min 1)	文件名

输出 — JSON 文件对象，包含新文件的 id。

{
  "id": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "name": "Dashboard redesign",
  "project_id": "81cb84d6-c69f-492c-a895-7421b60d1a6d",
  "created_at": "2026-04-30T15:02:13.120152+00:00",
  "updated_at": "2026-04-30T15:02:13.120152+00:00",
  "access_level": "private",
  "user_access_level": "write",
  "owner": true,
  "url": "https://app.flowstep.ai/file?activeFileId=5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0"
}

在后续工具调用中使用返回的 id 作为 fileId。

`update-file`

重命名文件。输入

参数	类型	描述
`id`	`uuid`	文件 ID
`name`	`string` (min 1)	新名称

输出 — 更新的文件对象，形式与 get-file 相同。

{
  "file": {
    "id": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
    "name": "Dashboard redesign (v2)",
    "project_id": "81cb84d6-c69f-492c-a895-7421b60d1a6d",
    "created_at": "2026-04-30T15:02:13.120152+00:00",
    "updated_at": "2026-04-30T15:02:13.120152+00:00",
    "access_level": "private",
    "owner": true,
    "url": "https://app.flowstep.ai/file?activeFileId=5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0"
  },
  "user_access_level": "write"
}

`delete-file`

永久删除文件。您传递的 name 在删除前会针对文件的实际名称进行验证 — 如果不匹配，删除会被中止。这可以防止意外删除错误的文件。输入

参数	类型	描述
`id`	`uuid`	文件 ID
`name`	`string`	文件的当前名称 — 必须完全匹配或删除会被中止

输出 — "File deleted successfully"

这是不可逆的。文件中的所有屏幕都会被删除。

屏幕工具

`list-screens`

列出文件的所有生成屏幕。使用返回的 screenId 值在 get-screen、get-screen-image 中引用屏幕，以及在 edit-design、regenerate-design 或 expand-design 中作为 targets。输入

参数	类型	描述
`fileId`	`uuid`	文件 ID

输出 — 屏幕摘要的 JSON 数组。

[
  {
    "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbe",
    "name": "Mobile login screen",
    "fidelity": "ui",
    "prompt": "Generate a simple mobile login screen with email and password fields and a sign in button",
    "createdAt": "2026-04-30T15:02:37.444139+00:00"
  }
]

name 是用户分配的屏幕名称，如果未命名则为 null。

`get-screen`

获取屏幕的 JSX 代码，允许您在 Flowstep 之外编辑或使用代码。使用 get-screen-image 获取视觉预览。输入

参数	类型	描述
`fileId`	`uuid`	文件 ID
`screenId`	`uuid`	`list-screens` 返回的 `screenId` 或设计工具返回的 `screenIds` 数组中的值

输出 — 屏幕作为代码 (JSX)。注意第一行注释，这在使用 add-screen 工具时是必需的。

<!-- screenType: "iphone-x-vertical" width: "375" height: "812" name: "Change to a light theme" colorTheme: "blue" screenId: "c13d3707-0efe-49f5-b6cb-0ca5ac5223d0" -->
<div className="bg-white text-zinc-950 w-full h-fit">
  <div className="flex p-6 flex-col gap-6">
    <div className="flex pt-4 justify-between items-center">
      <ArrowLeft className="size-5 text-[#71717b]" />
      <span className="font-semibold text-zinc-950 text-lg leading-7">
        World Clock
      </span>
      <Plus className="size-5 text-[#2b7fff]" />
    </div>
    <div className="rounded-xl bg-zinc-100 flex p-2 items-center gap-2">
      <Search className="size-4 text-[#71717b] ml-2" />
      <span className="text-[#71717b] text-sm leading-5">Search cities...</span>
    </div>
...
    <div className="flex pt-2 pb-4 justify-center items-center gap-4">
      <Button variant="outline" className="rounded-full px-6 gap-2">
        <Clock className="size-4" />
        <span>Compare</span>
      </Button>
      <Button className="rounded-full bg-[#2b7fff] text-blue-50 px-6 gap-2">
        <Bell className="size-4" />
        <span>Set Alert</span>
      </Button>
    </div>
  </div>
</div>;

`add-screen`

从原始 JSX 字符串向 Flowstep 文件添加新屏幕。输入

参数	类型	描述
`fileId`	`uuid`	文件 ID
`jsxContent`	`string`	要作为屏幕添加到文件的 JSX
`screenType`	`string`	如果屏幕类型未在 JSX 开头定义为注释，则需要

注意 — 必须在 JSX 的第一行作为注释出现类似下面的注释，用于正确添加屏幕。screenType、name 和 screenId 都是可选的 — 如果存在（例如，从 get-screen 输出复制 JSX 时）使用 screenId，但不是强制的。屏幕名称取自注释的 name 字段（显示为 “Copy of <name>”），如果不存在则为 “Untitled”。  输出 — 新添加屏幕的 Id。

{ "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbf" }

`get-screen-image`

将屏幕渲染为 PNG 并以内联图像形式返回。需要支持图像内容块的客户端。输入

参数	类型	描述
`fileId`	`uuid`	文件 ID
`screenId`	`uuid`	`list-screens` 返回的 `screenId` 或设计工具返回的 `screenIds` 数组中的值

输出 — MCP 图像内容块 (image/png)。

AI 工具

regenerate-design、expand-design 和 edit-design 需要仅在使用 designs 数组原始生成的屏幕中存在的设计上下文。没有设计上下文生成的屏幕会返回错误。

`create-new-design`

从文本提示词生成一个或多个屏幕设计。省略 fileId 会自动创建新文件。阻止直到生成完成或超时 (180 秒)。输入

参数	类型	默认值	描述
`fileId`	`uuid`	—	目标文件 — 省略以自动创建新文件。设置 `targets` 时需要
`message`	`string`	—	描述要生成的屏幕的提示词
`targets`	`uuid[]`	`[]`	可选视觉参考 — `list-screens` 和/或 `get-screen` 中的 subelement IDs 中的 `screenId`。引用的屏幕仅用作视觉灵感；它们不会就地编辑
`attachments`	`AttachmentRequestData[]` (max 5)	`[]`	预上传的附件 — 图像、PDF 或代码文件。始终先通过 `upload-attachment` 上传；不要将文件内容内联在消息中
`designs`	`DesignRequestData[]`	`[]`	设计参考

输出 — { fileId, screenIds, designGuidelinesUpdated }。将每个 screenId 传递给 get-screen-image 查看结果。designGuidelinesUpdated 报告此生成过程中文件的设计准则是否更改。

{
  "fileId": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "screenIds": ["3f9e6eb6-5525-4383-9375-67e0bd762dbe"]
}

`regenerate-design`

从头开始或使用样式变化重做现有屏幕。需要 targets 中至少一个 screenId。阻止直到生成完成或超时 (180 秒)。输入

参数	类型	默认值	描述
`fileId`	`uuid`	—	目标文件
`message`	`string`	—	提示词文本
`targets`	`uuid[]` (min 1)	—	要重新生成的屏幕的 screenIds
`operationVariant`	`"different_layout" \| "different_style" \| "from_scratch"`	—	必需 — 如何重做屏幕：`different_layout`（保持风格和内容，改变布局）、`different_style`（保持布局和内容，改变颜色和视觉处理）或 `from_scratch`（相同目的的新布局、风格和内容）
`designs`	`DesignRequestData[]`	`[]`	设计参考 (自动解析)

输出 — { fileId, screenIds, designGuidelinesUpdated }。将每个 screenId 传递给 get-screen-image 查看结果。

`expand-design`

向现有设计添加后续屏幕。需要 targets 中至少一个 screenId 和强制性的 operationVariant。阻止直到生成完成或超时 (180 秒)。输入

参数	类型	默认值	描述
`fileId`	`uuid`	—	目标文件
`message`	`string`	—	提示词文本
`targets`	`uuid[]` (min 1)	—	要扩展的屏幕的 screenIds
`operationVariant`	`"next_screen" \| "error_state" \| "empty_state" \| "web_version" \| "mobile_version" \| "tablet_version" \| "mobile_ios_version" \| "mobile_android_version"`	—	必需 — 要生成的后续屏幕的类型
`designs`	`DesignRequestData[]`	`[]`	设计参考 (自动解析)

输出 — { fileId, screenIds, designGuidelinesUpdated }。将每个 screenId 传递给 get-screen-image 查看结果。

`edit-design`

通过提示词修改现有屏幕。需要 targets 中至少一个 screenId。阻止直到生成完成或超时 (180 秒)。输入

参数	类型	默认值	描述
`fileId`	`uuid`	—	目标文件
`message`	`string`	—	描述要应用的编辑的说明
`targets`	`uuid[]` (min 1)	—	要编辑的屏幕的 screenIds
`operationVariant`	`"dark_theme" \| "light_theme" \| "make_pretty"`	—	可选风格快捷方式
`attachments`	`AttachmentRequestData[]` (max 5)	`[]`	预上传的附件。始终先通过 `upload-attachment` 上传
`designs`	`DesignRequestData[]`	`[]`	设计参考 (自动解析)

输出 — { fileId, screenIds, designGuidelinesUpdated }。将每个 screenId 传递给 get-screen-image 查看结果。

`upload-attachment`

上传文件以在 create-new-design 或 edit-design 中用作附件（不是 regenerate-design 或 expand-design）。文件字节不会通过模型，服务器也不会代表您获取 URL。有两种模式 — 恰好使用其中一种，不要将它们结合。 模式 A — 文件和图像 (mimeType + fileName) 对任何图像、PDF 或较大的文本文件的必需三步流程：

仅使用 mimeType 和 fileName 调用 upload-attachment（例如 image/png 和 dog.png）。响应是一个准备好的上传，而不是已存储的文件：

{
  "id": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "path": "attachments/a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "type": "image",
  "mimeType": "image/png",
  "signedUrl": "https://…",
  "uploadCommand": "curl -sS -f -X PUT '…' -H 'Content-Type: image/png' -H 'x-metadata: …' --data-binary @LOCAL_FILE_PATH",
  "nextStep": "…"
}

用您文件的绝对路径替换 uploadCommand 中的 LOCAL_FILE_PATH 并在您的 shell 中运行该确切命令 — 它必须退出 0。signedUrl 中的令牌仅授权此单一上传。跳过此步骤会导致存储为空，设计工具会失败其预检检查。
仅将 { id, path, type } 传递到设计工具的 attachments 数组 — 不是 signedUrl、uploadCommand 或 nextStep。

要附加远程文件，请先自己将其下载到本地路径（例如使用 curl），然后按照相同的三步操作。不要将 URL 传递给 upload-attachment。

参数	类型	描述
`mimeType`	enum	文件 MIME 类型。其中之一 `image/jpeg`、`image/png`、`image/webp`、`application/pdf`、`text/markdown`、`text/plain`、`text/javascript`。对 `.jsx`、`.tsx`、`.js`、`.ts` 文件使用 `text/javascript`
`fileName`	`string` (min 1)	原始文件名及扩展名，例如 `cat.png` 或 `design.md`

模式 B — 短文本 (text + mimeType) 上传已在上下文中的文本 — 无需 shell 命令。响应可以直接使用：

{
  "id": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "path": "attachments/a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "type": "document",
  "mimeType": "text/plain"
}

参数	类型	描述
`text`	`string` (max 64,000 chars)	原始文本内容。仅文本文件 — 不用于图像或 PDF。超过 64,000 字符？改用模式 A
`mimeType`	enum	其中之一 `text/markdown`、`text/plain`、`text/javascript`

将结果的 { id, path, type } 传递到 create-new-design 或 edit-design 的 attachments 数组中。两种模式的最大文件大小为 3 MB，PDF 的上限为 100 页。type 对于图像文件是 "image"，对于 PDF 和文本文件是 "document"。

聊天工具

`get-chat-history`

获取文件的聊天消息历史。输入

参数	类型	描述
`fileId`	`uuid`	文件 ID

输出 — 包含 messages 数组的 JSON 对象。每条消息都有 type（"request" 或 "response"）、author（"human" 或 "ai"）和 content_type（"text"、"summary" 或 "followup"）。

{
  "messages": [
    {
      "id": "453f593d-2380-425b-ba29-127db08d6a8e",
      "chat_id": "146d0f19-497e-450c-ba53-3de15f6bd70b",
      "type": "request",
      "status": "success",
      "content": "Generate a simple mobile login screen with email and password fields",
      "author": "human",
      "content_type": "text",
      "sequence": 1,
      "request_message_id": null,
      "targets": [],
      "attachments": []
    },
    {
      "id": "d860186b-82d5-4bd1-8e8e-8ba5377a14bf",
      "chat_id": "146d0f19-497e-450c-ba53-3de15f6bd70b",
      "type": "response",
      "status": "success",
      "content": "Generated a mobile login screen with email and password input fields, sign in button, remember me checkbox, forgot password link, social login options (Apple/Google), and sign up link.",
      "author": "ai",
      "content_type": "summary",
      "sequence": 7,
      "request_message_id": "453f593d-2380-425b-ba29-127db08d6a8e",
      "targets": [{ "target_id": "3f9e6eb6-5525-4383-9375-67e0bd762dbe" }],
      "attachments": []
    }
  ]
}

设计工具

`get-design-guidelines`

获取为文件存储的设计准则。输入

参数	类型	默认值	描述
`resourceId`	`uuid`	—	文件 ID
`linkedTo`	`"file"`	`"file"`	资源类型

输出

{
  "guidelines": "## Colors\n\nPrimary: #6366F1\nBackground: #FFFFFF\n\n## Typography\n\nFont: Inter",
  "linkedTo": "file"
}

如果尚未设置准则，guidelines 是 null。

`update-design-guidelines`

为文件设置或替换设计准则。准则作为 Google design.md 格式的纯文本字符串传递 — 不要传递对象或 JSON。服务器执行软验证，可能在响应中返回 Warnings: 部分，列出被接受但可能被 AI 忽略的问题（未知键、非十六进制颜色）。将这些显示给用户。输入

参数	类型	默认值	描述
`resourceId`	`uuid`	—	文件 ID
`designGuidelines`	`string` (min 1)	—	准则的原始文本内容。必须是纯字符串 — 不是 JSON 编码
`linkedTo`	`"file"`	`"file"`	资源类型

验证规则

Frontmatter 必须正确打开和关闭
Frontmatter 行必须是有效的块样式 YAML
Markdown 正文不得包含重复的 ## 部分标题

输出 — "Design guidelines updated successfully"，可选后跟 Warnings: 部分。

`delete-design-guidelines`

清除文件的设计准则。输入

参数	类型	默认值	描述
`resourceId`	`uuid`	—	文件 ID
`linkedTo`	`"file"`	`"file"`	资源类型

输出 — "Design guidelines deleted successfully"

Figma 工具

`import-figma`

将 Figma 框架导入 Flowstep 文件作为其画布上的可编辑元素。重新导入同一框架会在原位更新它。文件的组织必须在 Flowstep 设置中连接了 Figma。输入

参数	类型	描述
`figmaUrl`	`string`	指向特定 Figma 框架的链接。在 Figma 中，右键单击框架并选择 Copy link to selection。页面链接导入该页面上的所有顶级框架（MCP 上限为 20 个框架）。
`fileId`	`uuid`	要将框架导入的 Flowstep 文件

输出 — { fileId, screenId }。screenId 是导入的屏幕元素的 id — 将其传递给 get-screen-image 查看结果。当页面 URL 导入多个框架时，screenId 是 null 并改为返回 frameCount。

{
  "fileId": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbe"
}

计费工具

`get-plan-details`

获取当前用户的套餐、订阅状态和剩余配额。不需要输入。输出

{
  "plan": {
    "name": "Starter",
    "code": "starter",
    "type": "paid"
  },
  "subscription": {
    "isPaid": true,
    "isTrial": false,
    "startDate": "2025-01-01T00:00:00Z",
    "endDate": null,
    "trialDaysRemaining": null
  },
  "limits": {
    "messages": {
      "daily": { "max": 50, "warn": 40 },
      "monthly": { "max": 500, "warn": 400 },
      "unlimited": false
    }
  },
  "usage": {
    "messages": { "daily": 12, "monthly": 87 }
  },
  "remaining": {
    "messages": { "daily": 38, "monthly": 413 }
  }
}

在一批生成之前调用此工具以检查可用配额。

快速开始

使用 Flowstep

团队与组织

导出与集成

MCP 服务器

计费与套餐

安全与隐私

文件工具

`list-files`

`get-file`

`create-file`

`update-file`

`delete-file`

屏幕工具

`list-screens`

`get-screen`

`add-screen`

`get-screen-image`

AI 工具

`create-new-design`

`regenerate-design`

`expand-design`

`edit-design`

`upload-attachment`

聊天工具

`get-chat-history`

设计工具

`get-design-guidelines`

`update-design-guidelines`

`delete-design-guidelines`

Figma 工具

`import-figma`

计费工具

`get-plan-details`

​文件工具

​list-files

​get-file

​create-file

​update-file

​delete-file

​屏幕工具

​list-screens

​get-screen

​add-screen

​get-screen-image

​AI 工具

​create-new-design

​regenerate-design

​expand-design

​edit-design

​upload-attachment

​聊天工具

​get-chat-history

​设计工具

​get-design-guidelines

​update-design-guidelines

​delete-design-guidelines

​Figma 工具

​import-figma

​计费工具

​get-plan-details

文件工具

`list-files`

`get-file`

`create-file`

`update-file`

`delete-file`

屏幕工具

`list-screens`

`get-screen`

`add-screen`

`get-screen-image`

AI 工具

`create-new-design`

`regenerate-design`

`expand-design`

`edit-design`

`upload-attachment`

聊天工具

`get-chat-history`

设计工具

`get-design-guidelines`

`update-design-guidelines`

`delete-design-guidelines`

Figma 工具

`import-figma`

计费工具

`get-plan-details`