{"id":15012980,"url":"https://github.com/gravio-la/crud-jsonforms","last_synced_at":"2026-01-05T11:07:48.957Z","repository":{"id":172718214,"uuid":"649596895","full_name":"gravio-la/crud-jsonforms","owner":"gravio-la","description":"A semantic enabled JSONForms library to create CRUD forms out of JSON Schema","archived":false,"fork":false,"pushed_at":"2023-07-17T06:04:36.000Z","size":3098,"stargazers_count":1,"open_issues_count":1,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2024-04-24T10:15:11.922Z","etag":null,"topics":["crud","jsonforms","jsonld","jsonschema","react"],"latest_commit_sha":null,"homepage":"https://gravio-la.github.io/crud-jsonforms/","language":"TypeScript","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/gravio-la.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,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-06-05T08:19:23.000Z","updated_at":"2024-03-10T10:36:47.000Z","dependencies_parsed_at":null,"dependency_job_id":"c8c99ef9-511a-45e7-8886-836fb879e09c","html_url":"https://github.com/gravio-la/crud-jsonforms","commit_stats":null,"previous_names":["gravio-la/crud-jsonforms"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravio-la%2Fcrud-jsonforms","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravio-la%2Fcrud-jsonforms/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravio-la%2Fcrud-jsonforms/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravio-la%2Fcrud-jsonforms/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/gravio-la","download_url":"https://codeload.github.com/gravio-la/crud-jsonforms/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244900283,"owners_count":20528675,"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":["crud","jsonforms","jsonld","jsonschema","react"],"created_at":"2024-09-24T19:43:33.342Z","updated_at":"2026-01-05T11:07:48.914Z","avatar_url":"https://github.com/gravio-la.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# CRUD JSONForms\n\n[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)\n\nCRUD-JSONForms is a React component that builds upon the functionality of [JSON Forms](https://jsonforms.io/) to allow sophisticated form handling. This component extends the JSON Forms capabilities with custom renderers for recursively embedding new JSON forms for linked items in one-to-many and many-to-many relationships. It is perfect for complex forms where objects need to be interrelated and referred back to at a later stage.\n\nThis component is unopinionated regarding the storage strategy, requiring only an implementation for the `create`, `load`, `update`, and `remove` methods. Each of these methods receives a JSONSchema, which represents the shape of the data, the data itself (for `create` and `update`), or some kind of identifier (for `load`, `remove`, and `update`).\n\n## Summary\n- Unopinionated storage strategy\n- Robust handling of linked items in one-to-many and many-to-many relationships\n- CRUD operations (`create`, `load`, `update`, and `remove`) with JSONSchema and data\n\n## Quick Start\n```\nyarn add @graviola/crud-jsonforms\n```\nAfter installing, you can use it in your React component like so:\n\n```jsx\nimport { CRUDJsonForms } from '@graviola/crud-jsonforms';\n\n// Create your CRUD functions\n// and store them within useCustom_CRUD\n\nconst config = {\n    baseIRI: 'http://example.com/ontology/',\n    entityBaseIRI: 'http://http://example.com/entity#',\n    defaultPrefix: 'http://example.com/ontology/',\n    useCRUDHook: useCustom_CRUD,\n    genJSONLDSemanticProperties: () =\u003e {}\n}\n\nconst MyFormComponent = () =\u003e {\n    const [formData, setFormData] = useState(exampleData)\n    return \u003cCRUDJsonForms\n        data={formData}\n        entityIRI={formData['@id']}\n        typeIRI={formData['@type']}\n        setData={data =\u003e setFormData(data)}\n        schema={schema}\n        jsonFormsProps={{\n            config\n        }}\n    /\u003e\n}\n```\n## Usage\n\nThe key prop for `CRUDJsonForms` component is the `schema` prop. This prop should contain your JSONSchema which determines the structure of your form.\n\nThe component also requires a hook which implements the CRUD functions (`create`, `load`, `update`, `remove`). You can see the example mock implementation\nto get an idea how the interface looks like.\n\nThese functions provide the component with the ability to handle CRUD operations based on your specific implementation.\n\n## Architecture\n`CRUD-JSONForms` builds on the flexible and data-driven nature of JSON Forms. It extends this with recursive renderer components, which allow the embedding of new JSON forms for linked items within a form, allowing for one-to-many and many-to-many relationships.\n\nThe architecture of `CRUD-JSONForms` is designed to allow maximum customization while providing powerful defaults. Users can create their own CRUD functions based on their storage strategy, making this component flexible to fit into any existing or new react project.\nYou can also refer to the existing Inline-Forms renderer as a basis and implement your own one.\n\n## Perspective\n\n- further simplify the interface and strip out the reliance on semantic properties like '@id' and '@type'\n- provide an extension to the CRUD-JSONForms that makes it fully compatible with JSON-LD (produce JSON-LD documents)\n- provide some default `useCRUDHooks` in separate packages\n\n\n## Developing\n\nTo start the development  run :\n\n```\nyarn start\n```\n\nThis will build the library, run the watcher and also run Storybook.\nTo open Storybook manually open your Browser and navigate to [http://localhost:6060](http://localhost:6060).\nStart developing your components in `src/components` folder and update the `src/index.js` file accordingly.\nAlways provide an `YourComponent.story.tsx` file, so your component will show up in Storybook.\n\n\n\n## Scripts\n\n- `yarn start` : Only serves Storybook.\n- `yarn build` : Builds your library (build can be found in `dist` folder).\n- `yarn storybook:build` : Builds the static Storybook in case you want to deploy it.\n- `yarn test` : Runs the tests.\n- `yarn test:coverage`: Runs the test and shows the coverage.\n- `yarn lint` : Runs the linter, Typescript typecheck and stylelint.\n- `yarn lint:fix` : Runs the linter, Typescript typecheck and stylelint and fixes automatic fixable issues.\n- `yarn eslint`: Runs only the JavaScript linter.\n- `yarn eslint:fix`: Runs only the JavaScript linter and fixes automatic fixable issues.\n- `yarn stylelint`: Runs only the style linter.\n- `yarn stylelint:fix`: Runs only the style linter and fixes automatic fixable issues.\n- `yarn check-types`: Runs typescript type checker.\n- `yarn release` : Publishes your Library on NPM or your private Registry (depending on your config in your `.npmrc` file).\n- `yarn deploy`: Deploys the Storybook to GitHub Pages.\n\n## Contributing\nWe welcome contributions to `CRUD-JSONForms`! Check out our [Contributing Guide](CONTRIBUTING.md) for guidelines on how to proceed.\n\n## License\nThis project is licensed under the terms of the [MIT license](LICENSE).\n\n## Resources\n\n### JSONForms\n\n- [JSON Forms](https://jsonforms.io/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgravio-la%2Fcrud-jsonforms","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgravio-la%2Fcrud-jsonforms","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgravio-la%2Fcrud-jsonforms/lists"}