@cloudgrid-io/mcp 0.13.0 → 0.15.0

package/src/corpus/templates/product-launch/README.md

@@ -0,0 +1,46 @@
+# Template: product-launch (static)
+
+A single self-contained HTML product-launch page. **No infrastructure** — no
+database, no backend, no `needs:`. Everything (layout, styles, countdown) lives
+in one `index.html` with inline CSS and inline JS. State (the countdown) is
+computed client-side; there is nothing to persist.
+
+## What it is
+
+A one-page launch announcement with:
+
+- a sticky nav + primary CTA,
+- a hero with headline, subhead, launch badge, and a **product image**
+  (an inline SVG placeholder — swap it for a real screenshot or photo),
+- a **launch countdown** to a target date/time,
+- a **key features** grid,
+- a **launch offer** block (price / was-price / fine print + CTA),
+- **social proof** (headline stats + testimonials),
+- a footer.
+
+## How to adapt
+
+1. Replace the `{{PLACEHOLDER}}` tokens with the user's content (product name,
+   hero copy, features, offer, quotes, footer).
+2. Set the countdown target: replace `{{LAUNCH_DATETIME_ISO}}` with an ISO 8601
+   instant like `2026-09-01T09:00:00Z`. If it is left unset or invalid, the
+   timer falls back to 14 days from load.
+3. Swap the hero product image: replace the inline `<svg>` in `.shot` with a
+   real screenshot. **Keep it self-contained** — inline SVG or a `data:` URI,
+   never an external URL, `<script src>`, `<link href>`, CDN, or web font.
+4. Add or remove `.feature` and `.quote` blocks freely (see the
+   `FEATURES_START`/`FEATURES_END` and `QUOTES_START`/`QUOTES_END` markers).
+
+## How it deploys
+
+Deploys as an **inspiration** — instant, and works on the **hosted** edition
+(Claude Web) as well as local. Use **`gridctl_drop`** (or `gridctl_plug` with the
+inline HTML): you get a live share URL right away. Re-dropping the same entity
+updates the same URL, so the user iterates on one link.
+
+The reference `cloudgrid.yaml` in this directory (`type: static`) is ONLY for
+plugging the page as an OWNED static runtime (async, local edition only); the
+fast path is `gridctl_drop`.
+
+The fillable HTML is the real template — fetch it with
+`gridctl_fetch("template", "product-launch")` and fill in the user's content.

package/src/corpus/templates/product-launch/cloudgrid.yaml

@@ -0,0 +1,234 @@
+# ============================================================================
+# cloudgrid.yaml — Complete Example
+# ============================================================================
+#
+# This file shows EVERY field the platform supports, with comments explaining
+# each one. It is a reference — no real project would use all of these at once.
+#
+# STANDARD: every CloudGrid template ships its cloudgrid.yaml in THIS full form.
+# Uncomment ONLY the fields the archetype needs (always: name + services; plus
+# needs: for runtime apps). Leave everything else commented. Comments are
+# ignored by the parser, so the file deploys to exactly the active fields.
+#
+# Only two fields are required: name and services. Everything else is optional.
+# Full docs: docs/cloudgrid-yaml-reference.md
+#
+# THIS TEMPLATE (product-launch): a single self-contained static page. The
+# active fields are exactly name + services.web{type: static, path: /}; there
+# are no needs. This cloudgrid.yaml is the reference for plugging the page as an
+# OWNED static runtime; the fast path is to deploy it as an INSPIRATION via
+# gridctl_drop (instant, and works on the hosted edition too).
+# ============================================================================
+
+
+# ─── IDENTITY ───────────────────────────────────────────────────────────────
+
+# Entity slug (REQUIRED). 2-42 chars, lowercase alphanumeric + hyphens.
+# Must start and end with a letter or digit.
+# Becomes part of your public URL: <name>-<4hex>.<org>.cloudgrid.io
+name: product-launch
+
+# One-line summary. Max 280 chars. If omitted, Grid Brain auto-generates one.
+# description: Order processing API for the e-commerce platform
+
+# Single emoji or short text shown as the entity icon. Max 64 chars.
+# icon: "📦"
+
+# Entity type: 'app' (default) or 'agent'. An agent is an app with an agent: block.
+# kind: app
+
+
+# ─── NETWORKING ─────────────────────────────────────────────────────────────
+
+# Whether this entity serves public HTTP traffic.
+# true = public URL + Ingress (default). false = internal only.
+# expose: true
+
+# Additional domain names this entity serves on (the platform URL is always active).
+# custom_domains:
+#   - orders.example.com
+#   - shop.example.com
+
+
+# ─── HEALTH PROBE (entity-level override) ──────────────────────────────────
+
+# Override the default health check for the entire entity.
+# probe:
+#   path: /healthz               # HTTP path to probe (default: /).
+#   expected: "<500"             # '<500' (default), '200', '2xx'.
+
+
+# ─── DEPLOY NOTIFICATIONS ──────────────────────────────────────────────────
+
+# Slack notification to the org's default channel on deploy failure.
+# true = notify (default), false = silent.
+# notify: true
+
+
+# ─── SCALING ────────────────────────────────────────────────────────────────
+
+# Replica scaling intent.
+#   'auto'  — platform decides from the grid tier (default).
+#   'alert' — single-replica, emit a SPOF warning at plug time.
+#   1-10    — explicit replica count, clamped to the grid max.
+# scale: auto
+
+
+# ─── INFRASTRUCTURE NEEDS ──────────────────────────────────────────────────
+#
+# Declare infrastructure; the platform provisions it and injects connection
+# details as env vars. Nine needs: database, cache, kv, queue, pubsub, vector,
+# object_storage, disk, ai. Simplest form is `true`.
+#
+# needs:
+#   # database — MongoDB. Injects DATABASE_MONGODB_URL (+ legacy MONGODB_URL).
+#   #   true | pool | dedicated | { tier: external, secret: MY_DB }
+#   database: true
+#   # cache — Redis, LRU eviction (derived data). Injects CACHE_REDIS_URL (+ REDIS_URL).
+#   #   true | redis | { engine: external, secret: MY_REDIS_URL }
+#   cache: true
+#   # kv — Redis, no eviction (durable: flags, idempotency). Injects KV_REDIS_URL.
+#   kv: true
+#   # queue — Redis job-queue substrate (BullMQ). Injects QUEUE_REDIS_URL.
+#   queue: true
+#   # pubsub — Redis broadcast pub/sub. Injects PUBSUB_REDIS_URL.
+#   pubsub: true
+#   # vector — pgvector on Postgres. Injects VECTOR_PGVECTOR_URL (+ PGVECTOR_URL).
+#   #   true | pgvector | { engine: pgvector, dim: 1536 }
+#   vector: pgvector
+#   # object_storage — GCS bucket. Injects OBJECT_STORAGE_GCS_BUCKET, _GCS_REGION.
+#   #   true | { size: 10Gi }
+#   object_storage: true
+#   # disk — persistent FS mount (PVC). Injects DISK_PATH. Pins to 1 replica.
+#   #   true | { size: 1Gi, mount: /var/data }  (forbidden: /proc /sys /dev)
+#   disk: true
+#   # ai — AI Gateway via @cloudgrid-io/ai. Injects AI_GATEWAY_URL. true | false.
+#   ai: true
+
+
+# ─── INTER-ENTITY COMMUNICATION ────────────────────────────────────────────
+
+# Entities this app calls (outbound). Service-account token injected per pair.
+# calls:
+#   - org:atomic/billing-api
+
+# Inbound caller policy — who can call YOUR entity.
+# callers:
+#   policy: auto                 # 'auto' | 'manual' (default).
+#   scope: org                   # 'org' (default) | 'space' | 'explicit'.
+#   fallback: deny               # 'deny' (default) | 'warn'.
+#   # allowed_apps:              # required only when scope: explicit
+#   #   - org:atomic/frontend
+
+
+# ─── VAULT ──────────────────────────────────────────────────────────────────
+
+# Map org vault items to env vars. Keys UPPER_SNAKE_CASE; values = vault item keys.
+# vault:
+#   STRIPE_KEY: stripe-live-key
+#   SENDGRID_API_KEY: sendgrid-key
+
+
+# ─── CONNECTORS AND HOOKS ──────────────────────────────────────────────────
+
+# connectors:
+#   - id: team-slack
+#     target: org                # 'system' | 'org'.
+#     channel: "#deploys"
+# hooks:
+#   - on: deploy.failed          # release.published | deploy.failed | feedback.received | entity.created
+#     via: team-slack
+#     template: "Deploy failed for {entity_name}: {error}"
+#     channel: "#alerts"
+# triggers:
+#   - from: team-slack
+#     event: message
+#     channel: "#support"
+#     route: /webhooks/slack
+
+
+# ─── LOCAL DEVELOPMENT ──────────────────────────────────────────────────────
+
+# Config for `grid dev`. Redact fields in dev data snapshots.
+# dev:
+#   snapshot:
+#     mask:
+#       - users.email
+#       - users.phone
+
+
+# ─── AGENT METADATA ────────────────────────────────────────────────────────
+
+# An agent is an app with kind: agent (above) and an agent: block.
+# agent:
+#   purpose: Sync customer data from external CRM every night
+#   schedule: "0 2 * * *"
+#   trigger: webhook
+
+
+# ─── PRIVATE RESOURCE AUTO-DEPENDENCIES ────────────────────────────────────
+
+# When true (default), private resources are auto-injected as depends_on.
+# auto_depends_on_private_requires: true
+
+
+# ─── SERVICES (REQUIRED) ───────────────────────────────────────────────────
+#
+# At least one service is required. Key = service name (slug rules).
+# Types: node, nextjs, python, static, cron.
+#
+services:
+  web:
+    # type (REQUIRED): node | nextjs | python | static | cron
+    type: static
+    # HTTP route: '/' | '/api' | false (internal) | omitted (=false + warning).
+    # Only one service per entity can claim '/'.
+    path: /
+    # Container port (default 8080; read process.env.PORT). Not for cron.
+    # port: 3000
+    # nextjs only: base_image: distroless (default) | alpine
+    # base_image: distroless
+    # node only: lang: javascript (default) | typescript
+    # lang: typescript
+    # Custom source location (default services/<name>/). '.' = project root.
+    # source:
+    #   path: src/worker
+    # Health probe: false/omitted (TCP) | true (/health) | "/path" | {path,expected}
+    # health:
+    #   path: /api/health
+    #   expected: "200"
+    # Static runtime env vars (strings). Reserved: PORT, APP_NAME, SERVICE_NAME,
+    # NODE_ENV, MONGODB_URL, REDIS_URL, AI_GATEWAY_URL, N8N_WEBHOOK_URL, CLOUDGRID_*.
+    # env:
+    #   LOG_LEVEL: info
+    # Sibling services/private resources that must be Ready first (no cron, no cycles).
+    # depends_on:
+    #   - worker
+    # Per-service needs override (merges with app-level needs).
+    # needs:
+    #   queue: true
+    # Static-only build step:
+    # build:
+    #   command: npm run build
+    #   output: dist
+    #   env:
+    #     VITE_API_URL: https://api.example.com
+    # node_version: "22"          # static build step: '18'|'20'|'22'|'24' (quoted)
+    # Cron-only: schedule (REQUIRED), timezone (UTC|EST|PST), run (job | https URL)
+    # schedule: "0 9 * * 1"
+    # timezone: UTC
+    # run: job
+    # Verbose per-service persistence (prefer needs.disk):
+    # persist:
+    #   - name: scratch
+    #     path: /tmp/scratch
+    #     size: 500Mi
+
+
+# ============================================================================
+# NOTES
+# - NOT here: org:/entity_id: (→ .cloudgrid/link.json), secrets (→ grid secrets set),
+#   Dockerfile (platform generates from services.*.type).
+# - Deploy: grid plug   |   Local with grid resources: grid dev
+# - Full reference: docs/cloudgrid-yaml-reference.md  |  CLI: docs/cli-reference.md
+# ============================================================================

package/src/corpus/templates/product-launch/index.html

@@ -0,0 +1,320 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1" />
+<title>{{PRODUCT_NAME}} — {{LAUNCH_TAGLINE}}</title>
+<style>
+  :root {
+    --bg: #0a0d14;
+    --panel: #121826;
+    --panel-2: #0f1523;
+    --fg: #eef2f8;
+    --muted: #9aa7bd;
+    --accent: #5b8cff;
+    --accent-2: #8b5bff;
+    --good: #37d399;
+    --border: #223049;
+    --radius: 14px;
+  }
+  * { box-sizing: border-box; margin: 0; padding: 0; }
+  html { scroll-behavior: smooth; }
+  body {
+    background: var(--bg);
+    color: var(--fg);
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+    -webkit-font-smoothing: antialiased;
+    line-height: 1.55;
+  }
+  a { color: inherit; }
+  .wrap { max-width: 1080px; margin: 0 auto; padding: 0 clamp(1.25rem, 5vw, 3rem); }
+  section { padding: clamp(3rem, 8vw, 6rem) 0; }
+
+  /* Nav */
+  nav {
+    position: sticky; top: 0; z-index: 20;
+    display: flex; align-items: center; justify-content: space-between;
+    padding: 1rem clamp(1.25rem, 5vw, 3rem);
+    background: rgba(10, 13, 20, 0.72);
+    backdrop-filter: blur(10px);
+    border-bottom: 1px solid var(--border);
+  }
+  nav .brand { font-weight: 700; letter-spacing: -0.01em; font-size: 1.05rem; }
+  .btn {
+    display: inline-block; text-decoration: none; font-weight: 600;
+    padding: 0.8rem 1.5rem; border-radius: 10px;
+    background: linear-gradient(135deg, var(--accent), var(--accent-2));
+    color: #fff; border: none; cursor: pointer;
+    transition: filter 0.15s ease, transform 0.15s ease;
+  }
+  .btn:hover { filter: brightness(1.1); transform: translateY(-1px); }
+  .btn.ghost { background: transparent; border: 1px solid var(--border); color: var(--fg); }
+
+  /* Hero */
+  .hero {
+    display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2rem, 5vw, 4rem);
+    align-items: center;
+    background:
+      radial-gradient(900px 500px at 15% -10%, rgba(91,140,255,0.16), transparent 60%),
+      radial-gradient(700px 500px at 95% 10%, rgba(139,91,255,0.14), transparent 55%);
+  }
+  .badge {
+    display: inline-flex; align-items: center; gap: 0.5rem;
+    font-size: 0.82rem; color: var(--accent);
+    background: rgba(91,140,255,0.12); border: 1px solid rgba(91,140,255,0.3);
+    padding: 0.35rem 0.8rem; border-radius: 999px; letter-spacing: 0.02em;
+    margin-bottom: 1.25rem;
+  }
+  .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--good); }
+  .hero h1 {
+    font-size: clamp(2.2rem, 5.5vw, 3.8rem); line-height: 1.06;
+    letter-spacing: -0.025em; margin-bottom: 1rem;
+  }
+  .hero p.lede { font-size: clamp(1.05rem, 2.2vw, 1.3rem); color: var(--muted); max-width: 46ch; margin-bottom: 1.75rem; }
+  .hero-actions { display: flex; flex-wrap: wrap; gap: 0.85rem; align-items: center; }
+  .hero-note { color: var(--muted); font-size: 0.9rem; margin-top: 1rem; }
+
+  /* Product image (inline SVG placeholder — swap for a real product shot) */
+  .shot {
+    width: 100%; border-radius: var(--radius); overflow: hidden;
+    border: 1px solid var(--border);
+    box-shadow: 0 30px 80px -30px rgba(0,0,0,0.7);
+    background: var(--panel);
+  }
+  .shot svg { display: block; width: 100%; height: auto; }
+
+  /* Countdown */
+  .countdown { text-align: center; }
+  .countdown h2 { font-size: clamp(1.4rem, 3vw, 2rem); letter-spacing: -0.01em; margin-bottom: 0.4rem; }
+  .countdown .sub { color: var(--muted); margin-bottom: 2rem; }
+  .timer { display: flex; justify-content: center; gap: clamp(0.6rem, 2vw, 1.25rem); flex-wrap: wrap; }
+  .unit {
+    background: var(--panel); border: 1px solid var(--border);
+    border-radius: var(--radius); padding: 1.1rem 1.4rem; min-width: 92px;
+  }
+  .unit .num { font-size: clamp(1.8rem, 5vw, 2.8rem); font-weight: 700; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
+  .unit .lbl { color: var(--muted); font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.08em; margin-top: 0.25rem; }
+
+  /* Features */
+  .section-head { text-align: center; margin-bottom: 2.5rem; }
+  .section-head h2 { font-size: clamp(1.7rem, 4vw, 2.6rem); letter-spacing: -0.02em; margin-bottom: 0.6rem; }
+  .section-head p { color: var(--muted); max-width: 52ch; margin: 0 auto; }
+  .features { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
+  .feature {
+    background: var(--panel); border: 1px solid var(--border);
+    border-radius: var(--radius); padding: 1.6rem;
+  }
+  .feature .ico {
+    width: 42px; height: 42px; border-radius: 11px; display: grid; place-items: center;
+    background: rgba(91,140,255,0.14); color: var(--accent); font-size: 1.25rem; margin-bottom: 1rem;
+  }
+  .feature h3 { font-size: 1.15rem; letter-spacing: -0.01em; margin-bottom: 0.45rem; }
+  .feature p { color: var(--muted); font-size: 0.96rem; }
+
+  /* Offer */
+  .offer-wrap { padding-top: 0; }
+  .offer {
+    background: linear-gradient(135deg, rgba(91,140,255,0.14), rgba(139,91,255,0.14));
+    border: 1px solid var(--border); border-radius: 20px;
+    padding: clamp(2rem, 5vw, 3.5rem); text-align: center;
+  }
+  .offer .eyebrow { color: var(--accent); font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; font-size: 0.8rem; }
+  .offer h2 { font-size: clamp(1.8rem, 4.5vw, 3rem); letter-spacing: -0.02em; margin: 0.5rem 0 0.4rem; }
+  .price { display: flex; align-items: baseline; justify-content: center; gap: 0.6rem; margin: 1rem 0 0.4rem; }
+  .price .now { font-size: clamp(2.2rem, 6vw, 3.2rem); font-weight: 700; letter-spacing: -0.02em; }
+  .price .was { color: var(--muted); text-decoration: line-through; font-size: 1.3rem; }
+  .offer .fine { color: var(--muted); font-size: 0.9rem; margin: 0.75rem 0 1.75rem; }
+
+  /* Social proof */
+  .proof { text-align: center; }
+  .stats { display: flex; justify-content: center; gap: clamp(1.5rem, 6vw, 4rem); flex-wrap: wrap; margin-bottom: 3rem; }
+  .stat .num { font-size: clamp(1.8rem, 5vw, 2.6rem); font-weight: 700; letter-spacing: -0.02em; }
+  .stat .lbl { color: var(--muted); font-size: 0.9rem; }
+  .quotes { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); text-align: left; }
+  .quote { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.5rem; }
+  .quote p { font-size: 1rem; margin-bottom: 1rem; }
+  .who { display: flex; align-items: center; gap: 0.75rem; }
+  .avatar { width: 38px; height: 38px; border-radius: 50%; background: linear-gradient(135deg, var(--accent), var(--accent-2)); display: grid; place-items: center; font-weight: 700; font-size: 0.9rem; color: #fff; }
+  .who .name { font-weight: 600; font-size: 0.92rem; }
+  .who .role { color: var(--muted); font-size: 0.82rem; }
+
+  footer { border-top: 1px solid var(--border); color: var(--muted); font-size: 0.9rem; text-align: center; padding: 2.5rem 0; }
+
+  @media (max-width: 820px) {
+    .hero { grid-template-columns: 1fr; }
+    .hero .shot { order: -1; }
+  }
+</style>
+</head>
+<body>
+  <nav>
+    <span class="brand">{{PRODUCT_NAME}}</span>
+    <a class="btn" href="{{CTA_HREF}}">{{CTA_LABEL}}</a>
+  </nav>
+
+  <!-- Hero -->
+  <header class="hero-wrap hero-section">
+  <section class="hero">
+    <div class="wrap" style="padding:0; display:contents;">
+      <div class="hero-copy">
+        <span class="badge"><span class="dot"></span> {{LAUNCH_BADGE}}</span>
+        <h1>{{HERO_HEADLINE}}</h1>
+        <p class="lede">{{HERO_SUBHEAD}}</p>
+        <div class="hero-actions">
+          <a class="btn" href="{{CTA_HREF}}">{{CTA_LABEL}}</a>
+          <a class="btn ghost" href="#features">See what's new</a>
+        </div>
+        <p class="hero-note">{{HERO_NOTE}}</p>
+      </div>
+
+      <div class="shot" role="img" aria-label="{{PRODUCT_NAME}} product image">
+        <!-- Replace this inline SVG with a real product screenshot or photo.
+             Keep it self-contained: inline SVG or a data: URI, never an external URL. -->
+        <svg viewBox="0 0 640 440" xmlns="http://www.w3.org/2000/svg">
+          <defs>
+            <linearGradient id="g" x1="0" y1="0" x2="1" y2="1">
+              <stop offset="0" stop-color="#5b8cff"/>
+              <stop offset="1" stop-color="#8b5bff"/>
+            </linearGradient>
+          </defs>
+          <rect width="640" height="440" fill="#0f1523"/>
+          <rect x="40" y="40" width="560" height="360" rx="16" fill="#121826" stroke="#223049"/>
+          <circle cx="72" cy="72" r="6" fill="#ff5f57"/>
+          <circle cx="94" cy="72" r="6" fill="#febc2e"/>
+          <circle cx="116" cy="72" r="6" fill="#28c840"/>
+          <rect x="72" y="112" width="300" height="26" rx="6" fill="url(#g)"/>
+          <rect x="72" y="158" width="440" height="12" rx="6" fill="#223049"/>
+          <rect x="72" y="182" width="380" height="12" rx="6" fill="#223049"/>
+          <rect x="72" y="206" width="410" height="12" rx="6" fill="#223049"/>
+          <rect x="72" y="256" width="150" height="90" rx="10" fill="#0d1220" stroke="#223049"/>
+          <rect x="238" y="256" width="150" height="90" rx="10" fill="#0d1220" stroke="#223049"/>
+          <rect x="404" y="256" width="150" height="90" rx="10" fill="#0d1220" stroke="#223049"/>
+        </svg>
+      </div>
+    </div>
+  </section>
+  </header>
+
+  <!-- Countdown -->
+  <section class="countdown">
+    <div class="wrap">
+      <h2>{{COUNTDOWN_HEADLINE}}</h2>
+      <p class="sub">{{COUNTDOWN_SUBHEAD}}</p>
+      <div class="timer" id="timer" aria-live="polite">
+        <div class="unit"><div class="num" id="cd-days">--</div><div class="lbl">Days</div></div>
+        <div class="unit"><div class="num" id="cd-hours">--</div><div class="lbl">Hours</div></div>
+        <div class="unit"><div class="num" id="cd-mins">--</div><div class="lbl">Minutes</div></div>
+        <div class="unit"><div class="num" id="cd-secs">--</div><div class="lbl">Seconds</div></div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Features -->
+  <section id="features">
+    <div class="wrap">
+      <div class="section-head">
+        <h2>{{FEATURES_HEADLINE}}</h2>
+        <p>{{FEATURES_SUBHEAD}}</p>
+      </div>
+      <div class="features">
+        <!-- FEATURES_START — one .feature block per feature; add or remove freely. -->
+        <div class="feature">
+          <div class="ico">✦</div>
+          <h3>{{FEATURE_1_TITLE}}</h3>
+          <p>{{FEATURE_1_BODY}}</p>
+        </div>
+        <div class="feature">
+          <div class="ico">⚡</div>
+          <h3>{{FEATURE_2_TITLE}}</h3>
+          <p>{{FEATURE_2_BODY}}</p>
+        </div>
+        <div class="feature">
+          <div class="ico">◎</div>
+          <h3>{{FEATURE_3_TITLE}}</h3>
+          <p>{{FEATURE_3_BODY}}</p>
+        </div>
+        <!-- FEATURES_END -->
+      </div>
+    </div>
+  </section>
+
+  <!-- Launch offer -->
+  <section class="offer-wrap">
+    <div class="wrap">
+      <div class="offer">
+        <span class="eyebrow">{{OFFER_EYEBROW}}</span>
+        <h2>{{OFFER_HEADLINE}}</h2>
+        <div class="price">
+          <span class="now">{{OFFER_PRICE}}</span>
+          <span class="was">{{OFFER_WAS}}</span>
+        </div>
+        <p class="fine">{{OFFER_FINE_PRINT}}</p>
+        <a class="btn" href="{{CTA_HREF}}">{{OFFER_CTA_LABEL}}</a>
+      </div>
+    </div>
+  </section>
+
+  <!-- Social proof -->
+  <section class="proof">
+    <div class="wrap">
+      <div class="stats">
+        <div class="stat"><div class="num">{{STAT_1_NUM}}</div><div class="lbl">{{STAT_1_LABEL}}</div></div>
+        <div class="stat"><div class="num">{{STAT_2_NUM}}</div><div class="lbl">{{STAT_2_LABEL}}</div></div>
+        <div class="stat"><div class="num">{{STAT_3_NUM}}</div><div class="lbl">{{STAT_3_LABEL}}</div></div>
+      </div>
+      <div class="quotes">
+        <!-- QUOTES_START — one .quote block per testimonial. -->
+        <div class="quote">
+          <p>"{{QUOTE_1_TEXT}}"</p>
+          <div class="who">
+            <span class="avatar">{{QUOTE_1_INITIALS}}</span>
+            <span><span class="name">{{QUOTE_1_NAME}}</span><br><span class="role">{{QUOTE_1_ROLE}}</span></span>
+          </div>
+        </div>
+        <div class="quote">
+          <p>"{{QUOTE_2_TEXT}}"</p>
+          <div class="who">
+            <span class="avatar">{{QUOTE_2_INITIALS}}</span>
+            <span><span class="name">{{QUOTE_2_NAME}}</span><br><span class="role">{{QUOTE_2_ROLE}}</span></span>
+          </div>
+        </div>
+        <!-- QUOTES_END -->
+      </div>
+    </div>
+  </section>
+
+  <footer>{{FOOTER_TEXT}}</footer>
+
+  <script>
+    // Simple launch countdown. Set the target date/time (ISO 8601).
+    // Example: "2026-09-01T09:00:00Z". Falls back to +14 days if unset/invalid.
+    (function () {
+      var TARGET = "{{LAUNCH_DATETIME_ISO}}";
+      var target = new Date(TARGET);
+      if (isNaN(target.getTime())) {
+        target = new Date(Date.now() + 14 * 24 * 60 * 60 * 1000);
+      }
+      var els = {
+        days: document.getElementById("cd-days"),
+        hours: document.getElementById("cd-hours"),
+        mins: document.getElementById("cd-mins"),
+        secs: document.getElementById("cd-secs")
+      };
+      function pad(n) { return String(n).padStart(2, "0"); }
+      function tick() {
+        var diff = Math.max(0, target.getTime() - Date.now());
+        var s = Math.floor(diff / 1000);
+        var d = Math.floor(s / 86400); s -= d * 86400;
+        var h = Math.floor(s / 3600); s -= h * 3600;
+        var m = Math.floor(s / 60); s -= m * 60;
+        els.days.textContent = d;
+        els.hours.textContent = pad(h);
+        els.mins.textContent = pad(m);
+        els.secs.textContent = pad(s);
+      }
+      tick();
+      setInterval(tick, 1000);
+    })();
+  </script>
+</body>
+</html>

package/src/corpus/templates/product-launch/index.md

@@ -0,0 +1,34 @@
+# Template: product-launch (static)
+
+A single self-contained HTML product-launch page — hero with product image, key
+features, launch offer + CTA, a live countdown, and social proof. **No
+infrastructure** — no database, no backend, no `needs:`. Everything is one
+`index.html` with inline CSS and inline JS; the countdown is computed
+client-side.
+
+## How it deploys
+
+To publish this page, use **`gridctl_drop`** (or `gridctl_plug` with the inline
+HTML): it deploys as an **inspiration** — instant, and works on the **hosted**
+edition (Claude Web) as well as local. The reference `cloudgrid.yaml` in this
+directory (`type: static`) is ONLY for plugging the page as an OWNED static
+runtime (async, local edition only); the fast path is `gridctl_drop`.
+
+The fillable HTML is the real template — fetch it with
+`gridctl_fetch("template", "product-launch")` and fill in the user's content
+(product name, hero copy, countdown target, features, offer, quotes). Keep it a
+single self-contained file: inline SVG / `data:` URIs only, no external scripts,
+stylesheets, fonts, or CDNs.
+
+## cloudgrid.yaml (reference only)
+
+```yaml
+# On disk this file is the full-annotated reference (templates/_cloudgrid.yaml.reference) with EVERY
+# field present as a comment; only the fields below are uncommented, so it
+# deploys to exactly these active fields.
+name: product-launch
+services:
+  web:
+    type: static
+    path: /
+```