$
This commit is contained in:
91
node_modules/@riotjs/lazy/lazy.js
generated
vendored
Normal file
91
node_modules/@riotjs/lazy/lazy.js
generated
vendored
Normal file
@@ -0,0 +1,91 @@
|
||||
(function (global, factory) {
|
||||
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('riot'), require('@riotjs/util/dom')) :
|
||||
typeof define === 'function' && define.amd ? define(['riot', '@riotjs/util/dom'], factory) :
|
||||
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.lazy = factory(global.riot, global.dom));
|
||||
})(this, (function (riot, dom) { 'use strict';
|
||||
|
||||
const cache = new WeakMap(); // expose the cache as static property
|
||||
|
||||
lazy.cache = cache; // static attribute in case we want to just export a lazy riot component
|
||||
|
||||
lazy.export = function lazyExport(Loader, Component) {
|
||||
// it could be that the user don't want to use a loader for whatever reason
|
||||
const hasLoader = Loader && Component;
|
||||
const LazyComponent = hasLoader ? Component : Loader;
|
||||
|
||||
const load = () => typeof LazyComponent === 'function' ? LazyComponent() : Promise.resolve(LazyComponent);
|
||||
|
||||
const cachedComponent = cache.get(LazyComponent);
|
||||
return riot.pure(_ref => {
|
||||
let {
|
||||
slots,
|
||||
attributes,
|
||||
props
|
||||
} = _ref;
|
||||
return {
|
||||
mount(el, parentScope) {
|
||||
this.el = el;
|
||||
this.isMounted = true;
|
||||
|
||||
const mount = () => {
|
||||
this.mountLazyComponent(parentScope);
|
||||
this.el.dispatchEvent(new Event('load'));
|
||||
};
|
||||
|
||||
if (cachedComponent) {
|
||||
mount();
|
||||
} else {
|
||||
if (hasLoader) this.createManagedComponent(Loader, parentScope);
|
||||
load().then(data => {
|
||||
cache.set(LazyComponent, data.default || data);
|
||||
mount();
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
createManagedComponent(Child, parentScope) {
|
||||
this.component = riot.component(Child)(this.el, props, {
|
||||
attributes,
|
||||
slots,
|
||||
parentScope
|
||||
});
|
||||
},
|
||||
|
||||
mountLazyComponent(parentScope) {
|
||||
// if this component was unmounted just return here
|
||||
if (!this.isMounted) return; // unmount the loader if it was previously created
|
||||
|
||||
if (this.component) {
|
||||
// unmount the bindings (keeping the root node)
|
||||
this.component.unmount(true); // clean the DOM
|
||||
|
||||
if (this.el.children.length) dom.cleanNode(this.el);
|
||||
} // replace the old component instance with the new lazy loaded component
|
||||
|
||||
|
||||
this.createManagedComponent(cache.get(LazyComponent), parentScope);
|
||||
},
|
||||
|
||||
update(parentScope) {
|
||||
if (this.isMounted && this.component) this.component.update({}, parentScope);
|
||||
},
|
||||
|
||||
unmount() {
|
||||
this.isMounted = false;
|
||||
if (this.component) this.component.unmount(...arguments);
|
||||
}
|
||||
|
||||
};
|
||||
});
|
||||
};
|
||||
|
||||
function lazy(Loader, Component) {
|
||||
return {
|
||||
name: 'lazy',
|
||||
exports: lazy.export(Loader, Component)
|
||||
};
|
||||
}
|
||||
|
||||
return lazy;
|
||||
|
||||
}));
|
Reference in New Issue
Block a user