Spring til hovedindhold
Alle værktøjer returnerer et content-array af MCP-indholdsblokke. Tekstværktøjer returnerer { type: "text", text: "<json-string>" }. Billedværktøjer returnerer { type: "image", data: "<base64>", mimeType: "image/png" }. Hvis det mislykkes, sættes isError: true, og tekstblokken indeholder fejlmeddelelsen.

Filværktøjer

list-files

Oplist filer fra Flowstep for den aktuelle bruger. Input
ParameterTypeStandardBeskrivelse
orderByCreationbooleantrueSorter efter oprettelsesdato
limitinteger (1–100)20Antal filer, der skal returneres
offsetinteger (≥0)0Pagineringsoffset
Output – JSON-array af filobjekter.
[
  {
    "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

Få en enkelt fil efter ID. Filindhold er bevidst udeladt – brug get-screen eller get-screen-image for at inspicere skærme, og get-design-guidelines for at hente vedhæftede designretningslinjer. Input
ParameterTypeBeskrivelse
iduuidFil-ID
Output – JSON-filobjekt.
{
  "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

Opret en ny Flowstep-fil. Input
ParameterTypeBeskrivelse
titlestring (min 1)Filnavn
Output – JSON-filobjekt med den nye fils 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"
}
Brug det returnerede id som fileId i efterfølgende værktøjskald.

update-file

Omdøb en fil. Input
ParameterTypeBeskrivelse
iduuidFil-ID
namestring (min 1)Nyt navn
Output – Opdateret filobjekt i samme format som 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

Slet en fil permanent. Det name, du sender, bliver verificeret mod filens faktiske navn før sletning – hvis det ikke matcher, afbrydes sletningen. Dette forhindrer utilsigtet sletning af forkert fil. Input
ParameterTypeBeskrivelse
iduuidFil-ID
namestringFilens aktuelle navn – skal matche præcist, eller sletningen afbrydes
Output"File deleted successfully"
Dette kan ikke fortrydes. Alle skærme i filen slettes.

Skærmværktøjer

list-screens

Oplist alle genererede skærme for en fil. Brug de returnerede screenId-værdier til at referere til skærme i get-screen, get-screen-image, upload-attachment og som targets i edit-design, regenerate-design eller expand-design. Input
ParameterTypeBeskrivelse
fileIduuidFil-ID
Output – JSON-array af skærmsammenfattelser.
[
  {
    "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 er brugerens tildelte skærmnavn eller null, hvis ubenævnt.

get-screen

Få JSX-koden for en skærm, så du kan redigere eller bruge koden uden for Flowstep. Brug get-screen-image for at få en visuel forhåndsvisning i stedet. Input
ParameterTypeBeskrivelse
fileIduuidFil-ID
screenIduuidDen screenId, som list-screens returnerede eller fra screenIds-arrayet returneret af et designværktøj
Output – Skærmen som kode (JSX). Bemærk den første linjekommentar, som er påkrævet ved brug af værktøjet 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

Tilføj en ny skærm til en Flowstep-fil fra en rå JSX-streng. Input
ParameterTypeBeskrivelse
fileIduuidFil-ID
jsxContentstringJSX, der skal føjes til filen som en skærm
screenTypestringPåkrævet, hvis skærmtypen ikke er defineret som en kommentar i starten af JSX’en
Note – En kommentar svarende til nedenstående SKAL være til stede som første linje af JSX’en, da den bruges til at tilføje skærmen korrekt. screenType, name og screenId er alle valgfrie – screenId bruges (internt), hvis den er til stede (f.eks. når du indsætter JSX kopieret fra get-screen-output), men er ikke obligatorisk. Skærmnavnet kommer fra kommentarens name-felt (vises som “Copy of <name>”) eller “Untitled”, hvis det er udeladt. <!-- screenType: "iphone-x-vertical" width: "375" height: "812" name: "Change to a light theme" colorTheme: "blue" --> Output – Det nyligt tilføjede skærm-ID.
{ "screenId": "3f9e6eb6-5525-4383-9375-67e0bd762dbf" }

get-screen-image

Render en skærm som PNG og returner den som et integreret billede. Kræver en klient, der understøtter billedindholdsblokke. Input
ParameterTypeBeskrivelse
fileIduuidFil-ID
screenIduuidDen screenId, som list-screens returnerede eller fra screenIds-arrayet returneret af et designværktøj
Output – MCP-billedindholdsblok (image/png).

AI-værktøjer

regenerate-design, expand-design og edit-design kræver designsammenhæng, som kun er til stede på skærme, der oprindeligt blev genereret med et designs-array. Skærme genereret uden designsammenhæng returnerer en fejl. Workaround: brug upload-attachment til at rendere skærmen som et billede, kald derefter create-new-design med billedet i attachments og en besked, der beskriver de ønskede ændringer.

create-new-design

Generer en eller flere skærmdesign ud fra en tekstprompt. Udelad fileId for at oprette en ny fil automatisk. Blokerer, indtil generering er fuldført eller timeout (180 sekunder). Input
ParameterTypeStandardBeskrivelse
fileIduuidMålfil – udelad for at oprette en ny fil automatisk
messagestringPrompt, der beskriver de skærme, der skal genereres
attachmentsAttachmentRequestData[] (max 5)[]Allerede uploadede vedhæftninger – billeder, PDF’er eller kodefiler. Upload altid via upload-attachment først; indsæt ikke filindhold i beskeden
designsDesignRequestData[][]Designreferencer
Output{ fileId, screenIds }. Send hver screenId til get-screen-image for at se resultaterne.
{
  "fileId": "5c2170f0-5b09-4a5a-ba7a-4d5c2cfb07e0",
  "screenIds": ["3f9e6eb6-5525-4383-9375-67e0bd762dbe"]
}

regenerate-design

Lav eksisterende skærme igen fra grunden eller med en stilvariation. Kræver mindst én screenId i targets. Blokerer, indtil generering er fuldført eller timeout (180 sekunder). Input
ParameterTypeStandardBeskrivelse
fileIduuidMålfil
messagestringPrompttekst
targetsuuid[] (min 1)screenIds af skærme, der skal genereres igen
operationVariant"different_layout" | "different_style" | "from_scratch"Valgfri stilvariation
designsDesignRequestData[][]Designreferencer (løses automatisk)
Output{ fileId, screenIds }. Send hver screenId til get-screen-image for at se resultaterne.

expand-design

Tilføj opfølgende skærme til et eksisterende design. Kræver mindst én screenId i targets og en obligatorisk operationVariant. Blokerer, indtil generering er fuldført eller timeout (180 sekunder). Input
ParameterTypeStandardBeskrivelse
fileIduuidMålfil
messagestringPrompttekst
targetsuuid[] (min 1)screenIds af skærme, der skal udvides fra
operationVariant"next_screen" | "error_state" | "empty_state" | "web_version" | "mobile_version" | "tablet_version" | "mobile_ios_version" | "mobile_android_version"Påkrævet – type af opfølgende skærm, der skal genereres
designsDesignRequestData[][]Designreferencer (løses automatisk)
Output{ fileId, screenIds }. Send hver screenId til get-screen-image for at se resultaterne.

edit-design

Modificer eksisterende skærme via en prompt. Kræver mindst én screenId i targets. Blokerer, indtil generering er fuldført eller timeout (180 sekunder). Input
ParameterTypeStandardBeskrivelse
fileIduuidMålfil
messagestringInstruktioner, der beskriver de redigeringer, der skal anvendes
targetsuuid[] (min 1)screenIds af skærme, der skal redigeres
operationVariant"dark_theme" | "light_theme" | "make_pretty"Valgfri stilgenvej
attachmentsAttachmentRequestData[] (max 5)[]Allerede uploadede vedhæftninger. Upload altid via upload-attachment først
designsDesignRequestData[][]Designreferencer (løses automatisk)
Output{ fileId, screenIds }. Send hver screenId til get-screen-image for at se resultaterne.

upload-attachment

Upload en fil, der skal bruges som vedhæftning i create-new-design eller edit-design. Returnerer { id, path, type, mimeType } – send dette objekt direkte til attachments-arrayet. To tilstande: Tilstand 1 – Skærm efter ID Send screenId og fileId. Serveren henter skærmtilstanden fra databasen og renderer den som et billede.
ParameterTypeBeskrivelse
fileIduuidFil, der indeholder skærmen (påkrævet)
screenIduuidSkærm, der skal gengives
Tilstand 2 – Ekstern fil Send filindhold direkte. Binære filer skal være base64-kodet; tekstfiler (inklusiv kildekode) sendes som almindelige UTF-8-strenge.
ParameterTypeBeskrivelse
fileDatastringFilindhold – base64 for binær, UTF-8-streng for tekst
fileNamestringOprindeligt filnavn
mimeType"image/jpeg" | "image/png" | "image/webp" | "application/pdf" | "text/plain" | "text/javascript"MIME-type. Brug text/javascript til .jsx, .tsx, .js, .ts filer
Maksimal filstørrelse: 3 MB. For større billeder foretrækkes image/jpeg frem for image/png. Output
{
  "id": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "path": "attachments/a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "type": "image",
  "mimeType": "image/jpeg"
}
type er "image" for billede-/PDF-uploads og "document" for tekst-/kodefiler.

Chatværktøjer

get-chat-history

Få chatbeskedhistorikken for en fil. Input
ParameterTypeBeskrivelse
fileIduuidFil-ID
Output – JSON-objekt med et messages-array. Hver besked har en type ("request" eller "response"), author ("human" eller "ai") og content_type ("text", "summary" eller "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": []
    }
  ]
}

Designværktøjer

get-design-guidelines

Få designretningslinjer lagret for en fil. Input
ParameterTypeStandardBeskrivelse
resourceIduuidFil-ID
linkedTo"file""file"Ressourcetype
Output
{
  "guidelines": "## Colors\n\nPrimary: #6366F1\nBackground: #FFFFFF\n\n## Typography\n\nFont: Inter",
  "linkedTo": "file"
}
guidelines er null, hvis der ikke er angivet retningslinjer.

update-design-guidelines

Indstil eller erstat designretningslinjer for en fil. Retningslinjer sendes som en almindelig tekststreng i Googles design.md-format – send ikke et objekt eller JSON. Serveren udfører blød validering og kan returnere en Warnings:-sektion i svaret med en liste over problemer (ukendte nøgler, ikke-hex-farver), der blev accepteret, men kan ignoreres af AI’en. Vis disse for brugeren. Input
ParameterTypeStandardBeskrivelse
resourceIduuidFil-ID
designGuidelinesstring (min 1)Råtekstindhold af retningslinjer. Skal være en almindelig streng – ikke JSON-kodet
linkedTo"file""file"Ressourcetype
Valideringsregler
  • Frontmatter skal være åbnet og lukket korrekt
  • Frontmatter-linjer skal være gyldig blok-stil YAML
  • Markdown-indhold må ikke indeholde duplikerede ##-sektionsoverskrifter
Output"Design guidelines updated successfully", eventuelt efterfulgt af en Warnings:-sektion.

delete-design-guidelines

Ryd designretningslinjer for en fil. Input
ParameterTypeStandardBeskrivelse
resourceIduuidFil-ID
linkedTo"file""file"Ressourcetype
Output"Design guidelines deleted successfully"

Faktureringsværktøjer

get-plan-details

Få den aktuelle brugers abonnement, abonnementstatus og resterende kvote. Tager ingen input. Output
{
  "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 }
  }
}
Grænser varierer efter abonnement. Kald dette værktøj før en batch af genereringer for at kontrollere tilgængelig kvote.