@textlint/txtast-to-html
TxtAST to HTML string.
This HTML string aim to be used as Custom Elements.
Install
Install with npm:
npm install @textlint/txtast-to-html
Usage
import { toHTML } from "@textlint/txtast-to-html";
const { parse } = require("markdown-to-ast");
const txtAST = parse(`# Title
text [link](http://example.com).
- list1
- list2
`);
const HTMLString = toHTML(txtAST);
/*
<txtast-document data-metadata="{"loc":{"start":{"line":1,"column":0},"end":{"line":8,"column":0}},"range":[0,68]}"><txtast-header data-metadata="{"depth":1,"loc":{"start":{"line":1,"column":0},"end":{"line":1,"column":7}},"range":[0,7]}"># <txtast-str data-metadata="{"value":"Title","loc":{"start":{"line":1,"column":2},"end":{"line":1,"column":7}},"range":[2,7]}">Title</txtast-str></txtast-header><txtast-paragraph data-metadata="{"loc":{"start":{"line":3,"column":0},"end":{"line":3,"column":32}},"range":[17,49]}"><txtast-str data-metadata="{"value":"text ","loc":{"start":{"line":3,"column":0},"end":{"line":3,"column":5}},"range":[17,22]}">text </txtast-str><txtast-link data-metadata="{"title":null,"url":"http://example.com","loc":{"start":{"line":3,"column":5},"end":{"line":3,"column":31}},"range":[22,48]}">[<txtast-str data-metadata="{"value":"link","loc":{"start":{"line":3,"column":6},"end":{"line":3,"column":10}},"range":[23,27]}">link</txtast-str>](http://example.com)</txtast-link><txtast-str data-metadata="{"value":".","loc":{"start":{"line":3,"column":31},"end":{"line":3,"column":32}},"range":[48,49]}">.</txtast-str></txtast-paragraph><txtast-list data-metadata="{"ordered":false,"start":null,"loose":false,"loc":{"start":{"line":5,"column":0},"end":{"line":6,"column":7}},"range":[51,66]}"><txtast-listitem data-metadata="{"loose":false,"checked":null,"loc":{"start":{"line":5,"column":0},"end":{"line":5,"column":7}},"range":[51,58]}">- <txtast-paragraph data-metadata="{"loc":{"start":{"line":5,"column":2},"end":{"line":5,"column":7}},"range":[53,58]}"><txtast-str data-metadata="{"value":"list1","loc":{"start":{"line":5,"column":2},"end":{"line":5,"column":7}},"range":[53,58]}">list1</txtast-str></txtast-paragraph></txtast-listitem><txtast-listitem data-metadata="{"loose":false,"checked":null,"loc":{"start":{"line":6,"column":0},"end":{"line":6,"column":7}},"range":[59,66]}">- <txtast-paragraph data-metadata="{"loc":{"start":{"line":6,"column":2},"end":{"line":6,"column":7}},"range":[61,66]}"><txtast-str data-metadata="{"value":"list2","loc":{"start":{"line":6,"column":2},"end":{"line":6,"column":7}},"range":[61,66]}">list2</txtast-str></txtast-paragraph></txtast-listitem></txtast-list>
</txtast-document>
*/Simplify output:
<txtast-document>
<txtast-header>#
<txtast-str>Title</txtast-str>
</txtast-header>
<txtast-paragraph>
<txtast-str>text</txtast-str>
<txtast-link>[
<txtast-str>link</txtast-str>
](http://example.com)
</txtast-link>
<txtast-str>.</txtast-str>
</txtast-paragraph>
<txtast-list>
<txtast-listitem>-
<txtast-paragraph>
<txtast-str>list1</txtast-str>
</txtast-paragraph>
</txtast-listitem>
<txtast-listitem>-
<txtast-paragraph>
<txtast-str>list2</txtast-str>
</txtast-paragraph>
</txtast-listitem>
</txtast-list>
</txtast-document>Changelog
See Releases page.
Running tests
Install devDependencies and Run npm test:
npm i -d && npm test
Contributing
Pull requests and stars are always welcome.
For bugs and feature requests, please create an issue.
- Fork it!
- Create your feature branch:
git checkout -b my-new-feature - Commit your changes:
git commit -am 'Add some feature' - Push to the branch:
git push origin my-new-feature - Submit a pull request :D
Author
License
MIT © azu