From 895130a2d89c709bf96e10473ffc1a8c375fa00b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rados=C5=82aw=20Miernik?= Date: Sat, 6 Jun 2020 11:23:28 +0200 Subject: [PATCH 01/13] Added kind option to connectField. --- packages/uniforms-unstyled/src/AutoField.tsx | 8 +++++--- packages/uniforms-unstyled/src/TextField.tsx | 2 +- packages/uniforms/src/connectField.tsx | 11 +++++++++-- 3 files changed, 15 insertions(+), 6 deletions(-) diff --git a/packages/uniforms-unstyled/src/AutoField.tsx b/packages/uniforms-unstyled/src/AutoField.tsx index 803335feb..b27f6dfe9 100644 --- a/packages/uniforms-unstyled/src/AutoField.tsx +++ b/packages/uniforms-unstyled/src/AutoField.tsx @@ -1,6 +1,6 @@ import invariant from 'invariant'; import { ComponentType, createElement } from 'react'; -import { Override, useField } from 'uniforms'; +import { Override, connectField, useField } from 'uniforms'; import BoolField from './BoolField'; import DateField from './DateField'; @@ -14,7 +14,7 @@ import TextField from './TextField'; export type AutoFieldProps = Override< Record, { - component?: ComponentType; + component?: ComponentType | ReturnType; name: string; } >; @@ -57,5 +57,7 @@ export default function AutoField(originalProps: AutoFieldProps) { } } - return createElement(component, originalProps); + return 'options' in component && component.options?.kind === 'leaf' + ? createElement(component.Component, props) + : createElement(component, originalProps); } diff --git a/packages/uniforms-unstyled/src/TextField.tsx b/packages/uniforms-unstyled/src/TextField.tsx index a087a0431..ad5e08043 100644 --- a/packages/uniforms-unstyled/src/TextField.tsx +++ b/packages/uniforms-unstyled/src/TextField.tsx @@ -48,4 +48,4 @@ function Text({ Text.defaultProps = { type: 'text' }; -export default connectField(Text); +export default connectField(Text, { kind: 'leaf' }); diff --git a/packages/uniforms/src/connectField.tsx b/packages/uniforms/src/connectField.tsx index 17e4184c2..135a37345 100644 --- a/packages/uniforms/src/connectField.tsx +++ b/packages/uniforms/src/connectField.tsx @@ -11,7 +11,11 @@ export function connectField< Value = Props['value'] >( Component: ComponentType, - options?: { includeInChain?: boolean; initialValue?: boolean }, + options?: { + includeInChain?: boolean; + initialValue?: boolean; + kind?: 'leaf' | 'node'; + }, ) { type FieldProps = Override< Props, @@ -58,5 +62,8 @@ export function connectField< Field.displayName = `${Component.displayName || Component.name}Field`; - return Field as FunctionComponent; + return Object.assign(Field as FunctionComponent, { + Component, + options, + }); } From 5adbe7f46d4f5a4493b98572169df2b4365f002b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rados=C5=82aw=20Miernik?= Date: Wed, 10 Jun 2020 13:26:39 +0200 Subject: [PATCH 02/13] Marked unstyled fields as leafs. --- .../uniforms-unstyled/__tests__/AutoField.tsx | 32 +++++++++---------- packages/uniforms-unstyled/src/BoolField.tsx | 2 +- packages/uniforms-unstyled/src/DateField.tsx | 2 +- .../uniforms-unstyled/src/ListAddField.tsx | 2 +- .../uniforms-unstyled/src/ListDelField.tsx | 2 +- .../uniforms-unstyled/src/LongTextField.tsx | 2 +- packages/uniforms-unstyled/src/NumField.tsx | 2 +- packages/uniforms-unstyled/src/RadioField.tsx | 2 +- .../uniforms-unstyled/src/SelectField.tsx | 2 +- 9 files changed, 24 insertions(+), 24 deletions(-) diff --git a/packages/uniforms-unstyled/__tests__/AutoField.tsx b/packages/uniforms-unstyled/__tests__/AutoField.tsx index 71572285a..782325fef 100644 --- a/packages/uniforms-unstyled/__tests__/AutoField.tsx +++ b/packages/uniforms-unstyled/__tests__/AutoField.tsx @@ -21,7 +21,7 @@ test(' - works', () => { expect(wrapper.find(AutoField)).toHaveLength(1); }); -test(' - renders RadioField', () => { +test(' - detects RadioField', () => { const element = ; const wrapper = mount( element, @@ -34,10 +34,10 @@ test(' - renders RadioField', () => { }), ); - expect(wrapper.find(RadioField)).toHaveLength(1); + expect(wrapper.find(RadioField.Component)).toHaveLength(1); }); -test(' - renders SelectField', () => { +test(' - detects SelectField', () => { const element = ; const wrapper = mount( element, @@ -47,17 +47,17 @@ test(' - renders SelectField', () => { }), ); - expect(wrapper.find(SelectField)).toHaveLength(1); + expect(wrapper.find(SelectField.Component)).toHaveLength(1); }); -test(' - renders DateField', () => { +test(' - detects DateField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Date } })); - expect(wrapper.find(DateField)).toHaveLength(1); + expect(wrapper.find(DateField.Component)).toHaveLength(1); }); -test(' - renders ListField', () => { +test(' - detects ListField', () => { const element = ; const wrapper = mount( element, @@ -67,35 +67,35 @@ test(' - renders ListField', () => { expect(wrapper.find(ListField)).toHaveLength(1); }); -test(' - renders NumField', () => { +test(' - detects NumField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Number } })); - expect(wrapper.find(NumField)).toHaveLength(1); + expect(wrapper.find(NumField.Component)).toHaveLength(1); }); -test(' - renders NestField', () => { +test(' - detects NestField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Object } })); expect(wrapper.find(NestField)).toHaveLength(1); }); -test(' - renders TextField', () => { +test(' - detects TextField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: String } })); - expect(wrapper.find(TextField)).toHaveLength(1); + expect(wrapper.find(TextField.Component)).toHaveLength(1); }); -test(' - renders BoolField', () => { +test(' - detects BoolField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Boolean } })); - expect(wrapper.find(BoolField)).toHaveLength(1); + expect(wrapper.find(BoolField.Component)).toHaveLength(1); }); -test(' - renders Component (model)', () => { +test(' - uses Component (schema)', () => { const Component = jest.fn(() => null); const element = ; @@ -107,7 +107,7 @@ test(' - renders Component (model)', () => { expect(Component).toHaveBeenCalledTimes(1); }); -test(' - renders Component (specified)', () => { +test(' - uses Component (props)', () => { const Component = jest.fn(() => null); const element = ; diff --git a/packages/uniforms-unstyled/src/BoolField.tsx b/packages/uniforms-unstyled/src/BoolField.tsx index 508f4db63..e9d60927c 100644 --- a/packages/uniforms-unstyled/src/BoolField.tsx +++ b/packages/uniforms-unstyled/src/BoolField.tsx @@ -47,4 +47,4 @@ function Bool({ ); } -export default connectField(Bool); +export default connectField(Bool, { kind: 'leaf' }); diff --git a/packages/uniforms-unstyled/src/DateField.tsx b/packages/uniforms-unstyled/src/DateField.tsx index 72ff7dd0b..eb7852834 100644 --- a/packages/uniforms-unstyled/src/DateField.tsx +++ b/packages/uniforms-unstyled/src/DateField.tsx @@ -60,4 +60,4 @@ function Date({ ); } -export default connectField(Date); +export default connectField(Date, { kind: 'leaf' }); diff --git a/packages/uniforms-unstyled/src/ListAddField.tsx b/packages/uniforms-unstyled/src/ListAddField.tsx index 7de17c4d6..ae7f59322 100644 --- a/packages/uniforms-unstyled/src/ListAddField.tsx +++ b/packages/uniforms-unstyled/src/ListAddField.tsx @@ -39,4 +39,4 @@ function ListAdd({ disabled, name, value, ...props }: ListAddFieldProps) { ); } -export default connectField(ListAdd, { initialValue: false }); +export default connectField(ListAdd, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-unstyled/src/ListDelField.tsx b/packages/uniforms-unstyled/src/ListDelField.tsx index fb4839be7..d23f3e581 100644 --- a/packages/uniforms-unstyled/src/ListDelField.tsx +++ b/packages/uniforms-unstyled/src/ListDelField.tsx @@ -41,4 +41,4 @@ function ListDel({ disabled, name, ...props }: ListDelFieldProps) { ); } -export default connectField(ListDel, { initialValue: false }); +export default connectField(ListDel, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-unstyled/src/LongTextField.tsx b/packages/uniforms-unstyled/src/LongTextField.tsx index 322a1836b..adfdfacc1 100644 --- a/packages/uniforms-unstyled/src/LongTextField.tsx +++ b/packages/uniforms-unstyled/src/LongTextField.tsx @@ -44,4 +44,4 @@ function LongText({ ); } -export default connectField(LongText); +export default connectField(LongText, { kind: 'leaf' }); diff --git a/packages/uniforms-unstyled/src/NumField.tsx b/packages/uniforms-unstyled/src/NumField.tsx index 26fb28d72..967b59216 100644 --- a/packages/uniforms-unstyled/src/NumField.tsx +++ b/packages/uniforms-unstyled/src/NumField.tsx @@ -59,4 +59,4 @@ function Num({ ); } -export default connectField(Num); +export default connectField(Num, { kind: 'leaf' }); diff --git a/packages/uniforms-unstyled/src/RadioField.tsx b/packages/uniforms-unstyled/src/RadioField.tsx index 5f375b78a..0880a17f5 100644 --- a/packages/uniforms-unstyled/src/RadioField.tsx +++ b/packages/uniforms-unstyled/src/RadioField.tsx @@ -53,4 +53,4 @@ function Radio({ ); } -export default connectField(Radio); +export default connectField(Radio, { kind: 'leaf' }); diff --git a/packages/uniforms-unstyled/src/SelectField.tsx b/packages/uniforms-unstyled/src/SelectField.tsx index bdcc05020..3ea759eeb 100644 --- a/packages/uniforms-unstyled/src/SelectField.tsx +++ b/packages/uniforms-unstyled/src/SelectField.tsx @@ -95,4 +95,4 @@ function Select({ ); } -export default connectField(Select); +export default connectField(Select, { kind: 'leaf' }); From e719d3f13f381244a3128d8c26d429f12ad5ad0e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rados=C5=82aw=20Miernik?= Date: Wed, 17 Jun 2020 12:26:03 +0200 Subject: [PATCH 03/13] Marked antd fields as leafs. --- .../uniforms-antd/__tests__/AutoField.tsx | 32 +++++++++---------- packages/uniforms-antd/src/AutoField.tsx | 8 +++-- packages/uniforms-antd/src/BoolField.tsx | 2 +- packages/uniforms-antd/src/DateField.tsx | 2 +- packages/uniforms-antd/src/ListAddField.tsx | 2 +- packages/uniforms-antd/src/ListDelField.tsx | 2 +- packages/uniforms-antd/src/LongTextField.tsx | 2 +- packages/uniforms-antd/src/NumField.tsx | 2 +- packages/uniforms-antd/src/RadioField.tsx | 2 +- packages/uniforms-antd/src/SelectField.tsx | 2 +- packages/uniforms-antd/src/TextField.tsx | 2 +- 11 files changed, 30 insertions(+), 28 deletions(-) diff --git a/packages/uniforms-antd/__tests__/AutoField.tsx b/packages/uniforms-antd/__tests__/AutoField.tsx index 4fb0cc16c..d36f391a1 100644 --- a/packages/uniforms-antd/__tests__/AutoField.tsx +++ b/packages/uniforms-antd/__tests__/AutoField.tsx @@ -21,7 +21,7 @@ test(' - works', () => { expect(wrapper.find(AutoField)).toHaveLength(1); }); -test(' - renders RadioField', () => { +test(' - detects RadioField', () => { const element = ; const wrapper = mount( element, @@ -34,10 +34,10 @@ test(' - renders RadioField', () => { }), ); - expect(wrapper.find(RadioField)).toHaveLength(1); + expect(wrapper.find(RadioField.Component)).toHaveLength(1); }); -test(' - renders SelectField', () => { +test(' - detects SelectField', () => { const element = ; const wrapper = mount( element, @@ -47,17 +47,17 @@ test(' - renders SelectField', () => { }), ); - expect(wrapper.find(SelectField)).toHaveLength(1); + expect(wrapper.find(SelectField.Component)).toHaveLength(1); }); -test(' - renders DateField', () => { +test(' - detects DateField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Date } })); - expect(wrapper.find(DateField)).toHaveLength(1); + expect(wrapper.find(DateField.Component)).toHaveLength(1); }); -test(' - renders ListField', () => { +test(' - detects ListField', () => { const element = ; const wrapper = mount( element, @@ -67,35 +67,35 @@ test(' - renders ListField', () => { expect(wrapper.find(ListField)).toHaveLength(1); }); -test(' - renders NumField', () => { +test(' - detects NumField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Number } })); - expect(wrapper.find(NumField)).toHaveLength(1); + expect(wrapper.find(NumField.Component)).toHaveLength(1); }); -test(' - renders NestField', () => { +test(' - detects NestField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Object } })); expect(wrapper.find(NestField)).toHaveLength(1); }); -test(' - renders TextField', () => { +test(' - detects TextField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: String } })); - expect(wrapper.find(TextField)).toHaveLength(1); + expect(wrapper.find(TextField.Component)).toHaveLength(1); }); -test(' - renders BoolField', () => { +test(' - detects BoolField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Boolean } })); - expect(wrapper.find(BoolField)).toHaveLength(1); + expect(wrapper.find(BoolField.Component)).toHaveLength(1); }); -test(' - renders Component (model)', () => { +test(' - uses Component (schema)', () => { const Component = jest.fn(() => null); const element = ; @@ -107,7 +107,7 @@ test(' - renders Component (model)', () => { expect(Component).toHaveBeenCalledTimes(1); }); -test(' - renders Component (specified)', () => { +test(' - uses Component (props)', () => { const Component = jest.fn(() => null); const element = ; diff --git a/packages/uniforms-antd/src/AutoField.tsx b/packages/uniforms-antd/src/AutoField.tsx index 803335feb..b27f6dfe9 100644 --- a/packages/uniforms-antd/src/AutoField.tsx +++ b/packages/uniforms-antd/src/AutoField.tsx @@ -1,6 +1,6 @@ import invariant from 'invariant'; import { ComponentType, createElement } from 'react'; -import { Override, useField } from 'uniforms'; +import { Override, connectField, useField } from 'uniforms'; import BoolField from './BoolField'; import DateField from './DateField'; @@ -14,7 +14,7 @@ import TextField from './TextField'; export type AutoFieldProps = Override< Record, { - component?: ComponentType; + component?: ComponentType | ReturnType; name: string; } >; @@ -57,5 +57,7 @@ export default function AutoField(originalProps: AutoFieldProps) { } } - return createElement(component, originalProps); + return 'options' in component && component.options?.kind === 'leaf' + ? createElement(component.Component, props) + : createElement(component, originalProps); } diff --git a/packages/uniforms-antd/src/BoolField.tsx b/packages/uniforms-antd/src/BoolField.tsx index 9a5acc306..a766a35ae 100644 --- a/packages/uniforms-antd/src/BoolField.tsx +++ b/packages/uniforms-antd/src/BoolField.tsx @@ -45,4 +45,4 @@ Bool.defaultProps = { unCheckedChildren: , }; -export default connectField(Bool); +export default connectField(Bool, { kind: 'leaf' }); diff --git a/packages/uniforms-antd/src/DateField.tsx b/packages/uniforms-antd/src/DateField.tsx index 99fc0b78a..44deb977f 100644 --- a/packages/uniforms-antd/src/DateField.tsx +++ b/packages/uniforms-antd/src/DateField.tsx @@ -38,4 +38,4 @@ Date.defaultProps = { style: { width: '100%' }, }; -export default connectField(Date); +export default connectField(Date, { kind: 'leaf' }); diff --git a/packages/uniforms-antd/src/ListAddField.tsx b/packages/uniforms-antd/src/ListAddField.tsx index 521115b8f..53175cfe0 100644 --- a/packages/uniforms-antd/src/ListAddField.tsx +++ b/packages/uniforms-antd/src/ListAddField.tsx @@ -45,4 +45,4 @@ ListAdd.defaultProps = { type: 'dashed' as ButtonType, }; -export default connectField(ListAdd, { initialValue: false }); +export default connectField(ListAdd, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-antd/src/ListDelField.tsx b/packages/uniforms-antd/src/ListDelField.tsx index 054e3611e..f50258b69 100644 --- a/packages/uniforms-antd/src/ListDelField.tsx +++ b/packages/uniforms-antd/src/ListDelField.tsx @@ -52,4 +52,4 @@ ListDel.defaultProps = { type: 'ghost' as ButtonType, }; -export default connectField(ListDel); +export default connectField(ListDel, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-antd/src/LongTextField.tsx b/packages/uniforms-antd/src/LongTextField.tsx index 26a08f0e6..c70ef4441 100644 --- a/packages/uniforms-antd/src/LongTextField.tsx +++ b/packages/uniforms-antd/src/LongTextField.tsx @@ -40,4 +40,4 @@ function LongText(props: LongTextFieldProps) { LongText.defaultProps = { rows: 5 }; -export default connectField(LongText); +export default connectField(LongText, { kind: 'leaf' }); diff --git a/packages/uniforms-antd/src/NumField.tsx b/packages/uniforms-antd/src/NumField.tsx index 2f4c3ae2b..9550623a7 100644 --- a/packages/uniforms-antd/src/NumField.tsx +++ b/packages/uniforms-antd/src/NumField.tsx @@ -35,4 +35,4 @@ function Num(props: NumFieldProps) { ); } -export default connectField(Num); +export default connectField(Num, { kind: 'leaf' }); diff --git a/packages/uniforms-antd/src/RadioField.tsx b/packages/uniforms-antd/src/RadioField.tsx index 1dede9a86..c49041436 100644 --- a/packages/uniforms-antd/src/RadioField.tsx +++ b/packages/uniforms-antd/src/RadioField.tsx @@ -41,4 +41,4 @@ function Radio(props: RadioFieldProps) { ); } -export default connectField(Radio); +export default connectField(Radio, { kind: 'leaf' }); diff --git a/packages/uniforms-antd/src/SelectField.tsx b/packages/uniforms-antd/src/SelectField.tsx index ec4eb69e9..61011674e 100644 --- a/packages/uniforms-antd/src/SelectField.tsx +++ b/packages/uniforms-antd/src/SelectField.tsx @@ -93,4 +93,4 @@ function Select(props: SelectFieldProps) { ); } -export default connectField(Select); +export default connectField(Select, { kind: 'leaf' }); diff --git a/packages/uniforms-antd/src/TextField.tsx b/packages/uniforms-antd/src/TextField.tsx index c55be6749..b80cfadc8 100644 --- a/packages/uniforms-antd/src/TextField.tsx +++ b/packages/uniforms-antd/src/TextField.tsx @@ -30,4 +30,4 @@ function Text(props: TextFieldProps) { ); } -export default connectField(Text); +export default connectField(Text, { kind: 'leaf' }); From d5fd7d0aebe76d3dae1395555832b87de194ed90 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rados=C5=82aw=20Miernik?= Date: Wed, 17 Jun 2020 12:26:37 +0200 Subject: [PATCH 04/13] Marked bootstrap3 fields as leafs. --- .../__tests__/AutoField.tsx | 32 +++++++++---------- .../uniforms-bootstrap3/src/AutoField.tsx | 8 +++-- .../uniforms-bootstrap3/src/BoolField.tsx | 2 +- .../uniforms-bootstrap3/src/DateField.tsx | 2 +- .../uniforms-bootstrap3/src/ListAddField.tsx | 2 +- .../uniforms-bootstrap3/src/ListDelField.tsx | 2 +- .../uniforms-bootstrap3/src/LongTextField.tsx | 2 +- packages/uniforms-bootstrap3/src/NumField.tsx | 2 +- .../uniforms-bootstrap3/src/RadioField.tsx | 2 +- .../uniforms-bootstrap3/src/SelectField.tsx | 2 +- .../uniforms-bootstrap3/src/TextField.tsx | 2 +- 11 files changed, 30 insertions(+), 28 deletions(-) diff --git a/packages/uniforms-bootstrap3/__tests__/AutoField.tsx b/packages/uniforms-bootstrap3/__tests__/AutoField.tsx index 8fc463efa..56cc1ceb0 100644 --- a/packages/uniforms-bootstrap3/__tests__/AutoField.tsx +++ b/packages/uniforms-bootstrap3/__tests__/AutoField.tsx @@ -21,7 +21,7 @@ test(' - works', () => { expect(wrapper.find(AutoField)).toHaveLength(1); }); -test(' - renders RadioField', () => { +test(' - detects RadioField', () => { const element = ; const wrapper = mount( element, @@ -34,10 +34,10 @@ test(' - renders RadioField', () => { }), ); - expect(wrapper.find(RadioField)).toHaveLength(1); + expect(wrapper.find(RadioField.Component)).toHaveLength(1); }); -test(' - renders SelectField', () => { +test(' - detects SelectField', () => { const element = ; const wrapper = mount( element, @@ -47,17 +47,17 @@ test(' - renders SelectField', () => { }), ); - expect(wrapper.find(SelectField)).toHaveLength(1); + expect(wrapper.find(SelectField.Component)).toHaveLength(1); }); -test(' - renders DateField', () => { +test(' - detects DateField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Date } })); - expect(wrapper.find(DateField)).toHaveLength(1); + expect(wrapper.find(DateField.Component)).toHaveLength(1); }); -test(' - renders ListField', () => { +test(' - detects ListField', () => { const element = ; const wrapper = mount( element, @@ -67,35 +67,35 @@ test(' - renders ListField', () => { expect(wrapper.find(ListField)).toHaveLength(1); }); -test(' - renders NumField', () => { +test(' - detects NumField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Number } })); - expect(wrapper.find(NumField)).toHaveLength(1); + expect(wrapper.find(NumField.Component)).toHaveLength(1); }); -test(' - renders NestField', () => { +test(' - detects NestField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Object } })); expect(wrapper.find(NestField)).toHaveLength(1); }); -test(' - renders TextField', () => { +test(' - detects TextField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: String } })); - expect(wrapper.find(TextField)).toHaveLength(1); + expect(wrapper.find(TextField.Component)).toHaveLength(1); }); -test(' - renders BoolField', () => { +test(' - detects BoolField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Boolean } })); - expect(wrapper.find(BoolField)).toHaveLength(1); + expect(wrapper.find(BoolField.Component)).toHaveLength(1); }); -test(' - renders Component (model)', () => { +test(' - uses Component (schema)', () => { const Component = jest.fn(() => null); const element = ; @@ -107,7 +107,7 @@ test(' - renders Component (model)', () => { expect(Component).toHaveBeenCalledTimes(1); }); -test(' - renders Component (specified)', () => { +test(' - uses Component (props)', () => { const Component = jest.fn(() => null); const element = ; diff --git a/packages/uniforms-bootstrap3/src/AutoField.tsx b/packages/uniforms-bootstrap3/src/AutoField.tsx index 803335feb..b27f6dfe9 100644 --- a/packages/uniforms-bootstrap3/src/AutoField.tsx +++ b/packages/uniforms-bootstrap3/src/AutoField.tsx @@ -1,6 +1,6 @@ import invariant from 'invariant'; import { ComponentType, createElement } from 'react'; -import { Override, useField } from 'uniforms'; +import { Override, connectField, useField } from 'uniforms'; import BoolField from './BoolField'; import DateField from './DateField'; @@ -14,7 +14,7 @@ import TextField from './TextField'; export type AutoFieldProps = Override< Record, { - component?: ComponentType; + component?: ComponentType | ReturnType; name: string; } >; @@ -57,5 +57,7 @@ export default function AutoField(originalProps: AutoFieldProps) { } } - return createElement(component, originalProps); + return 'options' in component && component.options?.kind === 'leaf' + ? createElement(component.Component, props) + : createElement(component, originalProps); } diff --git a/packages/uniforms-bootstrap3/src/BoolField.tsx b/packages/uniforms-bootstrap3/src/BoolField.tsx index 00aa27251..432cf3f01 100644 --- a/packages/uniforms-bootstrap3/src/BoolField.tsx +++ b/packages/uniforms-bootstrap3/src/BoolField.tsx @@ -55,4 +55,4 @@ function Bool(props: BoolFieldProps) { ); } -export default connectField(Bool); +export default connectField(Bool, { kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap3/src/DateField.tsx b/packages/uniforms-bootstrap3/src/DateField.tsx index 5557dcce3..178320ac2 100644 --- a/packages/uniforms-bootstrap3/src/DateField.tsx +++ b/packages/uniforms-bootstrap3/src/DateField.tsx @@ -69,4 +69,4 @@ function Date({ ); } -export default connectField(Date); +export default connectField(Date, { kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap3/src/ListAddField.tsx b/packages/uniforms-bootstrap3/src/ListAddField.tsx index c3e3d498f..6a26d39c0 100644 --- a/packages/uniforms-bootstrap3/src/ListAddField.tsx +++ b/packages/uniforms-bootstrap3/src/ListAddField.tsx @@ -57,4 +57,4 @@ ListAdd.defaultProps = { addIcon: , }; -export default connectField(ListAdd, { initialValue: false }); +export default connectField(ListAdd, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap3/src/ListDelField.tsx b/packages/uniforms-bootstrap3/src/ListDelField.tsx index 7deaf4a50..72c21a46a 100644 --- a/packages/uniforms-bootstrap3/src/ListDelField.tsx +++ b/packages/uniforms-bootstrap3/src/ListDelField.tsx @@ -56,4 +56,4 @@ ListDel.defaultProps = { removeIcon: , }; -export default connectField(ListDel, { initialValue: false }); +export default connectField(ListDel, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap3/src/LongTextField.tsx b/packages/uniforms-bootstrap3/src/LongTextField.tsx index 1a8f0655e..bd1dcbad7 100644 --- a/packages/uniforms-bootstrap3/src/LongTextField.tsx +++ b/packages/uniforms-bootstrap3/src/LongTextField.tsx @@ -34,4 +34,4 @@ function LongText(props: LongTextFieldProps) { />, ); } -export default connectField(LongText); +export default connectField(LongText, { kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap3/src/NumField.tsx b/packages/uniforms-bootstrap3/src/NumField.tsx index 9f2d2e606..6c826fed7 100644 --- a/packages/uniforms-bootstrap3/src/NumField.tsx +++ b/packages/uniforms-bootstrap3/src/NumField.tsx @@ -43,4 +43,4 @@ function Num(props: NumFieldProps) { ); } -export default connectField(Num); +export default connectField(Num, { kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap3/src/RadioField.tsx b/packages/uniforms-bootstrap3/src/RadioField.tsx index 451758f9b..e18b1994b 100644 --- a/packages/uniforms-bootstrap3/src/RadioField.tsx +++ b/packages/uniforms-bootstrap3/src/RadioField.tsx @@ -49,4 +49,4 @@ function Radio(props: RadioFieldProps) { ); } -export default connectField(Radio); +export default connectField(Radio, { kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap3/src/SelectField.tsx b/packages/uniforms-bootstrap3/src/SelectField.tsx index 2383c390a..538566d75 100644 --- a/packages/uniforms-bootstrap3/src/SelectField.tsx +++ b/packages/uniforms-bootstrap3/src/SelectField.tsx @@ -123,4 +123,4 @@ function Select({ ); } -export default connectField(Select); +export default connectField(Select, { kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap3/src/TextField.tsx b/packages/uniforms-bootstrap3/src/TextField.tsx index 11f20e4f1..731a35963 100644 --- a/packages/uniforms-bootstrap3/src/TextField.tsx +++ b/packages/uniforms-bootstrap3/src/TextField.tsx @@ -35,4 +35,4 @@ function Text(props: TextFieldProps) { ); } -export default connectField(Text); +export default connectField(Text, { kind: 'leaf' }); From 33998df29613e5356aa4ddd22435a81e483219f1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rados=C5=82aw=20Miernik?= Date: Wed, 17 Jun 2020 12:27:15 +0200 Subject: [PATCH 05/13] Marked bootstrap4 fields as leafs. --- .../__tests__/AutoField.tsx | 32 +++++++++---------- .../uniforms-bootstrap4/src/AutoField.tsx | 8 +++-- .../uniforms-bootstrap4/src/BoolField.tsx | 2 +- .../uniforms-bootstrap4/src/DateField.tsx | 2 +- .../uniforms-bootstrap4/src/ListAddField.tsx | 2 +- .../uniforms-bootstrap4/src/ListDelField.tsx | 2 +- .../uniforms-bootstrap4/src/LongTextField.tsx | 2 +- packages/uniforms-bootstrap4/src/NumField.tsx | 2 +- .../uniforms-bootstrap4/src/RadioField.tsx | 2 +- .../uniforms-bootstrap4/src/SelectField.tsx | 2 +- .../uniforms-bootstrap4/src/TextField.tsx | 2 +- 11 files changed, 30 insertions(+), 28 deletions(-) diff --git a/packages/uniforms-bootstrap4/__tests__/AutoField.tsx b/packages/uniforms-bootstrap4/__tests__/AutoField.tsx index a550927d9..b47fa6bd9 100644 --- a/packages/uniforms-bootstrap4/__tests__/AutoField.tsx +++ b/packages/uniforms-bootstrap4/__tests__/AutoField.tsx @@ -21,7 +21,7 @@ test(' - works', () => { expect(wrapper.find(AutoField)).toHaveLength(1); }); -test(' - renders RadioField', () => { +test(' - detects RadioField', () => { const element = ; const wrapper = mount( element, @@ -34,10 +34,10 @@ test(' - renders RadioField', () => { }), ); - expect(wrapper.find(RadioField)).toHaveLength(1); + expect(wrapper.find(RadioField.Component)).toHaveLength(1); }); -test(' - renders SelectField', () => { +test(' - detects SelectField', () => { const element = ; const wrapper = mount( element, @@ -47,17 +47,17 @@ test(' - renders SelectField', () => { }), ); - expect(wrapper.find(SelectField)).toHaveLength(1); + expect(wrapper.find(SelectField.Component)).toHaveLength(1); }); -test(' - renders DateField', () => { +test(' - detects DateField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Date } })); - expect(wrapper.find(DateField)).toHaveLength(1); + expect(wrapper.find(DateField.Component)).toHaveLength(1); }); -test(' - renders ListField', () => { +test(' - detects ListField', () => { const element = ; const wrapper = mount( element, @@ -67,35 +67,35 @@ test(' - renders ListField', () => { expect(wrapper.find(ListField)).toHaveLength(1); }); -test(' - renders NumField', () => { +test(' - detects NumField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Number } })); - expect(wrapper.find(NumField)).toHaveLength(1); + expect(wrapper.find(NumField.Component)).toHaveLength(1); }); -test(' - renders NestField', () => { +test(' - detects NestField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Object } })); expect(wrapper.find(NestField)).toHaveLength(1); }); -test(' - renders TextField', () => { +test(' - detects TextField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: String } })); - expect(wrapper.find(TextField)).toHaveLength(1); + expect(wrapper.find(TextField.Component)).toHaveLength(1); }); -test(' - renders BoolField', () => { +test(' - detects BoolField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Boolean } })); - expect(wrapper.find(BoolField)).toHaveLength(1); + expect(wrapper.find(BoolField.Component)).toHaveLength(1); }); -test(' - renders Component (model)', () => { +test(' - uses Component (schema)', () => { const Component = jest.fn(() => null); const element = ; @@ -107,7 +107,7 @@ test(' - renders Component (model)', () => { expect(Component).toHaveBeenCalledTimes(1); }); -test(' - renders Component (specified)', () => { +test(' - uses Component (props)', () => { const Component = jest.fn(() => null); const element = ; diff --git a/packages/uniforms-bootstrap4/src/AutoField.tsx b/packages/uniforms-bootstrap4/src/AutoField.tsx index 803335feb..b27f6dfe9 100644 --- a/packages/uniforms-bootstrap4/src/AutoField.tsx +++ b/packages/uniforms-bootstrap4/src/AutoField.tsx @@ -1,6 +1,6 @@ import invariant from 'invariant'; import { ComponentType, createElement } from 'react'; -import { Override, useField } from 'uniforms'; +import { Override, connectField, useField } from 'uniforms'; import BoolField from './BoolField'; import DateField from './DateField'; @@ -14,7 +14,7 @@ import TextField from './TextField'; export type AutoFieldProps = Override< Record, { - component?: ComponentType; + component?: ComponentType | ReturnType; name: string; } >; @@ -57,5 +57,7 @@ export default function AutoField(originalProps: AutoFieldProps) { } } - return createElement(component, originalProps); + return 'options' in component && component.options?.kind === 'leaf' + ? createElement(component.Component, props) + : createElement(component, originalProps); } diff --git a/packages/uniforms-bootstrap4/src/BoolField.tsx b/packages/uniforms-bootstrap4/src/BoolField.tsx index f66c3e03f..42d0acd06 100644 --- a/packages/uniforms-bootstrap4/src/BoolField.tsx +++ b/packages/uniforms-bootstrap4/src/BoolField.tsx @@ -56,4 +56,4 @@ function Bool({ onChange, ...props }: BoolFieldProps) { ); } -export default connectField(Bool); +export default connectField(Bool, { kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap4/src/DateField.tsx b/packages/uniforms-bootstrap4/src/DateField.tsx index e17f32a2f..3b412e2aa 100644 --- a/packages/uniforms-bootstrap4/src/DateField.tsx +++ b/packages/uniforms-bootstrap4/src/DateField.tsx @@ -69,4 +69,4 @@ function Date({ ); } -export default connectField(Date); +export default connectField(Date, { kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap4/src/ListAddField.tsx b/packages/uniforms-bootstrap4/src/ListAddField.tsx index 43fe1fe76..f2af1a2ce 100644 --- a/packages/uniforms-bootstrap4/src/ListAddField.tsx +++ b/packages/uniforms-bootstrap4/src/ListAddField.tsx @@ -55,4 +55,4 @@ function ListAdd({ ListAdd.defaultProps = { addIcon: }; -export default connectField(ListAdd, { initialValue: false }); +export default connectField(ListAdd, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap4/src/ListDelField.tsx b/packages/uniforms-bootstrap4/src/ListDelField.tsx index 5d3254f48..9754cbd3d 100644 --- a/packages/uniforms-bootstrap4/src/ListDelField.tsx +++ b/packages/uniforms-bootstrap4/src/ListDelField.tsx @@ -57,4 +57,4 @@ ListDel.defaultProps = { removeIcon: , }; -export default connectField(ListDel, { initialValue: false }); +export default connectField(ListDel, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap4/src/LongTextField.tsx b/packages/uniforms-bootstrap4/src/LongTextField.tsx index c589ee8b2..8020a6db3 100644 --- a/packages/uniforms-bootstrap4/src/LongTextField.tsx +++ b/packages/uniforms-bootstrap4/src/LongTextField.tsx @@ -35,4 +35,4 @@ function LongText(props: LongTextFieldProps) { ); } -export default connectField(LongText); +export default connectField(LongText, { kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap4/src/NumField.tsx b/packages/uniforms-bootstrap4/src/NumField.tsx index 0dcdf57ba..e155ac863 100644 --- a/packages/uniforms-bootstrap4/src/NumField.tsx +++ b/packages/uniforms-bootstrap4/src/NumField.tsx @@ -43,4 +43,4 @@ function Num(props: NumFieldProps) { ); } -export default connectField(Num); +export default connectField(Num, { kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap4/src/RadioField.tsx b/packages/uniforms-bootstrap4/src/RadioField.tsx index 2e153c41f..a2090a790 100644 --- a/packages/uniforms-bootstrap4/src/RadioField.tsx +++ b/packages/uniforms-bootstrap4/src/RadioField.tsx @@ -53,4 +53,4 @@ function Radio(props: RadioFieldProps) { ); } -export default connectField(Radio); +export default connectField(Radio, { kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap4/src/SelectField.tsx b/packages/uniforms-bootstrap4/src/SelectField.tsx index efbd7287e..59ac34da2 100644 --- a/packages/uniforms-bootstrap4/src/SelectField.tsx +++ b/packages/uniforms-bootstrap4/src/SelectField.tsx @@ -123,4 +123,4 @@ function Select({ ); } -export default connectField(Select); +export default connectField(Select, { kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap4/src/TextField.tsx b/packages/uniforms-bootstrap4/src/TextField.tsx index 5e07b859d..cf862507e 100644 --- a/packages/uniforms-bootstrap4/src/TextField.tsx +++ b/packages/uniforms-bootstrap4/src/TextField.tsx @@ -35,4 +35,4 @@ function Text(props: TextFieldProps) { ); } -export default connectField(Text); +export default connectField(Text, { kind: 'leaf' }); From 0c1c2fe48496925cb1e566b6a45f16186f60e0f4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rados=C5=82aw=20Miernik?= Date: Wed, 17 Jun 2020 12:27:39 +0200 Subject: [PATCH 06/13] Marked ErrorField as leafs. --- packages/uniforms-antd/src/ErrorField.tsx | 2 +- packages/uniforms-bootstrap3/src/ErrorField.tsx | 2 +- packages/uniforms-bootstrap4/src/ErrorField.tsx | 2 +- packages/uniforms-material/src/ErrorField.tsx | 2 +- packages/uniforms-semantic/src/ErrorField.tsx | 2 +- packages/uniforms-unstyled/src/ErrorField.tsx | 2 +- 6 files changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/uniforms-antd/src/ErrorField.tsx b/packages/uniforms-antd/src/ErrorField.tsx index a629b6cd4..845e30b15 100644 --- a/packages/uniforms-antd/src/ErrorField.tsx +++ b/packages/uniforms-antd/src/ErrorField.tsx @@ -31,4 +31,4 @@ Error.defaultProps = { }, }; -export default connectField(Error, { initialValue: false }); +export default connectField(Error, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap3/src/ErrorField.tsx b/packages/uniforms-bootstrap3/src/ErrorField.tsx index 4f39de818..87cb5759d 100644 --- a/packages/uniforms-bootstrap3/src/ErrorField.tsx +++ b/packages/uniforms-bootstrap3/src/ErrorField.tsx @@ -35,4 +35,4 @@ function Error({ ); } -export default connectField(Error, { initialValue: false }); +export default connectField(Error, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-bootstrap4/src/ErrorField.tsx b/packages/uniforms-bootstrap4/src/ErrorField.tsx index 541495b33..1506dbea1 100644 --- a/packages/uniforms-bootstrap4/src/ErrorField.tsx +++ b/packages/uniforms-bootstrap4/src/ErrorField.tsx @@ -29,4 +29,4 @@ function Error({ ); } -export default connectField(Error, { initialValue: false }); +export default connectField(Error, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-material/src/ErrorField.tsx b/packages/uniforms-material/src/ErrorField.tsx index 38b85246c..11a180ba5 100644 --- a/packages/uniforms-material/src/ErrorField.tsx +++ b/packages/uniforms-material/src/ErrorField.tsx @@ -42,4 +42,4 @@ Error.defaultProps = { margin: 'dense', }; -export default connectField(Error, { initialValue: false }); +export default connectField(Error, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-semantic/src/ErrorField.tsx b/packages/uniforms-semantic/src/ErrorField.tsx index 7e48b53c7..434062bc1 100644 --- a/packages/uniforms-semantic/src/ErrorField.tsx +++ b/packages/uniforms-semantic/src/ErrorField.tsx @@ -27,4 +27,4 @@ function Error({ ); } -export default connectField(Error, { initialValue: false }); +export default connectField(Error, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-unstyled/src/ErrorField.tsx b/packages/uniforms-unstyled/src/ErrorField.tsx index a88f05322..ed1465233 100644 --- a/packages/uniforms-unstyled/src/ErrorField.tsx +++ b/packages/uniforms-unstyled/src/ErrorField.tsx @@ -16,4 +16,4 @@ function Error({ children, error, errorMessage, ...props }: ErrorFieldProps) { ); } -export default connectField(Error, { initialValue: false }); +export default connectField(Error, { initialValue: false, kind: 'leaf' }); From 6711d5753eb6c092442000d0f5552bb4c377855b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rados=C5=82aw=20Miernik?= Date: Wed, 17 Jun 2020 12:30:10 +0200 Subject: [PATCH 07/13] Updated CHANGELOG.md. --- CHANGELOG.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 4c4cefc34..07c147182 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,7 @@ +## Next + +- **Added:** New `kind: 'leaf' | 'node'` flag for `connectField`. [\#741](https://github.com/vazco/uniforms/issues/741) + ## [v3.0.0-alpha.4](https://github.com/vazco/uniforms/tree/v3.0.0-alpha.4) (2020-06-03) - **Breaking:** Removed `injectName` helper. It was used to force context updates and got replaced by the new context directly. [\#720](https://github.com/vazco/uniforms/issues/720) From 20f38143b5067f67584d5f43654a914067eeb9ca Mon Sep 17 00:00:00 2001 From: Monteth Date: Wed, 17 Jun 2020 12:53:46 +0200 Subject: [PATCH 08/13] Marked semantic fields as leafs. --- .../uniforms-semantic/__tests__/AutoField.tsx | 32 +++++++++---------- packages/uniforms-semantic/src/AutoField.tsx | 8 +++-- packages/uniforms-semantic/src/BoolField.tsx | 2 +- packages/uniforms-semantic/src/DateField.tsx | 2 +- .../uniforms-semantic/src/ListAddField.tsx | 2 +- .../uniforms-semantic/src/ListDelField.tsx | 2 +- .../uniforms-semantic/src/LongTextField.tsx | 2 +- packages/uniforms-semantic/src/NumField.tsx | 2 +- packages/uniforms-semantic/src/RadioField.tsx | 2 +- .../uniforms-semantic/src/SelectField.tsx | 2 +- packages/uniforms-semantic/src/TextField.tsx | 2 +- 11 files changed, 30 insertions(+), 28 deletions(-) diff --git a/packages/uniforms-semantic/__tests__/AutoField.tsx b/packages/uniforms-semantic/__tests__/AutoField.tsx index 40fa04717..196faf0cc 100644 --- a/packages/uniforms-semantic/__tests__/AutoField.tsx +++ b/packages/uniforms-semantic/__tests__/AutoField.tsx @@ -21,7 +21,7 @@ test(' - works', () => { expect(wrapper.find(AutoField)).toHaveLength(1); }); -test(' - renders RadioField', () => { +test(' - detects RadioField', () => { const element = ; const wrapper = mount( element, @@ -34,10 +34,10 @@ test(' - renders RadioField', () => { }), ); - expect(wrapper.find(RadioField)).toHaveLength(1); + expect(wrapper.find(RadioField.Component)).toHaveLength(1); }); -test(' - renders SelectField', () => { +test(' - detects SelectField', () => { const element = ; const wrapper = mount( element, @@ -47,17 +47,17 @@ test(' - renders SelectField', () => { }), ); - expect(wrapper.find(SelectField)).toHaveLength(1); + expect(wrapper.find(SelectField.Component)).toHaveLength(1); }); -test(' - renders DateField', () => { +test(' - detects DateField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Date } })); - expect(wrapper.find(DateField)).toHaveLength(1); + expect(wrapper.find(DateField.Component)).toHaveLength(1); }); -test(' - renders ListField', () => { +test(' - detects ListField', () => { const element = ; const wrapper = mount( element, @@ -67,35 +67,35 @@ test(' - renders ListField', () => { expect(wrapper.find(ListField)).toHaveLength(1); }); -test(' - renders NumField', () => { +test(' - detects NumField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Number } })); - expect(wrapper.find(NumField)).toHaveLength(1); + expect(wrapper.find(NumField.Component)).toHaveLength(1); }); -test(' - renders NestField', () => { +test(' - detects NestField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Object } })); expect(wrapper.find(NestField)).toHaveLength(1); }); -test(' - renders TextField', () => { +test(' - detects TextField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: String } })); - expect(wrapper.find(TextField)).toHaveLength(1); + expect(wrapper.find(TextField.Component)).toHaveLength(1); }); -test(' - renders BoolField', () => { +test(' - detects BoolField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Boolean } })); - expect(wrapper.find(BoolField)).toHaveLength(1); + expect(wrapper.find(BoolField.Component)).toHaveLength(1); }); -test(' - renders Component (model)', () => { +test(' - detects Component (model)', () => { const Component = jest.fn(() => null); const element = ; @@ -107,7 +107,7 @@ test(' - renders Component (model)', () => { expect(Component).toHaveBeenCalledTimes(1); }); -test(' - renders Component (specified)', () => { +test(' - detects Component (specified)', () => { const Component = jest.fn(() => null); const element = ; diff --git a/packages/uniforms-semantic/src/AutoField.tsx b/packages/uniforms-semantic/src/AutoField.tsx index 803335feb..ac88af206 100644 --- a/packages/uniforms-semantic/src/AutoField.tsx +++ b/packages/uniforms-semantic/src/AutoField.tsx @@ -1,6 +1,6 @@ import invariant from 'invariant'; import { ComponentType, createElement } from 'react'; -import { Override, useField } from 'uniforms'; +import { connectField, Override, useField } from 'uniforms'; import BoolField from './BoolField'; import DateField from './DateField'; @@ -14,7 +14,7 @@ import TextField from './TextField'; export type AutoFieldProps = Override< Record, { - component?: ComponentType; + component?: ComponentType | ReturnType; name: string; } >; @@ -57,5 +57,7 @@ export default function AutoField(originalProps: AutoFieldProps) { } } - return createElement(component, originalProps); + return 'options' in component && component.options?.kind === 'leaf' + ? createElement(component.Component, props) + : createElement(component, originalProps); } diff --git a/packages/uniforms-semantic/src/BoolField.tsx b/packages/uniforms-semantic/src/BoolField.tsx index 2183977fc..c60e4b646 100644 --- a/packages/uniforms-semantic/src/BoolField.tsx +++ b/packages/uniforms-semantic/src/BoolField.tsx @@ -66,4 +66,4 @@ function Bool({ ); } -export default connectField(Bool); +export default connectField(Bool, { kind: 'leaf' }); diff --git a/packages/uniforms-semantic/src/DateField.tsx b/packages/uniforms-semantic/src/DateField.tsx index ace06b539..81baa0415 100644 --- a/packages/uniforms-semantic/src/DateField.tsx +++ b/packages/uniforms-semantic/src/DateField.tsx @@ -99,4 +99,4 @@ function Date({ ); } -export default connectField(Date); +export default connectField(Date, { kind: 'leaf' }); diff --git a/packages/uniforms-semantic/src/ListAddField.tsx b/packages/uniforms-semantic/src/ListAddField.tsx index dd9f49d55..adbccbaea 100644 --- a/packages/uniforms-semantic/src/ListAddField.tsx +++ b/packages/uniforms-semantic/src/ListAddField.tsx @@ -43,4 +43,4 @@ function ListAdd({ disabled, name, value, ...props }: ListAddFieldProps) { ); } -export default connectField(ListAdd, { initialValue: false }); +export default connectField(ListAdd, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-semantic/src/ListDelField.tsx b/packages/uniforms-semantic/src/ListDelField.tsx index 7ac136ebe..831eb5fc5 100644 --- a/packages/uniforms-semantic/src/ListDelField.tsx +++ b/packages/uniforms-semantic/src/ListDelField.tsx @@ -46,4 +46,4 @@ function ListDel({ disabled, name, ...props }: ListDelFieldProps) { ); } -export default connectField(ListDel, { initialValue: false }); +export default connectField(ListDel, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-semantic/src/LongTextField.tsx b/packages/uniforms-semantic/src/LongTextField.tsx index c33eb1d87..fffbc6743 100644 --- a/packages/uniforms-semantic/src/LongTextField.tsx +++ b/packages/uniforms-semantic/src/LongTextField.tsx @@ -61,4 +61,4 @@ function LongText({ ); } -export default connectField(LongText); +export default connectField(LongText, { kind: 'leaf' }); diff --git a/packages/uniforms-semantic/src/NumField.tsx b/packages/uniforms-semantic/src/NumField.tsx index 0ffe3f51b..31f95b7f3 100644 --- a/packages/uniforms-semantic/src/NumField.tsx +++ b/packages/uniforms-semantic/src/NumField.tsx @@ -97,4 +97,4 @@ function Num({ ); } -export default connectField(Num); +export default connectField(Num, { kind: 'leaf' }); diff --git a/packages/uniforms-semantic/src/RadioField.tsx b/packages/uniforms-semantic/src/RadioField.tsx index 16230a634..bed391822 100644 --- a/packages/uniforms-semantic/src/RadioField.tsx +++ b/packages/uniforms-semantic/src/RadioField.tsx @@ -75,4 +75,4 @@ function Radio({ ); } -export default connectField(Radio); +export default connectField(Radio, { kind: 'leaf' }); diff --git a/packages/uniforms-semantic/src/SelectField.tsx b/packages/uniforms-semantic/src/SelectField.tsx index 048fbbb2d..188f1701f 100644 --- a/packages/uniforms-semantic/src/SelectField.tsx +++ b/packages/uniforms-semantic/src/SelectField.tsx @@ -123,4 +123,4 @@ function Select({ ); } -export default connectField(Select); +export default connectField(Select, { kind: 'leaf' }); diff --git a/packages/uniforms-semantic/src/TextField.tsx b/packages/uniforms-semantic/src/TextField.tsx index df584c4cb..86a2b32a9 100644 --- a/packages/uniforms-semantic/src/TextField.tsx +++ b/packages/uniforms-semantic/src/TextField.tsx @@ -87,4 +87,4 @@ function Text({ Text.defaultProps = { type: 'text' }; -export default connectField(Text); +export default connectField(Text, { kind: 'leaf' }); From 325b96e4f1684cecc0cb59596af5cb08c6e3b58c Mon Sep 17 00:00:00 2001 From: Monteth Date: Wed, 17 Jun 2020 12:53:57 +0200 Subject: [PATCH 09/13] Marked material fields as leafs. --- .../uniforms-material/__tests__/AutoField.tsx | 28 +++++++++---------- packages/uniforms-material/src/AutoField.tsx | 8 ++++-- packages/uniforms-material/src/BoolField.tsx | 2 +- packages/uniforms-material/src/DateField.tsx | 2 +- .../uniforms-material/src/ListAddField.tsx | 2 +- .../uniforms-material/src/ListDelField.tsx | 2 +- .../uniforms-material/src/LongTextField.tsx | 2 +- packages/uniforms-material/src/NumField.tsx | 2 +- packages/uniforms-material/src/RadioField.tsx | 2 +- .../uniforms-material/src/SelectField.tsx | 2 +- packages/uniforms-material/src/TextField.tsx | 2 +- 11 files changed, 28 insertions(+), 26 deletions(-) diff --git a/packages/uniforms-material/__tests__/AutoField.tsx b/packages/uniforms-material/__tests__/AutoField.tsx index 07c464559..975ddedd9 100644 --- a/packages/uniforms-material/__tests__/AutoField.tsx +++ b/packages/uniforms-material/__tests__/AutoField.tsx @@ -21,7 +21,7 @@ test(' - works', () => { expect(wrapper.find(AutoField)).toHaveLength(1); }); -test(' - renders RadioField', () => { +test(' - detects RadioField', () => { const element = ; const wrapper = mount( element, @@ -37,7 +37,7 @@ test(' - renders RadioField', () => { expect(wrapper.find(RadioField)).toHaveLength(1); }); -test(' - renders SelectField', () => { +test(' - detects SelectField', () => { const element = ; const wrapper = mount( element, @@ -47,17 +47,17 @@ test(' - renders SelectField', () => { }), ); - expect(wrapper.find(SelectField)).toHaveLength(1); + expect(wrapper.find(SelectField.Component)).toHaveLength(1); }); -test(' - renders DateField', () => { +test(' - detects DateField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Date } })); expect(wrapper.find(DateField)).toHaveLength(1); }); -test(' - renders ListField', () => { +test(' - detects ListField', () => { const element = ; const wrapper = mount( element, @@ -67,35 +67,35 @@ test(' - renders ListField', () => { expect(wrapper.find(ListField)).toHaveLength(1); }); -test(' - renders NumField', () => { +test(' - detects NumField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Number } })); - expect(wrapper.find(NumField)).toHaveLength(1); + expect(wrapper.find(NumField.Component)).toHaveLength(1); }); -test(' - renders NestField', () => { +test(' - detects NestField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Object } })); expect(wrapper.find(NestField)).toHaveLength(1); }); -test(' - renders TextField', () => { +test(' - detects TextField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: String } })); - expect(wrapper.find(TextField)).toHaveLength(1); + expect(wrapper.find(TextField.Component)).toHaveLength(1); }); -test(' - renders BoolField', () => { +test(' - detects BoolField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Boolean } })); - expect(wrapper.find(BoolField)).toHaveLength(1); + expect(wrapper.find(BoolField.Component)).toHaveLength(1); }); -test(' - renders Component (model)', () => { +test(' - uses Component (schema)', () => { const Component = jest.fn(() => null); const element = ; @@ -107,7 +107,7 @@ test(' - renders Component (model)', () => { expect(Component).toHaveBeenCalledTimes(1); }); -test(' - renders Component (specified)', () => { +test(' - uses Component (props)', () => { const Component = jest.fn(() => null); const element = ; diff --git a/packages/uniforms-material/src/AutoField.tsx b/packages/uniforms-material/src/AutoField.tsx index 803335feb..ac88af206 100644 --- a/packages/uniforms-material/src/AutoField.tsx +++ b/packages/uniforms-material/src/AutoField.tsx @@ -1,6 +1,6 @@ import invariant from 'invariant'; import { ComponentType, createElement } from 'react'; -import { Override, useField } from 'uniforms'; +import { connectField, Override, useField } from 'uniforms'; import BoolField from './BoolField'; import DateField from './DateField'; @@ -14,7 +14,7 @@ import TextField from './TextField'; export type AutoFieldProps = Override< Record, { - component?: ComponentType; + component?: ComponentType | ReturnType; name: string; } >; @@ -57,5 +57,7 @@ export default function AutoField(originalProps: AutoFieldProps) { } } - return createElement(component, originalProps); + return 'options' in component && component.options?.kind === 'leaf' + ? createElement(component.Component, props) + : createElement(component, originalProps); } diff --git a/packages/uniforms-material/src/BoolField.tsx b/packages/uniforms-material/src/BoolField.tsx index 34103de06..e5ff5950b 100644 --- a/packages/uniforms-material/src/BoolField.tsx +++ b/packages/uniforms-material/src/BoolField.tsx @@ -62,4 +62,4 @@ function Bool(props: BoolFieldProps) { ); } -export default connectField(Bool); +export default connectField(Bool, { kind: 'leaf' }); diff --git a/packages/uniforms-material/src/DateField.tsx b/packages/uniforms-material/src/DateField.tsx index 914273c48..3e360080a 100644 --- a/packages/uniforms-material/src/DateField.tsx +++ b/packages/uniforms-material/src/DateField.tsx @@ -65,4 +65,4 @@ Date.defaultProps = { fullWidth: true, }; -export default connectField(Date); +export default connectField(Date, { kind: 'leaf' }); diff --git a/packages/uniforms-material/src/ListAddField.tsx b/packages/uniforms-material/src/ListAddField.tsx index 26a6d2224..4d810c09c 100644 --- a/packages/uniforms-material/src/ListAddField.tsx +++ b/packages/uniforms-material/src/ListAddField.tsx @@ -65,4 +65,4 @@ ListAdd.defaultProps = { margin: 'dense' as 'dense', }; -export default connectField(ListAdd, { initialValue: false }); +export default connectField(ListAdd, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-material/src/ListDelField.tsx b/packages/uniforms-material/src/ListDelField.tsx index 1177fd2dd..742c63e2e 100644 --- a/packages/uniforms-material/src/ListDelField.tsx +++ b/packages/uniforms-material/src/ListDelField.tsx @@ -45,4 +45,4 @@ ListDel.defaultProps = { icon: '-', }; -export default connectField(ListDel, { initialValue: false }); +export default connectField(ListDel, { initialValue: false, kind: 'leaf' }); diff --git a/packages/uniforms-material/src/LongTextField.tsx b/packages/uniforms-material/src/LongTextField.tsx index c1e8051c6..ba4184e0a 100644 --- a/packages/uniforms-material/src/LongTextField.tsx +++ b/packages/uniforms-material/src/LongTextField.tsx @@ -48,4 +48,4 @@ LongText.defaultProps = { type: 'text', }; -export default connectField(LongText); +export default connectField(LongText, { kind: 'leaf' }); diff --git a/packages/uniforms-material/src/NumField.tsx b/packages/uniforms-material/src/NumField.tsx index da2f261ce..8d7259b50 100644 --- a/packages/uniforms-material/src/NumField.tsx +++ b/packages/uniforms-material/src/NumField.tsx @@ -57,4 +57,4 @@ function Num({ /> ); } -export default connectField(Num); +export default connectField(Num, { kind: 'leaf' }); diff --git a/packages/uniforms-material/src/RadioField.tsx b/packages/uniforms-material/src/RadioField.tsx index a6844d1fe..c44e0d351 100644 --- a/packages/uniforms-material/src/RadioField.tsx +++ b/packages/uniforms-material/src/RadioField.tsx @@ -65,4 +65,4 @@ Radio.defaultProps = { margin: 'dense', } as any; -export default connectField(Radio); +export default connectField(Radio, { kind: 'leaf' }); diff --git a/packages/uniforms-material/src/SelectField.tsx b/packages/uniforms-material/src/SelectField.tsx index 6282ce470..46557cb96 100644 --- a/packages/uniforms-material/src/SelectField.tsx +++ b/packages/uniforms-material/src/SelectField.tsx @@ -222,4 +222,4 @@ function Select(props: SelectFieldProps) { ); } -export default connectField(Select); +export default connectField(Select, { kind: 'leaf' }); diff --git a/packages/uniforms-material/src/TextField.tsx b/packages/uniforms-material/src/TextField.tsx index 8ad6048e5..be8b9e06c 100644 --- a/packages/uniforms-material/src/TextField.tsx +++ b/packages/uniforms-material/src/TextField.tsx @@ -53,4 +53,4 @@ Text.defaultProps = { type: 'text', }; -export default connectField(Text); +export default connectField(Text, { kind: 'leaf' }); From 478d88401dfd0d7816b43f7c57db8802001b74d7 Mon Sep 17 00:00:00 2001 From: Monteth Date: Wed, 17 Jun 2020 13:11:02 +0200 Subject: [PATCH 10/13] Fixed material AutoField tests. --- packages/uniforms-material/__tests__/AutoField.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/uniforms-material/__tests__/AutoField.tsx b/packages/uniforms-material/__tests__/AutoField.tsx index 975ddedd9..5a5d69a03 100644 --- a/packages/uniforms-material/__tests__/AutoField.tsx +++ b/packages/uniforms-material/__tests__/AutoField.tsx @@ -34,7 +34,7 @@ test(' - detects RadioField', () => { }), ); - expect(wrapper.find(RadioField)).toHaveLength(1); + expect(wrapper.find(RadioField.Component)).toHaveLength(1); }); test(' - detects SelectField', () => { @@ -54,7 +54,7 @@ test(' - detects DateField', () => { const element = ; const wrapper = mount(element, createContext({ x: { type: Date } })); - expect(wrapper.find(DateField)).toHaveLength(1); + expect(wrapper.find(DateField.Component)).toHaveLength(1); }); test(' - detects ListField', () => { From ae44b8c6cf760647b7e43f3311078c96b061eb41 Mon Sep 17 00:00:00 2001 From: Monteth Date: Wed, 17 Jun 2020 14:02:39 +0200 Subject: [PATCH 11/13] Added connectField tests. --- packages/uniforms/__tests__/connectField.tsx | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/packages/uniforms/__tests__/connectField.tsx b/packages/uniforms/__tests__/connectField.tsx index 3f9463829..a44c8f922 100644 --- a/packages/uniforms/__tests__/connectField.tsx +++ b/packages/uniforms/__tests__/connectField.tsx @@ -109,6 +109,26 @@ describe('connectField', () => { }); }); + describe('when called with `kind`', () => { + it('does not set default value', () => { + const Field = connectField(Test); + + expect(Field.options).toEqual(undefined); + }); + + it('passes kind option (leaf)', () => { + const Field = connectField(Test, { kind: 'leaf' }); + + expect(Field.options).toEqual({ kind: 'leaf' }); + }); + + it('passes kind option (node)', () => { + const Field = connectField(Test, { kind: 'node' }); + + expect(Field.options).toEqual({ kind: 'node' }); + }); + }); + describe('when called with `initialValue`', () => { it('includes default value (true)', () => { const Field = connectField(Test, { initialValue: true }); From 1180827e45688195c13a8383b9212f52f782db44 Mon Sep 17 00:00:00 2001 From: Monteth Date: Wed, 17 Jun 2020 14:21:08 +0200 Subject: [PATCH 12/13] Changed connectField test names. --- packages/uniforms/__tests__/connectField.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/uniforms/__tests__/connectField.tsx b/packages/uniforms/__tests__/connectField.tsx index a44c8f922..82de174b5 100644 --- a/packages/uniforms/__tests__/connectField.tsx +++ b/packages/uniforms/__tests__/connectField.tsx @@ -116,13 +116,13 @@ describe('connectField', () => { expect(Field.options).toEqual(undefined); }); - it('passes kind option (leaf)', () => { + it('includes options object with `kind` value (leaf)', () => { const Field = connectField(Test, { kind: 'leaf' }); expect(Field.options).toEqual({ kind: 'leaf' }); }); - it('passes kind option (node)', () => { + it('includes options object with `kind` value (node)', () => { const Field = connectField(Test, { kind: 'node' }); expect(Field.options).toEqual({ kind: 'node' }); From 9667c3077f27185d1c00c120165fc7af3397ef1e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rados=C5=82aw=20Miernik?= Date: Wed, 17 Jun 2020 18:30:52 +0200 Subject: [PATCH 13/13] Fixed incorrect merge. --- packages/uniforms/__tests__/connectField.tsx | 42 -------------------- 1 file changed, 42 deletions(-) diff --git a/packages/uniforms/__tests__/connectField.tsx b/packages/uniforms/__tests__/connectField.tsx index e66e44bcc..a83dc9b3c 100644 --- a/packages/uniforms/__tests__/connectField.tsx +++ b/packages/uniforms/__tests__/connectField.tsx @@ -67,48 +67,6 @@ describe('connectField', () => { }); }); - describe('when called with `includeInChain`', () => { - it('is in chain (true)', () => { - const Field1 = connectField(props => <>{props.children}, { - includeInChain: true, - }); - const Field2 = connectField(Test); - - mount( - - - , - reactContext, - ); - - expect(Test.mock.calls[0]).toEqual( - expect.arrayContaining([ - expect.objectContaining({ name: 'field.subfield' }), - ]), - ); - }); - - it('is not in chain (false)', () => { - const Field1 = connectField(props => <>{props.children}, { - includeInChain: false, - }); - const Field2 = connectField(Test); - - mount( - - - , - reactContext, - ); - - expect(Test.mock.calls[0]).toEqual( - expect.arrayContaining([ - expect.objectContaining({ name: 'field.subfield' }), - ]), - ); - }); - }); - describe('when called with `kind`', () => { it('does not set default value', () => { const Field = connectField(Test);