@cocreate/lazy-loader 1.11.4 → 1.12.0

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+# [1.12.0](https://github.com/CoCreate-app/CoCreate-lazy-loader/compare/v1.11.4...v1.12.0) (2023-12-18)
+
+
+### Bug Fixes
+
+* assigning modules to window.CoCreate ([15037d8](https://github.com/CoCreate-app/CoCreate-lazy-loader/commit/15037d8caf95463e629ab162f9f41008070a3f20))
+
+
+### Features
+
+* dispatch event "<component>Loaded" ([5e489e6](https://github.com/CoCreate-app/CoCreate-lazy-loader/commit/5e489e6a9dbf876ee4d17492be713b8dda01811f))
+
 ## [1.11.4](https://github.com/CoCreate-app/CoCreate-lazy-loader/compare/v1.11.3...v1.11.4) (2023-12-10)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocreate/lazy-loader",
-  "version": "1.11.4",
+  "version": "1.12.0",
   "description": "A simple lazy-loader component in vanilla javascript. Easily configured using HTML5 data-attributes and/or JavaScript API.",
   "keywords": [
     "lazy-loader",

package/src/client.js

@@ -1,14 +1,15 @@
 import observer from '@cocreate/observer';
 
-function listen(callback, selector) {
+function listen(name, callback, selector) {
 
-    function observerCallback({ target }) {
-        // let isInit = target.querySelector(selector)/testtt
-        // if (isInit) {
-        callback()
-        // console.log('lazyloaded', selector)
+    async function observerCallback({ target }) {
+        const module = await callback()
         observer.uninit(observerCallback)
-        // }
+        Object.assign(window.CoCreate, {
+            [name]: module.default || module
+        });
+
+        dispatchComponentLoaded(name)
     }
 
     observer.init({
@@ -50,12 +51,19 @@ export async function lazyLoad(name, selector, callback) {
     if (document.querySelector(selector))
         await dependency(name, await callback())
     else
-        listen(callback, selector)
+        listen(name, callback, selector)
 }
 
 export async function dependency(name, promise) {
     let component = await promise;
     Object.assign(window.CoCreate, {
-        [name]: component.default
+        [name]: component.default || component
     });
-}
+    dispatchComponentLoaded(name)
+}
+
+function dispatchComponentLoaded(name) {
+    document.dispatchEvent(new CustomEvent(name + 'Loaded', {
+        detail: { name }
+    }));
+}