fix: Form Props are Now Complete

We were missing the HTML attributes and more from the Form component,
so things like `onClick` weren't being recognized.

src/Form/Form.story.tsx

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { FormEvent } from "react";
 import {
   Alert,
   Input,
@@ -13,6 +13,7 @@ import {
   ListItem,
   Select,
   Text,
+  Button,
 } from "../index";
 
 const options = [
@@ -162,3 +163,16 @@ export const DemoForm = () => (
 DemoForm.story = {
   name: "Demo form",
 };
+
+export const WithAnAction = () => {
+  function handleSubmit(event: FormEvent<HTMLFormElement>) {
+    event.preventDefault();
+    alert("Hello!");
+  }
+
+  return (
+    <Form onSubmit={handleSubmit}>
+      <Button type="submit">Click me</Button>
+    </Form>
+  );
+};

src/Form/Form.tsx

@@ -1,24 +1,20 @@
-import React from "react";
+import * as React from "react";
 import styled from "styled-components";
-import { space, SpaceProps } from "styled-system";
+import { space } from "styled-system";
+import type { SpaceProps } from "styled-system";
 import { Heading2 } from "../Type";
 import { Alert } from "../Alert";
-import { ThemeType } from "../theme.type";
+import type { ThemeType } from "../theme.type";
 import Field from "./Field";
 import Fieldset from "./Fieldset";
 import FormSection from "./FormSection";
 
-type FormProps = SpaceProps & {
-  title?: string;
-  children: React.ReactNode;
-  style?: React.CSSProperties;
-  id?: string;
-};
+interface FormProps extends SpaceProps, React.HTMLProps<HTMLFormElement> {}
 
-type FormStylesProps = {
-  title?: string;
+interface FormStylesProps {
+  title?: FormProps["title"];
   theme: ThemeType;
-};
+}
 
 const FormStyles = ({ title, theme }: FormStylesProps) => ({
   width: "100%",