Introduce additionalButtonRenderers prop for Form component (#36)

* Introduce `additionalButtonRenderers` prop for Form component
mapp-digital · Sep 23, 2019 · b411667 · b411667
1 parent 75aac29
commit b411667
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 3 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/form/form.tsx b/src/form/form.tsx
@@ -77,6 +77,13 @@ interface ValidationOptions {
 
 type ViolationMessageResolver = (key: string, context: object | null) => string;
 
+interface FormButtonProps {
+    key: number;
+    isSubmitting: boolean;
+    isDirty: boolean;
+    isValid: boolean;
+}
+
 interface Props<MODEL> {
     model: MODEL;
     onCancel?: () => void;
@@ -88,6 +95,7 @@ interface Props<MODEL> {
     validationSchema?: any;
     validationOptions?: ValidationOptions;
     resolveViolationMessage?: ViolationMessageResolver;
+    additionalButtonRenderers?: Array<(buttonProps: FormButtonProps) => React.ReactNode>;
 }
 
 interface State<MODEL> {
@@ -143,6 +151,16 @@ class Form<MODEL extends object> extends React.Component<Props<MODEL>, State<MOD
                     <div className="col-xs-12">
                         {this.props.onCancel && this.getCancelButton()}
 
+                        {this.props.additionalButtonRenderers &&
+                            this.props.additionalButtonRenderers.map((buttonRenderer, index) =>
+                                buttonRenderer({
+                                    key: index,
+                                    isSubmitting: this.state.isSubmitting,
+                                    isDirty: this.state.isDirty,
+                                    isValid: this.state.isValid,
+                                })
+                            )}
+
                         <Button
                             id="submit"
                             text={this.props.submitButtonText}
@@ -466,4 +484,4 @@ class Form<MODEL extends object> extends React.Component<Props<MODEL>, State<MOD
     }
 }
 
-export { Form, SectionType, FieldType, FieldContext, ViolationMessageResolver };
+export { Form, SectionType, FieldType, FieldContext, ViolationMessageResolver, FormButtonProps };
diff --git a/src/form/index.tsx b/src/form/index.tsx
@@ -1,3 +1,3 @@
-export { FieldContext, FieldType, Form, SectionType } from './form';
+export { FormButtonProps, FieldContext, FieldType, Form, SectionType } from './form';
 export { FormField } from './form-field';
 export { Editor, Field } from './types';