JSFiddle - React, Tailwind, and code Playground

by dfreedm

HTML

<script src="https://rawgithub.com/toolkitchen/platform/stable/platform.min.js"></script>
<script src="https://rawgithub.com/toolkitchen/toolkit/stable/toolkit.js"></script>
<element name="x-foo">
    <script>
        Toolkit.register(this, {
            title: 'Default',
            readyCallback: function() {
                this.reflectTitle();
            },
            reflectTitle: function() {
                this.textContent = this.title;
            },
            titleChanged: function() {
                this.reflectTitle();
            }
        });
    </script>
</element>
<script>
    document.addEventListener('WebComponentsReady', function() {
        document.body.appendChild(document.createTextNode('WebComponentsReady'));
    });
</script>
<x-foo title="Custom"></x-foo>

CSS

x-foo {
    border: 2px solid green;
    display: block;
}