lemonadejs - npm Package Compare versions

Comparing version 4.0.7 to 4.1.0

dist/index.js

 /**
- * LemonadeJS v4.0.7 (ESM build)
+ * LemonadeJS v4.1.0 (ESM build)
  *
@@ -292,6 +292,10 @@ * Website: https://lemonadejs.net
         } else {
-            if (v === '') {
-                e.removeAttribute(t);
+            if (isDOM(e)) {
+                if (v === '') {
+                    e.removeAttribute(t);
+                } else {
+                    e.setAttribute(t, v);
+                }
             } else {
-                e.setAttribute(t, v);
+                e[t] = v;
             }
@@ -423,3 +427,3 @@ }
                 // Protect from loop
-                if (o.e[a] == v) {
+                if (o.e[a] === v) {
                     return;
@@ -495,6 +499,8 @@ }
                 set: function (v) {
-                    // Update val
-                    value = v;
-                    // Refresh bound elements
-                    dispatch.call(this, p);
+                    // Only update if the value is really different
+                    if (value !== v) {
+                        value = v;
+                        // Refresh bound elements
+                        dispatch.call(this, p);
+                    }
                 },
@@ -689,19 +695,24 @@ get: function () {
                 // Parse events
-                if (! handler && k[i].substring(0,2) === 'on') {
-                    // Remove any inline javascript from the template
-                    element.removeAttribute(k[i]);
-                    element.addEventListener(k[i].substring(2), (e) => {
-                        // If not a method, should be converted to a method
-                        if (typeof(value) !== 'function') {
-                            let t = extractFromPath.call(self, prop);
-                            if (t) {
-                                value = t;
+                if (k[i].substring(0,2) === 'on') {
+                    if (handler) {
+                        // Parse attributes
+                        parseTokens.call(self, { e: element, a: k[i], v: value, s: self, reference: true })
+                    } else {
+                        // Remove any inline javascript from the template
+                        element.removeAttribute(k[i]);
+                        element.addEventListener(k[i].substring(2), (e) => {
+                            // If not a method, should be converted to a method
+                            if (typeof (value) !== 'function') {
+                                let t = extractFromPath.call(self, prop);
+                                if (t) {
+                                    value = t;
+                                }
                             }
-                        }
-                        if (typeof(value) === 'function') {
-                            value.call(element, e, self);
-                        } else {
-                            Function('self', 'e', value).call(element, self, e);
-                        }
-                    });
+                            if (typeof (value) === 'function') {
+                                value.call(element, e, self);
+                            } else {
+                                Function('self', 'e', value).call(element, self, e);
+                            }
+                        });
+                    }
                 } else {
@@ -708,0 +719,0 @@ // Check for special properties

dist/lemonade.d.ts

@@ -14,4 +14,9 @@ /**
     interface ComponentEvents {
+        /**
+         * When the component is ready and appended to the DOM
+         */
         onload?: OnloadFunction;
-
+        /**
+         * When a property used in the template is changed. Properties are tracked only when used in the template.
+         */
         onchange?: OnchangeFunction;
@@ -21,8 +26,15 @@ }
     type FunctionComponent = (this: {
+        /**
+         * Root element of the component
+         */
         el: HTMLElement;
-
+        /**
+         * Parent component self
+         */
         parent: FunctionComponent;
-
+        /**
+         * Refresh a property that is an array or the entire component.
+         * @param target
+         */
         refresh: (target?: string) => void
-
         [key: string]: any;
@@ -33,9 +45,8 @@ } & ComponentEvents) => void
         constructor(s?: Record<string, any>);
-
+        // Root DOM element
         el: HTMLElement;
-
+        // Self which called the child component
         parent: FunctionComponent;
-
+        // Refresh an array or the entire component
         refresh: (target?: string) => void
-
         [key: string]: any;
@@ -58,4 +69,6 @@ }
      * @param {Object} self inject a self object to the renderer
+     * @param {string?} template template to be passed to component
+     * @return {HTMLElement} Result DOM element, ready to be append to the DOM
      */
-    function render(component: Function, root: HTMLElement, self?: Object) : false | Element | Document | DocumentFragment;
+    function render(component: Function, root: HTMLElement, self?: Object, template?: String) : false | Element | Document | DocumentFragment;
 
@@ -62,0 +75,0 @@ /**

dist/lemonade.js

 /**
- * LemonadeJS v4.0.7
+ * LemonadeJS v4.1.0
  *
@@ -297,6 +297,10 @@ * Website: https://lemonadejs.net
         } else {
-            if (v === '') {
-                e.removeAttribute(t);
+            if (isDOM(e)) {
+                if (v === '') {
+                    e.removeAttribute(t);
+                } else {
+                    e.setAttribute(t, v);
+                }
             } else {
-                e.setAttribute(t, v);
+                e[t] = v;
             }
@@ -428,3 +432,3 @@ }
                 // Protect from loop
-                if (o.e[a] == v) {
+                if (o.e[a] === v) {
                     return;
@@ -500,6 +504,8 @@ }
                 set: function (v) {
-                    // Update val
-                    value = v;
-                    // Refresh bound elements
-                    dispatch.call(this, p);
+                    // Only update if the value is really different
+                    if (value !== v) {
+                        value = v;
+                        // Refresh bound elements
+                        dispatch.call(this, p);
+                    }
                 },
@@ -694,19 +700,24 @@ get: function () {
                 // Parse events
-                if (! handler && k[i].substring(0,2) === 'on') {
-                    // Remove any inline javascript from the template
-                    element.removeAttribute(k[i]);
-                    element.addEventListener(k[i].substring(2), (e) => {
-                        // If not a method, should be converted to a method
-                        if (typeof(value) !== 'function') {
-                            let t = extractFromPath.call(self, prop);
-                            if (t) {
-                                value = t;
+                if (k[i].substring(0,2) === 'on') {
+                    if (handler) {
+                        // Parse attributes
+                        parseTokens.call(self, { e: element, a: k[i], v: value, s: self, reference: true })
+                    } else {
+                        // Remove any inline javascript from the template
+                        element.removeAttribute(k[i]);
+                        element.addEventListener(k[i].substring(2), (e) => {
+                            // If not a method, should be converted to a method
+                            if (typeof (value) !== 'function') {
+                                let t = extractFromPath.call(self, prop);
+                                if (t) {
+                                    value = t;
+                                }
                             }
-                        }
-                        if (typeof(value) === 'function') {
-                            value.call(element, e, self);
-                        } else {
-                            Function('self', 'e', value).call(element, self, e);
-                        }
-                    });
+                            if (typeof (value) === 'function') {
+                                value.call(element, e, self);
+                            } else {
+                                Function('self', 'e', value).call(element, self, e);
+                            }
+                        });
+                    }
                 } else {
@@ -713,0 +724,0 @@ // Check for special properties

package.json

@@ -42,3 +42,3 @@ {
     "types": "dist/lemonade.d.ts",
-    "version": "4.0.7"
+    "version": "4.1.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

97251

increased by1.89%

Lines of code

2290

increased by1.91%

No dependency changes