From 70599b48bfa7b1580ba7a2c2e974393c2581e57d Mon Sep 17 00:00:00 2001
From: Ayo <ramon.aycojr@gmail.com>
Date: Sun, 25 Sep 2022 21:25:09 +0200
Subject: [PATCH] feat: initial FormControl, FormGroup, Form.astro

---
 index.ts            |  3 +++
 package.json        | 15 ++++++++++++---
 src/Component.astro |  3 ---
 src/Form.astro      |  8 ++++++++
 src/form-control.ts |  6 ++++++
 src/form-group.ts   |  9 +++++++++
 src/index.ts        |  3 +++
 src/main.ts         |  1 -
 8 files changed, 41 insertions(+), 7 deletions(-)
 delete mode 100644 src/Component.astro
 create mode 100644 src/Form.astro
 create mode 100644 src/form-control.ts
 create mode 100644 src/form-group.ts
 create mode 100644 src/index.ts
 delete mode 100644 src/main.ts

diff --git a/index.ts b/index.ts
index 6c2a154..1eeb73c 100644
--- a/index.ts
+++ b/index.ts
@@ -3,3 +3,6 @@
 // What you should do here is re-exports all the things you want your user to access, ex:
 // export { HelloWorld } from "./src/main.ts"
 // export type { HelloWorldResult } from "./src/types.ts"
+import Form from './src/Form.astro';
+export default Form;
+export {FormGroup, FormControl} from './src/index';
diff --git a/package.json b/package.json
index 1e4fdea..c545ae8 100644
--- a/package.json
+++ b/package.json
@@ -1,16 +1,25 @@
 {
-  "name": "astro-component-name",
-  "version": "0.1.0",
+  "name": "astro-reactive-form",
+  "version": "0.0.0",
+  "repository": "https://github.com/ayoayco/astro-reactive-form",
+  "homepage": "https://github.com/ayoayco/astro-reactive-form",
   "type": "module",
   "exports": {
     ".": "./index.ts"
   },
+  "author": {
+    "name": "Ayo Ayco",
+    "email": "ramon.aycojr@gmail.com",
+    "url": "https://ayco.io"
+  },
   "files": [
     "src",
     "index.ts"
   ],
   "keywords": [
-    "astro-component"
+    "astro-component",
+    "css",
+    "ui"
   ],
   "scripts": {
     "test": "mocha --parallel --timeout 15000",
diff --git a/src/Component.astro b/src/Component.astro
deleted file mode 100644
index 1057d4e..0000000
--- a/src/Component.astro
+++ /dev/null
@@ -1,3 +0,0 @@
----
-// Write your component code in this file!
----
diff --git a/src/Form.astro b/src/Form.astro
new file mode 100644
index 0000000..0b69975
--- /dev/null
+++ b/src/Form.astro
@@ -0,0 +1,8 @@
+---
+import {FormGroup} from './form-group';
+const form: FormGroup = Astro.props.formGroup;
+---
+<form>
+  <label>{form.controls[0].label}</label>
+	<input type={form.controls[0].type} value={form.controls[0].value} />
+</form>
diff --git a/src/form-control.ts b/src/form-control.ts
new file mode 100644
index 0000000..a649952
--- /dev/null
+++ b/src/form-control.ts
@@ -0,0 +1,6 @@
+export class FormControl {
+	name: string;
+  type?: 'text' | 'checkbox' | 'radio' = 'text'; // add more
+  value?: string | number | null | string[];
+	label?: string;
+}
diff --git a/src/form-group.ts b/src/form-group.ts
new file mode 100644
index 0000000..6a04f09
--- /dev/null
+++ b/src/form-group.ts
@@ -0,0 +1,9 @@
+import { FormControl } from "./form-control";
+
+export class FormGroup {
+  controls: FormControl[];
+
+  constructor(controls: FormControl[]) {
+    this.controls = controls;
+  }
+}
diff --git a/src/index.ts b/src/index.ts
new file mode 100644
index 0000000..819beea
--- /dev/null
+++ b/src/index.ts
@@ -0,0 +1,3 @@
+export * from './Form.astro';
+export * from './form-group';
+export * from './form-control';
diff --git a/src/main.ts b/src/main.ts
deleted file mode 100644
index 6cf78f3..0000000
--- a/src/main.ts
+++ /dev/null
@@ -1 +0,0 @@
-// Write your component's code here!