lemonadejs - npm Package Compare versions

Comparing version 4.2.2 to 4.3.0

dist/index.js

 /**
- * LemonadeJS v4.2.1 (ESM build)
+ * LemonadeJS v4.3.0 (ESM build)
  *
@@ -1181,2 +1181,6 @@ * Website: https://lemonadejs.net
 
+    /**
+     * Create a Web Component
+     * @param {string} name - web component name
+     */
     L.createWebComponent = function(name, handler, options) {
@@ -1187,4 +1191,8 @@ if (typeof(handler) !== 'function') {
 
-        const componentName = 'lm-' + name;
+        // Prefix
+        let prefix = options && options.prefix ? options.prefix : 'lm';
 
+        // Component name
+        const componentName = prefix + '-' + name;
+
         // Check if the component is already defined
@@ -1200,4 +1208,12 @@ if (customElements.get(componentName)) {
                 connectedCallback() {
+                    // LemonadeJS self
+                    let self = this;
+                    // First call
+                    let state = typeof(this.el) === 'undefined';
                     // LemonadeJS is already rendered
-                    if (typeof(this.el) === 'undefined') {
+                    if (state === true) {
+                        // Get attributes
+                        let props = getAttributes.call(self, true);
+                        // Copy all values to the object
+                        L.setProperties.call(self, props, true);
                         // Render
@@ -1208,3 +1224,3 @@ if (options && options.applyOnly === true) {
                             // Apply
-                            L.apply(this, this);
+                            L.apply(this, self);
                         } else {
@@ -1219,3 +1235,3 @@ let root = this;
                             requestAnimationFrame(() => {
-                                L.render(handler, root, this);
+                                L.render(handler, root, self);
                             });
@@ -1226,7 +1242,13 @@ }
                     requestAnimationFrame(() => {
-                        if (typeof(this.onconnect) === 'function') {
-                            this.onconnect(false);
+                        if (typeof(self.onconnect) === 'function') {
+                            self.onconnect(self, state);
                         }
                     });
                 }
+
+                disconnectedCallback() {
+                    if (typeof(this.ondisconnect) === 'function') {
+                        this.ondisconnect(this);
+                    }
+                }
             }
@@ -1233,0 +1255,0 @@

dist/lemonade.d.ts

@@ -18,2 +18,4 @@ /**
         applyOnly?: boolean,
+        /** Web component prefix name. Default: 'lm' */
+        prefix?: string,
     }
@@ -20,0 +22,0 @@

dist/lemonade.js

 /**
- * LemonadeJS v4.2.1
+ * LemonadeJS v4.3.0
  *
@@ -1186,2 +1186,8 @@ * Website: https://lemonadejs.net
 
+    /**
+     * Create a Web Component
+     * @param {string} name - web component name
+     * @param {function} handler - lemonadejs component
+     * @param {object} options - options to create the web components
+     */
     L.createWebComponent = function(name, handler, options) {
@@ -1192,4 +1198,8 @@ if (typeof(handler) !== 'function') {
 
-        const componentName = 'lm-' + name;
+        // Prefix
+        let prefix = options && options.prefix ? options.prefix : 'lm';
 
+        // Component name
+        const componentName = prefix + '-' + name;
+
         // Check if the component is already defined
@@ -1205,4 +1215,12 @@ if (customElements.get(componentName)) {
                 connectedCallback() {
+                    // LemonadeJS self
+                    let self = this;
+                    // First call
+                    let state = typeof(this.el) === 'undefined';
                     // LemonadeJS is already rendered
-                    if (typeof(this.el) === 'undefined') {
+                    if (state === true) {
+                        // Get attributes
+                        let props = getAttributes.call(self, true);
+                        // Copy all values to the object
+                        L.setProperties.call(self, props, true);
                         // Render
@@ -1213,3 +1231,3 @@ if (options && options.applyOnly === true) {
                             // Apply
-                            L.apply(this, this);
+                            L.apply(this, self);
                         } else {
@@ -1224,3 +1242,3 @@ let root = this;
                             requestAnimationFrame(() => {
-                                L.render(handler, root, this);
+                                L.render(handler, root, self);
                             });
@@ -1231,7 +1249,13 @@ }
                     requestAnimationFrame(() => {
-                        if (typeof(this.onconnect) === 'function') {
-                            this.onconnect(false);
+                        if (typeof(self.onconnect) === 'function') {
+                            self.onconnect(self, state);
                         }
                     });
                 }
+
+                disconnectedCallback() {
+                    if (typeof(this.ondisconnect) === 'function') {
+                        this.ondisconnect(this);
+                    }
+                }
             }
@@ -1238,0 +1262,0 @@

package.json

@@ -42,3 +42,3 @@ {
     "types": "dist/lemonade.d.ts",
-    "version": "4.2.2"
+    "version": "4.3.0"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

103419

increased by1.85%

Lines of code

2441

increased by1.84%

No dependency changes