Library · Forms & CTAs

Forms & CTAs / Register Interest

Property register-interest lead-capture — contact + development/stage/lot fields + a required privacy-consent checkbox. Native + attribute validation; a progressive script gates submit on the tested isSubmitAllowed/isValidEmail helpers. Tone via the shared contract.

Figma: Forms & CTAs / Register Interest ↗

Live preview — edit theme bottom-right

---
import PropertyRegisterInterest from "../components/figma/PropertyRegisterInterest.astro";
---
<PropertyRegisterInterest
  action="/register-interest"
  heading="Register your interest"
  blurb="Join the priority list for Riverside Residences and be first to access new releases."
  developments={["Riverside Residences", "Parkview Terraces"]}
  stages={["Stage 1", "Stage 2", "Stage 3"]}
  tone="base-200"
/>

Props

Name	Type	Required	Description
`action`	`string;`	Yes	Form submit URL
`heading`	`string;`	—	Heading (default: 'Register your interest')
`blurb`	`string;`	—	Optional supporting line
`developments`	`string[];`	—	Optional development options for the select (omit to hide the field)
`stages`	`string[];`	—	Optional stage options (omit to hide the field)
`consentText`	`string;`	—	Consent line shown beside the required checkbox
`tone`	`"base-100" \| "base-200" \| "base-300" \| "primary" \| "secondary" \| "neutral";`	—	Background tone — the Figma colour-variant axis

Example with all props

<PropertyRegisterInterest
  action="/register-interest"
  heading="Register your interest"
  developments={["Riverside Residences", "Parkview Terraces"]}
  stages={["Stage 1", "Stage 2"]}
/>