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

# Kiro Setup

> Connect Kiro IDE to Civic with native Streamable HTTP support

## Prerequisites

<CardGroup cols={2}>
  <Card title="Kiro IDE" icon="code" href="https://kiro.dev/downloads/">
    Download and install Kiro
  </Card>

  <Card title="Civic Account" icon="user" href="https://app.civic.com">
    Create a free account and configure your tools at app.civic.com
  </Card>
</CardGroup>

## Setup

Kiro supports remote MCP servers natively via Streamable HTTP — no local bridge required.

<Steps>
  <Step title="Get your Civic credentials">
    Go to [app.civic.com](https://app.civic.com) and navigate to **Install → MCP URL** to get your `CIVIC_URL` and `CIVIC_TOKEN`.
  </Step>

  <Step title="Open MCP config">
    Open the command palette and run **Kiro: Open workspace MCP config (JSON)** to create or edit `.kiro/settings/mcp.json`.

    For a global config that applies to all projects, use **Kiro: Open user MCP config (JSON)** instead (stored at `~/.kiro/settings/mcp.json`).
  </Step>

  <Step title="Add Civic as an MCP server">
    ```json theme={null}
    {
      "mcpServers": {
        "civic": {
          "url": "${CIVIC_URL}",
          "headers": {
            "Authorization": "Bearer ${CIVIC_TOKEN}"
          }
        }
      }
    }
    ```

    Set the `CIVIC_URL` and `CIVIC_TOKEN` environment variables in your shell profile, or replace the `${...}` placeholders with your actual values.
  </Step>

  <Step title="Enable MCP support">
    Open Settings (`Cmd + ,` on Mac, `Ctrl + ,` on Windows/Linux), search for **MCP**, and make sure the setting is enabled.
  </Step>

  <Step title="Verify connection">
    Open the Kiro panel and check the **MCP Servers** tab — Civic should appear with a connected status indicator.
  </Step>
</Steps>

## Test Your Connection

Open Kiro's agentic chat and try:

```
"What MCP tools do I have available?"
"List my Google Calendar events for today"
"Check my Gmail inbox"
```

## Reference Implementation

For a complete working example, see the [Kiro + Civic reference implementation](https://github.com/civicteam/kiro-reference-implementation-civic) — a Node.js app demonstrating Google Calendar and Gmail integration via Civic Hub, with Kiro steering files and specs included.

## Troubleshooting

<AccordionGroup>
  <Accordion title="Civic not appearing in MCP Servers tab">
    Verify that `.kiro/settings/mcp.json` is valid JSON and MCP support is enabled in Settings. Check MCP logs via the Kiro panel → **Output** tab → **Kiro - MCP Logs**.
  </Accordion>

  <Accordion title="Connection errors or 401 responses">
    Your Civic token may be expired (30-day expiry). Regenerate at [app.civic.com](https://app.civic.com) under **Install → MCP URL**. Make sure `CIVIC_URL` includes `?profile=your-toolkit-name`.
  </Accordion>

  <Accordion title="No tools available after connecting">
    Visit [app.civic.com](https://app.civic.com) to confirm your toolkit has MCP servers configured. An empty toolkit will result in no tools being available.
  </Accordion>

  <Accordion title="Environment variables not resolving">
    Kiro uses `${VAR}` syntax for env var expansion. Make sure the variables are set in your shell profile and Kiro was launched from that shell, or replace the placeholders with actual values.
  </Accordion>
</AccordionGroup>

## Need Help?

<CardGroup cols={2}>
  <Card title="Troubleshooting" icon="wrench" href="/civic/troubleshooting">
    Common connection issues and solutions
  </Card>

  <Card title="Get Help" icon="slack" href="https://join.slack.com/t/civic-developers/shared_invite/zt-37tv9fyo7-aDT43mUjOFQwdQFmfZLTRw">
    Ask in our developer Slack
  </Card>
</CardGroup>
