[ { "path": ".all-contributorsrc", "content": "{\n \"projectName\": \"formik\",\n \"projectOwner\": \"jaredpalmer\",\n \"files\": [\n \"packages/formik/README.md\"\n ],\n \"imageSize\": 100,\n \"commit\": true,\n \"contributors\": [\n {\n \"login\": \"jaredpalmer\",\n \"name\": \"Jared Palmer\",\n \"avatar_url\": \"https://avatars2.githubusercontent.com/u/4060187?v=4\",\n \"profile\": \"http://jaredpalmer.com\",\n \"contributions\": [\n \"question\",\n \"code\",\n \"design\",\n \"doc\",\n \"example\",\n \"ideas\",\n \"review\",\n \"test\"\n ]\n },\n {\n \"login\": \"eonwhite\",\n \"name\": \"Ian White\",\n \"avatar_url\": \"https://avatars0.githubusercontent.com/u/109324?v=4\",\n \"profile\": \"https://www.stardog.io\",\n \"contributions\": [\n \"question\",\n \"bug\",\n \"code\",\n \"doc\",\n \"ideas\",\n \"review\"\n ]\n },\n {\n \"login\": \"Andreyco\",\n \"name\": \"Andrej Badin\",\n \"avatar_url\": \"https://avatars0.githubusercontent.com/u/829963?v=4\",\n \"profile\": \"http://andrejbadin.com\",\n \"contributions\": [\n \"question\",\n \"bug\",\n \"doc\"\n ]\n },\n {\n \"login\": \"skattyadz\",\n \"name\": \"Adam Howard\",\n \"avatar_url\": \"https://avatars2.githubusercontent.com/u/91115?v=4\",\n \"profile\": \"http://adz.co.de\",\n \"contributions\": [\n \"question\",\n \"bug\",\n \"ideas\",\n \"review\"\n ]\n },\n {\n \"login\": \"VladShcherbin\",\n \"name\": \"Vlad Shcherbin\",\n \"avatar_url\": \"https://avatars1.githubusercontent.com/u/6711845?v=4\",\n \"profile\": \"https://github.com/VladShcherbin\",\n \"contributions\": [\n \"question\",\n \"bug\",\n \"ideas\"\n ]\n },\n {\n \"login\": \"brikou\",\n \"name\": \"Brikou CARRE\",\n \"avatar_url\": \"https://avatars3.githubusercontent.com/u/383212?v=4\",\n \"profile\": \"https://github.com/brikou\",\n \"contributions\": [\n \"bug\",\n \"doc\"\n ]\n },\n {\n \"login\": \"skvale\",\n \"name\": \"Sam Kvale\",\n \"avatar_url\": \"https://avatars0.githubusercontent.com/u/5314713?v=4\",\n \"profile\": \"http://skvale.github.io\",\n \"contributions\": [\n \"bug\",\n \"code\",\n \"test\"\n ]\n },\n {\n \"login\": \"jontansey\",\n \"name\": \"Jon Tansey\",\n \"avatar_url\": \"https://avatars0.githubusercontent.com/u/13765558?v=4\",\n \"profile\": \"http://jon.tansey.info\",\n \"contributions\": [\n \"bug\",\n \"code\"\n ]\n },\n {\n \"login\": \"slightlytyler\",\n \"name\": \"Tyler Martinez\",\n \"avatar_url\": \"https://avatars0.githubusercontent.com/u/6819171?v=4\",\n \"profile\": \"http://slightlytyler.com\",\n \"contributions\": [\n \"bug\",\n \"doc\"\n ]\n },\n {\n \"login\": \"MrLoh\",\n \"name\": \"Tobias Lohse\",\n \"avatar_url\": \"https://avatars0.githubusercontent.com/u/1285032?v=4\",\n \"profile\": \"http://MrLoh.se\",\n \"contributions\": [\n \"bug\",\n \"code\"\n ]\n },\n {\n \"login\": \"quantizor\",\n \"name\": \"Evan Jacobs\",\n \"avatar_url\": \"https://avatars.githubusercontent.com/u/570070?v=4\",\n \"profile\": \"https://quantizor.dev\",\n \"contributions\": [\n \"question\",\n \"code\",\n \"design\",\n \"doc\",\n \"example\",\n \"ideas\",\n \"review\",\n \"test\"\n ]\n }\n ],\n \"repoType\": \"github\"\n}\n" }, { "path": ".changeset/README.md", "content": "# Changesets\n\nHello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works\nwith multi-package repos, or single-package repos to help you version and publish your code. You can\nfind the full documentation for it [in our repository](https://github.com/changesets/changesets)\n\nWe have a quick list of common questions to get you started engaging with this project in\n[our documentation](https://github.com/changesets/changesets/blob/master/docs/common-questions.md)\n" }, { "path": ".changeset/config.json", "content": "{\n \"$schema\": \"https://unpkg.com/@changesets/config@1.3.0/schema.json\",\n \"changelog\": [\"@changesets/changelog-github\", { \"repo\": \"formium/formik\" }],\n \"commit\": false,\n \"linked\": [],\n \"access\": \"public\",\n \"baseBranch\": \"main\",\n \"updateInternalDependencies\": \"patch\",\n \"ignore\": []\n}\n" }, { "path": ".codesandbox/ci.json", "content": "{\n \"buildCommand\": \"build:codesandbox\",\n \"node\": \"18\",\n \"packages\": [\"packages/formik\", \"packages/formik-native\"],\n \"sandboxes\": [\"n4sgkx\"]\n}\n" }, { "path": ".eslintrc.js", "content": "module.exports = {\n extends: [\n 'react-app',\n 'prettier/@typescript-eslint',\n 'plugin:prettier/recommended',\n ],\n settings: {\n react: {\n version: 'detect',\n },\n },\n};\n" }, { "path": ".github/CODEOWNERS", "content": "# Learn how to add code owners here:\n# https://help.github.com/en/articles/about-code-owners\n\n* @jaredpalmer @quantizor\n/docs/ @jaredpalmer @quantizor\n/examples/ @jaredpalmer @quantizor" }, { "path": ".github/CODE_OF_CONDUCT.md", "content": "# Contributor Covenant Code of Conduct\n\n## Our Pledge\n\nIn the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, gender identity and expression, level of experience, nationality, personal appearance, race, religion, or sexual identity and orientation.\n\n## Our Standards\n\nExamples of behavior that contributes to creating a positive environment include:\n\n* Using welcoming and inclusive language\n* Being respectful of differing viewpoints and experiences\n* Gracefully accepting constructive criticism\n* Focusing on what is best for the community\n* Showing empathy towards other community members\n\nExamples of unacceptable behavior by participants include:\n\n* The use of sexualized language or imagery and unwelcome sexual attention or advances\n* Trolling, insulting/derogatory comments, and personal or political attacks\n* Public or private harassment\n* Publishing others' private information, such as a physical or electronic address, without explicit permission\n* Other conduct which could reasonably be considered inappropriate in a professional setting\n\n## Our Responsibilities\n\nProject maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior.\n\nProject maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, or to ban temporarily or permanently any contributor for other behaviors that they deem inappropriate, threatening, offensive, or harmful.\n\n## Scope\n\nThis Code of Conduct applies both within project spaces and in public spaces when an individual is representing the project or its community. Examples of representing a project or community include using an official project e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event. Representation of a project may be further defined and clarified by project maintainers.\n\n## Enforcement\n\nInstances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at jared@palmer.net. The project team will review and investigate all complaints, and will respond in a way that it deems appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately.\n\nProject maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership.\n\n## Attribution\n\nThis Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, available at [http://contributor-covenant.org/version/1/4][version]\n\n[homepage]: http://contributor-covenant.org\n[version]: http://contributor-covenant.org/version/1/4/\n" }, { "path": ".github/CONTRIBUTING.md", "content": "# Contributing to Formik\n\n\n\n\n**Table of Contents**\n\n- [Code of Conduct](#code-of-conduct)\n- [Ways to Contribute](#ways-to-contribute)\n- [Working on your first Pull Request?](#working-on-your-first-pull-request)\n- [Sending a Pull Request](#sending-a-pull-request)\n- [Working locally](#working-locally)\n - [Develop](#develop)\n - [Test](#test)\n- [How to increase the chance of a change being accepted?](#how-to-increase-the-chance-of-a-change-being-accepted)\n- [Working locally](#working-locally-1)\n - [Watching / Building packages](#watching--building-packages)\n - [Unit testing](#unit-testing)\n - [Playground / Integration testing](#playground--integration-testing)\n\n\n\n## Code of Conduct\n\nFormik has adopted the [Contributor Covenant](https://www.contributor-covenant.org/) as its Code of Conduct, and we expect project participants to adhere to it.\nPlease read [the full text](/CODE_OF_CONDUCT.md) so that you can understand what actions will and will not be tolerated.\n\n## Ways to Contribute\n\nThere are many ways to contribute to Formik, code contribution is one aspect of it.\n\n- **Spread the word** - Evangelize Formik by linking to https://formik.org on your website, every backlink matters. Follow us on [Twitter](https://twitter.com/formiumhq), like and retweet the important news. Or just talk about us with your friends.\n- **Give us feedback.** Tell us what we're doing well or where we can improve. Please upvote (👍) the issues that you are the most interested in seeing solved.\n- **Help new users.** You can answer questions on StackOverflow or GitHub Discussions\n- **Make changes happen.** Suggest changes to the documentation or code.\n- **Write guides** If you come with a cool workflow, write about and we'll feature it in the blog or on the resources page\n- **Report bugs** or missing features by creating an issue.\n- **Review and comment** on existing pull requests and issues.\n\n## Working on your first Pull Request?\n\nYou can learn how from this free video series:\n\n[How to Contribute to a Project on GitHub](https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github)\n\nTo help you get your feet wet and get you familiar with our contribution process, we have a list of [good first issues](https://github.com/formium/formik/issues?q=is:open+is:issue+label:\"good+first+issue\") that contain changes that have a relatively limited scope. This label means that there is already a working solution to the issue in the discussion section. Therefore, it is a great place to get started.\n\nIf you decide to fix an issue, please be sure to check the comment thread in case somebody is already working on a fix. If nobody is working on it at the moment, please leave a comment stating that you have started to work on it so other people don't accidentally duplicate your effort.\n\nIf somebody claims an issue but doesn't follow up for more than a week, it's fine to take it over but you should still leave a comment.\nIf there has been no activity on the issue for 7 to 14 days, it is safe to assume that nobody is working on it.\n\n## Sending a Pull Request\n\nFormik is a community project, so [Pull Requests](https://docs.github.com/en/free-pro-team@latest/github/collaborating-with-issues-and-pull-requests/creating-a-pull-request) are always welcome, but, before working on a large change, it is best to open an issue first to discuss it with the maintainers.\n\nWhen in doubt, keep your Pull Requests small. To give a Pull Request the best chance of getting accepted, don't bundle more than one feature or bug fix per Pull Request. It's often best to create two smaller Pull Requests than one big one.\n\n1. [Fork the repository](https://docs.github.com/en/free-pro-team@latest/github/getting-started-with-github/fork-a-repo).\n\n2. Clone the fork to your local machine and add upstream remote:\n\n```sh\ngit clone https://github.com//formik.git\ncd formik\ngit remote add upstream https://github.com/formik/formik.git\n```\n\n3. Synchronize your local `next` branch with the upstream one:\n\n```sh\ngit checkout main\ngit pull upstream main\n```\n\n4. Install the dependencies with [yarn](https://yarnpkg.com) (npm isn't supported):\n\n```sh\nyarn install\n```\n\n5. Create a new topic branch:\n\n```sh\ngit checkout -b my-topic-branch\n```\n\n6. Make changes, commit and push to your fork:\n\n```sh\ngit push -u origin HEAD\n```\n\n7. Go to [the repository](https://github.com/formium/formik) and [make a Pull Request](https://docs.github.com/en/free-pro-team@latest/github/collaborating-with-issues-and-pull-requests/creating-a-pull-request).\n\nThe core team is monitoring for Pull Requests. We will review your Pull Request and either merge it, request changes to it, or close it with an explanation.\n\n## Working locally\n\nThe repo is managed with Lerna, Yarn Workspaces, and TSDX.\n\n### Develop\n\n```shell\nyarn install\nyarn dev\n```\n\n### Test\n\nRuns jest on all projects\n\n```\nyarn test\n```\n\n## How to increase the chance of a change being accepted?\n\nThe continuous integration service runs a series of checks automatically when a Pull Request is opened. If you're not\nsure if your changes will pass, you can always open a Pull Request and the GitHub UI will display a summary of\nthe results. If any of them fail, refer to [Checks and how to fix them](#checks-and-how-to-fix-them).\n\nMake sure the following is true:\n\n- The branch is targeted at `main` for ongoing development. We do our best to keep `main` in good shape, with all tests passing. Code that lands in `main` must be compatible with the latest stable release. It may contain additional features, but no breaking changes. We should be able to release a new minor version from the tip of `main` at any time.\n- If a feature is being added:\n - If the result was already achievable with the library, explain why this feature needs to be added.\n - If this is a common use case, consider adding an example to the documentation.\n- When adding new features or modifying existing, please include tests to confirm the new behavior.\n- The branch is not behind its target. (We use https://kodiakhq.com) to try to automate this process for you.\n\nBecause we will only merge a Pull Request for which all tests pass. The following items need to be correct. We will provide assistance if not:\n\n- The code is formatted (run `yarn format`).\n- The code is linted (run `yarn lint`).\n- The Pull Request title is written imperatively. See [How to Write a Git Commit Message](https://chris.beams.io/posts/git-commit/#imperative) for a great explanation)\n- If you have made a change that impacts semantic versioning, include a [changeset](../.changeset/README.md) by running `yarn changeset` and describing the change you've made. These get rolled together into release notes.\n\n## Working locally\n\n### Watching / Building packages\n\n```\nyarn dev\n```\n\n### Unit testing\n\nThis will run `Jest` unit tests\n\n```\nyarn test\n```\n\n### Playground / Integration testing\n\nThere is a Next.js playground that also serves as the app used for integration tests. What's cool is you can run Formik's build setup, next.js, and playwright all at the same time and everything will just magically \"work\" and live reload whenever you make a change.\nThis is the suggested development workflow going forward.\n\n1. From the root, open a terminal and run `yarn dev` to start [TSDX](https://tsdx.io) watch on all packages\n2. Then start the playground app with `yarn start:app` in another terminal window (it will boot to http://localhost:3000)\n3. And finally, you can open a third tab to run playwright\n - You can use playwright UI using `yarn e2e:ui`\n - Or, if you'd rather not deal GUI, just run `yarn e2e`\n" }, { "path": ".github/FUNDING.yml", "content": "# These are supported funding model platforms\n\ngithub: [jaredpalmer] # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2]\npatreon: # Replace with a single Patreon username\nopen_collective: formik\nko_fi: # Replace with a single Ko-fi username\ntidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel\ncommunity_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry\nliberapay: # Replace with a single Liberapay username\nissuehunt: # Replace with a single IssueHunt username\notechie: # Replace with a single Otechie username\ncustom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2']\n" }, { "path": ".github/ISSUE_TEMPLATE/1.Bug-report.md", "content": "---\nname: Bug report\nabout: Create a bug report for Formik / examples\ntitle: ''\nlabels: 'Type: Bug'\nassignees: ''\n---\n\n## Bug report\n\n### Current Behavior\n\n\n\n### Expected behavior\n\n\n\n### Reproducible example\n\n\n\n\n\n\n\n### Suggested solution(s)\n\n\n\n### Additional context\n\n\n\n### Your environment\n\n\n\n| Software | Version(s) |\n| ---------------- | ---------- |\n| Formik |\n| React |\n| TypeScript |\n| Browser |\n| npm/Yarn |\n| Operating System |\n" }, { "path": ".github/ISSUE_TEMPLATE/2.Feature-request.md", "content": "---\nname: Feature request\nabout: Request a new feature for Formik\ntitle: ''\nlabels: 'Type: Feature Request'\nassignees: ''\n---\n\n## Feature request\n\n### Current Behavior\n\n\n\n### Desired Behavior\n\n\n\n### Suggested Solution\n\n\n\n\n\n### Who does this impact? Who is this for?\n\n\n\n### Describe alternatives you've considered\n\n\n\n### Additional context\n\n\n" }, { "path": ".github/ISSUE_TEMPLATE/config.yml", "content": "blank_issues_enabled: false\ncontact_links:\n - name: Ask a question\n url: https://github.com/formium/formik/discussions\n about: Ask questions and discuss with other community members\n - name: Join the Discord server\n url: https://discord.gg/pJSg287\n about: Chat with other community members in real-time\n" }, { "path": ".github/workflows/ci.yml", "content": "name: ci\n\non:\n pull_request:\n push:\n branches: [main]\n\njobs:\n detectChangedSourceFiles:\n name: 'determine changes'\n runs-on: ubuntu-latest\n outputs:\n changes: ${{ steps.changed-files-yaml.outputs.any_changed }}\n steps:\n - uses: actions/checkout@v4\n - name: Detect changed files\n id: changed-files-yaml\n uses: tj-actions/changed-files@v45\n with:\n files: |\n .github/workflows/ci.yml\n packages/formik/src/**\n packages/formik/package.json\n packages/formik-native/src/**\n packages/formik-native/package.json\n\n benchmark:\n if: always() && needs.detectChangedSourceFiles.outputs.changes == 'true'\n needs: detectChangedSourceFiles\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v4\n\n - uses: actions/setup-node@v4\n with:\n cache: yarn\n node-version-file: .nvmrc\n\n - name: Install & build\n run: |\n node --version\n npm --version\n yarn --version\n yarn install --frozen-lockfile\n yarn build:benchmark\n\n - name: Download previous benchmark data\n uses: actions/cache@v4\n with:\n path: ./benchmark-cache\n key: ${{ runner.os }}-benchmark\n\n - name: Run benchmark\n run: yarn benchmark\n\n - name: Store benchmark result\n uses: benchmark-action/github-action-benchmark@v1\n with:\n tool: benchmarkjs\n external-data-json-path: ./benchmark-cache/benchmark-data.json\n output-file-path: output.txt\n # comment for PRs that's updated with current perf relative to baseline (main)\n summary-always: true\n # warn if slowness is detected; might be transient on rerun\n alert-threshold: 110%\n comment-on-alert: true\n fail-on-alert: true\n # if things get considerably slower, deny the PR\n fail-threshold: 120%\n # needed for commenting on PRs\n github-token: ${{ secrets.GITHUB_TOKEN }}\n\n interaction:\n needs: detectChangedSourceFiles\n if: always() && needs.detectChangedSourceFiles.outputs.changes == 'true'\n timeout-minutes: 10\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v4\n - uses: actions/setup-node@v4\n with:\n cache: yarn\n node-version-file: .nvmrc\n\n - name: Install dependencies\n run: yarn install --frozen-lockfile\n\n - name: Get installed Playwright version\n id: playwright-version\n run: echo \"PLAYWRIGHT_VERSION=$(node -e \"console.log(require('./package-lock.json').dependencies['@playwright/test'].version)\")\" >> $GITHUB_ENV\n\n - name: Cache playwright binaries\n uses: actions/cache@v4\n id: playwright-cache\n with:\n path: |\n ~/.cache/ms-playwright\n key: ${{ runner.os }}-playwright-${{ env.PLAYWRIGHT_VERSION }}\n\n - name: Install Playwright Browsers\n run: yarn playwright install --with-deps\n if: steps.playwright-cache.outputs.cache-hit != 'true'\n - run: yarn playwright install-deps\n if: steps.playwright-cache.outputs.cache-hit != 'true'\n\n - name: Run Playwright tests\n run: yarn playwright test\n - uses: actions/upload-artifact@v4\n if: always()\n with:\n name: playwright-report\n path: playwright-report/\n retention-days: 5\n\n size:\n needs: detectChangedSourceFiles\n if: always() && needs.detectChangedSourceFiles.outputs.changes == 'true'\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v4\n with:\n fetch-depth: 1\n - uses: preactjs/compressed-size-action@v2\n with:\n repo-token: '${{ secrets.GITHUB_TOKEN }}'\n build-script: 'turbo run build --filter {./packages/*}...'\n\n unit:\n needs: detectChangedSourceFiles\n if: always() && needs.detectChangedSourceFiles.outputs.changes == 'true'\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v4\n - uses: actions/setup-node@v4\n with:\n cache: yarn\n node-version-file: .nvmrc\n - name: Install deps, build, and test\n run: |\n node --version\n npm --version\n yarn --version\n yarn install --frozen-lockfile\n yarn test --coverage\n env:\n CI: true\n NODE_OPTIONS: --max-old-space-size=4096" }, { "path": ".github/workflows/release.yml", "content": "name: Release\non:\n push:\n branches:\n - main\n - next\njobs:\n release:\n runs-on: ubuntu-latest\n if: github.repository == 'jaredpalmer/formik'\n steps:\n - uses: actions/checkout@v4\n with:\n fetch-depth: 0\n\n - uses: actions/setup-node@v4\n with:\n cache: yarn\n node-version-file: .nvmrc\n\n - name: Install Dependencies\n run: yarn install\n\n - name: Create Release Pull Request or Publish to npm\n uses: changesets/action@v1.5.3\n with:\n publish: yarn release\n env:\n GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}\n NPM_TOKEN: ${{ secrets.NPM_TOKEN }}\n" }, { "path": ".github/workflows/stale.yml", "content": "name: \"Close stale issues/prs\"\non:\n schedule:\n - cron: \"1 0 * * *\"\n\njobs:\n stale:\n runs-on: ubuntu-latest\n steps:\n - uses: actions/stale@v9\n with:\n repo-token: ${{ secrets.GITHUB_TOKEN }}\n days-before-stale: 30\n days-before-close: 60\n stale-issue-label: \"stale\"\n stale-pr-label: \"stale\"\n stale-pr-message: \"This pull request is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 60 days\"\n stale-issue-message: \"This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 60 days\"\n any-of-labels: \"Resolution: Duplicate,Resolution: Invalid,Resolution: Support Redirect,Resolution: Unsolved,Resolution: User Land,Resolution: Wontfix,Resolution: Workaround,Status: Author Feedback,Status: Needs More Information\"\n" }, { "path": ".gitignore", "content": "dist\ncompiled\n*.log\ncoverage\n.DS_Store\nnext.d.ts\nlegacy.d.ts\n.idea\n*.orig\noutput.txt\n\nnode_modules\npackage-lock.json\nyarn.lock\n!/docs/yarn.lock\n!/yarn.lock\n\nwebsite/translated_docs\nwebsite/build\n!website/yarn.lock\nwebsite/node_modules\nwebsite/i18n\n!website2/yarn.lock\n.env\n.vercel\n/test-results/\n/playwright-report/\n/playwright/.cache/\n# Turborepo cache\n.turbo\n" }, { "path": ".kodiak.toml", "content": "# .kodiak.toml\nversion = 1\n\n[merge]\nautomerge_label = \"automerge\"\nrequire_automerge_label = false\nmethod = \"squash\"\ndelete_branch_on_merge = true\noptimistic_updates = true\nprioritize_ready_to_merge = true\nnotify_on_conflict = false\n\n[merge.message]\ntitle = \"pull_request_title\"\nbody = \"pull_request_body\"\ninclude_pr_number = true\nbody_type = \"markdown\"\nstrip_html_comments = true" }, { "path": ".nvmrc", "content": "v18\n" }, { "path": ".prettierrc", "content": "{\n \"tabWidth\": 2,\n \"trailingComma\": \"es5\",\n \"semi\": true,\n \"singleQuote\": true,\n \"arrowParens\": \"avoid\"\n}\n" }, { "path": ".vscode/settings.json", "content": "{\n \"typescript.tsdk\": \"node_modules/typescript/lib\",\n \"editor.formatOnSave\": false,\n \"editor.codeActionsOnSave\": {\n \"source.fixAll.eslint\": \"explicit\"\n },\n}\n" }, { "path": "LICENSE", "content": " Apache License\n Version 2.0, January 2004\n https://www.apache.org/licenses/\n\nTERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION\n\n1. Definitions.\n\n \"License\" shall mean the terms and conditions for use, reproduction,\n and distribution as defined by Sections 1 through 9 of this document.\n\n \"Licensor\" shall mean the copyright owner or entity authorized by\n the copyright owner that is granting the License.\n\n \"Legal Entity\" shall mean the union of the acting entity and all\n other entities that control, are controlled by, or are under common\n control with that entity. For the purposes of this definition,\n \"control\" means (i) the power, direct or indirect, to cause the\n direction or management of such entity, whether by contract or\n otherwise, or (ii) ownership of fifty percent (50%) or more of the\n outstanding shares, or (iii) beneficial ownership of such entity.\n\n \"You\" (or \"Your\") shall mean an individual or Legal Entity\n exercising permissions granted by this License.\n\n \"Source\" form shall mean the preferred form for making modifications,\n including but not limited to software source code, documentation\n source, and configuration files.\n\n \"Object\" form shall mean any form resulting from mechanical\n transformation or translation of a Source form, including but\n not limited to compiled object code, generated documentation,\n and conversions to other media types.\n\n \"Work\" shall mean the work of authorship, whether in Source or\n Object form, made available under the License, as indicated by a\n copyright notice that is included in or attached to the work\n (an example is provided in the Appendix below).\n\n \"Derivative Works\" shall mean any work, whether in Source or Object\n form, that is based on (or derived from) the Work and for which the\n editorial revisions, annotations, elaborations, or other modifications\n represent, as a whole, an original work of authorship. For the purposes\n of this License, Derivative Works shall not include works that remain\n separable from, or merely link (or bind by name) to the interfaces of,\n the Work and Derivative Works thereof.\n\n \"Contribution\" shall mean any work of authorship, including\n the original version of the Work and any modifications or additions\n to that Work or Derivative Works thereof, that is intentionally\n submitted to Licensor for inclusion in the Work by the copyright owner\n or by an individual or Legal Entity authorized to submit on behalf of\n the copyright owner. For the purposes of this definition, \"submitted\"\n means any form of electronic, verbal, or written communication sent\n to the Licensor or its representatives, including but not limited to\n communication on electronic mailing lists, source code control systems,\n and issue tracking systems that are managed by, or on behalf of, the\n Licensor for the purpose of discussing and improving the Work, but\n excluding communication that is conspicuously marked or otherwise\n designated in writing by the copyright owner as \"Not a Contribution.\"\n\n \"Contributor\" shall mean Licensor and any individual or Legal Entity\n on behalf of whom a Contribution has been received by Licensor and\n subsequently incorporated within the Work.\n\n2. Grant of Copyright License. Subject to the terms and conditions of\n this License, each Contributor hereby grants to You a perpetual,\n worldwide, non-exclusive, no-charge, royalty-free, irrevocable\n copyright license to reproduce, prepare Derivative Works of,\n publicly display, publicly perform, sublicense, and distribute the\n Work and such Derivative Works in Source or Object form.\n\n3. Grant of Patent License. Subject to the terms and conditions of\n this License, each Contributor hereby grants to You a perpetual,\n worldwide, non-exclusive, no-charge, royalty-free, irrevocable\n (except as stated in this section) patent license to make, have made,\n use, offer to sell, sell, import, and otherwise transfer the Work,\n where such license applies only to those patent claims licensable\n by such Contributor that are necessarily infringed by their\n Contribution(s) alone or by combination of their Contribution(s)\n with the Work to which such Contribution(s) was submitted. If You\n institute patent litigation against any entity (including a\n cross-claim or counterclaim in a lawsuit) alleging that the Work\n or a Contribution incorporated within the Work constitutes direct\n or contributory patent infringement, then any patent licenses\n granted to You under this License for that Work shall terminate\n as of the date such litigation is filed.\n\n4. Redistribution. You may reproduce and distribute copies of the\n Work or Derivative Works thereof in any medium, with or without\n modifications, and in Source or Object form, provided that You\n meet the following conditions:\n\n (a) You must give any other recipients of the Work or\n Derivative Works a copy of this License; and\n\n (b) You must cause any modified files to carry prominent notices\n stating that You changed the files; and\n\n (c) You must retain, in the Source form of any Derivative Works\n that You distribute, all copyright, patent, trademark, and\n attribution notices from the Source form of the Work,\n excluding those notices that do not pertain to any part of\n the Derivative Works; and\n\n (d) If the Work includes a \"NOTICE\" text file as part of its\n distribution, then any Derivative Works that You distribute must\n include a readable copy of the attribution notices contained\n within such NOTICE file, excluding those notices that do not\n pertain to any part of the Derivative Works, in at least one\n of the following places: within a NOTICE text file distributed\n as part of the Derivative Works; within the Source form or\n documentation, if provided along with the Derivative Works; or,\n within a display generated by the Derivative Works, if and\n wherever such third-party notices normally appear. The contents\n of the NOTICE file are for informational purposes only and\n do not modify the License. You may add Your own attribution\n notices within Derivative Works that You distribute, alongside\n or as an addendum to the NOTICE text from the Work, provided\n that such additional attribution notices cannot be construed\n as modifying the License.\n\n You may add Your own copyright statement to Your modifications and\n may provide additional or different license terms and conditions\n for use, reproduction, or distribution of Your modifications, or\n for any such Derivative Works as a whole, provided Your use,\n reproduction, and distribution of the Work otherwise complies with\n the conditions stated in this License.\n\n5. Submission of Contributions. Unless You explicitly state otherwise,\n any Contribution intentionally submitted for inclusion in the Work\n by You to the Licensor shall be under the terms and conditions of\n this License, without any additional terms or conditions.\n Notwithstanding the above, nothing herein shall supersede or modify\n the terms of any separate license agreement you may have executed\n with Licensor regarding such Contributions.\n\n6. Trademarks. This License does not grant permission to use the trade\n names, trademarks, service marks, or product names of the Licensor,\n except as required for reasonable and customary use in describing the\n origin of the Work and reproducing the content of the NOTICE file.\n\n7. Disclaimer of Warranty. Unless required by applicable law or\n agreed to in writing, Licensor provides the Work (and each\n Contributor provides its Contributions) on an \"AS IS\" BASIS,\n WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or\n implied, including, without limitation, any warranties or conditions\n of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A\n PARTICULAR PURPOSE. You are solely responsible for determining the\n appropriateness of using or redistributing the Work and assume any\n risks associated with Your exercise of permissions under this License.\n\n8. Limitation of Liability. In no event and under no legal theory,\n whether in tort (including negligence), contract, or otherwise,\n unless required by applicable law (such as deliberate and grossly\n negligent acts) or agreed to in writing, shall any Contributor be\n liable to You for damages, including any direct, indirect, special,\n incidental, or consequential damages of any character arising as a\n result of this License or out of the use or inability to use the\n Work (including but not limited to damages for loss of goodwill,\n work stoppage, computer failure or malfunction, or any and all\n other commercial damages or losses), even if such Contributor\n has been advised of the possibility of such damages.\n\n9. Accepting Warranty or Additional Liability. While redistributing\n the Work or Derivative Works thereof, You may choose to offer,\n and charge a fee for, acceptance of support, warranty, indemnity,\n or other liability obligations and/or rights consistent with this\n License. However, in accepting such obligations, You may act only\n on Your own behalf and on Your sole responsibility, not on behalf\n of any other Contributor, and only if You agree to indemnify,\n defend, and hold each Contributor harmless for any liability\n incurred by, or claims asserted against, such Contributor by reason\n of your accepting any such warranty or additional liability.\n\nEND OF TERMS AND CONDITIONS\n\nCopyright 2020 Formik, Inc.\n\nLicensed under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License.\nYou may obtain a copy of the License at\n\n https://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\nSee the License for the specific language governing permissions and\nlimitations under the License.\n" }, { "path": "SECURITY.md", "content": "# Security Policy\n\n## Supported Versions\n\n| Version | Supported |\n| ------- | ------------------ |\n| 2.x.x | :white_check_mark: |\n| 1.5.x | :white_check_mark: |\n| <= 1.4 | :x: |\n\n## Reporting a Vulnerability\n\nSend a Twitter DM to [@jaredpalmer](http://twitter.com/@jaredpalmer) or an email to security@jaredpalmer.com\n\n" }, { "path": "app/.gitignore", "content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\n# local env files\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\n# vercel\n.vercel\n" }, { "path": "app/README.md", "content": "# Formik Integration Test App\n\nThis is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n" }, { "path": "app/next-env.d.ts", "content": "/// \n/// \n\n// NOTE: This file should not be edited\n// see https://nextjs.org/docs/basic-features/typescript for more information.\n" }, { "path": "app/package.json", "content": "{\n \"name\": \"app\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"scripts\": {\n \"dev\": \"next dev\",\n \"build\": \"next build\",\n \"start\": \"next start\"\n },\n \"dependencies\": {\n \"formik\": \"latest\",\n \"next\": \"^12.0.0\",\n \"react\": \"^17.0.1\",\n \"react-dom\": \"^17.0.1\",\n \"yup\": \"^0.29.3\"\n },\n \"devDependencies\": {\n \"typescript\": \"^4.0.0\"\n }\n}\n" }, { "path": "app/pages/_app.js", "content": "import React from 'react';\nimport '../styles/globals.css';\n\nfunction MyApp({ Component, pageProps }) {\n return ;\n}\n\nexport default MyApp;\n" }, { "path": "app/pages/basic.js", "content": "import React from 'react';\nimport { Formik, Field, Form, ErrorMessage } from 'formik';\nimport * as Yup from 'yup';\n\nconst Basic = () => {\n const renderCount = React.useRef(0);\n return (\n
\n

Sign Up

\n {\n await new Promise(r => setTimeout(r, 500));\n alert(JSON.stringify(values, null, 2));\n }}\n >\n
\n \n \n\n \n \n\n \n \n\n \n\n
Checkbox Group
\n
\n \n \n \n
\n
Picked
\n
\n \n \n
\n \n
{renderCount.current++}
\n \n \n
\n );\n};\n\nexport default Basic;\n" }, { "path": "app/pages/index.tsx", "content": "import React from 'react';\nimport Link from 'next/link';\n\nfunction Home() {\n return (\n
\n

Formik Examples and Fixtures

\n
    \n
  • \n Basic\n
    • \n
  • \n Async Submission\n
    • \n
\n \n
\n );\n}\n\nexport default Home;\n" }, { "path": "app/pages/sign-in.js", "content": "import React, { useEffect, useState } from 'react';\nimport { ErrorMessage, Field, Form, FormikProvider, useFormik } from 'formik';\nimport * as Yup from 'yup';\nimport { useRouter } from 'next/router';\n\nconst SignIn = () => {\n const router = useRouter();\n const [errorLog, setErrorLog] = useState([]);\n\n const formik = useFormik({\n validateOnMount: router.query.validateOnMount === 'true',\n validateOnBlur: router.query.validateOnBlur !== 'false',\n validateOnChange: router.query.validateOnChange !== 'false',\n initialValues: { username: '', password: '' },\n validationSchema: Yup.object().shape({\n username: Yup.string().required('Required'),\n password: Yup.string().required('Required'),\n }),\n onSubmit: async values => {\n await new Promise(r => setTimeout(r, 500));\n alert(JSON.stringify(values, null, 2));\n },\n });\n\n useEffect(() => {\n if (formik.errors.username && formik.touched.username) {\n setErrorLog(logs => [\n ...logs,\n {\n name: 'username',\n value: formik.values.username,\n error: formik.errors.username,\n },\n ]);\n }\n\n if (formik.errors.password && formik.touched.password) {\n setErrorLog(logs => [\n ...logs,\n {\n name: 'password',\n value: formik.values.password,\n error: formik.errors.password,\n },\n ]);\n }\n }, [\n formik.values.username,\n formik.errors.username,\n formik.touched.username,\n formik.values.password,\n formik.errors.password,\n formik.touched.password,\n ]);\n\n return (\n
\n

Sign In

\n\n \n
\n
\n \n \n
\n\n
\n \n \n
\n\n \n\n {\n setErrorLog([]);\n }}\n >\n Reset\n \n\n 
{JSON.stringify(errorLog, null, 2)}
\n \n
\n
\n );\n};\n\nexport default SignIn;\n" }, { "path": "app/styles/globals.css", "content": "html,\nbody {\n padding: 0;\n margin: 0;\n font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,\n Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;\n}\n\na {\n color: inherit;\n text-decoration: none;\n}\n\n* {\n box-sizing: border-box;\n}\n" }, { "path": "app/tsconfig.json", "content": "{\n \"extends\": \"../tsconfig.base.json\",\n \"compilerOptions\": {\n \"target\": \"es5\",\n \"lib\": [\n \"dom\",\n \"dom.iterable\",\n \"esnext\"\n ],\n \"jsx\": \"preserve\",\n \"allowJs\": true,\n \"skipLibCheck\": true,\n \"forceConsistentCasingInFileNames\": true,\n \"noEmit\": true,\n \"moduleResolution\": \"node\",\n \"resolveJsonModule\": true,\n \"isolatedModules\": true,\n \"incremental\": true\n },\n \"include\": [\n \"next-env.d.ts\",\n \"**/*.ts\",\n \"**/*.tsx\"\n ],\n \"exclude\": [\n \"node_modules\"\n ]\n}\n" }, { "path": "docs/3rd-party-bindings.md", "content": "---\ntitle: 3rd Party Bindings\noriginal_id: 3rd-party-bindings\ndescription: Use Formik with popular React component libraries like Material UI, Bootstrap, AntD, Semantic UI, and more.\n---\n\nIf you would like to use Formik with a UI framework, you'll probably want to create a wrapper component that binds Formik's props and callbacks.\n\nA few popular frameworks have open source wrappers readily available:\n\n- [Ant Design](https://github.com/jannikbuschke/formik-antd)\n- [Fabric](https://github.com/kmees/formik-office-ui-fabric-react)\n- [Material UI](https://github.com/stackworx/formik-material-ui)\n- [Reactstrap](https://github.com/shoaibkhan94/reactstrap-formik)\n- [Semantic UI 2.0](https://github.com/JT501/formik-semantic-ui-react)\n- [Semantic UI](https://github.com/turner-industries/formik-semantic-ui)\n" }, { "path": "docs/api/connect.md", "content": "---\nid: connect\ntitle: connect()\n---\n\n`connect()` is a higher-order component (HoC) that allows you to hook anything into Formik's context. It is used internally to construct `` and `
`, but you can use it to build out new components as your needs change.\n\n## Type signature\n\n```tsx\nconnect(Comp: React.ComponentType }>) => React.ComponentType\n```\n\n## Example\n\n```jsx\nimport React from 'react';\nimport { connect, getIn } from 'formik';\n\n// This component renders an error message if a field has\n// an error and it's already been touched.\nconst ErrorMessage = props => {\n // All FormikProps available on props.formik!\n const error = getIn(props.formik.errors, props.name);\n const touch = getIn(props.formik.touched, props.name);\n return touch && error ? error : null;\n};\n\nexport default connect(ErrorMessage);\n```\n" }, { "path": "docs/api/errormessage.md", "content": "---\nid: errormessage\ntitle: \n---\n\n`` is a component that renders the error message of a given field if that field has been visited (i.e.`touched[name] === true`) (and there is an `error` message present). It expects that all error messages are stored for a given field as a string. Like ``, ``, and ``, lodash-like dot path and bracket syntax is supported.\n\n## Example\n\n```diff\nimport React from 'react';\nimport { Formik, Form, Field, ErrorMessage } from 'formik';\nimport * as Yup from \"yup\";\n\nconst SignupSchema = Yup.object().shape({\n name: Yup.string()\n .min(2, 'Too Short!')\n .max(70, 'Too Long!')\n .required('Required'),\n email: Yup.string()\n .email('Invalid email')\n .required('Required'),\n});\n\nexport const ValidationSchemaExample = () => (\n
\n

Signup

\n {\n // same shape as initial values\n console.log(values);\n }}\n >\n {({ errors, touched }) => (\n \n \n- {errors.name && touched.name ? (\n-
{errors.name}
\n- ) : null}\n+ \n \n- {errors.email && touched.email ? (\n-
{errors.email}
\n- ) : null}\n+ \n \n \n )}\n \n
\n);\n```\n\n#### Props\n\n---\n\n# Reference\n\n## Props\n\n### `children`\n\n`children?: ((message: string) => React.ReactNode)`\n\nA function that returns a valid React element. Will only be called when the field has been touched and an error exists.\n\n```jsx\n// the render callback will only be called when the\n// field has been touched and an error exists and subsequent updates.\n{msg =>
{msg}
}\n```\n\n### `component`\n\n`component?: string | React.ComponentType`\n\nEither a React component or the name of an HTML element to render. If not specified, `` will just return a string.\n\n```jsx\n\n// --> {touched.email && error.email ?
{error.email}
: null}\n\n\n// --> {touched.email && error.email ? {error.email} : null}\n\n\n// --> {touched.email && error.email ? {error.email} : null}\n\n\n// This will return a string. React 16+.\n// --> {touched.email && error.email ? error.email : null}\n```\n\n### `id`\n\n`id?: string`\n\nA field's id in Formik state. To get access to DOM elements for e2e testing purposes, it doesn't impact the implementation in any way as the prop can still be omitted. \n```jsx\n// id will be used only for testing purposes\n// not contributing anything to the core implementation.\n\n```\n\n### `name`\n\n`name: string`\n**Required**\n\nA field's name in Formik state. To access nested objects or arrays, name can also accept lodash-like dot path like `social.facebook` or `friends[0].firstName`\n\n### `render`\n\n`render?: (error: string) => React.ReactNode`\n\nA function that returns a valid React element. Will only be called when the field has been touched and an error exists.\n\n```jsx\n// the render callback will only be called when the\n// field has been touched and an error exists and subsequent updates.\n
{msg}
} />\n```\n" }, { "path": "docs/api/fastfield.md", "content": "---\nid: fastfield\ntitle: \n---\n\n## Before we start\n\n`` is meant for performance _optimization_. However, you really do not need to use it until you do. Only proceed if you are familiar with how React's [`shouldComponentUpdate()`](https://reactjs.org/docs/react-component.html#shouldcomponentupdate) works. You have been warned.\n\n**No. Seriously. Please review the following parts of the official React documentation before continuing**\n\n- [React `shouldComponentUpdate()` Reference](https://reactjs.org/docs/react-component.html#shouldcomponentupdate)\n- [`shouldComponentUpdate` in Action](https://reactjs.org/docs/optimizing-performance.html#shouldcomponentupdate-in-action)\n\n## Overview\n\n`` is an optimized version of `` meant to be used on large forms (~30+ fields) or when a field has very expensive validation requirements. `` has the same exact API as ``, but implements `shouldComponentUpdate()` internally to block all additional re-renders unless there are direct updates to the ``'s relevant parts/slice of Formik state.\n\nFor example, `` will only re-render when there are:\n\n- Changes to `values.firstName`, `errors.firstName`, `touched.firstName`, or `isSubmitting`. This is determined by shallow comparison. Note: dotpaths are supported.\n- A prop is added/removed to the ``\n- The `name` prop changes\n\nOther than for these aforementioned situations, `` will not re-render when other parts of Formik state change. However, all updates triggered by a `` will trigger re-renders to other \"vanilla\" `` components.\n\n## When to use ``\n\n**If a `` is \"independent\" of all other ``'s in your form, then you can use ``**.\n\nMore specifically, if the `` does not change behavior or render anything that is based on updates to another `` or ``'s slice of Formik state AND it does not rely on other parts of top-level `` state (e.g. `isValidating`, `submitCount`), then you can use `` as a drop-in replacement to ``.\n\n## Example\n\n```jsx\nimport React from 'react';\nimport { Formik, Field, FastField, Form } from 'formik';\nimport * as Yup from 'yup';\n\nconst Basic = () => (\n
\n

Sign Up

\n {\n setTimeout(() => {\n alert(JSON.stringify(values, null, 2));\n }, 500);\n }}\n >\n {formikProps => (\n
\n {/** This only updates for changes made to\n values.firstName, touched.firstName, errors.firstName */}\n \n \n\n {/** Updates for all changes because it's from the\n top-level formikProps which get all updates */}\n {formikProps.touched.firstName && formikProps.errors.firstName && (\n
{formikProps.errors.firstName}
\n )}\n\n \n \n {({ field, form, meta }) => (\n
\n \n {/**\n * This updates normally because it's from the same slice of Formik state,\n * i.e. path to the object matches the name of this \n */}\n {meta.touched ? meta.error : null}\n\n {/** This won't ever update since it's coming from\n from another /'s (i.e. firstName's) slice */}\n {form.touched.firstName && form.errors.firstName\n ? form.errors.firstName\n : null}\n\n {/* This doesn't update either */}\n {form.submitCount}\n\n {/* Imperative methods still work as expected */}\n \n J\n \n
\n )}\n \n\n {/** Updates for all changes to Formik state\n and all changes by all s and s */}\n \n \n {({ field, form, meta }) => (\n
\n \n {/** Works because this is inside\n of a , which gets all updates */}\n {form.touched.firstName && form.errors.firstName\n ? form.errors.firstName\n : null}\n
\n )}\n \n\n {/** Updates for all changes to Formik state and\n all changes by all s and s */}\n \n \n\n \n \n )}\n \n
\n);\n```\n" }, { "path": "docs/api/field.md", "content": "---\nid: field\ntitle: \n---\n\n`` will automagically hook up inputs to Formik. It uses the `name`\nattribute to match up with Formik state. `` will default to an HTML\n`` element.\n\n## Rendering\n\nThere are a few different ways to render things with ``.\n\n- ``\n- ``\n- ``\n- ~~``~~ _deprecated in 2.x. Using these will log warning_\n\n`as` can either be a React component or the name of an HTML element to render. Formik will automagically inject `onChange`, `onBlur`, `name`, and `value` props of the field designated by the `name` prop to the (custom) component.\n\n`children` can either be an array of elements (e.g. `