❤
npm
Sign UpSign In

nanomorph-guard

2.1.0 • Public • Published

nanomorph-guard

Build Status

Guard element against being touched by nanomorph

Requires nanomorph@5.4.0 or up.

Usage

Useful with components that expect to keep a reference to their parent element, but that you still would like to use in combination with nanomorph

Below is an example that manually updates a text node every second, while only morphing the DOM every five seconds. The reference to manualElm is not lost.

var guard = require('nanomorph-guard')
var morph = require('nanomorph')
var html = require('nanohtml')
 
var manualElm = document.createElement('p')
var text = document.createTextNode()
manualElm.appendChild(text)
 
function updateMorph () {
  morph(document.body, html`<body>
    <p>Updated by nanomorph on ${Date.now()}</p>
    ${guard(manualElm)}
  </body>`)
}
 
function updateManual () {
  text.textContent = `Updated by manually on ${Date.now()}`
}
 
setInterval(updateManual, 1000)
setInterval(updateMorph, 5000)

API

var el = guard(element)

Protect element from being morphed by nanomorph. Will return element itself if not a Node, eg. string, DocumentFragment, array or other types that you may sometimes pass to nanohtml/nanomorph

Install

npm install nanomorph-guard

License

ISC

Readme

Keywords

none

Package Sidebar

Install

npm i nanomorph-guard

Repository

github.com/hyperdivision/nanomorph-guard

Homepage

github.com/hyperdivision/nanomorph-guard#readme

Weekly Downloads

4

Version

2.1.0

License

ISC

Unpacked Size

6.44 kB

Total Files

6

Last publish

Collaborators

  • emilbayes
Try on RunKit
Report malware