efront 4.22.14 → 4.22.16

package/coms/compile//347/264/240/351/246/250.js

@@ -441,18 +441,29 @@ var fixBase = function (b, a) {
     return splitParams(a).map(a => {
         if (presets.test(a)) a = `@{${a}}`;
         var replaced = false;
+        var rootindex = 0;
+        a.replace(/\:root/g, function (match, index) {
+            rootindex = match.length + index;
+            return '';
+        })
+        if (rootindex > 0) a = a.slice(rootindex);
         return splitParams(b).map(b => {
-            b = b.replace(/^(&|\:scope|\:root)\s*/g, "");
-            if (!b) return a;
-            var a1 = a.replace(/&|\:scope|\:root/g, function (match) {
+            var b1 = b.replace(/^\:root\s*/g, '');
+            var rindex = rootindex;
+            if (b1.length !== b.length) rindex = true;;
+            b = b1;
+            b = b.replace(/^(&|\:scope)\s*/g, "");
+            var a1 = a.replace(/&|\:scope/g, function () {
                 replaced = true;
-                return b;
+                if (!rindex) return b;
+                return '';
             });
+            if (!b && !replaced) return a1;
             if (!replaced) {
                 if (/^[\>~\+]/.test(a) || /[\>~\+]$/.test(b)) {
-                    a1 = b + a;
+                    a1 = b + a1;
                 }
-                else a1 = b + " " + a;
+                else if (!rindex) a1 = b + " " + a;
             }
             return a1;
         }).join(",");
@@ -494,7 +505,7 @@ var Method = function () {
     vlist.pop();
     return body;
 }
-var vlist = [], mlist = [macros], clist = [], base = '';
+var vlist = [], mlist = [macros], clist = [], base = "";
 var killneg = function (v, n) {
     if (n === "-") {
         if (/^\-/.test(v)) {
@@ -529,7 +540,7 @@ var initvars = function (vars) {
 };
 var evalthis = function (p) {
     var temp = base;
-    base = p.base;
+    base = p.base || "&";
     var res = eval2(p.used);
     base = temp;
     return res;

package/coms/compile//347/264/240/351/246/250_test.js

@@ -62,10 +62,10 @@ test(`.type(@type,@media) {.@{type} {&:before{content:"@{media}";}}}.type(videoi
 assert(素馨(`:not(a):not(b){c:d}`, 'abc'), `abc :not(a):not(b){c:d;}`);
 assert(素馨(`&:not(a):not(b){c:d}`, 'abc'), `abc:not(a):not(b){c:d;}`);
 assert(素馨(`:scope{&:not(a):not(b){c:d}}`, 'abc'), `abc:not(a):not(b){c:d;}`);
-assert(素馨(`:root{&:not(a):not(b){c:d}}`, 'abc'), `abc:not(a):not(b){c:d;}`);
+assert(素馨(`:root{&:not(a):not(b){c:d}}`, 'abc1'), `:not(a):not(b){c:d;}`);
 assert(素馨(`&{&:not(a):not(b){c:d}}`, 'abc'), `abc:not(a):not(b){c:d;}`);
 assert(素馨(`:root>a{&:not(a):not(b){c:d}}`, '.abc-'), `.abc->a:not(a):not(b){c:d;}`);
-assert(素馨(`a>:root{&:not(a):not(b){c:d}}`, '.abc-'), `a>.abc-:not(a):not(b){c:d;}`);
+assert(素馨(`a>:root{&:not(a):not(b){c:d}}`, '.abc-'), `:not(a):not(b){c:d;}`);
 
 assert(素馨(`.a (){ &:after{abc:1}} .b{.a();}`, '.abc-'), `.abc- .b:after{abc:1;}`);
 assert(素馨(`@a:1px;@margin-x:@a+10px; a{m:-@margin-x}`), `a{m:-11px;}`);

package/coms/reptile/colored_console.js

@@ -307,4 +307,5 @@ if (typeof i18n !== 'undefined') {
     colored.warn.tip = i18n`注意`;
     colored.error.tip = i18n`错误`;
 }
+colored.render = renderColor;
 module.exports = colored;

package/coms/zimoli/alert.js

@@ -16,20 +16,27 @@ css(container, 'top:0;height:0;left:0;right:0;transition:all 0.2s ease-out;posit
 var _text = function (elem, bgcolor, parameters) {
     var box = elem || document.createElement('div');
     css(box, `background-color:${bgcolor};color:${color.pair(bgcolor, 1)};`);
-    box.innerHTML = [].slice.call(parameters, 0).join(", ");
+    remove(box.childNodes);
+    appendChild(box, parameters);
     box.initialStyle = `margin-top:-${fromPixel(singleHeight)};`;
     return box;
 };
 function alert() {
     var clr = String(isString(this) && this || styles.default), text, autoclose = true, onclose;
+    var fade = [];
     var setArg = function (args) {
         text = '';
+        fade = [];
         autoclose = true;
         for (var arg of args) switch (typeof arg) {
-            case "string":
             case "object":
+                if (isNode(arg)) {
+                    fade.push(arg);
+                    continue;
+                }
+            case "string":
                 arg = String(arg);
-                if (!text) {
+                if (!text && !fade.length) {
                     text = arg;
                 } else if (color.isColor(text)) {
                     clr = text;
@@ -42,6 +49,9 @@ function alert() {
                 } else if (color.isColor(arg)) {
                     clr = arg;
                 }
+                else {
+                    fade.push(arg);
+                }
                 break;
             case "boolean":
             case "number":
@@ -66,10 +76,12 @@ function alert() {
         }
     };
     var setContent = function (elem) {
+        var t = [text];
+        if (fade.length) t.push(...fade);
         if (color.isColor(clr)) {
-            elem = _text(elem, clr, [text]);
+            elem = _text(elem, clr, t);
         } else {
-            elem = _text(elem, styles.log, [text]);
+            elem = _text(elem, styles.log, t);
         }
         if (!isMounted(container)) popup(container);
         if (!isMounted(elem)) appendChild(container, elem);

package/coms/zimoli/list.js

@@ -149,7 +149,7 @@ function ylist(container, generator, $Y) {
             saved_itemIndex = itemIndex;
             return;
         }
-        var cache_height = list.offsetHeight;
+        var cache_height = Math.min(list.offsetHeight, screen.height >> 1);
         var index = itemIndex | 0;
         if (itemIndex < 0) index--;
         var ratio = itemIndex - index || 0;
@@ -162,7 +162,10 @@ function ylist(container, generator, $Y) {
         if (last_item) last_item = getNodeTarget(last_item);
         var count = 0, delta = 1, bottom_item, offsett = offset, offsetb = offset, top_item;
         var indexed_item;
-        while (offsetBottom - ratioTop <= list.clientHeight + cache_height || indexed_item && top_item && indexed_item.offsetTop - top_item.offsetTop < cache_height) {
+        var limitHeight = screen.height;
+        while (
+            offsetBottom - ratioTop <= limitHeight + cache_height
+            || delta < 0 && indexed_item && top_item && indexed_item.offsetTop - top_item.offsetTop < cache_height) {
             var item = childrenMap[offset];
             if (!item) {
                 item = createItem(offset);
@@ -200,7 +203,15 @@ function ylist(container, generator, $Y) {
             }
             offsetBottom = bottom_item.offsetTop + bottom_item.offsetHeight;
             ratioTop = top_item.offsetTop + top_item.offsetHeight * ratio;
-            if (count++ > 600) throw new Error(i18n`多于600个元素需要绘制！`);
+            if (count++ > 600) throw console.log(
+                `头部下标`, index,
+                `当前下标`, offset,
+                `缓冲尺寸`, cache_height,
+                '限制尺寸', limitHeight,
+                '框架尺寸', list.offsetHeight,
+                '当前绘制到', ratioTop,
+                `当前元素到顶部元素占用`, offsetBottom - ratioTop
+            ), new Error(i18n`多于600个元素需要绘制！`);
         }
         for (var k in childrenMap) {
             remove(childrenMap[k]);
@@ -251,7 +262,8 @@ function ylist(container, generator, $Y) {
         if (elem.with) for (var w of elem.with) list.insertBefore(w, flag);
     };
     var patchBottom = function (deltaY = 0) {
-        var cache_height = list.offsetHeight;
+        var cache_height = Math.min(list.offsetHeight, screen.height >> 1);
+        var limitHeight = screen.height + cache_height;
         var childrenMap = getChildrenMap();
         var last_element = getLastElement(1);
         if (!last_element || !last_element.offsetHeight) return;
@@ -260,7 +272,7 @@ function ylist(container, generator, $Y) {
         var offsetBottom = getOffsetHeight(last_element) + last_element.offsetTop;
         var offset = last_element.index || 0;
         //追加元素到底部
-        while (offsetBottom <= scrollTop + list.clientHeight + cache_height) {
+        while (offsetBottom <= scrollTop + limitHeight) {
             offset++;
             var item = childrenMap[offset];
             if (!item) {
@@ -284,7 +296,7 @@ function ylist(container, generator, $Y) {
         var collection = [];
         for (var k in childrenMap) {
             let item = childrenMap[k];
-            if (getNodeTarget(item).offsetTop + getOffsetHeight(item) + cache_height < scrollTop) {
+            if (getNodeTarget(item).offsetTop + getOffsetHeight(item) + limitHeight < scrollTop) {
                 collection.push(item);
             }
         }
@@ -312,7 +324,7 @@ function ylist(container, generator, $Y) {
         return scrollTop - list.scrollTop;
     };
     var patchTop = function (deltaY = 0) {
-        var cache_height = list.offsetHeight;
+        var cache_height = Math.min(list.offsetHeight, screen.height >> 1);
 
         var childrenMap = getChildrenMap();
         var first_element, flag_element = first_element = getFirstElement(1);
@@ -322,7 +334,7 @@ function ylist(container, generator, $Y) {
         var { scrollTop } = list;
         scrollTop += deltaY;
         //追加元素到顶部
-        var targetHeight = cache_height + first_element.offsetTop;
+        var targetHeight = screen.height + cache_height + first_element.offsetTop;
         var { paddingCount, paddingMax } = list;
         if (!(paddingCount > 0 && paddingMax > 0 && paddingCount < paddingMax) || !(scrollTop < targetHeight)) {
             paddingCount = 0;

package/coms/zimoli/popup.js

@@ -68,13 +68,16 @@ var popup_path = function (path = "", parameters, target) {
             }
             else if (target instanceof Event) {
                 popup_to_event(element, target);
-            } else if (target instanceof Array) {
+            }
+            else if (target instanceof Array) {
                 popup_to_point(element, target);
-            } else if (target) {
+            }
+            else if (target < 0 || target === true) {
                 popup_with_mask(element);
-            } else {
+            }
+            else {
                 if (parameters !== false && target !== false) setInitialStyle(element);
-                popup_as_single(element);
+                popup_as_single(element, target);
             }
         };
     }
@@ -85,7 +88,7 @@ var popup_path = function (path = "", parameters, target) {
         if (!element) return;
         load();
         element.$reload = fullfill;
-        if (!target && target !== false && parameters !== false) {
+        if (target == null && parameters !== false) {
             element.style.opacity = 0;
             oncemount(element, function () {
                 move.bindPosition(element, [.5, .5]);
@@ -114,14 +117,17 @@ var popup_view = function (element, target, style) {
     }
     if (target instanceof Event) {
         popup_to_event(element, target);
-    } else if (target instanceof Array) {
+    }
+    else if (target instanceof Array) {
         if (isNode(style) && style.$mask) addMask(element, style);
         else if (typeof style === 'boolean') addMask(element);
         popup_to_point(element, target);
-    } else if (target) {
+    }
+    else if (target === true || target < 0) {
         popup_with_mask(element);
-    } else {
-        popup_as_single(element);
+    }
+    else {
+        popup_as_single(element, target);
     }
     return element;
 };
@@ -337,8 +343,8 @@ var _as_yextra = function (global, innerWidth, innerHeight, element, target, poi
     global(element, false);
 };
 var _as_xextra = arriswise(_as_yextra, arguments);
-var popup_as_single = function (element) {
-    if (!isMounted(element)) css(element, `z-index:${zIndex()};`);
+var popup_as_single = function (element, z) {
+    if (!isMounted(element)) css(element, `z-index:${Number.isFinite(z) ? z : zIndex()};`);
     global(element, false);
 };
 var popup_to_point = function (element, [x, y]) {

package/coms/zimoli/render.js

@@ -143,14 +143,39 @@ var getScopeList = function (element) {
     if (element.$scope) scopes.push(element.$scope);
     return scopes;
 };
+var toNull = () => null;
+var toUndefined = () => { };
+var toResult = function (c) {
+    if (typeof c === 'function') return c();
+    return c;
+};
+var toObject = function (object) {
+    if (isArray(object)) return function (object) {
+        return object.map(toResult);
+    }
+    return function () {
+        var result = {};
+        for (var k in object) result[k] = toResult(object[k]);
+        return result;
+    }
+};
 var createGetter = function (target, search, isprop = true) {
-    if (!search) return function () { };
-    if (/^\{/.test(search)) search = `(${search})`;
-    search = renderExpress(search);
-    if (isprop) var getter = $$eval.bind(target, search, getScopeList(target));
-    else if (variableOnlyReg.test(search)) getter = $$eval.bind(target, search + "(event)");
-    else getter = $$eval.bind(target, search);
-    return getter;
+    switch (typeof search) {
+        case "function":
+            return search;
+        case "string":
+            if (!search) return toUndefined;
+            if (/^\{/.test(search)) search = `(${search})`;
+            search = renderExpress(search);
+            if (isprop) var getter = $$eval.bind(target, search, getScopeList(target));
+            else if (variableOnlyReg.test(search)) getter = $$eval.bind(target, search + "(event)");
+            else getter = $$eval.bind(target, search);
+            return getter;
+        case "object":
+            if (!isprop) throw new Error('绑定错误');
+            return toObject(search);
+    }
+    return toUndefined;
 };
 var createComment = function (renders, type, expression) {
     var comment = document.createComment(`${type} ${expression}`);
@@ -841,8 +866,7 @@ function renderBinds(element, binds) {
         h.call(element);
     }
 }
-
-function renderRest(element, struct, replacer = element) {
+function renderDynamics(element, replacer, binds, attrs) {
     var renders = element.$renders;
     if (element.renders) {
         if (!renders) renders = [];
@@ -850,7 +874,6 @@ function renderRest(element, struct, replacer = element) {
         delete element.renders;
     }
     element.$renders = [];
-    var { attrs, binds } = struct;
     var bindWatch = !!element.$needchanges;
     for (var k in binds) {
         if (k in directives) {
@@ -865,13 +888,23 @@ function renderRest(element, struct, replacer = element) {
             }
         }
     }
-    for (var k in struct.attrs) {
+    for (var k in attrs) {
         binders[""].call(element, k, attrs[k]);
     }
     if (renders && renders.length) element.$renders.push.apply(element.$renders, renders);
     if (binds.src) directives.src.call(element, binds.src);
+}
+
+function renderEmits(replacer, emits, on) {
+    for (var k in emits) on.call(this, replacer, k, emits[k]);
+}
+
+function renderRest(element, struct, replacer = element) {
+    var { attrs, binds, emits, waits } = struct;
+    renderDynamics(element, replacer, binds, attrs);
     if (!isElement(replacer)) replacer = element;
-    struct.ons.forEach(([on, key, value]) => on.call(element, replacer, key, value));
+    renderEmits.call(element, replacer, emits, emiters.on);
+    renderEmits.call(element, replacer, waits, emiters.once);
 }
 function renderArray(children, scope, parentScopes, once) {
     if (!children) return;
@@ -1051,8 +1084,9 @@ var mergeStruct = function (struct1, struct2) {
 }
 
 class Struct {
-    constructor(ons, types, copys, binds, attrs, props, ids, once) {
-        this.ons = ons;
+    constructor(emits, onceEmits, types, copys, binds, attrs, props, ids, once) {
+        this.emits = emits;
+        this.waits = onceEmits;
         this.if = types.if;
         this.repeat = types.repeat;
         this.copys = copys;
@@ -1083,7 +1117,8 @@ function createStructure(element, useExists) {
     }
     var types = {};
     var emiter_reg = /^(?:(v|ng|on|once)?\-|v\-on\:|@|once|on)/i;
-    var ons = [];
+    var emits = {};
+    var waits = {};
     var copys = [];
     var binds = {};
     var once;
@@ -1169,9 +1204,17 @@ function createStructure(element, useExists) {
         // ng-click on-click v-click @click @mousedown ...
         else if (emiter_reg.test(name)) {
             var match = emiter_reg.exec(name);
-            var ngon = (match[1] || match[0]).toLowerCase() === 'once' ? 'once' : 'on';
+            var isOnce = (match[1] || match[0]).toLowerCase() === 'once';
             element.removeAttribute(name);
-            if (value) ons.push([emiters[ngon], name.replace(emiter_reg, ''), value]);
+            if (value) {
+                var key = name.replace(emiter_reg, '');
+                if (isOnce) {
+                    waits[key] = value;
+                }
+                else {
+                    emits[key] = value;
+                }
+            }
         }
         // placeholder_ href_ checked_ ...
         else if (/[_@\:\.&\?\*\+\#]$/.test(name)) {
@@ -1220,12 +1263,13 @@ function createStructure(element, useExists) {
     if (props["zimoli"] || props["fresh"] || props["once"]) once = true;
     else if (props["refresh"] || props["digest"] || props["mount"]) once = false;
     element.$eval = $eval;
-    return element.$struct = new Struct(ons, types, copys, binds, attr1, props, ids, once);
+    return element.$struct = new Struct(emits, waits, types, copys, binds, attr1, props, ids, once);
 }
 function unlock(element) {
     if (!element) return;
-    if (element.$renderid !== 9) {
-        element.$renderid = ++renderidOffset;
+    var { $renderid = 0 } = element;
+    if ($renderid !== 9) {
+        if ($renderid < 10) element.$renderid = ++renderidOffset;
         on("append")(element, addRenderElement);
         onremove(element, removeRenderElement);
         if (element.nodeType === 8);
@@ -1296,4 +1340,29 @@ render.getFromScopes = getFromScopes;
 render.struct = createStructure;
 render.mergeStruct = mergeStruct;
 render.Binder = Binder;
-render.Model = Model;
+render.Model = Model;
+render.attribute = function (target, attrs) {
+    return renderDynamics(target, target, null, attrs);
+};
+render.dynamic = function (target, binds, attrs) {
+    renderBinds(target, binds);
+    renderDynamics(target, target, binds, attrs);
+};
+var initRenders = function (target) {
+    if (!target.$renders) target.$renders = [];
+};
+render.class = function (target, map) {
+    initRenders(target);
+    directives.class.call(target, map);
+};
+render.style = function (target, map) {
+    initRenders(target);
+    directives.style.call(target, map);
+};
+render.on = function (target, map) {
+    return renderEmits.call(this, target, map, emiters.on);
+};
+render.once = function (target, map) {
+    return renderEmits.call(this, target, map, emiters.once);
+};
+render.mount = unlock;

package/coms/zimoli/transition.js

@@ -182,7 +182,6 @@ function transition(target, _isLeave, _initialStyle) {
     else if (isLeave) {
         transitionTimerStart = setTimeout(function () {
             extend(target.style, initialStyle);
-            delete target.recoverStyle;
             delete target.captureStyle;
         });
         transitionTimerEnd = setTimeout(function () {
@@ -198,7 +197,6 @@ function transition(target, _isLeave, _initialStyle) {
             if (transitionKey) target.style[transitionKey] = initialStyle[transitionKey];
             target.transitionTimerStart = setTimeout(function () {
                 extend(target.style, recoverStyle);
-                delete target.recoverStyle;
                 delete target.captureStyle;
             }, waitPaint);
         });

package/coms/zimoli/tree.js

@@ -269,34 +269,25 @@ function tree() {
     }
     var stickys = [];
     var setSticky = function () {
-        var p = stickys[stickys.length - 1];
-        var f = banner.getFirstVisibleElement(stickys.top);
+        var top = stickys.top || 0;
+        var f = banner.getFirstVisibleElement(top);
         if (!f) return;
-        var limitHeight = f.offsetTop - banner.scrollTop - parseFloat(getComputedStyle(banner).paddingTop);
-        var c = dom[f.$index];
-        var useLimit = false;
-        if (p) {
-            var d = dom[p.$index];
-            if (d.tab == c.tab) {
-                var { top, height } = getOffset(p);
-                if (top + height >= limitHeight) {
-                    var ic = c.parent.indexOf(c);
-                    useLimit = c.parent[ic - 1] === d;
-                    if (useLimit) c = d;
-                }
-            }
-            else {
-                useLimit = true;
-                limitHeight += getOffset(f).height;
-            }
-        }
+        var i = f.$index;
+        if (top > 0 && dom[i - 1]?.tab > dom[i].tab) i--;
+        var c = dom[i++];
+        while (i < dom.length && c.tab <= dom[i].tab) i++;
+        var n = dom[i]?.$target;
+        var limitHeight = n && n.offsetTop ? n.offsetTop - banner.scrollTop - parseFloat(getComputedStyle(banner).paddingTop) : Infinity;
         var parents = [];
         if (c.isClosed() || !c.length) c = c.parent;
         while (c.parent) {
             var p = c.parent;
             if (!p?.joined) {
-                if (!c.$target) return;
-                parents.push(c);
+                var ct = c.$target;
+                if (!ct) break;
+                var pt = p.$target;
+                if (pt && ct.offsetTop > pt.offsetTop + pt.offsetHeight);
+                else parents.push(c);
             }
             c = p;
         }
@@ -319,11 +310,11 @@ function tree() {
         var top = 0;
         stickys.forEach(p => {
             var h = getOffset(p).height;
-            var limit = useLimit && top + h > limitHeight;
+            var limit = top + h > limitHeight;
             css(p, {
                 position: 'sticky',
-                zIndex: 2,
-                top: limit ? limitHeight - h : top, zIndex: 3 - limit
+                top: limit ? limitHeight - h : top,
+                zIndex: 3 - limit
             });
             top += h;
         });

package/coms/zimoli/zIndex.js

@@ -4,3 +4,4 @@ function zIndex(inc = 1) {
     if (inc > 0) count += inc;
     return count;
 };
+zIndex.start = count;

package/docs/main.xht

@@ -1,5 +1,5 @@
 <style>
-    :root {
+    :scope {
         --leftwidth: 260px;
         display: block;
         width: auto;
@@ -14,39 +14,39 @@
         background: #fff;
     }
 
-    :root+scrollbar {
+    :scope+scrollbar {
         right: 0;
         background: transparent;
     }
 
-    :root>* {
+    :scope>* {
         vertical-align: top;
     }
 
-    :root>menu f {
+    :scope>menu f {
         margin-left: 6px;
     }
 
-    :root>menu f[test]:before {
+    :scope>menu f[test]:before {
         color: #fc0;
         content: "测";
     }
 
-    :root>menu f[dang]:before {
+    :scope>menu f[dang]:before {
         color: #2cf;
         content: "档";
     }
 
-    :root>menu f[less]:before {
+    :scope>menu f[less]:before {
         color: #2c9;
         content: "样";
     }
 
-    :root>menu[inline] {
+    :scope>menu[inline] {
         height: 100%;
     }
 
-    :root>menu[inline] {
+    :scope>menu[inline] {
         margin: 0;
         width: var(--leftwidth);
         margin-left: -var(--leftwidth);
@@ -81,7 +81,7 @@
         background: linear-gradient(#f2f4ff, 70%, #e9fff2);
     }
 
-    :root>menu v {
+    :scope>menu v {
         display: inline-block;
         font-size: 12px;
         color: #79a;
@@ -99,11 +99,11 @@
             z-index: 0 !important;
         }
 
-        :root>open:after {
+        :scope>open:after {
             content: "≡";
         }
 
-        :root>open {
+        :scope>open {
 
             display: block;
             position: absolute;
@@ -121,7 +121,7 @@
             border-radius: 50%;
         }
 
-        :root>menu {
+        :scope>menu {
 
             position: absolute;
             z-index: -1;
@@ -150,7 +150,7 @@
 
         }
 
-        :root {
+        :scope {
             padding: 0px !important;
         }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "efront",
-    "version": "4.22.14",
+    "version": "4.22.16",
     "description": "一个开发环境，提供一种自由的前端开发模式，也可作为辅助工具使用。",
     "main": "public/efront.js",
     "directories": {