Giter VIP home page Giter VIP logo

eclipsesource / jsonforms Goto Github PK

View Code? Open in Web Editor NEW
1.9K 34.0 343.0 26.97 MB

Customizable JSON Schema-based forms with React, Angular and Vue support out of the box.

Home Page: http://jsonforms.io

License: Other

CSS 0.65% HTML 0.24% JavaScript 1.77% TypeScript 94.23% Shell 0.17% Vue 2.91% Dockerfile 0.04%
react redux json json-schema forms js typescript angular material customizable

jsonforms's Introduction

JSON Forms - More Forms. Less Code

Complex forms in the blink of an eye

Documentation

Please see the official JSON Forms website, jsonforms.io, for documentation, examples and API references.

Getting started

  1. Clone the seed app with git clone https://github.com/eclipsesource/jsonforms-react-seed.git
  2. Install dependencies with npm ci
  3. Run the app with npm run start

For more info about the seed app, please see the corresponding README file of the seed repo. For a more detailed tutorial about the usage of JSON Forms, please see this tutorial.

Feedback, Help and Support

If you encounter any problems feel free to open an issue on the repo. For questions and discussions please use the JSON Forms board. You can also reach us via email. In addition, EclipseSource also offers professional support for JSON Forms.

Migration

See our migration guide when updating JSON Forms.

Developers Documentation

First time setup

  • Install node.js (only Node v18.19+ < 19 is currently supported)
  • Install pnpm: https://pnpm.io/installation (use pnpm 8.6.2+)
  • Clone this repository
  • Install dependencies: pnpm i --frozen-lockfile

VS Code dev container

As an alternative to the first time setup, you can use the provided VS Code dev container configured in devcontainer.json.

  • Execute command: Remote Containers: Reopen in container
  • Wait until the container is built and loaded
  • First time setup and an initial build of all packages has been executed in the container

Note: If you have installed dependencies before opening the remote container, its initialization might fail. In this case, you can try to clean the repository with git clean -dfx. Beware that this removes all untracked files!

Build & Testing

  • Build (all packages): pnpm run build
  • Test (all packages): pnpm run test
  • Clean (delete dist folder of all packages): pnpm run clean
  • Run React Vanilla examples: cd packages/vanilla-renderers && pnpm run dev
  • Run React Material examples: cd packages/material-renderers && pnpm run dev
  • Run Angular Material examples: cd packages/angular-material && pnpm run dev
  • Run Vue Vanilla dev setup: cd packages/vue-vanilla && pnpm run serve

Dependency & Release management

For more info about how we handle dependencies and releases in the JSON Forms project, please see our Developer Documentation wiki page.

Continuous Integration

The JSON Forms project is built and tested via Github actions on Linux, Mac and Windows. Coverage is documented by Coveralls.

Current status: Build status Coverage Status

License

The JSON Forms project is licensed under the MIT License. See the LICENSE file for more information.

jsonforms's People

Contributors

ahmetanakol avatar alexandrabuzila avatar andresgutgon avatar brockfanning avatar buryndin avatar davewwww avatar drewhoo avatar edgarmueller avatar eneufeld avatar howdyankit avatar iluuu1994 avatar jbbianchi avatar jdwit avatar jfaltermeier avatar jsonforms-publish avatar koegel avatar lucas-koehler avatar lukasboll avatar max-elia avatar maxouwell avatar nowells avatar rsoika avatar samtsai avatar sdirix avatar sebastianfrey avatar shivgarg5676 avatar sunnysingh avatar thezoker avatar tortmayr avatar wienczny avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

jsonforms's Issues

Provide jsonforms directive to ease integration

Instead of configuring the JSONForms via routing and obtaining the schema/UI schema/instance data via HTTP requests we should instead provide a custom directive that lets users supply the data with sources of their choice.

Make retrieval of view & schema configurable

Currently, the GetData service assumes that type-specific view/ and model/ endpoints exists, which allow the retrieval of the UI model and the JSON schema.
This should be changed, since it might not be possible to change or add endpoints to a existing REST service.

Validation should be based on tv4

Currently the validation for single controls is implemented by hand. Additinally it doesn't consider validation contstraints. Hence we should back our validation mechanism on an existing schema validator.

Ease integration testing with json-server

Testing manual REST integration assumed having a ready-to-use backend with the correct routing and data format configured, which led to many possible errors. We could therefore provide a simple JSON file that contains the correct data and use json-server to simulate a simple REST API, which should suffice for simple testing purposes.

Implement total number of items for table widget

The total number of entities a table widget supports is currently unknown. We need to find out, what's the best way to support integration the overall number of entities in order to display the number within the table.

Create ResultControlFactory

Creating controls via native JS objects can get quite clumy, hence we should provide a factory that is responsible for prefilling most properties with sensible default values

Review RenderService#createUiElement

The exact requirements of this method are not entirely clear. We should check which fields of the returned object are actually used and also consider renaming the method.

'bower install' downloads outdated files

When installing JSONForms via bower install jsonforms I end up with outdated files (the date in the copyright header is 2015-06-29).
Is this on purpose since the latest changes have not been officially 'released' yet or is this some kind of Bower registry caching issue?

Fix missing glyphicons warnings

GET
http://localhost:8080/fonts/glyphicons-halflings-regular.woff [HTTP/1.1 404 Not Found 5ms]
downloadable font: download failed (font-family: "Glyphicons Halflings" style:normal weight:normal stretch:normal src index:1): status=2147746065 source: http://localhost:8080/fonts/glyphicons-halflings-regular.woff qb-bootstrap.min.css:261:12
GET
http://localhost:8080/fonts/glyphicons-halflings-regular.ttf [HTTP/1.1 404 Not Found 5ms]
downloadable font: download failed (font-family: "Glyphicons Halflings" style:normal weight:normal stretch:normal src index:2): status=2147746065 source: http://localhost:8080/fonts/glyphicons-halflings-regular.ttf qb-bootstrap.min.css:261:12
GET
http://localhost:8080/bower_components/jsonforms/dist/fonts/glyphicons-halflings-regular.woff2 [HTTP/1.1 404 Not Found 5ms]
downloadable font: download failed (font-family: "Glyphicons Halflings" style:normal weight:normal stretch:normal src index:1): status=2147746065 source: http://localhost:8080/bower_components/jsonforms/dist/fonts/glyphicons-halflings-regular.woff2 jsonforms.css:257:12
GET
http://localhost:8080/bower_components/jsonforms/dist/fonts/glyphicons-halflings-regular.woff [HTTP/1.1 404 Not Found 6ms]
downloadable font: download failed (font-family: "Glyphicons Halflings" style:normal weight:normal stretch:normal src index:2): status=2147746065 source: http://localhost:8080/bower_components/jsonforms/dist/fonts/glyphicons-halflings-regular.woff jsonforms.css:257:12
GET
http://localhost:8080/bower_components/jsonforms/dist/fonts/glyphicons-halflings-regular.ttf [HTTP/1.1 404 Not Found 4ms]
downloadable font: download failed (font-family: "Glyphicons Halflings" style:normal weight:normal stretch:normal src index:3): status=2147746065 source: http://localhost:8080/bower_components/jsonforms/dist/fonts/glyphicons-halflings-regular.ttf

Table widget should support navigatable cells/rows

Single cells/rows of the table widget should be clickable via a hyperlink that leads to the underlying entity.
For instance, if a table widget lists all available tasks for a single user, clicking a single row should navigate to the according task.

Refine IRenderer interface

isApplicable should only take the current UIElement, the according sub schema and the current schema path.

render should take the same arguments, except one more which is the data provider.

Integrate resolution mechanism for remote json objects

With the integration of dojox.json.ref we now have support for referencing json objects ($ref:) by path and by id. This resolves also cross-reference scenarios and cyclic references among objects. See also the tests of app/components/version/jsonref_test.js.

Now we need to investigate how to best support referencing json objects that have not been fetched from a remote API yet. This involves providing and integrating different resolution strategies (such as, when to resolve which remote objects) to provide the necessary control on when how much data should be retrieved during resolution.

Enum properties are rendered as regular input instead of select element

Hi, in the latest version, enum properties are not rendered as select elements, but as regular inputs instead. It still works in the live demo, however the code there seems outdated.

This is probably because in JSONSchema the type of an enum is (I think) always string, but never enum. However in the control template's ng-switch-when, the select input is only rendered when the schemaType equals enum.

I have prepared a pull request which should fix the problem. I will submit it later.

Fix namespace

jsonforms.services is currently used for everything

Support rules

For showing/hiding element in the UI. Should be specified within UI schema.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.