Simple json edit widget implemented as a Polymer webcomponent
Clone or download
Latest commit 1af5eb0 Sep 10, 2014
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist Update dist Sep 10, 2014
src Make workaround for bindings. Sep 10, 2014
.editorconfig Initial. Aug 1, 2014
.gitignore Initial. Aug 1, 2014
Gruntfile.js Update gruntfile. Sep 9, 2014 Update Aug 1, 2014
bower.cmd Initial. Aug 1, 2014
bower.json Release v1.3.0 Sep 10, 2014
grunt.cmd Initial. Aug 1, 2014
index.html Add <readonly-json-box>. It has "deep binding". Sep 9, 2014
package.json Update build scripts. Sep 9, 2014
polymer-json-box.komodoproject Initial. Aug 1, 2014


Polymer json editor widget webcomponent


Check it live!


Install the component using Bower:

$ bower install json-box --save

Or download as ZIP.


  1. Import Web Components' polyfill:

    <script src="bower_components/platform/platform.js"></script>
  2. Import Custom Element:

    <link rel="import" href="bower_components/json-box/dist/json-box.html">
  3. Start using it!



Attribute Options Default Description
json object null Object to display in the widget


In order to run it locally you'll need to fetch some dependencies and a basic server setup.

  • Install Bower & Grunt:

    $ [sudo] npm install -g bower grunt-cli
  • Install local dependencies:

    $ bower install && npm install
  • To test your project, start the development server and open http://localhost:8000.

    $ grunt server
  • To build the distribution files before releasing a new version.

    $ grunt build
  • To provide a live demo, send everything to gh-pages branch.

    $ grunt deploy


  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -m 'Add some feature'
  4. Push to the branch: git push origin my-new-feature
  5. Submit a pull request :D


For detailed changelog, check Releases.


MIT License