aberdeen 1.2.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;
@@ -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);
@@ -943,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;
           }
@@ -977,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;
           }
@@ -1007,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;
           }
@@ -1039,7 +1050,11 @@ 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));
   copyImpl(copied, src, MERGE);
   return copied;
@@ -1107,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") {
@@ -1122,149 +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;
-  let nextArgIsProp;
-  for (let arg of args) {
-    if (nextArgIsProp) {
-      applyArg(nextArgIsProp, arg);
-      nextArgIsProp = undefined;
-    } else if (arg == null || arg === false) {} else if (typeof arg === "string") {
-      let pos = 0;
+  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;
-      while (pos < argLen) {
-        let nextSpace = arg.indexOf(" ", pos);
-        if (nextSpace < 0)
-          nextSpace = arg.length;
-        let part = arg.substring(pos, nextSpace);
-        const oldPos = pos;
-        pos = nextSpace + 1;
-        const firstIs = part.indexOf("=");
-        const firstColon = part.indexOf(":");
-        if (firstIs >= 0 && (firstColon < 0 || firstIs < firstColon)) {
-          const prop = part.substring(0, firstIs);
-          if (firstIs < part.length - 1) {
-            let value = part.substring(firstIs + 1);
-            if (value[0] === '"') {
-              const closeIndex = arg.indexOf('"', firstIs + 2 + oldPos);
-              if (closeIndex < 0)
-                throw new Error(`Unterminated string for '${prop}'`);
-              value = arg.substring(firstIs + 2 + oldPos, closeIndex);
-              pos = closeIndex + 1;
-              if (arg[pos] === " ")
-                pos++;
-            }
-            applyArg(prop, value);
-            continue;
-          } else {
-            if (pos < argLen)
-              throw new Error(`No value given for '${part}'`);
-            nextArgIsProp = prop;
+      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;
           }
-        }
-        let text;
-        if (firstColon >= 0) {
-          text = arg.substring(firstColon + 1 + oldPos);
-          part = part.substring(0, firstColon);
-          if (!text) {
-            if (pos < argLen)
-              throw new Error(`No value given for '${part}'`);
-            nextArgIsProp = "text";
-            break;
-          }
-          pos = argLen;
-        }
-        let classes;
-        const classPos = part.indexOf(".");
-        if (classPos >= 0) {
-          classes = part.substring(classPos + 1);
-          part = part.substring(0, classPos);
-        }
-        if (part) {
-          const svg = currentScope.inSvgNamespace || part === "svg";
-          if (svg) {
-            result = document.createElementNS("http://www.w3.org/2000/svg", part);
+          if (arg[nextPos + 1] === '"') {
+            const endIndex = findFirst(arg, '"', nextPos + 2);
+            const value = arg.substring(nextPos + 2, endIndex);
+            applyArg(el, key, value);
+            nextPos = endIndex;
           } else {
-            result = document.createElement(part);
+            const endIndex = findFirst(arg, " ", nextPos + 1);
+            const value = arg.substring(nextPos + 1, endIndex);
+            applyArg(el, key, value);
+            nextPos = endIndex;
           }
-          addNode(result);
-          if (!savedCurrentScope)
-            savedCurrentScope = currentScope;
-          const newScope = new ChainedScope(result, true);
-          if (svg)
-            newScope.inSvgNamespace = true;
-          if (topRedrawScope === currentScope)
-            topRedrawScope = newScope;
-          currentScope = newScope;
-        }
-        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(".")));
+        } else {
+          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;
+            }
           }
         }
       }
     } 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 (nextArgIsProp !== undefined)
-    throw new Error(`No value given for '${nextArgIsProp}='`);
-  if (savedCurrentScope)
-    currentScope = savedCurrentScope;
-  if (err)
-    throw new Error(err);
-  return result;
+  return el;
+}
+function findFirst(str, chars, startPos) {
+  if (chars.length === 1) {
+    const idx = str.indexOf(chars, startPos);
+    return idx >= 0 ? idx : str.length;
+  }
+  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) {
@@ -1291,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);
@@ -1312,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 {
@@ -1331,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);
@@ -1402,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) {
@@ -1428,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;
 }
@@ -1461,7 +1442,7 @@ function handleError(e, showMessage) {
   }
   try {
     if (showMessage)
-      $("div.aberdeen-error:Error");
+      $("div.aberdeen-error#Error");
   } catch {}
 }
 function withEmitHandler(handler, func) {
@@ -1500,8 +1481,9 @@ export {
   copy,
   clone,
   clean,
+  NO_COPY,
   $
 };
 
-//# debugId=1793ACD02DE96EE964756E2164756E21
+//# debugId=C3082837141CF76064756E2164756E21
 //# sourceMappingURL=aberdeen.js.map