From 4d4bb93c9293f65f4e0a991e1f2f075412c60ae3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Martynas=20=C5=BDilinskas?= Date: Fri, 14 Jul 2017 17:40:10 +0300 Subject: [PATCH 1/3] Fixed missing props in form. --- .../react-forms-dom/src/components/form.tsx | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/packages/react-forms-dom/src/components/form.tsx b/packages/react-forms-dom/src/components/form.tsx index 7d6baa0..f893743 100644 --- a/packages/react-forms-dom/src/components/form.tsx +++ b/packages/react-forms-dom/src/components/form.tsx @@ -43,10 +43,29 @@ export class Form extends BaseForm { this.FormStore.SubmitForm(result); } + protected GetHTMLProps(props: FormProps): {} { + const { + formId, + preventSubmitDefaultAndPropagation, + template, + formStore, + destroyOnUnmount, + forceSubmit, + disabled, + fieldsValidationType, + formValidationType, + onMount, + ...restProps + } = props; + + return restProps; + } + public render(): JSX.Element { return
{this.props.children}
; From c619d7a59533e72250a4ebf9ba182890f7854ff2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Martynas=20=C5=BDilinskas?= Date: Fri, 14 Jul 2017 18:04:17 +0300 Subject: [PATCH 2/3] Updated form props. Fixed ref error. --- .../src/abstractions/base-dom-field.tsx | 2 +- .../src/components/checkbox.tsx | 4 +--- .../react-forms-dom/src/components/email.tsx | 8 ++----- .../react-forms-dom/src/components/form.tsx | 21 +++++++++++++++++-- .../react-forms-dom/src/components/number.tsx | 8 ++----- .../src/components/password.tsx | 8 ++----- .../src/components/radio-group.tsx | 2 +- .../react-forms-dom/src/components/search.tsx | 8 ++----- .../react-forms-dom/src/components/select.tsx | 8 ++----- .../react-forms-dom/src/components/text.tsx | 4 +--- .../src/components/textarea.tsx | 4 +--- .../react-forms-dom/src/contracts/form.ts | 10 ++------- 12 files changed, 36 insertions(+), 51 deletions(-) diff --git a/packages/react-forms-dom/src/abstractions/base-dom-field.tsx b/packages/react-forms-dom/src/abstractions/base-dom-field.tsx index 545efcb..7220fd8 100644 --- a/packages/react-forms-dom/src/abstractions/base-dom-field.tsx +++ b/packages/react-forms-dom/src/abstractions/base-dom-field.tsx @@ -5,7 +5,7 @@ import { DomComponentData, DomFieldDetails } from "../contracts/field"; -import { FormProps } from "../contracts/form"; +import { FormProps } from "../components/form"; export type BaseDomFieldState = BaseFieldState; diff --git a/packages/react-forms-dom/src/components/checkbox.tsx b/packages/react-forms-dom/src/components/checkbox.tsx index 08985d2..ae068f5 100644 --- a/packages/react-forms-dom/src/components/checkbox.tsx +++ b/packages/react-forms-dom/src/components/checkbox.tsx @@ -7,9 +7,7 @@ import { FieldOnChangeCallback } from "../contracts/field"; import { HTMLElementProps } from "../contracts/field"; -import { - FormProps -} from "../contracts/form"; +import { FormProps } from "./form"; export type CheckBoxOnChangeCallback = FieldOnChangeCallback; diff --git a/packages/react-forms-dom/src/components/email.tsx b/packages/react-forms-dom/src/components/email.tsx index a649f7e..4bc0a10 100644 --- a/packages/react-forms-dom/src/components/email.tsx +++ b/packages/react-forms-dom/src/components/email.tsx @@ -4,12 +4,8 @@ import { DomFieldProps } from "../contracts/field"; import { BaseDomField, BaseDomFieldState } from "../abstractions/base-dom-field"; import { FieldOnChangeCallback } from "../contracts/field"; -import { - HTMLElementProps -} from "../contracts/field"; -import { - FormProps -} from "../contracts/form"; +import { HTMLElementProps } from "../contracts/field"; +import { FormProps } from "./form"; export type EmailOnChangeCallback = FieldOnChangeCallback; diff --git a/packages/react-forms-dom/src/components/form.tsx b/packages/react-forms-dom/src/components/form.tsx index f893743..bee3607 100644 --- a/packages/react-forms-dom/src/components/form.tsx +++ b/packages/react-forms-dom/src/components/form.tsx @@ -1,7 +1,24 @@ import * as React from "react"; import { BaseForm } from "@simplr/react-forms"; -import { FormProps } from "../contracts/form"; +import { + BaseFormProps, + FormOnSubmitCallback, + FormOnSubmitInternalCallback +} from "../contracts/form"; + +import { + FieldOnChangeCallback, + FieldOnChangeInternalCallback, + HTMLElementProps +} from "../contracts/field"; + +export interface FormProps extends BaseFormProps, HTMLElementProps { + onSubmit?: FormOnSubmitCallback & FormOnSubmitInternalCallback; + onChange?: FieldOnChangeCallback & FieldOnChangeInternalCallback; + + ref?: React.Ref
; +} export class Form extends BaseForm { public Element: HTMLFormElement | null; @@ -43,7 +60,7 @@ export class Form extends BaseForm { this.FormStore.SubmitForm(result); } - protected GetHTMLProps(props: FormProps): {} { + protected GetHTMLProps(props: BaseFormProps): {} { const { formId, preventSubmitDefaultAndPropagation, diff --git a/packages/react-forms-dom/src/components/number.tsx b/packages/react-forms-dom/src/components/number.tsx index 92017c4..8f3b512 100644 --- a/packages/react-forms-dom/src/components/number.tsx +++ b/packages/react-forms-dom/src/components/number.tsx @@ -4,12 +4,8 @@ import { DomFieldProps } from "../contracts/field"; import { BaseDomField, BaseDomFieldState } from "../abstractions/base-dom-field"; import { FieldOnChangeCallback } from "../contracts/field"; -import { - HTMLElementProps -} from "../contracts/field"; -import { - FormProps -} from "../contracts/form"; +import { HTMLElementProps } from "../contracts/field"; +import { FormProps } from "./form"; import { StringToDecimalModifier } from "@simplr/react-forms/modifiers"; export type NumberOnChangeCallback = FieldOnChangeCallback; diff --git a/packages/react-forms-dom/src/components/password.tsx b/packages/react-forms-dom/src/components/password.tsx index 92f1d58..25ce13f 100644 --- a/packages/react-forms-dom/src/components/password.tsx +++ b/packages/react-forms-dom/src/components/password.tsx @@ -4,12 +4,8 @@ import { DomFieldProps } from "../contracts/field"; import { BaseDomField, BaseDomFieldState } from "../abstractions/base-dom-field"; import { FieldOnChangeCallback } from "../contracts/field"; -import { - HTMLElementProps -} from "../contracts/field"; -import { - FormProps -} from "../contracts/form"; +import { HTMLElementProps } from "../contracts/field"; +import { FormProps } from "./form"; export type PasswordOnChangeCallback = FieldOnChangeCallback; diff --git a/packages/react-forms-dom/src/components/radio-group.tsx b/packages/react-forms-dom/src/components/radio-group.tsx index 42503ff..ebae7cf 100644 --- a/packages/react-forms-dom/src/components/radio-group.tsx +++ b/packages/react-forms-dom/src/components/radio-group.tsx @@ -3,7 +3,7 @@ import * as PropTypes from "prop-types"; import { BaseField, BaseFieldState } from "@simplr/react-forms"; import { FieldProps, FieldChildContext, FieldValue } from "@simplr/react-forms/contracts"; import { HTMLElementProps, DomFieldTemplateCallback } from "../contracts/field"; -import { FormProps } from "../contracts/form"; +import { FormProps } from "./form"; import { BaseDomField } from "../abstractions"; import { TypedRecord } from "typed-immutable-record"; diff --git a/packages/react-forms-dom/src/components/search.tsx b/packages/react-forms-dom/src/components/search.tsx index 65f0b8b..450d101 100644 --- a/packages/react-forms-dom/src/components/search.tsx +++ b/packages/react-forms-dom/src/components/search.tsx @@ -4,12 +4,8 @@ import { DomFieldProps } from "../contracts/field"; import { BaseDomField, BaseDomFieldState } from "../abstractions/base-dom-field"; import { FieldOnChangeCallback } from "../contracts/field"; -import { - HTMLElementProps -} from "../contracts/field"; -import { - FormProps -} from "../contracts/form"; +import { HTMLElementProps } from "../contracts/field"; +import { FormProps } from "./form"; export type SearchOnChangeCallback = FieldOnChangeCallback; diff --git a/packages/react-forms-dom/src/components/select.tsx b/packages/react-forms-dom/src/components/select.tsx index 082a6b2..b4f0b4d 100644 --- a/packages/react-forms-dom/src/components/select.tsx +++ b/packages/react-forms-dom/src/components/select.tsx @@ -4,12 +4,8 @@ import { DomFieldProps } from "../contracts/field"; import { BaseDomField, BaseDomFieldState } from "../abstractions/base-dom-field"; import { FieldOnChangeCallback } from "../contracts/field"; -import { - HTMLElementProps -} from "../contracts/field"; -import { - FormProps -} from "../contracts/form"; +import { HTMLElementProps } from "../contracts/field"; +import { FormProps } from "./form"; export type SelectValue = string | string[]; export type SelectOnChangeCallback = FieldOnChangeCallback; diff --git a/packages/react-forms-dom/src/components/text.tsx b/packages/react-forms-dom/src/components/text.tsx index 8134e93..2268645 100644 --- a/packages/react-forms-dom/src/components/text.tsx +++ b/packages/react-forms-dom/src/components/text.tsx @@ -9,9 +9,7 @@ import { FieldOnChangeCallback, HTMLElementProps } from "../contracts/field"; -import { - FormProps -} from "../contracts/form"; +import { FormProps } from "./form"; export type TextOnChangeCallback = FieldOnChangeCallback; diff --git a/packages/react-forms-dom/src/components/textarea.tsx b/packages/react-forms-dom/src/components/textarea.tsx index 3c87a01..ac71af5 100644 --- a/packages/react-forms-dom/src/components/textarea.tsx +++ b/packages/react-forms-dom/src/components/textarea.tsx @@ -10,9 +10,7 @@ import { FieldOnChangeCallback, HTMLElementProps } from "../contracts/field"; -import { - FormProps -} from "../contracts/form"; +import { FormProps } from "./form"; export type TextAreaOnChangeCallback = FieldOnChangeCallback; diff --git a/packages/react-forms-dom/src/contracts/form.ts b/packages/react-forms-dom/src/contracts/form.ts index ea70b04..8e98d2d 100644 --- a/packages/react-forms-dom/src/contracts/form.ts +++ b/packages/react-forms-dom/src/contracts/form.ts @@ -2,11 +2,7 @@ import * as React from "react"; import { FormError } from "@simplr/react-forms/contracts"; import { FormProps as CoreFormProps } from "@simplr/react-forms/contracts"; import { FormStore } from "@simplr/react-forms/stores"; -import { - FieldOnChangeCallback, - FieldOnChangeInternalCallback, - DomFieldTemplateCallback -} from "../contracts/field"; +import { DomFieldTemplateCallback } from "../contracts/field"; export interface FormOnSubmitInternalCallback { (event: React.FormEvent, ...parameters: any[]): void | Promise | FormError | string; @@ -16,9 +12,7 @@ export interface FormOnSubmitCallback { (event: React.FormEvent, store: FormStore): void | Promise | FormError | string; } -export interface FormProps extends CoreFormProps, React.HTMLProps { - onSubmit?: FormOnSubmitCallback & FormOnSubmitInternalCallback; - onChange?: FieldOnChangeCallback & FieldOnChangeInternalCallback; +export interface BaseFormProps extends CoreFormProps { preventSubmitDefaultAndPropagation?: boolean; template?: DomFieldTemplateCallback; // tslint:disable-next-line:max-line-length From c98e19480aff65807314c44b2794c62b3f57150a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Martynas=20=C5=BDilinskas?= Date: Fri, 14 Jul 2017 18:20:09 +0300 Subject: [PATCH 3/3] Fixed base-dom-field import. --- packages/react-forms-dom/src/abstractions/base-dom-field.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/react-forms-dom/src/abstractions/base-dom-field.tsx b/packages/react-forms-dom/src/abstractions/base-dom-field.tsx index 7220fd8..26862d6 100644 --- a/packages/react-forms-dom/src/abstractions/base-dom-field.tsx +++ b/packages/react-forms-dom/src/abstractions/base-dom-field.tsx @@ -5,7 +5,7 @@ import { DomComponentData, DomFieldDetails } from "../contracts/field"; -import { FormProps } from "../components/form"; +import { BaseFormProps } from "../contracts/form"; export type BaseDomFieldState = BaseFieldState; @@ -31,7 +31,7 @@ export abstract class BaseDomField