lilact 0.27.3 → 0.28.1

package/package.json

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

package/scripts/build.mjs

@@ -104,7 +104,7 @@ await esbuild.build({
   platform: "browser",
 
   outfile: `dist/${outFile}`,
-  target: "es2018",
+  target: "es2020",
   sourcemap: mode === "development",
 
   minify,

package/src/accessories.jsx

@@ -32,10 +32,7 @@
 import { useEffect, useLayoutEffect, useMemo, useRef, useState, useImperativeHandle, useCallback } from "./hooks.jsx";
 import { Children, forwardRef, isThenable } from "./misc.jsx";
 
-//import {setTimeout, clearTimeout} from "./timers.jsx"
 import {Component} from "./components.jsx"
-import {emotion} from "./lilact.jsx"
-const {css,cx} = emotion;
 
 /**
  * A CSS-only loading spinner component.
@@ -375,7 +372,7 @@ export function DragHandle({
 			role="button"
 			tabIndex={0}
 			style={{ ...style, touchAction: "none" }}
-			className={cx(className, isDragging?"dragging":"")}
+			className={`${className}  ${isDragging?"dragging":""}`}
 			onPointerDown={onPointerDown}
 			onPointerMove={onPointerMove}
 			onPointerUp={onPointerUp}

package/src/components.jsx

@@ -283,12 +283,10 @@ if(DEBUG) {
 				}
 			}
 
-
 			if( this?.portal ) {
 				this.element = this.portal;
 			}
 
-
 			if(this.outlet?.constructor?.name!=='Array') {
 				this.outlet = [this.outlet];
 			}
@@ -422,8 +420,18 @@ if(DEBUG) {
 			}
 		}
 		else if(this.entity==="select") {
-			if(patch?.value!==this.element.value) {
-				Lilact._setTimeout(()=>this.element.value=String(patch.value), 0);
+			if(typeof(patch.value)==='string') {
+			 	if(patch.value!==this.element.value) {
+					this.element.value=patch.value;
+				}
+			}
+		}
+		else if(this.entity==="option") {
+			if(this.container?.props?.value?.constructor?.name==='Array') {
+				patch.selected = this.container.props.value.indexOf(patch.value)!==-1;
+			}
+			else if(typeof(this.container?.props?.value)==='string') {
+				patch.selected = this.container.props.value===patch.value;
 			}
 		}
 
@@ -489,8 +497,11 @@ if(DEBUG) {
 					}
 				}
 				else if(boolean_html_attributes_set.has(a)) { // not lower cased(al), as it is set as a js property
-					this.element[a] = toBool(patch[a]);
-					if(!this.element[a]) this.element.removeAttribute(a);
+					const v = toBool(patch[a]);
+					
+					if(v!==this.element[a]) {
+						this.element[a] = v;
+					}
 				}
 				else if(a==='autoFocus') { // not lower cased(al), as it is set as a js property
 					this.element['autofocus'] = toBool(patch[a]);
@@ -498,10 +509,8 @@ if(DEBUG) {
 				else if(a==='htmlFor') { // 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) {
-						this.element.setAttribute(al, patch[a]);
-					}
+				else if(al!=='value' || ['input', 'textarea', 'select'].indexOf(this.entity)===-1) {
+					this.element.setAttribute(al, patch[a]);
 				}
 			}
 		}
@@ -514,10 +523,6 @@ if(DEBUG) {
 			this.element.onsubmit = undefined;
 		}
 
-if(DEBUG) {
-		//this.element.setAttribute('key', this.props.key);
-}		
-
 		this.updateElementClass(patch);
 	}
 
@@ -1411,7 +1416,7 @@ export const length_css_attributes_set = new Set([
 
 /** @ignore */
 export const boolean_html_attributes_set = new 
-	Set(["disabled", "readOnly", "required", "checked", "multiple",
+	Set(["disabled", "readOnly", "required", "checked", "multiple", "selected",
 			 "hidden","open","loop","muted","controls","playsInline","allowFullScreen"]);
 
 

package/src/errors.jsx

@@ -301,8 +301,9 @@ export function globalErrorHandler(eventOrError) {
 	);
 
 	const className = css(`
-		background: linear-gradient(135deg, #fff2f2d4, #ffffffd4);
-		backdrop-filter: blur(10px);
+		background: #fff;
+		text-shadow: 0 0 3px #fff;
+		-backdrop-filter: blur(20px);
 		border: 1px solid rgba(255,255,255,.25);
 		border-radius: 5px;
 		box-shadow: 0 10px 30px rgba(0,0,0,.35);
@@ -315,10 +316,11 @@ export function globalErrorHandler(eventOrError) {
 		}
 
 		code {
-			border: 1px solid #0003;
+			background: #0001;
 			overflow: auto;
 			padding: 10px;
 			display: block;
+			border-radius: 3px;
 		}
 	`);
 

package/src/lilact.jsx

@@ -126,10 +126,10 @@ export const Lilact =
 	redux,
 	emotion,
 
-	_setTimeout: window.setTimeout.bind(window),
-	_setInterval: window.setInterval.bind(window),
-	_clearTimeout: window.clearTimeout.bind(window),
-	_clearInterval: window.clearInterval.bind(window),
+	_setTimeout: globalThis.setTimeout.bind(globalThis),
+	_setInterval: globalThis.setInterval.bind(globalThis),
+	_clearTimeout: globalThis.clearTimeout.bind(globalThis),
+	_clearInterval: globalThis.clearInterval.bind(globalThis),
 
 }
 

package/src/run.jsx

@@ -341,7 +341,7 @@ export function require(path) {
 	* A completed module can be returned synchronously unless the caller
 	* explicitly requests lazy loading.
 	*/
-	if (module.loaded && !options.forceUpdate && !loadAsync) {
+	if (module.loaded && !options.forceUpdate) {
 		return module.exports;
 	}