MCP-værktøjsreference

Ved succes returnerer alle værktøjer undtagen get-screen-image deres resultat to gange: som structuredContent (valideret mod værktøjets publicerede outputskema) og som det samme objekt serialiseret i en tekstblok, { type: "text", text: "<json-string>" }, til klienter, der ikke læser structured content. get-screen-image returnerer kun en MCP-billedblok: { type: "image", data: "<base64>", mimeType: "image/png" }. Ved fejl sættes isError: true, og tekstblokken indeholder en kort fejlbesked. Fejl, du kan handle på — en navnefejl ved sletning, et ugyldigt Figma-link, ugyldige designretningslinjer, et problem med en vedhæftning eller en genereringstimeout — forklarer, hvad der skal rettes. Andre fejl returnerer en generisk besked, såsom Failed to list files.

Priser: de tre AI-designværktøjer — ai-design-screens, ai-generate-screen-variant og ai-edit-screen-variant — trækker på den samme beskedkvote som Flowstep-appen. Alle andre værktøjer er gratis. Se Brugsgrænser.

Hvert værktøj publicerer også MCP-annoteringer, så din klient ved, hvad det gør. delete-file, delete-screen, delete-design-guidelines, replace-screen-jsx, ai-design-screens og ai-edit-screen-variant er markeret som destruktive, fordi de fjerner eller overskriver eksisterende indhold.

Filværktøjer

`list-files`

Listér metadata for dine Flowstep-filer. Kald dette først for at tjekke, om en relevant fil allerede findes. Det returnerer intet skærmindhold — brug get-screen-image eller get-screen-jsx til det. Input

Parameter	Type	Standard	Beskrivelse
`orderByCreation`	`boolean`	`true`	Sortér nyeste først efter `created_at` (`true`) eller efter `updated_at` (`false`). Brug `false` for at finde nyligt redigerede filer
`limit`	`integer` (1–100)	`20`	Maksimalt antal returnerede filer. En fuld side betyder muligvis, at flere filer findes
`offset`	`integer` (≥0)	`0`	Antal filer, der springes over. Næste side er `offset + limit`

Output — { 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, hvis du oprettede filen.
shared_with_me — true, hvis filen blev delt med dig direkte, ikke kun via din organisation.
url — åbner filen i Flowstep-editoren.

`get-file`

Hent metadata for en enkelt fil. Filindholdet er bevidst udeladt — brug get-screen-image eller get-screen-jsx til at inspicere skærme, og get-design-guidelines til at hente tilknyttede retningslinjer. Hvis du har en ventende invitation til filen, accepterer et kald til get-file den. Input

Parameter	Type	Beskrivelse
`id`	`uuid`	Fil-ID

Output — { file, user_access_level }.

{
  "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 eller write.
visibility — private, member eller public.
user_access_level — din adgang til filen: read eller write.

`create-file`

Opret en tom Flowstep-fil uden skærme. For at oprette en fil og generere skærme i ét trin skal du i stedet kalde ai-design-screens uden et fileId. Brug create-file til code-first-workflows, efterfulgt af add-screen-jsx. Input

Parameter	Type	Beskrivelse
`name`	`string` (min. 1)	Visningsnavn for den nye fil

Output — { file, user_access_level }, i samme form som get-file. owner er altid true, og user_access_level er altid write. Brug det returnerede file.id som fileId i efterfølgende værktøjskald.

`update-file`

Omdøb en fil. Input

Parameter	Type	Beskrivelse
`id`	`uuid`	Fil-ID
`name`	`string` (min. 1)	Nyt visningsnavn

Output — { file, user_access_level }, i samme form som get-file.

`delete-file`

Slet en fil permanent. Det name, du sender, tjekkes mod filens aktuelle visningsnavn før sletning — hvis det ikke matcher, afbrydes sletningen. Det forhindrer, at du ved en fejl sletter den forkerte fil. Agenter får besked på at bekræfte med dig først. Input

Parameter	Type	Beskrivelse
`id`	`uuid`	Fil-ID
`name`	`string`	Filens aktuelle visningsnavn — skal matche, ellers afbrydes sletningen

Output — { "deleted": true }

Dette kan ikke fortrydes. Alle skærme i filen slettes.

Skærmværktøjer

`list-screens`

Listér skærmene i en fil, i lærredets rækkefølge. Kald dette efter list-files for at se, hvad der allerede findes i en fil. Brug de returnerede screenId-værdier med de andre skærmværktøjer og AI-designværktøjerne. Input

Parameter	Type	Beskrivelse
`fileId`	`uuid`	Fil-ID

Output — { 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 — den seneste genereringsprompt for skærmen, eller en tom streng, hvis den aldrig er genereret (for eksempel en skærm tilføjet med add-screen-jsx).
fidelity — lofi, hifi eller ui.

`get-screen-image`

Render en skærm til PNG og returnér den som et indlejret billede. Kræver en klient, der understøtter billedindholdsblokke. Kald det én gang for hvert screenId, der returneres af et AI-designværktøj, add-screen-jsx, replace-screen-jsx eller import-figma. Input

Parameter	Type	Beskrivelse
`fileId`	`uuid`	Fil-ID
`screenId`	`uuid`	Et `screenId` fra `list-screens` eller fra arrayet `screenIds`, der returneres af et designværktøj

Output — MCP-billedindholdsblok (image/png). data er standard base64 af PNG-bytes, ikke en data-URI. Der er intet structuredContent for dette værktøj.

`get-screen-jsx`

Hent en skærm som JSX samt dens metadata — så du kan bygge videre på den i din kodebase, eller redigere den og skrive den tilbage med replace-screen-jsx. Brug get-screen-image til en visuel forhåndsvisning i stedet. Input

Parameter	Type	Standard	Beskrivelse
`fileId`	`uuid`	—	Fil-ID
`screenId`	`uuid`	—	Et `screenId` fra `list-screens` eller fra arrayet `screenIds`, der returneres af et designværktøj
`includeIds`	`boolean`	`false`	Inkludér et `data-id`-attribut på elementer i `jsx`. Brug det, når du har brug for element-id’er til at sende som `elementIds` til `ai-design-screens`, enten for at redigere på stedet eller som visuel reference

Output — { fileId, screenId, name, prompt, fidelity, screenType, colorTheme, jsx, fragments }.

{
  "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 — kun markup. data-id-attributter inkluderes kun, når includeIds er true.
prompt — den seneste genereringsprompt, eller en tom streng, hvis skærmen aldrig er genereret.
fragments — delt chrome gemt på skærmen, såsom en navigationsbjælke, header eller logo, som { purpose, markup }-objekter. Tom, når der ingen er. Send dem tilbage til replace-screen-jsx for at beholde eller opdatere dem.

Se Skærmfeltværdier for værdierne fidelity, screenType og colorTheme.

`add-screen-jsx`

Tilføj en ny skærm til en fil ud fra JSX, du har skrevet. Dette er code-first-vejen og er gratis — brug ai-design-screens, når du vil have Flowsteps AI til at designe skærmen. add-screen-jsx opretter altid en ny skærm: for at overskrive en eksisterende skal du bruge replace-screen-jsx. For at vise et billede, du har uploadet, se Billeder i JSX. Når den nye skærm er baseret på en eksisterende, skal du starte fra get-screen-jsx (uden includeIds) for name, fidelity, screenType, colorTheme og jsx, og derefter ændre det, der skal være anderledes. Input

Parameter	Type	Standard	Beskrivelse
`fileId`	`uuid`	—	Fil-ID
`name`	`string` (1–100 tegn)	—	Valgfrit visningsnavn. Udelad det for automatisk at navngive skærmen `Screen N`
`fidelity`	`string`	`"ui"`	Skærmens fidelity
`screenType`	`string`	—	Påkrævet — den enhed eller det viewport, skærmen er designet til
`colorTheme`	`string`	`"default"`	Farvetema
`jsx`	`string`	—	Kun JSX-markup. Eventuelle `data-id`-attributter ignoreres — den nye skærm får nye element-id’er

Output — { fileId, screenId }. Kald get-screen-image med screenId for at se resultatet.

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

`replace-screen-jsx`

Overskriv en eksisterende skærm med JSX, du har skrevet. Skærmen beholder sit screenId og sin position på lærredet; indlejrede elementer får nye id’er. Dette er code-first-vejen og er gratis — brug ai-design-screens eller ai-edit-screen-variant til AI-ændringer, og add-screen-jsx til at oprette en ny skærm i stedet. Start fra get-screen-jsx (uden includeIds), og ændr derefter det, der skal være anderledes. For at vise et billede, du har uploadet, se Billeder i JSX. Input

Parameter	Type	Beskrivelse
`fileId`	`uuid`	Fil-ID
`screenId`	`uuid`	Skærmen, der skal overskrives
`jsx`	`string`	Kun JSX-markup. Eventuelle `data-id`-attributter ignoreres
`name`	`string` (1–100 tegn)	Valgfrit. Udelad for at beholde det aktuelle navn
`fidelity`	`string`	Valgfrit. Udelad for at beholde den aktuelle fidelity
`screenType`	`string`	Valgfrit. Udelad for at beholde den aktuelle skærmtype
`colorTheme`	`string`	Valgfrit. Udelad for at beholde det aktuelle farvetema
`fragments`	`{ purpose, markup }[]`	Valgfrit delt chrome fra `get-screen-jsx`. Udelad for at beholde de aktuelle fragmenter, eller send `[]` for at fjerne dem

Output — { fileId, screenId }. Kald get-screen-image med screenId for at se resultatet.

Dette erstatter skærmens indhold på stedet.

`rename-screen`

Omdøb en skærms navn på lærredet — navnet, der vises af list-screens og i editoren. Dette ændrer kun navnet, ikke skærmens layout, størrelse eller indhold — brug ai-design-screens til det. Input

Parameter	Type	Beskrivelse
`fileId`	`uuid`	Fil-ID
`screenId`	`uuid`	`screenId`’et returneret af `list-screens`
`name`	`string` (1–100 tegn)	Nyt skærmnavn. Mellemrum i begyndelse og slutning fjernes

Output — { screenId, name }.

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

`delete-screen`

Slet en skærm permanent fra en fil. Det name, du sender, tjekkes mod skærmens aktuelle visningsnavn — hvis det ikke matcher, afbrydes sletningen. Agenter får besked på at bekræfte med dig først. Input

Parameter	Type	Beskrivelse
`fileId`	`uuid`	Fil-ID
`screenId`	`uuid`	Skærmen, der skal slettes
`name`	`string`	Skærmens aktuelle visningsnavn — skal matche, ellers afbrydes sletningen

Output — { "deleted": true }

Billeder i JSX

add-screen-jsx og replace-screen-jsx accepterer billeder i en img-src eller som baggrund i className med bg-[url(...)]. Skriv alt-tekst, og tilpas størrelsen på hvert billede til dets formål. Sådan placerer du et billede, du selv har:

Upload det med upload-attachment i tilstand A (mimeType + fileName), og kør den returnerede uploadCommand.
Hvis svarets type er "image", skal du indsætte dets assetUrl præcis som returneret i img src eller bg-[url(assetUrl)].

Lad alle andre billed-URL’er stå præcis, som get-screen-jsx returnerede dem. Sæt ikke path, signedUrl eller uploadCommand i src.

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

Skærmfeltværdier

get-screen-jsx returnerer, og add-screen-jsx og replace-screen-jsx accepterer, disse værdier:

Felt	Værdier
`fidelity`	`lofi`, `hifi`, `ui`
`screenType`	`web`, `desktop`, `desktop-large`, `desktop-medium`, `desktop-small`, `tablet`, `ipad-tablet-horizontal`, `ipad-tablet-vertical`, `android-tablet-horizontal`, `android-tablet-vertical`, `mobile_ios`, `mobile_android`, `iphone-vertical`, `iphone-horizontal`, `iphone-x-vertical`, `iphone-x-horizontal`, `android-vertical`, `android-horizontal`, `android-small-vertical`, `android-small-horizontal`
`colorTheme`	`default`, `defaultDark`, `blue`, `blueDark`, `ice`, `iceDark`, `grayscale`, `grayscaleDark`, `green`, `greenDark`, `orange`, `orangeDark`, `red`, `redDark`, `rose`, `roseDark`, `violet`, `violetDark`, `yellow`, `yellowDark`

Designretningslinjer-værktøjer

Designretningslinjer er DESIGN.md-tekst gemt på en fil. Når de er sat, indsprøjtes de i hver AI-generering for den fil. Se Designretningslinjer.

`get-design-guidelines`

Hent designretningslinjerne tilknyttet en fil. Input

Parameter	Type	Beskrivelse
`fileId`	`uuid`	Fil-ID

Output — { guidelines }.

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

guidelines er null, hvis der ikke er sat nogen retningslinjer.

`update-design-guidelines`

Sæt eller erstat designretningslinjerne for en fil. Send retningslinjerne som en almindelig streng i Googles DESIGN.md-format — ikke som et objekt eller JSON. Hvis du læser fra en fil, skal du sende den filens tekst. Input

Parameter	Type	Beskrivelse
`fileId`	`uuid`	Fil-ID
`designGuidelines`	`string` (min. 1)	Rå tekst af retningslinjerne. Skal være en almindelig streng — ikke JSON-kodet

Valideringsregler

Frontmatter skal åbnes og lukkes korrekt
Frontmatter-linjer skal være gyldig YAML i blokformat
Markdown-brødteksten må ikke indeholde dublerede ##-sektionsoverskrifter

Hvis valideringen fejler, returnerer kaldet en fejl, der starter med Invalid design guidelines:. Output — { updated, warnings? }.

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

warnings lister bløde valideringsproblemer (ukendte nøgler, ikke-hex-farver), der blev accepteret, men som AI’en muligvis ignorerer. Det udelades, når der ingen er. Vis disse til brugeren.

`delete-design-guidelines`

Ryd designretningslinjerne for en fil. Sletning af retningslinjer, der ikke findes, har ingen effekt. Input

Parameter	Type	Beskrivelse
`fileId`	`uuid`	Fil-ID

Output — { "deleted": true }

Chatværktøjer

`get-chat-history`

Hent designsamtalen tilknyttet en fil — filens Flowstep-chat, ikke din MCP-klients samtale. Brug den til at genoptage tidligere arbejde på filen. Input

Parameter	Type	Beskrivelse
`fileId`	`uuid`	Fil-ID

Output — { messages }. messages er tom, når du ikke har nogen designsamtale på filen. Hver besked har en type ("request" eller "response"), en author ("human" eller "ai") og en content_type. Svarbeskeder bruger "text", "summary" eller "followup".

{
  "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" }]
    }
  ]
}

Vedhæftningsværktøjer

`upload-attachment`

Upload en referencefil til brug som vedhæftning i ai-design-screens, eller et billede, der skal placeres i din egen JSX med add-screen-jsx eller replace-screen-jsx. ai-generate-screen-variant og ai-edit-screen-variant tager ikke vedhæftninger. Filbytes passerer aldrig gennem modellen, og serveren henter aldrig URL’er på dine vegne. For at henvise til en webside skal du i stedet tage dens URL med i message for ai-design-screens. Der er to tilstande — brug præcis én, og kombinér dem ikke. Tilstand A — filer og billeder (mimeType + fileName) En påkrævet trinvis proces på tre trin for ethvert billede, en PDF eller en større tekstfil:

Kald upload-attachment med kun mimeType og fileName (for eksempel image/png og dog.png). Svaret er en forberedt upload, ikke en gemt fil:

{
  "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": "…"
}

Erstat LOCAL_FILE_PATH i uploadCommand med den absolutte sti til din fil, og kør netop den kommando i din shell — den skal afslutte med 0. Tokenet i signedUrl godkender kun denne ene upload. Hvis du springer dette trin over, forbliver lageret tomt, og designværktøjet fejler sin preflight-kontrol.
Send kun { id, path, type } ind i arrayet attachments i ai-design-screens — ikke signedUrl, uploadCommand eller nextStep. For at placere et billede i din egen JSX i stedet skal du sætte assetUrl i img src eller bg-[url(...)] i den JSX, du sender til add-screen-jsx eller replace-screen-jsx. Se Billeder i JSX.

For at vedhæfte en fjernfil skal du først selv downloade den til en lokal sti (for eksempel med curl) og derefter følge de samme tre trin. Send aldrig en URL til upload-attachment.

Parameter	Type	Beskrivelse
`mimeType`	enum	Filens MIME-type. En af `image/jpeg`, `image/png`, `image/webp`, `application/pdf`, `text/markdown`, `text/plain`, `text/javascript`. Brug `text/javascript` til `.jsx`-, `.tsx`-, `.js`- og `.ts`-filer
`fileName`	`string` (min. 1)	Originalt filnavn med endelse, for eksempel `cat.png` eller `design.md`

Tilstand B — kort tekst (text + mimeType) Upload tekst, der allerede er i konteksten — ingen shell-kommando er nødvendig. Svaret kan bruges direkte:

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

Parameter	Type	Beskrivelse
`text`	`string` (maks. 64.000 tegn)	Råt tekstindhold. Kun tekstfiler — brug ikke til billeder eller PDF’er. Længere end 64.000 tegn? Brug tilstand A i stedet
`mimeType`	enum	En af `text/markdown`, `text/plain`, `text/javascript`

Send den resulterende { id, path, type } ind i arrayet attachments i ai-design-screens. Den maksimale filstørrelse er 3 MB på tværs af begge tilstande, og PDF’er er begrænset til 100 sider. Output — { id, path, assetUrl, type, mimeType, signedUrl?, uploadCommand?, nextStep? }.

type — "image" for billedfiler og "document" for PDF’er og tekstfiler.
assetUrl — den uploadede fils URL, returneret i begge tilstande. Brug den i JSX til add-screen-jsx eller replace-screen-jsx kun når type er "image", og kun efter at uploadCommand fra tilstand A er kørt.
signedUrl, uploadCommand, nextStep — sættes kun i tilstand A. Send dem ikke videre til designværktøjerne.

Figma-værktøjer

`import-figma`

Importér en Figma-frame til en Flowstep-fil som redigerbare elementer på dens lærred. Hver import tilføjer en ny skærm — at importere den samme frame to gange giver dig to skærme, så slet den gamle med delete-screen, hvis du mente at erstatte den. Filens organisation skal have Figma forbundet i Flowstep-indstillingerne. Input

Parameter	Type	Beskrivelse
`fileId`	`uuid`	Flowstep-filen, som framen skal importeres til. Dette er ikke Figma-filnøglen i `figmaUrl`
`figmaUrl`	`string`	Link til en bestemt Figma-frame med en `node-id`. I Figma skal du højreklikke på framen og vælge Copy/Paste as → Copy link to selection. Et link til en side importerer alle top-level frames på den side (begrænset til 20 frames over MCP)

Output — { fileId, screenId, frameCount? }. screenId er den importerede skærm — send den til get-screen-image for at se resultatet. Når en side-URL importerer flere frames, er screenId null, og frameCount returneres i stedet; kald list-screens og derefter get-screen-image for hver ny skærm.

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

Abonnements- og faktureringsværktøjer

`get-plan-details`

Hent din organisations Flowstep-abonnement, abonnementsstatus, forbrug og resterende kvote. Tager ingen input — organisationen findes ud fra den loggede ind bruger. Brug det til at tjekke din kvote, før du kalder AI-designværktøjerne. Output — { plan, subscription, limits, usage, remaining }.

Felt	Beskrivelse
`plan`	`{ name, code, type }`. `type` er `"free"` eller `"paid"`
`subscription`	`{ isPaid, isTrial, startDate, endDate, trialDaysRemaining }`
`limits`	Grænser pr. funktion, nøglet efter funktion (for eksempel `messages`). Hver har valgfri `daily`- og `monthly`-objekter med `max`- og `warn`-værdier samt et `unlimited`-flag
`usage`	Forbrug pr. funktion indtil nu, som `{ daily, monthly }`
`remaining`	Resterende kvote pr. funktion, som `{ daily, monthly }`. Udeladt for ubegrænsede funktioner

Grænserne varierer efter abonnement — se Priser og Brugsgrænser.

AI-designværktøjer

Disse tre værktøjer designer ud fra en beskrivelse eller en forudindstilling — de tager eller genbruger aldrig JSX. Hvert kald trækker på den samme beskedkvote som Flowstep-appen og blokerer, indtil genereringen er færdig eller timer ud (180 sekunder).

Værktøj	Brug det til at
`ai-design-screens`	Generere nye skærme, ændre eksisterende skærme på stedet eller begge dele ud fra en fritekstbeskrivelse
`ai-generate-screen-variant`	Tilføje et næste trin, en fejl- eller tom-tilstand eller en platformvariant af én eksisterende skærm
`ai-edit-screen-variant`	Anvende en redigerings- eller redesign-forudindstilling på én hel eksisterende skærm

Alle tre returnerer { status, fileId, screenIds, designGuidelinesUpdated }. Kald get-screen-image én gang for hvert screenId for at se resultatet.

designGuidelinesUpdated — en kort opsummering af ændringen, når filens DESIGN.md-retningslinjer blev opdateret automatisk under denne tur; ellers null.

`ai-design-screens`

Generér en eller flere nye skærme, ændr eksisterende skærme på stedet eller begge dele i ét kald ud fra en tekstbeskrivelse — nye flows, theming, tekst, layout eller koordinerede ændringer på tværs af flere skærme. Dette er den samme designagent som chatten i Flowstep-editoren: den afgør ud fra din message og elementIds, hvad der skal bygges, og hvad der skal ændres. Udelad fileId for at starte en ny fil; send fileId for at arbejde i en eksisterende. Hvis anmodningen kunne gælde for en fil, du allerede har, bør din agent tjekke list-files og list-screens først. Til et næste trin, en fejl- eller tom-tilstand eller en platformvariant af én skærm skal du bruge ai-generate-screen-variant. Til en forudindstillet redigering eller redesign af én skærm skal du bruge ai-edit-screen-variant. Hvis du allerede har JSX, skal du i stedet bruge add-screen-jsx eller replace-screen-jsx. Input

Parameter	Type	Standard	Beskrivelse
`fileId`	`uuid`	—	Målfil. Udelad for at oprette en ny fil. Påkrævet, når `elementIds` er sat
`message`	`string`	—	Beskrivelse af de skærme, der skal genereres, og/eller de ændringer, der skal foretages. Når du sender `elementIds`, skal du angive, om de skal redigeres, eller om de kun skal bruges som reference. Medtag eventuelle webside-URL’er, du vil have Flowstep til at referere til, her
`elementIds`	`uuid[]`	`[]`	Valgfri `screenId`’er fra `list-screens` og/eller element-`data-id`’er fra `get-screen-jsx` (med `includeIds`), ligesom et valg i editoren. De kan redigeres på stedet eller bruges som visuel reference til nye skærme. Et `screenId` målretter hele skærmen
`attachments`	`{ id, path, type }[]` (maks. 5)	`[]`	Filer fra `upload-attachment` — billeder, PDF’er eller kode- og tekstfiler. Indsæt ikke filindhold i beskeden

Eksempel — rediger én skærm og tilføj en anden i ét kald:

{
  "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"]
}

Output — { status, fileId, screenIds, designGuidelinesUpdated, reply? }.

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

status — "generated", når skærme blev bygget eller ændret. "chat", når Flowstep svarede uden at bygge, i hvilket tilfælde reply indeholder svaret, og screenIds er tom. Hvis din opgave er tvetydig, bør din agent bede dig præcisere og kalde værktøjet igen.
screenIds — hver skærm, der blev bygget eller ændret under kaldet, inklusive skærme redigeret på stedet. Hvis kaldet timer ud, efter at nogle skærme er bygget, returnerer det disse skærme i stedet for en fejl.

Skærme, du beder den om at redigere, overskrives på stedet.

`ai-generate-screen-variant`

Tilføj en ny skærm afledt af præcis én eksisterende skærm — det næste trin i flowet, en fejl- eller tom-tilstand eller en version til en anden platform. Den oprindelige skærm forbliver uændret. For at tilføje en skærm, der ikke er en variant af en eksisterende (for eksempel en indstillingsskærm), skal du bruge ai-design-screens med et fileId. Input

Parameter	Type	Beskrivelse
`fileId`	`uuid`	Målfil
`screenId`	`uuid`	Den eksisterende skærm, der skal afledes fra
`operationVariant`	enum	Påkrævet — hvordan den nye skærm forholder sig til den eksisterende

`operationVariant`	Tilføjer
`next_screen`	Den næste skærm i brugerflowet
`error_state`	En fejltilstand for skærmen
`empty_state`	En tom tilstand for skærmen
`web_version`	En webversion
`mobile_version`	En mobilversion
`tablet_version`	En tabletversion
`mobile_ios_version`	En iOS-version
`mobile_android_version`	En Android-version

Output — { status, fileId, screenIds, designGuidelinesUpdated }. status er altid "generated".

`ai-edit-screen-variant`

Ændr præcis én eksisterende skærm på stedet ved hjælp af en forudindstilling — tema den eller polere den, prøv et andet layout eller en anden visuel stil, eller redesign den fra bunden. Til nye skærme, fritekstinstruktioner eller en præcis redigering af enkelte elementer skal du bruge ai-design-screens. Input

Parameter	Type	Beskrivelse
`fileId`	`uuid`	Målfil
`screenId`	`uuid`	Den eksisterende skærm, der skal ændres
`operationVariant`	enum	Påkrævet — redigerings- eller redesign-forudindstillingen, der skal anvendes

`operationVariant`	Type	Effekt
`dark_theme`	Redigering	Skift skærmen til et mørkt tema
`light_theme`	Redigering	Skift skærmen til et lyst tema
`make_pretty`	Redigering	Polér skærmens visuelle design
`different_layout`	Redesign	Prøv et andet layout
`different_style`	Redesign	Prøv en anden visuel stil
`from_scratch`	Redesign	Redesign skærmen fra bunden

Output — { status, fileId, screenIds, designGuidelinesUpdated }. status er altid "generated".

Dette overskriver skærmens indhold på stedet.

Omdøbte værktøjer

Værktøjsnavne blev ændret i september og oktober 2026. Hvis du har prompts, scripts eller agentinstruktioner, der bruger de gamle navne, skal du opdatere dem:

Gammelt navn	Nyt navn
`get-screen`	`get-screen-jsx`
`add-screen`	`add-screen-jsx`
`replace-screen`	`replace-screen-jsx`
`ai-generate-screens`	`ai-design-screens`
`ai-edit-screens`	`ai-design-screens`
`create-new-design`	`ai-design-screens`
`edit-design` (fritekstinstruktioner)	`ai-design-screens`
`edit-design` (med en `operationVariant`-forudindstilling)	`ai-edit-screen-variant`
`regenerate-design`	`ai-edit-screen-variant`
`expand-design`	`ai-generate-screen-variant`

Inputs er også ændret: AI-designværktøjerne tager elementIds (eller et enkelt screenId for variant-værktøjerne) i stedet for targets, add-screen-jsx tager jsx og eksplicitte metadatafelter i stedet for jsxContent med en metadatakommentar, create-file tager name i stedet for title, og designretningslinje-værktøjerne tager fileId i stedet for resourceId og linkedTo.

​Filværktøjer

​list-files

​get-file

​create-file

​update-file

​delete-file

​Skærmværktøjer

​list-screens

​get-screen-image

​get-screen-jsx

​add-screen-jsx

​replace-screen-jsx

​rename-screen

​delete-screen

​Billeder i JSX

​Skærmfeltværdier

​Designretningslinjer-værktøjer

​get-design-guidelines

​update-design-guidelines

​delete-design-guidelines

​Chatværktøjer

​get-chat-history

​Vedhæftningsværktøjer

​upload-attachment

​Figma-værktøjer

​import-figma

​Abonnements- og faktureringsværktøjer

​get-plan-details

​AI-designværktøjer

​ai-design-screens

​ai-generate-screen-variant

​ai-edit-screen-variant

​Omdøbte værktøjer

Filværktøjer

`list-files`

`get-file`

`create-file`

`update-file`

`delete-file`

Skærmværktøjer

`list-screens`

`get-screen-image`

`get-screen-jsx`

`add-screen-jsx`

`replace-screen-jsx`

`rename-screen`

`delete-screen`

Billeder i JSX

Skærmfeltværdier

Designretningslinjer-værktøjer

`get-design-guidelines`

`update-design-guidelines`

`delete-design-guidelines`

Chatværktøjer

`get-chat-history`

Vedhæftningsværktøjer

`upload-attachment`

Figma-værktøjer

`import-figma`

Abonnements- og faktureringsværktøjer

`get-plan-details`

AI-designværktøjer

`ai-design-screens`

`ai-generate-screen-variant`

`ai-edit-screen-variant`

Omdøbte værktøjer