diff --git a/demo/src/pages/index.astro b/demo/src/pages/index.astro
index 2326b96..b481ea5 100644
--- a/demo/src/pages/index.astro
+++ b/demo/src/pages/index.astro
@@ -6,7 +6,7 @@ const form = new FormGroup([
   {
     name: "username",
     label: "Username",
-    placeholder: "astroIscool"
+    placeholder: "astroIscool",
   },
   {
     name: "password",
@@ -45,6 +45,12 @@ form.get("is-awesome")?.setValue("checked");
   </head>
   <body>
     <h1>Astro Reactive Form</h1>
-    <Form formGroups={[form]} />
+    <Form
+      submitControl={{
+        type: "submit",
+        name: "what",
+      }}
+      formGroups={[form]}
+    />
   </body>
 </html>
diff --git a/packages/astro-reactive-form/Form.astro b/packages/astro-reactive-form/Form.astro
index 53e60fc..434e765 100644
--- a/packages/astro-reactive-form/Form.astro
+++ b/packages/astro-reactive-form/Form.astro
@@ -1,18 +1,19 @@
 ---
-import type { FormControl, FormGroup } from './core';
+import { Submit, FormGroup, FormControl } from './core';
 import Field from './components/Field.astro';
 import FieldSet from './components/FieldSet.astro';
 
 export interface Props {
-	submitControl?: FormControl;
+	submitControl?: Submit;
 	formGroups: FormGroup[];
 }
 
 const { submitControl, formGroups } = Astro.props;
 ---
+
 <form class="light">
 	{formGroups?.map((group) => <FieldSet group={group} />)}
-	{submitControl && (<Field control={submitControl} />)}
+	{submitControl && <Field control={new FormControl(submitControl)} />}
 </form>
 
 <style>
diff --git a/packages/astro-reactive-form/core/form-control-types.ts b/packages/astro-reactive-form/core/form-control-types.ts
index b082779..e9eebf3 100644
--- a/packages/astro-reactive-form/core/form-control-types.ts
+++ b/packages/astro-reactive-form/core/form-control-types.ts
@@ -46,10 +46,10 @@ export interface Radio extends FormControlBase {
 
 export interface Submit extends FormControlBase {
 	type: 'submit';
-	callBack: () => void;
+	callBack?: () => void;
 }
 
 export interface Button extends FormControlBase {
 	type: 'button';
-	callBack: () => void;
+	callBack?: () => void;
 }
diff --git a/packages/astro-reactive-form/core/index.ts b/packages/astro-reactive-form/core/index.ts
index cb076a1..3a0aa87 100644
--- a/packages/astro-reactive-form/core/index.ts
+++ b/packages/astro-reactive-form/core/index.ts
@@ -1,2 +1,3 @@
 export * from './form-control';
 export * from './form-group';
+export * from './form-control-types';
