Referința instrumentelor MCP

La succes, fiecare instrument, cu excepția get-screen-image, returnează rezultatul de două ori: ca structuredContent (validat în raport cu schema de ieșire publicată a instrumentului) și ca același obiect serializat într-un bloc de text, { type: "text", text: "<json-string>" }, pentru clienții care nu citesc conținutul structurat. get-screen-image returnează doar un bloc de imagine MCP: { type: "image", data: "<base64>", mimeType: "image/png" }. La eroare, isError: true este setat, iar blocul de text conține un mesaj scurt de eroare. Erorile la care poți reacționa (o nepotrivire de nume la ștergere, un link Figma invalid, ghiduri de design invalide, o problemă cu un atașament sau expirarea generării) explică ce trebuie corectat. Alte erori returnează un mesaj generic, cum ar fi Failed to list files.

Prețuri: cele trei instrumente de design AI, adică ai-design-screens, ai-generate-screen-variant și ai-edit-screen-variant, folosesc aceeași limită de mesaje ca aplicația Flowstep. Toate celelalte instrumente sunt gratuite. Consultă Limite de utilizare.

Fiecare instrument publică și adnotări MCP, ca clientul tău să știe ce face. delete-file, delete-screen, delete-design-guidelines, replace-screen-jsx, ai-design-screens și ai-edit-screen-variant sunt marcate ca distructive, deoarece elimină sau suprascriu conținut existent.

Instrumente pentru fișiere

`list-files`

Listează metadatele fișierelor tale Flowstep. Apelează-l primul ca să verifici dacă există deja un fișier relevant. Nu returnează conținutul ecranelor. Pentru asta folosește get-screen-image sau get-screen-jsx. Intrare

Parametru	Tip	Implicit	Descriere
`orderByCreation`	`boolean`	`true`	Sortează de la cel mai nou după `created_at` (`true`) sau după `updated_at` (`false`). Folosește `false` ca să găsești fișierele editate recent
`limit`	`integer` (1–100)	`20`	Numărul maxim de fișiere returnate. O pagină completă poate însemna că există mai multe fișiere
`offset`	`integer` (≥0)	`0`	Numărul de fișiere de sărit. Pagina următoare este `offset + limit`

Ieșire: { 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 dacă tu ai creat fișierul.
shared_with_me: true dacă fișierul ți-a fost partajat direct, nu doar prin organizația ta.
url: deschide fișierul în editorul Flowstep.

`get-file`

Obține metadatele unui singur fișier. Conținutul fișierului este omis intenționat. Folosește get-screen-image sau get-screen-jsx ca să inspectezi ecranele și get-design-guidelines ca să obții ghidurile atașate. Dacă ai o invitație în așteptare pentru fișier, apelul get-file o acceptă. Intrare

Parametru	Tip	Descriere
`id`	`uuid`	ID-ul fișierului

Ieșire: { 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 sau write.
visibility: private, member sau public.
user_access_level: accesul tău la fișier: read sau write.

`create-file`

Creează un fișier Flowstep gol, fără ecrane. Ca să creezi un fișier și să generezi ecrane într-un singur pas, apelează în schimb ai-design-screens fără fileId. Folosește create-file pentru fluxurile de lucru din cod, urmat de add-screen-jsx. Intrare

Parametru	Tip	Descriere
`name`	`string` (min 1)	Numele afișat al fișierului nou

Ieșire: { file, user_access_level }, în aceeași formă ca get-file. owner este întotdeauna true, iar user_access_level este întotdeauna write. Folosește file.id returnat ca fileId în apelurile de instrumente următoare.

`update-file`

Redenumește un fișier. Intrare

Parametru	Tip	Descriere
`id`	`uuid`	ID-ul fișierului
`name`	`string` (min 1)	Numele afișat nou

Ieșire: { file, user_access_level }, în aceeași formă ca get-file.

`delete-file`

Șterge definitiv un fișier. name pe care îl transmiți este verificat în raport cu numele afișat curent al fișierului înainte de ștergere. Dacă nu se potrivește, ștergerea este anulată. Astfel se previne ștergerea accidentală a fișierului greșit. Agenții sunt instruiți să te întrebe mai întâi pe tine. Intrare

Parametru	Tip	Descriere
`id`	`uuid`	ID-ul fișierului
`name`	`string`	Numele afișat curent al fișierului. Trebuie să se potrivească, altfel ștergerea este anulată

Ieșire: { "deleted": true }

Această acțiune este ireversibilă. Toate ecranele din fișier sunt șterse.

Instrumente pentru ecrane

`list-screens`

Listează ecranele dintr-un fișier, în ordinea canvasului. Apelează-l după list-files ca să vezi ce există deja într-un fișier. Folosește valorile screenId returnate cu celelalte instrumente pentru ecrane și cu instrumentele de design AI. Intrare

Parametru	Tip	Descriere
`fileId`	`uuid`	ID-ul fișierului

Ieșire: { 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: ultimul prompt de generare pentru ecran sau un șir gol, dacă ecranul nu a fost niciodată generat (de exemplu, un ecran adăugat cu add-screen-jsx).
fidelity: lofi, hifi sau ui.

`get-screen-image`

Randează un ecran ca PNG și îl returnează ca imagine în linie. Necesită un client care acceptă blocuri de conținut de tip imagine. Apelează-l o dată pentru fiecare screenId returnat de un instrument de design AI, de add-screen-jsx, de replace-screen-jsx sau de import-figma. Intrare

Parametru	Tip	Descriere
`fileId`	`uuid`	ID-ul fișierului
`screenId`	`uuid`	Un `screenId` din `list-screens` sau din lista `screenIds` returnată de un instrument de design

Ieșire: bloc de conținut imagine MCP (image/png). data este base64 standard al octeților PNG, nu un URI de date. Acest instrument nu are structuredContent.

`get-screen-jsx`

Obține un ecran ca JSX, împreună cu metadatele sale, ca să construiești pornind de la el în baza ta de cod sau ca să îl editezi și să îl scrii înapoi cu replace-screen-jsx. Pentru o previzualizare vizuală, folosește în schimb get-screen-image. Intrare

Parametru	Tip	Implicit	Descriere
`fileId`	`uuid`	—	ID-ul fișierului
`screenId`	`uuid`	—	Un `screenId` din `list-screens` sau din lista `screenIds` returnată de un instrument de design
`includeIds`	`boolean`	`false`	Include un atribut `data-id` pe elementele din `jsx`. Folosește-l când ai nevoie de ID-uri de elemente pe care să le transmiți ca `elementIds` către `ai-design-screens`, fie ca să editezi pe loc, fie ca referință vizuală

Ieșire: { 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: doar markup. Atributele data-id sunt incluse numai când includeIds este true.
prompt: ultimul prompt de generare sau un șir gol, dacă ecranul nu a fost niciodată generat.
fragments: elemente comune de interfață stocate pe ecran, cum ar fi o bară de navigare, un antet sau un logo, sub formă de obiecte { purpose, markup }. Este gol dacă nu există. Transmite-le înapoi către replace-screen-jsx ca să le păstrezi sau să le actualizezi.

Consultă Valorile câmpurilor ecranului pentru valorile fidelity, screenType și colorTheme.

`add-screen-jsx`

Adaugă un ecran nou într-un fișier, din JSX pe care l-ai scris. Este calea din cod și este gratuită. Folosește ai-design-screens când vrei ca AI-ul Flowstep să proiecteze ecranul. add-screen-jsx creează întotdeauna un ecran nou. Ca să suprascrii unul existent, folosește replace-screen-jsx. Pentru a afișa o imagine pe care ai încărcat-o, consultă Imagini în JSX. Când ecranul nou se bazează pe unul existent, pornește de la get-screen-jsx (fără includeIds) pentru name, fidelity, screenType, colorTheme și jsx, apoi schimbă ce trebuie să difere. Intrare

Parametru	Tip	Implicit	Descriere
`fileId`	`uuid`	—	ID-ul fișierului
`name`	`string` (1–100 caractere)	—	Nume afișat opțional. Omite-l ca ecranul să primească automat numele `Screen N`
`fidelity`	`string`	`"ui"`	Fidelitatea ecranului
`screenType`	`string`	—	Obligatoriu: dispozitivul sau viewport-ul pentru care este proiectat ecranul
`colorTheme`	`string`	`"default"`	Tema de culori
`jsx`	`string`	—	Doar markup JSX. Atributele `data-id` sunt ignorate: ecranul nou primește ID-uri de elemente noi

Ieșire: { fileId, screenId }. Apelează get-screen-image cu screenId ca să vezi rezultatul.

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

`replace-screen-jsx`

Suprascrie un ecran existent cu JSX pe care l-ai scris. Ecranul își păstrează screenId și poziția pe canvas. Elementele imbricate primesc ID-uri noi. Este calea din cod și este gratuită. Pentru modificările AI, folosește ai-design-screens sau ai-edit-screen-variant. Ca să creezi un ecran nou, folosește în schimb add-screen-jsx. Pornește de la get-screen-jsx (fără includeIds), apoi schimbă ce trebuie să difere. Pentru a afișa o imagine pe care ai încărcat-o, consultă Imagini în JSX. Intrare

Parametru	Tip	Descriere
`fileId`	`uuid`	ID-ul fișierului
`screenId`	`uuid`	Ecranul care urmează să fie suprascris
`jsx`	`string`	Doar markup JSX. Atributele `data-id` sunt ignorate
`name`	`string` (1–100 caractere)	Opțional. Omite-l ca să păstrezi numele curent
`fidelity`	`string`	Opțional. Omite-l ca să păstrezi fidelitatea curentă
`screenType`	`string`	Opțional. Omite-l ca să păstrezi tipul de ecran curent
`colorTheme`	`string`	Opțional. Omite-l ca să păstrezi tema de culori curentă
`fragments`	`{ purpose, markup }[]`	Elemente comune opționale de interfață din `get-screen-jsx`. Omite-le ca să păstrezi fragmentele curente sau transmite `[]` ca să le golești

Ieșire: { fileId, screenId }. Apelează get-screen-image cu screenId ca să vezi rezultatul.

Aceasta înlocuiește conținutul ecranului pe loc.

`rename-screen`

Redenumește eticheta de pe canvas a unui ecran, adică numele afișat de list-screens și în editor. Modifică doar eticheta, nu layoutul, dimensiunea sau conținutul ecranului. Pentru acestea, folosește ai-design-screens. Intrare

Parametru	Tip	Descriere
`fileId`	`uuid`	ID-ul fișierului
`screenId`	`uuid`	`screenId`-ul returnat de `list-screens`
`name`	`string` (1–100 caractere)	Numele nou al ecranului. Spațiile de la început și de la sfârșit sunt eliminate

Ieșire: { screenId, name }.

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

`delete-screen`

Șterge definitiv un ecran dintr-un fișier. name pe care îl transmiți este verificat în raport cu numele afișat curent al ecranului. Dacă nu se potrivește, ștergerea este anulată. Agenții sunt instruiți să te întrebe mai întâi pe tine. Intrare

Parametru	Tip	Descriere
`fileId`	`uuid`	ID-ul fișierului
`screenId`	`uuid`	Ecranul care urmează să fie șters
`name`	`string`	Numele afișat curent al ecranului. Trebuie să se potrivească, altfel ștergerea este anulată

Ieșire: { "deleted": true }

Imagini în JSX

add-screen-jsx și replace-screen-jsx acceptă imagini într-un src al img-ului sau ca fundal în className, cu bg-[url(...)]. Scrie text alt și dimensionează fiecare imagine în funcție de rolul ei. Pentru a plasa o imagine proprie:

Încarcă-o cu upload-attachment în Modul A (mimeType + fileName) și rulează uploadCommand returnat.
Dacă type din răspuns este "image", lipește assetUrl exact cum a fost returnat în img src sau în bg-[url(assetUrl)].

Lasă orice altă adresă de imagine exact cum a returnat-o get-screen-jsx. Nu pune path, signedUrl sau uploadCommand în src.

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

Valorile câmpurilor ecranului

get-screen-jsx returnează, iar add-screen-jsx și replace-screen-jsx acceptă, aceste valori:

Câmp	Valori
`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`

Instrumente pentru ghidurile de design

Ghidurile de design sunt text DESIGN.md stocat pe un fișier. Atunci când sunt setate, sunt injectate în fiecare generare AI pentru acel fișier. Consultă Ghiduri de design.

`get-design-guidelines`

Obține ghidurile de design atașate unui fișier. Intrare

Parametru	Tip	Descriere
`fileId`	`uuid`	ID-ul fișierului

Ieșire: { guidelines }.

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

guidelines este null dacă nu au fost setate ghiduri.

`update-design-guidelines`

Setează sau înlocuiește ghidurile de design pentru un fișier. Transmite ghidurile ca șir simplu, în formatul DESIGN.md al Google, nu ca obiect sau JSON. Dacă citești dintr-un fișier, transmite textul acelui fișier. Intrare

Parametru	Tip	Descriere
`fileId`	`uuid`	ID-ul fișierului
`designGuidelines`	`string` (min 1)	Textul brut al ghidurilor. Trebuie să fie un șir simplu, nu codificat JSON

Reguli de validare

Frontmatter-ul trebuie deschis și închis corect
Liniile din frontmatter trebuie să fie YAML valid în stil block
Corpul Markdown nu trebuie să conțină titluri de secțiune ## duplicate

Dacă validarea eșuează, apelul returnează o eroare care începe cu Invalid design guidelines:. Ieșire: { updated, warnings? }.

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

warnings enumeră problemele de validare ușoară (chei necunoscute, culori care nu sunt hexazecimale) care au fost acceptate, dar pe care AI-ul le poate ignora. Este omis dacă nu există. Comunică-le acestea utilizatorului.

`delete-design-guidelines`

Golește ghidurile de design ale unui fișier. Ștergerea ghidurilor care nu există nu are efect. Intrare

Parametru	Tip	Descriere
`fileId`	`uuid`	ID-ul fișierului

Ieșire: { "deleted": true }

Instrumente pentru chat

`get-chat-history`

Obține conversația de design asociată unui fișier, adică chatul Flowstep al fișierului, nu conversația clientului tău MCP. Folosește-l ca să reiei lucrul anterior la fișier. Intrare

Parametru	Tip	Descriere
`fileId`	`uuid`	ID-ul fișierului

Ieșire: { messages }. messages este gol când nu ai nicio conversație de design pe fișier. Fiecare mesaj are un type ("request" sau "response"), un author ("human" sau "ai") și un content_type. Mesajele de răspuns folosesc "text", "summary" sau "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" }]
    }
  ]
}

Instrumente pentru atașamente

`upload-attachment`

Încarcă un fișier de referință pentru a-l folosi ca atașament în ai-design-screens, sau o imagine pe care să o plasezi în propriul JSX cu add-screen-jsx sau replace-screen-jsx. ai-generate-screen-variant și ai-edit-screen-variant nu acceptă atașamente. Octeții fișierelor nu trec niciodată prin model, iar serverul nu preia URL-uri în numele tău. Ca să faci referire la o pagină web, include adresa ei în message-ul ai-design-screens. Există două moduri. Folosește exact unul și nu le combina. Modul A: fișiere și imagini (mimeType + fileName) Un flux obligatoriu în trei pași pentru orice imagine, PDF sau fișier text mai mare:

Apelează upload-attachment doar cu mimeType și fileName (de exemplu image/png și dog.png). Răspunsul este o încărcare pregătită, nu un fișier stocat:

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

Înlocuiește LOCAL_FILE_PATH din uploadCommand cu calea absolută către fișierul tău și rulează exact această comandă în terminal. Trebuie să se încheie cu codul 0. Tokenul din signedUrl autorizează doar această singură încărcare. Dacă sari peste acest pas, stocarea rămâne goală, iar instrumentul de design eșuează la verificarea preliminară.
Transmite doar { id, path, type } în lista attachments a ai-design-screens, nu signedUrl, uploadCommand sau nextStep. Ca să plasezi în schimb o imagine în propriul JSX, pune assetUrl în img src sau bg-[url(...)] din JSX-ul pe care îl transmiți către add-screen-jsx ori replace-screen-jsx. Consultă Imagini în JSX.

Ca să atașezi un fișier de la distanță, descarcă-l mai întâi tu într-o cale locală (de exemplu cu curl), apoi urmează aceiași trei pași. Nu transmite niciodată un URL către upload-attachment.

Parametru	Tip	Descriere
`mimeType`	enum	Tipul MIME al fișierului. Unul dintre `image/jpeg`, `image/png`, `image/webp`, `application/pdf`, `text/markdown`, `text/plain`, `text/javascript`. Folosește `text/javascript` pentru fișiere `.jsx`, `.tsx`, `.js`, `.ts`
`fileName`	`string` (min 1)	Numele original al fișierului, cu extensie, de exemplu `cat.png` sau `design.md`

Modul B: text scurt (text + mimeType) Încarcă text care se află deja în context, fără nevoie de o comandă de shell. Răspunsul este gata de utilizare direct:

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

Parametru	Tip	Descriere
`text`	`string` (max 64.000 de caractere)	Conținut text brut. Doar fișiere text. Nu le folosi pentru imagini sau PDF-uri. Dacă textul depășește 64.000 de caractere, folosește Modul A
`mimeType`	enum	Unul dintre `text/markdown`, `text/plain`, `text/javascript`

Transmite { id, path, type } rezultat în lista attachments a ai-design-screens. Dimensiunea maximă a unui fișier este de 3 MB în ambele moduri, iar PDF-urile sunt limitate la 100 de pagini. Ieșire: { id, path, assetUrl, type, mimeType, signedUrl?, uploadCommand?, nextStep? }.

type: "image" pentru fișiere imagine și "document" pentru PDF-uri și fișiere text.
assetUrl: URL-ul fișierului încărcat, returnat în ambele moduri. Folosește-l în JSX pentru add-screen-jsx sau replace-screen-jsx doar când type este "image" și numai după ce a rulat uploadCommand din Modul A.
signedUrl, uploadCommand, nextStep: setate doar în Modul A. Nu le transmite către instrumentele de design.

Instrumente pentru Figma

`import-figma`

Importă un cadru Figma într-un fișier Flowstep, ca elemente editabile pe canvasul lui. Fiecare import adaugă un ecran nou. Importarea aceluiași cadru de două ori îți oferă două ecrane, așa că șterge-l pe cel vechi cu delete-screen dacă vrei să îl înlocuiești. Organizația fișierului trebuie să aibă Figma conectat în setările Flowstep. Intrare

Parametru	Tip	Descriere
`fileId`	`uuid`	Fișierul Flowstep în care se importă cadrul. Nu este cheia fișierului Figma din `figmaUrl`
`figmaUrl`	`string`	Link către un cadru Figma specific, cu un `node-id`. În Figma, fă clic dreapta pe cadru și alege Copy/Paste as → Copy link to selection. Un link către o pagină importă toate cadrele de nivel superior de pe acea pagină (limitate la 20 de cadre prin MCP)

Ieșire: { fileId, screenId, frameCount? }. screenId este ecranul importat. Transmite-l către get-screen-image ca să vezi rezultatul. Când un URL de pagină importă mai multe cadre, screenId este null, iar în schimb se returnează frameCount. Apelează list-screens, apoi get-screen-image pentru fiecare ecran nou.

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

Instrumente pentru plan și facturare

`get-plan-details`

Obține planul Flowstep al organizației tale, starea abonamentului, utilizarea și cota rămasă. Nu primește nicio intrare. Organizația se determină din utilizatorul conectat. Folosește-l ca să verifici limita înainte de a apela instrumentele de design AI. Ieșire: { plan, subscription, limits, usage, remaining }.

Câmp	Descriere
`plan`	`{ name, code, type }`. `type` este `"free"` sau `"paid"`
`subscription`	`{ isPaid, isTrial, startDate, endDate, trialDaysRemaining }`
`limits`	Limitele pe funcționalitate, indexate după funcționalitate (de exemplu `messages`). Fiecare are obiecte opționale `daily` și `monthly`, cu valorile `max` și `warn`, plus un indicator `unlimited`
`usage`	Utilizarea pe funcționalitate până acum, ca `{ daily, monthly }`
`remaining`	Cota rămasă pe funcționalitate, ca `{ daily, monthly }`. Este omisă pentru funcționalitățile nelimitate

Limitele variază în funcție de plan. Consultă Prețuri și Limite de utilizare.

Instrumente de design AI

Aceste trei instrumente proiectează pornind de la o descriere sau de la o presetare. Nu primesc și nu reutilizează niciodată JSX. Fiecare apel consumă din aceeași limită de mesaje ca aplicația Flowstep și blochează până când generarea se termină sau expiră (180 de secunde).

Instrument	Folosește-l ca să
`ai-design-screens`	Generezi ecrane noi, modifici ecrane existente pe loc sau pe amândouă, pornind de la o descriere liberă
`ai-generate-screen-variant`	Adaugi un pas următor, o stare de eroare sau goală ori o variantă pentru o platformă a unui ecran existent
`ai-edit-screen-variant`	Aplici o presetare de editare sau de regândire unui ecran existent, întreg

Toate cele trei returnează { status, fileId, screenIds, designGuidelinesUpdated }. Apelează get-screen-image o dată pentru fiecare screenId ca să vezi rezultatul.

designGuidelinesUpdated: un rezumat scurt al modificării, atunci când ghidurile DESIGN.md ale fișierului au fost actualizate automat în timpul acestei runde. Altfel, null.

`ai-design-screens`

Generează unul sau mai multe ecrane noi, modifică ecrane existente pe loc sau pe amândouă într-un singur apel, pornind de la o descriere în text. Include fluxuri noi, teme, text, layout sau modificări coordonate pe mai multe ecrane. Acesta este același agent de design ca chatul din editorul Flowstep. Decide din message și elementIds ce să construiască și ce să modifice. Omite fileId ca să începi un fișier nou. Transmite fileId ca să lucrezi într-un fișier existent. Dacă cererea s-ar putea aplica unui fișier pe care îl ai deja, agentul tău ar trebui să verifice mai întâi list-files și list-screens. Pentru un pas următor, o stare de eroare sau goală ori o variantă pentru o platformă a unui singur ecran, folosește ai-generate-screen-variant. Pentru o presetare de editare sau de regândire a unui singur ecran, folosește ai-edit-screen-variant. Dacă ai deja JSX, folosește în schimb add-screen-jsx sau replace-screen-jsx. Intrare

Parametru	Tip	Implicit	Descriere
`fileId`	`uuid`	—	Fișierul țintă. Omite-l ca să creezi un fișier nou. Obligatoriu când `elementIds` este setat
`message`	`string`	—	Descrierea ecranelor de generat și/sau a modificărilor de făcut. Când transmiți `elementIds`, spune dacă să le editezi sau să le folosești ca referință. Include aici orice URL de pagini web pe care vrei să le consulte Flowstep
`elementIds`	`uuid[]`	`[]`	`screenId`-uri opționale din `list-screens` și/sau `data-id`-uri ale elementelor din `get-screen-jsx` (cu `includeIds`), ca o selecție în editor. Pot fi editate pe loc sau folosite ca referință vizuală pentru ecrane noi. Un `screenId` vizează întregul ecran
`attachments`	`{ id, path, type }[]` (max 5)	`[]`	Fișiere din `upload-attachment`: imagini, PDF-uri sau fișiere de cod și text. Nu include conținutul fișierelor în `message`

Exemplu: editează un ecran și adaugă altul într-un singur apel:

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

Ieșire: { 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" când au fost construite sau modificate ecrane. "chat" când Flowstep a răspuns fără să construiască nimic, caz în care reply conține răspunsul, iar screenIds este gol. Dacă brieful tău este ambiguu, agentul tău ar trebui să îți ceară clarificări și să apeleze din nou instrumentul.
screenIds: fiecare ecran construit sau modificat în timpul apelului, inclusiv ecranele editate pe loc. Dacă apelul expiră după ce au fost construite unele ecrane, returnează acele ecrane în loc de o eroare.

Ecranele pe care le ceri să fie editate sunt suprascrise pe loc.

`ai-generate-screen-variant`

Adaugă un ecran nou derivat dintr-un singur ecran existent: pasul următor din flux, o stare de eroare sau goală ori o versiune pentru altă platformă. Ecranul original rămâne neschimbat. Ca să adaugi un ecran care nu este o variantă a unui ecran existent (de exemplu, un ecran de setări), folosește ai-design-screens cu un fileId. Intrare

Parametru	Tip	Descriere
`fileId`	`uuid`	Fișierul țintă
`screenId`	`uuid`	Ecranul existent din care se derivă
`operationVariant`	enum	Obligatoriu: modul în care se raportează ecranul nou la cel existent

`operationVariant`	Adaugă
`next_screen`	Următorul ecran din fluxul utilizatorului
`error_state`	O stare de eroare a ecranului
`empty_state`	O stare goală a ecranului
`web_version`	O versiune web
`mobile_version`	O versiune mobilă
`tablet_version`	O versiune pentru tabletă
`mobile_ios_version`	O versiune iOS
`mobile_android_version`	O versiune Android

Ieșire: { status, fileId, screenIds, designGuidelinesUpdated }. status este întotdeauna "generated".

`ai-edit-screen-variant`

Modifică exact un ecran existent pe loc, folosind o presetare: îl temi sau îl lustruiești, încerci un alt layout sau un alt stil vizual ori îl regândești de la zero. Pentru ecrane noi, instrucțiuni libere sau o modificare precisă a unor elemente individuale, folosește ai-design-screens. Intrare

Parametru	Tip	Descriere
`fileId`	`uuid`	Fișierul țintă
`screenId`	`uuid`	Ecranul existent care urmează să fie modificat
`operationVariant`	enum	Obligatoriu: presetarea de editare sau de regândire de aplicat

`operationVariant`	Tip	Efect
`dark_theme`	Editare	Trece ecranul la o temă întunecată
`light_theme`	Editare	Trece ecranul la o temă luminoasă
`make_pretty`	Editare	Lustruiește designul vizual al ecranului
`different_layout`	Regândire	Încearcă un alt layout
`different_style`	Regândire	Încearcă un alt stil vizual
`from_scratch`	Regândire	Regândește ecranul de la zero

Ieșire: { status, fileId, screenIds, designGuidelinesUpdated }. status este întotdeauna "generated".

Aceasta suprascrie conținutul ecranului pe loc.

Instrumente redenumite

Numele instrumentelor s-au schimbat în septembrie și octombrie 2026. Dacă ai prompturi, scripturi sau instrucțiuni pentru agenți care folosesc numele vechi, actualizează-le:

Nume vechi	Nume nou
`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` (instrucțiuni libere)	`ai-design-screens`
`edit-design` (cu o presetare `operationVariant`)	`ai-edit-screen-variant`
`regenerate-design`	`ai-edit-screen-variant`
`expand-design`	`ai-generate-screen-variant`

S-au schimbat și intrările: instrumentele de design AI primesc elementIds (sau un singur screenId pentru instrumentele de variante) în loc de targets. add-screen-jsx primește jsx și câmpuri explicite de metadate, în loc de jsxContent cu un comentariu de metadate. create-file primește name în loc de title, iar instrumentele pentru ghidurile de design primesc fileId în loc de resourceId și linkedTo.

​Instrumente pentru fișiere

​list-files

​get-file

​create-file

​update-file

​delete-file

​Instrumente pentru ecrane

​list-screens

​get-screen-image

​get-screen-jsx

​add-screen-jsx

​replace-screen-jsx

​rename-screen

​delete-screen

​Imagini în JSX

​Valorile câmpurilor ecranului

​Instrumente pentru ghidurile de design

​get-design-guidelines

​update-design-guidelines

​delete-design-guidelines

​Instrumente pentru chat

​get-chat-history

​Instrumente pentru atașamente

​upload-attachment

​Instrumente pentru Figma

​import-figma

​Instrumente pentru plan și facturare

​get-plan-details

​Instrumente de design AI

​ai-design-screens

​ai-generate-screen-variant

​ai-edit-screen-variant

​Instrumente redenumite

Instrumente pentru fișiere

`list-files`

`get-file`

`create-file`

`update-file`

`delete-file`

Instrumente pentru ecrane

`list-screens`

`get-screen-image`

`get-screen-jsx`

`add-screen-jsx`

`replace-screen-jsx`

`rename-screen`

`delete-screen`

Imagini în JSX

Valorile câmpurilor ecranului

Instrumente pentru ghidurile de design

`get-design-guidelines`

`update-design-guidelines`

`delete-design-guidelines`

Instrumente pentru chat

`get-chat-history`

Instrumente pentru atașamente

`upload-attachment`

Instrumente pentru Figma

`import-figma`

Instrumente pentru plan și facturare

`get-plan-details`

Instrumente de design AI

`ai-design-screens`

`ai-generate-screen-variant`

`ai-edit-screen-variant`

Instrumente redenumite