Add fragment helper to skooma.js
This commit is contained in:
parent
2c5f430dc6
commit
5795439ae1
2 changed files with 20 additions and 0 deletions
|
@ -245,6 +245,19 @@
|
|||
</div>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>The <code>fragment</code> helper</h2>
|
||||
|
||||
<p>
|
||||
This helper simply collects its arguments into a document fragment.
|
||||
One may think of it as <code>Array.from</code>, except it collects HTML elements into a fragment instead.
|
||||
</p>
|
||||
<code-block>
|
||||
const list = ["b", "i", "u"].map(name => html.[name](name))
|
||||
return text`Some ${fragment(...list)} other text`
|
||||
</code-block>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>The <code>bind</code> helper</h2>
|
||||
|
||||
|
|
|
@ -113,6 +113,13 @@ export const handle = fn => event => { event.preventDefault(); return fn(event)
|
|||
export const html = nameSpacedProxy({nameFilter: name => name.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase()})
|
||||
export const svg = nameSpacedProxy({xmlns: "http://www.w3.org/2000/svg"})
|
||||
|
||||
export const fragment = (...elements) => {
|
||||
const fragment = new DocumentFragment()
|
||||
for (element of elements)
|
||||
fragment.append(element)
|
||||
return fragment
|
||||
}
|
||||
|
||||
const textFromTemplate = (literals, items) => {
|
||||
const fragment = new DocumentFragment()
|
||||
for (const key in items) {
|
||||
|
|
Loading…
Reference in a new issue