Home
Docs
GitHub
Pricing
Blog
Log In

Run Sandworm Audit for your App

Get started
Generated on May 18, 2024 via pnpm
Package summary
Share
0
issues
4
licenses
13
MIT
1
Apache-2.0
1
BSD-3-Clause
1
0BSD
Package created
14 Jun 2017
Version published
17 Sep 2023
Maintainers
1
Total deps
16
Direct deps
9
License
Apache-2.0

Issues

0
This package has no issues

Licenses

MIT License

Permissive
OSI Approved
This is a human-readable summary of (and not a substitute for) the license. Disclaimer.
Can
commercial-use
modify
distribute
sublicense
private-use
Cannot
hold-liable
Must
include-copyright
include-license
13 Packages, Including:
@types/hoist-non-react-statics@3.3.5
@types/prop-types@15.7.12
@types/react@18.3.2
csstype@3.1.3
deepmerge@2.2.1
js-tokens@4.0.0
lodash-es@4.17.21
lodash@4.17.21
loose-envify@1.4.0
react-fast-compare@2.0.4
react-is@16.13.1
react@18.3.1
tiny-warning@1.0.3

Apache License 2.0

Permissive
OSI Approved
This is a human-readable summary of (and not a substitute for) the license. Disclaimer.
Can
commercial-use
modify
distribute
sublicense
private-use
use-patent-claims
place-warranty
Cannot
hold-liable
use-trademark
Must
include-copyright
include-license
state-changes
include-notice
1 Packages, Including:
formik@2.4.5

BSD 3-Clause "New" or "Revised" License

Permissive
OSI Approved
This is a human-readable summary of (and not a substitute for) the license. Disclaimer.
Can
commercial-use
modify
distribute
place-warranty
Cannot
use-trademark
hold-liable
Must
include-copyright
include-license
1 Packages, Including:
hoist-non-react-statics@3.3.2

BSD Zero Clause License

Permissive
OSI Approved
This is a human-readable summary of (and not a substitute for) the license. Disclaimer.
Can
commercial-use
modify
distribute
sublicense
private-use
include-copyright
include-license
include-original
Cannot
hold-liable
Must
1 Packages, Including:
tslib@2.6.2
Disclaimer

This deed highlights only some of the key features and terms of the actual license. It is not a license and has no legal value. You should carefully review all of the terms and conditions of the actual license before using the licensed material.

Sandworm is not a law firm and does not provide legal services. Distributing, displaying, or linking to this deed or the license that it summarizes does not create a lawyer-client or any other relationship.

Direct Dependencies

9
All Dependencies CSV
β“˜ This is a list of formik 's direct dependencies. Data on all dependencies, including transitive ones, is available via CSV download.
NameVersionSizeLicenseTypeVulnerabilities
@types/hoist-non-react-statics3.3.52.04 kBMIT
prod
deepmerge2.2.16.86 kBMIT
prod
hoist-non-react-statics3.3.29.83 kBBSD-3-Clause
prod
lodash-es4.17.21149.12 kBMIT
prod
lodash4.17.21311.49 kBMIT
prod
react-fast-compare2.0.44.58 kBMIT
prod
react18.3.1310.65 kBMIT
prod peer
tiny-warning1.0.33.66 kBMIT
prod
tslib2.6.215.59 kB0BSD
prod

Visualizations

Frequently Asked Questions

What does formik do?

Formik is a renowned npm package designed for building effective forms in React. It simplifies the complex process of handling form states like handling inputs, validation, errors, and form submission. Eliminating the repetitive and tedious tasks involved in creating forms, Formik paves the way for a streamlined web development process. The package is recognized for its blazing-fast speed, contributing to faster page load times and thus improving overall website performance metrics.

How do you use formik?

Formik can be seamlessly integrated with your React project using npm or yarn. To install the package, you need to run the command npm install formik or yarn add formik. Below is a simple example of how you might use Formik to create a form:

import React from 'react';
import { Formik, Field, Form } from 'formik';

// Your validation function
const validate = (values) => {
  const errors = {};
  if (!values.email) {
    errors.email = 'Required';
  }
  return errors;
};

// Your component
const MyForm = () => (
  <div>
    <h1>My Form</h1>
    <Formik
      initialValues={{ email: '' }}
      validate={validate}
      onSubmit={(values, { setSubmitting }) => {
        setTimeout(() => {
          alert(JSON.stringify(values, null, 2));
          setSubmitting(false);
        }, 400);
      }}
    >
      {({ isSubmitting }) => (
        <Form>
          <Field type="email" name="email" />
          <button type="submit" disabled={isSubmitting}>
            Submit
          </button>
        </Form>
      )}
    </Formik>
  </div>
);

export default MyForm;

In this example, you're first importing the required entities from the 'formik' package. Then you're creating a validation function and a form component. The form is then included in the component which uses formik <Formik> with some essential properties like initialValues, validate, and onSubmit.

Where are the formik docs?

For detailed information and additional Formik usage examples, you can head over to the official Formik documentation page at https://formik.org. The webpage provides a comprehensive guide on everything you need to know about Formik, starting from installation to handling complex form structures. Therefore, for getting started with Formik or diving deeper into the understanding of the package, the documentation is the ultimate resource to rely upon.