@adia-ai/a2ui-corpus 0.0.1

package/exemplars/ui/auth-login/a2ui.json

@@ -0,0 +1,1821 @@
+{
+  "id": "auth-login",
+  "type": "page",
+  "description": "Login form variants (email-first, classic, passwordless)",
+  "domain": "forms",
+  "tags": [
+    "auth-login",
+    "section",
+    "column",
+    "text",
+    "row",
+    "card",
+    "input",
+    "button",
+    "divider",
+    "header",
+    "checkbox",
+    "footer",
+    "grid",
+    "icon",
+    "otpinput",
+    "avatar",
+    "alert",
+    "progress",
+    "forms",
+    "sign"
+  ],
+  "keywords": [
+    "auth-login",
+    "section",
+    "column",
+    "text",
+    "row",
+    "card",
+    "input",
+    "button"
+  ],
+  "source": "exemplars/ui/auth-login/index.html",
+  "components": [
+    "Section",
+    "Column",
+    "Text",
+    "Row",
+    "Card",
+    "Input",
+    "Button",
+    "Divider",
+    "Header",
+    "CheckBox",
+    "Footer",
+    "Grid",
+    "Icon",
+    "OtpInput",
+    "Avatar",
+    "Alert",
+    "Progress"
+  ],
+  "template": [
+    {
+      "id": "section-1",
+      "component": "Section",
+      "children": [
+        "column-2"
+      ]
+    },
+    {
+      "id": "column-2",
+      "component": "Column",
+      "children": [
+        "column-3",
+        "column-26",
+        "column-47",
+        "column-74",
+        "column-94",
+        "column-121",
+        "column-147",
+        "column-183",
+        "column-200",
+        "column-214"
+      ],
+      "gap": "10"
+    },
+    {
+      "id": "column-3",
+      "component": "Column",
+      "children": [
+        "text-4",
+        "row-5"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "text-4",
+      "component": "Text",
+      "variant": "section",
+      "nomargin": true,
+      "textContent": "Email-First Login"
+    },
+    {
+      "id": "row-5",
+      "component": "Row",
+      "children": [
+        "card-6"
+      ],
+      "gap": "4",
+      "justify": "center"
+    },
+    {
+      "id": "card-6",
+      "component": "Card",
+      "children": [
+        "section-7"
+      ],
+      "radius": "round"
+    },
+    {
+      "id": "section-7",
+      "component": "Section",
+      "children": [
+        "column-8"
+      ]
+    },
+    {
+      "id": "column-8",
+      "component": "Column",
+      "children": [
+        "column-9",
+        "column-12",
+        "row-15",
+        "divider-18",
+        "column-19",
+        "row-24"
+      ],
+      "gap": "5"
+    },
+    {
+      "id": "column-9",
+      "component": "Column",
+      "children": [
+        "text-10"
+      ],
+      "gap": "2",
+      "align": "center"
+    },
+    {
+      "id": "text-10",
+      "component": "Text",
+      "children": [
+        "text-11"
+      ],
+      "slot": "heading"
+    },
+    {
+      "id": "text-11",
+      "component": "Text",
+      "textContent": "Sign in to your account to continue"
+    },
+    {
+      "id": "column-12",
+      "component": "Column",
+      "children": [
+        "input-13",
+        "button-14"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "input-13",
+      "component": "Input",
+      "label": "Email address",
+      "placeholder": "you@example.com",
+      "type": "email"
+    },
+    {
+      "id": "button-14",
+      "component": "Button",
+      "text": "Continue",
+      "variant": "primary",
+      "stretch": true
+    },
+    {
+      "id": "row-15",
+      "component": "Row",
+      "children": [
+        "text-16",
+        "text-17"
+      ],
+      "gap": "1",
+      "justify": "center"
+    },
+    {
+      "id": "text-16",
+      "component": "Text",
+      "textContent": "Don't have an account?"
+    },
+    {
+      "id": "text-17",
+      "component": "Text",
+      "textContent": "Sign up"
+    },
+    {
+      "id": "divider-18",
+      "component": "Divider",
+      "label": "OR"
+    },
+    {
+      "id": "column-19",
+      "component": "Column",
+      "children": [
+        "button-20",
+        "button-21",
+        "button-22",
+        "button-23"
+      ],
+      "gap": "2"
+    },
+    {
+      "id": "button-20",
+      "component": "Button",
+      "text": "Continue with Google",
+      "icon": "google-logo",
+      "variant": "outline",
+      "stretch": true
+    },
+    {
+      "id": "button-21",
+      "component": "Button",
+      "text": "Continue with Apple",
+      "icon": "apple-logo",
+      "variant": "outline",
+      "stretch": true
+    },
+    {
+      "id": "button-22",
+      "component": "Button",
+      "text": "Continue with Microsoft",
+      "icon": "windows-logo",
+      "variant": "outline",
+      "stretch": true
+    },
+    {
+      "id": "button-23",
+      "component": "Button",
+      "text": "Continue with phone",
+      "icon": "phone",
+      "variant": "outline",
+      "stretch": true
+    },
+    {
+      "id": "row-24",
+      "component": "Row",
+      "children": [
+        "text-25"
+      ],
+      "gap": "2",
+      "justify": "center"
+    },
+    {
+      "id": "text-25",
+      "component": "Text",
+      "textContent": "·"
+    },
+    {
+      "id": "column-26",
+      "component": "Column",
+      "children": [
+        "text-27",
+        "row-28"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "text-27",
+      "component": "Text",
+      "variant": "section",
+      "nomargin": true,
+      "textContent": "Classic Email + Password"
+    },
+    {
+      "id": "row-28",
+      "component": "Row",
+      "children": [
+        "card-29"
+      ],
+      "gap": "4",
+      "justify": "center"
+    },
+    {
+      "id": "card-29",
+      "component": "Card",
+      "children": [
+        "header-30",
+        "section-34",
+        "footer-41"
+      ]
+    },
+    {
+      "id": "header-30",
+      "component": "Header",
+      "children": [
+        "text-31",
+        "text-33"
+      ]
+    },
+    {
+      "id": "text-31",
+      "component": "Text",
+      "children": [
+        "text-32"
+      ],
+      "slot": "heading"
+    },
+    {
+      "id": "text-32",
+      "component": "Text",
+      "textContent": "Sign in"
+    },
+    {
+      "id": "text-33",
+      "component": "Text",
+      "slot": "description",
+      "color": "subtle",
+      "nomargin": true,
+      "textContent": "Enter your credentials to access your account"
+    },
+    {
+      "id": "section-34",
+      "component": "Section",
+      "children": [
+        "column-35"
+      ]
+    },
+    {
+      "id": "column-35",
+      "component": "Column",
+      "children": [
+        "input-36",
+        "input-37",
+        "row-38"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "input-36",
+      "component": "Input",
+      "label": "Email",
+      "placeholder": "you@example.com",
+      "type": "email"
+    },
+    {
+      "id": "input-37",
+      "component": "Input",
+      "label": "Password",
+      "placeholder": "••••••••",
+      "type": "password",
+      "suffix": "eye-slash"
+    },
+    {
+      "id": "row-38",
+      "component": "Row",
+      "children": [
+        "checkbox-39",
+        "text-40"
+      ],
+      "justify": "between",
+      "align": "center",
+      "size": "sm"
+    },
+    {
+      "id": "checkbox-39",
+      "component": "CheckBox",
+      "label": "Remember me"
+    },
+    {
+      "id": "text-40",
+      "component": "Text",
+      "textContent": "Forgot password?"
+    },
+    {
+      "id": "footer-41",
+      "component": "Footer",
+      "children": [
+        "column-42"
+      ]
+    },
+    {
+      "id": "column-42",
+      "component": "Column",
+      "children": [
+        "button-43",
+        "row-44"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "button-43",
+      "component": "Button",
+      "text": "Sign in",
+      "variant": "primary",
+      "stretch": true
+    },
+    {
+      "id": "row-44",
+      "component": "Row",
+      "children": [
+        "text-45",
+        "text-46"
+      ],
+      "gap": "1",
+      "justify": "center"
+    },
+    {
+      "id": "text-45",
+      "component": "Text",
+      "textContent": "New here?"
+    },
+    {
+      "id": "text-46",
+      "component": "Text",
+      "textContent": "Create an account"
+    },
+    {
+      "id": "column-47",
+      "component": "Column",
+      "children": [
+        "text-48",
+        "row-49"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "text-48",
+      "component": "Text",
+      "variant": "section",
+      "nomargin": true,
+      "textContent": "Registration"
+    },
+    {
+      "id": "row-49",
+      "component": "Row",
+      "children": [
+        "card-50"
+      ],
+      "gap": "4",
+      "justify": "center"
+    },
+    {
+      "id": "card-50",
+      "component": "Card",
+      "children": [
+        "header-51",
+        "section-55",
+        "footer-64"
+      ]
+    },
+    {
+      "id": "header-51",
+      "component": "Header",
+      "children": [
+        "text-52",
+        "text-54"
+      ]
+    },
+    {
+      "id": "text-52",
+      "component": "Text",
+      "children": [
+        "text-53"
+      ],
+      "slot": "heading"
+    },
+    {
+      "id": "text-53",
+      "component": "Text",
+      "textContent": "Create account"
+    },
+    {
+      "id": "text-54",
+      "component": "Text",
+      "slot": "description",
+      "color": "subtle",
+      "nomargin": true,
+      "textContent": "Get started for free — no credit card required"
+    },
+    {
+      "id": "section-55",
+      "component": "Section",
+      "children": [
+        "column-56"
+      ]
+    },
+    {
+      "id": "column-56",
+      "component": "Column",
+      "children": [
+        "grid-57",
+        "input-60",
+        "input-61",
+        "input-62",
+        "checkbox-63"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "grid-57",
+      "component": "Grid",
+      "children": [
+        "input-58",
+        "input-59"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "input-58",
+      "component": "Input",
+      "label": "First name",
+      "placeholder": "Jane"
+    },
+    {
+      "id": "input-59",
+      "component": "Input",
+      "label": "Last name",
+      "placeholder": "Doe"
+    },
+    {
+      "id": "input-60",
+      "component": "Input",
+      "label": "Email",
+      "placeholder": "you@example.com",
+      "type": "email"
+    },
+    {
+      "id": "input-61",
+      "component": "Input",
+      "label": "Password",
+      "placeholder": "Min. 8 characters",
+      "type": "password"
+    },
+    {
+      "id": "input-62",
+      "component": "Input",
+      "label": "Confirm password",
+      "placeholder": "Re-enter password",
+      "type": "password"
+    },
+    {
+      "id": "checkbox-63",
+      "component": "CheckBox",
+      "label": "I agree to the Terms of Service and Privacy Policy",
+      "size": "sm"
+    },
+    {
+      "id": "footer-64",
+      "component": "Footer",
+      "children": [
+        "column-65"
+      ]
+    },
+    {
+      "id": "column-65",
+      "component": "Column",
+      "children": [
+        "button-66",
+        "divider-67",
+        "grid-68",
+        "row-71"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "button-66",
+      "component": "Button",
+      "text": "Create account",
+      "variant": "primary",
+      "stretch": true
+    },
+    {
+      "id": "divider-67",
+      "component": "Divider",
+      "label": "OR"
+    },
+    {
+      "id": "grid-68",
+      "component": "Grid",
+      "children": [
+        "button-69",
+        "button-70"
+      ],
+      "gap": "2"
+    },
+    {
+      "id": "button-69",
+      "component": "Button",
+      "text": "Google",
+      "icon": "google-logo",
+      "variant": "outline",
+      "stretch": true
+    },
+    {
+      "id": "button-70",
+      "component": "Button",
+      "text": "GitHub",
+      "icon": "github-logo",
+      "variant": "outline",
+      "stretch": true
+    },
+    {
+      "id": "row-71",
+      "component": "Row",
+      "children": [
+        "text-72",
+        "text-73"
+      ],
+      "gap": "1",
+      "justify": "center"
+    },
+    {
+      "id": "text-72",
+      "component": "Text",
+      "textContent": "Already have an account?"
+    },
+    {
+      "id": "text-73",
+      "component": "Text",
+      "textContent": "Sign in"
+    },
+    {
+      "id": "column-74",
+      "component": "Column",
+      "children": [
+        "text-75",
+        "row-76"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "text-75",
+      "component": "Text",
+      "variant": "section",
+      "nomargin": true,
+      "textContent": "Social-Only Login"
+    },
+    {
+      "id": "row-76",
+      "component": "Row",
+      "children": [
+        "card-77"
+      ],
+      "gap": "4",
+      "justify": "center"
+    },
+    {
+      "id": "card-77",
+      "component": "Card",
+      "children": [
+        "section-78"
+      ]
+    },
+    {
+      "id": "section-78",
+      "component": "Section",
+      "children": [
+        "column-79"
+      ]
+    },
+    {
+      "id": "column-79",
+      "component": "Column",
+      "children": [
+        "column-80",
+        "column-84",
+        "divider-88",
+        "button-89",
+        "row-90"
+      ],
+      "gap": "5"
+    },
+    {
+      "id": "column-80",
+      "component": "Column",
+      "children": [
+        "icon-81",
+        "text-82",
+        "text-83"
+      ],
+      "gap": "2",
+      "align": "center"
+    },
+    {
+      "id": "icon-81",
+      "component": "Icon",
+      "name": "cube",
+      "size": "lg"
+    },
+    {
+      "id": "text-82",
+      "component": "Text",
+      "variant": "section",
+      "nomargin": true,
+      "textContent": "Get started"
+    },
+    {
+      "id": "text-83",
+      "component": "Text",
+      "variant": "body",
+      "color": "subtle",
+      "nomargin": true,
+      "textContent": "Choose a provider to sign in"
+    },
+    {
+      "id": "column-84",
+      "component": "Column",
+      "children": [
+        "button-85",
+        "button-86",
+        "button-87"
+      ],
+      "gap": "2"
+    },
+    {
+      "id": "button-85",
+      "component": "Button",
+      "text": "Continue with Google",
+      "icon": "google-logo",
+      "variant": "outline",
+      "stretch": true
+    },
+    {
+      "id": "button-86",
+      "component": "Button",
+      "text": "Continue with GitHub",
+      "icon": "github-logo",
+      "variant": "outline",
+      "stretch": true
+    },
+    {
+      "id": "button-87",
+      "component": "Button",
+      "text": "Continue with Apple",
+      "icon": "apple-logo",
+      "variant": "outline",
+      "stretch": true
+    },
+    {
+      "id": "divider-88",
+      "component": "Divider",
+      "label": "OR"
+    },
+    {
+      "id": "button-89",
+      "component": "Button",
+      "text": "Sign in with email",
+      "icon": "envelope",
+      "variant": "ghost",
+      "stretch": true
+    },
+    {
+      "id": "row-90",
+      "component": "Row",
+      "children": [
+        "text-91",
+        "text-92",
+        "text-93"
+      ],
+      "gap": "2",
+      "justify": "center"
+    },
+    {
+      "id": "text-91",
+      "component": "Text",
+      "textContent": "Terms of Use"
+    },
+    {
+      "id": "text-92",
+      "component": "Text",
+      "textContent": "·"
+    },
+    {
+      "id": "text-93",
+      "component": "Text",
+      "textContent": "Privacy Policy"
+    },
+    {
+      "id": "column-94",
+      "component": "Column",
+      "children": [
+        "text-95",
+        "row-96"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "text-95",
+      "component": "Text",
+      "variant": "section",
+      "nomargin": true,
+      "textContent": "Magic Link / OTP"
+    },
+    {
+      "id": "row-96",
+      "component": "Row",
+      "children": [
+        "column-97"
+      ],
+      "gap": "4",
+      "justify": "center"
+    },
+    {
+      "id": "column-97",
+      "component": "Column",
+      "children": [
+        "card-98",
+        "card-108"
+      ],
+      "gap": "4"
+    },
+    {
+      "id": "card-98",
+      "component": "Card",
+      "children": [
+        "header-99",
+        "section-103",
+        "footer-106"
+      ]
+    },
+    {
+      "id": "header-99",
+      "component": "Header",
+      "children": [
+        "text-100",
+        "text-102"
+      ]
+    },
+    {
+      "id": "text-100",
+      "component": "Text",
+      "children": [
+        "text-101"
+      ],
+      "slot": "heading"
+    },
+    {
+      "id": "text-101",
+      "component": "Text",
+      "textContent": "Sign in with email"
+    },
+    {
+      "id": "text-102",
+      "component": "Text",
+      "slot": "description",
+      "color": "subtle",
+      "nomargin": true,
+      "textContent": "We'll send you a one-time verification code"
+    },
+    {
+      "id": "section-103",
+      "component": "Section",
+      "children": [
+        "column-104"
+      ]
+    },
+    {
+      "id": "column-104",
+      "component": "Column",
+      "children": [
+        "input-105"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "input-105",
+      "component": "Input",
+      "label": "Email address",
+      "placeholder": "you@example.com",
+      "type": "email"
+    },
+    {
+      "id": "footer-106",
+      "component": "Footer",
+      "children": [
+        "button-107"
+      ]
+    },
+    {
+      "id": "button-107",
+      "component": "Button",
+      "text": "Send code",
+      "variant": "primary",
+      "stretch": true
+    },
+    {
+      "id": "card-108",
+      "component": "Card",
+      "children": [
+        "header-109",
+        "section-113",
+        "footer-119"
+      ]
+    },
+    {
+      "id": "header-109",
+      "component": "Header",
+      "children": [
+        "text-110",
+        "text-112"
+      ]
+    },
+    {
+      "id": "text-110",
+      "component": "Text",
+      "children": [
+        "text-111"
+      ],
+      "slot": "heading"
+    },
+    {
+      "id": "text-111",
+      "component": "Text",
+      "textContent": "Check your email"
+    },
+    {
+      "id": "text-112",
+      "component": "Text",
+      "slot": "description",
+      "color": "subtle",
+      "nomargin": true,
+      "textContent": "Enter the 6-digit code sent to jane@example.com"
+    },
+    {
+      "id": "section-113",
+      "component": "Section",
+      "children": [
+        "column-114"
+      ]
+    },
+    {
+      "id": "column-114",
+      "component": "Column",
+      "children": [
+        "otpinput-115",
+        "row-116"
+      ],
+      "gap": "3",
+      "align": "center"
+    },
+    {
+      "id": "otpinput-115",
+      "component": "OtpInput",
+      "length": 6
+    },
+    {
+      "id": "row-116",
+      "component": "Row",
+      "children": [
+        "text-117",
+        "text-118"
+      ],
+      "gap": "1",
+      "justify": "center"
+    },
+    {
+      "id": "text-117",
+      "component": "Text",
+      "textContent": "Didn't receive it?"
+    },
+    {
+      "id": "text-118",
+      "component": "Text",
+      "textContent": "Resend code"
+    },
+    {
+      "id": "footer-119",
+      "component": "Footer",
+      "children": [
+        "button-120"
+      ]
+    },
+    {
+      "id": "button-120",
+      "component": "Button",
+      "text": "Verify",
+      "variant": "primary",
+      "stretch": true
+    },
+    {
+      "id": "column-121",
+      "component": "Column",
+      "children": [
+        "text-122",
+        "row-123"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "text-122",
+      "component": "Text",
+      "variant": "section",
+      "nomargin": true,
+      "textContent": "Password Reset"
+    },
+    {
+      "id": "row-123",
+      "component": "Row",
+      "children": [
+        "column-124"
+      ],
+      "gap": "4",
+      "justify": "center"
+    },
+    {
+      "id": "column-124",
+      "component": "Column",
+      "children": [
+        "card-125",
+        "card-136"
+      ],
+      "gap": "4"
+    },
+    {
+      "id": "card-125",
+      "component": "Card",
+      "children": [
+        "header-126",
+        "section-130",
+        "footer-132"
+      ]
+    },
+    {
+      "id": "header-126",
+      "component": "Header",
+      "children": [
+        "text-127",
+        "text-129"
+      ]
+    },
+    {
+      "id": "text-127",
+      "component": "Text",
+      "children": [
+        "text-128"
+      ],
+      "slot": "heading"
+    },
+    {
+      "id": "text-128",
+      "component": "Text",
+      "textContent": "Reset password"
+    },
+    {
+      "id": "text-129",
+      "component": "Text",
+      "slot": "description",
+      "color": "subtle",
+      "nomargin": true,
+      "textContent": "Enter your email and we'll send you a reset link"
+    },
+    {
+      "id": "section-130",
+      "component": "Section",
+      "children": [
+        "input-131"
+      ]
+    },
+    {
+      "id": "input-131",
+      "component": "Input",
+      "label": "Email address",
+      "placeholder": "you@example.com",
+      "type": "email"
+    },
+    {
+      "id": "footer-132",
+      "component": "Footer",
+      "children": [
+        "column-133"
+      ]
+    },
+    {
+      "id": "column-133",
+      "component": "Column",
+      "children": [
+        "button-134",
+        "button-135"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "button-134",
+      "component": "Button",
+      "text": "Send reset link",
+      "variant": "primary",
+      "stretch": true
+    },
+    {
+      "id": "button-135",
+      "component": "Button",
+      "text": "Back to sign in",
+      "icon": "arrow-left",
+      "variant": "ghost",
+      "stretch": true
+    },
+    {
+      "id": "card-136",
+      "component": "Card",
+      "children": [
+        "header-137",
+        "section-141",
+        "footer-145"
+      ]
+    },
+    {
+      "id": "header-137",
+      "component": "Header",
+      "children": [
+        "text-138",
+        "text-140"
+      ]
+    },
+    {
+      "id": "text-138",
+      "component": "Text",
+      "children": [
+        "text-139"
+      ],
+      "slot": "heading"
+    },
+    {
+      "id": "text-139",
+      "component": "Text",
+      "textContent": "Set new password"
+    },
+    {
+      "id": "text-140",
+      "component": "Text",
+      "slot": "description",
+      "color": "subtle",
+      "nomargin": true,
+      "textContent": "Must be at least 8 characters"
+    },
+    {
+      "id": "section-141",
+      "component": "Section",
+      "children": [
+        "column-142"
+      ]
+    },
+    {
+      "id": "column-142",
+      "component": "Column",
+      "children": [
+        "input-143",
+        "input-144"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "input-143",
+      "component": "Input",
+      "label": "New password",
+      "placeholder": "••••••••",
+      "type": "password"
+    },
+    {
+      "id": "input-144",
+      "component": "Input",
+      "label": "Confirm new password",
+      "placeholder": "••••••••",
+      "type": "password"
+    },
+    {
+      "id": "footer-145",
+      "component": "Footer",
+      "children": [
+        "button-146"
+      ]
+    },
+    {
+      "id": "button-146",
+      "component": "Button",
+      "text": "Update password",
+      "variant": "primary",
+      "stretch": true
+    },
+    {
+      "id": "column-147",
+      "component": "Column",
+      "children": [
+        "text-148",
+        "card-149"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "text-148",
+      "component": "Text",
+      "variant": "section",
+      "nomargin": true,
+      "textContent": "Split Layout"
+    },
+    {
+      "id": "card-149",
+      "component": "Card",
+      "children": [
+        "section-150"
+      ]
+    },
+    {
+      "id": "section-150",
+      "component": "Section",
+      "children": [
+        "grid-151"
+      ]
+    },
+    {
+      "id": "grid-151",
+      "component": "Grid",
+      "children": [
+        "column-152",
+        "column-169"
+      ],
+      "columns": "2",
+      "gap": "0"
+    },
+    {
+      "id": "column-152",
+      "component": "Column",
+      "children": [
+        "row-153",
+        "column-156",
+        "column-159"
+      ],
+      "gap": "6",
+      "justify": "center"
+    },
+    {
+      "id": "row-153",
+      "component": "Row",
+      "children": [
+        "icon-154",
+        "text-155"
+      ],
+      "gap": "1",
+      "align": "center"
+    },
+    {
+      "id": "icon-154",
+      "component": "Icon",
+      "name": "cube"
+    },
+    {
+      "id": "text-155",
+      "component": "Text",
+      "variant": "label",
+      "nomargin": true,
+      "textContent": "Acme"
+    },
+    {
+      "id": "column-156",
+      "component": "Column",
+      "children": [
+        "text-157",
+        "text-158"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "text-157",
+      "component": "Text",
+      "variant": "display",
+      "nomargin": true,
+      "textContent": "Build something amazing today"
+    },
+    {
+      "id": "text-158",
+      "component": "Text",
+      "variant": "body",
+      "nomargin": true,
+      "textContent": "Join thousands of developers shipping faster with our platform."
+    },
+    {
+      "id": "column-159",
+      "component": "Column",
+      "children": [
+        "row-160",
+        "row-163",
+        "row-166"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "row-160",
+      "component": "Row",
+      "children": [
+        "icon-161",
+        "text-162"
+      ],
+      "gap": "2",
+      "align": "center"
+    },
+    {
+      "id": "icon-161",
+      "component": "Icon",
+      "name": "check-circle",
+      "color": "success"
+    },
+    {
+      "id": "text-162",
+      "component": "Text",
+      "variant": "body",
+      "textContent": "Free forever for small teams"
+    },
+    {
+      "id": "row-163",
+      "component": "Row",
+      "children": [
+        "icon-164",
+        "text-165"
+      ],
+      "gap": "2",
+      "align": "center"
+    },
+    {
+      "id": "icon-164",
+      "component": "Icon",
+      "name": "check-circle",
+      "color": "success"
+    },
+    {
+      "id": "text-165",
+      "component": "Text",
+      "variant": "body",
+      "textContent": "No credit card required"
+    },
+    {
+      "id": "row-166",
+      "component": "Row",
+      "children": [
+        "icon-167",
+        "text-168"
+      ],
+      "gap": "2",
+      "align": "center"
+    },
+    {
+      "id": "icon-167",
+      "component": "Icon",
+      "name": "check-circle",
+      "color": "success"
+    },
+    {
+      "id": "text-168",
+      "component": "Text",
+      "variant": "body",
+      "textContent": "Cancel anytime"
+    },
+    {
+      "id": "column-169",
+      "component": "Column",
+      "children": [
+        "column-170",
+        "column-174",
+        "divider-179",
+        "grid-180"
+      ],
+      "gap": "4",
+      "justify": "center"
+    },
+    {
+      "id": "column-170",
+      "component": "Column",
+      "children": [
+        "text-171",
+        "text-172"
+      ],
+      "gap": "1"
+    },
+    {
+      "id": "text-171",
+      "component": "Text",
+      "variant": "section",
+      "nomargin": true,
+      "textContent": "Create your account"
+    },
+    {
+      "id": "text-172",
+      "component": "Text",
+      "children": [
+        "text-173"
+      ],
+      "color": "subtle",
+      "nomargin": true,
+      "textContent": "Already have one?"
+    },
+    {
+      "id": "text-173",
+      "component": "Text",
+      "textContent": "Sign in"
+    },
+    {
+      "id": "column-174",
+      "component": "Column",
+      "children": [
+        "input-175",
+        "input-176",
+        "input-177",
+        "button-178"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "input-175",
+      "component": "Input",
+      "label": "Full name",
+      "placeholder": "Jane Doe"
+    },
+    {
+      "id": "input-176",
+      "component": "Input",
+      "label": "Work email",
+      "placeholder": "jane@company.com",
+      "type": "email"
+    },
+    {
+      "id": "input-177",
+      "component": "Input",
+      "label": "Password",
+      "placeholder": "Min. 8 characters",
+      "type": "password"
+    },
+    {
+      "id": "button-178",
+      "component": "Button",
+      "text": "Get started",
+      "variant": "primary",
+      "stretch": true
+    },
+    {
+      "id": "divider-179",
+      "component": "Divider",
+      "label": "OR"
+    },
+    {
+      "id": "grid-180",
+      "component": "Grid",
+      "children": [
+        "button-181",
+        "button-182"
+      ],
+      "gap": "2"
+    },
+    {
+      "id": "button-181",
+      "component": "Button",
+      "text": "Google",
+      "icon": "google-logo",
+      "variant": "outline",
+      "stretch": true
+    },
+    {
+      "id": "button-182",
+      "component": "Button",
+      "text": "GitHub",
+      "icon": "github-logo",
+      "variant": "outline",
+      "stretch": true
+    },
+    {
+      "id": "column-183",
+      "component": "Column",
+      "children": [
+        "text-184",
+        "row-185"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "text-184",
+      "component": "Text",
+      "variant": "section",
+      "nomargin": true,
+      "textContent": "Compact Card Login"
+    },
+    {
+      "id": "row-185",
+      "component": "Row",
+      "children": [
+        "card-186"
+      ],
+      "gap": "4",
+      "justify": "center"
+    },
+    {
+      "id": "card-186",
+      "component": "Card",
+      "children": [
+        "section-187"
+      ],
+      "elevation": 2,
+      "density": "compact"
+    },
+    {
+      "id": "section-187",
+      "component": "Section",
+      "children": [
+        "column-188"
+      ]
+    },
+    {
+      "id": "column-188",
+      "component": "Column",
+      "children": [
+        "column-189",
+        "input-192",
+        "input-193",
+        "button-194",
+        "divider-195",
+        "row-196"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "column-189",
+      "component": "Column",
+      "children": [
+        "avatar-190",
+        "text-191"
+      ],
+      "gap": "1",
+      "align": "center"
+    },
+    {
+      "id": "avatar-190",
+      "component": "Avatar",
+      "text": "A",
+      "size": "lg"
+    },
+    {
+      "id": "text-191",
+      "component": "Text",
+      "variant": "section",
+      "nomargin": true,
+      "textContent": "Sign in"
+    },
+    {
+      "id": "input-192",
+      "component": "Input",
+      "placeholder": "Email",
+      "type": "email"
+    },
+    {
+      "id": "input-193",
+      "component": "Input",
+      "placeholder": "Password",
+      "type": "password"
+    },
+    {
+      "id": "button-194",
+      "component": "Button",
+      "text": "Sign in",
+      "variant": "primary",
+      "stretch": true
+    },
+    {
+      "id": "divider-195",
+      "component": "Divider",
+      "label": "OR"
+    },
+    {
+      "id": "row-196",
+      "component": "Row",
+      "children": [
+        "button-197",
+        "button-198",
+        "button-199"
+      ],
+      "gap": "2",
+      "justify": "center"
+    },
+    {
+      "id": "button-197",
+      "component": "Button",
+      "icon": "google-logo",
+      "variant": "ghost"
+    },
+    {
+      "id": "button-198",
+      "component": "Button",
+      "icon": "github-logo",
+      "variant": "ghost"
+    },
+    {
+      "id": "button-199",
+      "component": "Button",
+      "icon": "apple-logo",
+      "variant": "ghost"
+    },
+    {
+      "id": "column-200",
+      "component": "Column",
+      "children": [
+        "text-201",
+        "row-202"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "text-201",
+      "component": "Text",
+      "variant": "section",
+      "nomargin": true,
+      "textContent": "Error States"
+    },
+    {
+      "id": "row-202",
+      "component": "Row",
+      "children": [
+        "card-203"
+      ],
+      "gap": "4",
+      "justify": "center"
+    },
+    {
+      "id": "card-203",
+      "component": "Card",
+      "children": [
+        "header-204",
+        "section-207",
+        "footer-212"
+      ]
+    },
+    {
+      "id": "header-204",
+      "component": "Header",
+      "children": [
+        "text-205"
+      ]
+    },
+    {
+      "id": "text-205",
+      "component": "Text",
+      "children": [
+        "text-206"
+      ],
+      "slot": "heading"
+    },
+    {
+      "id": "text-206",
+      "component": "Text",
+      "textContent": "Sign in"
+    },
+    {
+      "id": "section-207",
+      "component": "Section",
+      "children": [
+        "column-208"
+      ]
+    },
+    {
+      "id": "column-208",
+      "component": "Column",
+      "children": [
+        "alert-209",
+        "input-210",
+        "input-211"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "alert-209",
+      "component": "Alert",
+      "variant": "danger",
+      "size": "sm"
+    },
+    {
+      "id": "input-210",
+      "component": "Input",
+      "label": "Email",
+      "placeholder": "you@example.com",
+      "type": "email",
+      "value": "baduser@",
+      "error": "Please enter a valid email address"
+    },
+    {
+      "id": "input-211",
+      "component": "Input",
+      "label": "Password",
+      "placeholder": "••••••••",
+      "type": "password",
+      "error": "Password must be at least 8 characters"
+    },
+    {
+      "id": "footer-212",
+      "component": "Footer",
+      "children": [
+        "button-213"
+      ]
+    },
+    {
+      "id": "button-213",
+      "component": "Button",
+      "text": "Sign in",
+      "variant": "primary",
+      "stretch": true
+    },
+    {
+      "id": "column-214",
+      "component": "Column",
+      "children": [
+        "text-215",
+        "row-216"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "text-215",
+      "component": "Text",
+      "variant": "section",
+      "nomargin": true,
+      "textContent": "Loading State"
+    },
+    {
+      "id": "row-216",
+      "component": "Row",
+      "children": [
+        "card-217"
+      ],
+      "gap": "4",
+      "justify": "center"
+    },
+    {
+      "id": "card-217",
+      "component": "Card",
+      "children": [
+        "header-218",
+        "section-221",
+        "footer-225"
+      ]
+    },
+    {
+      "id": "header-218",
+      "component": "Header",
+      "children": [
+        "text-219"
+      ]
+    },
+    {
+      "id": "text-219",
+      "component": "Text",
+      "children": [
+        "text-220"
+      ],
+      "slot": "heading"
+    },
+    {
+      "id": "text-220",
+      "component": "Text",
+      "textContent": "Sign in"
+    },
+    {
+      "id": "section-221",
+      "component": "Section",
+      "children": [
+        "column-222"
+      ]
+    },
+    {
+      "id": "column-222",
+      "component": "Column",
+      "children": [
+        "input-223",
+        "input-224"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "input-223",
+      "component": "Input",
+      "label": "Email",
+      "value": "jane@example.com",
+      "type": "email",
+      "disabled": true
+    },
+    {
+      "id": "input-224",
+      "component": "Input",
+      "label": "Password",
+      "value": "••••••••",
+      "type": "password",
+      "disabled": true
+    },
+    {
+      "id": "footer-225",
+      "component": "Footer",
+      "children": [
+        "column-226"
+      ]
+    },
+    {
+      "id": "column-226",
+      "component": "Column",
+      "children": [
+        "button-227",
+        "progress-228"
+      ],
+      "gap": "3"
+    },
+    {
+      "id": "button-227",
+      "component": "Button",
+      "text": "Signing in…",
+      "variant": "primary",
+      "stretch": true,
+      "disabled": true
+    },
+    {
+      "id": "progress-228",
+      "component": "Progress",
+      "size": "sm"
+    }
+  ]
+}