aberdeen 1.17.0 → 2.0.0

package/dist-docs/assets/aberdeen/aberdeen.js

@@ -99,1880 +99,1869 @@ class ReverseSortedSet {
 }
 
 // src/aberdeen.ts
-var sortedQueue;
-var runQueueDepth = 0;
-var topRedrawScope;
-var survivingEl;
-function recordSideEffect(scope, type, key, value) {
-  (scope.sideEffects ||= []).push(type, key, value);
-}
-function undoSideEffects(el, se) {
-  for (let i = se.length - 3;i >= 0; i -= 3) {
-    const key = se[i + 1];
-    const value = se[i + 2];
-    switch (se[i]) {
-      case 0 /* Class */:
-        value ? el.classList.add(key) : el.classList.remove(key);
-        break;
-      case 1 /* Style */:
-        el.style[key] = value == null ? "" : value;
-        break;
-      case 2 /* Prop */:
-        el[key] = value;
-        break;
-      case 3 /* Attr */:
-        value == null ? el.removeAttribute(key) : el.setAttribute(key, value);
-        break;
-      case 4 /* Event */:
-        el.removeEventListener(key, value);
-        break;
+function createA(window, options = {}) {
+  const document = window ? window.document : undefined;
+  const Node = window ? window.Node : undefined;
+  const Element = window ? window.Element : undefined;
+  const setTimeout = window?.setTimeout ? window.setTimeout.bind(window) : globalThis.setTimeout;
+  const queueMicrotask = window?.queueMicrotask ? window.queueMicrotask.bind(window) : globalThis.queueMicrotask;
+  let sortedQueue;
+  let runQueueDepth = 0;
+  let topRedrawScope;
+  let survivingEl;
+  var SideEffect;
+  ((SideEffect2) => {
+    SideEffect2[SideEffect2["Class"] = 0] = "Class";
+    SideEffect2[SideEffect2["Style"] = 1] = "Style";
+    SideEffect2[SideEffect2["Prop"] = 2] = "Prop";
+    SideEffect2[SideEffect2["Attr"] = 3] = "Attr";
+    SideEffect2[SideEffect2["Event"] = 4] = "Event";
+  })(SideEffect ||= {});
+  function recordSideEffect(scope, type, key, value) {
+    (scope.sideEffects ||= []).push(type, key, value);
+  }
+  function undoSideEffects(el, se) {
+    for (let i = se.length - 3;i >= 0; i -= 3) {
+      const key = se[i + 1];
+      const value = se[i + 2];
+      switch (se[i]) {
+        case 0 /* Class */:
+          value ? el.classList.add(key) : el.classList.remove(key);
+          break;
+        case 1 /* Style */:
+          el.style[key] = value == null ? "" : value;
+          break;
+        case 2 /* Prop */:
+          el[key] = value;
+          break;
+        case 3 /* Attr */:
+          value == null ? el.removeAttribute(key) : el.setAttribute(key, value);
+          break;
+        case 4 /* Event */:
+          el.removeEventListener(key, value);
+          break;
+      }
     }
   }
-}
-function queue(runner) {
-  if (!sortedQueue) {
-    sortedQueue = new ReverseSortedSet("prio");
-    queueMicrotask(runQueue);
-  } else if (!(runQueueDepth & 1)) {
-    runQueueDepth++;
-    if (runQueueDepth > 98) {
-      throw new Error("Too many recursive updates from observes");
+  function queue(runner) {
+    if (!sortedQueue) {
+      sortedQueue = new ReverseSortedSet("prio");
+      queueMicrotask(runQueue);
+    } else if (!(runQueueDepth & 1)) {
+      runQueueDepth++;
+      if (runQueueDepth > 98) {
+        throw new Error("Too many recursive updates from observes");
+      }
     }
+    sortedQueue.add(runner);
   }
-  sortedQueue.add(runner);
-}
-function runQueue() {
-  let time = Date.now();
-  while (sortedQueue) {
-    const runner = sortedQueue.fetchLast();
-    if (!runner)
-      break;
-    if (runQueueDepth & 1)
-      runQueueDepth++;
-    runner.queueRun();
+  function runQueue() {
+    let time = Date.now();
+    while (sortedQueue) {
+      const runner = sortedQueue.fetchLast();
+      if (!runner)
+        break;
+      if (runQueueDepth & 1)
+        runQueueDepth++;
+      runner.queueRun();
+    }
+    sortedQueue = undefined;
+    runQueueDepth = 0;
+    time = Date.now() - time;
+    if (time > 9)
+      console.debug(`Aberdeen queue took ${time}ms`);
+  }
+  function arrayToStr(parts) {
+    let result = "";
+    for (const part of parts) {
+      if (typeof part === "string") {
+        result += `${part}\x01`;
+        continue;
+      }
+      if (typeof part !== "number") {
+        throw new Error("onEach() sort key must be a string, number or an array of such");
+      }
+      let digits = "";
+      let num = Math.abs(Math.round(part));
+      const negative = part < 0;
+      while (num > 0) {
+        digits = String.fromCharCode(negative ? 65534 - num % 65533 : 2 + num % 65533) + digits;
+        num = Math.floor(num / 65533);
+      }
+      result += String.fromCharCode(128 + (negative ? -digits.length : digits.length)) + digits;
+    }
+    return result;
   }
-  sortedQueue = undefined;
-  runQueueDepth = 0;
-  time = Date.now() - time;
-  if (time > 9)
-    console.debug(`Aberdeen queue took ${time}ms`);
-}
-function arrayToStr(parts) {
-  let result = "";
-  for (const part of parts) {
-    if (typeof part === "string") {
-      result += `${part}\x01`;
-      continue;
-    }
-    if (typeof part !== "number") {
-      throw new Error("onEach() sort key must be a string, number or an array of such");
-    }
-    let digits = "";
-    let num = Math.abs(Math.round(part));
-    const negative = part < 0;
-    while (num > 0) {
-      digits = String.fromCharCode(negative ? 65534 - num % 65533 : 2 + num % 65533) + digits;
-      num = Math.floor(num / 65533);
-    }
-    result += String.fromCharCode(128 + (negative ? -digits.length : digits.length)) + digits;
-  }
-  return result;
-}
-function invertString(input) {
-  let result = "";
-  for (let i = 0;i < input.length; i++) {
-    result += String.fromCodePoint(65535 - input.charCodeAt(i));
+  function invertString(input) {
+    let result = "";
+    for (let i = 0;i < input.length; i++) {
+      result += String.fromCodePoint(65535 - input.charCodeAt(i));
+    }
+    return result;
   }
-  return result;
-}
-var lastPrio = 0;
+  let lastPrio = 0;
 
-class Scope {
-  prio = --lastPrio;
-  remove() {
-    const lastNode = this.getLastNode();
-    if (lastNode)
-      removeNodes(lastNode, this.getPrecedingNode());
-    const savedSurvivingEl = survivingEl;
-    survivingEl = this.el;
-    this.delete();
-    survivingEl = savedSurvivingEl;
+  class Scope {
+    prio = --lastPrio;
+    remove() {
+      const lastNode = this.getLastNode();
+      if (lastNode)
+        removeNodes(lastNode, this.getPrecedingNode());
+      const savedSurvivingEl = survivingEl;
+      survivingEl = this.el;
+      this.delete();
+      survivingEl = savedSurvivingEl;
+    }
   }
-}
 
-class DelayedOneTimeRunner {
-  queueRun;
-  prio = --lastPrio;
-  constructor(queueRun) {
-    this.queueRun = queueRun;
-    queue(this);
+  class DelayedOneTimeRunner {
+    queueRun;
+    prio = --lastPrio;
+    constructor(queueRun) {
+      this.queueRun = queueRun;
+      queue(this);
+    }
   }
-}
 
-class ContentScope extends Scope {
-  cleaners;
-  sideEffects;
-  changes;
-  constructor(cleaners = []) {
-    super();
-    this.cleaners = cleaners;
-  }
-  lastChild;
-  redraw() {}
-  getLastNode() {
-    return findLastNodeInPrevSiblings(this.lastChild);
-  }
-  delete() {
-    const cleaners = this.cleaners;
-    for (let i = cleaners.length - 1;i >= 0; i--) {
-      const cleaner = cleaners[i];
-      if (typeof cleaner === "function")
-        cleaner();
-      else
-        cleaner.delete(this);
+  class ContentScope extends Scope {
+    cleaners;
+    sideEffects;
+    changes;
+    constructor(cleaners = []) {
+      super();
+      this.cleaners = cleaners;
+    }
+    lastChild;
+    redraw() {}
+    getLastNode() {
+      return findLastNodeInPrevSiblings(this.lastChild);
+    }
+    delete() {
+      const cleaners = this.cleaners;
+      for (let i = cleaners.length - 1;i >= 0; i--) {
+        const cleaner = cleaners[i];
+        if (typeof cleaner === "function")
+          cleaner();
+        else
+          cleaner.delete(this);
+      }
+      this.cleaners.length = 0;
+      const se = this.sideEffects;
+      if (se) {
+        if (this.el === survivingEl)
+          undoSideEffects(this.el, se);
+        this.sideEffects = undefined;
+      }
+      sortedQueue?.remove(this);
+      this.lastChild = undefined;
     }
-    this.cleaners.length = 0;
-    const se = this.sideEffects;
-    if (se) {
-      if (this.el === survivingEl)
-        undoSideEffects(this.el, se);
-      this.sideEffects = undefined;
+    onChange(target, index, newData, oldData) {
+      if (!this.changes) {
+        this.changes = new Map;
+        queue(this);
+      }
+      let targetDelta = this.changes.get(target);
+      if (!targetDelta) {
+        targetDelta = new Map;
+        this.changes.set(target, targetDelta);
+      }
+      if (targetDelta.has(index)) {
+        if (targetDelta.get(index) === newData)
+          targetDelta.delete(index);
+      } else {
+        targetDelta.set(index, oldData);
+      }
     }
-    sortedQueue?.remove(this);
-    this.lastChild = undefined;
-  }
-  onChange(target, index, newData, oldData) {
-    if (!this.changes) {
-      this.changes = new Map;
-      queue(this);
+    fetchHasChanges() {
+      if (!this.changes)
+        return false;
+      for (const targetDelta of this.changes.values()) {
+        if (targetDelta.size > 0) {
+          delete this.changes;
+          return true;
+        }
+      }
+      delete this.changes;
+      return false;
     }
-    let targetDelta = this.changes.get(target);
-    if (!targetDelta) {
-      targetDelta = new Map;
-      this.changes.set(target, targetDelta);
+    queueRun() {
+      if (!this.fetchHasChanges())
+        return;
+      this.remove();
+      topRedrawScope = this;
+      this.redraw();
+      topRedrawScope = undefined;
     }
-    if (targetDelta.has(index)) {
-      if (targetDelta.get(index) === newData)
-        targetDelta.delete(index);
-    } else {
-      targetDelta.set(index, oldData);
+    getInsertAfterNode() {
+      return this.getLastNode() || this.getPrecedingNode();
     }
-  }
-  fetchHasChanges() {
-    if (!this.changes)
-      return false;
-    for (const targetDelta of this.changes.values()) {
-      if (targetDelta.size > 0) {
-        delete this.changes;
-        return true;
-      }
+    getChildPrevSibling() {
+      return this.lastChild;
     }
-    delete this.changes;
-    return false;
   }
-  queueRun() {
-    if (!this.fetchHasChanges())
-      return;
-    this.remove();
-    topRedrawScope = this;
-    this.redraw();
-    topRedrawScope = undefined;
-  }
-  getInsertAfterNode() {
-    return this.getLastNode() || this.getPrecedingNode();
-  }
-  getChildPrevSibling() {
-    return this.lastChild;
-  }
-}
 
-class ChainedScope extends ContentScope {
-  el;
-  svg;
-  prevSibling;
-  constructor(el, svg, useParentCleaners = false) {
-    super(useParentCleaners ? currentScope.cleaners : []);
-    this.el = el;
-    this.svg = svg;
-    if (el === currentScope.el) {
-      this.prevSibling = currentScope.getChildPrevSibling();
-      currentScope.lastChild = this;
-    } else {
-      this.prevSibling = el.lastChild || undefined;
+  class ChainedScope extends ContentScope {
+    el;
+    svg;
+    prevSibling;
+    constructor(el, svg, useParentCleaners = false) {
+      super(useParentCleaners ? currentScope.cleaners : []);
+      this.el = el;
+      this.svg = svg;
+      if (el === currentScope.el) {
+        this.prevSibling = currentScope.getChildPrevSibling();
+        currentScope.lastChild = this;
+      } else {
+        this.prevSibling = el.lastChild || undefined;
+      }
+      if (!useParentCleaners)
+        currentScope.cleaners.push(this);
+    }
+    getPrecedingNode() {
+      return findLastNodeInPrevSiblings(this.prevSibling);
+    }
+    getChildPrevSibling() {
+      return this.lastChild || this.prevSibling;
     }
-    if (!useParentCleaners)
-      currentScope.cleaners.push(this);
-  }
-  getPrecedingNode() {
-    return findLastNodeInPrevSiblings(this.prevSibling);
-  }
-  getChildPrevSibling() {
-    return this.lastChild || this.prevSibling;
   }
-}
 
-class RegularScope extends ChainedScope {
-  renderer;
-  constructor(el, svg, renderer) {
-    super(el, svg);
-    this.renderer = renderer;
-    this.redraw();
-  }
-  redraw() {
-    const savedScope = currentScope;
-    currentScope = this;
-    try {
-      this.renderer();
-    } catch (e) {
-      handleError(e, true);
+  class RegularScope extends ChainedScope {
+    renderer;
+    constructor(el, svg, renderer) {
+      super(el, svg);
+      this.renderer = renderer;
+      this.redraw();
+    }
+    redraw() {
+      const savedScope = currentScope;
+      currentScope = this;
+      try {
+        this.renderer();
+      } catch (e) {
+        handleError(e, true);
+      }
+      currentScope = savedScope;
     }
-    currentScope = savedScope;
   }
-}
 
-class RootScope extends ContentScope {
-  el = document.body;
-  svg = false;
-  getPrecedingNode() {
-    return;
+  class RootScope extends ContentScope {
+    el = document ? document.body : undefined;
+    svg = false;
+    getPrecedingNode() {
+      return;
+    }
   }
-}
 
-class MountScope extends ContentScope {
-  el;
-  renderer;
-  svg;
-  constructor(el, renderer) {
-    super();
-    this.el = el;
-    this.renderer = renderer;
-    this.svg = el.namespaceURI === "http://www.w3.org/2000/svg";
-    const oldTopRedrawScope = topRedrawScope;
-    topRedrawScope = this;
-    this.redraw();
-    topRedrawScope = oldTopRedrawScope;
-    currentScope.cleaners.push(this);
-  }
-  redraw() {
-    RegularScope.prototype.redraw.call(this);
-  }
-  getPrecedingNode() {
-    return;
-  }
-  delete() {
-    removeNodes(this.getLastNode(), this.getPrecedingNode());
-    const savedSurvivingEl = survivingEl;
-    survivingEl = this.el;
-    super.delete();
-    survivingEl = savedSurvivingEl;
-  }
-  remove() {
-    this.delete();
-  }
-}
-function removeNodes(node, preNode) {
-  while (node && node !== preNode) {
-    const prevNode = node.previousSibling;
-    const onDestroy = onDestroyMap.get(node);
-    if (onDestroy && node instanceof Element) {
-      if (onDestroy !== true) {
-        if (typeof onDestroy === "function") {
-          onDestroy(node);
-        } else {
-          destroyWithClass(node, onDestroy);
+  class MountScope extends ContentScope {
+    el;
+    renderer;
+    svg;
+    constructor(el, renderer) {
+      super();
+      this.el = el;
+      this.renderer = renderer;
+      this.svg = el.namespaceURI === "http://www.w3.org/2000/svg";
+      const oldTopRedrawScope = topRedrawScope;
+      topRedrawScope = this;
+      this.redraw();
+      topRedrawScope = oldTopRedrawScope;
+      currentScope.cleaners.push(this);
+    }
+    redraw() {
+      RegularScope.prototype.redraw.call(this);
+    }
+    getPrecedingNode() {
+      return;
+    }
+    delete() {
+      removeNodes(this.getLastNode(), this.getPrecedingNode());
+      const savedSurvivingEl = survivingEl;
+      survivingEl = this.el;
+      super.delete();
+      survivingEl = savedSurvivingEl;
+    }
+    remove() {
+      this.delete();
+    }
+  }
+  function removeNodes(node, preNode) {
+    while (node && node !== preNode) {
+      const prevNode = node.previousSibling;
+      const onDestroy = onDestroyMap.get(node);
+      if (onDestroy && node instanceof Element) {
+        if (onDestroy !== true) {
+          if (typeof onDestroy === "function") {
+            onDestroy(node);
+          } else {
+            destroyWithClass(node, onDestroy);
+          }
+          onDestroyMap.set(node, true);
         }
-        onDestroyMap.set(node, true);
+      } else {
+        node.remove();
       }
-    } else {
-      node.remove();
-    }
-    node = prevNode;
-  }
-}
-function findLastNodeInPrevSiblings(sibling) {
-  if (!sibling || sibling instanceof Node)
-    return sibling;
-  return sibling.getLastNode() || sibling.getPrecedingNode();
-}
-
-class ResultScope extends ChainedScope {
-  renderer;
-  result = optProxy({ value: undefined });
-  constructor(renderer) {
-    super(currentScope.el, currentScope.svg);
-    this.renderer = renderer;
-    this.redraw();
-  }
-  redraw() {
-    const savedScope = currentScope;
-    currentScope = this;
-    try {
-      this.result.value = this.renderer();
-    } catch (e) {
-      handleError(e, true);
+      node = prevNode;
     }
-    currentScope = savedScope;
   }
-}
-
-class SetArgScope extends ChainedScope {
-  key;
-  target;
-  svg = false;
-  constructor(el, key, target) {
-    super(el, el.namespaceURI === "http://www.w3.org/2000/svg");
-    this.key = key;
-    this.target = target;
-    this.redraw();
-  }
-  redraw() {
-    const savedScope = currentScope;
-    currentScope = this;
-    applyArg(this.el, this.key, this.target.value);
-    currentScope = savedScope;
+  function findLastNodeInPrevSiblings(sibling) {
+    if (!sibling || !(sibling instanceof Scope))
+      return sibling;
+    return sibling.getLastNode() || sibling.getPrecedingNode();
   }
-}
 
-class OnEachScope extends Scope {
-  renderer;
-  makeSortKey;
-  parentElement = currentScope.el;
-  prevSibling;
-  target;
-  byIndex = new Map;
-  sortedSet = new ReverseSortedSet("sortKey");
-  changedIndexes = new Map;
-  constructor(proxy, renderer, makeSortKey) {
-    super();
-    this.renderer = renderer;
-    this.makeSortKey = makeSortKey;
-    const target = this.target = proxy[TARGET_SYMBOL] || proxy;
-    subscribe(target, ANY_SYMBOL, this);
-    this.prevSibling = currentScope.getChildPrevSibling();
-    currentScope.lastChild = this;
-    currentScope.cleaners.push(this);
-    if (target instanceof Array) {
-      for (let i = 0;i < target.length; i++) {
-        new OnEachItemScope(this, i, false);
-      }
-    } else {
-      for (const key of target instanceof Map ? target.keys() : target instanceof Set ? target.values() : Object.keys(target)) {
-        new OnEachItemScope(this, key, false);
+  class ResultScope extends ChainedScope {
+    renderer;
+    result = optProxy({ value: undefined });
+    constructor(renderer) {
+      super(currentScope.el, currentScope.svg);
+      this.renderer = renderer;
+      this.redraw();
+    }
+    redraw() {
+      const savedScope = currentScope;
+      currentScope = this;
+      try {
+        this.result.value = this.renderer();
+      } catch (e) {
+        handleError(e, true);
       }
+      currentScope = savedScope;
     }
   }
-  getPrecedingNode() {
-    return findLastNodeInPrevSiblings(this.prevSibling);
+
+  class SetArgScope extends ChainedScope {
+    key;
+    target;
+    svg = false;
+    constructor(el, key, target) {
+      super(el, el.namespaceURI === "http://www.w3.org/2000/svg");
+      this.key = key;
+      this.target = target;
+      this.redraw();
+    }
+    redraw() {
+      const savedScope = currentScope;
+      currentScope = this;
+      applyArg(this.el, this.key, this.target.value);
+      currentScope = savedScope;
+    }
   }
-  onChange(target, index, newData, oldData) {
-    if (!(target instanceof Array) || typeof index === "number") {
-      if (this.changedIndexes.has(index)) {
-        if (this.changedIndexes.get(index) === newData) {
-          this.changedIndexes.delete(index);
+
+  class OnEachScope extends Scope {
+    renderer;
+    makeSortKey;
+    parentElement = currentScope.el;
+    prevSibling;
+    target;
+    byIndex = new Map;
+    sortedSet = new ReverseSortedSet("sortKey");
+    changedIndexes = new Map;
+    constructor(proxy2, renderer, makeSortKey) {
+      super();
+      this.renderer = renderer;
+      this.makeSortKey = makeSortKey;
+      const target = this.target = proxy2[TARGET_SYMBOL] || proxy2;
+      subscribe(target, ANY_SYMBOL, this);
+      this.prevSibling = currentScope.getChildPrevSibling();
+      currentScope.lastChild = this;
+      currentScope.cleaners.push(this);
+      if (target instanceof Array) {
+        for (let i = 0;i < target.length; i++) {
+          new OnEachItemScope(this, i, false);
         }
       } else {
-        this.changedIndexes.set(index, oldData);
-        queue(this);
+        for (const key of target instanceof Map ? target.keys() : target instanceof Set ? target.values() : Object.keys(target)) {
+          new OnEachItemScope(this, key, false);
+        }
       }
     }
-  }
-  queueRun() {
-    const indexes = this.changedIndexes;
-    this.changedIndexes = new Map;
-    for (const index of indexes.keys()) {
-      const oldScope = this.byIndex.get(index);
-      if (oldScope)
-        oldScope.remove();
-      if (this.target instanceof Set || this.target instanceof Map ? this.target.has(index) : (index in this.target)) {
-        new OnEachItemScope(this, index, true);
-      } else {
-        this.byIndex.delete(index);
+    getPrecedingNode() {
+      return findLastNodeInPrevSiblings(this.prevSibling);
+    }
+    onChange(target, index, newData, oldData) {
+      if (!(target instanceof Array) || typeof index === "number") {
+        if (this.changedIndexes.has(index)) {
+          if (this.changedIndexes.get(index) === newData) {
+            this.changedIndexes.delete(index);
+          }
+        } else {
+          this.changedIndexes.set(index, oldData);
+          queue(this);
+        }
       }
     }
-    topRedrawScope = undefined;
-  }
-  delete() {
-    for (const scope of this.byIndex.values()) {
-      scope.delete();
+    queueRun() {
+      const indexes = this.changedIndexes;
+      this.changedIndexes = new Map;
+      for (const index of indexes.keys()) {
+        const oldScope = this.byIndex.get(index);
+        if (oldScope)
+          oldScope.remove();
+        if (this.target instanceof Set || this.target instanceof Map ? this.target.has(index) : (index in this.target)) {
+          new OnEachItemScope(this, index, true);
+        } else {
+          this.byIndex.delete(index);
+        }
+      }
+      topRedrawScope = undefined;
     }
-    sortedQueue?.remove(this);
-    this.byIndex.clear();
-    setTimeout(() => {
-      this.sortedSet.clear();
-    }, 1);
-  }
-  getLastNode() {
-    for (const scope of this.sortedSet) {
-      const node = scope.getActualLastNode();
-      if (node)
-        return node;
+    delete() {
+      for (const scope of this.byIndex.values()) {
+        scope.delete();
+      }
+      sortedQueue?.remove(this);
+      this.byIndex.clear();
+      setTimeout(() => {
+        this.sortedSet.clear();
+      }, 1);
+    }
+    getLastNode() {
+      for (const scope of this.sortedSet) {
+        const node = scope.getActualLastNode();
+        if (node)
+          return node;
+      }
     }
   }
-}
 
-class OnEachItemScope extends ContentScope {
-  parent;
-  itemIndex;
-  sortKey;
-  el;
-  svg;
-  constructor(parent, itemIndex, topRedraw) {
-    super();
-    this.parent = parent;
-    this.itemIndex = itemIndex;
-    this.el = parent.parentElement;
-    this.svg = currentScope.svg;
-    this.parent.byIndex.set(this.itemIndex, this);
-    this.lastChild = this;
-    if (topRedraw)
-      topRedrawScope = this;
-    this.redraw();
-  }
-  getPrecedingNode() {
-    this.parent.sortedSet.add(this);
-    const preScope = this.parent.sortedSet.prev(this);
-    if (preScope)
-      return findLastNodeInPrevSiblings(preScope.lastChild);
-    return this.parent.getPrecedingNode();
-  }
-  getLastNode() {
-    return this.getPrecedingNode();
-  }
-  getActualLastNode() {
-    let child = this.lastChild;
-    while (child && child !== this) {
-      if (child instanceof Node)
-        return child;
-      const node = child.getLastNode();
-      if (node)
-        return node;
-      child = child.getPrecedingNode();
-    }
-  }
-  queueRun() {
-    if (currentScope !== ROOT_SCOPE)
-      internalError(4);
-    if (!this.fetchHasChanges())
-      return;
-    if (this.sortKey !== undefined) {
-      const lastNode = this.getActualLastNode();
-      if (lastNode)
-        removeNodes(lastNode, this.getPrecedingNode());
-    }
-    const savedSurvivingEl = survivingEl;
-    survivingEl = this.el;
-    this.delete();
-    survivingEl = savedSurvivingEl;
-    this.lastChild = this;
-    topRedrawScope = this;
-    this.redraw();
-    topRedrawScope = undefined;
-  }
-  redraw() {
-    let value;
-    const target = this.parent.target;
-    let itemIndex = this.itemIndex;
-    if (target instanceof Set) {
-      value = itemIndex = optProxy(itemIndex);
-    } else if (target instanceof Map) {
-      value = optProxy(target.get(itemIndex));
-      itemIndex = optProxy(itemIndex);
-    } else {
-      value = optProxy(target[itemIndex]);
+  class OnEachItemScope extends ContentScope {
+    parent;
+    itemIndex;
+    sortKey;
+    el;
+    svg;
+    constructor(parent, itemIndex, topRedraw) {
+      super();
+      this.parent = parent;
+      this.itemIndex = itemIndex;
+      this.el = parent.parentElement;
+      this.svg = currentScope.svg;
+      this.parent.byIndex.set(this.itemIndex, this);
+      this.lastChild = this;
+      if (topRedraw)
+        topRedrawScope = this;
+      this.redraw();
+    }
+    getPrecedingNode() {
+      this.parent.sortedSet.add(this);
+      const preScope = this.parent.sortedSet.prev(this);
+      if (preScope)
+        return findLastNodeInPrevSiblings(preScope.lastChild);
+      return this.parent.getPrecedingNode();
+    }
+    getLastNode() {
+      return this.getPrecedingNode();
+    }
+    getActualLastNode() {
+      let child = this.lastChild;
+      while (child && child !== this) {
+        if (!(child instanceof Scope))
+          return child;
+        const node = child.getLastNode();
+        if (node)
+          return node;
+        child = child.getPrecedingNode();
+      }
     }
-    const savedScope = currentScope;
-    currentScope = this;
-    let sortKey;
-    try {
-      if (this.parent.makeSortKey) {
-        sortKey = this.parent.makeSortKey(value, itemIndex);
+    queueRun() {
+      if (currentScope !== ROOT_SCOPE)
+        internalError(4);
+      if (!this.fetchHasChanges())
+        return;
+      if (this.sortKey !== undefined) {
+        const lastNode = this.getActualLastNode();
+        if (lastNode)
+          removeNodes(lastNode, this.getPrecedingNode());
+      }
+      const savedSurvivingEl = survivingEl;
+      survivingEl = this.el;
+      this.delete();
+      survivingEl = savedSurvivingEl;
+      this.lastChild = this;
+      topRedrawScope = this;
+      this.redraw();
+      topRedrawScope = undefined;
+    }
+    redraw() {
+      let value;
+      const target = this.parent.target;
+      let itemIndex = this.itemIndex;
+      if (target instanceof Set) {
+        value = itemIndex = optProxy(itemIndex);
+      } else if (target instanceof Map) {
+        value = optProxy(target.get(itemIndex));
+        itemIndex = optProxy(itemIndex);
       } else {
-        sortKey = itemIndex;
+        value = optProxy(target[itemIndex]);
+      }
+      const savedScope = currentScope;
+      currentScope = this;
+      let sortKey;
+      try {
+        if (this.parent.makeSortKey) {
+          sortKey = this.parent.makeSortKey(value, itemIndex);
+        } else {
+          sortKey = itemIndex;
+        }
+        if (sortKey instanceof Array)
+          sortKey = arrayToStr(sortKey);
+        else if (typeof sortKey !== "string" && sortKey != null)
+          sortKey = arrayToStr([sortKey]);
+        if (this.sortKey !== sortKey) {
+          this.parent.sortedSet.remove(this);
+          this.sortKey = sortKey;
+        }
+        if (sortKey != null)
+          this.parent.renderer(value, itemIndex);
+      } catch (e) {
+        handleError(e, sortKey != null);
       }
-      if (sortKey instanceof Array)
-        sortKey = arrayToStr(sortKey);
-      else if (typeof sortKey !== "string" && sortKey != null)
-        sortKey = arrayToStr([sortKey]);
-      if (this.sortKey !== sortKey) {
+      currentScope = savedScope;
+    }
+    getInsertAfterNode() {
+      if (this.sortKey == null)
+        internalError(1);
+      return findLastNodeInPrevSiblings(this.lastChild);
+    }
+    remove() {
+      if (this.sortKey !== undefined) {
+        const lastNode = this.getActualLastNode();
+        if (lastNode)
+          removeNodes(lastNode, this.getPrecedingNode());
         this.parent.sortedSet.remove(this);
-        this.sortKey = sortKey;
+        this.sortKey = undefined;
       }
-      if (sortKey != null)
-        this.parent.renderer(value, itemIndex);
-    } catch (e) {
-      handleError(e, sortKey != null);
+      const savedSurvivingEl = survivingEl;
+      survivingEl = this.el;
+      this.delete();
+      survivingEl = savedSurvivingEl;
     }
-    currentScope = savedScope;
   }
-  getInsertAfterNode() {
-    if (this.sortKey == null)
-      internalError(1);
-    return findLastNodeInPrevSiblings(this.lastChild);
+  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;
   }
-  remove() {
-    if (this.sortKey !== undefined) {
-      const lastNode = this.getActualLastNode();
-      if (lastNode)
-        removeNodes(lastNode, this.getPrecedingNode());
-      this.parent.sortedSet.remove(this);
-      this.sortKey = undefined;
+  const ROOT_SCOPE = new RootScope;
+  let currentScope = ROOT_SCOPE;
+  function leakScope(func) {
+    const savedScope = currentScope;
+    currentScope = new RootScope;
+    try {
+      return func();
+    } finally {
+      currentScope = savedScope;
+    }
+  }
+  const ANY_SYMBOL = Symbol("any");
+  const TARGET_SYMBOL = Symbol("target");
+  const MAP_SIZE_SYMBOL = Symbol("mapSize");
+  const subscribers = new WeakMap;
+  let peeking = 0;
+  function subscribe(target, index, observer = currentScope) {
+    if (observer === ROOT_SCOPE || peeking)
+      return;
+    let byTarget = subscribers.get(target);
+    if (!byTarget)
+      subscribers.set(target, byTarget = new Map);
+    if (index !== ANY_SYMBOL && byTarget.get(ANY_SYMBOL)?.has(observer))
+      return;
+    let byIndex = byTarget.get(index);
+    if (!byIndex)
+      byTarget.set(index, byIndex = new Set);
+    if (byIndex.has(observer))
+      return;
+    byIndex.add(observer);
+    if (observer === currentScope) {
+      currentScope.cleaners.push(byIndex);
+    } else {
+      currentScope.cleaners.push(() => {
+        byIndex.delete(observer);
+      });
     }
-    const savedSurvivingEl = survivingEl;
-    survivingEl = this.el;
-    this.delete();
-    survivingEl = savedSurvivingEl;
   }
-}
-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;
-}
-var ROOT_SCOPE = new RootScope;
-var currentScope = ROOT_SCOPE;
-function leakScope(func) {
-  const savedScope = currentScope;
-  currentScope = new RootScope;
-  try {
-    return func();
-  } finally {
-    currentScope = savedScope;
+  function onEach(target, render, makeKey) {
+    if (!target || typeof target !== "object")
+      throw new Error("A.onEach requires an object");
+    target = target[TARGET_SYMBOL] || target;
+    new OnEachScope(target, render, makeKey);
   }
-}
-var ANY_SYMBOL = Symbol("any");
-var TARGET_SYMBOL = Symbol("target");
-var MAP_SIZE_SYMBOL = Symbol("mapSize");
-var subscribers = new WeakMap;
-var peeking = 0;
-function subscribe(target, index, observer = currentScope) {
-  if (observer === ROOT_SCOPE || peeking)
-    return;
-  let byTarget = subscribers.get(target);
-  if (!byTarget)
-    subscribers.set(target, byTarget = new Map);
-  if (index !== ANY_SYMBOL && byTarget.get(ANY_SYMBOL)?.has(observer))
-    return;
-  let byIndex = byTarget.get(index);
-  if (!byIndex)
-    byTarget.set(index, byIndex = new Set);
-  if (byIndex.has(observer))
-    return;
-  byIndex.add(observer);
-  if (observer === currentScope) {
-    currentScope.cleaners.push(byIndex);
-  } else {
-    currentScope.cleaners.push(() => {
-      byIndex.delete(observer);
-    });
+  function isObjEmpty(obj) {
+    for (const k of Object.keys(obj))
+      return false;
+    return true;
   }
-}
-function onEach(target, render, makeKey) {
-  if (!target || typeof target !== "object")
-    throw new Error("A.onEach requires an object");
-  target = target[TARGET_SYMBOL] || target;
-  new OnEachScope(target, render, makeKey);
-}
-function isObjEmpty(obj) {
-  for (const k of Object.keys(obj))
-    return false;
-  return true;
-}
-var EMPTY = Symbol("empty");
-function isEmpty(proxied) {
-  const target = proxied[TARGET_SYMBOL] || proxied;
-  const scope = currentScope;
-  if (target instanceof Array) {
-    subscribe(target, "length", (index, newData, oldData) => {
-      if (!newData !== !oldData)
-        scope.onChange(target, EMPTY, !newData, !oldData);
+  const EMPTY = Symbol("empty");
+  function isEmpty(proxied) {
+    const target = proxied[TARGET_SYMBOL] || proxied;
+    const scope = currentScope;
+    if (target instanceof Array) {
+      subscribe(target, "length", (index, newData, oldData) => {
+        if (!newData !== !oldData)
+          scope.onChange(target, EMPTY, !newData, !oldData);
+      });
+      return !target.length;
+    }
+    if (target instanceof Map || target instanceof Set) {
+      subscribe(target, MAP_SIZE_SYMBOL, (index, newData, oldData) => {
+        if (!newData !== !oldData)
+          scope.onChange(target, EMPTY, !newData, !oldData);
+      });
+      return !target.size;
+    }
+    let oldEmpty = isObjEmpty(target);
+    subscribe(target, ANY_SYMBOL, (index, newData, oldData) => {
+      if (newData === EMPTY !== (oldData === EMPTY)) {
+        const newEmpty = isObjEmpty(target);
+        scope.onChange(target, EMPTY, newEmpty, oldEmpty);
+        oldEmpty = newEmpty;
+      }
     });
-    return !target.length;
-  }
-  if (target instanceof Map || target instanceof Set) {
-    subscribe(target, MAP_SIZE_SYMBOL, (index, newData, oldData) => {
-      if (!newData !== !oldData)
-        scope.onChange(target, EMPTY, !newData, !oldData);
+    return oldEmpty;
+  }
+  function count(proxied) {
+    if (proxied instanceof Array)
+      return ref(proxied, "length");
+    if (proxied instanceof Map || proxied instanceof Set)
+      return ref(proxied, "size");
+    const target = proxied[TARGET_SYMBOL] || proxied;
+    let cnt = 0;
+    for (const k of Object.keys(target))
+      if (target[k] !== undefined)
+        cnt++;
+    const result = proxy(cnt);
+    subscribe(target, ANY_SYMBOL, (index, newData, oldData) => {
+      if (oldData === newData) {} else if (oldData === EMPTY)
+        result.value = ++cnt;
+      else if (newData === EMPTY)
+        result.value = --cnt;
     });
-    return !target.size;
+    return result;
   }
-  let oldEmpty = isObjEmpty(target);
-  subscribe(target, ANY_SYMBOL, (index, newData, oldData) => {
-    if (newData === EMPTY !== (oldData === EMPTY)) {
-      const newEmpty = isObjEmpty(target);
-      scope.onChange(target, EMPTY, newEmpty, oldEmpty);
-      oldEmpty = newEmpty;
-    }
-  });
-  return oldEmpty;
-}
-function count(proxied) {
-  if (proxied instanceof Array)
-    return ref(proxied, "length");
-  if (proxied instanceof Map || proxied instanceof Set)
-    return ref(proxied, "size");
-  const target = proxied[TARGET_SYMBOL] || proxied;
-  let cnt = 0;
-  for (const k of Object.keys(target))
-    if (target[k] !== undefined)
-      cnt++;
-  const result = proxy(cnt);
-  subscribe(target, ANY_SYMBOL, (index, newData, oldData) => {
-    if (oldData === newData) {} else if (oldData === EMPTY)
-      result.value = ++cnt;
-    else if (newData === EMPTY)
-      result.value = --cnt;
-  });
-  return result;
-}
-function defaultEmitHandler(target, index, newData, oldData) {
-  if (newData === oldData && newData !== undefined)
-    return;
-  const byTarget = subscribers.get(target);
-  if (byTarget === undefined)
-    return;
-  for (const what of [index, ANY_SYMBOL]) {
-    const byIndex = byTarget.get(what);
-    if (byIndex) {
-      for (const observer of byIndex) {
-        if (typeof observer === "function")
-          observer(index, newData, oldData);
-        else
-          observer.onChange(target, index, newData, oldData);
+  function defaultEmitHandler(target, index, newData, oldData) {
+    if (newData === oldData && newData !== undefined)
+      return;
+    const byTarget = subscribers.get(target);
+    if (byTarget === undefined)
+      return;
+    for (const what of [index, ANY_SYMBOL]) {
+      const byIndex = byTarget.get(what);
+      if (byIndex) {
+        for (const observer of byIndex) {
+          if (typeof observer === "function")
+            observer(index, newData, oldData);
+          else
+            observer.onChange(target, index, newData, oldData);
+        }
       }
     }
   }
-}
-var emit = defaultEmitHandler;
-var objectHandler = {
-  get(target, prop) {
-    if (prop === TARGET_SYMBOL)
-      return target;
-    subscribe(target, prop);
-    return optProxy(target[prop]);
-  },
-  set(target, prop, newData) {
-    if (typeof newData === "object" && newData)
+  let emit = defaultEmitHandler;
+  const objectHandler = {
+    get(target, prop) {
+      if (prop === TARGET_SYMBOL)
+        return target;
+      subscribe(target, prop);
+      return optProxy(target[prop]);
+    },
+    set(target, prop, newData) {
+      if (typeof newData === "object" && newData)
+        newData = newData[TARGET_SYMBOL] || newData;
+      const oldData = target.hasOwnProperty(prop) ? target[prop] : EMPTY;
+      if (newData !== oldData) {
+        target[prop] = newData;
+        emit(target, prop, newData, oldData);
+      }
+      return true;
+    },
+    deleteProperty(target, prop) {
+      const old = target.hasOwnProperty(prop) ? target[prop] : EMPTY;
+      delete target[prop];
+      emit(target, prop, EMPTY, old);
+      return true;
+    },
+    has(target, prop) {
+      subscribe(target, prop);
+      return target.hasOwnProperty(prop);
+    },
+    ownKeys(target) {
+      subscribe(target, ANY_SYMBOL);
+      return Reflect.ownKeys(target);
+    }
+  };
+  function arraySet(target, prop, newData) {
+    if (typeof newData === "object" && newData) {
       newData = newData[TARGET_SYMBOL] || newData;
-    const oldData = target.hasOwnProperty(prop) ? target[prop] : EMPTY;
+    }
+    let oldData = target[prop];
+    if (oldData === undefined && !target.hasOwnProperty(prop))
+      oldData = EMPTY;
     if (newData !== oldData) {
-      target[prop] = newData;
-      emit(target, prop, newData, oldData);
+      const oldLength = target.length;
+      if (prop === "length") {
+        target.length = newData;
+        for (let i = newData;i < oldLength; i++) {
+          emit(target, i, EMPTY, target[i]);
+        }
+      } else {
+        if (typeof prop === "string") {
+          const n = 0 | prop;
+          if (String(n) === prop && n >= 0)
+            prop = n;
+        }
+        target[prop] = newData;
+        emit(target, prop, newData, oldData);
+      }
+      if (target.length !== oldLength) {
+        emit(target, "length", target.length, oldLength);
+      }
     }
     return true;
-  },
-  deleteProperty(target, prop) {
-    const old = target.hasOwnProperty(prop) ? target[prop] : EMPTY;
-    delete target[prop];
-    emit(target, prop, EMPTY, old);
-    return true;
-  },
-  has(target, prop) {
-    subscribe(target, prop);
-    return target.hasOwnProperty(prop);
-  },
-  ownKeys(target) {
-    subscribe(target, ANY_SYMBOL);
-    return Reflect.ownKeys(target);
   }
-};
-function arraySet(target, prop, newData) {
-  if (typeof newData === "object" && newData) {
-    newData = newData[TARGET_SYMBOL] || newData;
-  }
-  let oldData = target[prop];
-  if (oldData === undefined && !target.hasOwnProperty(prop))
-    oldData = EMPTY;
-  if (newData !== oldData) {
-    const oldLength = target.length;
-    if (prop === "length") {
-      target.length = newData;
-      for (let i = newData;i < oldLength; i++) {
-        emit(target, i, EMPTY, target[i]);
+  const arrayHandler = {
+    get(target, prop) {
+      if (prop === TARGET_SYMBOL)
+        return target;
+      if (typeof prop === "string") {
+        const n = 0 | prop;
+        if (String(n) === prop && n >= 0)
+          prop = n;
       }
-    } else {
+      subscribe(target, prop);
+      return optProxy(target[prop]);
+    },
+    set: arraySet,
+    deleteProperty(target, prop) {
       if (typeof prop === "string") {
         const n = 0 | prop;
         if (String(n) === prop && n >= 0)
           prop = n;
       }
-      target[prop] = newData;
-      emit(target, prop, newData, oldData);
-    }
-    if (target.length !== oldLength) {
-      emit(target, "length", target.length, oldLength);
+      let oldData = target[prop];
+      if (oldData === undefined && !target.hasOwnProperty(prop))
+        oldData = EMPTY;
+      delete target[prop];
+      emit(target, prop, EMPTY, oldData);
+      return true;
     }
+  };
+  function wrapIteratorSingle(iterator) {
+    return {
+      [Symbol.iterator]() {
+        return this;
+      },
+      next() {
+        const result = iterator.next();
+        if (result.done)
+          return result;
+        return {
+          done: false,
+          value: optProxy(result.value)
+        };
+      }
+    };
   }
-  return true;
-}
-var arrayHandler = {
-  get(target, prop) {
-    if (prop === TARGET_SYMBOL)
-      return target;
-    if (typeof prop === "string") {
-      const n = 0 | prop;
-      if (String(n) === prop && n >= 0)
-        prop = n;
-    }
-    subscribe(target, prop);
-    return optProxy(target[prop]);
-  },
-  set: arraySet,
-  deleteProperty(target, prop) {
-    if (typeof prop === "string") {
-      const n = 0 | prop;
-      if (String(n) === prop && n >= 0)
-        prop = n;
-    }
-    let oldData = target[prop];
-    if (oldData === undefined && !target.hasOwnProperty(prop))
-      oldData = EMPTY;
-    delete target[prop];
-    emit(target, prop, EMPTY, oldData);
-    return true;
+  function wrapIteratorPair(iterator) {
+    return {
+      [Symbol.iterator]() {
+        return this;
+      },
+      next() {
+        const result = iterator.next();
+        if (result.done)
+          return result;
+        return {
+          done: false,
+          value: [optProxy(result.value[0]), optProxy(result.value[1])]
+        };
+      }
+    };
   }
-};
-function wrapIteratorSingle(iterator) {
-  return {
-    [Symbol.iterator]() {
+  function unproxyCollectionValue(value) {
+    return typeof value === "object" && value ? value[TARGET_SYMBOL] || value : value;
+  }
+  const mapMethodHandlers = {
+    get(key) {
+      const target = this[TARGET_SYMBOL];
+      key = unproxyCollectionValue(key);
+      subscribe(target, key);
+      return optProxy(target.get(key));
+    },
+    set(key, newData) {
+      const target = this[TARGET_SYMBOL];
+      key = unproxyCollectionValue(key);
+      newData = unproxyCollectionValue(newData);
+      let oldData = target.get(key);
+      if (oldData === undefined && !target.has(key))
+        oldData = EMPTY;
+      if (newData !== oldData) {
+        const oldSize = target.size;
+        target.set(key, newData);
+        emit(target, key, newData, oldData);
+        emit(target, MAP_SIZE_SYMBOL, target.size, oldSize);
+      }
       return this;
     },
-    next() {
-      const result = iterator.next();
-      if (result.done)
-        return result;
-      return {
-        done: false,
-        value: optProxy(result.value)
-      };
+    delete(key) {
+      const target = this[TARGET_SYMBOL];
+      key = unproxyCollectionValue(key);
+      let oldData = target.get(key);
+      if (oldData === undefined && !target.has(key))
+        oldData = EMPTY;
+      const result = target.delete(key);
+      if (result) {
+        emit(target, key, EMPTY, oldData);
+        emit(target, MAP_SIZE_SYMBOL, target.size, target.size + 1);
+      }
+      return result;
+    },
+    clear() {
+      const target = this[TARGET_SYMBOL];
+      const oldSize = target.size;
+      for (const key of target.keys()) {
+        emit(target, key, undefined, target.get(key));
+      }
+      target.clear();
+      emit(target, MAP_SIZE_SYMBOL, 0, oldSize);
+    },
+    has(key) {
+      const target = this[TARGET_SYMBOL];
+      key = unproxyCollectionValue(key);
+      subscribe(target, key);
+      return target.has(key);
+    },
+    keys() {
+      const target = this[TARGET_SYMBOL];
+      subscribe(target, ANY_SYMBOL);
+      return wrapIteratorSingle(target.keys());
+    },
+    values() {
+      const target = this[TARGET_SYMBOL];
+      subscribe(target, ANY_SYMBOL);
+      return wrapIteratorSingle(target.values());
+    },
+    entries() {
+      const target = this[TARGET_SYMBOL];
+      subscribe(target, ANY_SYMBOL);
+      return wrapIteratorPair(target.entries());
+    },
+    [Symbol.iterator]() {
+      const target = this[TARGET_SYMBOL];
+      subscribe(target, ANY_SYMBOL);
+      return wrapIteratorPair(target[Symbol.iterator]());
     }
   };
-}
-function wrapIteratorPair(iterator) {
-  return {
-    [Symbol.iterator]() {
+  const setMethodHandlers = {
+    add(value) {
+      const target = this[TARGET_SYMBOL];
+      value = unproxyCollectionValue(value);
+      if (!target.has(value)) {
+        const oldSize = target.size;
+        target.add(value);
+        emit(target, value, value, EMPTY);
+        emit(target, MAP_SIZE_SYMBOL, target.size, oldSize);
+      }
       return this;
     },
-    next() {
-      const result = iterator.next();
-      if (result.done)
-        return result;
-      return {
-        done: false,
-        value: [optProxy(result.value[0]), optProxy(result.value[1])]
-      };
-    }
-  };
-}
-function unproxyCollectionValue(value) {
-  return typeof value === "object" && value ? value[TARGET_SYMBOL] || value : value;
-}
-var mapMethodHandlers = {
-  get(key) {
-    const target = this[TARGET_SYMBOL];
-    key = unproxyCollectionValue(key);
-    subscribe(target, key);
-    return optProxy(target.get(key));
-  },
-  set(key, newData) {
-    const target = this[TARGET_SYMBOL];
-    key = unproxyCollectionValue(key);
-    newData = unproxyCollectionValue(newData);
-    let oldData = target.get(key);
-    if (oldData === undefined && !target.has(key))
-      oldData = EMPTY;
-    if (newData !== oldData) {
+    delete(value) {
+      const target = this[TARGET_SYMBOL];
+      value = unproxyCollectionValue(value);
+      if (!target.has(value))
+        return false;
       const oldSize = target.size;
-      target.set(key, newData);
-      emit(target, key, newData, oldData);
-      emit(target, MAP_SIZE_SYMBOL, target.size, oldSize);
-    }
-    return this;
-  },
-  delete(key) {
-    const target = this[TARGET_SYMBOL];
-    key = unproxyCollectionValue(key);
-    let oldData = target.get(key);
-    if (oldData === undefined && !target.has(key))
-      oldData = EMPTY;
-    const result = target.delete(key);
-    if (result) {
-      emit(target, key, EMPTY, oldData);
-      emit(target, MAP_SIZE_SYMBOL, target.size, target.size + 1);
-    }
-    return result;
-  },
-  clear() {
-    const target = this[TARGET_SYMBOL];
-    const oldSize = target.size;
-    for (const key of target.keys()) {
-      emit(target, key, undefined, target.get(key));
-    }
-    target.clear();
-    emit(target, MAP_SIZE_SYMBOL, 0, oldSize);
-  },
-  has(key) {
-    const target = this[TARGET_SYMBOL];
-    key = unproxyCollectionValue(key);
-    subscribe(target, key);
-    return target.has(key);
-  },
-  keys() {
-    const target = this[TARGET_SYMBOL];
-    subscribe(target, ANY_SYMBOL);
-    return wrapIteratorSingle(target.keys());
-  },
-  values() {
-    const target = this[TARGET_SYMBOL];
-    subscribe(target, ANY_SYMBOL);
-    return wrapIteratorSingle(target.values());
-  },
-  entries() {
-    const target = this[TARGET_SYMBOL];
-    subscribe(target, ANY_SYMBOL);
-    return wrapIteratorPair(target.entries());
-  },
-  [Symbol.iterator]() {
-    const target = this[TARGET_SYMBOL];
-    subscribe(target, ANY_SYMBOL);
-    return wrapIteratorPair(target[Symbol.iterator]());
-  }
-};
-var setMethodHandlers = {
-  add(value) {
-    const target = this[TARGET_SYMBOL];
-    value = unproxyCollectionValue(value);
-    if (!target.has(value)) {
-      const oldSize = target.size;
-      target.add(value);
-      emit(target, value, value, EMPTY);
+      target.delete(value);
+      emit(target, value, EMPTY, value);
       emit(target, MAP_SIZE_SYMBOL, target.size, oldSize);
+      return true;
+    },
+    clear() {
+      const target = this[TARGET_SYMBOL];
+      const oldSize = target.size;
+      if (!oldSize)
+        return;
+      for (const value of target.values())
+        emit(target, value, EMPTY, value);
+      target.clear();
+      emit(target, MAP_SIZE_SYMBOL, 0, oldSize);
+    },
+    has(value) {
+      const target = this[TARGET_SYMBOL];
+      value = unproxyCollectionValue(value);
+      subscribe(target, value);
+      return target.has(value);
+    },
+    keys() {
+      const target = this[TARGET_SYMBOL];
+      subscribe(target, ANY_SYMBOL);
+      return wrapIteratorSingle(target.keys());
+    },
+    values() {
+      const target = this[TARGET_SYMBOL];
+      subscribe(target, ANY_SYMBOL);
+      return wrapIteratorSingle(target.values());
+    },
+    entries() {
+      const target = this[TARGET_SYMBOL];
+      subscribe(target, ANY_SYMBOL);
+      return wrapIteratorPair(target.entries());
+    },
+    [Symbol.iterator]() {
+      const target = this[TARGET_SYMBOL];
+      subscribe(target, ANY_SYMBOL);
+      return wrapIteratorSingle(target[Symbol.iterator]());
     }
-    return this;
-  },
-  delete(value) {
-    const target = this[TARGET_SYMBOL];
-    value = unproxyCollectionValue(value);
-    if (!target.has(value))
-      return false;
-    const oldSize = target.size;
-    target.delete(value);
-    emit(target, value, EMPTY, value);
-    emit(target, MAP_SIZE_SYMBOL, target.size, oldSize);
-    return true;
-  },
-  clear() {
-    const target = this[TARGET_SYMBOL];
-    const oldSize = target.size;
-    if (!oldSize)
-      return;
-    for (const value of target.values())
-      emit(target, value, EMPTY, value);
-    target.clear();
-    emit(target, MAP_SIZE_SYMBOL, 0, oldSize);
-  },
-  has(value) {
-    const target = this[TARGET_SYMBOL];
-    value = unproxyCollectionValue(value);
-    subscribe(target, value);
-    return target.has(value);
-  },
-  keys() {
-    const target = this[TARGET_SYMBOL];
-    subscribe(target, ANY_SYMBOL);
-    return wrapIteratorSingle(target.keys());
-  },
-  values() {
-    const target = this[TARGET_SYMBOL];
-    subscribe(target, ANY_SYMBOL);
-    return wrapIteratorSingle(target.values());
-  },
-  entries() {
-    const target = this[TARGET_SYMBOL];
-    subscribe(target, ANY_SYMBOL);
-    return wrapIteratorPair(target.entries());
-  },
-  [Symbol.iterator]() {
-    const target = this[TARGET_SYMBOL];
-    subscribe(target, ANY_SYMBOL);
-    return wrapIteratorSingle(target[Symbol.iterator]());
-  }
-};
-var mapHandler = {
-  get(target, prop) {
-    if (prop === TARGET_SYMBOL)
-      return target;
-    if (mapMethodHandlers.hasOwnProperty(prop)) {
-      return mapMethodHandlers[prop];
+  };
+  const mapHandler = {
+    get(target, prop) {
+      if (prop === TARGET_SYMBOL)
+        return target;
+      if (mapMethodHandlers.hasOwnProperty(prop)) {
+        return mapMethodHandlers[prop];
+      }
+      if (prop === "size") {
+        subscribe(target, MAP_SIZE_SYMBOL);
+        return target.size;
+      }
+      return target[prop];
     }
-    if (prop === "size") {
-      subscribe(target, MAP_SIZE_SYMBOL);
-      return target.size;
+  };
+  const setHandler = {
+    get(target, prop) {
+      if (prop === TARGET_SYMBOL)
+        return target;
+      if (setMethodHandlers.hasOwnProperty(prop)) {
+        return setMethodHandlers[prop];
+      }
+      if (prop === "size") {
+        subscribe(target, MAP_SIZE_SYMBOL);
+        return target.size;
+      }
+      return target[prop];
     }
-    return target[prop];
-  }
-};
-var setHandler = {
-  get(target, prop) {
-    if (prop === TARGET_SYMBOL)
-      return target;
-    if (setMethodHandlers.hasOwnProperty(prop)) {
-      return setMethodHandlers[prop];
+  };
+  const proxyMap = new WeakMap;
+  function optProxy(value) {
+    if (typeof value !== "object" || !value || value[TARGET_SYMBOL] !== undefined || value[OPAQUE] || value instanceof Date) {
+      return value;
+    }
+    let proxied = proxyMap.get(value);
+    if (proxied)
+      return proxied;
+    let handler;
+    if (value instanceof Array) {
+      handler = arrayHandler;
+    } else if (value instanceof Map) {
+      handler = mapHandler;
+    } else if (value instanceof Set) {
+      handler = setHandler;
+    } else {
+      handler = objectHandler;
     }
-    if (prop === "size") {
-      subscribe(target, MAP_SIZE_SYMBOL);
-      return target.size;
+    proxied = new Proxy(value, handler);
+    proxyMap.set(value, proxied);
+    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 target[prop];
+    return optProxy(typeof target === "object" && target !== null ? target : { value: target });
   }
-};
-var proxyMap = new WeakMap;
-function optProxy(value) {
-  if (typeof value !== "object" || !value || value[TARGET_SYMBOL] !== undefined || value[OPAQUE] || value instanceof Date) {
-    return value;
+  function unproxy(target) {
+    return target ? target[TARGET_SYMBOL] || target : target;
   }
-  let proxied = proxyMap.get(value);
-  if (proxied)
-    return proxied;
-  let handler;
-  if (value instanceof Array) {
-    handler = arrayHandler;
-  } else if (value instanceof Map) {
-    handler = mapHandler;
-  } else if (value instanceof Set) {
-    handler = setHandler;
-  } else {
-    handler = objectHandler;
-  }
-  proxied = new Proxy(value, handler);
-  proxyMap.set(value, proxied);
-  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;
+  const onDestroyMap = new WeakMap;
+  function destroyWithClass(element, cls) {
+    const classes = cls.split(".").filter((c) => c);
+    element.classList.add(...classes);
+    setTimeout(() => element.remove(), 2000);
   }
-  return optProxy(typeof target === "object" && target !== null ? target : { value: target });
-}
-function unproxy(target) {
-  return target ? target[TARGET_SYMBOL] || target : target;
-}
-var onDestroyMap = new WeakMap;
-function destroyWithClass(element, cls) {
-  const classes = cls.split(".").filter((c) => c);
-  element.classList.add(...classes);
-  setTimeout(() => element.remove(), 2000);
-}
-function copy(a, b, c) {
-  if (arguments.length > 2)
-    return copySet(a, b, c, 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 !== null && typeof src === "object" && src !== null && dstVal.constructor === src.constructor) {
-    return copyImpl(dstVal, src, flags);
-  }
-  src = clone(src);
-  if (dst instanceof Map)
-    dst.set(dstKey, src);
-  else
-    dst[dstKey] = clone(src);
-  return true;
-}
-function merge(a, b, c) {
-  if (arguments.length > 2)
-    return copySet(a, b, c, MERGE);
-  return copyImpl(a, b, MERGE);
-}
-function copyImpl(dst, src, flags) {
-  let unproxied = dst[TARGET_SYMBOL];
-  if (unproxied) {
-    dst = unproxied;
-    flags |= COPY_EMIT;
-  }
-  unproxied = src[TARGET_SYMBOL];
-  if (unproxied) {
-    src = unproxied;
-    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;
-  if (src instanceof Array && dst instanceof Array) {
-    const dstLen = dst.length;
-    const srcLen = src.length;
-    for (let index = 0;index < srcLen; index++) {
-      let dstValue = dst[index];
-      if (dstValue === undefined && !dst.hasOwnProperty(index))
-        dstValue = EMPTY;
-      let srcValue = src[index];
-      if (srcValue === undefined && !src.hasOwnProperty(index)) {
-        delete dst[index];
-        if (flags & COPY_EMIT)
-          emit(dst, index, EMPTY, dstValue);
-        changed = true;
-      } else if (dstValue !== srcValue) {
-        if (typeof srcValue === "object" && srcValue !== null) {
-          if (typeof dstValue === "object" && dstValue !== null && srcValue.constructor === dstValue.constructor && !(OPAQUE in srcValue)) {
-            changed = copyRecursive(dstValue, srcValue, flags) || changed;
-            continue;
+  function copy(a, b, c) {
+    if (arguments.length > 2)
+      return copySet(a, b, c, 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 !== null && typeof src === "object" && src !== null && dstVal.constructor === src.constructor) {
+      return copyImpl(dstVal, src, flags);
+    }
+    src = clone(src);
+    if (dst instanceof Map)
+      dst.set(dstKey, src);
+    else
+      dst[dstKey] = clone(src);
+    return true;
+  }
+  function merge(a, b, c) {
+    if (arguments.length > 2)
+      return copySet(a, b, c, MERGE);
+    return copyImpl(a, b, MERGE);
+  }
+  function copyImpl(dst, src, flags) {
+    let unproxied = dst[TARGET_SYMBOL];
+    if (unproxied) {
+      dst = unproxied;
+      flags |= COPY_EMIT;
+    }
+    unproxied = src[TARGET_SYMBOL];
+    if (unproxied) {
+      src = unproxied;
+      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;
+    if (src instanceof Array && dst instanceof Array) {
+      const dstLen = dst.length;
+      const srcLen = src.length;
+      for (let index = 0;index < srcLen; index++) {
+        let dstValue = dst[index];
+        if (dstValue === undefined && !dst.hasOwnProperty(index))
+          dstValue = EMPTY;
+        let srcValue = src[index];
+        if (srcValue === undefined && !src.hasOwnProperty(index)) {
+          delete dst[index];
+          if (flags & COPY_EMIT)
+            emit(dst, index, EMPTY, dstValue);
+          changed = true;
+        } else if (dstValue !== srcValue) {
+          if (typeof srcValue === "object" && srcValue !== null) {
+            if (typeof dstValue === "object" && dstValue !== null && srcValue.constructor === dstValue.constructor && !(OPAQUE in srcValue)) {
+              changed = copyRecursive(dstValue, srcValue, flags) || changed;
+              continue;
+            }
+            srcValue = cloneRecursive(srcValue, flags & COPY_SUBSCRIBE);
           }
-          srcValue = cloneRecursive(srcValue, flags & COPY_SUBSCRIBE);
+          dst[index] = srcValue;
+          if (flags & COPY_EMIT)
+            emit(dst, index, srcValue, dstValue);
+          changed = true;
         }
-        dst[index] = srcValue;
-        if (flags & COPY_EMIT)
-          emit(dst, index, srcValue, dstValue);
-        changed = true;
       }
-    }
-    if (srcLen !== dstLen) {
-      if (flags & COPY_EMIT) {
-        for (let i = srcLen;i < dstLen; i++) {
-          const old = dst[i];
-          delete dst[i];
-          emit(dst, i, EMPTY, old);
-        }
-        dst.length = srcLen;
-        emit(dst, "length", srcLen, dstLen);
-      } else {
-        dst.length = srcLen;
-      }
-      changed = true;
-    }
-  } else if (src instanceof Map && dst instanceof Map) {
-    for (const key of src.keys()) {
-      let srcValue = src.get(key);
-      let dstValue = dst.get(key);
-      if (dstValue === undefined && !dst.has(key))
-        dstValue = EMPTY;
-      if (dstValue !== srcValue) {
-        if (typeof srcValue === "object" && srcValue !== null) {
-          if (typeof dstValue === "object" && dstValue !== null && srcValue.constructor === dstValue.constructor && !(OPAQUE in srcValue)) {
-            changed = copyRecursive(dstValue, srcValue, flags) || changed;
-            continue;
+      if (srcLen !== dstLen) {
+        if (flags & COPY_EMIT) {
+          for (let i = srcLen;i < dstLen; i++) {
+            const old = dst[i];
+            delete dst[i];
+            emit(dst, i, EMPTY, old);
           }
-          srcValue = cloneRecursive(srcValue, flags & COPY_SUBSCRIBE);
+          dst.length = srcLen;
+          emit(dst, "length", srcLen, dstLen);
+        } else {
+          dst.length = srcLen;
         }
-        dst.set(key, srcValue);
-        if (flags & COPY_EMIT)
-          emit(dst, key, srcValue, dstValue);
         changed = true;
       }
-    }
-    if (!(flags & MERGE)) {
-      for (const k of dst.keys()) {
-        if (!src.has(k)) {
-          const old = dst.get(k);
-          dst.delete(k);
-          if (flags & COPY_EMIT) {
-            emit(dst, k, EMPTY, old);
+    } else if (src instanceof Map && dst instanceof Map) {
+      for (const key of src.keys()) {
+        let srcValue = src.get(key);
+        let dstValue = dst.get(key);
+        if (dstValue === undefined && !dst.has(key))
+          dstValue = EMPTY;
+        if (dstValue !== srcValue) {
+          if (typeof srcValue === "object" && srcValue !== null) {
+            if (typeof dstValue === "object" && dstValue !== null && srcValue.constructor === dstValue.constructor && !(OPAQUE in srcValue)) {
+              changed = copyRecursive(dstValue, srcValue, flags) || changed;
+              continue;
+            }
+            srcValue = cloneRecursive(srcValue, flags & COPY_SUBSCRIBE);
           }
+          dst.set(key, srcValue);
+          if (flags & COPY_EMIT)
+            emit(dst, key, srcValue, dstValue);
           changed = true;
         }
       }
-    }
-  } else if (src.constructor === dst.constructor) {
-    for (const key of Object.keys(src)) {
-      let srcValue = src[key];
-      const dstValue = dst.hasOwnProperty(key) ? dst[key] : EMPTY;
-      if (dstValue !== srcValue) {
-        if (typeof srcValue === "object" && srcValue !== null) {
-          if (typeof dstValue === "object" && dstValue !== null && srcValue.constructor === dstValue.constructor && !(OPAQUE in srcValue)) {
-            changed = copyRecursive(dstValue, srcValue, flags) || changed;
-            continue;
+      if (!(flags & MERGE)) {
+        for (const k of dst.keys()) {
+          if (!src.has(k)) {
+            const old = dst.get(k);
+            dst.delete(k);
+            if (flags & COPY_EMIT) {
+              emit(dst, k, EMPTY, old);
+            }
+            changed = true;
           }
-          srcValue = cloneRecursive(srcValue, flags & COPY_SUBSCRIBE);
         }
-        dst[key] = srcValue;
-        if (flags & COPY_EMIT)
-          emit(dst, key, srcValue, dstValue);
-        changed = true;
       }
-    }
-    if (!(flags & MERGE)) {
-      for (const k of Object.keys(dst)) {
-        if (!src.hasOwnProperty(k)) {
-          const old = dst[k];
-          delete dst[k];
-          if (flags & COPY_EMIT && old !== undefined) {
-            emit(dst, k, EMPTY, old);
+    } else if (src.constructor === dst.constructor) {
+      for (const key of Object.keys(src)) {
+        let srcValue = src[key];
+        const dstValue = dst.hasOwnProperty(key) ? dst[key] : EMPTY;
+        if (dstValue !== srcValue) {
+          if (typeof srcValue === "object" && srcValue !== null) {
+            if (typeof dstValue === "object" && dstValue !== null && srcValue.constructor === dstValue.constructor && !(OPAQUE in srcValue)) {
+              changed = copyRecursive(dstValue, srcValue, flags) || changed;
+              continue;
+            }
+            srcValue = cloneRecursive(srcValue, flags & COPY_SUBSCRIBE);
           }
+          dst[key] = srcValue;
+          if (flags & COPY_EMIT)
+            emit(dst, key, srcValue, dstValue);
           changed = true;
         }
       }
-    }
-  } else {
-    throw new Error(`Incompatible or non-object types: ${src?.constructor?.name || typeof src} vs ${dst?.constructor?.name || typeof dst}`);
-  }
-  return changed;
-}
-var MERGE = 1;
-var COPY_SUBSCRIBE = 32;
-var COPY_EMIT = 64;
-var OPAQUE = Symbol("OPAQUE");
-var NO_COPY = OPAQUE;
-Promise.prototype[OPAQUE] = true;
-var cssVars = optProxy({});
-function setSpacingCssVars(base = 1, unit = "rem") {
-  for (let i = 0;i <= 12; i++) {
-    cssVars[i] = 2 ** (i - 3) * base + unit;
+      if (!(flags & MERGE)) {
+        for (const k of Object.keys(dst)) {
+          if (!src.hasOwnProperty(k)) {
+            const old = dst[k];
+            delete dst[k];
+            if (flags & COPY_EMIT && old !== undefined) {
+              emit(dst, k, EMPTY, old);
+            }
+            changed = true;
+          }
+        }
+      }
+    } else {
+      throw new Error(`Incompatible or non-object types: ${src?.constructor?.name || typeof src} vs ${dst?.constructor?.name || typeof dst}`);
+    }
+    return changed;
+  }
+  const MERGE = 1;
+  const COPY_SUBSCRIBE = 32;
+  const COPY_EMIT = 64;
+  const OPAQUE = Symbol("OPAQUE");
+  const NO_COPY = OPAQUE;
+  Promise.prototype[OPAQUE] = true;
+  if (Node)
+    Node.prototype[OPAQUE] = true;
+  const cssVars = optProxy({});
+  function setSpacingCssVars(base = 1, unit = "rem") {
+    for (let i = 0;i <= 12; i++) {
+      cssVars[i] = 2 ** (i - 3) * base + unit;
+    }
+  }
+  const CSS_VAR_PATTERN = /(\burl\([^)]*\))|("[^"]*")|(^| )\$([\w-]+)/g;
+  const DIGIT_FIRST = /^\d/;
+  function cssVarRef(value) {
+    if (value.indexOf("$") < 0)
+      return value;
+    return value.replace(CSS_VAR_PATTERN, (match, parens, quoted, prefix, name) => {
+      if (parens || quoted)
+        return match;
+      const varName = DIGIT_FIRST.test(name) ? `m${name}` : name;
+      return `${prefix}var(--${varName})`;
+    });
   }
-}
-var CSS_VAR_PATTERN = /(\burl\([^)]*\))|("[^"]*")|(^| )\$([\w-]+)/g;
-var DIGIT_FIRST = /^\d/;
-function cssVarRef(value) {
-  if (value.indexOf("$") < 0)
-    return value;
-  return value.replace(CSS_VAR_PATTERN, (match, parens, quoted, prefix, name) => {
-    if (parens || quoted)
-      return match;
-    const varName = DIGIT_FIRST.test(name) ? `m${name}` : name;
-    return `${prefix}var(--${varName})`;
-  });
-}
-var darkModeState;
-function darkMode() {
-  if (!darkModeState) {
-    if (typeof window === "undefined" || !window.matchMedia)
+  let darkModeState;
+  function darkMode() {
+    if (!darkModeState) {
+      if (!window || !window.matchMedia)
+        return false;
+      const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+      darkModeState = proxy({ value: mediaQuery.matches });
+      mediaQuery.addEventListener("change", () => darkModeState.value = mediaQuery.matches);
+    }
+    return darkModeState.value;
+  }
+  function cloneRecursive(src, flags) {
+    if (OPAQUE in src)
+      return src;
+    if (flags & COPY_SUBSCRIBE)
+      subscribe(src, ANY_SYMBOL);
+    if (src instanceof Array) {
+      return src.map((v) => cloneValue(v, flags));
+    }
+    if (src instanceof Map) {
+      const dst2 = new Map;
+      for (const [k, v] of src)
+        dst2.set(k, cloneValue(v, flags));
+      return dst2;
+    }
+    const dst = Object.create(Object.getPrototypeOf(src));
+    for (const k of Object.keys(src))
+      dst[k] = cloneValue(src[k], flags);
+    return dst;
+  }
+  function cloneValue(v, flags) {
+    return typeof v === "object" && v !== null ? cloneRecursive(v, flags) : v;
+  }
+  function clone(src) {
+    if (typeof src !== "object" || src === null)
+      return src;
+    let flags = 0;
+    const unproxied = src[TARGET_SYMBOL];
+    if (unproxied) {
+      src = unproxied;
+      if (currentScope !== ROOT_SCOPE && !peeking)
+        flags = COPY_SUBSCRIBE;
+    }
+    return cloneRecursive(src, flags);
+  }
+  const refHandler = {
+    get(target, prop) {
+      if (prop === TARGET_SYMBOL) {
+        return ref(unproxy(target.proxy), target.index);
+      }
+      if (prop === "value") {
+        return target.proxy[target.index];
+      }
+    },
+    set(target, prop, value) {
+      if (prop === "value") {
+        target.proxy[target.index] = value;
+        return true;
+      }
       return false;
-    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
-    darkModeState = proxy({ value: mediaQuery.matches });
-    mediaQuery.addEventListener("change", () => darkModeState.value = mediaQuery.matches);
-  }
-  return darkModeState.value;
-}
-function cloneRecursive(src, flags) {
-  if (OPAQUE in src)
-    return src;
-  if (flags & COPY_SUBSCRIBE)
-    subscribe(src, ANY_SYMBOL);
-  if (src instanceof Array) {
-    return src.map((v) => cloneValue(v, flags));
-  }
-  if (src instanceof Map) {
-    const dst2 = new Map;
-    for (const [k, v] of src)
-      dst2.set(k, cloneValue(v, flags));
-    return dst2;
-  }
-  const dst = Object.create(Object.getPrototypeOf(src));
-  for (const k of Object.keys(src))
-    dst[k] = cloneValue(src[k], flags);
-  return dst;
-}
-function cloneValue(v, flags) {
-  return typeof v === "object" && v !== null ? cloneRecursive(v, flags) : v;
-}
-function clone(src) {
-  if (typeof src !== "object" || src === null)
-    return src;
-  let flags = 0;
-  const unproxied = src[TARGET_SYMBOL];
-  if (unproxied) {
-    src = unproxied;
-    if (currentScope !== ROOT_SCOPE && !peeking)
-      flags = COPY_SUBSCRIBE;
-  }
-  return cloneRecursive(src, flags);
-}
-var refHandler = {
-  get(target, prop) {
-    if (prop === TARGET_SYMBOL) {
-      return ref(unproxy(target.proxy), target.index);
-    }
-    if (prop === "value") {
-      return target.proxy[target.index];
-    }
-  },
-  set(target, prop, value) {
-    if (prop === "value") {
-      target.proxy[target.index] = value;
-      return true;
     }
-    return false;
-  }
-};
-function ref(target, index) {
-  return new Proxy({ proxy: target, index }, refHandler);
-}
-function applyBind(el, target) {
-  let onProxyChange;
-  let onInputChange;
-  const type = el.getAttribute("type");
-  const value = unproxy(target).value;
-  if (type === "checkbox") {
-    if (value === undefined)
-      target.value = el.checked;
-    onProxyChange = () => {
-      el.checked = target.value;
-    };
-    onInputChange = () => {
-      target.value = el.checked;
-    };
-  } else if (type === "radio") {
-    if (value === undefined && el.checked)
-      target.value = el.value;
-    onProxyChange = () => {
-      el.checked = target.value === el.value;
-    };
-    onInputChange = () => {
-      if (el.checked)
+  };
+  function ref(target, index) {
+    return new Proxy({ proxy: target, index }, refHandler);
+  }
+  function applyBind(el, target) {
+    let onProxyChange;
+    let onInputChange;
+    const type = el.getAttribute("type");
+    const value = unproxy(target).value;
+    if (type === "checkbox") {
+      if (value === undefined)
+        target.value = el.checked;
+      onProxyChange = () => {
+        el.checked = target.value;
+      };
+      onInputChange = () => {
+        target.value = el.checked;
+      };
+    } else if (type === "radio") {
+      if (value === undefined && el.checked)
         target.value = el.value;
-    };
-  } else {
-    onInputChange = () => {
-      target.value = type === "number" || type === "range" ? el.value === "" ? null : +el.value : el.value;
-    };
-    if (value === undefined)
-      onInputChange();
-    onProxyChange = () => {
-      el.value = target.value;
-      if (el.tagName === "SELECT" && el.value != target.value) {
-        new DelayedOneTimeRunner(() => el.value = target.value);
-      }
-    };
-  }
-  derive(onProxyChange);
-  el.addEventListener("input", onInputChange);
-  clean(() => {
-    el.removeEventListener("input", onInputChange);
-  });
-}
-var RICH_PATTERN = /\*\*(.+?)\*\*|\*(.+?)\*|`(.+?)`|\[(.+?)\]\((.+?)\)/g;
-var SPECIAL_PROPS = {
-  create: (el, value) => {
-    if (currentScope !== topRedrawScope)
-      return;
-    if (typeof value === "function") {
-      value(el);
-    } else {
-      const classes = value.split(".").filter((c) => c);
-      el.classList.add(...classes);
-      (async () => {
-        el.offsetHeight;
-        el.classList.remove(...classes);
-      })();
-    }
-  },
-  destroy: (el, value) => {
-    onDestroyMap.set(el, value);
-  },
-  html: (el, value) => {
-    if (el === currentScope.el && !el.firstChild) {
-      el.innerHTML = `${value}`;
+      onProxyChange = () => {
+        el.checked = target.value === el.value;
+      };
+      onInputChange = () => {
+        if (el.checked)
+          target.value = el.value;
+      };
     } else {
-      const tmpParent = document.createElement(currentScope.el.tagName);
-      tmpParent.innerHTML = `${value}`;
-      while (tmpParent.firstChild)
-        addNode(el, tmpParent.firstChild);
-    }
-  },
-  text: (el, value) => {
-    addNode(el, document.createTextNode(value));
-  },
-  rich: (el, value) => {
-    let lastIndex = 0;
-    let match;
-    const str = String(value);
-    RICH_PATTERN.lastIndex = 0;
-    while ((match = RICH_PATTERN.exec(str)) !== null) {
-      if (match.index > lastIndex) {
-        addNode(el, document.createTextNode(str.slice(lastIndex, match.index)));
-      }
-      let node;
-      if (match[1] !== undefined) {
-        node = document.createElement("strong");
-        node.textContent = match[1];
-      } else if (match[2] !== undefined) {
-        node = document.createElement("em");
-        node.textContent = match[2];
-      } else if (match[3] !== undefined) {
-        node = document.createElement("code");
-        node.textContent = match[3];
-      } else {
-        const a = document.createElement("a");
-        a.textContent = match[4];
-        a.href = match[5];
-        node = a;
-      }
-      addNode(el, node);
-      lastIndex = RICH_PATTERN.lastIndex;
-    }
-    if (lastIndex < str.length) {
-      addNode(el, document.createTextNode(str.slice(lastIndex)));
+      onInputChange = () => {
+        target.value = type === "number" || type === "range" ? el.value === "" ? null : +el.value : el.value;
+      };
+      if (value === undefined)
+        onInputChange();
+      onProxyChange = () => {
+        el.value = target.value;
+        if (el.tagName === "SELECT" && el.value != target.value) {
+          new DelayedOneTimeRunner(() => el.value = target.value);
+        }
+      };
     }
+    derive(onProxyChange);
+    el.addEventListener("input", onInputChange);
+    clean(() => {
+      el.removeEventListener("input", onInputChange);
+    });
   }
-};
-function disableCreateDestroy() {
-  SPECIAL_PROPS.create = SPECIAL_PROPS.destroy = () => {};
-}
-function A(...args) {
-  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 === ":") {
-          const key = "$" + arg.substring(pos, nextPos);
-          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).trim();
-            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 (next === "=") {
-          const key = arg.substring(pos, nextPos);
-          if (nextPos + 1 >= argLen) {
-            applyArg(el, key, args[++argIndex]);
-            break;
-          }
-          const afterEquals = arg[nextPos + 1];
-          if (afterEquals === '"' || afterEquals === "'" || afterEquals === "`") {
-            const endIndex = findFirst(arg, afterEquals, 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;
-          }
+  const RICH_PATTERN = /\*\*(.+?)\*\*|\*(.+?)\*|`(.+?)`|\[(.+?)\]\((.+?)\)/g;
+  const SPECIAL_PROPS = {
+    create: (el, value) => {
+      if (currentScope !== topRedrawScope)
+        return;
+      if (typeof value === "function") {
+        value(el);
+      } else {
+        const classes = value.split(".").filter((c) => c);
+        el.classList.add(...classes);
+        (async () => {
+          el.offsetHeight;
+          el.classList.remove(...classes);
+        })();
+      }
+    },
+    destroy: (el, value) => {
+      onDestroyMap.set(el, value);
+    },
+    html: (el, value) => {
+      if (el === currentScope.el && !el.firstChild) {
+        el.innerHTML = `${value}`;
+      } else {
+        const tmpParent = document.createElement(currentScope.el.tagName);
+        tmpParent.innerHTML = `${value}`;
+        while (tmpParent.firstChild)
+          addNode(el, tmpParent.firstChild);
+      }
+    },
+    text: (el, value) => {
+      addNode(el, document.createTextNode(value));
+    },
+    rich: (el, value) => {
+      let lastIndex = 0;
+      let match;
+      const str = String(value);
+      RICH_PATTERN.lastIndex = 0;
+      while ((match = RICH_PATTERN.exec(str)) !== null) {
+        if (match.index > lastIndex) {
+          addNode(el, document.createTextNode(str.slice(lastIndex, match.index)));
+        }
+        let node;
+        if (match[1] !== undefined) {
+          node = document.createElement("strong");
+          node.textContent = match[1];
+        } else if (match[2] !== undefined) {
+          node = document.createElement("em");
+          node.textContent = match[2];
+        } else if (match[3] !== undefined) {
+          node = document.createElement("code");
+          node.textContent = match[3];
         } 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;
+          const a = document.createElement("a");
+          a.textContent = match[4];
+          a.href = match[5];
+          node = a;
+        }
+        addNode(el, node);
+        lastIndex = RICH_PATTERN.lastIndex;
+      }
+      if (lastIndex < str.length) {
+        addNode(el, document.createTextNode(str.slice(lastIndex)));
+      }
+    }
+  };
+  function A(...args) {
+    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 === ":") {
+            const key = "$" + arg.substring(pos, nextPos);
+            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).trim();
+              applyArg(el, key, value);
+              nextPos = endIndex;
             } else {
-              let className = arg.substring(nextPos + 1, classEnd);
-              const cls = className || args[++argIndex];
-              if (!el.classList.contains(cls)) {
-                if (el === currentScope.el)
-                  recordSideEffect(currentScope, 0 /* Class */, cls, false);
-                el.classList.add(cls);
+              const endIndex = findFirst(arg, " ", nextPos + 1);
+              const value = arg.substring(nextPos + 1, endIndex);
+              applyArg(el, key, value);
+              nextPos = endIndex;
+            }
+          } else if (next === "=") {
+            const key = arg.substring(pos, nextPos);
+            if (nextPos + 1 >= argLen) {
+              applyArg(el, key, args[++argIndex]);
+              break;
+            }
+            const afterEquals = arg[nextPos + 1];
+            if (afterEquals === '"' || afterEquals === "'" || afterEquals === "`") {
+              const endIndex = findFirst(arg, afterEquals, 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 (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);
+                const cls = className || args[++argIndex];
+                if (!el.classList.contains(cls)) {
+                  if (el === currentScope.el)
+                    recordSideEffect(currentScope, 0 /* Class */, cls, false);
+                  el.classList.add(cls);
+                }
+                nextPos = classEnd - 1;
               }
-              nextPos = classEnd - 1;
             }
           }
         }
-      }
-    } else if (typeof arg === "object") {
-      if (arg.constructor !== Object) {
-        if (arg instanceof Node) {
-          addNode(el, arg);
-          if (arg instanceof Element) {
-            el = arg;
-            svg = arg.namespaceURI === "http://www.w3.org/2000/svg";
+      } else if (typeof arg === "object") {
+        if (arg.constructor !== Object) {
+          if (arg instanceof Node) {
+            addNode(el, arg);
+            if (arg instanceof Element) {
+              el = arg;
+              svg = arg.namespaceURI === "http://www.w3.org/2000/svg";
+            }
+          } else {
+            throw new Error(`Unexpected argument: ${arg}`);
           }
         } else {
-          throw new Error(`Unexpected argument: ${arg}`);
+          for (const key of Object.keys(arg)) {
+            applyArg(el, key, arg[key]);
+          }
         }
+      } else if (typeof arg === "function") {
+        new RegularScope(el, svg, arg);
       } else {
-        for (const key of Object.keys(arg)) {
-          applyArg(el, key, arg[key]);
-        }
+        throw new Error(`Unexpected argument: ${arg}`);
       }
-    } else if (typeof arg === "function") {
-      new RegularScope(el, svg, arg);
-    } else {
-      throw new Error(`Unexpected argument: ${arg}`);
     }
-  }
-  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) {
-  const prefix = `.AbdStl${++cssCount}`;
-  const css = typeof style === "string" ? styleStringToCss(style, prefix) : objectToCss(style, prefix);
-  if (css) {
-    let cnt = cssSnippetCount++;
-    cssSnippets[cnt] = css;
-    clean(() => delete cssSnippets[cnt]);
-  }
-  return prefix;
-}
-var cssSnippets = proxy({});
-var cssSnippetCount = 0;
-function combinePrefixSelector(prefix, key) {
-  const sel = [];
-  for (const p of prefix.split(",")) {
-    for (const k of key.split(",")) {
-      sel.push(k.includes("&") ? k.trim().replace(/&/g, p) : `${p} ${k.trim()}`.trim());
+    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;
+  }
+  let cssCount = 0;
+  function insertCss(style) {
+    const prefix = `.AbdStl${++cssCount}`;
+    const css = typeof style === "string" ? styleStringToCss(style, prefix) : objectToCss(style, prefix);
+    if (css) {
+      let cnt = cssSnippetCount++;
+      cssSnippets[cnt] = css;
+      clean(() => delete cssSnippets[cnt]);
+    }
+    return prefix;
+  }
+  let cssSnippets = proxy({});
+  let cssSnippetCount = 0;
+  function combinePrefixSelector(prefix, key) {
+    const sel = [];
+    for (const p of prefix.split(",")) {
+      for (const k of key.split(",")) {
+        sel.push(k.includes("&") ? k.trim().replace(/&/g, p) : `${p} ${k.trim()}`.trim());
+      }
     }
+    return sel.join(",");
   }
-  return sel.join(",");
-}
-function objectToCss(style, prefix) {
-  let css = "";
-  for (const [key, val] of Object.entries(style)) {
-    if (val && typeof val === "object") {
-      if (key.startsWith("@")) {
-        css += `${key}{
+  function objectToCss(style, prefix) {
+    let css = "";
+    for (const [key, val] of Object.entries(style)) {
+      if (val && typeof val === "object") {
+        if (key.startsWith("@")) {
+          css += `${key}{
 ${objectToCss(val, prefix)}}
 `;
-      } else {
-        css += objectToCss(val, combinePrefixSelector(prefix, key));
-      }
-    } else if (typeof val === "string") {
-      if (key.startsWith("@")) {
-        css += `${key}{
+        } else {
+          css += objectToCss(val, combinePrefixSelector(prefix, key));
+        }
+      } else if (typeof val === "string") {
+        if (key.startsWith("@")) {
+          css += `${key}{
 ${styleStringToCss(val, prefix)}}
 `;
-      } else {
-        css += styleStringToCss(val, combinePrefixSelector(prefix, key));
+        } else {
+          css += styleStringToCss(val, combinePrefixSelector(prefix, key));
+        }
       }
     }
+    return css;
   }
-  return css;
-}
-var KEBAB_SEGMENT = /-([a-z])/g;
-function toCamel(p) {
-  return p.replace(KEBAB_SEGMENT, (_, l) => l.toUpperCase());
-}
-var VALID_CSS_KEY = /^[a-zA-Z-]+$/;
-function styleStringToCss(styleStr, selector) {
-  let props = "";
-  for (let pos = 0, len = styleStr.length;pos < len; ) {
-    while (styleStr[pos] === " ")
-      pos++;
-    if (pos >= len)
-      break;
-    const colon = styleStr.indexOf(":", pos);
-    if (colon === -1)
-      throw new Error(`Trailing data in style string: "${styleStr.substring(pos)}"`);
-    const key = styleStr.substring(pos, colon);
-    if (!VALID_CSS_KEY.test(key))
-      throw new Error(`Invalid CSS key: "${key}" in style string: "${styleStr}"`);
-    pos = colon + 1;
-    let val;
-    if (styleStr[pos] === " ") {
-      pos++;
-      const semi = styleStr.indexOf(";", pos);
-      val = styleStr.substring(pos, semi === -1 ? len : semi).trim();
-      pos = semi === -1 ? len : semi + 1;
-    } else {
-      const space = styleStr.indexOf(" ", pos);
-      val = styleStr.substring(pos, space === -1 ? len : space);
-      pos = space === -1 ? len : space;
-    }
-    const v = cssVarRef(val);
-    const exp = CSS_SHORT[key] || key;
-    props += typeof exp === "string" ? `${exp}:${v};` : exp.map((p) => `${p}:${v};`).join("");
+  const KEBAB_SEGMENT = /-([a-z])/g;
+  function toCamel(p) {
+    return p.replace(KEBAB_SEGMENT, (_, l) => l.toUpperCase());
   }
-  return props ? `${selector}{${props}}
+  const VALID_CSS_KEY = /^[a-zA-Z-]+$/;
+  function styleStringToCss(styleStr, selector) {
+    let props = "";
+    for (let pos = 0, len = styleStr.length;pos < len; ) {
+      while (styleStr[pos] === " ")
+        pos++;
+      if (pos >= len)
+        break;
+      const colon = styleStr.indexOf(":", pos);
+      if (colon === -1)
+        throw new Error(`Trailing data in style string: "${styleStr.substring(pos)}"`);
+      const key = styleStr.substring(pos, colon);
+      if (!VALID_CSS_KEY.test(key))
+        throw new Error(`Invalid CSS key: "${key}" in style string: "${styleStr}"`);
+      pos = colon + 1;
+      let val;
+      if (styleStr[pos] === " ") {
+        pos++;
+        const semi = styleStr.indexOf(";", pos);
+        val = styleStr.substring(pos, semi === -1 ? len : semi).trim();
+        pos = semi === -1 ? len : semi + 1;
+      } else {
+        const space = styleStr.indexOf(" ", pos);
+        val = styleStr.substring(pos, space === -1 ? len : space);
+        pos = space === -1 ? len : space;
+      }
+      const v = cssVarRef(val);
+      const exp = CSS_SHORT[key] || key;
+      props += typeof exp === "string" ? `${exp}:${v};` : exp.map((p) => `${p}:${v};`).join("");
+    }
+    return props ? `${selector}{${props}}
 ` : "";
-}
-function insertGlobalCss(style) {
-  const css = objectToCss(style, "");
-  if (css) {
-    let cnt = cssSnippetCount++;
-    cssSnippets[cnt] = css;
-    clean(() => delete cssSnippets[cnt]);
   }
-}
-var CSS_SHORT = {
-  m: "margin",
-  mt: "margin-top",
-  mb: "margin-bottom",
-  ml: "margin-left",
-  mr: "margin-right",
-  mh: ["margin-left", "margin-right"],
-  mv: ["margin-top", "margin-bottom"],
-  p: "padding",
-  pt: "padding-top",
-  pb: "padding-bottom",
-  pl: "padding-left",
-  pr: "padding-right",
-  ph: ["padding-left", "padding-right"],
-  pv: ["padding-top", "padding-bottom"],
-  w: "width",
-  h: "height",
-  bg: "background",
-  fg: "color",
-  r: "border-radius"
-};
-function applyArg(el, key, value) {
-  if (typeof value === "object" && value !== null && value[TARGET_SYMBOL]) {
-    if (key === "bind") {
-      applyBind(el, value);
+  function insertGlobalCss(style) {
+    const css = objectToCss(style, "");
+    if (css) {
+      let cnt = cssSnippetCount++;
+      cssSnippets[cnt] = css;
+      clean(() => delete cssSnippets[cnt]);
+    }
+  }
+  const CSS_SHORT = {
+    m: "margin",
+    mt: "margin-top",
+    mb: "margin-bottom",
+    ml: "margin-left",
+    mr: "margin-right",
+    mh: ["margin-left", "margin-right"],
+    mv: ["margin-top", "margin-bottom"],
+    p: "padding",
+    pt: "padding-top",
+    pb: "padding-bottom",
+    pl: "padding-left",
+    pr: "padding-right",
+    ph: ["padding-left", "padding-right"],
+    pv: ["padding-top", "padding-bottom"],
+    w: "width",
+    h: "height",
+    bg: "background",
+    fg: "color",
+    r: "border-radius"
+  };
+  function applyArg(el, key, value) {
+    if (typeof value === "object" && value !== null && value[TARGET_SYMBOL]) {
+      if (key === "bind") {
+        applyBind(el, value);
+      } else {
+        new SetArgScope(el, key, value);
+      }
+    } else if (key[0] === ".") {
+      const classes = key.substring(1).split(".");
+      const list = el.classList;
+      const desired = !!value;
+      if (el === currentScope.el) {
+        for (const cls of classes) {
+          const had = list.contains(cls);
+          if (had !== desired)
+            recordSideEffect(currentScope, 0 /* Class */, cls, had);
+        }
+      }
+      if (desired)
+        list.add(...classes);
+      else
+        list.remove(...classes);
+    } else if (key[0] === "$") {
+      key = key.substring(1);
+      const val = value == null || value === false ? "" : typeof value === "string" ? cssVarRef(value) : String(value);
+      const expanded = CSS_SHORT[key] || key;
+      const style = el.style;
+      const setOwn = el === currentScope.el;
+      const props = typeof expanded === "string" ? [expanded] : expanded;
+      for (const prop of props) {
+        const cm = toCamel(prop);
+        if (setOwn)
+          recordSideEffect(currentScope, 1 /* Style */, cm, style[cm]);
+        style[cm] = val;
+      }
+    } else if (value == null) {} else if (key in SPECIAL_PROPS) {
+      SPECIAL_PROPS[key](el, value);
+    } else if (typeof value === "function") {
+      el.addEventListener(key, value);
+      if (el === currentScope.el)
+        recordSideEffect(currentScope, 4 /* Event */, key, value);
+    } else if (value === true || value === false || key === "value" || key === "selectedIndex") {
+      if (el === currentScope.el)
+        recordSideEffect(currentScope, 2 /* Prop */, key, el[key]);
+      el[key] = value;
     } else {
-      new SetArgScope(el, key, value);
+      if (el === currentScope.el)
+        recordSideEffect(currentScope, 3 /* Attr */, key, el.getAttribute(key));
+      el.setAttribute(key, value);
     }
-  } else if (key[0] === ".") {
-    const classes = key.substring(1).split(".");
-    const list = el.classList;
-    const desired = !!value;
-    if (el === currentScope.el) {
-      for (const cls of classes) {
-        const had = list.contains(cls);
-        if (had !== desired)
-          recordSideEffect(currentScope, 0 /* Class */, cls, had);
+  }
+  function defaultOnError(error) {
+    console.error("Error while in Aberdeen render:", error);
+    return true;
+  }
+  let onError = defaultOnError;
+  function setErrorHandler(handler) {
+    onError = handler || defaultOnError;
+  }
+  function clean(cleaner) {
+    currentScope.cleaners.push(cleaner);
+  }
+  function derive(func) {
+    return new ResultScope(func).result;
+  }
+  function mount(parentElement, func) {
+    new MountScope(parentElement, func);
+  }
+  function unmountAll() {
+    ROOT_SCOPE.remove();
+    cssCount = 0;
+  }
+  function peek(target, key) {
+    peeking++;
+    try {
+      if (arguments.length === 1) {
+        return target();
+      } else {
+        return target instanceof Map ? target.get(key) : target[key];
       }
+    } finally {
+      peeking--;
     }
-    if (desired)
-      list.add(...classes);
-    else
-      list.remove(...classes);
-  } else if (key[0] === "$") {
-    key = key.substring(1);
-    const val = value == null || value === false ? "" : typeof value === "string" ? cssVarRef(value) : String(value);
-    const expanded = CSS_SHORT[key] || key;
-    const style = el.style;
-    const setOwn = el === currentScope.el;
-    const props = typeof expanded === "string" ? [expanded] : expanded;
-    for (const prop of props) {
-      const cm = toCamel(prop);
-      if (setOwn)
-        recordSideEffect(currentScope, 1 /* Style */, cm, style[cm]);
-      style[cm] = val;
-    }
-  } else if (value == null) {} else if (key in SPECIAL_PROPS) {
-    SPECIAL_PROPS[key](el, value);
-  } else if (typeof value === "function") {
-    el.addEventListener(key, value);
-    if (el === currentScope.el)
-      recordSideEffect(currentScope, 4 /* Event */, key, value);
-  } else if (value === true || value === false || key === "value" || key === "selectedIndex") {
-    if (el === currentScope.el)
-      recordSideEffect(currentScope, 2 /* Prop */, key, el[key]);
-    el[key] = value;
-  } else {
-    if (el === currentScope.el)
-      recordSideEffect(currentScope, 3 /* Attr */, key, el.getAttribute(key));
-    el.setAttribute(key, value);
   }
-}
-function defaultOnError(error) {
-  console.error("Error while in Aberdeen render:", error);
-  return true;
-}
-var onError = defaultOnError;
-function setErrorHandler(handler) {
-  onError = handler || defaultOnError;
-}
-function clean(cleaner) {
-  currentScope.cleaners.push(cleaner);
-}
-function derive(func) {
-  return new ResultScope(func).result;
-}
-function mount(parentElement, func) {
-  new MountScope(parentElement, func);
-}
-function unmountAll() {
-  ROOT_SCOPE.remove();
-  cssCount = 0;
-}
-function peek(target, key) {
-  peeking++;
-  try {
-    if (arguments.length === 1) {
-      return target();
+  function map(source, func) {
+    let out;
+    if (source instanceof Array) {
+      out = optProxy([]);
+    } else if (source instanceof Map) {
+      out = optProxy(new Map);
     } else {
-      return target instanceof Map ? target.get(key) : target[key];
-    }
-  } finally {
-    peeking--;
+      out = optProxy({});
+    }
+    onEach(source, (item, key) => {
+      const value = func(item, key);
+      if (value !== undefined) {
+        if (out instanceof Map) {
+          out.set(key, value);
+          clean(() => {
+            out.delete(key);
+          });
+        } else {
+          out[key] = value;
+          clean(() => {
+            delete out[key];
+          });
+        }
+      }
+    });
+    return out;
   }
-}
-function map(source, func) {
-  let out;
-  if (source instanceof Array) {
-    out = optProxy([]);
-  } else if (source instanceof Map) {
-    out = optProxy(new Map);
-  } else {
-    out = optProxy({});
-  }
-  onEach(source, (item, key) => {
-    const value = func(item, key);
-    if (value !== undefined) {
-      if (out instanceof Map) {
-        out.set(key, value);
-        clean(() => {
-          out.delete(key);
-        });
-      } else {
-        out[key] = value;
+  function multiMap(source, func) {
+    const out = optProxy({});
+    onEach(source, (item, key) => {
+      const pairs = func(item, key);
+      if (pairs) {
+        for (const key2 of Object.keys(pairs))
+          out[key2] = pairs[key2];
         clean(() => {
-          delete out[key];
+          for (const key2 of Object.keys(pairs))
+            delete out[key2];
         });
       }
-    }
-  });
-  return out;
-}
-function multiMap(source, func) {
-  const out = optProxy({});
-  onEach(source, (item, key) => {
-    const pairs = func(item, key);
-    if (pairs) {
-      for (const key2 of Object.keys(pairs))
-        out[key2] = pairs[key2];
-      clean(() => {
-        for (const key2 of Object.keys(pairs))
-          delete out[key2];
-      });
-    }
-  });
-  return out;
-}
-function partition(source, func) {
-  const unproxiedOut = {};
-  const out = optProxy(unproxiedOut);
-  onEach(source, (item, key) => {
-    const rsp = func(item, key);
-    if (rsp != null) {
-      const buckets = rsp instanceof Array ? rsp : [rsp];
-      if (buckets.length) {
-        for (const bucket of buckets) {
-          if (unproxiedOut[bucket])
-            out[bucket][key] = item;
-          else
-            out[bucket] = { [key]: item };
-        }
-        clean(() => {
+    });
+    return out;
+  }
+  function partition(source, func) {
+    const unproxiedOut = {};
+    const out = optProxy(unproxiedOut);
+    onEach(source, (item, key) => {
+      const rsp = func(item, key);
+      if (rsp != null) {
+        const buckets = rsp instanceof Array ? rsp : [rsp];
+        if (buckets.length) {
           for (const bucket of buckets) {
-            delete out[bucket][key];
-            if (isObjEmpty(unproxiedOut[bucket]))
-              delete out[bucket];
+            if (unproxiedOut[bucket])
+              out[bucket][key] = item;
+            else
+              out[bucket] = { [key]: item };
           }
-        });
+          clean(() => {
+            for (const bucket of buckets) {
+              delete out[bucket][key];
+              if (isObjEmpty(unproxiedOut[bucket]))
+                delete out[bucket];
+            }
+          });
+        }
       }
-    }
-  });
-  return out;
-}
-function dump(data) {
-  const org = dumpSeen;
-  dumpSeen ||= new Set;
-  try {
-    rawDump(data, dumpSeen);
-  } finally {
-    dumpSeen = org;
-  }
-  return data;
-}
-var dumpSeen;
-function rawDump(data, seen) {
-  if (data && typeof data === "object") {
-    const name = data.constructor.name || "unknown object";
-    if (seen.has(data)) {
-      A(`#<${name}: circular reference>`);
-      return;
-    }
-    seen.add(data);
-    clean(() => seen.delete(data));
-    const customDump = data[CUSTOM_DUMP];
-    if (customDump !== undefined) {
-      if (typeof customDump === "function")
-        customDump.call(data);
-      else
-        A(`#${customDump}`);
-    } else {
-      A(`#<${name}>`, "ul", () => {
-        onEach(data, (value, key) => {
-          A("li", () => {
-            if (!(data instanceof Array))
-              A(`#${JSON.stringify(key)}: `);
-            rawDump(value, seen);
+    });
+    return out;
+  }
+  function dump(data) {
+    const org = dumpSeen;
+    dumpSeen ||= new Set;
+    try {
+      rawDump(data, dumpSeen);
+    } finally {
+      dumpSeen = org;
+    }
+    return data;
+  }
+  let dumpSeen;
+  function rawDump(data, seen) {
+    if (data && typeof data === "object") {
+      const name = data.constructor.name || "unknown object";
+      if (seen.has(data)) {
+        A(`#<${name}: circular reference>`);
+        return;
+      }
+      seen.add(data);
+      clean(() => seen.delete(data));
+      const customDump = data[CUSTOM_DUMP];
+      if (customDump !== undefined) {
+        if (typeof customDump === "function")
+          customDump.call(data);
+        else
+          A(`#${customDump}`);
+      } else {
+        A(`#<${name}>`, "ul", () => {
+          onEach(data, (value, key) => {
+            A("li", () => {
+              if (!(data instanceof Array))
+                A(`#${JSON.stringify(key)}: `);
+              rawDump(value, seen);
+            });
           });
         });
-      });
+      }
+    } else if (data === undefined) {
+      A("#undefined");
+    } else {
+      A("#" + JSON.stringify(data));
     }
-  } else if (data === undefined) {
-    A("#undefined");
-  } else {
-    A("#" + JSON.stringify(data));
   }
-}
-var CUSTOM_DUMP = Symbol("CUSTOM_DUMP");
-Date.prototype[CUSTOM_DUMP] = function() {
-  A("#<Date> " + this.toISOString());
-};
-function internalError(code) {
-  throw new Error(`Aberdeen internal error ${code}`);
-}
-function handleError(e, showMessage) {
-  try {
-    if (onError(e) === false)
-      showMessage = false;
-  } catch (e2) {
-    console.error(e2);
-  }
-  try {
-    if (showMessage)
-      A("div.aberdeen-error#Error");
-  } catch {}
-}
-function withEmitHandler(handler, func) {
-  const oldEmitHandler = emit;
-  emit = handler;
-  try {
-    func();
-  } finally {
-    emit = oldEmitHandler;
+  const CUSTOM_DUMP = Symbol("CUSTOM_DUMP");
+  Date.prototype[CUSTOM_DUMP] = function() {
+    A("#<Date> " + this.toISOString());
+  };
+  function internalError(code) {
+    throw new Error(`Aberdeen internal error ${code}`);
   }
-}
-if (typeof document !== "undefined") {
-  leakScope(() => {
-    A(() => {
-      if (isEmpty(cssSnippets) && isEmpty(cssVars))
-        return;
-      mount(document.head, () => {
-        A("style.abd", () => {
-          onEach(cssSnippets, (value) => {
-            A("#", value);
-          });
-          A(() => {
-            if (isEmpty(cssVars))
-              return;
-            let css = ":root{";
-            for (const [key, value] of Object.entries(cssVars)) {
-              const varName = DIGIT_FIRST.test(String(key)) ? `m${key}` : key;
-              css += `--${varName}:${value};`;
-            }
-            css += `}
+  function handleError(e, showMessage) {
+    try {
+      if (onError(e) === false)
+        showMessage = false;
+    } catch (e2) {
+      console.error(e2);
+    }
+    try {
+      if (showMessage)
+        A("div.aberdeen-error#Error");
+    } catch {}
+  }
+  function withEmitHandler(handler, func) {
+    const oldEmitHandler = emit;
+    emit = handler;
+    try {
+      func();
+    } finally {
+      emit = oldEmitHandler;
+    }
+  }
+  function buildCssVars() {
+    if (isEmpty(cssVars))
+      return "";
+    let css = ":root{";
+    for (const [key, value] of Object.entries(cssVars)) {
+      const varName = DIGIT_FIRST.test(String(key)) ? `m${key}` : key;
+      css += `--${varName}:${value};`;
+    }
+    return css + `}
 `;
-            A("#", css);
+  }
+  if (document) {
+    leakScope(() => {
+      A(() => {
+        if (isEmpty(cssSnippets) && isEmpty(cssVars))
+          return;
+        mount(document.head, () => {
+          A("style.abd", () => {
+            onEach(cssSnippets, (value) => {
+              A("#", value);
+            });
+            A(() => {
+              let css = buildCssVars();
+              if (css)
+                A("#", css);
+            });
           });
         });
       });
     });
+  }
+  if (options.transitions === false)
+    SPECIAL_PROPS.create = SPECIAL_PROPS.destroy = () => {};
+  return Object.assign(A, {
+    clean,
+    clone,
+    copy,
+    count,
+    cssVars,
+    CUSTOM_DUMP,
+    darkMode,
+    defaultEmitHandler,
+    derive,
+    dump,
+    EMPTY,
+    insertCss,
+    insertGlobalCss,
+    invertString,
+    isEmpty,
+    leakScope,
+    map,
+    MAP_SIZE_SYMBOL,
+    merge,
+    mount,
+    multiMap,
+    OPAQUE,
+    NO_COPY,
+    onEach,
+    partition,
+    peek,
+    proxy,
+    ref,
+    runQueue,
+    setErrorHandler,
+    setSpacingCssVars,
+    unmountAll,
+    unproxy,
+    window,
+    withEmitHandler
   });
 }
-var aberdeen_default = Object.assign(A, {
-  clean,
-  clone,
-  copy,
-  count,
-  cssVars,
-  CUSTOM_DUMP,
-  darkMode,
-  derive,
-  disableCreateDestroy,
-  dump,
-  insertCss,
-  insertGlobalCss,
-  invertString,
-  isEmpty,
-  map,
-  merge,
-  mount,
-  multiMap,
-  OPAQUE,
-  NO_COPY,
-  onEach,
-  partition,
-  peek,
-  proxy,
-  ref,
-  runQueue,
-  setErrorHandler,
-  setSpacingCssVars,
-  unmountAll,
-  unproxy
-});
 export {
-  withEmitHandler,
-  unproxy,
-  unmountAll,
-  setSpacingCssVars,
-  setErrorHandler,
-  runQueue,
-  ref,
-  proxy,
-  peek,
-  partition,
-  onEach,
-  multiMap,
-  mount,
-  merge,
-  map,
-  leakScope,
-  isEmpty,
-  invertString,
-  insertGlobalCss,
-  insertCss,
-  dump,
-  disableCreateDestroy,
-  derive,
-  defaultEmitHandler,
-  aberdeen_default as default,
-  darkMode,
-  cssVars,
-  count,
-  copy,
-  clone,
-  clean,
-  OPAQUE,
-  NO_COPY,
-  MAP_SIZE_SYMBOL,
-  EMPTY,
-  CUSTOM_DUMP,
-  A
+  createA
 };
 
-//# debugId=28BFF8A898B656A464756E2164756E21
+//# debugId=D6FCE405EAFADFD364756E2164756E21
 //# sourceMappingURL=aberdeen.js.map