{"id":28902814,"url":"https://github.com/devceline/react-crunch-form","last_synced_at":"2026-05-02T05:02:17.078Z","repository":{"id":53616380,"uuid":"347210678","full_name":"devceline/react-crunch-form","owner":"devceline","description":"Forms should be simple, should not assume anything about style or paradigm. This is an attempt at that,","archived":false,"fork":false,"pushed_at":"2021-03-21T18:26:56.000Z","size":463,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-05-20T02:43:43.626Z","etag":null,"topics":["bootstrapping","crunch","form","react"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/devceline.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-03-12T22:10:49.000Z","updated_at":"2021-09-28T17:52:37.000Z","dependencies_parsed_at":"2022-09-19T20:14:48.541Z","dependency_job_id":null,"html_url":"https://github.com/devceline/react-crunch-form","commit_stats":null,"previous_names":["shaheensarafa/react-crunch-form"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/devceline/react-crunch-form","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devceline%2Freact-crunch-form","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devceline%2Freact-crunch-form/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devceline%2Freact-crunch-form/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devceline%2Freact-crunch-form/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/devceline","download_url":"https://codeload.github.com/devceline/react-crunch-form/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devceline%2Freact-crunch-form/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":261115230,"owners_count":23111908,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["bootstrapping","crunch","form","react"],"created_at":"2025-06-21T11:33:00.290Z","updated_at":"2026-05-02T05:02:12.040Z","avatar_url":"https://github.com/devceline.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React Crunch Form\n\n\u003e A library designed for you to crunch out a form really fast\n\n[![NPM](https://img.shields.io/npm/v/react-crunch-form.svg)](https://www.npmjs.com/package/react-crunch-form) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)\n\n## Install\n\n```bash\nnpm install --save react-crunch-form\nyarn install react-crunch-form\n```\n\n## Usage\n\n```tsx\nimport CrunchForm, {\n  CrunchInput,\n  CrunchInputValidationDisplay,\n  CrunchSubmit\n} from 'react-crunch-form';\n\nconst getLookup = () =\u003e {\n  return new Promise\u003c{ [k: string]: string }\u003e((resolve) =\u003e {\n    setTimeout(() =\u003e {\n      resolve({\n        foo: 'bar',\n        baz: 'bor'\n      });\n    }, 300);\n  });\n};\n\nconst App = () =\u003e {\n  getLookup().then((v) =\u003e console.log({ v }));\n\n  return (\n    \u003cCrunchForm className='main' onSubmit={(body) =\u003e console.log(body)}\u003e\n      \u003cdiv\u003e\n        \u003cCrunchInput\n          validators={[\n            (v) =\u003e {\n              if (!v) return 'required';\n              if (v.length \u003e 5) return 'TOO LONG';\n              return false;\n            }\n          ]}\n          field='something'\n          type='textarea'\n        /\u003e\n        \u003cCrunchInputValidationDisplay\n          className='validation-error'\n          field='something'\n        /\u003e\n      \u003c/div\u003e\n\n      \u003cdiv\u003e\n        \u003ch6\u003eLookup coming from object\u003c/h6\u003e\n        \u003cCrunchInput\n          field='something2'\n          type='select'\n          lookupFields={{\n            something: 2,\n            somethingelse: 4\n          }}\n        /\u003e\n      \u003c/div\u003e\n\n      \u003cdiv\u003e\n        \u003ch6\u003eLookup coming from a promise\u003c/h6\u003e\n        \u003cCrunchInput\n          field='something3'\n          type='select'\n          getLookupFieldsAsync={getLookup}\n        /\u003e\n      \u003c/div\u003e\n\n      \u003cdiv\u003e\n        \u003ch6\u003e\n          Native html date picker.\n          \u003cspan style={{ color: 'red', margin: '0 1em' }}\u003e\n            Does not work on Safari or IE\n          \u003c/span\u003e\n        \u003c/h6\u003e\n        \u003cCrunchInput type='date' field='datefield' /\u003e\n      \u003c/div\u003e\n      \u003cdiv\u003e\n        \u003ch6\u003e\n          Native html time picker.\n          \u003cspan style={{ color: 'red', margin: '0 1em' }}\u003e\n            Does not work on Safari or IE\n          \u003c/span\u003e\n        \u003c/h6\u003e\n        \u003cCrunchInput type='time' field='timefield' /\u003e\n      \u003c/div\u003e\n      \u003cCrunchSubmit\u003eSubmit\u003c/CrunchSubmit\u003e\n    \u003c/CrunchForm\u003e\n  );\n};\n```\n\n## License\n\nMIT © [shaheensarafa](https://github.com/shaheensarafa)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevceline%2Freact-crunch-form","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdevceline%2Freact-crunch-form","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevceline%2Freact-crunch-form/lists"}