aberdeen 1.1.0 → 1.3.0

package/dist/aberdeen.js

@@ -154,6 +154,9 @@ var lastPrio = 0;
 
 class Scope {
   prio = --lastPrio;
+  onChange(index) {
+    queue(this);
+  }
   remove() {
     const lastNode = this.getLastNode();
     if (lastNode)
@@ -164,7 +167,6 @@ class Scope {
 
 class ContentScope extends Scope {
   cleaners;
-  inSvgNamespace = false;
   constructor(cleaners = []) {
     super();
     this.cleaners = cleaners;
@@ -203,13 +205,14 @@ class ContentScope extends Scope {
 }
 
 class ChainedScope extends ContentScope {
-  parentElement;
+  el;
+  svg;
   prevSibling;
-  constructor(parentElement, useParentCleaners = false) {
+  constructor(el, svg, useParentCleaners = false) {
     super(useParentCleaners ? currentScope.cleaners : []);
-    this.parentElement = parentElement;
-    this.inSvgNamespace = currentScope.inSvgNamespace;
-    if (parentElement === currentScope.parentElement) {
+    this.el = el;
+    this.svg = svg;
+    if (el === currentScope.el) {
       this.prevSibling = currentScope.getChildPrevSibling();
       currentScope.lastChild = this;
     }
@@ -226,8 +229,8 @@ class ChainedScope extends ContentScope {
 
 class RegularScope extends ChainedScope {
   renderer;
-  constructor(parentElement, renderer) {
-    super(parentElement);
+  constructor(el, svg, renderer) {
+    super(el, svg);
     this.renderer = renderer;
     this.redraw();
   }
@@ -244,20 +247,22 @@ class RegularScope extends ChainedScope {
 }
 
 class RootScope extends ContentScope {
-  parentElement = document.body;
+  el = document.body;
+  svg = false;
   getPrecedingNode() {
     return;
   }
 }
 
 class MountScope extends ContentScope {
-  parentElement;
+  el;
   renderer;
-  constructor(parentElement, renderer) {
+  svg;
+  constructor(el, renderer) {
     super();
-    this.parentElement = parentElement;
+    this.el = el;
     this.renderer = renderer;
-    this.inSvgNamespace = currentScope.inSvgNamespace;
+    this.svg = el.namespaceURI === "http://www.w3.org/2000/svg";
     this.redraw();
     currentScope.cleaners.push(this);
   }
@@ -303,8 +308,8 @@ function findLastNodeInPrevSiblings(sibling) {
 class ResultScope extends ChainedScope {
   renderer;
   result = optProxy({ value: undefined });
-  constructor(parentElement, renderer) {
-    super(parentElement);
+  constructor(renderer) {
+    super(currentScope.el, currentScope.svg);
     this.renderer = renderer;
     this.redraw();
   }
@@ -323,8 +328,9 @@ class ResultScope extends ChainedScope {
 class SetArgScope extends ChainedScope {
   key;
   target;
-  constructor(parentElement, key, target) {
-    super(parentElement);
+  svg = false;
+  constructor(el, key, target) {
+    super(el, el.namespaceURI === "http://www.w3.org/2000/svg");
     this.key = key;
     this.target = target;
     this.redraw();
@@ -332,7 +338,7 @@ class SetArgScope extends ChainedScope {
   redraw() {
     const savedScope = currentScope;
     currentScope = this;
-    applyArg(this.key, this.target.value);
+    applyArg(this.el, this.key, this.target.value);
     currentScope = savedScope;
   }
 }
@@ -340,7 +346,7 @@ class SetArgScope extends ChainedScope {
 class OnEachScope extends Scope {
   renderer;
   makeSortKey;
-  parentElement = currentScope.parentElement;
+  parentElement = currentScope.el;
   prevSibling;
   target;
   byIndex = new Map;
@@ -411,13 +417,14 @@ class OnEachItemScope extends ContentScope {
   parent;
   itemIndex;
   sortKey;
-  parentElement;
+  el;
+  svg;
   constructor(parent, itemIndex, topRedraw) {
     super();
     this.parent = parent;
     this.itemIndex = itemIndex;
-    this.parentElement = parent.parentElement;
-    this.inSvgNamespace = currentScope.inSvgNamespace;
+    this.el = parent.parentElement;
+    this.svg = currentScope.svg;
     this.parent.byIndex.set(this.itemIndex, this);
     this.lastChild = this;
     if (topRedraw)
@@ -509,8 +516,12 @@ class OnEachItemScope extends ContentScope {
     this.delete();
   }
 }
-function addNode(node) {
-  const parentEl = currentScope.parentElement;
+function addNode(el, node) {
+  if (el !== currentScope.el) {
+    el.appendChild(node);
+    return;
+  }
+  const parentEl = currentScope.el;
   const prevNode = currentScope.getInsertAfterNode();
   parentEl.insertBefore(node, prevNode ? prevNode.nextSibling : parentEl.firstChild);
   currentScope.lastChild = node;
@@ -645,7 +656,7 @@ var objectHandler = {
     return true;
   },
   deleteProperty(target, prop) {
-    const old = target.hasOwnProperty(prop) ? target[prop] : undefined;
+    const old = target.hasOwnProperty(prop) ? target[prop] : EMPTY;
     delete target[prop];
     emit(target, prop, EMPTY, old);
     return true;
@@ -843,7 +854,7 @@ var mapHandler = {
 };
 var proxyMap = new WeakMap;
 function optProxy(value) {
-  if (typeof value !== "object" || !value || value[TARGET_SYMBOL] !== undefined) {
+  if (typeof value !== "object" || !value || value[TARGET_SYMBOL] !== undefined || NO_COPY in value) {
     return value;
   }
   let proxied = proxyMap.get(value);
@@ -862,6 +873,19 @@ function optProxy(value) {
   return proxied;
 }
 function proxy(target) {
+  if (target instanceof Promise) {
+    const result = optProxy({
+      busy: true
+    });
+    target.then((value) => {
+      result.value = value;
+      result.busy = false;
+    }).catch((err) => {
+      result.error = err;
+      result.busy = false;
+    });
+    return result;
+  }
   return optProxy(typeof target === "object" && target !== null ? target : { value: target });
 }
 function unproxy(target) {
@@ -876,14 +900,14 @@ function destroyWithClass(element, cls) {
 function copy(a, b, c) {
   if (arguments.length > 2)
     return copySet(a, b, c, 0);
-  return copyRecursive(a, b, 0);
+  return copyImpl(a, b, 0);
 }
 function copySet(dst, dstKey, src, flags) {
   let dstVal = peek(dst, dstKey);
   if (src === dstVal)
     return false;
   if (typeof dstVal === "object" && dstVal && typeof src === "object" && src && dstVal.constructor === src.constructor) {
-    return copyRecursive(dstVal, src, flags);
+    return copyImpl(dstVal, src, flags);
   }
   src = clone(src);
   if (dst instanceof Map)
@@ -895,9 +919,9 @@ function copySet(dst, dstKey, src, flags) {
 function merge(a, b, c) {
   if (arguments.length > 2)
     return copySet(a, b, c, MERGE);
-  return copyRecursive(a, b, MERGE);
+  return copyImpl(a, b, MERGE);
 }
-function copyRecursive(dst, src, flags) {
+function copyImpl(dst, src, flags) {
   let unproxied = dst[TARGET_SYMBOL];
   if (unproxied) {
     dst = unproxied;
@@ -909,6 +933,9 @@ function copyRecursive(dst, src, flags) {
     if (currentScope !== ROOT_SCOPE && !peeking)
       flags |= COPY_SUBSCRIBE;
   }
+  return copyRecursive(dst, src, flags);
+}
+function copyRecursive(dst, src, flags) {
   if (flags & COPY_SUBSCRIBE)
     subscribe(src, ANY_SYMBOL);
   let changed = false;
@@ -927,7 +954,7 @@ function copyRecursive(dst, src, flags) {
         changed = true;
       } else if (dstValue !== srcValue) {
         if (srcValue && typeof srcValue === "object") {
-          if (typeof dstValue === "object" && dstValue && srcValue.constructor === dstValue.constructor) {
+          if (typeof dstValue === "object" && dstValue && srcValue.constructor === dstValue.constructor && !(NO_COPY in srcValue)) {
             changed = copyRecursive(dstValue, srcValue, flags) || changed;
             continue;
           }
@@ -961,7 +988,7 @@ function copyRecursive(dst, src, flags) {
         dstValue = EMPTY;
       if (dstValue !== srcValue) {
         if (srcValue && typeof srcValue === "object") {
-          if (typeof dstValue === "object" && dstValue && srcValue.constructor === dstValue.constructor) {
+          if (typeof dstValue === "object" && dstValue && srcValue.constructor === dstValue.constructor && !(NO_COPY in srcValue)) {
             changed = copyRecursive(dstValue, srcValue, flags) || changed;
             continue;
           }
@@ -991,7 +1018,7 @@ function copyRecursive(dst, src, flags) {
       const dstValue = dst.hasOwnProperty(key) ? dst[key] : EMPTY;
       if (dstValue !== srcValue) {
         if (srcValue && typeof srcValue === "object") {
-          if (typeof dstValue === "object" && dstValue && srcValue.constructor === dstValue.constructor) {
+          if (typeof dstValue === "object" && dstValue && srcValue.constructor === dstValue.constructor && !(NO_COPY in srcValue)) {
             changed = copyRecursive(dstValue, srcValue, flags) || changed;
             continue;
           }
@@ -1023,9 +1050,13 @@ function copyRecursive(dst, src, flags) {
 var MERGE = 1;
 var COPY_SUBSCRIBE = 32;
 var COPY_EMIT = 64;
+var NO_COPY = Symbol("NO_COPY");
+Promise.prototype[NO_COPY] = true;
 function clone(src) {
+  if (NO_COPY in src)
+    return src;
   const copied = Array.isArray(src) ? [] : src instanceof Map ? new Map : Object.create(Object.getPrototypeOf(src));
-  copyRecursive(copied, src, MERGE);
+  copyImpl(copied, src, MERGE);
   return copied;
 }
 var refHandler = {
@@ -1091,8 +1122,7 @@ function applyBind(el, target) {
   });
 }
 var SPECIAL_PROPS = {
-  create: (value) => {
-    const el = currentScope.parentElement;
+  create: (el, value) => {
     if (currentScope !== topRedrawScope)
       return;
     if (typeof value === "function") {
@@ -1106,117 +1136,118 @@ var SPECIAL_PROPS = {
       })();
     }
   },
-  destroy: (value) => {
-    const el = currentScope.parentElement;
+  destroy: (el, value) => {
     onDestroyMap.set(el, value);
   },
-  html: (value) => {
-    const tmpParent = document.createElement(currentScope.parentElement.tagName);
+  html: (el, value) => {
+    const tmpParent = document.createElement(currentScope.el.tagName);
     tmpParent.innerHTML = `${value}`;
     while (tmpParent.firstChild)
-      addNode(tmpParent.firstChild);
+      addNode(el, tmpParent.firstChild);
   },
-  text: (value) => {
-    addNode(document.createTextNode(value));
+  text: (el, value) => {
+    addNode(el, document.createTextNode(value));
   }
 };
 function $(...args) {
-  let savedCurrentScope;
-  let err;
-  let result;
-  for (let arg of args) {
-    if (arg == null || arg === false)
-      continue;
-    if (typeof arg === "string") {
-      let text;
-      let classes;
-      const textPos = arg.indexOf(":");
-      if (textPos >= 0) {
-        text = arg.substring(textPos + 1);
-        arg = arg.substring(0, textPos);
-      }
-      const classPos = arg.indexOf(".");
-      if (classPos >= 0) {
-        classes = arg.substring(classPos + 1);
-        arg = arg.substring(0, classPos);
-      }
-      if (arg === "") {
-        if (text)
-          addNode(document.createTextNode(text));
-        if (classes) {
-          const el = currentScope.parentElement;
-          el.classList.add(...classes.split("."));
-          if (!savedCurrentScope) {
-            clean(() => el.classList.remove(...classes.split(".")));
+  let el = currentScope.el;
+  let svg = currentScope.svg;
+  const argCount = args.length;
+  for (let argIndex = 0;argIndex < argCount; argIndex++) {
+    const arg = args[argIndex];
+    if (arg == null || arg === false) {} else if (typeof arg === "string") {
+      let argLen = arg.length;
+      let nextPos = 0;
+      for (let pos = 0;pos < argLen; pos = nextPos + 1) {
+        nextPos = findFirst(arg, " .=:#", pos);
+        const next = arg[nextPos];
+        if (next === ":" || next === "=") {
+          let key = arg.substring(pos, nextPos);
+          if (next === ":")
+            key = "$" + key;
+          if (nextPos + 1 >= argLen) {
+            applyArg(el, key, args[++argIndex]);
+            break;
+          }
+          if (arg[nextPos + 1] === '"') {
+            const endIndex = findFirst(arg, '"', nextPos + 2);
+            const value = arg.substring(nextPos + 2, endIndex);
+            applyArg(el, key, value);
+            nextPos = endIndex;
+          } else {
+            const endIndex = findFirst(arg, " ", nextPos + 1);
+            const value = arg.substring(nextPos + 1, endIndex);
+            applyArg(el, key, value);
+            nextPos = endIndex;
           }
-        }
-      } else if (arg.indexOf(" ") >= 0) {
-        err = `Tag '${arg}' cannot contain space`;
-        break;
-      } else {
-        const useNamespace = currentScope.inSvgNamespace || arg === "svg";
-        if (useNamespace) {
-          result = document.createElementNS("http://www.w3.org/2000/svg", arg);
         } else {
-          result = document.createElement(arg);
-        }
-        if (classes)
-          result.className = classes.replaceAll(".", " ");
-        if (text)
-          result.textContent = text;
-        addNode(result);
-        if (!savedCurrentScope) {
-          savedCurrentScope = currentScope;
-        }
-        const newScope = new ChainedScope(result, true);
-        if (arg === "svg") {
-          newScope.inSvgNamespace = true;
+          if (nextPos > pos) {
+            const tag = arg.substring(pos, nextPos);
+            svg ||= tag === "svg";
+            let newEl = svg ? document.createElementNS("http://www.w3.org/2000/svg", tag) : document.createElement(tag);
+            addNode(el, newEl);
+            el = newEl;
+          }
+          if (next === "#") {
+            const text = nextPos + 1 < argLen ? arg.substring(nextPos + 1) : args[++argIndex];
+            applyArg(el, "text", text);
+            break;
+          }
+          if (next === ".") {
+            let classEnd = findFirst(arg, " #=.", nextPos + 1);
+            if (arg[classEnd] === "=" && classEnd + 1 >= argLen) {
+              applyArg(el, arg.substring(nextPos, classEnd), args[++argIndex]);
+              nextPos = classEnd;
+            } else {
+              let className = arg.substring(nextPos + 1, classEnd);
+              el.classList.add(className || args[++argIndex]);
+              nextPos = classEnd - 1;
+            }
+          }
         }
-        newScope.lastChild = result.lastChild || undefined;
-        if (topRedrawScope === currentScope)
-          topRedrawScope = newScope;
-        currentScope = newScope;
       }
     } else if (typeof arg === "object") {
       if (arg.constructor !== Object) {
         if (arg instanceof Node) {
-          addNode(arg);
+          addNode(el, arg);
           if (arg instanceof Element) {
-            if (!savedCurrentScope)
-              savedCurrentScope = currentScope;
-            currentScope = new ChainedScope(arg, true);
-            currentScope.lastChild = arg.lastChild || undefined;
+            el = arg;
+            svg = arg.namespaceURI === "http://www.w3.org/2000/svg";
           }
         } else {
-          err = `Unexpected argument: ${arg}`;
-          break;
+          throw new Error(`Unexpected argument: ${arg}`);
         }
       } else {
         for (const key of Object.keys(arg)) {
-          const val = arg[key];
-          applyArg(key, val);
+          applyArg(el, key, arg[key]);
         }
       }
     } else if (typeof arg === "function") {
-      new RegularScope(currentScope.parentElement, arg);
+      new RegularScope(el, svg, arg);
     } else {
-      err = `Unexpected argument: ${arg}`;
-      break;
+      throw new Error(`Unexpected argument: ${arg}`);
     }
   }
-  if (savedCurrentScope) {
-    currentScope = savedCurrentScope;
+  return el;
+}
+function findFirst(str, chars, startPos) {
+  if (chars.length === 1) {
+    const idx = str.indexOf(chars, startPos);
+    return idx >= 0 ? idx : str.length;
   }
-  if (err)
-    throw new Error(err);
-  return result;
+  const strLen = str.length;
+  for (let i = startPos;i < strLen; i++) {
+    if (chars.indexOf(str[i]) >= 0)
+      return i;
+  }
+  return strLen;
 }
 var cssCount = 0;
 function insertCss(style, global = false) {
   const prefix = global ? "" : `.AbdStl${++cssCount}`;
   const css = styleToCss(style, prefix);
   if (css)
-    $(`style:${css}`);
+    $(`style#${css}`);
   return prefix;
 }
 function styleToCss(style, prefix) {
@@ -1243,8 +1274,7 @@ ${styleToCss(v, prefix)}}
 ${rules}`;
   return rules;
 }
-function applyArg(key, value) {
-  const el = currentScope.parentElement;
+function applyArg(el, key, value) {
   if (typeof value === "object" && value !== null && value[TARGET_SYMBOL]) {
     if (key === "bind") {
       applyBind(el, value);
@@ -1264,10 +1294,11 @@ function applyArg(key, value) {
     else
       el.style[name] = `${value}`;
   } else if (value == null) {} else if (key in SPECIAL_PROPS) {
-    SPECIAL_PROPS[key](value);
+    SPECIAL_PROPS[key](el, value);
   } else if (typeof value === "function") {
     el.addEventListener(key, value);
-    clean(() => el.removeEventListener(key, value));
+    if (el === currentScope.el)
+      clean(() => el.removeEventListener(key, value));
   } else if (value === true || value === false || key === "value" || key === "selectedIndex") {
     el[key] = value;
   } else {
@@ -1283,13 +1314,13 @@ function setErrorHandler(handler) {
   onError = handler || defaultOnError;
 }
 function getParentElement() {
-  return currentScope.parentElement;
+  return currentScope.el;
 }
 function clean(cleaner) {
   currentScope.cleaners.push(cleaner);
 }
 function derive(func) {
-  return new ResultScope(currentScope.parentElement, func).result;
+  return new ResultScope(func).result;
 }
 function mount(parentElement, func) {
   new MountScope(parentElement, func);
@@ -1354,7 +1385,7 @@ function multiMap(source, func) {
 }
 function partition(source, func) {
   const unproxiedOut = {};
-  const out = proxy(unproxiedOut);
+  const out = optProxy(unproxiedOut);
   onEach(source, (item, key) => {
     const rsp = func(item, key);
     if (rsp != null) {
@@ -1380,24 +1411,22 @@ function partition(source, func) {
 }
 function dump(data) {
   if (data && typeof data === "object") {
-    let label;
-    if (data instanceof Array) {
-      label = "<array>";
-    } else if (data instanceof Map) {
-      label = "<Map>";
+    const name = data.constructor.name.toLowerCase() || "unknown object";
+    $(`#<${name}>`);
+    if (NO_COPY in data) {
+      $("# [NO_COPY]");
     } else {
-      label = "<object>";
-    }
-    $({ text: label });
-    $("ul", () => {
-      onEach(data, (value, key) => {
-        $(`li:${JSON.stringify(key)}: `, () => {
-          dump(value);
+      $("ul", () => {
+        onEach(data, (value, key) => {
+          $("li", () => {
+            $(`#${JSON.stringify(key)}: `);
+            dump(value);
+          });
         });
       });
-    });
-  } else {
-    $({ text: JSON.stringify(data) });
+    }
+  } else if (data !== undefined) {
+    $("#" + JSON.stringify(data));
   }
   return data;
 }
@@ -1413,7 +1442,7 @@ function handleError(e, showMessage) {
   }
   try {
     if (showMessage)
-      $("div.aberdeen-error:Error");
+      $("div.aberdeen-error#Error");
   } catch {}
 }
 function withEmitHandler(handler, func) {
@@ -1452,8 +1481,9 @@ export {
   copy,
   clone,
   clean,
+  NO_COPY,
   $
 };
 
-//# debugId=37C620855881B81F64756E2164756E21
+//# debugId=C3082837141CF76064756E2164756E21
 //# sourceMappingURL=aberdeen.js.map