Usage as a low-level library
To build all the wrappers for the TODO
application, we use this package as a
low-level library.
import tint from 'https://cdn.jsdelivr.net/gh/marcodpt/tint/index.js'
Here is the source code for each of the wrappers:
If you want to create a wrapper for a framework that is not on this list or
if you want to improve any of the wrappers we've created here, you'll need
use tint
as described in this section.
If you created something interesting, or a wrapper for another framework or improved any example. Submit a pull request or open an issue with your code.
tint(h, text) -> compile
Returns a compile
function based on your hyperscript DOM/vDOM choice.
- h(tagName, attributes, children): a required hyperscript function that create a DOM or virtual DOM element.
- text(str): a
hyperscript function that create
DOM or vDOM text nodes.
If no
text
function is passed, it will useh(str)
.
compile(element, template?, document?) -> render
Returns the view associated with element
.
Optionally, you can use a template
element to replace the element
's inner
HTML with your own contents.
- element: The
element
that will be the root of the result. If you don't pass atemplate
, it will be treated as a complete template. In case you provide atemplate
it will only be used as the root of the result, ignoring its content. - template: The optional
template
element you want to render inside . - document: Useful when
tint
is used indeno
, you must pass the parsed document, inside the browser just ignore it.
render(scope) -> DOM/vDOM element
Returns the DOM/vDOM generated by applying the scope
in the view
- scope: The data passed to interpolate the
element
, any JSON data even with javascript functions is valid!