JSFiddle - React, Tailwind, and code Playground

by lega911

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.min.js"></script>
<script src="http://angularlight.org/bin/alight_0.8.last.min.js"></script>
<div>
    <label>Name:</label>
    {{input value=name type="text" placeholder="Enter your name"}}
</div>
<div class="text">
    <h3>My name is {{name}}, it is not Ember!</h3>
</div>

JavaScript

alight.hooks.binding.push({
    code: 'al-value injector',
    fn: function(scope, node, option) {
        if(node.nodeType !== 1) return;
        if(node.innerHTML.indexOf('{{input ')<0) return;
        node.innerHTML = node.innerHTML.replace(/{{input value=([\w\d]+)\s+(.*?)}}/g, '<input al-value="$1" $2>');
    }
});

alight.bootstrap(document.body);