How to use the simple-react-form.FieldType function in simple-react-form

To help you get started, we’ve selected a few simple-react-form examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github nicolaslopezj / simple-react-form / material-ui / lib / fields / select.js View on Github external
fullWidth: true,
            disabled: this.props.disabled
          }, this.passProps),
          this.renderItems()
        ),
        _react2.default.createElement(
          'div',
          { style: _styles2.default.errorMessage },
          this.props.errorMessage
        )
      );
    }
  }]);

  return SelectComponent;
}(_simpleReactForm.FieldType);

SelectComponent.propTypes = propTypes;
SelectComponent.defaultProps = defaultProps;

(0, _simpleReactForm.registerType)({
  type: 'select',
  component: SelectComponent,
  allowedTypes: [String, Number],
  description: 'Simple select field.'
});
github nicolaslopezj / simple-react-form / material-ui / lib / fields / date-picker.js View on Github external
ref: 'input',
        fullWidth: true,
        value: this.props.value,
        floatingLabelText: this.props.useHint ? null : this.props.label,
        hintText: this.props.useHint ? this.props.label : null,
        errorText: this.props.errorMessage,
        disabled: this.props.disabled,
        onChange: function onChange(_, date) {
          return _this2.props.onChange(date);
        }
      }, this.passProps));
    }
  }]);

  return DatePickerComponent;
}(_simpleReactForm.FieldType);

(0, _simpleReactForm.registerType)({
  type: 'date-picker',
  component: DatePickerComponent,
  allowedTypes: [Date],
  description: 'Material UI Date picker.'
});
github nicolaslopezj / simple-react-form / material-ui / lib / fields / checkbox.js View on Github external
return _this2.props.onChange(!_this2.props.value);
          },
          checkedIcon: this.checkedIcon(),
          unCheckedIcon: this.unCheckedIcon()
        }, this.passProps)),
        _react2.default.createElement(
          'span',
          { style: { color: _colors2.default.red500 } },
          this.props.errorMessage
        )
      );
    }
  }]);

  return CheckboxComponent;
}(_simpleReactForm.FieldType);

CheckboxComponent.propTypes = propTypes;
CheckboxComponent.defaultProps = defaultProps;

(0, _simpleReactForm.registerType)({
  type: 'checkbox',
  component: CheckboxComponent,
  allowedTypes: [Boolean],
  description: 'Simple checkbox field.'
});

(0, _simpleReactForm.registerType)({
  type: 'boolean',
  component: CheckboxComponent
});
github nicolaslopezj / simple-react-form / material-ui / lib / fields / textarea.js View on Github external
fullWidth: true,
        multiLine: true,
        value: this.props.value,
        floatingLabelText: this.props.useHint ? null : this.props.label,
        hintText: this.props.useHint ? this.props.label : null,
        errorText: this.props.errorMessage,
        disabled: this.props.disabled,
        onChange: function onChange(event) {
          return _this2.props.onChange(event.target.value);
        }
      }, this.passProps));
    }
  }]);

  return TextareaComponent;
}(_simpleReactForm.FieldType);

TextareaComponent.propTypes = propTypes;
TextareaComponent.defaultProps = defaultProps;

(0, _simpleReactForm.registerType)({
  type: 'textarea',
  component: TextareaComponent,
  allowedTypes: [String],
  description: 'Textarea'
});
github nicolaslopezj / simple-react-form / material-ui / lib / fields / select-with-method.js View on Github external
onBlur: this.onBlur.bind(this),
          open: this.state.open,
          triggerUpdateOnFocus: true,
          disabled: this.props.disabled
        }, this.passProps)),
        _react2.default.createElement(
          'div',
          null,
          this.renderItems()
        )
      );
    }
  }]);

  return SelectWithMethodComponent;
}(_simpleReactForm.FieldType);

SelectWithMethodComponent.propTypes = propTypes;
SelectWithMethodComponent.defaultProps = defaultProps;

(0, _simpleReactForm.registerType)({
  type: 'select-with-method',
  component: SelectWithMethodComponent,
  description: 'A select input that connects to a Meteor Method to fetch data.'
});
github nicolaslopezj / simple-react-form / material-ui / lib / fields / tags.js View on Github external
hintText: this.props.useHint ? this.props.label : null,
          errorText: this.props.errorMessage,
          disabled: this.props.disabled,
          onChange: function onChange(event) {
            return _this3.setState({ value: event.target.value });
          },
          onKeyDown: this.onKeyDown.bind(this),
          onBlur: this.addItem.bind(this)
        }, this.passProps)),
        this.renderItems()
      );
    }
  }]);

  return StringArrayComponent;
}(_simpleReactForm.FieldType);

StringArrayComponent.propTypes = propTypes;
StringArrayComponent.defaultProps = defaultProps;

(0, _simpleReactForm.registerType)({
  type: 'string-array',
  component: StringArrayComponent,
  allowedTypes: [[String]]
});

(0, _simpleReactForm.registerType)({
  type: 'tags',
  component: StringArrayComponent,
  allowedTypes: [[String]],
  description: 'Tags input'
});
github nicolaslopezj / simple-react-form / material-ui / lib / fields / text-field.js View on Github external
type: type,
        floatingLabelText: this.props.useHint ? null : this.props.label,
        hintText: this.props.useHint ? this.props.label : null,
        errorText: this.props.errorMessage,
        disabled: this.props.disabled,
        onChange: this.onChange.bind(this),
        onKeyDown: this.onKeyDown.bind(this),
        onBlur: function onBlur() {
          return _this2.props.onChange(_this2.state.value);
        }
      }, this.passProps));
    }
  }]);

  return TextFieldComponent;
}(_simpleReactForm.FieldType);

TextFieldComponent.propTypes = propTypes;
TextFieldComponent.defaultProps = defaultProps;

(0, _simpleReactForm.registerType)({
  type: 'text',
  component: TextFieldComponent
});

var StringFieldComponent = function (_TextFieldComponent) {
  _inherits(StringFieldComponent, _TextFieldComponent);

  function StringFieldComponent(props) {
    _classCallCheck(this, StringFieldComponent);

    var _this3 = _possibleConstructorReturn(this, Object.getPrototypeOf(StringFieldComponent).call(this, props));
github nicolaslopezj / simple-react-form / material-ui / lib / fields / multiple-checkbox.js View on Github external
'div',
          { style: { marginBottom: 20 } },
          this.props.label
        ),
        _react2.default.createElement(
          'div',
          { style: { color: 'red' } },
          this.props.errorMessage
        ),
        this.renderOptions()
      );
    }
  }]);

  return MultipleCheckboxComponent;
}(_simpleReactForm.FieldType);

MultipleCheckboxComponent.propTypes = propTypes;
MultipleCheckboxComponent.defaultProps = defaultProps;

(0, _simpleReactForm.registerType)({
  type: 'multiple-checkbox',
  component: MultipleCheckboxComponent,
  allowedTypes: [[String], [Number]],
  description: 'Select multiple values with checkboxes.'
});
github nicolaslopezj / simple-react-form / material-ui / lib / fields / files / input.js View on Github external
{ style: _styles2.default.label },
          this.props.label
        ),
        this.renderPreviews(),
        this.renderUploadButton(),
        _react2.default.createElement(
          'div',
          { style: _styles2.default.errorMessage },
          this.props.errorMessage
        )
      );
    }
  }]);

  return Component;
}(_simpleReactForm.FieldType);

exports.default = Component;


(0, _simpleReactForm.registerType)({
  type: 'file',
  component: Component,
  allowedTypes: [Object, [Object]],
  description: 'File field.'
});
github nicolaslopezj / simple-react-form / material-ui / lib / fields / toggle.js View on Github external
disabled: this.props.disabled,
          onToggle: function onToggle() {
            return _this2.props.onChange(!_this2.props.value);
          }
        }, this.passProps)),
        _react2.default.createElement(
          'div',
          { style: styles.errorMessage },
          this.props.errorMessage
        )
      );
    }
  }]);

  return ToggleComponent;
}(_simpleReactForm.FieldType);

ToggleComponent.propTypes = propTypes;
ToggleComponent.defaultProps = defaultProps;

(0, _simpleReactForm.registerType)({
  type: 'toggle',
  component: ToggleComponent,
  allowedTypes: Boolean,
  description: 'Material UI toggle.'
});