diff --git a/.env.example b/.env.example
new file mode 100644
index 0000000..d2ab18d
--- /dev/null
+++ b/.env.example
@@ -0,0 +1 @@
+VITE_ANTHROPIC_API_KEY=
diff --git a/.npmrc b/.npmrc
new file mode 100644
index 0000000..7083917
--- /dev/null
+++ b/.npmrc
@@ -0,0 +1 @@
+onlyBuiltDependencies[]=esbuild
diff --git a/CLAUDE.md b/CLAUDE.md
new file mode 100644
index 0000000..98d4630
--- /dev/null
+++ b/CLAUDE.md
@@ -0,0 +1,46 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## What This Is
+
+A Webflow Designer Extension that provides an interactive API Explorer and Code Playground for the Webflow Designer API (V2). It runs as a panel inside the Webflow Designer.
+
+## Commands
+
+```bash
+npm run dev              # Full dev: builds, then runs extension serve + vite + express server concurrently
+npm run vite:dev         # Vite dev server only (port 1337)
+npm run build            # vite build + webflow extension bundle → bundle.zip
+npm run sync-typings     # Copy .d.ts files from @webflow/designer-extension-typings into src/
+npm run clean            # rm dist + node_modules, reinstall
+```
+
+No test runner is configured. No linter is configured. Prettier is used for formatting (no semicolons, single quotes — see `.prettierrc`).
+
+## Architecture
+
+**Frontend** (React 18 + TypeScript + Vite, port 1337):
+- Two tabs: **API Explorer** (browse/run API methods by category) and **Code Playground** (Monaco editor with live execution)
+- Entry point: `src/main.jsx` → renders `<App>` with React Query provider
+- API examples live in `src/examples/*.ts` — each file exports an object of `{ subcategory: { methodName: async () => {...} } }`. Adding a function here auto-populates the API Explorer dropdown.
+- Examples are parsed at runtime using Acorn (AST) to extract function signatures, parameter names, and types for dynamic form generation
+- Monaco Editor gets Webflow Designer API intellisense via `.d.ts` files synced into `src/designer-extension-typings/` (imported as raw strings with Vite's `?raw`)
+- Code execution in the playground uses Sucrase to transpile TypeScript → JavaScript
+
+**Backend** (`server/app.js`, Express on port 1338):
+- Single `POST /prompt` endpoint that proxies to Anthropic API (Claude) for AI-powered code modification in the playground
+- Requires `ANTHROPIC_API_KEY` env var (see `.env.example`)
+
+**Key patterns:**
+- `@/*` path alias maps to `./src/*` (configured in both tsconfig and vite)
+- React Query manages async state (variable collections, enum queries)
+- Console output is captured and displayed in the UI via custom utilities in `src/utils/console-utils.ts`
+- Monaco cancellation errors are globally suppressed in `main.jsx`
+- `webflow.json` configures the extension manifest (size, API version, permissions)
+
+## Code Style
+
+- TypeScript strict mode (`noUnusedLocals`, `noUnusedParameters`, `noFallthroughCasesInSwitch`)
+- No semicolons, single quotes (Prettier)
+- Components: PascalCase files. Hooks: `use*` prefix. Types: `.types.ts` files. Constants: `.constants.ts` files.
diff --git a/package-lock.json b/package-lock.json
index e60123f..71da535 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -24,7 +24,9 @@
         "acorn-typescript": "1.4.13",
         "acorn-walk": "8.3.4",
         "axios": "1.9.0",
+        "cors": "^2.8.6",
         "dotenv": "16.4.5",
+        "express": "^5.2.1",
         "fs-extra": "11.2.0",
         "prismjs": "1.29.0",
         "react": "18.2.0",
@@ -4993,6 +4995,147 @@
       "integrity": "sha512-v2YAxEmKaBLahNwE1mjp4WON6huMNeuDvagFZW+ASCuA/ku0bXR9hSMw0XpiqMoA3+rmnyck/tPRSFQkoC9Cuw==",
       "dev": true
     },
+    "node_modules/body-parser": {
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-2.2.2.tgz",
+      "integrity": "sha512-oP5VkATKlNwcgvxi0vM0p/D3n2C3EReYVX+DNYs5TjZFn/oQt2j+4sVJtSMr18pdRr8wjTcBl6LoV+FUwzPmNA==",
+      "license": "MIT",
+      "dependencies": {
+        "bytes": "^3.1.2",
+        "content-type": "^1.0.5",
+        "debug": "^4.4.3",
+        "http-errors": "^2.0.0",
+        "iconv-lite": "^0.7.0",
+        "on-finished": "^2.4.1",
+        "qs": "^6.14.1",
+        "raw-body": "^3.0.1",
+        "type-is": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/body-parser/node_modules/bytes": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz",
+      "integrity": "sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/body-parser/node_modules/http-errors": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.1.tgz",
+      "integrity": "sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ==",
+      "license": "MIT",
+      "dependencies": {
+        "depd": "~2.0.0",
+        "inherits": "~2.0.4",
+        "setprototypeof": "~1.2.0",
+        "statuses": "~2.0.2",
+        "toidentifier": "~1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/body-parser/node_modules/iconv-lite": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.7.2.tgz",
+      "integrity": "sha512-im9DjEDQ55s9fL4EYzOAv0yMqmMBSZp6G0VvFyTMPKWxiSBHUj9NW/qqLmXUwXrrM7AvqSlTCfvqRb0cM8yYqw==",
+      "license": "MIT",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/body-parser/node_modules/media-typer": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-1.1.0.tgz",
+      "integrity": "sha512-aisnrDP4GNe06UcKFnV5bfMNPBUw4jsLGaWwWfnH3v02GnBuXX2MCVn5RbrWo0j3pczUilYblq7fQ7Nw2t5XKw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/body-parser/node_modules/mime-db": {
+      "version": "1.54.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz",
+      "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/body-parser/node_modules/mime-types": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-3.0.2.tgz",
+      "integrity": "sha512-Lbgzdk0h4juoQ9fCKXW4by0UJqj+nOOrI9MJ1sSj4nI8aI2eo1qmvQEie4VD1glsS250n15LsWsYtCugiStS5A==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "^1.54.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/body-parser/node_modules/qs": {
+      "version": "6.15.1",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.15.1.tgz",
+      "integrity": "sha512-6YHEFRL9mfgcAvql/XhwTvf5jKcOiiupt2FiJxHkiX1z4j7WL8J/jRHYLluORvc1XxB5rV20KoeK00gVJamspg==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "side-channel": "^1.1.0"
+      },
+      "engines": {
+        "node": ">=0.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/body-parser/node_modules/statuses": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.2.tgz",
+      "integrity": "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/body-parser/node_modules/type-is": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/type-is/-/type-is-2.0.1.tgz",
+      "integrity": "sha512-OZs6gsjF4vMp32qrCbiVSkrFmXtG/AZhY3t0iAMrMBiAZyV9oALtXO8hsrHbMXF9x6L3grlFuwW2oAz7cav+Gw==",
+      "license": "MIT",
+      "dependencies": {
+        "content-type": "^1.0.5",
+        "media-typer": "^1.1.0",
+        "mime-types": "^3.0.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/brace-expansion": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
@@ -5242,7 +5385,6 @@
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
       "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
-      "dev": true,
       "dependencies": {
         "es-errors": "^1.3.0",
         "function-bind": "^1.1.2"
@@ -5255,7 +5397,6 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/call-bound/-/call-bound-1.0.4.tgz",
       "integrity": "sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==",
-      "dev": true,
       "dependencies": {
         "call-bind-apply-helpers": "^1.0.2",
         "get-intrinsic": "^1.3.0"
@@ -5564,7 +5705,6 @@
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.5.tgz",
       "integrity": "sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==",
-      "dev": true,
       "engines": {
         "node": ">= 0.6"
       }
@@ -5575,6 +5715,24 @@
       "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
       "dev": true
     },
+    "node_modules/cookie": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.7.2.tgz",
+      "integrity": "sha512-yki5XnKuf750l50uGTllt6kKILY4nQ1eNIQatoXEByZ5dWgnKqbnqmTrBE5B4N7lrMJKQ2ytWMiTO2o0v6Ew/w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/cookie-signature": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.2.2.tgz",
+      "integrity": "sha512-D76uU73ulSXrD1UXF4KE2TMxVVwhsnCgfAyTg9k8P6KGZjlXKrOLe4dJQKI3Bxi5wjesZoFXJWElNWBjPZMbhg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.6.0"
+      }
+    },
     "node_modules/cookies": {
       "version": "0.9.1",
       "resolved": "https://registry.npmjs.org/cookies/-/cookies-0.9.1.tgz",
@@ -5607,6 +5765,23 @@
       "integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==",
       "dev": true
     },
+    "node_modules/cors": {
+      "version": "2.8.6",
+      "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.6.tgz",
+      "integrity": "sha512-tJtZBBHA6vjIAaF6EnIaq6laBBP9aq/Y3ouVJjEfoHbRBcHBAHYcMh/w8LDrk2PvIMMq8gmopa5D4V8RmbrxGw==",
+      "license": "MIT",
+      "dependencies": {
+        "object-assign": "^4",
+        "vary": "^1"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
     "node_modules/cosmiconfig": {
       "version": "7.1.0",
       "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.1.0.tgz",
@@ -5872,11 +6047,12 @@
       }
     },
     "node_modules/debug": {
-      "version": "4.3.4",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
-      "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+      "version": "4.4.3",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
+      "integrity": "sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==",
+      "license": "MIT",
       "dependencies": {
-        "ms": "2.1.2"
+        "ms": "^2.1.3"
       },
       "engines": {
         "node": ">=6.0"
@@ -5932,7 +6108,6 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
       "integrity": "sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==",
-      "dev": true,
       "engines": {
         "node": ">= 0.8"
       }
@@ -5998,7 +6173,6 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
       "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
-      "dev": true,
       "dependencies": {
         "call-bind-apply-helpers": "^1.0.1",
         "es-errors": "^1.3.0",
@@ -6034,8 +6208,7 @@
     "node_modules/ee-first": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
-      "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==",
-      "dev": true
+      "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow=="
     },
     "node_modules/electron-to-chromium": {
       "version": "1.5.166",
@@ -6113,7 +6286,6 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
       "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
-      "dev": true,
       "engines": {
         "node": ">= 0.4"
       }
@@ -6122,7 +6294,6 @@
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
       "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
-      "dev": true,
       "engines": {
         "node": ">= 0.4"
       }
@@ -6137,7 +6308,6 @@
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
       "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
-      "dev": true,
       "dependencies": {
         "es-errors": "^1.3.0"
       },
@@ -6195,8 +6365,7 @@
     "node_modules/escape-html": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
-      "integrity": "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==",
-      "dev": true
+      "integrity": "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow=="
     },
     "node_modules/eslint-scope": {
       "version": "5.1.1",
@@ -6250,6 +6419,15 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/etag": {
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
+      "integrity": "sha512-aIL5Fx7mawVa300al2BnEE4iNvo1qETxLrPI/o05L7z6go7fCw1J6EQmbK4FmJ2AS7kgVF/KEZWufBfdClMcPg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/event-target-shim": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/event-target-shim/-/event-target-shim-5.0.1.tgz",
@@ -6313,6 +6491,203 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/express": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/express/-/express-5.2.1.tgz",
+      "integrity": "sha512-hIS4idWWai69NezIdRt2xFVofaF4j+6INOpJlVOLDO8zXGpUVEVzIYk12UUi2JzjEzWL3IOAxcTubgz9Po0yXw==",
+      "license": "MIT",
+      "dependencies": {
+        "accepts": "^2.0.0",
+        "body-parser": "^2.2.1",
+        "content-disposition": "^1.0.0",
+        "content-type": "^1.0.5",
+        "cookie": "^0.7.1",
+        "cookie-signature": "^1.2.1",
+        "debug": "^4.4.0",
+        "depd": "^2.0.0",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "etag": "^1.8.1",
+        "finalhandler": "^2.1.0",
+        "fresh": "^2.0.0",
+        "http-errors": "^2.0.0",
+        "merge-descriptors": "^2.0.0",
+        "mime-types": "^3.0.0",
+        "on-finished": "^2.4.1",
+        "once": "^1.4.0",
+        "parseurl": "^1.3.3",
+        "proxy-addr": "^2.0.7",
+        "qs": "^6.14.0",
+        "range-parser": "^1.2.1",
+        "router": "^2.2.0",
+        "send": "^1.1.0",
+        "serve-static": "^2.2.0",
+        "statuses": "^2.0.1",
+        "type-is": "^2.0.1",
+        "vary": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/express/node_modules/accepts": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-2.0.0.tgz",
+      "integrity": "sha512-5cvg6CtKwfgdmVqY1WIiXKc3Q1bkRqGLi+2W/6ao+6Y7gu/RCwRuAhGEzh5B4KlszSuTLgZYuqFqo5bImjNKng==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-types": "^3.0.0",
+        "negotiator": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/express/node_modules/content-disposition": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-1.1.0.tgz",
+      "integrity": "sha512-5jRCH9Z/+DRP7rkvY83B+yGIGX96OYdJmzngqnw2SBSxqCFPd0w2km3s5iawpGX8krnwSGmF0FW5Nhr0Hfai3g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/express/node_modules/encodeurl": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-2.0.0.tgz",
+      "integrity": "sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/express/node_modules/fresh": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-2.0.0.tgz",
+      "integrity": "sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/express/node_modules/http-errors": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.1.tgz",
+      "integrity": "sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ==",
+      "license": "MIT",
+      "dependencies": {
+        "depd": "~2.0.0",
+        "inherits": "~2.0.4",
+        "setprototypeof": "~1.2.0",
+        "statuses": "~2.0.2",
+        "toidentifier": "~1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/express/node_modules/media-typer": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-1.1.0.tgz",
+      "integrity": "sha512-aisnrDP4GNe06UcKFnV5bfMNPBUw4jsLGaWwWfnH3v02GnBuXX2MCVn5RbrWo0j3pczUilYblq7fQ7Nw2t5XKw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/express/node_modules/mime-db": {
+      "version": "1.54.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz",
+      "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/express/node_modules/mime-types": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-3.0.2.tgz",
+      "integrity": "sha512-Lbgzdk0h4juoQ9fCKXW4by0UJqj+nOOrI9MJ1sSj4nI8aI2eo1qmvQEie4VD1glsS250n15LsWsYtCugiStS5A==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "^1.54.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/express/node_modules/negotiator": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-1.0.0.tgz",
+      "integrity": "sha512-8Ofs/AUQh8MaEcrlq5xOX0CQ9ypTF5dl78mjlMNfOK08fzpgTHQRQPBxcPlEtIw0yRpws+Zo/3r+5WRby7u3Gg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/express/node_modules/qs": {
+      "version": "6.15.1",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.15.1.tgz",
+      "integrity": "sha512-6YHEFRL9mfgcAvql/XhwTvf5jKcOiiupt2FiJxHkiX1z4j7WL8J/jRHYLluORvc1XxB5rV20KoeK00gVJamspg==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "side-channel": "^1.1.0"
+      },
+      "engines": {
+        "node": ">=0.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/express/node_modules/range-parser": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz",
+      "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/express/node_modules/statuses": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.2.tgz",
+      "integrity": "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/express/node_modules/type-is": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/type-is/-/type-is-2.0.1.tgz",
+      "integrity": "sha512-OZs6gsjF4vMp32qrCbiVSkrFmXtG/AZhY3t0iAMrMBiAZyV9oALtXO8hsrHbMXF9x6L3grlFuwW2oAz7cav+Gw==",
+      "license": "MIT",
+      "dependencies": {
+        "content-type": "^1.0.5",
+        "media-typer": "^1.1.0",
+        "mime-types": "^3.0.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/external-editor": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-3.1.0.tgz",
@@ -6386,6 +6761,45 @@
         "node": ">=8"
       }
     },
+    "node_modules/finalhandler": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-2.1.1.tgz",
+      "integrity": "sha512-S8KoZgRZN+a5rNwqTxlZZePjT/4cnm0ROV70LedRHZ0p8u9fRID0hJUZQpkKLzro8LfmC8sx23bY6tVNxv8pQA==",
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^4.4.0",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "on-finished": "^2.4.1",
+        "parseurl": "^1.3.3",
+        "statuses": "^2.0.1"
+      },
+      "engines": {
+        "node": ">= 18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/finalhandler/node_modules/encodeurl": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-2.0.0.tgz",
+      "integrity": "sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/finalhandler/node_modules/statuses": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.2.tgz",
+      "integrity": "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/find-file-up": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/find-file-up/-/find-file-up-2.0.1.tgz",
@@ -6515,6 +6929,15 @@
         "node": ">= 18"
       }
     },
+    "node_modules/forwarded": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz",
+      "integrity": "sha512-buRG0fpBtRHSTCOASe6hD258tEubFoRLb4ZNA6NxMVHNw2gOcwHo9wyablzMzOA5z9xA9L1KNjk/Nt6MT9aYow==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/fresh": {
       "version": "0.5.2",
       "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
@@ -6599,7 +7022,6 @@
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
       "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
-      "dev": true,
       "dependencies": {
         "call-bind-apply-helpers": "^1.0.2",
         "es-define-property": "^1.0.1",
@@ -6623,7 +7045,6 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
       "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
-      "dev": true,
       "dependencies": {
         "dunder-proto": "^1.0.1",
         "es-object-atoms": "^1.0.0"
@@ -6765,7 +7186,6 @@
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
       "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
-      "dev": true,
       "engines": {
         "node": ">= 0.4"
       },
@@ -6791,7 +7211,6 @@
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
       "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
-      "dev": true,
       "engines": {
         "node": ">= 0.4"
       },
@@ -7036,8 +7455,7 @@
     "node_modules/inherits": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
-      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
-      "dev": true
+      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
     },
     "node_modules/ini": {
       "version": "1.3.8",
@@ -7091,6 +7509,15 @@
         "node": ">=8"
       }
     },
+    "node_modules/ipaddr.js": {
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz",
+      "integrity": "sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
     "node_modules/is-arrayish": {
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
@@ -7217,6 +7644,12 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/is-promise": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-4.0.0.tgz",
+      "integrity": "sha512-hvpoI6korhJMnej285dSg6nu1+e6uxs7zG3BYAm5byqDsgJNWwxzM6z6iZiAgQR4TJ30JmBTOwqZUw3WlyH3AQ==",
+      "license": "MIT"
+    },
     "node_modules/is-regex": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.2.1.tgz",
@@ -7695,7 +8128,6 @@
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
       "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
-      "dev": true,
       "engines": {
         "node": ">= 0.4"
       }
@@ -7756,6 +8188,18 @@
         "url": "https://github.com/sponsors/streamich"
       }
     },
+    "node_modules/merge-descriptors": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-2.0.0.tgz",
+      "integrity": "sha512-Snk314V5ayFLhp3fkUREub6WtjBfPdCPY1Ln8/8munuLuiYhsABgBVWsozAG+MWMbVEvcdcpbi9R7ww22l9Q3g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/merge-stream": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
@@ -7894,9 +8338,10 @@
       "peer": true
     },
     "node_modules/ms": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
-      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
+      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
+      "license": "MIT"
     },
     "node_modules/mute-stream": {
       "version": "1.0.0",
@@ -8113,7 +8558,6 @@
       "version": "1.13.4",
       "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.4.tgz",
       "integrity": "sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==",
-      "dev": true,
       "engines": {
         "node": ">= 0.4"
       },
@@ -8134,7 +8578,6 @@
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz",
       "integrity": "sha512-oVlzkg3ENAhCk2zdv7IJwd/QUD4z2RxRwpkcGY8psCVcCYZNq4wYnVWALHM+brtuJjePWiYF/ClmuDr8Ch5+kg==",
-      "dev": true,
       "dependencies": {
         "ee-first": "1.1.1"
       },
@@ -8146,7 +8589,6 @@
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
       "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==",
-      "dev": true,
       "dependencies": {
         "wrappy": "1"
       }
@@ -8315,7 +8757,6 @@
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
       "integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==",
-      "dev": true,
       "engines": {
         "node": ">= 0.8"
       }
@@ -8594,6 +9035,19 @@
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
       "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
     },
+    "node_modules/proxy-addr": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz",
+      "integrity": "sha512-llQsMLSUDUPT44jdrU/O37qlnifitDP+ZwrmmZcoSKyLKvtZxpyV0n2/bD/N4tBAAZ/gJEdZU7KMraoK1+XYAg==",
+      "license": "MIT",
+      "dependencies": {
+        "forwarded": "0.2.0",
+        "ipaddr.js": "1.9.1"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
     "node_modules/proxy-from-env": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
@@ -8694,6 +9148,75 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/raw-body": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-3.0.2.tgz",
+      "integrity": "sha512-K5zQjDllxWkf7Z5xJdV0/B0WTNqx6vxG70zJE4N0kBs4LovmEYWJzQGxC9bS9RAKu3bgM40lrd5zoLJ12MQ5BA==",
+      "license": "MIT",
+      "dependencies": {
+        "bytes": "~3.1.2",
+        "http-errors": "~2.0.1",
+        "iconv-lite": "~0.7.0",
+        "unpipe": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
+    "node_modules/raw-body/node_modules/bytes": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz",
+      "integrity": "sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/raw-body/node_modules/http-errors": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.1.tgz",
+      "integrity": "sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ==",
+      "license": "MIT",
+      "dependencies": {
+        "depd": "~2.0.0",
+        "inherits": "~2.0.4",
+        "setprototypeof": "~1.2.0",
+        "statuses": "~2.0.2",
+        "toidentifier": "~1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/raw-body/node_modules/iconv-lite": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.7.2.tgz",
+      "integrity": "sha512-im9DjEDQ55s9fL4EYzOAv0yMqmMBSZp6G0VvFyTMPKWxiSBHUj9NW/qqLmXUwXrrM7AvqSlTCfvqRb0cM8yYqw==",
+      "license": "MIT",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/raw-body/node_modules/statuses": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.2.tgz",
+      "integrity": "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/react": {
       "version": "18.2.0",
       "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz",
@@ -9021,6 +9544,32 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/router": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/router/-/router-2.2.0.tgz",
+      "integrity": "sha512-nLTrUKm2UyiL7rlhapu/Zl45FwNgkZGaCpZbIHajDYgwlJCOzLSk+cIPAnsEqV955GjILJnKbdQC1nVPz+gAYQ==",
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^4.4.0",
+        "depd": "^2.0.0",
+        "is-promise": "^4.0.0",
+        "parseurl": "^1.3.3",
+        "path-to-regexp": "^8.0.0"
+      },
+      "engines": {
+        "node": ">= 18"
+      }
+    },
+    "node_modules/router/node_modules/path-to-regexp": {
+      "version": "8.4.2",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-8.4.2.tgz",
+      "integrity": "sha512-qRcuIdP69NPm4qbACK+aDogI5CBDMi1jKe0ry5rSQJz8JVLsC7jV8XpiJjGRLLol3N+R5ihGYcrPLTno6pAdBA==",
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
     "node_modules/rslog": {
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/rslog/-/rslog-1.2.3.tgz",
@@ -9120,8 +9669,7 @@
     "node_modules/safer-buffer": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
-      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
-      "dev": true
+      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
     },
     "node_modules/scheduler": {
       "version": "0.23.0",
@@ -9159,6 +9707,113 @@
         "semver": "bin/semver.js"
       }
     },
+    "node_modules/send": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/send/-/send-1.2.1.tgz",
+      "integrity": "sha512-1gnZf7DFcoIcajTjTwjwuDjzuz4PPcY2StKPlsGAQ1+YH20IRVrBaXSWmdjowTJ6u8Rc01PoYOGHXfP1mYcZNQ==",
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^4.4.3",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "etag": "^1.8.1",
+        "fresh": "^2.0.0",
+        "http-errors": "^2.0.1",
+        "mime-types": "^3.0.2",
+        "ms": "^2.1.3",
+        "on-finished": "^2.4.1",
+        "range-parser": "^1.2.1",
+        "statuses": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/send/node_modules/encodeurl": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-2.0.0.tgz",
+      "integrity": "sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/send/node_modules/fresh": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-2.0.0.tgz",
+      "integrity": "sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/send/node_modules/http-errors": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.1.tgz",
+      "integrity": "sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ==",
+      "license": "MIT",
+      "dependencies": {
+        "depd": "~2.0.0",
+        "inherits": "~2.0.4",
+        "setprototypeof": "~1.2.0",
+        "statuses": "~2.0.2",
+        "toidentifier": "~1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/send/node_modules/mime-db": {
+      "version": "1.54.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz",
+      "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/send/node_modules/mime-types": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-3.0.2.tgz",
+      "integrity": "sha512-Lbgzdk0h4juoQ9fCKXW4by0UJqj+nOOrI9MJ1sSj4nI8aI2eo1qmvQEie4VD1glsS250n15LsWsYtCugiStS5A==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "^1.54.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/send/node_modules/range-parser": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz",
+      "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/send/node_modules/statuses": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.2.tgz",
+      "integrity": "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/serialize-javascript": {
       "version": "6.0.2",
       "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.2.tgz",
@@ -9235,11 +9890,38 @@
         "node": "*"
       }
     },
+    "node_modules/serve-static": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-2.2.1.tgz",
+      "integrity": "sha512-xRXBn0pPqQTVQiC8wyQrKs2MOlX24zQ0POGaj0kultvoOCstBQM5yvOhAVSUwOMjQtTvsPWoNCHfPGwaaQJhTw==",
+      "license": "MIT",
+      "dependencies": {
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "parseurl": "^1.3.3",
+        "send": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/serve-static/node_modules/encodeurl": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-2.0.0.tgz",
+      "integrity": "sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/setprototypeof": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz",
-      "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==",
-      "dev": true
+      "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw=="
     },
     "node_modules/sha.js": {
       "version": "2.4.11",
@@ -9300,7 +9982,6 @@
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.1.0.tgz",
       "integrity": "sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==",
-      "dev": true,
       "dependencies": {
         "es-errors": "^1.3.0",
         "object-inspect": "^1.13.3",
@@ -9319,7 +10000,6 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/side-channel-list/-/side-channel-list-1.0.0.tgz",
       "integrity": "sha512-FCLHtRD/gnpCiCHEiJLOwdmFP+wzCmDEkc9y7NsYxeF4u7Btsn1ZuwgwJGxImImHicJArLP4R0yX4c2KCrMrTA==",
-      "dev": true,
       "dependencies": {
         "es-errors": "^1.3.0",
         "object-inspect": "^1.13.3"
@@ -9335,7 +10015,6 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/side-channel-map/-/side-channel-map-1.0.1.tgz",
       "integrity": "sha512-VCjCNfgMsby3tTdo02nbjtM/ewra6jPHmpThenkTYh8pG9ucZ/1P8So4u4FGBek/BjpOVsDCMoLA/iuBKIFXRA==",
-      "dev": true,
       "dependencies": {
         "call-bound": "^1.0.2",
         "es-errors": "^1.3.0",
@@ -9353,7 +10032,6 @@
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/side-channel-weakmap/-/side-channel-weakmap-1.0.2.tgz",
       "integrity": "sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==",
-      "dev": true,
       "dependencies": {
         "call-bound": "^1.0.2",
         "es-errors": "^1.3.0",
@@ -9799,7 +10477,6 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.1.tgz",
       "integrity": "sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==",
-      "dev": true,
       "engines": {
         "node": ">=0.6"
       }
@@ -9991,6 +10668,15 @@
         "node": ">= 10.0.0"
       }
     },
+    "node_modules/unpipe": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
+      "integrity": "sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/upath": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/upath/-/upath-2.0.1.tgz",
@@ -10047,7 +10733,6 @@
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
       "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==",
-      "dev": true,
       "engines": {
         "node": ">= 0.8"
       }
@@ -10344,8 +11029,7 @@
     "node_modules/wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
-      "dev": true
+      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ=="
     },
     "node_modules/ws": {
       "version": "8.18.0",
diff --git a/package.json b/package.json
index 929ebea..659be0e 100644
--- a/package.json
+++ b/package.json
@@ -5,7 +5,7 @@
   "type": "module",
   "scripts": {
     "vite:dev": "vite --port 1337",
-    "dev": "vite build && concurrently \"webflow extension serve\" \"vite\"",
+    "dev": "vite build && concurrently \"webflow extension serve\" \"vite\" \"node server/app.js \"",
     "build": "vite build && webflow extension bundle",
     "sync-typings": "node ./scripts/sync-typings.js",
     "preview": "vite preview",
@@ -40,8 +40,11 @@
     "acorn-typescript": "1.4.13",
     "acorn-walk": "8.3.4",
     "axios": "1.9.0",
+    "cors": "^2.8.6",
     "dotenv": "16.4.5",
+    "express": "^5.2.1",
     "fs-extra": "11.2.0",
+    "jszip": "^3.10.1",
     "prismjs": "1.29.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
diff --git a/server/app.js b/server/app.js
new file mode 100644
index 0000000..06f60c1
--- /dev/null
+++ b/server/app.js
@@ -0,0 +1,40 @@
+import express from 'express';
+import cors from 'cors';
+
+const app = express();
+const port = 1338;
+const apiKey = process.env.ANTHROPIC_API_KEY;
+
+if(!apiKey) {
+    console.error('ANTHROPIC_API_KEY is not set');
+    process.exit(1);
+}
+
+app.use(cors());
+app.use(express.json());
+
+app.post('/prompt', async (req, res) => {
+    const { prompt } = req.body;
+    console.log('testing', req.body);
+    const response = await fetch('https://api.anthropic.com/v1/messages', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+          'anthropic-version': '2023-06-01',
+          'X-Api-Key': apiKey
+        },
+        body: JSON.stringify({
+          model: 'claude-sonnet-4-6',
+          max_tokens: 4096,
+          system:
+            'You are a coding assistant that helps users write and modify Webflow Designer API code. When asked to make changes to code, return only the modified code without any explanation or markdown code fences. Always respond in plain text, without any markdown formatting. You should only use V2 of the Designer Extension API.',
+          messages: [{ role: 'user', content: prompt }],
+        }),
+    })
+
+    res.json(await response.json());
+});
+
+app.listen(port, () => {
+  console.log(`Server running on http://localhost:${port}`);
+});
\ No newline at end of file
diff --git a/src/App.css b/src/App.css
index cc31851..ae768f6 100644
--- a/src/App.css
+++ b/src/App.css
@@ -306,6 +306,10 @@ input {
   min-height: 28px;
 }
 
+#agent-prompt:disabled::placeholder {
+  font-style: italic;
+}
+
 /* Code block styles */
 pre {
   font-size: 11px !important;
diff --git a/src/components/BundlePreviewModal.tsx b/src/components/BundlePreviewModal.tsx
new file mode 100644
index 0000000..d2785c6
--- /dev/null
+++ b/src/components/BundlePreviewModal.tsx
@@ -0,0 +1,225 @@
+import React, { useState } from 'react'
+import type { BundleResult } from '../utils/bundleGenerator'
+import { createBundleZip, downloadBlob } from '../utils/bundleGenerator'
+
+interface BundlePreviewModalProps {
+  bundle: BundleResult
+  appName: string
+  onAppNameChange: (name: string) => void
+  onClose: () => void
+}
+
+const BundlePreviewModal: React.FC<BundlePreviewModalProps> = ({
+  bundle,
+  appName,
+  onAppNameChange,
+  onClose,
+}) => {
+  const [isDownloading, setIsDownloading] = useState(false)
+
+  const previewHTML = bundle.previewHTML
+
+  const handleDownload = async () => {
+    setIsDownloading(true)
+    try {
+      const blob = await createBundleZip(bundle)
+      downloadBlob(blob, 'bundle.zip')
+    } finally {
+      setIsDownloading(false)
+    }
+  }
+
+  return (
+    <div
+      style={{
+        position: 'fixed',
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        background: 'rgba(0, 0, 0, 0.7)',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        zIndex: 9999,
+      }}
+      onClick={(e) => {
+        if (e.target === e.currentTarget) onClose()
+      }}
+    >
+      <div
+        style={{
+          background: '#1e1e1e',
+          borderRadius: 8,
+          border: '1px solid rgba(255, 255, 255, 0.13)',
+          width: 340,
+          maxHeight: '80vh',
+          display: 'flex',
+          flexDirection: 'column',
+          overflow: 'hidden',
+        }}
+      >
+        {/* Header */}
+        <div
+          style={{
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'space-between',
+            padding: '12px 16px',
+            borderBottom: '1px solid rgba(255, 255, 255, 0.13)',
+          }}
+        >
+          <span style={{ fontSize: 13, fontWeight: 600, color: '#f5f5f5' }}>
+            Bundle extension
+          </span>
+          <button
+            onClick={onClose}
+            style={{
+              background: 'none',
+              border: 'none',
+              color: '#a3a3a3',
+              cursor: 'pointer',
+              fontSize: 18,
+              lineHeight: 1,
+              padding: '0 4px',
+            }}
+          >
+            &times;
+          </button>
+        </div>
+
+        {/* Scrollable content */}
+        <div style={{ flex: 1, overflowY: 'auto', minHeight: 0 }}>
+          {/* App name input */}
+          <div style={{ padding: '12px 16px 0' }}>
+            <label
+              style={{
+                display: 'block',
+                fontSize: 11,
+                color: '#a3a3a3',
+                marginBottom: 4,
+              }}
+            >
+              App name
+            </label>
+            <input
+              type="text"
+              value={appName}
+              onChange={(e) => onAppNameChange(e.target.value)}
+              style={{
+                width: '100%',
+                boxSizing: 'border-box',
+                background: '#2e2e2e',
+                border: '1px solid rgba(255, 255, 255, 0.13)',
+                borderRadius: 4,
+                color: '#f5f5f5',
+                fontSize: 12,
+                padding: '6px 8px',
+                outline: 'none',
+                fontFamily: "'Inter', sans-serif",
+              }}
+            />
+          </div>
+
+          {/* Functions list */}
+          <div style={{ padding: '12px 16px 0' }}>
+            <div
+              style={{ fontSize: 11, color: '#a3a3a3', marginBottom: 4 }}
+            >
+              {bundle.functions.length} function{bundle.functions.length !== 1 ? 's' : ''} detected
+            </div>
+            <div
+              style={{
+                display: 'flex',
+                flexWrap: 'wrap',
+                gap: 4,
+              }}
+            >
+              {bundle.functions.map((fn) => (
+                <span
+                  key={fn.name}
+                  style={{
+                    fontSize: 10.5,
+                    background: '#383838',
+                    color: '#bdbdbd',
+                    padding: '2px 8px',
+                    borderRadius: 3,
+                    fontFamily:
+                      'ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, monospace',
+                  }}
+                >
+                  {fn.name}
+                </span>
+              ))}
+            </div>
+          </div>
+
+          {/* Preview */}
+          <div style={{ padding: '12px 16px' }}>
+            <div
+              style={{ fontSize: 11, color: '#a3a3a3', marginBottom: 4 }}
+            >
+              Preview
+            </div>
+            <div
+              style={{
+                border: '1px solid rgba(255, 255, 255, 0.13)',
+                borderRadius: 4,
+                overflow: 'hidden',
+                background: '#1e1e1e',
+              }}
+            >
+              <iframe
+                title="Extension preview"
+                srcDoc={previewHTML}
+                sandbox="allow-scripts"
+                style={{
+                  width: '100%',
+                  height: 200,
+                  border: 'none',
+                  display: 'block',
+                }}
+              />
+            </div>
+          </div>
+        </div>
+
+        {/* Download button — pinned to bottom */}
+        <div
+          style={{
+            padding: '12px 16px',
+            borderTop: '1px solid rgba(255, 255, 255, 0.13)',
+            flexShrink: 0,
+          }}
+        >
+          <button
+            onClick={handleDownload}
+            disabled={isDownloading || bundle.functions.length === 0}
+            className="button cc-primary"
+            style={{
+              width: '100%',
+              textAlign: 'center',
+              marginTop: 0,
+            }}
+          >
+            {isDownloading ? 'Generating...' : 'Download bundle.zip'}
+          </button>
+          {bundle.functions.length === 0 && (
+            <div
+              style={{
+                fontSize: 10.5,
+                color: '#ff8a8a',
+                marginTop: 4,
+                textAlign: 'center',
+              }}
+            >
+              No top-level functions found. Declare functions like: async function myAction() {'{ ... }'}
+            </div>
+          )}
+        </div>
+      </div>
+    </div>
+  )
+}
+
+export default BundlePreviewModal
diff --git a/src/components/Playground.tsx b/src/components/Playground.tsx
index a8fbf5b..15e33ae 100644
--- a/src/components/Playground.tsx
+++ b/src/components/Playground.tsx
@@ -3,7 +3,9 @@ import MonacoEditor, { useMonaco } from '@monaco-editor/react'
 import type { editor } from 'monaco-editor'
 import { transform } from 'sucrase'
 import CodeBlock from './CodeBlock'
+import BundlePreviewModal from './BundlePreviewModal'
 import { configureMonacoWithDesignerTypings } from '../utils/designerTypings'
+import { generateBundleFiles } from '../utils/bundleGenerator'
 import ClipboardIcon from './icons/ClipboardIcon'
 import ClearIcon from './icons/ClearIcon'
 
@@ -50,6 +52,67 @@ const Playground: React.FC = () => {
   const [language, setLanguage] = useState<'javascript' | 'typescript'>(
     'javascript',
   )
+  const [prompt, setPrompt] = useState('')
+  const [isWaiting, setIsWaiting] = useState(false)
+  const [showBundleModal, setShowBundleModal] = useState(false)
+  const [bundleAppName, setBundleAppName] = useState('My Extension')
+  const [bundleResult, setBundleResult] = useState<ReturnType<
+    typeof generateBundleFiles
+  > | null>(null)
+
+  const handleBundle = () => {
+    const currentCode = codeRef.current
+    const result = generateBundleFiles(currentCode, bundleAppName)
+    setBundleResult(result)
+    setShowBundleModal(true)
+  }
+
+  const handleAppNameChange = (name: string) => {
+    setBundleAppName(name)
+    if (bundleResult) {
+      const updated = generateBundleFiles(codeRef.current, name)
+      setBundleResult(updated)
+    }
+  }
+
+  const sendPromptToAgent = async (text: string) => {
+    console.log(`running with prompt: ${text}`);
+    const currentCode = codeRef.current
+
+    const userMessage = `Here is the current code in the playground editor:
+
+\`\`\`javascript
+${currentCode}
+\`\`\`
+
+Make the following changes to this code: ${text}`
+
+    setIsWaiting(true)
+    const timeoutId = setTimeout(() => setIsWaiting(false), 20000)
+
+    try {
+     const response = await fetch('http://localhost:1338/prompt', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({ prompt: userMessage }),
+      })
+
+      const data = await response.json()
+      const result = (data.content?.[0]?.text ?? '') as string
+      if (result) {
+        setCode(result)
+        codeRef.current = result
+        editorRef.current?.setValue(result)
+      }
+    } catch (err) {
+      console.error(err)
+    } finally {
+      clearTimeout(timeoutId)
+      setIsWaiting(false)
+    }
+  }
   const monaco = useMonaco()
   const editorRef = useRef<any>(null)
   const codeRef = useRef(code)
@@ -430,95 +493,166 @@ const Playground: React.FC = () => {
           }}
         />
       </div>
-      <div style={{ marginBottom: 8, position: 'relative' }}>
+      <div
+        style={{
+          marginBottom: 8,
+          display: 'flex',
+          justifyContent: 'flex-end',
+          gap: 8,
+        }}
+      >
+        <button
+          onClick={handleBundle}
+          className="button cc-primary"
+          style={{ background: '#383838', borderColor: 'rgba(255,255,255,0.13)' }}
+        >
+          Bundle
+        </button>
         <button
           onClick={() => runCode(codeRef.current)}
           disabled={isRunning}
           className="button cc-primary"
-          style={{
-            position: 'absolute',
-            right: 16,
-            bottom: 16,
-          }}
         >
           {isRunning ? 'Running...' : 'Run'}
         </button>
       </div>
       <div
         style={{
-          opacity: output ? 1 : 0,
-          height: output ? 'auto' : 0,
+          background: '#181818',
+          borderRadius: 4,
+          marginBottom: 8,
           overflow: 'hidden',
-          transition: 'opacity 0.2s ease-in-out',
-          padding: '0 16px 16px',
-          position: 'relative',
         }}
       >
         <div
           style={{
-            position: 'absolute',
-            top: 10,
-            right: 24,
-            zIndex: 10,
             display: 'flex',
-            gap: 8,
+            alignItems: 'center',
+            padding: '8px 12px',
+            borderBottom: '1px solid #282a2e',
+            background: '#1e1e1e',
           }}
         >
-          <button
-            onClick={async () => {
-              try {
-                await navigator.clipboard.writeText(output)
-              } catch {
-                const ta = document.createElement("textarea")
-                ta.value = output
-                ta.style.position = "fixed"
-                ta.style.left = "-9999px"
-                document.body.appendChild(ta)
-                ta.select()
-                document.execCommand("copy")
-                document.body.removeChild(ta)
-              }
-              setIsCopied(true)
-              setTimeout(() => setIsCopied(false), 2000)
-            }}
-            title="Copy to clipboard"
-            style={{
-              background: 'none',
-              border: 'none',
-              color: 'rgb(255 255 255 / 0.6)',
-              cursor: 'pointer',
-              padding: 4,
-            }}
-          >
-            {isCopied ? 'Copied!' : <ClipboardIcon />}
-          </button>
-          <button
-            onClick={() => setOutput('')}
-            title="Clear output"
-            style={{
-              background: 'none',
-              border: 'none',
-              color: 'rgb(255 255 255 / 0.6)',
-              cursor: 'pointer',
-              padding: 4,
-            }}
+          <label
+            htmlFor="agent-prompt"
+            style={{ fontSize: 11, color: 'rgb(255 255 255 / 0.5)' }}
           >
-            <ClearIcon />
-          </button>
+            Prompt
+          </label>
         </div>
-        <label
+        <input
+          id="agent-prompt"
+          type="text"
+          value={prompt}
+          disabled={isWaiting}
+          onChange={(e) => setPrompt(e.target.value)}
+          onKeyDown={(e) => {
+            if (e.key === 'Enter') {
+              const value = e.currentTarget.value.trim()
+              if (value) {
+                sendPromptToAgent(value)
+                setPrompt('')
+              }
+            }
+          }}
+          placeholder={isWaiting ? 'Waiting for response' : 'Type a prompt and press Enter'}
           style={{
-            fontWeight: 500,
-            fontSize: 13,
-            color: 'rgb(255 255 255 / 0.6)',
-            display: 'block',
-            marginBottom: 4,
+            width: '100%',
+            boxSizing: 'border-box',
+            background: '#181818',
+            border: 'none',
+            color: 'rgb(255 255 255 / 0.9)',
+            fontSize: 11,
+            padding: '10px 12px',
+            outline: 'none',
+            fontFamily:
+              'ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace',
+            fontStyle: isWaiting ? 'italic' : 'normal',
+            opacity: isWaiting ? 0.5 : 1,
+            cursor: isWaiting ? 'not-allowed' : 'text',
+          }}
+        />
+      </div>
+      <div
+        style={{
+          opacity: output ? 1 : 0,
+          height: output ? 'auto' : 0,
+          overflow: 'hidden',
+          transition: 'opacity 0.2s ease-in-out',
+          background: '#181818',
+          borderRadius: 4,
+          marginBottom: 8,
+        }}
+      >
+        <div
+          style={{
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'space-between',
+            padding: '8px 12px',
+            borderBottom: '1px solid #282a2e',
+            background: '#1e1e1e',
           }}
         >
-          Output
-        </label>
-        <CodeBlock code={output || ' '} language="javascript" />
+          <div style={{ fontSize: 11, color: 'rgb(255 255 255 / 0.5)' }}>
+            Output
+          </div>
+          <div style={{ display: 'flex', gap: 8 }}>
+            <button
+              onClick={async () => {
+                try {
+                  await navigator.clipboard.writeText(output)
+                } catch {
+                  const ta = document.createElement('textarea')
+                  ta.value = output
+                  ta.style.position = 'fixed'
+                  ta.style.left = '-9999px'
+                  document.body.appendChild(ta)
+                  ta.select()
+                  document.execCommand('copy')
+                  document.body.removeChild(ta)
+                }
+                setIsCopied(true)
+                setTimeout(() => setIsCopied(false), 2000)
+              }}
+              title="Copy to clipboard"
+              style={{
+                background: 'none',
+                border: 'none',
+                color: 'rgb(255 255 255 / 0.6)',
+                cursor: 'pointer',
+                padding: 4,
+              }}
+            >
+              {isCopied ? 'Copied!' : <ClipboardIcon />}
+            </button>
+            <button
+              onClick={() => setOutput('')}
+              title="Clear output"
+              style={{
+                background: 'none',
+                border: 'none',
+                color: 'rgb(255 255 255 / 0.6)',
+                cursor: 'pointer',
+                padding: 4,
+              }}
+            >
+              <ClearIcon />
+            </button>
+          </div>
+        </div>
+        <div style={{ padding: 12 }}>
+          <CodeBlock code={output || ' '} language="javascript" />
+        </div>
       </div>
+      {showBundleModal && bundleResult && (
+        <BundlePreviewModal
+          bundle={bundleResult}
+          appName={bundleAppName}
+          onAppNameChange={handleAppNameChange}
+          onClose={() => setShowBundleModal(false)}
+        />
+      )}
     </div>
   )
 }
diff --git a/src/declarations.d.ts b/src/declarations.d.ts
index ea8347b..bb832c8 100644
--- a/src/declarations.d.ts
+++ b/src/declarations.d.ts
@@ -2,3 +2,11 @@ declare module '*.d.ts?raw' {
   const content: string
   export default content
 }
+
+interface ImportMetaEnv {
+  readonly VITE_ANTHROPIC_API_KEY: string
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv
+}
diff --git a/src/main.jsx b/src/main.jsx
index cd9d814..d7d3c41 100644
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -36,7 +36,7 @@ const App = () => {
 
   useEffect(() => {
     // Set initial size
-    webflow.setExtensionSize({ height: 425, width: 500 })
+    webflow.setExtensionSize('large')
   }, [])
 
   // Auto-initialize first example and function
diff --git a/src/utils/bundleGenerator.ts b/src/utils/bundleGenerator.ts
new file mode 100644
index 0000000..55200b4
--- /dev/null
+++ b/src/utils/bundleGenerator.ts
@@ -0,0 +1,415 @@
+import { parse } from 'acorn'
+import tsPlugin from 'acorn-typescript'
+import { transform } from 'sucrase'
+import JSZip from 'jszip'
+
+export interface ParsedFunction {
+  name: string
+  code: string
+}
+
+/**
+ * Parse playground code and extract top-level named function declarations.
+ */
+export function parseTopLevelFunctions(code: string): ParsedFunction[] {
+  const parser = parse as unknown as (
+    input: string,
+    options: Record<string, unknown>,
+  ) => { body: Array<{ type: string; id?: { name: string }; start: number; end: number }> }
+
+  let ast: ReturnType<typeof parser>
+  try {
+    ast = parser(code, {
+      sourceType: 'module',
+      ecmaVersion: 'latest',
+      plugins: [tsPlugin()],
+      locations: true,
+    })
+  } catch {
+    // If TypeScript parsing fails, try plain JS
+    ast = parser(code, {
+      sourceType: 'module',
+      ecmaVersion: 'latest',
+      locations: true,
+    })
+  }
+
+  const functions: ParsedFunction[] = []
+
+  function collectFunctions(nodes: typeof ast.body) {
+    for (const node of nodes) {
+      if (node.type === 'FunctionDeclaration' && node.id?.name) {
+        functions.push({
+          name: node.id.name,
+          code: code.slice(node.start, node.end),
+        })
+      }
+    }
+  }
+
+  // Check top-level nodes
+  collectFunctions(ast.body)
+
+  // If no functions found, check if the code is an IIFE — treat the whole
+  // thing as a single "run" action.
+  if (functions.length === 0) {
+    for (const node of ast.body) {
+      const expr = (node as any).expression
+      if (
+        node.type === 'ExpressionStatement' &&
+        expr?.type === 'CallExpression' &&
+        (expr.callee?.type === 'FunctionExpression' ||
+          expr.callee?.type === 'ArrowFunctionExpression')
+      ) {
+        functions.push({
+          name: 'run',
+          code: code,
+        })
+        break
+      }
+    }
+  }
+
+  return functions
+}
+
+/**
+ * Transpile TypeScript/JSX code to plain JavaScript using Sucrase.
+ */
+function transpileCode(code: string): string {
+  return transform(code, {
+    transforms: ['typescript', 'imports'],
+    jsxPragma: 'React.createElement',
+    jsxFragmentPragma: 'React.Fragment',
+  }).code
+}
+
+/**
+ * Generate the HTML for the extension.
+ */
+function generateHTML(appName: string): string {
+  return `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>${appName}</title>
+  <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" />
+  <style>
+    :root {
+      --background1: #1e1e1e;
+      --background2: #2e2e2e;
+      --background3: #383838;
+      --actionPrimaryBackground: #006acc;
+      --actionPrimaryBackgroundHover: #187cd9;
+      --actionPrimaryText: #ffffff;
+      --actionSecondaryBackground: linear-gradient(180deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.10) 100%);
+      --actionSecondaryBackgroundHover: linear-gradient(180deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.16) 100%);
+      --actionSecondaryText: #e0e0e0;
+      --border1: rgba(255, 255, 255, 0.13);
+      --text1: #f5f5f5;
+      --text2: #bdbdbd;
+      --text3: #a3a3a3;
+      --font-stack: 'Inter', sans-serif;
+      --border-radius: 4px;
+      --boxShadows-action-colored: 0px 0.5px 1px 0px rgba(0,0,0,0.8), 0px 0.5px 0.5px 0px rgba(255,255,255,0.2) inset;
+      --boxShadows-action-secondary: 0px 0.5px 1px rgba(0,0,0,0.8), inset 0px 0.5px 0.5px rgba(255,255,255,0.12);
+    }
+
+    * { box-sizing: border-box; margin: 0; padding: 0; }
+
+    body {
+      font-family: var(--font-stack);
+      background: var(--background1);
+      color: var(--text1);
+      padding: 16px;
+    }
+
+    h1 {
+      font-size: 13px;
+      font-weight: 600;
+      margin-bottom: 12px;
+      letter-spacing: -0.1px;
+    }
+
+    .actions {
+      display: flex;
+      flex-direction: column;
+      gap: 8px;
+      margin-bottom: 12px;
+    }
+
+    .action-btn {
+      width: 100%;
+      padding: 8px 12px;
+      font-size: 11.5px;
+      font-weight: 500;
+      font-family: var(--font-stack);
+      color: var(--actionPrimaryText);
+      background: var(--actionPrimaryBackground);
+      border: none;
+      border-radius: var(--border-radius);
+      box-shadow: var(--boxShadows-action-colored);
+      cursor: pointer;
+      transition: background 0.15s ease;
+      text-align: left;
+    }
+
+    .action-btn:hover {
+      background: var(--actionPrimaryBackgroundHover);
+    }
+
+    .action-btn:active {
+      opacity: 0.9;
+    }
+
+    .action-btn:disabled {
+      opacity: 0.5;
+      cursor: not-allowed;
+    }
+
+    .output-label {
+      font-size: 11px;
+      color: var(--text3);
+      margin-bottom: 4px;
+    }
+
+    .output {
+      background: var(--background2);
+      border: 1px solid var(--border1);
+      border-radius: var(--border-radius);
+      padding: 8px;
+      font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, monospace;
+      font-size: 10.5px;
+      color: var(--text2);
+      min-height: 60px;
+      max-height: 200px;
+      overflow-y: auto;
+      white-space: pre-wrap;
+      word-break: break-word;
+    }
+
+    .status {
+      font-size: 10.5px;
+      color: var(--text3);
+      margin-top: 4px;
+      min-height: 16px;
+    }
+
+    .status.error { color: #ff8a8a; }
+    .status.success { color: #63d489; }
+  </style>
+</head>
+<body>
+  <h1>${appName}</h1>
+  <div class="actions" id="actions"></div>
+  <div class="output-label">Output</div>
+  <div class="output" id="output"></div>
+  <div class="status" id="status"></div>
+  <script src="app.js"></script>
+</body>
+</html>`
+}
+
+/**
+ * Generate the JavaScript for the extension.
+ */
+function generateJS(transpiledCode: string, functions: ParsedFunction[]): string {
+  const buttonSetup = functions
+    .map(
+      (fn) => `
+  {
+    const btn = document.createElement('button')
+    btn.className = 'action-btn'
+    btn.textContent = '${fn.name.replace(/([A-Z])/g, ' $1').replace(/^./, (s) => s.toUpperCase()).trim()}'
+    btn.addEventListener('click', async () => {
+      btn.disabled = true
+      statusEl.textContent = 'Running ${fn.name}...'
+      statusEl.className = 'status'
+      try {
+        await ${fn.name}()
+        statusEl.textContent = 'Done'
+        statusEl.className = 'status success'
+      } catch (err) {
+        statusEl.textContent = 'Error: ' + (err.message || err)
+        statusEl.className = 'status error'
+        _console.error(err)
+      } finally {
+        btn.disabled = false
+      }
+    })
+    actionsEl.appendChild(btn)
+  }`,
+    )
+    .join('\n')
+
+  return `(function () {
+  const actionsEl = document.getElementById('actions')
+  const outputEl = document.getElementById('output')
+  const statusEl = document.getElementById('status')
+
+  // Console capture
+  const _console = {
+    log: console.log.bind(console),
+    error: console.error.bind(console),
+    warn: console.warn.bind(console),
+    info: console.info.bind(console),
+  }
+
+  function appendOutput(prefix, args) {
+    const text = args.map(function (arg) {
+      if (arg instanceof Error) return arg.name + ': ' + arg.message
+      if (typeof arg === 'object' && arg !== null) {
+        try { return JSON.stringify(arg, null, 2) } catch (e) { return String(arg) }
+      }
+      return String(arg)
+    }).join(' ')
+    outputEl.textContent += (prefix ? '[' + prefix + '] ' : '') + text + '\\n'
+    outputEl.scrollTop = outputEl.scrollHeight
+  }
+
+  console.log = function () { appendOutput('', Array.from(arguments)); _console.log.apply(null, arguments) }
+  console.error = function () { appendOutput('Error', Array.from(arguments)); _console.error.apply(null, arguments) }
+  console.warn = function () { appendOutput('Warn', Array.from(arguments)); _console.warn.apply(null, arguments) }
+  console.info = function () { appendOutput('Info', Array.from(arguments)); _console.info.apply(null, arguments) }
+
+  // User functions
+  ${transpiledCode}
+
+  // Create buttons
+  ${buttonSetup}
+})()
+`
+}
+
+/**
+ * Generate the webflow.json manifest.
+ */
+function generateManifest(appName: string): string {
+  return JSON.stringify(
+    {
+      name: appName,
+      publicDir: '.',
+      size: 'default',
+      apiVersion: '2',
+      featureFlags: { userAbilities: true },
+      appIntents: { image: ['manage'] },
+      appConnections: ['manageImageElement'],
+    },
+    null,
+    2,
+  )
+}
+
+export interface BundleResult {
+  html: string
+  js: string
+  manifest: string
+  functions: ParsedFunction[]
+  previewHTML: string
+}
+
+/**
+ * Generate a static preview HTML with inert buttons (no JS execution).
+ */
+function generatePreviewHTML(appName: string, functions: ParsedFunction[]): string {
+  const buttons = functions
+    .map((fn) => {
+      const label = fn.name
+        .replace(/([A-Z])/g, ' $1')
+        .replace(/^./, (s) => s.toUpperCase())
+        .trim()
+      return `    <button class="action-btn">${label}</button>`
+    })
+    .join('\n')
+
+  return `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" />
+  <style>
+    :root {
+      --background1: #1e1e1e;
+      --actionPrimaryBackground: #006acc;
+      --actionPrimaryText: #ffffff;
+      --text1: #f5f5f5;
+      --text3: #a3a3a3;
+      --text2: #bdbdbd;
+      --background2: #2e2e2e;
+      --border1: rgba(255, 255, 255, 0.13);
+      --font-stack: 'Inter', sans-serif;
+      --border-radius: 4px;
+      --boxShadows-action-colored: 0px 0.5px 1px 0px rgba(0,0,0,0.8), 0px 0.5px 0.5px 0px rgba(255,255,255,0.2) inset;
+    }
+    * { box-sizing: border-box; margin: 0; padding: 0; }
+    body { font-family: var(--font-stack); background: var(--background1); color: var(--text1); padding: 16px; }
+    h1 { font-size: 13px; font-weight: 600; margin-bottom: 12px; }
+    .actions { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
+    .action-btn {
+      width: 100%; padding: 8px 12px; font-size: 11.5px; font-weight: 500;
+      font-family: var(--font-stack); color: var(--actionPrimaryText);
+      background: var(--actionPrimaryBackground); border: none;
+      border-radius: var(--border-radius); box-shadow: var(--boxShadows-action-colored);
+      cursor: pointer; text-align: left;
+    }
+    .output-label { font-size: 11px; color: var(--text3); margin-bottom: 4px; }
+    .output {
+      background: var(--background2); border: 1px solid var(--border1);
+      border-radius: var(--border-radius); padding: 8px;
+      font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, monospace;
+      font-size: 10.5px; color: var(--text2); min-height: 40px;
+    }
+  </style>
+</head>
+<body>
+  <h1>${appName}</h1>
+  <div class="actions">
+${buttons}
+  </div>
+  <div class="output-label">Output</div>
+  <div class="output"></div>
+</body>
+</html>`
+}
+
+/**
+ * Generate all bundle files from playground code.
+ */
+export function generateBundleFiles(
+  code: string,
+  appName: string,
+): BundleResult {
+  const functions = parseTopLevelFunctions(code)
+  const transpiledCode = transpileCode(code)
+  const html = generateHTML(appName)
+  const js = generateJS(transpiledCode, functions)
+  const manifest = generateManifest(appName)
+  const previewHTML = generatePreviewHTML(appName, functions)
+  return { html, js, manifest, functions, previewHTML }
+}
+
+/**
+ * Create a zip blob from the bundle files.
+ */
+export async function createBundleZip(bundle: BundleResult): Promise<Blob> {
+  const zip = new JSZip()
+  zip.file('index.html', bundle.html)
+  zip.file('app.js', bundle.js)
+  zip.file('webflow.json', bundle.manifest)
+  return zip.generateAsync({ type: 'blob' })
+}
+
+/**
+ * Trigger a browser file download.
+ */
+export function downloadBlob(blob: Blob, filename: string) {
+  const url = URL.createObjectURL(blob)
+  const a = document.createElement('a')
+  a.href = url
+  a.download = filename
+  document.body.appendChild(a)
+  a.click()
+  document.body.removeChild(a)
+  URL.revokeObjectURL(url)
+}
diff --git a/vite.config.mts b/vite.config.mts
index 602e819..1489014 100644
--- a/vite.config.mts
+++ b/vite.config.mts
@@ -40,7 +40,7 @@ export default defineConfig({
             'sucrase',
           ],
           // Other vendor libraries
-          vendor: ['axios', '@tanstack/react-query', 'prismjs'],
+          vendor: ['axios', '@tanstack/react-query', 'prismjs', 'jszip'],
         },
       },
     },
diff --git a/webflow.json b/webflow.json
index 37ad747..43d5bb6 100644
--- a/webflow.json
+++ b/webflow.json
@@ -1,6 +1,7 @@
 {
   "name": "My Amazing App",
   "publicDir": "dist",
+  "size": "large",
   "apiVersion": "2",
   "featureFlags": { "userAbilities": true },
   "appIntents": {