lilact 0.31.7 → 0.31.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lilact",
-  "version": "0.31.7",
+  "version": "0.31.9",
   "description": "A Little React/JSX Runtime Implementation for Browser",
   "repository": "github:arashkazemi/lilact",
   "homepage": "https://arashkazemi.github.io/lilact/",

package/src/components.jsx

@@ -30,7 +30,7 @@
 
 import Lilact from './lilact.jsx';
 
-import { CORE, COMPONENT, TEXT, IS_ZOMBIE, IDX, CHILD_CLASS_ADDENDUM, MEMOIZED, LOCATION } from "./symbols.jsx"
+import { CORE, COMPONENT, TEXT, IS_ZOMBIE, IDX, CHILD_CLASS_ADDENDUM, MEMOIZED, LOCATION, CLONED_STYLE } from "./symbols.jsx"
 import { shallowEqual, toBool, isClass, isThenable } from "./misc.jsx";
 
 import { PropTypes } from './proptypes.jsx';
@@ -298,7 +298,7 @@ class ComponentCache
 					ex.cleanup();
 				}
 				else if(ex.element && !ex.portal) {
-					ex.element.parentElement.removeChild(ex.element);
+					ex.element.parentElement?.removeChild?.(ex.element);
 				}
 			});
 		});
@@ -401,6 +401,10 @@ class ComponentCore
 					};
 				}
 
+				if(next_props?.style && typeof next_props.style === 'object' && !next_props.style[CLONED_STYLE]) {
+					next_props.style = { ...next_props.style, [CLONED_STYLE]: true };
+				}
+
 				if(this?.parent?.component?.context || this?.parent?.component?.getChildContext ) {
 					this.context = { ...this.parent.component.context, ...this.parent.component.getChildContext?.() };
 
@@ -553,7 +557,7 @@ class ComponentCore
 					this.props.ref(null);
 				}
 				else {
-					this.props.current = null;
+					this.props.ref.current = null;
 				}
 			}
 
@@ -679,7 +683,7 @@ class ComponentCore
 							}
 							else {
 								for(let p in this.props.style) {
-									if( !patch.style.hasOwnProperty(p) ) {
+									if( p!==CLONED_STYLE && !patch?.style?.hasOwnProperty?.(p) ) {
 										this.element.style[p] = "";
 									}
 								}
@@ -705,7 +709,7 @@ class ComponentCore
 				else if(a==='autoFocus') { // not lower cased(al), as it is set as a js property
 					this.element['autofocus'] = toBool(patch[a]);
 				}
-				else if(a==='htmlFor') { // not lower cased(al), as it is set as a js property
+				else if(a==='htmlFor' || a==='for') { // not lower cased(al), as it is set as a js property
 					this.element.setAttribute('for', patch[a]);
 				}
 				else if(al!=='value' || ['input', 'textarea', 'select'].indexOf(this.entity)===-1) {

package/src/hooks.jsx

@@ -288,8 +288,8 @@ export async function useLayoutEffect(effect, deps)
 
 	if(hk?.cleanup) {
 		await hk.cleanup();
-			hk.cleanup = undefined;
-		}
+		hk.cleanup = undefined;
+	}
 
 	hk.deps = deps;
 	Lilact.layout_effects.add( async ()=>{ hk.cleanup = await effect(); });
@@ -324,7 +324,7 @@ export async function useEffect(effect, deps)
 
 	if(hk?.cleanup) {
 		await hk.cleanup();
-			hk.cleanup = undefined;
+		hk.cleanup = undefined;
 	}
 
 	hk.deps = deps;
@@ -361,7 +361,7 @@ export async function useInsertionEffect(effect, deps)
 
 	if(hk?.cleanup) {
 		await hk.cleanup();
-			hk.cleanup = undefined;
+		hk.cleanup = undefined;
 	}
 
 	hk.deps = deps;
@@ -405,7 +405,7 @@ export function useMemo(factory,deps)
 }
 
 /**
- * React-compatible hook for managing an async/queued action and deriving state from it.
+ * Hook for managing an async/queued action and deriving state from it.
  *
  * @param {Function} action - The async/queued action function.
  * @param {any} initialState - Initial state for the hook.
@@ -427,8 +427,7 @@ export function useActionState(action, initialState)
 					async ()=> {
 						const form_data = new FormData(event.target, event.submitter);
 						hk.state = await action(hk.state, form_data);
-					},
-					[]
+					}
 				);
 
 			return false;

package/src/lilact.jsx

@@ -160,7 +160,7 @@ if(DEBUG) {
 }
 
 if(DEBUG) {
-	console.log(`Lilact (Version: ${Lilact.VERSION}) - Debug Mode`);
-	console.log(`Copyright(C) 2024-2026 Arash Kazemi <contact.arash.kazemi@gmail.com>`);
+	console.info(`Lilact (Version: ${Lilact.VERSION}) - Debug Mode`);
+	console.info(`Copyright(C) 2024-2026 Arash Kazemi <contact.arash.kazemi@gmail.com>`);
 }
 

package/src/misc.jsx

@@ -322,7 +322,6 @@ export function getComponentUnderPointer()
   const overlay = document.createElement('div');
   overlay.style.cssText =
     'position:fixed;inset:0;z-index:2147483647;cursor:crosshair;background:transparent;';
-  document.body.appendChild(overlay);
 
   function click_handler(event) {
 
@@ -342,7 +341,10 @@ export function getComponentUnderPointer()
     return false;
   }
 
-  window.addEventListener('click', click_handler, true);
+  setTimeout( ()=>{
+    document.body.appendChild(overlay);
+    window.addEventListener('click', click_handler, true);
+  }, 50);
 
   return pr;
 }

package/src/symbols.jsx

@@ -40,6 +40,7 @@ export const [
 				CHILD_CLASS_ADDENDUM,
 				MEMOIZED,
 				LAZY,
+				CLONED_STYLE,
 
 				DUE,
 				REPEAT,
@@ -59,6 +60,7 @@ export const [
 				Symbol.for('LILACT:CHILD_CLASS_ADDENDUM'),
 				Symbol.for('LILACT:MEMOIZED'),
 				Symbol.for('LILACT:LAZY'),
+				Symbol.for('LILACT:CLONED_STYLE'),
 
 				Symbol.for('LILACT:TIMERS:DUE'),
 				Symbol.for('LILACT:TIMERS:REPEAT'),