Add atoms SubmitButton

Author: wintondeshong

src/atoms/forms/submit-button.stories.tsx

@@ -0,0 +1,12 @@
+import { SubmitButton } from "./submit-button";
+import { text } from "@storybook/addon-knobs";
+import React from "react";
+
+export default {
+    component: SubmitButton,
+    title: "Atoms | Forms / Submit Button",
+};
+
+export const submitButtonKnobs = () => (
+    <SubmitButton buttonText={text("Button Text", "Submit")} />
+);

src/atoms/forms/submit-button.test.tsx

@@ -0,0 +1,5 @@
+import React from "react";
+
+describe("SubmitButton", () => {
+    test.skip("TODO - https://github.com/AndcultureCode/AndcultureCode.JavaScript.React.Components/issues/8", () => {});
+});

src/atoms/forms/submit-button.tsx

@@ -0,0 +1,45 @@
+import React from "react";
+
+// -----------------------------------------------------------------------------------------
+// #region Interfaces
+// -----------------------------------------------------------------------------------------
+
+export interface SubmitButtonProps {
+    buttonText?: string;
+    cssClassName?: string;
+
+    /**
+     * Typically you do not need this, but using it can allow you to
+     * place the button outside of the form for styling purposes.
+     */
+    formId?: string;
+}
+
+// #endregion Interfaces
+
+// -----------------------------------------------------------------------------------------
+// #region Component
+// -----------------------------------------------------------------------------------------
+
+const SubmitButton: React.FC<SubmitButtonProps> = (
+    props: SubmitButtonProps
+) => {
+    return (
+        <input
+            className={props.cssClassName || "c-button"}
+            form={props.formId}
+            type="submit"
+            value={props.buttonText || "Submit"}
+        />
+    );
+};
+
+// #endregion Component
+
+// -----------------------------------------------------------------------------------------
+// #region Export
+// -----------------------------------------------------------------------------------------
+
+export { SubmitButton };
+
+// #endregion Export

src/index.ts

@@ -10,6 +10,7 @@ export { Button } from "./atoms/buttons/button";
 export { CheckboxButton } from "./atoms/forms/checkbox-button";
 export { CheckboxInput } from "./atoms/forms/checkbox-input";
 export { PasswordInput } from "./atoms/forms/password-input";
+export { SubmitButton } from "./atoms/forms/submit-button";
 
 // Icons
 export { Icon } from "./atoms/icons/icon";