{"id":13547863,"url":"https://github.com/zapier/formatic","last_synced_at":"2025-04-14T10:51:23.957Z","repository":{"id":17978674,"uuid":"20981165","full_name":"zapier/formatic","owner":"zapier","description":":pencil2: A configurable, pluggable forms library for React used on Zapier.com.","archived":false,"fork":false,"pushed_at":"2020-04-24T11:47:36.000Z","size":31474,"stargazers_count":112,"open_issues_count":8,"forks_count":16,"subscribers_count":62,"default_branch":"master","last_synced_at":"2024-04-14T19:03:45.534Z","etag":null,"topics":["forms","react"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/zapier.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-06-18T23:16:03.000Z","updated_at":"2024-04-13T11:18:56.000Z","dependencies_parsed_at":"2022-09-11T07:00:50.502Z","dependency_job_id":null,"html_url":"https://github.com/zapier/formatic","commit_stats":null,"previous_names":[],"tags_count":227,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zapier%2Fformatic","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zapier%2Fformatic/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zapier%2Fformatic/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zapier%2Fformatic/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zapier","download_url":"https://codeload.github.com/zapier/formatic/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248868843,"owners_count":21174754,"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":["forms","react"],"created_at":"2024-08-01T12:01:02.319Z","updated_at":"2025-04-14T10:51:23.932Z","avatar_url":"https://github.com/zapier.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# Formatic\n\n[![travis](https://travis-ci.org/zapier/formatic.svg?branch=master)](https://travis-ci.org/zapier/formatic)\n\nAutomatic forms. Find it on NPM - [https://www.npmjs.com/package/formatic](https://www.npmjs.com/package/formatic).\n\n## Warning!\n\nFormatic is currently in use in production, but the API is likely to change significantly in its next versions.\n\n## What is formatic?\n\nFormatic is a configurable, pluggable forms library for React. Pass in JSON fields that define your form, along with a value to be edited, and Formatic gives you form fields to edit your value.\n\n## Using formatic\n\nIf you're happy with the default configuration, you can use it like this:\n\n```js\n// Get the formatic component.\nimport Formatic from 'formatic';\n\n// Create some fields.\nvar fields = [\n  {\n    type: 'string',\n    isSingleLine: true,\n    key: 'firstName',\n    label: 'First Name',\n  },\n  {\n    type: 'str',\n    isSingleLine: true,\n    key: 'lastName',\n    label: 'Last Name',\n  },\n];\n\n// Render the form.\nReact.render(\n  \u003cFormatic fields={fields} onChange={newValue =\u003e console.log(newValue)} /\u003e,\n  document.getElementById('my-form')\n);\n```\n\nThis creates a simple form like this:\n\n![simple-form](static/images/simple-form.png)\n\n## Documentation\n\nTo learn more, check out the [documentation](http://zapier.github.io/formatic/).\n\n## Start hacking\n\n```\ngit clone git@github.com:zapier/formatic.git\ncd formatic\nyarn install\nyarn start\n```\n\nYour browser should automatically open to [http://localhost:3333/demo](http://localhost:3333/demo) (or other open port). Hack away on the code, and your changes should hot reload courtesy of Next.js.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzapier%2Fformatic","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzapier%2Fformatic","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzapier%2Fformatic/lists"}