Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
placeholder={ placeholder }
fullWidth
multiline
inputProps={{
readOnly: isReadOnly,
}}
{ ...rest }
/>
),
[componentTypes.CHECKBOX]: () => (
}
label={ label }
/>
),
[componentTypes.RADIO]: () => (
),
[componentTypes.SELECT_COMPONENT]: () => (
option.hasOwnProperty('value') && option.value !== null)} // eslint-disable-line
placeholder={ placeholder || 'Please choose' }
value={ options.filter(({ value }) => rest.multi ? input.value.includes(value) : value === input.value) }
isMulti={ rest.multi }
component: componentTypes.CHECKBOX,
label: 'Checkbox',
name: 'checkbox',
}]},
variants: [{
name: 'isDisabled',
title: 'Disabled',
}, {
name: 'label',
title: 'Label',
component: 'input',
value: 'Checkbox',
}],
},
{
component: componentTypes.RADIO,
link: `?component=${componentTypes.RADIO}`,
linkText: 'Radio',
ContentText: GenericComponentText,
canBeRequired: true,
value: { fields: [{
component: componentTypes.RADIO,
label: 'Radio',
name: 'radio',
options: [
{ label: 'Dogs', value: '1' },
{ label: 'Cats', value: '2' },
{ label: 'Hamsters', value: '3' },
],
}]},
variants: [{
name: 'isDisabled',
title: 'Disabled',
}, {
name: 'label',
title: 'Label',
component: 'input',
value: 'Checkbox',
}],
},
{
component: componentTypes.RADIO,
link: componentTypes.RADIO,
linkText: 'Radio',
ContentText: GenericComponentText,
canBeRequired: true,
value: { fields: [{
component: componentTypes.RADIO,
label: 'Radio',
name: 'radio',
options: [
{ label: 'Dogs', value: '1' },
{ label: 'Cats', value: '2' },
{ label: 'Hamsters', value: '3' },
],
}]},
variants: [{
name: 'isDisabled',
title: 'Disabled',
}, {
name: 'label',
title: 'Label',
component: 'input',
value: 'Radio',
SwitchField,
DatePickerField,
PlainTextField,
} from './form-fields';
import SubForm from './sub-form';
import Tabs from './tabs';
import Wizard from './wizzard/wizzard';
import Select from './select';
const mapper = {
[componentTypes.TEXT_FIELD]: TextField,
[componentTypes.TEXTAREA_FIELD]: TextareaField,
[componentTypes.SELECT_COMPONENT]: SelectField,
[componentTypes.CHECKBOX]: CheckboxGroup,
[componentTypes.SUB_FORM]: SubForm,
[componentTypes.RADIO]: Radio,
[componentTypes.TABS]: Tabs,
[componentTypes.DATE_PICKER]: DatePickerField,
[componentTypes.TIME_PICKER]: props => <div>time picker</div>,
[componentTypes.SWITCH]: SwitchField,
[componentTypes.WIZARD]: Wizard,
[componentTypes.PLAIN_TEXT]: PlainTextField,
};
export default mapper;
export const components = {
TextField,
TextareaField,
SelectField,
CheckboxGroup,
SubForm,
{
label: 'Two',
value: '2',
},
{
label: 'Three',
value: '3',
},
],
},
{
name: 'radio_button_2',
label: 'Radio Button sorted by',
title: 'Radio Button sorted by',
dataType: 'string',
component: components.RADIO,
options: [
{
label: 'One',
value: '1',
},
{
label: 'Two',
value: '2',
},
{
label: 'Three',
value: '3',
},
],
},
{
{
label: 'Three',
value: '3',
},
{
label: 'Two',
value: '2',
},
],
},
{
name: 'radio_button_3',
label: 'Radio Button',
title: 'Radio Button',
dataType: 'string',
component: components.RADIO,
options: [
{
label: 'One',
value: '1',
},
{
label: 'Two',
value: '2',
},
{
label: 'Three',
value: '3',
},
],
},
{
fieldMapper(componentType)({
...props,
componentType,
id: props.id || props.name,
})
);
FieldInterface.propTypes = {
meta: PropTypes.object,
condition: PropTypes.shape({
when: PropTypes.string.isRequired,
is: PropTypes.oneOfType([ PropTypes.array, PropTypes.string ]).isRequired,
}),
validate: PropTypes.oneOfType([ PropTypes.array, PropTypes.func ]),
componentType: PropTypes.oneOf([
componentTypes.RADIO,
componentTypes.CHECKBOX,
componentTypes.SELECT_COMPONENT,
componentTypes.TEXTAREA_FIELD,
componentTypes.TEXT_FIELD,
componentTypes.DATE_PICKER,
componentTypes.SWITCH,
]).isRequired,
id: PropTypes.string,
name: PropTypes.string.isRequired,
dataType: PropTypes.any,
initialKey: PropTypes.any,
};
export const TextField = props => ;
export const TextAreaField = props => ;
export const CheckboxField = props => ;
{
label: 'Two',
value: '2',
},
{
label: 'Three',
value: '3',
},
],
},
{
name: 'radio_button_2',
label: 'Radio Button sorted by',
title: 'Radio Button sorted by',
dataType: 'string',
component: components.RADIO,
options: [
{
label: 'One',
value: '1',
},
{
label: 'Two',
value: '2',
},
{
label: 'Three',
value: '3',
},
],
},
{
const fieldMapper = type => ({
[componentTypes.RADIO]: FinalFormField,
[componentTypes.CHECKBOX]: CheckboxGroupField,
[componentTypes.SELECT_COMPONENT]: FinalFormField,
[componentTypes.TEXTAREA_FIELD]: FinalFormField,
[componentTypes.TEXT_FIELD]: FinalFormField,
[componentTypes.SWITCH]: FinalFormField,
[componentTypes.DATE_PICKER]: FinalFormField,
})[type];
Radio,
SwitchField,
DatePickerField,
TimePickerField,
PlainTextField,
} from './form-fields';
import SubForm from './sub-form';
import Tabs from './tabs';
const mapper = {
[componentTypes.TEXT_FIELD]: TextField,
[componentTypes.TEXTAREA_FIELD]: TextareaField,
[componentTypes.SELECT_COMPONENT]: SelectField,
[componentTypes.CHECKBOX]: CheckboxGroup,
[componentTypes.SUB_FORM]: SubForm,
[componentTypes.RADIO]: Radio,
[componentTypes.TABS]: Tabs,
[componentTypes.DATE_PICKER]: DatePickerField,
[componentTypes.TIME_PICKER]: TimePickerField,
[componentTypes.SWITCH]: SwitchField,
[componentTypes.PLAIN_TEXT]: PlainTextField,
};
export default mapper;