@gradial/aci 0.1.20-preview.2 → 0.1.20

package/templates/common/.content/fragments/site-footer/_index.json

@@ -0,0 +1,62 @@
+{
+  "$type": "fragment",
+  "fragmentId": "site-footer",
+  "component": "site-footer",
+  "props": {
+    "brandHref": "/",
+    "brandLabel": "Meridian",
+    "brandLogo": {
+      "src": "/assets/meridian-logo.svg",
+      "alt": "Meridian"
+    },
+    "columns": [
+      {
+        "id": "products",
+        "title": "Products",
+        "links": [
+          { "id": "plans", "label": "Plans", "href": "/plans/" },
+          { "id": "devices", "label": "Devices", "href": "/devices/" },
+          { "id": "coverage", "label": "Coverage", "href": "/coverage/" }
+        ]
+      },
+      {
+        "id": "solutions",
+        "title": "Solutions",
+        "links": [
+          { "id": "business", "label": "Business", "href": "/business/" },
+          { "id": "maritime", "label": "Maritime", "href": "/business/maritime/" },
+          { "id": "aerospace", "label": "Aerospace", "href": "/business/aerospace/" }
+        ]
+      },
+      {
+        "id": "resources",
+        "title": "Resources",
+        "links": [
+          { "id": "blog", "label": "Blog", "href": "/blog/" },
+          { "id": "documentation", "label": "Documentation", "href": "/docs/" },
+          { "id": "support", "label": "Support", "href": "/support/" }
+        ]
+      },
+      {
+        "id": "company",
+        "title": "Company",
+        "links": [
+          { "id": "about", "label": "About us", "href": "/about/" },
+          { "id": "careers", "label": "Careers", "href": "/careers/" },
+          { "id": "contact", "label": "Contact", "href": "/contact/" }
+        ]
+      }
+    ],
+    "social": [
+      { "id": "x", "label": "X", "href": "https://x.com/meridian", "icon": "X" },
+      { "id": "linkedin", "label": "LinkedIn", "href": "https://www.linkedin.com/company/meridian", "icon": "in" },
+      { "id": "youtube", "label": "YouTube", "href": "https://www.youtube.com/meridian", "icon": "YT" }
+    ],
+    "legalLinks": [
+      { "id": "terms", "label": "Terms of Service", "href": "/terms/" },
+      { "id": "privacy", "label": "Privacy Policy", "href": "/privacy/" },
+      { "id": "security", "label": "Security", "href": "/security/" }
+    ],
+    "copyright": "Copyright (c) 2026 Meridian Satellite Networks, Inc. All rights reserved."
+  }
+}

package/templates/common/.content/pages/about/_index.json

@@ -0,0 +1,51 @@
+{
+  "$type": "page",
+  "id": "meridian-about",
+  "status": "published",
+  "layout": "default",
+  "metadata": {
+    "title": "About Meridian",
+    "description": "Meridian is building the next generation of satellite internet to connect the unconnected.",
+    "canonical": "https://www.meridian.local/about"
+  },
+  "regions": {
+    "main": [
+      {
+        "id": "about-hero",
+        "component": "home_hero",
+        "props": {
+          "eyebrow": "About us",
+          "headline": "Connecting the edges of the world.",
+          "description": "Meridian designs, builds, and operates low-orbit satellites and ground terminals that bring reliable broadband to places traditional networks cannot reach.",
+          "ctaLabel": "Back to home",
+          "ctaHref": "/",
+          "image": {
+            "$type": "dam.assetRef",
+            "assetId": "ast_site_about_hero",
+            "alt": "Meridian network coverage map with soft gradient"
+          }
+        }
+      },
+      {
+        "id": "about-actions",
+        "component": "container",
+        "props": {
+          "className": "items-center justify-center text-center",
+          "content": [
+            {
+              "id": "home-link",
+              "component": "button",
+              "props": {
+                "label": "Return home",
+                "href": "/",
+                "variant": "primary",
+                "icon": "arrow_forward",
+                "iconPosition": "after"
+              }
+            }
+          ]
+        }
+      }
+    ]
+  }
+}

package/templates/common/.content/pages/home/_index.json

@@ -0,0 +1,112 @@
+{
+  "$type": "page",
+  "id": "meridian-home",
+  "status": "published",
+  "layout": "default",
+  "metadata": {
+    "title": "Meridian — Global Satellite Internet",
+    "description": "Connect from anywhere on Earth. Low-latency satellite internet for homes, businesses, and beyond.",
+    "canonical": "https://www.meridian.local/"
+  },
+  "regions": {
+    "main": [
+      {
+        "id": "hero",
+        "component": "home_hero",
+        "props": {
+          "eyebrow": "Global satellite internet",
+          "headline": "Connect from anywhere on Earth.",
+          "description": "Meridian delivers low-latency broadband to homes, businesses, and remote operations in over 40 countries. No ground infrastructure required.",
+          "ctaLabel": "Explore plans",
+          "ctaHref": "/plans/",
+          "image": {
+            "$type": "dam.assetRef",
+            "assetId": "ast_site_home_hero",
+            "alt": "Light abstract hero background with satellite constellation"
+          }
+        }
+      },
+      {
+        "id": "why-meridian",
+        "component": "feature_grid",
+        "props": {
+          "title": "Why Meridian",
+          "subtitle": "Engineered for the edges of the world.",
+          "features": [
+            {
+              "id": "global-coverage",
+              "component": "feature_card",
+              "props": {
+                "icon": "globe",
+                "title": "Global coverage",
+                "description": "A constellation of low-orbit satellites keeps you connected across continents, oceans, and remote terrain."
+              }
+            },
+            {
+              "id": "low-latency",
+              "component": "feature_card",
+              "props": {
+                "icon": "speed",
+                "title": "Low latency",
+                "description": "Sub-50ms latency means video calls, gaming, and real-time control feel local, even in the middle of nowhere."
+              }
+            },
+            {
+              "id": "easy-setup",
+              "component": "feature_card",
+              "props": {
+                "icon": "setup",
+                "title": "Easy setup",
+                "description": "A compact terminal and a phone app. Point at the sky, power on, and get online in minutes."
+              }
+            }
+          ]
+        }
+      },
+      {
+        "id": "stats",
+        "component": "stats_bar",
+        "props": {
+          "stats": [
+            { "label": "Network uptime", "value": "99.9", "suffix": "%" },
+            { "label": "Average latency", "value": "<50", "suffix": "ms" },
+            { "label": "Countries covered", "value": "40", "suffix": "+" },
+            { "label": "Orbital satellites", "value": "2,400", "suffix": "" }
+          ]
+        }
+      },
+      {
+        "id": "cta",
+        "component": "container",
+        "props": {
+          "theme": "light",
+          "className": "items-center justify-center text-center",
+          "content": [
+            {
+              "id": "cta-primary",
+              "component": "button",
+              "props": {
+                "label": "Explore plans",
+                "href": "/plans/",
+                "variant": "primary",
+                "icon": "arrow_forward",
+                "iconPosition": "after"
+              }
+            },
+            {
+              "id": "cta-secondary",
+              "component": "button",
+              "props": {
+                "label": "Contact sales",
+                "href": "/contact-sales/",
+                "variant": "outline",
+                "icon": "arrow_forward",
+                "iconPosition": "after"
+              }
+            }
+          ]
+        }
+      }
+    ]
+  }
+}

package/templates/common/.content/schemas/site.schema.json

@@ -0,0 +1,123 @@
+{
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
+  "$id": "https://baremetal.local/schemas/site.schema.json",
+  "title": "bare-metal Site Config",
+  "type": "object",
+  "required": ["$type", "id", "status", "title", "domain", "defaultLocale", "overlayResolution"],
+  "additionalProperties": true,
+  "properties": {
+    "$type": { "const": "site" },
+    "id": { "type": "string", "minLength": 1 },
+    "status": { "type": "string", "minLength": 1 },
+    "title": { "type": "string", "minLength": 1 },
+    "domain": { "type": "string", "minLength": 1 },
+    "defaultLocale": { "type": "string", "minLength": 1 },
+    "locales": {
+      "type": "array",
+      "items": { "type": "string", "minLength": 1 }
+    },
+    "overlayResolution": {
+      "type": "array",
+      "items": { "enum": ["locale", "audience"] }
+    },
+    "brandHref": { "type": "string" },
+    "brandLogo": {
+      "type": "object",
+      "additionalProperties": true,
+      "properties": {
+        "src": { "type": "string", "minLength": 1 },
+        "alt": { "type": "string" }
+      }
+    },
+    "navigation": {
+      "type": "array",
+      "items": { "$ref": "#/$defs/link" }
+    },
+    "utilities": {
+      "type": "array",
+      "items": {
+        "allOf": [
+          { "$ref": "#/$defs/link" },
+          {
+            "type": "object",
+            "properties": {
+              "variant": {
+                "enum": ["primary", "secondary", "outline", "ghost"]
+              }
+            }
+          }
+        ]
+      }
+    },
+    "footer": {
+      "type": "object",
+      "additionalProperties": true,
+      "properties": {
+        "columns": {
+          "type": "array",
+          "items": { "$ref": "#/$defs/footerColumn" }
+        },
+        "social": {
+          "type": "array",
+          "items": { "$ref": "#/$defs/link" }
+        },
+        "legalLinks": {
+          "type": "array",
+          "items": { "$ref": "#/$defs/link" }
+        },
+        "copyright": { "type": "string" }
+      }
+    },
+    "seo": {
+      "type": "object",
+      "additionalProperties": true,
+      "properties": {
+        "title": { "type": "string" },
+        "description": { "type": "string" },
+        "siteName": { "type": "string" }
+      }
+    }
+  },
+  "$defs": {
+    "link": {
+      "type": "object",
+      "required": ["id", "label", "href"],
+      "additionalProperties": true,
+      "properties": {
+        "id": { "type": "string", "minLength": 1 },
+        "label": { "type": "string", "minLength": 1 },
+        "href": { "type": "string", "minLength": 1 }
+      }
+    },
+    "footerGroup": {
+      "type": "object",
+      "required": ["id", "title", "links"],
+      "additionalProperties": true,
+      "properties": {
+        "id": { "type": "string", "minLength": 1 },
+        "title": { "type": "string" },
+        "links": {
+          "type": "array",
+          "items": { "$ref": "#/$defs/link" }
+        }
+      }
+    },
+    "footerColumn": {
+      "type": "object",
+      "required": ["id"],
+      "additionalProperties": true,
+      "properties": {
+        "id": { "type": "string", "minLength": 1 },
+        "title": { "type": "string" },
+        "groups": {
+          "type": "array",
+          "items": { "$ref": "#/$defs/footerGroup" }
+        },
+        "links": {
+          "type": "array",
+          "items": { "$ref": "#/$defs/link" }
+        }
+      }
+    }
+  }
+}

package/templates/common/README.md.tmpl

@@ -0,0 +1,45 @@
+# {{siteName}}
+
+## Quick Start
+
+```bash
+npm install
+npm run dev
+```
+
+## Skills
+
+This project uses progressive disclosure skills for both humans and agents.
+Each skill has a `SKILL.md` entry point and `references/` for deeper topics.
+
+| Skill | When to read |
+|-------|-------------|
+| [aci](.agents/skills/aci/SKILL.md) | New to ACI? Start here. Architecture, commands, testing, troubleshooting. |
+| [authoring](.agents/skills/authoring/SKILL.md) | Creating content, building components, design tokens, component registry. |
+| [migration](.agents/skills/migration/SKILL.md) | Migrating an existing site or design into ACI. |
+
+Agents: load skills from `.agents/skills/`. See `.agents/AGENTS.md`.
+
+## Commands
+
+```bash
+npm run dev              # Start dev server
+npm run build            # Build for production
+npm run typecheck        # TypeScript type checking
+npm run aci:validate     # Validate content against schemas
+npm run aci:compile      # Compile contract registry
+npm run content:compile  # Compile content into .aci/compiled/
+npm run aci:doctor       # Check project health
+npm run aci:build        # Full build (contracts + content + framework)
+```
+
+## Project Structure
+
+```
+.content/          Content source (JSON)
+src/cms/           Contracts and component registry
+src/components/    Runtime components (elements, sections, chrome)
+src/design-system/ Design tokens and global styles
+.agents/skills/    Skills for humans and agents
+.aci/              Generated artifacts (compiled, schemas)
+```

package/templates/common/contracts/components/button.contract.ts

@@ -0,0 +1,19 @@
+import { defineComponentContract } from '@gradial/aci';
+import { z } from 'zod';
+
+export const schema = z.object({
+  label: z.string().min(1),
+  href: z.string().min(1),
+  variant: z.enum(['primary', 'secondary', 'outline', 'tertiary']).optional(),
+  newWindow: z.boolean().optional(),
+  icon: z.string().optional(),
+  iconPosition: z.enum(['before', 'after']).optional(),
+  className: z.string().optional(),
+});
+
+export type ContentProps = z.infer<typeof schema>;
+
+export const buttonContract = defineComponentContract({
+  id: 'button',
+  props: schema,
+});

package/templates/common/contracts/components/container.contract.ts

@@ -0,0 +1,19 @@
+import { defineComponentContract, blockRefArray } from '@gradial/aci';
+import { z } from 'zod';
+import { buttonContract } from './button.contract';
+import { featureGridContract } from './featureGrid.contract';
+import { featureCardContract } from './featureCard.contract';
+import { statsBarContract } from './statsBar.contract';
+
+export const schema = z.object({
+  theme: z.enum(['auto', 'light', 'dark']).optional(),
+  className: z.string().optional(),
+  content: blockRefArray([buttonContract, featureGridContract, featureCardContract, statsBarContract]).optional(),
+});
+
+export type ContentProps = z.infer<typeof schema>;
+
+export const containerContract = defineComponentContract({
+  id: 'container',
+  props: schema,
+});

package/templates/common/contracts/components/featureCard.contract.ts

@@ -0,0 +1,15 @@
+import { defineComponentContract } from '@gradial/aci';
+import { z } from 'zod';
+
+export const schema = z.object({
+  icon: z.string().optional(),
+  title: z.string().min(1),
+  description: z.string().optional(),
+});
+
+export type ContentProps = z.infer<typeof schema>;
+
+export const featureCardContract = defineComponentContract({
+  id: 'feature_card',
+  props: schema,
+});

package/templates/common/contracts/components/featureGrid.contract.ts

@@ -0,0 +1,16 @@
+import { defineComponentContract, blockRefArray } from '@gradial/aci';
+import { z } from 'zod';
+import { featureCardContract } from './featureCard.contract';
+
+export const schema = z.object({
+  title: z.string().optional(),
+  subtitle: z.string().optional(),
+  features: blockRefArray([featureCardContract]).optional(),
+});
+
+export type ContentProps = z.infer<typeof schema>;
+
+export const featureGridContract = defineComponentContract({
+  id: 'feature_grid',
+  props: schema,
+});

package/templates/common/contracts/components/homeHero.contract.ts

@@ -0,0 +1,36 @@
+import { defineComponentContract, ImageSchema } from '@gradial/aci';
+import { z } from 'zod';
+
+export const schema = z.object({
+  eyebrow: z.string().optional(),
+  headline: z.string().min(1),
+  description: z.string().optional(),
+  ctaLabel: z.string().min(1),
+  ctaHref: z.string().min(1),
+  image: ImageSchema.optional(),
+});
+
+export type ContentProps = z.infer<typeof schema>;
+
+export const homeHeroContract = defineComponentContract({
+  id: 'home_hero',
+  props: schema,
+  imageSlots: {
+    image: {
+      formats: ['image/avif', 'image/webp', 'image/jpeg'],
+      sizes: '100vw',
+      outputs: [
+        {
+          aspectRatio: '16:9',
+          widths: [768, 1280, 1920],
+          media: '(min-width: 768px)',
+        },
+        {
+          aspectRatio: '3:4',
+          widths: [480, 720, 960],
+          media: '(max-width: 767px)',
+        },
+      ],
+    },
+  },
+});

package/templates/common/contracts/components/index.ts

@@ -0,0 +1,21 @@
+import { buttonContract } from './button.contract';
+import { containerContract } from './container.contract';
+import { featureCardContract } from './featureCard.contract';
+import { featureGridContract } from './featureGrid.contract';
+import { homeHeroContract } from './homeHero.contract';
+import { siteNavigationContract } from './siteNavigation.contract';
+import { siteFooterContract } from './siteFooter.contract';
+import { statsBarContract } from './statsBar.contract';
+
+const componentContracts = [
+  homeHeroContract,
+  containerContract,
+  buttonContract,
+  siteNavigationContract,
+  siteFooterContract,
+  featureGridContract,
+  featureCardContract,
+  statsBarContract,
+];
+
+export default componentContracts;

package/templates/common/contracts/components/siteFooter.contract.ts

@@ -0,0 +1,45 @@
+import { defineComponentContract } from '@gradial/aci';
+import { z } from 'zod';
+
+const linkSchema = z.object({
+  id: z.string().min(1),
+  label: z.string().min(1),
+  href: z.string().min(1),
+});
+
+const groupSchema = z.object({
+  id: z.string().min(1),
+  title: z.string(),
+  links: z.array(linkSchema),
+});
+
+const columnSchema = z.object({
+  id: z.string().min(1),
+  title: z.string().optional(),
+  links: z.array(linkSchema).optional(),
+  groups: z.array(groupSchema).optional(),
+});
+
+const socialSchema = linkSchema.extend({
+  icon: z.string().optional(),
+});
+
+export const schema = z.object({
+  brandHref: z.string().min(1),
+  brandLabel: z.string().min(1),
+  brandLogo: z.object({
+    src: z.string(),
+    alt: z.string(),
+  }).nullable().optional(),
+  columns: z.array(columnSchema),
+  social: z.array(socialSchema).optional(),
+  legalLinks: z.array(linkSchema).optional(),
+  copyright: z.string().optional(),
+});
+
+export type ContentProps = z.infer<typeof schema>;
+
+export const siteFooterContract = defineComponentContract({
+  id: 'site-footer',
+  props: schema,
+});

package/templates/common/contracts/components/siteNavigation.contract.ts

@@ -0,0 +1,30 @@
+import { defineComponentContract } from '@gradial/aci';
+import { z } from 'zod';
+
+const linkSchema = z.object({
+  id: z.string().min(1),
+  label: z.string().min(1),
+  href: z.string().min(1),
+});
+
+const utilitySchema = linkSchema.extend({
+  variant: z.enum(['primary', 'secondary', 'tertiary', 'outline', 'ghost']).optional(),
+});
+
+export const schema = z.object({
+  brandHref: z.string().min(1),
+  brandLabel: z.string().min(1),
+  brandLogo: z.object({
+    src: z.string(),
+    alt: z.string(),
+  }).nullable().optional(),
+  navigation: z.array(linkSchema),
+  utilities: z.array(utilitySchema).optional(),
+});
+
+export type ContentProps = z.infer<typeof schema>;
+
+export const siteNavigationContract = defineComponentContract({
+  id: 'site-navigation',
+  props: schema,
+});

package/templates/common/contracts/components/statsBar.contract.ts

@@ -0,0 +1,19 @@
+import { defineComponentContract } from '@gradial/aci';
+import { z } from 'zod';
+
+const statSchema = z.object({
+  label: z.string().min(1),
+  value: z.string().min(1),
+  suffix: z.string().optional(),
+});
+
+export const schema = z.object({
+  stats: z.array(statSchema).min(1),
+});
+
+export type ContentProps = z.infer<typeof schema>;
+
+export const statsBarContract = defineComponentContract({
+  id: 'stats_bar',
+  props: schema,
+});