xtal-treant - Vaadin Add-on Directory

[](https://www.webcomponents.org/element/xtal-treant) # \ xtal-treant is a dependency free web component wrapper around the great [Treant](http://fperucic.github.io/treant-js/) library. The web component requires a property, "config" to be set: ```html ``` Because the library is designed to create different tree charts, based on a passed on css file, this raises a bit of a cunnundrum for a reusable web component. You can pass in the css file in the config setting. This will dynamically pass the css content into the shadow DOM. [This currently has some issues in Chrome](https://github.com/Polymer/polymer/issues/4865). So the better alternative is to define a preload link in document.head: ```html ``` Note the use of "treant" and "css" in the class, and the data-postfix value. This will cause xtal-treant to dynamically create a new web component with name xtal-treant-basic, with the contents of the css file stamped into the template. ## Install the Polymer-CLI First, make sure you have the [Polymer CLI](https://www.npmjs.com/package/polymer-cli) installed. Then run `polymer serve` to serve your element locally. ## Viewing Your Element ``` $ polymer serve ``` ## Running Tests WIP

xtal-treant version 0.0.15
### Dependencies * @bower_components/accessibility-developer-tools#GoogleChrome/accessibility-developer-tools#^2.10.0 * @bower_components/async#caolan/async#^1.5.0 * @bower_components/chai#chaijs/chai#^3.2.0 * @bower_components/font-roboto#PolymerElements/font-roboto#^1 * @bower_components/iron-demo-helpers#PolymerElements/iron-demo-helpers#^2.0.0 * @bower_components/iron-flex-layout#PolymerElements/iron-flex-layout#1 - 2 * @bower_components/iron-location#PolymerElements/iron-location#1 - 2 * @bower_components/iron-resizable-behavior#PolymerElements/iron-resizable-behavior#^2.0.0 * @bower_components/lodash#lodash/lodash#^3.7.0 * @bower_components/marked#chjj/marked#~0.3.9 * @bower_components/marked-element#PolymerElements/marked-element#1 - 2 * @bower_components/mocha#mochajs/mocha#^3.1.2 * @bower_components/polymer#Polymer/polymer#^2.0.0 * @bower_components/prism#LeaVerou/prism#* * @bower_components/prism-element#PolymerElements/prism-element#1 - 2 * @bower_components/resize-observer-polyfill#que-etc/resize-observer-polyfill#^1.5.0 * @bower_components/shadycss#webcomponents/shadycss#^v1.1.0 * @bower_components/sinon-chai#domenic/sinon-chai#^2.7.0 * @bower_components/sinonjs#blittle/sinon.js#^1.14.1 * @bower_components/stacky#PolymerLabs/stacky#^1.3.0 * @bower_components/test-fixture#PolymerElements/test-fixture#^3.0.0 * @bower_components/vaadin-split-layout#vaadin/vaadin-split-layout#^3.0.1 * @bower_components/vaadin-themable-mixin#vaadin/vaadin-themable-mixin#^1.1.0 * @bower_components/web-component-tester#Polymer/web-component-tester#^6.0.0 * @bower_components/webcomponentsjs#webcomponents/webcomponentsjs#^1.0.0

xtal-treant version 0.0.1
### Dependencies * treant-js#^1.0.1 * xtal-latx#0.0.44

xtal-treant version 0.0.16
### Dependencies * treant-js#^1.0.1 * xtal-latx#0.0.44

xtal-treant version 0.0.17
### Dependencies * treant-js#^1.0.1 * xtal-latx#0.0.44

xtal-treant version 0.0.18
### Dependencies * treant-js#^1.0.1 * xtal-latx#0.0.44

xtal-treant version 0.0.19
### Dependencies * treant-js#^1.0.1 * xtal-latx#0.0.44

xtal-treant version 0.0.2
### Dependencies * treant-js#^1.0.1 * xtal-latx#0.0.44

xtal-treant version 0.0.20
### Dependencies * treant-js#^1.0.1 * xtal-latx#0.0.44

xtal-treant version 0.0.22
### Dependencies * treant-js#^1.0.1 * xtal-latx#0.0.44

xtal-treant version 0.0.3
### Dependencies * treant-js#^1.0.1 * xtal-latx#0.0.44