How to use the formik.Form function in formik

To help you get started, we’ve selected a few formik 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 artsy / reaction / dist / Apps / Auction / Components / RegistrationForm.js View on Github external
var InnerForm = function InnerForm(props) {
  var touched = props.touched,
      errors = props.errors,
      isSubmitting = props.isSubmitting,
      values = props.values,
      setFieldValue = props.setFieldValue,
      setFieldTouched = props.setFieldTouched;
  return _react.default.createElement(_formik.Form, null, _react.default.createElement(_palette.Box, {
    mt: 4
  }, _react.default.createElement(_palette.Box, {
    mb: 2
  }, _react.default.createElement(_palette.Serif, {
    size: "3t",
    mb: 0.5
  }, "Credit card"), _react.default.createElement(_CreditCardInput.CreditCardInput, {
    error: {
      message: errors.creditCard
    }
  }))), _react.default.createElement(_palette.Box, {
    mt: 4
  }, _react.default.createElement(_palette.Box, {
    mt: 2
  }, _react.default.createElement(_AddressForm.AddressForm, {
    value: values.address,
github artsy / reaction / dist / Apps / Auction / Components / BidForm.js View on Github external
render: function render(_ref3) {
      var values = _ref3.values,
          touched = _ref3.touched,
          errors = _ref3.errors,
          isSubmitting = _ref3.isSubmitting,
          setFieldValue = _ref3.setFieldValue,
          setFieldTouched = _ref3.setFieldTouched,
          status = _ref3.status;
      return _react.default.createElement(_formik.Form, null, _react.default.createElement(_palette.Flex, {
        flexDirection: "column"
      }, _react.default.createElement(_palette.Flex, {
        flexDirection: "column",
        py: 4
      }, _react.default.createElement(_palette.Serif, {
        pb: 0.5,
        size: "4t",
        weight: "semibold",
        color: "black100"
      }, "Set your max bid"), _react.default.createElement(_palette.LargeSelect, {
        selected: values.selectedBid,
        onSelect: function onSelect(value) {
          setFieldValue("selectedBid", value);
          setFieldTouched("selectedBid");
        },
        options: displayIncrements
github xvicmanx / react-crud-table / build / Form / wrappers.js View on Github external
});
exports.Form = undefined;

var _formik = require('formik');

var _bemReactComponentCreator = require('bem-react-component-creator');

var _bemReactComponentCreator2 = _interopRequireDefault(_bemReactComponentCreator);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var _bcc = (0, _bemReactComponentCreator2.default)('crud-modal-form'),
    block = _bcc.block,
    element = _bcc.element;

var Form = exports.Form = block(_formik.Form);

Form.Label = element('label', 'label');
Form.Message = element('div', 'message');
Form.ErrorMessage = element('div', 'error-message');
Form.FieldError = element('div', 'field-error');

exports.default = {
  Form: Form
};