@emmetio/html-transform
v0.3.10
Published
Prepares given Emmet abbreviation for HTML output
Downloads
8,787
Readme
Emmet abbreviation transformer for HTML
This modules takes parsed Emmet abbreviation tree and transforms it for markup syntax (HTML, XML, Pug, Slim etc.) output. This transformation includes:
- Implicit tag name resolving. Fills omitted tag names, depending on parent’s name. For example,
table>.row>.cell
will be resolved totable>tr.row>td.cell
equivalent. - Item Numbering. Replaces
$
symbol in node’s name, attributes and content with repeater value. For example,.item$*3
will produce nodes withitem1
,item2
anditem3
class names. Multiple$
will zero-pad repeater value, e.g.$$$
→001
...012
...123
. Precede$
character with\
to skip numbering on it and keep as is. - Content insertion. A part of Wrap With Abbreviation action: clones implicitly repeated element (like
li*
) for every item of given content array and inserts item content into cloned node.
Usage
import parse from '@emmetio/abbreviation';
import transform from '@emmetio/html-transform';
const abbr = transform(parse('ul>.item$*'), ['foo', 'bar']);
// `abbr` now holds equivalent of `ul>li.item1{foo}+li.item2{bar}` abbreviation