Merge branch 'master' into greenkeeper/rollup-0.68.0

CHANGELOG.md

@@ -1,5 +1,14 @@
 # hyper(html) Changelog
 
+### v.2.23
+  * monkey patched rollup generated code to export once the same module shared within sub-modules
+
+### v2.22
+  * using latest domtagger
+
+### v2.21
+  * refactored out all dependencies
+
 ### v2.20
   * re-tested every single supported browser nd fixed few outstanding issues with the 2.19 release
 

HELPERS.md

@@ -0,0 +1,57 @@
+## [babel-plugin-remove-ungap]
+
+Remove the [@ungap ponyfill modules] from your bundle.  This will decrease the size of
+your bundle if you are targeting modern browsers only or if your build already includes
+other polyfills.  This has been tested with [hyperHTML] and [lighterhtml] bundles.
+
+
+## [babel-plugin-template-html-minifier]
+
+Run [html-minifier] on hyperHTML templates.
+
+
+## [babel-plugin-bare-import-rewrite]
+
+This can be used as an alternative to [rollup-plugin-node-resolve], or can be used with certain node.js
+web servers to allow browsing live from source.
+
+Known web server integrations:
+* [fastify-babel] plugin for [fastify] enables running any babel plugins, generally expects `payload.filename` as set by [fastify-static]
+* [express-transform-bare-module-specifiers] for [express] servers
+
+
+## [vinyl-rollup]
+
+This module copies the output of rollup builds to a stream of vinyl-fs objects for [gulp].
+In addition it optionally adds files from modules that were bundled into the stream.  This
+makes it easy to ensure that LICENSE and package.json files associated with bundled modules
+are published on the web server without publishing node.js server-side dependencies to the web.
+This can also be used to copy complete modules if required for licensing or if bundled code
+requires additional assets that are not part of the bundled JS (images for example).
+
+
+## [babel-plugin-bundled-import-meta]
+
+If `node_modules/some-web-component/index.js` uses `import.meta.url` to calculate the actual
+path to `node_modules/some-web-components/image.png`, rollup does not compensate. This babel
+plugin rewrites references to `import.meta.url` so it points to the original location where
+it is expected that the additional assets (images and such) can be found. This plugin works
+well with `vinyl-rollup` with `copyModules: true`.
+
+
+[babel-plugin-remove-ungap]: https://github.com/cfware/babel-plugin-remove-ungap#readme
+[@ungap ponyfill modules]: https://github.com/ungap/ungap.github.io#readme
+[hyperHTML]: https://github.com/WebReflection/hyperHTML#readme
+[lighterhtml]: https://github.com/WebReflection/lighterhtml#readme
+[babel-plugin-template-html-minifier]: https://github.com/cfware/babel-plugin-template-html-minifier#readme
+[html-minifier]: https://github.com/kangax/html-minifier#readme
+[babel-plugin-bare-import-rewrite]: https://github.com/cfware/babel-plugin-bare-import-rewrite#readme
+[rollup-plugin-node-resolve]: https://github.com/rollup/rollup-plugin-node-resolve#readme
+[fastify]: https://github.com/fastify/fastify#readme
+[fastify-babel]: https://github.com/cfware/fastify-babel#readme
+[fastify-static]: https://github.com/fastify/fastify-static#readme
+[express-transform-bare-module-specifiers]: https://github.com/nodecg/express-transform-bare-module-specifiers#readme
+[express]: https://github.com/expressjs/express#readme
+[vinyl-rollup]: https://github.com/cfware/vinyl-rollup#readme
+[gulp]: https://github.com/gulpjs/gulp#readme
+[babel-plugin-bundled-import-meta]: https://github.com/cfware/babel-plugin-bundled-import-meta#readme

README.md

@@ -15,6 +15,13 @@ A **Fast & Light Virtual DOM Alternative** available for [Node.js](https://viper
 
 - - -
 
+## lighterhtml 💡
+
+This little brother is "_showing off_" these days, claiming better performance and unprecedented ease of use.
+
+[GitHub Repository](https://github.com/WebReflection/lighterhtml)
+
+
 ## Neverland 🌈🦄
 
 If you like React hooks concept, don't miss this little wrap that adds 0._something_ overhead to the already lightweight hyperHTML, bringing in very similar concepts.
@@ -34,6 +41,8 @@ You can require or import _hyperHTML_ with any bundler and in different ways.
 
 If requiring or importing from `"hyperhtml"` doesn't work, try requiring from `"hyperhtml/cjs"` for CommonJS friendly bundlers (WebPack), or `"hyperhtml/esm"` for ESM compatible bundlers (Rollup).
 
+See [HELPERS.md](./HELPERS.md) for a list of additional tools which can be helpful for building hyperHTML based web applications.
+
 - - -
 
 ## Sponsors
@@ -121,6 +130,12 @@ You can verify directly through the following links:
 
   * [100% code coverage](https://webreflection.github.io/hyperHTML/test/) for browsers natively compatible with string literals
   * [100% code coverage](https://webreflection.github.io/hyperHTML/test/ie/) for IE9+ and browsers that need transpiled code
+
+#### Weakmap error on ie < 11
+
+'@ungap/weakmap': object is not extensible
+
+Babel freezes the template literals by spec but that causes problems with the weakmap polyfill. To fix this error add the fix explained on [ungap/weakmap](https://github.com/ungap/weakmap#transpiled-code-and-frozen-objects-in-legacy-browsers)
 
 ## HTML Syntax Highlight
 
@@ -138,7 +153,7 @@ Please ask anything you'd like to know in [StackOverflow](https://stackoverflow.
 
 #### hyper or lit ?
 
-You can read more on this [hyperHTML vs lit-html](https://gist.github.com/WebReflection/fadcc419f5ccaae92bc167d8ff5c611b) comparison.
+You can read more on this [hyperHTML vs lit-html](https://medium.com/@WebReflection/lit-html-vs-hyperhtml-vs-lighterhtml-c084abfe1285) comparison.
 
 #### installation?
 

cjs/classes/Component.js

@@ -107,7 +107,7 @@ function setup(content) {
           event.component = this;
           return (_wire$.dispatchEvent ?
                     _wire$ :
-                    _wire$.childNodes[0]
+                    _wire$.firstChild
                   ).dispatchEvent(event);
         }
         return false;
@@ -155,3 +155,12 @@ const setValue = (self, secret, value) =>
       value
   })[secret]
 ;
+
+Object.defineProperties(
+  Component.prototype,
+  {
+    // used to distinguish better than instanceof
+    ELEMENT_NODE: {value: 1},
+    nodeType: {value: -1}
+  }
+);

cjs/hyper/render.js

@@ -1,9 +1,9 @@
 'use strict';
 const WeakMap = (m => m.__esModule ? /* istanbul ignore next */ m.default : /* istanbul ignore next */ m)(require('@ungap/weakmap'));
+const tta = (m => m.__esModule ? /* istanbul ignore next */ m.default : /* istanbul ignore next */ m)(require('@ungap/template-tag-arguments'));
 
 const {OWNER_SVG_ELEMENT} = require('../shared/constants.js');
 const {Tagger} = require('../objects/Updates.js');
-const {reArguments} = require('../shared/utils.js');
 
 // a weak collection of contexts that
 // are already known to hyperHTML
@@ -15,7 +15,7 @@ const bewitched = new WeakMap;
 // The `this` context is either a regular DOM node or a fragment.
 function render() {
   const wicked = bewitched.get(this);
-  const args = reArguments.apply(null, arguments);
+  const args = tta.apply(null, arguments);
   if (wicked && wicked.template === args[0]) {
     wicked.tagger.apply(null, args);
   } else {
@@ -28,13 +28,12 @@ function render() {
 // parse it once, if unknown, to map all interpolations
 // as single DOM callbacks, relate such template
 // to the current context, and render it after cleaning the context up
-function upgrade() {
-  const args = reArguments.apply(null, arguments);
+function upgrade(template) {
   const type = OWNER_SVG_ELEMENT in this ? 'svg' : 'html';
   const tagger = new Tagger(type);
-  bewitched.set(this, {tagger, template: args[0]});
+  bewitched.set(this, {tagger, template: template});
   this.textContent = '';
-  this.appendChild(tagger.apply(null, args));
+  this.appendChild(tagger.apply(null, arguments));
 }
 
 Object.defineProperty(exports, '__esModule', {value: true}).default = render;

cjs/hyper/wire.js

@@ -1,12 +1,10 @@
 'use strict';
 const WeakMap = (m => m.__esModule ? /* istanbul ignore next */ m.default : /* istanbul ignore next */ m)(require('@ungap/weakmap'));
-const trim = (m => m.__esModule ? /* istanbul ignore next */ m.default : /* istanbul ignore next */ m)(require('@ungap/trim'));
+const tta = (m => m.__esModule ? /* istanbul ignore next */ m.default : /* istanbul ignore next */ m)(require('@ungap/template-tag-arguments'));
 
-const {ELEMENT_NODE} = require('../shared/constants.js');
-const Wire = (m => m.__esModule ? /* istanbul ignore next */ m.default : /* istanbul ignore next */ m)(require('../classes/Wire.js'));
+const Wire = (m => m.__esModule ? /* istanbul ignore next */ m.default : /* istanbul ignore next */ m)(require('hyperhtml-wire'));
 
 const {Tagger} = require('../objects/Updates.js');
-const {reArguments} = require('../shared/utils.js');
 
 // all wires used per each context
 const wires = new WeakMap;
@@ -33,7 +31,7 @@ const wire = (obj, type) => obj == null ?
 const content = type => {
   let wire, tagger, template;
   return function () {
-    const args = reArguments.apply(null, arguments);
+    const args = tta.apply(null, arguments);
     if (template !== args[0]) {
       template = args[0];
       tagger = new Tagger(type);
@@ -69,24 +67,16 @@ const weakly = (obj, type) => {
 // stay associated with the original interpolation.
 // To prevent hyperHTML from forgetting about a fragment's sub-nodes,
 // fragments are instead returned as an Array of nodes or, if there's only one entry,
-// as a single referenced node which, unlike framents, will indeed persist
+// as a single referenced node which, unlike fragments, will indeed persist
 // wire content throughout multiple renderings.
 // The initial fragment, at this point, would be used as unique reference to this
 // array of nodes or to this single referenced node.
 const wireContent = node => {
   const childNodes = node.childNodes;
-  const length = childNodes.length;
-  const wireNodes = [];
-  for (let i = 0; i < length; i++) {
-    let child = childNodes[i];
-    if (
-      child.nodeType === ELEMENT_NODE ||
-      trim.call(child.textContent).length !== 0
-    ) {
-      wireNodes.push(child);
-    }
-  }
-  return wireNodes.length === 1 ? wireNodes[0] : new Wire(wireNodes);
+  const {length} = childNodes;
+  return length === 1 ?
+    childNodes[0] :
+    (length ? new Wire(childNodes) : node);
 };
 
 exports.content = content;

cjs/index.js

@@ -11,7 +11,6 @@ const {observe, Tagger} = require('./objects/Updates.js');
 const wire = (m => m.__esModule ? /* istanbul ignore next */ m.default : /* istanbul ignore next */ m)(require('./hyper/wire.js'));
 const {content, weakly} = require('./hyper/wire.js');
 const render = (m => m.__esModule ? /* istanbul ignore next */ m.default : /* istanbul ignore next */ m)(require('./hyper/render.js'));
-const { G } = require('./shared/constants.js');
 
 // all functions are self bound to the right context
 // you can do the following
@@ -35,7 +34,6 @@ hyper.wire = wire;
 // that don't necessarily need upfront polyfills
 // i.e. those still targeting IE
 hyper._ = {
-  global: G,
   WeakMap,
   WeakSet
 };