astro-reactive-form/demo/src/pages/index.astro

45 lines
847 B
Text

---
import { FormGroup, Submit } from 'astro-reactive-form/core';
import Form from 'astro-reactive-form';
const form = new FormGroup([
{
name: 'username',
label: 'Username',
},
{
name: 'password',
label: 'Password',
type: 'password',
},
]);
form.name = 'Simple Form';
form.controls.push({
type: 'checkbox',
name: 'is-awesome',
label: 'is Awesome?',
});
form.controls.push({
type: 'submit',
name: 'submit',
value: 'Submit',
callBack: () => console.log('hey'),
} as Submit);
---
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>Astro</title>
</head>
<body>
<h1>Astro Reactive Form</h1>
<Form formGroups={[form]} />
</body>
</html>