@litejs/ui 21.8.0 → 21.11.0

package/component/form1.tpl

@@ -140,13 +140,11 @@
 	}
 	.btn:hover,
 	.btn:focus {
-		background-color: #eee;
-		color: #333;
+		filter: brightness(1.3) saturate(1.2);
 		text-decoration: none;
 	}
 	.btn:active,
 	.btn.is-active {
-		background-color: #ccc;
 		box-shadow: inset 0 0 8px rgba(0, 0, 0, .5);
 	}
 

package/css/base.css

@@ -194,7 +194,6 @@ button,
 .btn,
 .nowrap,
 .ellipsis {
-	overflow: hidden;
 	text-overflow: ellipsis;
 	white-space: nowrap;
 }

package/index.js

@@ -1,5 +1,5 @@
 /*
-* @version  21.8.0
+* @version  21.11.0
 * @author   Lauri Rooden <lauri@rooden.ee>
 * @license  MIT License
 */
@@ -555,8 +555,7 @@
 		for (k in obj) if (typeof obj[k] == "function" && ignore.indexOf(k) < 0) !function(k) {
 			hooked.push(k, hasOwn.call(obj, k) && obj[k])
 			obj[k] = function() {
-				if (hooks === null) obj[k].apply(this, arguments)
-				else hooks.push(k, arguments)
+				hooks.push(k, arguments)
 				return obj
 			}
 		}(k)
@@ -1935,7 +1934,7 @@
 	/*** kb ***/
 	var kbMaps = []
 	, kbMod = El.kbMod = iOS ? "metaKey" : "ctrlKey"
-	, kbKeys = {
+	, kbMap = El.kbMap = {
 		  8: "backspace", 9: "tab",
 		 13: "enter",    16: "shift", 17: "ctrl",  18: "alt",  19: "pause",
 		 20: "caps",     27: "esc",
@@ -1968,7 +1967,7 @@
 			var c = e.keyCode || e.which
 			, numpad = c > 95 && c < 106
 			, code = numpad ? c - 48 : c
-			, key = kbKeys[code] || String.fromCharCode(code).toLowerCase() || code
+			, key = kbMap[code] || String.fromCharCode(code).toLowerCase() || code
 
 			// Otherwise IE backspace navigates back
 			if (code == 8 && kbMaps[0].backspace) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@litejs/ui",
-  "version": "21.8.0",
+  "version": "21.11.0",
   "description": "UI engine for LiteJS full-stack framework",
   "license": "MIT",
   "author": "Lauri Rooden <lauri@rooden.ee>",
@@ -22,7 +22,7 @@
     "css"
   ],
   "litejs": {
-    "build": "--out=test/index.html test/dev.html"
+    "build": "lj b --out=test/index.html test/dev.html"
   },
   "jshintConfig": {
     "asi": true,

package/polyfill/index.js

@@ -21,6 +21,7 @@
 
 !function(window, Function) {
 
+	// Array#flat()         - Chrome69, Edge79, Firefox62, Safari12
 	// window.PointerEvent  - Chrome55, Edge12, Firefox59, Safari13,   IE11
 	// navigator.sendBeacon - Chrome39, Edge14, Firefox31, Safari11.1
 	// Object.fromEntries   - Chrome73, Edge79, Firefox63, Safari12.1, Opera60, Node.js12.0.0
@@ -30,7 +31,6 @@
 	, P = "prototype"
 	, O = window
 	, patched = (window.xhr || window)._p = []
-	, aSlice = patched.slice
 	, jsonRe = /[\x00-\x1f\x22\x5c]/g
 	, JSONmap = {"\b":"\\b","\f":"\\f","\n":"\\n","\r":"\\r","\t":"\\t",'"':'\\"',"\\":"\\\\"}
 	, hasOwn = JSONmap.hasOwnProperty
@@ -88,6 +88,9 @@
 		c: "touchcancel"
 	}
 
+	// Missing PointerEvents with Scribble enable on Safari 14
+	// https://mikepk.com/2020/10/iOS-safari-scribble-bug/
+	// https://bugs.webkit.org/show_bug.cgi?id=217430
 
 	if (!window.PointerEvent) {
 		// IE10
@@ -161,7 +164,7 @@
 	patch("escape", "return X(a)", esc("a", 0) != "a", esc)
 
 	// Patch parameters support for setTimeout callback
-	patch("setTimeout", (a = "var A=arguments;return O(X(a)&&A.length>2?a.apply.bind(a,null,S.call(A,2)):a,b)"), ie6789, isFn)
+	patch("setTimeout", (a = "return O(X(a)&&A.length>2?a.apply.bind(a,null,S.call(A,2)):a,b)"), ie6789, isFn)
 	patch("setInterval", a, ie6789, isFn)
 
 	function createStorage(name) {
@@ -261,21 +264,24 @@
 	O = Date
 	patch("d:now", a)
 
+	/*** toISOString ***/
 	O = O[P]
 	// IE8 toJSON does not return milliseconds
+	// ISO 8601 format is always 24 or 27 characters long,
+	// YYYY-MM-DDTHH:mm:ss.sssZ or ±YYYYYY-MM-DDTHH:mm:ss.sssZ
 	patch("toISOString", patch("toJSON", [
-		"return t.getUTCFullYear(", "Month()+1,'-'", "Date(),'-'",
-		"Hours(),'T'", "Minutes(),':'", "Seconds(),':'", "Milliseconds(),'.')+'Z'"
-	].join(")+X(t.getUTC"), ie678, function(n, b){ return b + ("00" + n).slice((b !== ".")-3) }))
-
+		"a=t.getUTCFullYear();if(a!==a)throw RangeError('Invalid time');return(b=a<0?'-':a>9999?'+':'')+X(a<0?-a:a,'-',b?6:4", "Month()+1,'-'", "Date(),'T'",
+		"Hours(),':'", "Minutes(),':'", "Seconds(),'.'", "Milliseconds(),'Z',3)"
+	].join(")+X(t.getUTC"), ie678, function(a, b, c){ return ("00000" + a).slice(-c || -2) + b }))
+	/**/
 
 	O = Function[P]
 	// Chrome7, FF4, IE9, Opera 11.60, Safari 5.1.4
-	patch("bind", "b=S.call(arguments,1);c=function(){return t.apply(this instanceof c?this:a,b.concat(S.call(arguments)))};if(t[P])c[P]=t[P];return c")
+	patch("bind", "b=S.call(A,1);c=function(){return t.apply(this instanceof c?this:a,b.concat(S.call(arguments)))};if(t[P])c[P]=t[P];return c")
 
 
 	O = Object
-	patch("assign", "var k,i=1,A=arguments,l=A.length;for(;i<l;)if(t=A[i++])for(k in t)if(o.call(t,k))a[k]=t[k];return a")
+	patch("assign", "var k,i=1,l=A.length;for(;i<l;)if(t=A[i++])for(k in t)if(o.call(t,k))a[k]=t[k];return a")
 	patch("create", "X[P]=a||Y;return new X", 0, nop, {
 		// oKeys is undefined at this point
 		constructor: oKeys, hasOwnProperty: oKeys, isPrototypeOf: oKeys, propertyIsEnumerable: oKeys,
@@ -298,6 +304,7 @@
 	// TODO:2021-02-25:lauri:Accept iterable objects
 	//patch("from", "a=S.call(a);return b?a.map(b,c):a")
 	patch("from", "a=typeof a==='string'?a.split(''):b?a:S.call(a);return b?a.map(b,c):a")
+	patch("of", "return S.call(A)")
 
 	O = O[P]
 	a = "var l=t.length,o=[],i=-1;"
@@ -305,7 +312,7 @@
 	patch("indexOf",     a + "i+=b|0;while(++i<l)" + c)
 	patch("lastIndexOf", a + "i=(b|0)||l;i>--l&&(i=l)||i<0&&(i+=l);++i;while(--i>-1)" + c)
 
-	b = a + "if(arguments.length<2)b=t"
+	b = a + "if(A.length<2)b=t"
 	c = "b=a.call(null,b,t[i],i,t);return b"
 	patch("reduce",      b + "[++i];while(++i<l)" + c)
 	patch("reduceRight", b + "[--l];i=l;while(i--)" + c)
@@ -321,6 +328,7 @@
 	patch("filter",      b + "o.push(t[i])" + c)
 	patch("some",        b + "return!0;return!1")
 
+	patch("flat",        "return a<1?S.call(t):(b=t.concat.apply([],t))&&a>1&&b.some(X)?b.flat(a-1):b", 0, isArr)
 	//patch("entries", "a=this;b=-1;return{next:function(){c=a.length<=++b;return{done:c,value:c?void 0:a[b]}}}")
 
 
@@ -433,7 +441,7 @@
 		var key = key_.split(":").pop()
 		return !force && O[key] || (O[patched.push(key_), key] = (
 			typeof src === "string" ?
-			Function("o,O,P,S,F,X,Y", "return function(a,b,c){var t=this;" + src + "}")(hasOwn, O[key], P, aSlice, force, arg1, arg2) :
+			Function("o,O,P,S,F,X,Y", "return function(a,b,c){var t=this,A=arguments;" + src + "}")(hasOwn, O[key], P, patched.slice, force, arg1, arg2) :
 			src || {}
 		))
 	}

package/component/Select.tpl

@@ -1,357 +0,0 @@
-
-
-%css
-	.Select,
-	.Select-box,
-	.Select-edit {
-		display: block;
-		font-size: 14px;
-		font-weight: 400;
-		line-height: 30px;
-		height: 30px;
-		margin: 0;
-		overflow: visible;
-	}
-	.Select-edit,
-	.Select-edit:active,
-	.Select-edit:focus {
-		width: 100%;
-		background: transparent;
-		box-shadow: none;
-		border: 0;
-		pointer-events: none;
-	}
-	.Select-box {
-		position: relative;
-		border-radius: 4px;
-		border: 1px solid #aaa;
-		height: 32px;
-		width: 100%;
-		background: #fff;
-		padding: 0 0px;
-		overflow: hidden;
-	}
-	.Select-box:before {
-		position: absolute;
-		content: "▼";
-		color: #999;
-		right: 4px;
-		pointer-events: none;
-	}
-	.Select-box:hover:before,
-	.Select-box.is-active:before {
-		color: #000;
-	}
-	.Select-box.is-open,
-	.Select-box:focus {
-		border-color: #257;
-		outline: 0 none;
-		box-shadow:
-			0 2px 5px rgba(0, 0, 0, .5) inset,
-			0 0 2px 2px #6ae;
-		outline: 0 none;
-	}
-	.Select-box.is-open {
-		height: auto;
-		max-height: 80vh;
-		z-index: 1;
-	}
-	.sm .Select-box.is-open {
-		position: absolute;
-		top: 10px;
-		bottom: 10px;
-		left: 10px;
-		right: 10px;
-		left: 0;
-		width: 100vw;
-		height: 100vh;
-	}
-	.Select-search,
-	.Select-search:active,
-	.Select-search:focus {
-		display: block;
-		width: 100%;
-		box-shadow: none;
-	}
-	.Select-val {
-		padding: 0px 8px;
-	}
-	.Select-val:hover {
-		color: #fff;
-		background: #3875d7;
-		background-image: linear-gradient(#3875d7 20%, #2a62bc 90%);
-		cursor: default;
-	}
-	.Cal {
-		width: 240px;
-		white-space: nowrap;
-		overflow: hidden;
-	}
-	.Cal > table {
-		width: 240px;
-		height: 240px;
-		text-align: center;
-		display: inline-block;
-		cursor: default;
-	}
-	.Cal.is-month > table {
-		transform: translateX(-240px);
-	}
-	.Cal.is-year > table {
-		transform: translateX(-480px);
-	}
-	.Cal-head {
-		font-size: 1.4em;
-	}
-	.other,
-	.weekNum,
-	.weekday,
-	.weekend {
-		width: 30px;
-		height: 30px;
-		border-radius: 50%;
-		padding: 0;
-	}
-	.monthname:hover,
-	.yearnum:hover,
-	td.other:hover,
-	td.weekday:hover,
-	td.weekend:hover {
-		background: #ddd;
-	}
-	.Cal-year td.act,
-	.Cal-month td.act,
-	.Cal-day td.act {
-		box-shadow: inset 0 0 20px #666;
-	}
-	.yearnum {
-		border-radius: 4px;
-		width: 48px;
-		height: 35px;
-	}
-	.monthname {
-		font-size: 1.4em;
-		border-radius: 4px;
-		width: 79px;
-		height: 52.5px;
-	}
-	.other {
-		color: #999;
-	}
-	.weekNum {
-		font-size: .8em;
-		color: #999;
-	}
-	.weekday {
-	}
-	.weekend {
-		color: #e00;
-	}
-
-%js
-	var inFocus, defaults = {
-		list: {
-		},
-		cal: {
-			format: "LLL"
-		},
-		multi: {}
-	}
-	function Select(el, sub, opts, fill, clean) {
-		console.log("Select", sub, opts)
-		var child
-		, box = el.firstChild
-		, input = box.firstChild
-		, kb = { enter: open }
-		El.on(box, "click", open)
-		function open() {
-			if (child) return
-			box.tabIndex = -1
-			El.cls(box, "is-open")
-			El.append(box, child = El("Select-" + sub))
-			fill(child)
-			El.render(child, El.scope(child, opts))
-		}
-		El.on(box, "focus", function(e) {
-			inFocus = box
-			El.addKb(kb, box)
-		})
-		El.on(box, "blur", blur, 0)
-		el.val = function(val, valObj) {
-			El.val(input, val)
-			if (valObj !== void 0) input.valObject = valObj
-			if (child) {
-
-			}
-		}
-		opts.kill = kill
-		opts.blur = blur
-		function blur(e) {
-			console.log("BLUR", e, box)
-			if (child && e.key !== "Escape") return
-			El.rmKb(kb)
-			El.cls(box, "is-open", box.tabIndex = 0)
-			setTimeout(_close, 1, e)
-		}
-		function _close(e) {
-			if (!child) return
-			try {
-				var act = document.activeElement
-				if (act == box || (act = act.parentNode) == box || act.parentNode == box) return
-			} catch(e) {}
-			kill()
-		}
-		function kill() {
-			if (child) {
-				clean()
-				El.kill(child)
-				child = null
-				//box.blur()
-			}
-		}
-	}
-	El.bindings.SelectCal = function(el, opts) {
-		Select(el, "cal", opts, function(child) {
-			var scope = El.scope(child)
-			, now = scope.now = new Date()
-			set(0)
-			El.on(child, "click", ".Cal-day td", function(e) {
-				console.log("select", e, now)
-				now.setDate(e.target.i)
-				set(0)
-				el.val(now.date(opts.format), now.getTime())
-			})
-			El.on(child, "click", ".Cal-month td", function(e) {
-				now.setMonth(e.target.i)
-				set(0)
-			})
-			El.on(child, "click", ".Cal-year td", function(e) {
-				now.setFullYear(e.target.i)
-				set(1)
-			})
-			function set(view) {
-				var start = new Date(now).startOf("month")
-				scope.day = now.getDate()
-				scope.month = now.getMonth()
-				scope.year = now.getFullYear()
-				scope.yearStart = scope.year - scope.year%5 -20
-				scope.dayOff = (1 - (start.getDay() || 7)) || - 7
-				scope.week = start.date("W") - (scope.dayOff < -6 ? 1 : 0)
-				start.setMonth(scope.month + 1, 0)
-				scope.daysInMonth = start.getDate()
-				start.setDate(0)
-				scope.daysInLastMonth = start.getDate()
-				View.emit("is", 0, child, "calView", view)
-				console.log(scope)
-			}
-		}, function() {
-		})
-	}
-	El.bindings.SelectList = function(el, opts) {
-		var search
-		Select(el, "list", opts, function(child) {
-			search = child[0].firstChild
-			El.on(search, "blur", opts.close)
-			El.on(search, "change", filter)
-			search.focus()
-			El.addKb({
-				bubble: 1,
-				input: 1,
-				up: function() {
-					console.log("UP")
-				},
-				down: function() {
-					console.log("DOWN")
-				},
-				enter: function() {
-					console.log("ENTER")
-
-				}
-			}, child)
-		}, function() {
-			search = null
-		})
-		El.on(el, "click", ".Select-val", select)
-		function select(e) {
-			console.log("select", e)
-			el.val(e.target.valueObj || e.target.textContent)
-			opts.kill()
-		}
-		function filter() {
-		}
-	}
-	El.bindings.SelectMulti = function(el, opts) {
-		Select(el, "multi", opts, function() {
-		}, function() {
-		})
-	}
-
-%el Select
-	.Select
-		.Select-box.anim[tabindex=0]
-			input.Select-edit[tabindex=-1]
-			%child
-
-%el Select-cal
-	.m2.Cal
-		;is: data, "calView", ",1,month,2,year", data.calView || 0
-		table[cellspacing=0].Cal-day.anim
-			caption.Cal-head
-				.btn.is-primary.left.bold
-					="<"
-					;on: "click", ""
-				.btn.is-primary.right.bold
-					=">"
-					;on: "click", ""
-				span.m01
-					;txt: now.date("MMMM")
-					;on: "click", ["calView", 1], "is"
-				span.m01
-					;txt: now.date("YYYY")
-					;on: "click", ["calView", 2], "is"
-			tr
-				th ;txt: "\xa0"
-				th ;every:: [1, 2, 3, 4, 5, 6, 7]
-					;txt:: Date.names[item<7?item + 24 : 24]
-					;cls:: item <6?"weekday":"weekend"
-			tr ;every:: [0,1,2,3,4,5]
-				td.weekNum ;txt:: item + week
-				td
-					;every:: [1, 2, 3, 4, 5, 6, 7]
-					;cls:: "act", (this.i = _super.item*7 + item + dayOff) == day
-					;cls:: this.i < 1 || this.i > daysInMonth ? "other" : item < 6 ? "weekday" : "weekend"
-					;txt:: this.i < 1 ? daysInLastMonth + this.i : this.i > daysInMonth ? this.i - daysInMonth : this.i
-		table[cellspacing=0].Cal-month.anim
-			caption.Cal-head
-				;txt: now.date("YYYY")
-				;on: "click", ["calView", 2], "is"
-			tr.weekRow ;every: [0,1,2,3]
-				td.monthname
-					;every:: [0, 1, 2]
-					;cls:: "act", (this.i = _super.item*3 + item) == month
-					;txt:: Date.names[this.i]
-		table[cellspacing=0].Cal-year.anim
-			caption.Cal-head
-				span {yearStart} - {yearStart+29}
-				;on: "click", ["calView", 0], "is"
-			tr.weekRow ;every: [0,1,2,3,4,5]
-				td.yearnum
-					;every:: [0, 1, 2, 3, 4]
-					;cls:: "act", (this.i = _super.item*5 + item + yearStart) == year
-					;txt:: this.i
-
-%el Select-list
-	div.m1
-		input.Select-search[tabindex=-1]
-		/.Select-clear.hand ×
-	.scroll
-		.Select-val {item.name||item.id}
-			;every: list
-
-%el Select-multi
-	div.m1
-		input.Select-search[tabindex=-1]
-		/.Select-clear.hand ×
-	div
-		.Select-val item 1
-		.Select-val item 2