lilact 0.2.0 → 0.2.2

package/src/components.jsx

@@ -401,6 +401,9 @@ class ComponentCore
 					this.event_detachers[al] = Lilact.addWrappedEventListener(this.element, al.substring(2), patch[a]);
 				}
 				else if(al==='style') {
+					for(const x in patch[a]) {
+						if(isFinite(patch[a][x])) patch[a][x]+='px';
+					}
 					Object.assign(this.element.style, patch[a]);
 				}
 				else {
@@ -418,7 +421,7 @@ class ComponentCore
 		}
 
 ʔ if(DEBUG) {
-		this.element.setAttribute('key', this.props.key);
+		//this.element.setAttribute('key', this.props.key);
 ʔ }		
 
 		this.updateElementClass(patch);

package/src/hooks.jsx

@@ -82,25 +82,27 @@ export function useState(val)
  * @param {Array<any>} deps - Dependency list.
  * @returns {Function} Memoized callback.
  */
-export function useCallback(callback, deps=[{}])
+export function useCallback(callback, deps=undefined)
 {
+	if( deps!==undefined && (typeof(deps)!=='object' || deps.constructor.name!=='Array') ) {
+		throw "callback dependencies must be an array or omitted.";
+	}
+
 	const hk = Lilact.useHook();
 
 	if( Lilact.isEmpty(hk) ) {
 		hk.callback = callback;
-		hk.deps = deps;
 	}
 	else {
-		for(let d in deps) {
-			if( !Lilact.defaultIsEqual(deps[d],hk.deps[d]) ) {
-				hk.callback = callback;
+		if(deps!==undefined && hk?.deps!==undefined && Lilact.shallowEqual(deps, hk.deps)) return hk.callback;
+	}
 
-				hk.deps = deps;
-				break;
-			}
-		}
+	if(hk?.cleanup) {
+		hk.cleanup();
 	}
 
+	hk.deps = deps;
+
 	return hk.callback;
 }
 
@@ -205,7 +207,7 @@ export function useTransition()
  * @param {any} initialValue - Initial value used if nothing exists in localStorage.
  * @returns {any} Stored state/result.
  */
-export function useLocalStorage(key, default_val)
+export function useLocalStorage(key, initialValue)
 {
 
 	const hk = Lilact.useHook();
@@ -218,8 +220,8 @@ export function useLocalStorage(key, default_val)
 	}
 
 	if(val===undefined) {
-		if(typeof(default_val)==='function') default_val = default_val();
-		val = default_val;
+		if(typeof(initialValue)==='function') initialValue = initialValue();
+		val = initialValue;
 		localStorage[key] = JSON.stringify(val);
 	}
 
@@ -249,12 +251,12 @@ export function useLocalStorage(key, default_val)
  * @param {any} initialValue - Initial ref value.
  * @returns {Object} Ref object with `.current`.
  */
-export function useRef(val = null)
+export function useRef(initialValue = null)
 {
 	const hk = Lilact.useHook();
 
 	if( Lilact.isEmpty(hk) ) {
-		hk.current = val;
+		hk.current = initialValue;
 	}
 
 	return hk;
@@ -267,25 +269,25 @@ export function useRef(val = null)
  * @param {Array<any>} [deps] - Dependency list.
  * @returns {void}
  */
-export function useLayoutEffect(setup, deps=[{}])
+export function useLayoutEffect(effect, deps=undefined)
 {
-	if(typeof(deps)!=='object' || deps.constructor.name!=='Array') {
-		throw "effect dependencies must be an array or omitted.";
+	if( deps!==undefined && (typeof(deps)!=='object' || deps.constructor.name!=='Array') ) {
+		throw "layout effect dependencies must be an array or omitted.";
 	}
 
 	const hk = Lilact.useHook();
 
 	if( !Lilact.isEmpty(hk) ) {
-		if(deps.every((v,i)=> v === hk.deps[i])) return;
-		if(hk.cleanup) {
-			hk.cleanup();
-		}
+		if(deps!==undefined && hk?.deps!==undefined && Lilact.shallowEqual(deps, hk.deps)) return;
+	}
+
+	if(hk?.cleanup) {
+		hk.cleanup();
 	}
 
 	hk.deps = deps;
-	Lilact.layout_effects.add( ()=>{ hk.cleanup = setup(); });
+	Lilact.layout_effects.add( ()=>{ hk.cleanup = effect(); });
 	Lilact.current_component[0].component.forceUpdate();
-
 }
 
 /**
@@ -295,23 +297,24 @@ export function useLayoutEffect(setup, deps=[{}])
  * @param {Array<any>} [deps] - Dependency list.
  * @returns {void}
  */
-export function useEffect(setup, deps=[{}])
+export function useEffect(effect, deps=undefined)
 {
-	if(typeof(deps)!=='object' || deps.constructor.name!=='Array') {
+	if( deps!==undefined && (typeof(deps)!=='object' || deps.constructor.name!=='Array') ) {
 		throw "effect dependencies must be an array or omitted.";
 	}
 
 	const hk = Lilact.useHook();
 
 	if( !Lilact.isEmpty(hk) ) {
-		if(deps.every((v,i)=> v === hk.deps[i])) return;
-		if(hk.cleanup) {
-			hk.cleanup();
-		}
+		if(deps!==undefined && hk?.deps!==undefined && Lilact.shallowEqual(deps, hk.deps)) return;
+	}
+
+	if(hk?.cleanup) {
+		hk.cleanup();
 	}
 
 	hk.deps = deps;
-	Lilact.setTimeout( ()=>{ hk.cleanup = setup(); }, 0 );
+	Lilact.setTimeout( ()=>{ hk.cleanup = effect(); }, 0 );
 
 }
 
@@ -322,24 +325,21 @@ export function useEffect(setup, deps=[{}])
  * @param {Array<any>} deps - Dependency list.
  * @returns {any} Memoized value.
  */
-export function useMemo(fn,deps=[])
+export function useMemo(factory,deps=undefined)
 {
+	if( deps!==undefined && (typeof(deps)!=='object' || deps.constructor.name!=='Array') ) {
+		throw "memo dependencies must be an array or omitted.";
+	}
+
 	const hk = Lilact.useHook();
 
-	if( Lilact.isEmpty(hk) ) {
-		hk.deps = deps;
-		hk.value = fn();
-	}
-	else {
-		for(let d in deps) {
-			if( !Lilact.defaultIsEqual(deps[d],hk.deps[d]) ) {
-				hk.deps = deps;
-				hk.value = fn(hk.value);
-				break;
-			}
-		}
+	if( !Lilact.isEmpty(hk) ) {
+		if(deps!==undefined && hk?.deps!==undefined && Lilact.shallowEqual(deps, hk.deps)) return hk.value;
 	}
 
+	hk.deps = deps;
+	hk.value = factory(hk.value);
+
 	return hk.value;
 }
 
@@ -350,14 +350,14 @@ export function useMemo(fn,deps=[])
  * @param {any} initialState - Initial state for the hook.
  * @returns {any} Hook result
  */
-export function useActionState(fn, initial_state)
+export function useActionState(fn, initialState)
 {
 	const hk = Lilact.useHook();
 	const [is_pending, tran_start_func] = Lilact.useTransition();
 
 	if( Lilact.isEmpty(hk) ) {
 
-		hk.state = initial_state;
+		hk.state = initialState;
 
 		hk.form_action = (sub)=>{
 			event.preventDefault();
@@ -486,17 +486,17 @@ export function forwardRef(render)
  *   Dependency list that controls when the exposed value is recalculated.
  * @returns {void}
  */
-export function useImperativeHandle(ref, factory, deps)
+export function useImperativeHandle(ref, factory, deps=undefined)
 {
+	if(deps!==undefined && ref?.deps!==undefined && Lilact.shallowEqual(deps, ref.deps)) return;
+
+	ref.deps = deps;
+
 	Lilact.setTimeout( ()=>{ 
-			if( !Lilact.defaultIsEqual(deps[d],hk.deps[d]) ) {
-				
-				hk.deps = deps;
-				if(typeof ref.current !== object) {
-					ref.current = {};
-				}
-				Object.assign( ref.current, factory(), 0 );	
-			}
-		});
+		if(typeof ref?.current !== 'object') {
+			ref.current = {};
+		}
+		Object.assign( ref.current, factory(), 0 );	
+	}, 0);
 }
 

package/src/misc.jsx

@@ -414,6 +414,18 @@ export let events_set = new Set([
 	"onabort","oncanplay","oncanplaythrough","oncuechange","ondurationchange","onemptied","onended","onerror",
 	"onloadeddata","onloadedmetadata","onloadstart","onpause","onplay","onplaying","onprogress","onratechange",
 	"onseeked","onseeking","onstalled","onsuspend","ontimeupdate","onvolumechange","onwaiting",
-	"ontoggle"
+	"ontoggle",
+
+	"onpointerdown", "onpointerup", "onpointermove", "onpointercancel", "onpointerover", "onpointerout", 
+	"onpointerenter", "onpointerleave"
+])
+/** @ignore */
+export let length_css_attributes_set = new Set([
+	"width","height","minWidth","minHeight","maxWidth","maxHeight","top","right","bottom","left","margin",
+	"marginTop","marginRight","marginBottom","marginLeft","padding","paddingTop","paddingRight","paddingBottom",
+	"paddingLeft","borderWidth","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth",
+	"outlineWidth","fontSize","lineHeight","letterSpacing","wordSpacing","textIndent","borderRadius",
+	"borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius",
+	"columnGap","rowGap","gap"
 ])