aberdeen 1.0.6 → 1.0.8

package/README.md

@@ -12,7 +12,7 @@ Aberdeen's approach is refreshingly simple:
 - ⏩ **Fast:** No virtual DOM. Aberdeen intelligently updates only the minimal, necessary parts of your UI when proxied data changes.
 - 👥 **Awesome lists**: It's very easy and performant to reactively display data sorted by whatever you like.
 - 🔬 **Tiny:** Around 5KB (minimized and gzipped) and with zero runtime dependencies.
-- 🔋 **Batteries included**: Comes with client-side routing, revertible patches for optimistic user-interface updates, component-local CSS, helper functions for transforming reactive data (mapping, partitioning, filtering, etc) and hide/unhide transition effects. No bikeshedding required!
+- 🔋 **Batteries included**: Comes with client-side routing, revertible patches for optimistic user-interface updates, component-local CSS, SVG support, helper functions for transforming reactive data (mapping, partitioning, filtering, etc) and hide/unhide transition effects. No bikeshedding required!
 
 ## Why *not* use Aberdeen?
 

package/dist/aberdeen.js

@@ -44,8 +44,8 @@ class ReverseSortedSet {
   }
   get(indexValue) {
     const keyProp = this.keyProp;
-    let current = this.tail;
     let prev;
+    let current = this.tail;
     for (let l = this.symbols.length - 1;l >= 0; l--) {
       const symbol = this.symbols[l];
       while ((prev = current[symbol]) && prev[keyProp] > indexValue)
@@ -127,7 +127,7 @@ function runQueue() {
   sortedQueue = undefined;
   runQueueDepth = 0;
   time = Date.now() - time;
-  if (time > 1)
+  if (time > 9)
     console.debug(`Aberdeen queue took ${time}ms`);
 }
 function partToStr(part) {
@@ -164,6 +164,7 @@ class Scope {
 
 class ContentScope extends Scope {
   cleaners;
+  inSvgNamespace = false;
   constructor(cleaners = []) {
     super();
     this.cleaners = cleaners;
@@ -207,6 +208,7 @@ class ChainedScope extends ContentScope {
   constructor(parentElement, useParentCleaners = false) {
     super(useParentCleaners ? currentScope.cleaners : []);
     this.parentElement = parentElement;
+    this.inSvgNamespace = currentScope.inSvgNamespace;
     if (parentElement === currentScope.parentElement) {
       this.prevSibling = currentScope.getChildPrevSibling();
       currentScope.lastChild = this;
@@ -255,6 +257,7 @@ class MountScope extends ContentScope {
     super();
     this.parentElement = parentElement;
     this.renderer = renderer;
+    this.inSvgNamespace = currentScope.inSvgNamespace;
     this.redraw();
     currentScope.cleaners.push(this);
   }
@@ -419,6 +422,7 @@ class OnEachScope extends Scope {
     for (const scope of this.byIndex.values()) {
       scope.delete();
     }
+    sortedQueue?.remove(this);
     this.byIndex.clear();
     setTimeout(() => {
       this.sortedSet.clear();
@@ -443,6 +447,7 @@ class OnEachItemScope extends ContentScope {
     this.parent = parent;
     this.itemIndex = itemIndex;
     this.parentElement = parent.parentElement;
+    this.inSvgNamespace = currentScope.inSvgNamespace;
     this.parent.byIndex.set(this.itemIndex, this);
     this.lastChild = this;
     if (topRedraw)
@@ -944,7 +949,12 @@ function $(...args) {
         err = `Tag '${arg}' cannot contain space`;
         break;
       } else {
-        result = document.createElement(arg);
+        const useNamespace = currentScope.inSvgNamespace || arg === "svg";
+        if (useNamespace) {
+          result = document.createElementNS("http://www.w3.org/2000/svg", arg);
+        } else {
+          result = document.createElement(arg);
+        }
         if (classes)
           result.className = classes.replaceAll(".", " ");
         if (text)
@@ -954,6 +964,9 @@ function $(...args) {
           savedCurrentScope = currentScope;
         }
         const newScope = new ChainedScope(result, true);
+        if (arg === "svg") {
+          newScope.inSvgNamespace = true;
+        }
         newScope.lastChild = result.lastChild || undefined;
         if (topRedrawScope === currentScope)
           topRedrawScope = newScope;
@@ -1204,5 +1217,5 @@ export {
   $
 };
 
-//# debugId=7D3AE73408804D7B64756E2164756E21
+//# debugId=E7B46BDF501F944C64756E2164756E21
 //# sourceMappingURL=aberdeen.js.map