Homepage refresh: coss components, toasts, MCP docs, live stars

content/docs/components/meta.json

@@ -1,26 +1,31 @@
 {
   "title": "Components",
+  "defaultOpen": true,
   "pages": [
-    "alert",
-    "alert-dialog",
-    "avatar",
-    "badge",
+    "---Forms and inputs---",
     "button",
-    "card",
+    "text-field",
     "checkbox",
-    "combobox",
-    "dialog",
-    "drawer",
-    "progress",
     "radio",
+    "switch",
+    "slider",
     "select",
+    "combobox",
+    "---Layout and surfaces---",
+    "card",
     "separator",
-    "slider",
-    "spinner",
-    "switch",
     "tabs",
-    "text-field",
+    "avatar",
+    "---Feedback and status---",
+    "badge",
+    "spinner",
+    "progress",
+    "alert",
     "toast",
-    "tooltip"
+    "tooltip",
+    "---Overlays---",
+    "dialog",
+    "alert-dialog",
+    "drawer"
   ]
 }

content/docs/links/meta.json

@@ -0,0 +1,9 @@
+{
+  "title": "Links",
+  "pages": [
+    "[Playground](https://play.fossui.org)",
+    "[Roadmap](/roadmap)",
+    "[pub.dev](https://pub.dev/packages/fossui)",
+    "[GitHub](https://github.com/fossui/fossui)"
+  ]
+}

content/docs/mcp.mdx

@@ -0,0 +1,99 @@
+---
+title: MCP
+description: Connect your AI coding assistant to the fossui MCP server so it writes fossui code against the real component API.
+---
+
+import { Tab, Tabs } from 'fumadocs-ui/components/tabs';
+
+The fossui MCP server hands your AI coding assistant the exact component API.
+Instead of guessing prop names and enum values, the assistant looks them up and
+writes code that compiles and stays on theme the first time.
+
+## What is MCP
+
+The Model Context Protocol (MCP) is an open standard for connecting AI
+assistants to outside tools and data over one interface. A server offers a set
+of capabilities; a client, your editor or CLI, connects and uses them.
+
+fossui runs a hosted server that any client reaches over Streamable HTTP:
+
+```
+https://mcp.fossui.org
+```
+
+There is nothing to install and no key to manage. Point a client at the URL and
+it picks up the fossui tools.
+
+## Add it to your assistant
+
+<Tabs items={['Claude Code', 'Cursor', 'VS Code', 'Antigravity']}>
+
+<Tab value="Claude Code">
+
+Register the server with the CLI:
+
+```bash
+claude mcp add --transport http fossui https://mcp.fossui.org
+```
+
+Then build with fossui the way you already prompt.
+
+</Tab>
+
+<Tab value="Cursor">
+
+Add it to `.cursor/mcp.json` in the project, or `~/.cursor/mcp.json` to enable it
+everywhere:
+
+```json
+{
+  "mcpServers": {
+    "fossui": {
+      "url": "https://mcp.fossui.org"
+    }
+  }
+}
+```
+
+</Tab>
+
+<Tab value="VS Code">
+
+Add it to `.vscode/mcp.json`:
+
+```json
+{
+  "servers": {
+    "fossui": {
+      "type": "http",
+      "url": "https://mcp.fossui.org"
+    }
+  }
+}
+```
+
+</Tab>
+
+<Tab value="Antigravity">
+
+Open the MCP settings and add a server, or edit the config file directly:
+
+```json
+{
+  "mcpServers": {
+    "fossui": {
+      "serverUrl": "https://mcp.fossui.org"
+    }
+  }
+}
+```
+
+</Tab>
+
+</Tabs>
+
+## Learn more
+
+New to the protocol? The official docs walk through the concepts and the
+client and server model:
+[modelcontextprotocol.io](https://modelcontextprotocol.io/docs/getting-started/intro).

content/docs/meta.json

@@ -1,3 +1,3 @@
 {
-  "pages": ["index", "components"]
+  "pages": ["index", "mcp", "components", "links"]
 }

next.config.mjs

@@ -6,6 +6,9 @@ const withMDX = createMDX();
 const config = {
   output: 'export',
   reactStrictMode: true,
+  images: {
+    unoptimized: true,
+  },
 };
 
 export default withMDX(config);