Tham chiếu công cụ MCP

​

Công cụ tệp

​

list-files

{
  "files": [
    {
      "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",
      "organisation_id": "0b7f3c9e-2d4a-4f1b-9a5e-6c8d7e1f2a3b",
      "shared_with_me": false,
      "owner": true,
      "url": "https://app.flowstep.ai/file?activeFileId=5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0"
    }
  ]
}

• owner: true nếu bạn đã tạo tệp.
• shared_with_me: true nếu tệp được chia sẻ trực tiếp với bạn, không chỉ thông qua tổ chức của bạn.
• url: mở tệp trong trình chỉnh sửa Flowstep.

​

get-file

{
  "file": {
    "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",
    "project_id": "81cb84d6-c69f-492c-a895-7421b60d1a6d",
    "access_level": "private",
    "visibility": "private",
    "owner": true,
    "url": "https://app.flowstep.ai/file?activeFileId=5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0"
  },
  "user_access_level": "write"
}

• access_level: private, read hoặc write.
• visibility: private, member hoặc public.
• user_access_level: quyền truy cập của bạn đối với tệp: read hoặc write.

​

create-file

​

update-file

​

delete-file

​

Công cụ màn hình

​

list-screens

{
  "screens": [
    {
      "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbe",
      "name": "Mobile login screen",
      "prompt": "Generate a simple mobile login screen with email and password fields and a sign in button",
      "fidelity": "ui"
    }
  ]
}

• prompt: prompt tạo gần nhất của màn hình, hoặc chuỗi rỗng nếu màn hình chưa từng được tạo (ví dụ, màn hình được thêm bằng add-screen-jsx).
• fidelity: lofi, hifi hoặc ui.

​

get-screen-image

​

get-screen-jsx

{
  "fileId": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "screenId": "c13d3707-0efe-49f5-b6cb-0ca5ac5223d0",
  "name": "World clock",
  "prompt": "A world clock screen with a city search and alert button",
  "fidelity": "ui",
  "screenType": "iphone-x-vertical",
  "colorTheme": "blue",
  "jsx": "<div className=\"bg-white text-zinc-950 w-full h-fit\">\n  <div className=\"flex p-6 flex-col gap-6\">\n    …\n  </div>\n</div>",
  "fragments": []
}

• jsx: chỉ có đánh dấu. Các thuộc tính data-id chỉ được đưa vào khi includeIds là true.
• prompt: prompt tạo gần nhất, hoặc chuỗi rỗng nếu màn hình chưa từng được tạo.
• fragments: phần giao diện dùng chung được lưu trên màn hình, chẳng hạn thanh điều hướng, tiêu đề hoặc logo, dưới dạng các đối tượng { purpose, markup }. Trống khi không có. Truyền lại cho replace-screen-jsx để giữ hoặc cập nhật chúng.

​

add-screen-jsx

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

​

replace-screen-jsx

​

rename-screen

{ "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbe", "name": "Checkout — empty cart" }

​

delete-screen

​

Hình ảnh trong JSX

1. Tải hình ảnh lên bằng upload-attachment ở Chế độ A (mimeType + fileName), rồi chạy uploadCommand được trả về.
2. Nếu type trong phản hồi là "image", hãy dán assetUrl đúng như được trả về vào img src hoặc bg-[url(assetUrl)].

<img src="ASSET_URL" alt="Team photo" className="w-full h-48 object-cover rounded-lg" />

​

Giá trị trường màn hình

​

Công cụ nguyên tắc thiết kế

​

get-design-guidelines

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

​

update-design-guidelines

• Phần frontmatter phải được mở và đóng đúng cách
• Các dòng frontmatter phải là YAML kiểu khối hợp lệ
• Phần nội dung Markdown không được chứa tiêu đề ## bị trùng

{ "updated": true, "warnings": ["…"] }

​

delete-design-guidelines

​

Công cụ trò chuyện

​

get-chat-history

{
  "messages": [
    {
      "id": "453f593d-2380-425b-ba29-127db08d6a8e",
      "type": "request",
      "status": "success",
      "content": "Generate a simple mobile login screen with email and password fields",
      "author": "human",
      "content_type": "text",
      "sequence": 1,
      "targets": [],
      "attachments": []
    },
    {
      "id": "d860186b-82d5-4bd1-8e8e-8ba5377a14bf",
      "type": "response",
      "status": "success",
      "content": "Generated a mobile login screen with email and password input fields, a sign in button, and a 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" }]
    }
  ]
}

​

Công cụ tệp đính kèm

​

upload-attachment

1. Gọi upload-attachment chỉ với mimeType và fileName (ví dụ image/png và dog.png). Phản hồi là một lượt tải lên đã chuẩn bị, chưa phải tệp đã được lưu:
   {
     "id": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
     "path": "attachments/a1b2c3d4-e5f6-7890-abcd-ef1234567890",
     "assetUrl": "https://…",
     "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": "…"
   }
   
2. Thay LOCAL_FILE_PATH trong uploadCommand bằng đường dẫn tuyệt đối tới tệp của bạn, rồi chạy đúng lệnh đó trong shell. Lệnh phải thoát với mã 0. Token trong signedUrl chỉ cho phép đúng lượt tải lên này. Bỏ qua bước này sẽ khiến bộ nhớ trống và công cụ thiết kế sẽ thất bại ở bước kiểm tra sơ bộ.
3. Chỉ truyền { id, path, type } vào mảng attachments của ai-design-screens, không truyền signedUrl, uploadCommand hoặc nextStep. Để đặt hình ảnh vào JSX của riêng bạn, hãy đưa assetUrl vào img src hoặc bg-[url(...)] trong JSX mà bạn truyền cho add-screen-jsx hoặc replace-screen-jsx. Xem Hình ảnh trong JSX.

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

• type: "image" đối với tệp hình ảnh và "document" đối với tệp PDF và tệp văn bản.
• assetUrl: URL của tệp đã tải lên, được trả về ở cả hai chế độ. Chỉ dùng trong JSX cho add-screen-jsx hoặc replace-screen-jsx khi type là "image", và chỉ sau khi đã chạy uploadCommand ở Chế độ A.
• signedUrl, uploadCommand, nextStep: chỉ được đặt ở Chế độ A. Không truyền chúng vào công cụ thiết kế.

​

Công cụ Figma

​

import-figma

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

​

Công cụ gói và thanh toán

​

get-plan-details

​

Công cụ thiết kế AI

• designGuidelinesUpdated: tóm tắt ngắn về thay đổi khi nguyên tắc DESIGN.md của tệp được cập nhật tự động trong lượt này; nếu không thì là null.

​

ai-design-screens

{
  "fileId": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "message": "Switch this sign-in screen to dark mode, then add a matching forgot-password screen.",
  "elementIds": ["3f9e6eb6-5525-4383-9375-67e0bd762dbe"]
}

{
  "status": "generated",
  "fileId": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "screenIds": [
    "3f9e6eb6-5525-4383-9375-67e0bd762dbe",
    "c13d3707-0efe-49f5-b6cb-0ca5ac5223d0"
  ],
  "designGuidelinesUpdated": null
}

• status: "generated" khi màn hình được xây dựng hoặc thay đổi. "chat" khi Flowstep trả lời mà không xây dựng gì. Trong trường hợp này, reply chứa câu trả lời và screenIds trống. Nếu yêu cầu của bạn chưa rõ ràng, tác nhân của bạn nên yêu cầu bạn làm rõ rồi gọi lại công cụ.
• screenIds: mọi màn hình được xây dựng hoặc thay đổi trong lệnh gọi, bao gồm cả các màn hình được chỉnh sửa tại chỗ. Nếu lệnh gọi hết thời gian sau khi một số màn hình đã được xây dựng, nó sẽ trả về các màn hình đó thay vì báo lỗi.

​

ai-generate-screen-variant

​

ai-edit-screen-variant

​

Công cụ đã đổi tên