Skip to content

feat(types,core): interactive form content type #126

@perasperaactual

Description

@perasperaactual

Problem

There are zero interactive/input components. `contact_form_stub` renders a mailto link — it's not a form. The component library can only build brochure sites. For the "Day 365: hybrid YAML + custom React" trajectory, and for a compelling hackathon demo, the framework needs at least basic data collection capability.

Proposed approach

Add a `form` content type that renders a configurable form with typed fields:

```yaml

  • form:
    label: "Contact Us"
    heading: { text: "Get in Touch", textSize: h2 }
    action: "https://formspree.io/f/xxxxx" # or mailto: or custom endpoint
    method: POST
    fields:
    - { name: "name", type: "text", label: "Your Name", required: true }
    - { name: "email", type: "email", label: "Email", required: true }
    - { name: "message", type: "textarea", label: "Message", required: false }
    - { name: "plan", type: "select", label: "Plan", options: ["Starter", "Pro", "Enterprise"] }
    submit_text: "Send Message"
    success_message: "Thanks! We'll be in touch."
    ```

Design constraints

  • No backend required. Forms submit to an external endpoint (Formspree, Netlify Forms, custom URL) or use `mailto:`. Stackwright stays static.
  • Schema-validated fields. Field types are a closed enum: `text`, `email`, `textarea`, `select`, `checkbox`. No arbitrary HTML.
  • Client-side validation only. Required fields, email format, etc. No custom validation logic in YAML.
  • Deprecates `contact_form_stub`. The new `form` type is a superset. Mark `contact_form_stub` as deprecated.

Acceptance criteria

  • Zod schema for `form` content type with typed field definitions
  • Core component renders accessible HTML form with proper labels and validation
  • Supports external action URLs (Formspree, etc.)
  • Client-side required field validation
  • Success/error state handling
  • Responsive layout (fields stack on mobile)
  • Unit tests
  • E2E test with form rendering (submission not required)
  • AGENTS.md tables regenerated
  • MCP screenshots include form preview

Metadata

Metadata

Assignees

No one assigned

    Labels

    priority:laterPlanned but not yet committed

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions