Skip to content

Commit

Permalink
Added kind option to connectField.
Browse files Browse the repository at this point in the history
  • Loading branch information
radekmie authored Jun 17, 2020
1 parent 47cea74 commit 09fd494
Show file tree
Hide file tree
Showing 75 changed files with 215 additions and 176 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
## Next

- **Breaking:** Removed `modelSync` from `AutoForm` state. [\#739](https://github.com/vazco/uniforms/issues/739)
- **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)

Expand Down
32 changes: 16 additions & 16 deletions packages/uniforms-antd/__tests__/AutoField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ test('<AutoField> - works', () => {
expect(wrapper.find(AutoField)).toHaveLength(1);
});

test('<AutoField> - renders RadioField', () => {
test('<AutoField> - detects RadioField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(
element,
Expand All @@ -34,10 +34,10 @@ test('<AutoField> - renders RadioField', () => {
}),
);

expect(wrapper.find(RadioField)).toHaveLength(1);
expect(wrapper.find(RadioField.Component)).toHaveLength(1);
});

test('<AutoField> - renders SelectField', () => {
test('<AutoField> - detects SelectField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(
element,
Expand All @@ -47,17 +47,17 @@ test('<AutoField> - renders SelectField', () => {
}),
);

expect(wrapper.find(SelectField)).toHaveLength(1);
expect(wrapper.find(SelectField.Component)).toHaveLength(1);
});

test('<AutoField> - renders DateField', () => {
test('<AutoField> - detects DateField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(element, createContext({ x: { type: Date } }));

expect(wrapper.find(DateField)).toHaveLength(1);
expect(wrapper.find(DateField.Component)).toHaveLength(1);
});

test('<AutoField> - renders ListField', () => {
test('<AutoField> - detects ListField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(
element,
Expand All @@ -67,35 +67,35 @@ test('<AutoField> - renders ListField', () => {
expect(wrapper.find(ListField)).toHaveLength(1);
});

test('<AutoField> - renders NumField', () => {
test('<AutoField> - detects NumField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(element, createContext({ x: { type: Number } }));

expect(wrapper.find(NumField)).toHaveLength(1);
expect(wrapper.find(NumField.Component)).toHaveLength(1);
});

test('<AutoField> - renders NestField', () => {
test('<AutoField> - detects NestField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(element, createContext({ x: { type: Object } }));

expect(wrapper.find(NestField)).toHaveLength(1);
});

test('<AutoField> - renders TextField', () => {
test('<AutoField> - detects TextField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(element, createContext({ x: { type: String } }));

expect(wrapper.find(TextField)).toHaveLength(1);
expect(wrapper.find(TextField.Component)).toHaveLength(1);
});

test('<AutoField> - renders BoolField', () => {
test('<AutoField> - detects BoolField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(element, createContext({ x: { type: Boolean } }));

expect(wrapper.find(BoolField)).toHaveLength(1);
expect(wrapper.find(BoolField.Component)).toHaveLength(1);
});

test('<AutoField> - renders Component (model)', () => {
test('<AutoField> - uses Component (schema)', () => {
const Component = jest.fn(() => null);

const element = <AutoField name="x" />;
Expand All @@ -107,7 +107,7 @@ test('<AutoField> - renders Component (model)', () => {
expect(Component).toHaveBeenCalledTimes(1);
});

test('<AutoField> - renders Component (specified)', () => {
test('<AutoField> - uses Component (props)', () => {
const Component = jest.fn(() => null);

const element = <AutoField name="x" component={Component} />;
Expand Down
8 changes: 5 additions & 3 deletions packages/uniforms-antd/src/AutoField.tsx
Original file line number Diff line number Diff line change
@@ -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';
Expand All @@ -14,7 +14,7 @@ import TextField from './TextField';
export type AutoFieldProps = Override<
Record<string, unknown>,
{
component?: ComponentType<any>;
component?: ComponentType<any> | ReturnType<typeof connectField>;
name: string;
}
>;
Expand Down Expand Up @@ -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);
}
2 changes: 1 addition & 1 deletion packages/uniforms-antd/src/BoolField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -45,4 +45,4 @@ Bool.defaultProps = {
unCheckedChildren: <Icon type="close" />,
};

export default connectField(Bool);
export default connectField(Bool, { kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-antd/src/DateField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -38,4 +38,4 @@ Date.defaultProps = {
style: { width: '100%' },
};

export default connectField(Date);
export default connectField(Date, { kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-antd/src/ErrorField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -31,4 +31,4 @@ Error.defaultProps = {
},
};

export default connectField(Error, { initialValue: false });
export default connectField(Error, { initialValue: false, kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-antd/src/ListAddField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -45,4 +45,4 @@ ListAdd.defaultProps = {
type: 'dashed' as ButtonType,
};

export default connectField(ListAdd, { initialValue: false });
export default connectField(ListAdd, { initialValue: false, kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-antd/src/ListDelField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -52,4 +52,4 @@ ListDel.defaultProps = {
type: 'ghost' as ButtonType,
};

export default connectField(ListDel);
export default connectField(ListDel, { initialValue: false, kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-antd/src/LongTextField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -40,4 +40,4 @@ function LongText(props: LongTextFieldProps) {

LongText.defaultProps = { rows: 5 };

export default connectField(LongText);
export default connectField(LongText, { kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-antd/src/NumField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -35,4 +35,4 @@ function Num(props: NumFieldProps) {
);
}

export default connectField(Num);
export default connectField(Num, { kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-antd/src/RadioField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -42,4 +42,4 @@ function Radio(props: RadioFieldProps) {
);
}

export default connectField(Radio);
export default connectField(Radio, { kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-antd/src/SelectField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -93,4 +93,4 @@ function Select(props: SelectFieldProps) {
);
}

export default connectField(Select);
export default connectField(Select, { kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-antd/src/TextField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,4 +30,4 @@ function Text(props: TextFieldProps) {
);
}

export default connectField(Text);
export default connectField(Text, { kind: 'leaf' });
32 changes: 16 additions & 16 deletions packages/uniforms-bootstrap3/__tests__/AutoField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ test('<AutoField> - works', () => {
expect(wrapper.find(AutoField)).toHaveLength(1);
});

test('<AutoField> - renders RadioField', () => {
test('<AutoField> - detects RadioField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(
element,
Expand All @@ -34,10 +34,10 @@ test('<AutoField> - renders RadioField', () => {
}),
);

expect(wrapper.find(RadioField)).toHaveLength(1);
expect(wrapper.find(RadioField.Component)).toHaveLength(1);
});

test('<AutoField> - renders SelectField', () => {
test('<AutoField> - detects SelectField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(
element,
Expand All @@ -47,17 +47,17 @@ test('<AutoField> - renders SelectField', () => {
}),
);

expect(wrapper.find(SelectField)).toHaveLength(1);
expect(wrapper.find(SelectField.Component)).toHaveLength(1);
});

test('<AutoField> - renders DateField', () => {
test('<AutoField> - detects DateField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(element, createContext({ x: { type: Date } }));

expect(wrapper.find(DateField)).toHaveLength(1);
expect(wrapper.find(DateField.Component)).toHaveLength(1);
});

test('<AutoField> - renders ListField', () => {
test('<AutoField> - detects ListField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(
element,
Expand All @@ -67,35 +67,35 @@ test('<AutoField> - renders ListField', () => {
expect(wrapper.find(ListField)).toHaveLength(1);
});

test('<AutoField> - renders NumField', () => {
test('<AutoField> - detects NumField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(element, createContext({ x: { type: Number } }));

expect(wrapper.find(NumField)).toHaveLength(1);
expect(wrapper.find(NumField.Component)).toHaveLength(1);
});

test('<AutoField> - renders NestField', () => {
test('<AutoField> - detects NestField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(element, createContext({ x: { type: Object } }));

expect(wrapper.find(NestField)).toHaveLength(1);
});

test('<AutoField> - renders TextField', () => {
test('<AutoField> - detects TextField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(element, createContext({ x: { type: String } }));

expect(wrapper.find(TextField)).toHaveLength(1);
expect(wrapper.find(TextField.Component)).toHaveLength(1);
});

test('<AutoField> - renders BoolField', () => {
test('<AutoField> - detects BoolField', () => {
const element = <AutoField name="x" />;
const wrapper = mount(element, createContext({ x: { type: Boolean } }));

expect(wrapper.find(BoolField)).toHaveLength(1);
expect(wrapper.find(BoolField.Component)).toHaveLength(1);
});

test('<AutoField> - renders Component (model)', () => {
test('<AutoField> - uses Component (schema)', () => {
const Component = jest.fn(() => null);

const element = <AutoField name="x" />;
Expand All @@ -107,7 +107,7 @@ test('<AutoField> - renders Component (model)', () => {
expect(Component).toHaveBeenCalledTimes(1);
});

test('<AutoField> - renders Component (specified)', () => {
test('<AutoField> - uses Component (props)', () => {
const Component = jest.fn(() => null);

const element = <AutoField name="x" component={Component} />;
Expand Down
8 changes: 5 additions & 3 deletions packages/uniforms-bootstrap3/src/AutoField.tsx
Original file line number Diff line number Diff line change
@@ -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';
Expand All @@ -14,7 +14,7 @@ import TextField from './TextField';
export type AutoFieldProps = Override<
Record<string, unknown>,
{
component?: ComponentType<any>;
component?: ComponentType<any> | ReturnType<typeof connectField>;
name: string;
}
>;
Expand Down Expand Up @@ -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);
}
2 changes: 1 addition & 1 deletion packages/uniforms-bootstrap3/src/BoolField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -55,4 +55,4 @@ function Bool(props: BoolFieldProps) {
);
}

export default connectField(Bool);
export default connectField(Bool, { kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-bootstrap3/src/DateField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -69,4 +69,4 @@ function Date({
);
}

export default connectField(Date);
export default connectField(Date, { kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-bootstrap3/src/ErrorField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -35,4 +35,4 @@ function Error({
);
}

export default connectField(Error, { initialValue: false });
export default connectField(Error, { initialValue: false, kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-bootstrap3/src/ListAddField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -57,4 +57,4 @@ ListAdd.defaultProps = {
addIcon: <i className="glyphicon glyphicon-plus" />,
};

export default connectField(ListAdd, { initialValue: false });
export default connectField(ListAdd, { initialValue: false, kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-bootstrap3/src/ListDelField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -56,4 +56,4 @@ ListDel.defaultProps = {
removeIcon: <i className="glyphicon glyphicon-minus" />,
};

export default connectField(ListDel, { initialValue: false });
export default connectField(ListDel, { initialValue: false, kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-bootstrap3/src/LongTextField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -34,4 +34,4 @@ function LongText(props: LongTextFieldProps) {
/>,
);
}
export default connectField(LongText);
export default connectField(LongText, { kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-bootstrap3/src/NumField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -43,4 +43,4 @@ function Num(props: NumFieldProps) {
);
}

export default connectField(Num);
export default connectField(Num, { kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-bootstrap3/src/RadioField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -50,4 +50,4 @@ function Radio(props: RadioFieldProps) {
);
}

export default connectField(Radio);
export default connectField(Radio, { kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-bootstrap3/src/SelectField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -123,4 +123,4 @@ function Select({
);
}

export default connectField(Select);
export default connectField(Select, { kind: 'leaf' });
2 changes: 1 addition & 1 deletion packages/uniforms-bootstrap3/src/TextField.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -35,4 +35,4 @@ function Text(props: TextFieldProps) {
);
}

export default connectField(Text);
export default connectField(Text, { kind: 'leaf' });
Loading

0 comments on commit 09fd494

Please sign in to comment.