> ## Documentation Index
> Fetch the complete documentation index at: https://docs.flowstep.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Serwer MCP Flowstep

> Używaj Flowstep jako serwera MCP do generowania, inspekcji i zarządzania projektami UI bezpośrednio z Cursor, Claude Code lub dowolnego klienta kompatybilnego z MCP.

Flowstep udostępnia swoje narzędzia projektowe za pośrednictwem [Model Context Protocol](https://modelcontextprotocol.io/), pozwalając asystentowi AI tworzyć i iterować ekrany UI bez opuszczania edytora.

Serwer jest hostowany na `https://api.flowstep.ai/mcp` (transport Streamable HTTP). Bez konieczności uruchamiania lokalnego procesu.

## Co możesz zrobić

Serwer udostępnia 20 narzędzi w siedmiu kategoriach:

| Kategoria          | Narzędzia                                                                                     |
| ------------------ | --------------------------------------------------------------------------------------------- |
| **Pliki**          | `create-file`, `list-files`, `get-file`, `update-file`, `delete-file`                         |
| **Ekrany**         | `list-screens`, `get-screen`, `get-screen-image`, `add-screen`                                |
| **Generowanie AI** | `create-new-design`, `regenerate-design`, `expand-design`, `edit-design`, `upload-attachment` |
| **Czat**           | `get-chat-history`                                                                            |
| **Projektowanie**  | `get-design-guidelines`, `update-design-guidelines`, `delete-design-guidelines`               |
| **Figma**          | `import-figma`                                                                                |
| **Rozliczenia**    | `get-plan-details`                                                                            |

## Typowe przypadki użycia

**Generuj ekrany z prompta** — wywołaj `create-new-design` z opisem. Flowstep tworzy plik i ekrany w jednym kroku. Wywołaj `get-screen-image` z zwróconymi `screenIds`, aby zobaczyć wynik inline.

**Wizualizuj komponent React** — prześlij plik `.jsx` lub `.tsx` za pośrednictwem `upload-attachment` (użyj `mimeType: text/javascript`), a następnie przekaż zwrócony załącznik do `create-new-design` z wiadomością opisującą komponent. Flowstep czyta kod źródłowy i generuje pasujący ekran projektowy.

**Iteruj nad projektem** — wywołaj `edit-design` z docelowym `screenId` i instrukcjami modyfikacji, lub `regenerate-design`, aby odtworzyć ekran od nowa.

**Utrzymuj wytyczne projektowe** — wywołaj `get-design-guidelines`, aby pobrać bieżące reguły stylu (kolory, typografia, odstępy, ton), a następnie użyj `update-design-guidelines`, aby utrzymywać je w synchronizacji w miarę ewolucji projektu. Przekazywanie spójnych wytycznych do `create-new-design` lub `edit-design` zapewnia, że każdy wygenerowany ekran pozostaje zgodny z marką. Użyj `delete-design-guidelines`, aby je całkowicie zresetować.

**Importuj z Figmy** — wywołaj `import-figma` z linkiem do ramki Figmy i `fileId`, aby przenieść ramkę do pliku Flowstep jako edytowalne elementy. Organizacja pliku musi mieć najpierw połączoną Figmę.

**Audyt limitu** — wywołaj `get-plan-details`, aby zobaczyć pozostałe dzienne i miesięczne użycie przed uruchomieniem partii generacji.

## Endpoint

```
https://api.flowstep.ai/mcp
```

Transport: Streamable HTTP. Model sesji: bezstanowy (każde żądanie jest niezależne, brak ID sesji).

## Następne kroki

<CardGroup cols={2}>
  <Card title="Szybki start" icon="bolt" href="/pl/mcp/quickstart">
    Pierwsze wywołanie narzędzia w mniej niż 5 minut z Cursor.
  </Card>

  <Card title="Uwierzytelnianie" icon="lock" href="/pl/mcp/authentication">
    Jak działa OAuth 2.1 PKCE i jak są wydawane tokeny.
  </Card>

  <Card title="Narzędzia" icon="wrench" href="/pl/mcp/tools">
    Pełna dokumentacja wejścia/wyjścia dla wszystkich 20 narzędzi.
  </Card>

  <Card title="Przykłady" icon="code" href="/pl/mcp/examples">
    Kompleksowe przepływy pracy dla typowych zadań.
  </Card>
</CardGroup>