zero-query 0.9.0 → 0.9.5

package/dist/zquery.js

@@ -1,5 +1,5 @@
 /**
- * zQuery (zeroQuery) v0.9.0
+ * zQuery (zeroQuery) v0.9.5
  * Lightweight Frontend Library
  * https://github.com/tonywied17/zero-query
  * (c) 2026 Anthony Wiedman - MIT License
@@ -300,7 +300,13 @@ function signal(initial) {
  */
 function computed(fn) {
   const s = new Signal(undefined);
-  effect(() => { s._value = fn(); s._notify(); });
+  effect(() => {
+    const v = fn();
+    if (v !== s._value) {
+      s._value = v;
+      s._notify();
+    }
+  });
   return s;
 }
 
@@ -343,7 +349,7 @@ function effect(fn) {
       }
       execute._deps.clear();
     }
-    Signal._activeEffect = null;
+    // Don't clobber _activeEffect — another effect may be running
   };
 }
 
@@ -361,7 +367,7 @@ function effect(fn) {
 // ---------------------------------------------------------------------------
 class ZQueryCollection {
   constructor(elements) {
-    this.elements = Array.isArray(elements) ? elements : [elements];
+    this.elements = Array.isArray(elements) ? elements : (elements ? [elements] : []);
     this.length = this.elements.length;
     this.elements.forEach((el, i) => { this[i] = el; });
   }
@@ -418,10 +424,12 @@ class ZQueryCollection {
     return new ZQueryCollection([...kids]);
   }
 
-  siblings() {
+  siblings(selector) {
     const sibs = [];
     this.elements.forEach(el => {
-      sibs.push(...[...el.parentElement.children].filter(c => c !== el));
+      if (!el.parentElement) return;
+      const all = [...el.parentElement.children].filter(c => c !== el);
+      sibs.push(...(selector ? all.filter(c => c.matches(selector)) : all));
     });
     return new ZQueryCollection(sibs);
   }
@@ -563,7 +571,8 @@ class ZQueryCollection {
   index(selector) {
     if (selector === undefined) {
       const el = this.first();
-      return el ? Array.from(el.parentElement.children).indexOf(el) : -1;
+      if (!el || !el.parentElement) return -1;
+      return Array.from(el.parentElement.children).indexOf(el);
     }
     const target = (typeof selector === 'string')
       ? document.querySelector(selector)
@@ -623,6 +632,11 @@ class ZQueryCollection {
   // --- Attributes ----------------------------------------------------------
 
   attr(name, value) {
+    if (typeof name === 'object' && name !== null) {
+      return this.each((_, el) => {
+        for (const [k, v] of Object.entries(name)) el.setAttribute(k, v);
+      });
+    }
     if (value === undefined) return this.first()?.getAttribute(name);
     return this.each((_, el) => el.setAttribute(name, value));
   }
@@ -647,7 +661,10 @@ class ZQueryCollection {
 
   // --- CSS / Dimensions ----------------------------------------------------
 
-  css(props) {
+  css(props, value) {
+    if (typeof props === 'string' && value !== undefined) {
+      return this.each((_, el) => { el.style[props] = value; });
+    }
     if (typeof props === 'string') {
       const el = this.first();
       return el ? getComputedStyle(el)[props] : undefined;
@@ -787,6 +804,7 @@ class ZQueryCollection {
   wrap(wrapper) {
     return this.each((_, el) => {
       const w = typeof wrapper === 'string' ? createFragment(wrapper).firstElementChild : wrapper.cloneNode(true);
+      if (!w || !el.parentNode) return;
       el.parentNode.insertBefore(w, el);
       w.appendChild(el);
     });
@@ -912,12 +930,18 @@ class ZQueryCollection {
         if (typeof selectorOrHandler === 'function') {
           el.addEventListener(evt, selectorOrHandler);
         } else if (typeof selectorOrHandler === 'string') {
-          // Delegated event — only works on elements that support closest()
-          el.addEventListener(evt, (e) => {
+          // Delegated event — store wrapper so off() can remove it
+          const wrapper = (e) => {
             if (!e.target || typeof e.target.closest !== 'function') return;
             const target = e.target.closest(selectorOrHandler);
             if (target && el.contains(target)) handler.call(target, e);
-          });
+          };
+          wrapper._zqOriginal = handler;
+          wrapper._zqSelector = selectorOrHandler;
+          el.addEventListener(evt, wrapper);
+          // Track delegated handlers for removal
+          if (!el._zqDelegated) el._zqDelegated = [];
+          el._zqDelegated.push({ evt, wrapper });
         }
       });
     });
@@ -926,7 +950,20 @@ class ZQueryCollection {
   off(event, handler) {
     const events = event.split(/\s+/);
     return this.each((_, el) => {
-      events.forEach(evt => el.removeEventListener(evt, handler));
+      events.forEach(evt => {
+        // Try direct removal first
+        el.removeEventListener(evt, handler);
+        // Also check delegated handlers
+        if (el._zqDelegated) {
+          el._zqDelegated = el._zqDelegated.filter(d => {
+            if (d.evt === evt && d.wrapper._zqOriginal === handler) {
+              el.removeEventListener(evt, d.wrapper);
+              return false;
+            }
+            return true;
+          });
+        }
+      });
     });
   }
 
@@ -955,8 +992,12 @@ class ZQueryCollection {
   // --- Animation -----------------------------------------------------------
 
   animate(props, duration = 300, easing = 'ease') {
+    // Empty collection — resolve immediately
+    if (this.length === 0) return Promise.resolve(this);
     return new Promise(resolve => {
+      let resolved = false;
       const count = { done: 0 };
+      const listeners = [];
       this.each((_, el) => {
         el.style.transition = `all ${duration}ms ${easing}`;
         requestAnimationFrame(() => {
@@ -964,13 +1005,27 @@ class ZQueryCollection {
           const onEnd = () => {
             el.removeEventListener('transitionend', onEnd);
             el.style.transition = '';
-            if (++count.done >= this.length) resolve(this);
+            if (!resolved && ++count.done >= this.length) {
+              resolved = true;
+              resolve(this);
+            }
           };
           el.addEventListener('transitionend', onEnd);
+          listeners.push({ el, onEnd });
         });
       });
       // Fallback in case transitionend doesn't fire
-      setTimeout(() => resolve(this), duration + 50);
+      setTimeout(() => {
+        if (!resolved) {
+          resolved = true;
+          // Clean up any remaining transitionend listeners
+          for (const { el, onEnd } of listeners) {
+            el.removeEventListener('transitionend', onEnd);
+            el.style.transition = '';
+          }
+          resolve(this);
+        }
+      }, duration + 50);
     });
   }
 
@@ -984,7 +1039,8 @@ class ZQueryCollection {
 
   fadeToggle(duration = 300) {
     return Promise.all(this.elements.map(el => {
-      const visible = getComputedStyle(el).opacity !== '0' && getComputedStyle(el).display !== 'none';
+      const cs = getComputedStyle(el);
+      const visible = cs.opacity !== '0' && cs.display !== 'none';
       const col = new ZQueryCollection([el]);
       return visible ? col.fadeOut(duration) : col.fadeIn(duration);
     })).then(() => this);
@@ -1162,6 +1218,8 @@ query.children = (parentId) => {
   const p = document.getElementById(parentId);
   return new ZQueryCollection(p ? Array.from(p.children) : []);
 };
+query.qs  = (sel, ctx = document) => ctx.querySelector(sel);
+query.qsa = (sel, ctx = document) => Array.from(ctx.querySelectorAll(sel));
 
 // Create element shorthand — returns ZQueryCollection for chaining
 query.create = (tag, attrs = {}, ...children) => {
@@ -1169,7 +1227,7 @@ query.create = (tag, attrs = {}, ...children) => {
   for (const [k, v] of Object.entries(attrs)) {
     if (k === 'class') el.className = v;
     else if (k === 'style' && typeof v === 'object') Object.assign(el.style, v);
-    else if (k.startsWith('on') && typeof v === 'function') el.addEventListener(k.slice(2), v);
+    else if (k.startsWith('on') && typeof v === 'function') el.addEventListener(k.slice(2).toLowerCase(), v);
     else if (k === 'data' && typeof v === 'object') Object.entries(v).forEach(([dk, dv]) => { el.dataset[dk] = dv; });
     else el.setAttribute(k, v);
   }
@@ -1389,6 +1447,11 @@ function tokenize(expr) {
       tokens.push({ t: T.OP, v: ch });
       i++; continue;
     }
+    // Spread operator: ...
+    if (ch === '.' && i + 2 < len && expr[i + 1] === '.' && expr[i + 2] === '.') {
+      tokens.push({ t: T.OP, v: '...' });
+      i += 3; continue;
+    }
     if ('()[]{},.?:'.includes(ch)) {
       tokens.push({ t: T.PUNC, v: ch });
       i++; continue;
@@ -1452,7 +1515,7 @@ class Parser {
           this.next(); // consume ?
           const truthy = this.parseExpression(0);
           this.expect(T.PUNC, ':');
-          const falsy = this.parseExpression(1);
+          const falsy = this.parseExpression(0);
           left = { type: 'ternary', cond: left, truthy, falsy };
           continue;
         }
@@ -1593,7 +1656,12 @@ class Parser {
     this.expect(T.PUNC, '(');
     const args = [];
     while (!(this.peek().t === T.PUNC && this.peek().v === ')') && this.peek().t !== T.EOF) {
-      args.push(this.parseExpression(0));
+      if (this.peek().t === T.OP && this.peek().v === '...') {
+        this.next();
+        args.push({ type: 'spread', arg: this.parseExpression(0) });
+      } else {
+        args.push(this.parseExpression(0));
+      }
       if (this.peek().t === T.PUNC && this.peek().v === ',') this.next();
     }
     this.expect(T.PUNC, ')');
@@ -1669,7 +1737,12 @@ class Parser {
       this.next();
       const elements = [];
       while (!(this.peek().t === T.PUNC && this.peek().v === ']') && this.peek().t !== T.EOF) {
-        elements.push(this.parseExpression(0));
+        if (this.peek().t === T.OP && this.peek().v === '...') {
+          this.next();
+          elements.push({ type: 'spread', arg: this.parseExpression(0) });
+        } else {
+          elements.push(this.parseExpression(0));
+        }
         if (this.peek().t === T.PUNC && this.peek().v === ',') this.next();
       }
       this.expect(T.PUNC, ']');
@@ -1681,6 +1754,14 @@ class Parser {
       this.next();
       const properties = [];
       while (!(this.peek().t === T.PUNC && this.peek().v === '}') && this.peek().t !== T.EOF) {
+        // Spread in object: { ...obj }
+        if (this.peek().t === T.OP && this.peek().v === '...') {
+          this.next();
+          properties.push({ spread: true, value: this.parseExpression(0) });
+          if (this.peek().t === T.PUNC && this.peek().v === ',') this.next();
+          continue;
+        }
+
         const keyTok = this.next();
         let key;
         if (keyTok.t === T.IDENT || keyTok.t === T.STR) key = keyTok.v;
@@ -1712,7 +1793,13 @@ class Parser {
 
       // new keyword
       if (tok.v === 'new') {
-        const classExpr = this.parsePostfix();
+        let classExpr = this.parsePrimary();
+        // Handle member access (e.g. ns.MyClass) without consuming call args
+        while (this.peek().t === T.PUNC && this.peek().v === '.') {
+          this.next();
+          const prop = this.next();
+          classExpr = { type: 'member', obj: classExpr, prop: prop.v, computed: false };
+        }
         let args = [];
         if (this.peek().t === T.PUNC && this.peek().v === '(') {
           args = this._parseArgs();
@@ -1780,6 +1867,7 @@ function _isSafeAccess(obj, prop) {
   const BLOCKED = new Set([
     'constructor', '__proto__', 'prototype', '__defineGetter__',
     '__defineSetter__', '__lookupGetter__', '__lookupSetter__',
+    'call', 'apply', 'bind',
   ]);
   if (typeof prop === 'string' && BLOCKED.has(prop)) return false;
 
@@ -1823,6 +1911,12 @@ function evaluate(node, scope) {
       if (name === 'encodeURIComponent') return encodeURIComponent;
       if (name === 'decodeURIComponent') return decodeURIComponent;
       if (name === 'console') return console;
+      if (name === 'Map') return Map;
+      if (name === 'Set') return Set;
+      if (name === 'RegExp') return RegExp;
+      if (name === 'Error') return Error;
+      if (name === 'URL') return URL;
+      if (name === 'URLSearchParams') return URLSearchParams;
       return undefined;
     }
 
@@ -1861,10 +1955,21 @@ function evaluate(node, scope) {
     }
 
     case 'optional_call': {
-      const callee = evaluate(node.callee, scope);
+      const calleeNode = node.callee;
+      const args = _evalArgs(node.args, scope);
+      // Method call: obj?.method() — bind `this` to obj
+      if (calleeNode.type === 'member' || calleeNode.type === 'optional_member') {
+        const obj = evaluate(calleeNode.obj, scope);
+        if (obj == null) return undefined;
+        const prop = calleeNode.computed ? evaluate(calleeNode.prop, scope) : calleeNode.prop;
+        if (!_isSafeAccess(obj, prop)) return undefined;
+        const fn = obj[prop];
+        if (typeof fn !== 'function') return undefined;
+        return fn.apply(obj, args);
+      }
+      const callee = evaluate(calleeNode, scope);
       if (callee == null) return undefined;
       if (typeof callee !== 'function') return undefined;
-      const args = node.args.map(a => evaluate(a, scope));
       return callee(...args);
     }
 
@@ -1874,7 +1979,7 @@ function evaluate(node, scope) {
       // Only allow safe constructors
       if (Ctor === Date || Ctor === Array || Ctor === Map || Ctor === Set ||
           Ctor === RegExp || Ctor === Error || Ctor === URL || Ctor === URLSearchParams) {
-        const args = node.args.map(a => evaluate(a, scope));
+        const args = _evalArgs(node.args, scope);
         return new Ctor(...args);
       }
       return undefined;
@@ -1904,13 +2009,32 @@ function evaluate(node, scope) {
       return cond ? evaluate(node.truthy, scope) : evaluate(node.falsy, scope);
     }
 
-    case 'array':
-      return node.elements.map(e => evaluate(e, scope));
+    case 'array': {
+      const arr = [];
+      for (const e of node.elements) {
+        if (e.type === 'spread') {
+          const iterable = evaluate(e.arg, scope);
+          if (iterable != null && typeof iterable[Symbol.iterator] === 'function') {
+            for (const v of iterable) arr.push(v);
+          }
+        } else {
+          arr.push(evaluate(e, scope));
+        }
+      }
+      return arr;
+    }
 
     case 'object': {
       const obj = {};
-      for (const { key, value } of node.properties) {
-        obj[key] = evaluate(value, scope);
+      for (const prop of node.properties) {
+        if (prop.spread) {
+          const source = evaluate(prop.value, scope);
+          if (source != null && typeof source === 'object') {
+            Object.assign(obj, source);
+          }
+        } else {
+          obj[prop.key] = evaluate(prop.value, scope);
+        }
       }
       return obj;
     }
@@ -1931,12 +2055,30 @@ function evaluate(node, scope) {
   }
 }
 
+/**
+ * Evaluate a list of argument AST nodes, flattening any spread elements.
+ */
+function _evalArgs(argNodes, scope) {
+  const result = [];
+  for (const a of argNodes) {
+    if (a.type === 'spread') {
+      const iterable = evaluate(a.arg, scope);
+      if (iterable != null && typeof iterable[Symbol.iterator] === 'function') {
+        for (const v of iterable) result.push(v);
+      }
+    } else {
+      result.push(evaluate(a, scope));
+    }
+  }
+  return result;
+}
+
 /**
  * Resolve and execute a function call safely.
  */
 function _resolveCall(node, scope) {
   const callee = node.callee;
-  const args = node.args.map(a => evaluate(a, scope));
+  const args = _evalArgs(node.args, scope);
 
   // Method call: obj.method() — bind `this` to obj
   if (callee.type === 'member' || callee.type === 'optional_member') {
@@ -2010,8 +2152,9 @@ function _evalBinary(node, scope) {
  * @returns {*} — evaluation result, or undefined on error
  */
 
-// AST cache — avoids re-tokenizing and re-parsing the same expression string.
-// Bounded to prevent unbounded memory growth in long-lived apps.
+// AST cache (LRU) — avoids re-tokenizing and re-parsing the same expression.
+// Uses Map insertion-order: on hit, delete + re-set moves entry to the end.
+// Eviction removes the least-recently-used (first) entry when at capacity.
 const _astCache = new Map();
 const _AST_CACHE_MAX = 512;
 
@@ -2031,9 +2174,12 @@ function safeEval(expr, scope) {
       // Fall through to full parser for built-in globals (Math, JSON, etc.)
     }
 
-    // Check AST cache
+    // Check AST cache (LRU: move to end on hit)
     let ast = _astCache.get(trimmed);
-    if (!ast) {
+    if (ast) {
+      _astCache.delete(trimmed);
+      _astCache.set(trimmed, ast);
+    } else {
       const tokens = tokenize(trimmed);
       const parser = new Parser(tokens, scope);
       ast = parser.parse();
@@ -2297,8 +2443,11 @@ function _morphChildrenKeyed(oldParent, oldChildren, newChildren, oldKeyMap, new
       if (!lisSet.has(i)) {
         oldParent.insertBefore(oldNode, cursor);
       }
+      // Capture next sibling BEFORE _morphNode — if _morphNode calls
+      // replaceChild, oldNode is removed and nextSibling becomes stale.
+      const nextSib = oldNode.nextSibling;
       _morphNode(oldParent, oldNode, newNode);
-      cursor = oldNode.nextSibling;
+      cursor = nextSib;
     } else {
       // Insert new node
       const clone = newNode.cloneNode(true);
@@ -2476,10 +2625,13 @@ function _morphAttributes(oldEl, newEl) {
     }
   }
 
-  // Remove stale attributes
-  for (let i = oldLen - 1; i >= 0; i--) {
-    if (!newNames.has(oldAttrs[i].name)) {
-      oldEl.removeAttribute(oldAttrs[i].name);
+  // Remove stale attributes — snapshot names first because oldAttrs
+  // is a live NamedNodeMap that mutates on removeAttribute().
+  const oldNames = new Array(oldLen);
+  for (let i = 0; i < oldLen; i++) oldNames[i] = oldAttrs[i].name;
+  for (let i = oldNames.length - 1; i >= 0; i--) {
+    if (!newNames.has(oldNames[i])) {
+      oldEl.removeAttribute(oldNames[i]);
     }
   }
 }
@@ -2801,7 +2953,7 @@ class Component {
     if (!watchers) return;
     for (const [key, handler] of Object.entries(watchers)) {
       // Match exact key or parent key (e.g. watcher on 'user' fires when 'user.name' changes)
-      if (changedKey === key || key.startsWith(changedKey + '.') || changedKey.startsWith(key + '.') || changedKey === key) {
+      if (changedKey === key || key.startsWith(changedKey + '.') || changedKey.startsWith(key + '.')) {
         const currentVal = _getPath(this.state.__raw || this.state, key);
         const prevVal = this._prevWatchValues?.[key];
         if (currentVal !== prevVal) {
@@ -2950,20 +3102,26 @@ class Component {
     if (!this._mounted && combinedStyles) {
       const scopeAttr = `z-s${this._uid}`;
       this._el.setAttribute(scopeAttr, '');
-      let inAtBlock = 0;
+      let noScopeDepth = 0;   // brace depth at which a no-scope @-rule started (0 = none active)
+      let braceDepth = 0;     // overall brace depth
       const scoped = combinedStyles.replace(/([^{}]+)\{|\}/g, (match, selector) => {
         if (match === '}') {
-          if (inAtBlock > 0) inAtBlock--;
+          if (noScopeDepth > 0 && braceDepth <= noScopeDepth) noScopeDepth = 0;
+          braceDepth--;
           return match;
         }
+        braceDepth++;
         const trimmed = selector.trim();
-        // Don't scope @-rules (@media, @keyframes, @supports, @container, @layer, @font-face, etc.)
+        // Don't scope @-rules themselves
         if (trimmed.startsWith('@')) {
-          inAtBlock++;
+          // @keyframes and @font-face contain non-selector content — skip scoping inside them
+          if (/^@(keyframes|font-face)\b/.test(trimmed)) {
+            noScopeDepth = braceDepth;
+          }
           return match;
         }
-        // Don't scope keyframe stops (from, to, 0%, 50%, etc.)
-        if (inAtBlock > 0 && /^[\d%\s,fromto]+$/.test(trimmed.replace(/\s/g, ''))) {
+        // Inside @keyframes or @font-face — don't scope inner rules
+        if (noScopeDepth > 0 && braceDepth > noScopeDepth) {
           return match;
         }
         return selector.split(',').map(s => `[${scopeAttr}] ${s.trim()}`).join(', ') + ' {';
@@ -3151,15 +3309,44 @@ class Component {
       const handler = (e) => {
         // Read bindings from live map — always up to date after re-renders
         const currentBindings = this._eventBindings?.get(event) || [];
-        for (const { selector, methodExpr, modifiers, el } of currentBindings) {
-          if (!e.target.closest(selector)) continue;
+
+        // Collect matching bindings with their matched elements, then sort
+        // deepest-first so .stop correctly prevents ancestor handlers
+        // (mimics real DOM bubbling order within delegated events).
+        const hits = [];
+        for (const binding of currentBindings) {
+          const matched = e.target.closest(binding.selector);
+          if (!matched) continue;
+          hits.push({ ...binding, matched });
+        }
+        hits.sort((a, b) => {
+          if (a.matched === b.matched) return 0;
+          return a.matched.contains(b.matched) ? 1 : -1;
+        });
+
+        let stoppedAt = null; // Track elements that called .stop
+        for (const { selector, methodExpr, modifiers, el, matched } of hits) {
+
+          // In delegated events, .stop should prevent ancestor bindings from
+          // firing — stopPropagation alone only stops real DOM bubbling.
+          if (stoppedAt) {
+            let blocked = false;
+            for (const stopped of stoppedAt) {
+              if (matched.contains(stopped) && matched !== stopped) { blocked = true; break; }
+            }
+            if (blocked) continue;
+          }
 
           // .self — only fire if target is the element itself
           if (modifiers.includes('self') && e.target !== el) continue;
 
           // Handle modifiers
           if (modifiers.includes('prevent')) e.preventDefault();
-          if (modifiers.includes('stop')) e.stopPropagation();
+          if (modifiers.includes('stop')) {
+            e.stopPropagation();
+            if (!stoppedAt) stoppedAt = [];
+            stoppedAt.push(matched);
+          }
 
           // Build the invocation function
           const invoke = (evt) => {
@@ -3591,6 +3778,21 @@ class Component {
     this._listeners = [];
     this._delegatedEvents = null;
     this._eventBindings = null;
+    // Clear any pending debounce/throttle timers to prevent stale closures.
+    // Timers are keyed by individual child elements, so iterate all descendants.
+    const allEls = this._el.querySelectorAll('*');
+    allEls.forEach(child => {
+      const dTimers = _debounceTimers.get(child);
+      if (dTimers) {
+        for (const key in dTimers) clearTimeout(dTimers[key]);
+        _debounceTimers.delete(child);
+      }
+      const tTimers = _throttleTimers.get(child);
+      if (tTimers) {
+        for (const key in tTimers) clearTimeout(tTimers[key]);
+        _throttleTimers.delete(child);
+      }
+    });
     if (this._styleEl) this._styleEl.remove();
     _instances.delete(this._el);
     this._el.innerHTML = '';
@@ -3886,6 +4088,23 @@ function style(urls, opts = {}) {
 // Unique marker on history.state to identify zQuery-managed entries
 const _ZQ_STATE_KEY = '__zq';
 
+/**
+ * Shallow-compare two flat objects (for params / query comparison).
+ * Avoids JSON.stringify overhead on every navigation.
+ */
+function _shallowEqual(a, b) {
+  if (a === b) return true;
+  if (!a || !b) return false;
+  const keysA = Object.keys(a);
+  const keysB = Object.keys(b);
+  if (keysA.length !== keysB.length) return false;
+  for (let i = 0; i < keysA.length; i++) {
+    const k = keysA[i];
+    if (a[k] !== b[k]) return false;
+  }
+  return true;
+}
+
 class Router {
   constructor(config = {}) {
     this._el = null;
@@ -3933,11 +4152,12 @@ class Router {
       config.routes.forEach(r => this.add(r));
     }
 
-    // Listen for navigation
+    // Listen for navigation — store handler references for cleanup in destroy()
     if (this._mode === 'hash') {
-      window.addEventListener('hashchange', () => this._resolve());
+      this._onNavEvent = () => this._resolve();
+      window.addEventListener('hashchange', this._onNavEvent);
     } else {
-      window.addEventListener('popstate', (e) => {
+      this._onNavEvent = (e) => {
         // Check for substate pop first — if a listener handles it, don't route
         const st = e.state;
         if (st && st[_ZQ_STATE_KEY] === 'substate') {
@@ -3951,11 +4171,12 @@ class Router {
           this._fireSubstate(null, null, 'reset');
         }
         this._resolve();
-      });
+      };
+      window.addEventListener('popstate', this._onNavEvent);
     }
 
     // Intercept link clicks for SPA navigation
-    document.addEventListener('click', (e) => {
+    this._onLinkClick = (e) => {
       // Don't intercept modified clicks (Ctrl/Cmd+click = new tab)
       if (e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) return;
       const link = e.target.closest('[z-link]');
@@ -3977,7 +4198,8 @@ class Router {
         const scrollBehavior = link.getAttribute('z-to-top') || 'instant';
         window.scrollTo({ top: 0, behavior: scrollBehavior });
       }
-    });
+    };
+    document.addEventListener('click', this._onLinkClick);
 
     // Initial resolve
     if (this._el) {
@@ -4349,8 +4571,8 @@ class Router {
     // with the same params, skip the full destroy/mount cycle and just
     // update props. This prevents flashing and unnecessary DOM churn.
     if (from && this._instance && matched.component === from.route.component) {
-      const sameParams = JSON.stringify(params) === JSON.stringify(from.params);
-      const sameQuery = JSON.stringify(query) === JSON.stringify(from.query);
+      const sameParams = _shallowEqual(params, from.params);
+      const sameQuery = _shallowEqual(query, from.query);
       if (sameParams && sameQuery) {
         // Identical navigation — nothing to do
         return;
@@ -4425,7 +4647,12 @@ class Router {
       if (typeof matched.component === 'string') {
         const container = document.createElement(matched.component);
         this._el.appendChild(container);
-        this._instance = mount(container, matched.component, props);
+        try {
+          this._instance = mount(container, matched.component, props);
+        } catch (err) {
+          reportError(ErrorCode.COMP_NOT_FOUND, `Failed to mount component for route "${matched.path}"`, { component: matched.component, path: matched.path }, err);
+          return;
+        }
         if (_routeStart) window.__zqRenderHook(this._el, performance.now() - _routeStart, 'route', matched.component);
       }
       // If component is a render function
@@ -4447,6 +4674,15 @@ class Router {
   // --- Destroy -------------------------------------------------------------
 
   destroy() {
+    // Remove window/document event listeners to prevent memory leaks
+    if (this._onNavEvent) {
+      window.removeEventListener(this._mode === 'hash' ? 'hashchange' : 'popstate', this._onNavEvent);
+      this._onNavEvent = null;
+    }
+    if (this._onLinkClick) {
+      document.removeEventListener('click', this._onLinkClick);
+      this._onLinkClick = null;
+    }
     if (this._instance) this._instance.destroy();
     this._listeners.clear();
     this._substateListeners = [];
@@ -4509,6 +4745,7 @@ class Store {
     this._getters = config.getters || {};
     this._middleware = [];
     this._history = [];              // action log
+    this._maxHistory = config.maxHistory || 1000;
     this._debug = config.debug || false;
 
     // Create reactive state
@@ -4568,6 +4805,10 @@ class Store {
     try {
       const result = action(this.state, ...args);
       this._history.push({ action: name, args, timestamp: Date.now() });
+      // Cap history to prevent unbounded memory growth
+      if (this._history.length > this._maxHistory) {
+        this._history.splice(0, this._history.length - this._maxHistory);
+      }
       return result;
     } catch (err) {
       reportError(ErrorCode.STORE_ACTION, `Action "${name}" threw`, { action: name, args }, err);
@@ -4725,11 +4966,28 @@ async function request(method, url, data, options = {}) {
 
   // Timeout via AbortController
   const controller = new AbortController();
-  fetchOpts.signal = options.signal || controller.signal;
   const timeout = options.timeout ?? _config.timeout;
   let timer;
+  // Combine user signal with internal controller for proper timeout support
+  if (options.signal) {
+    // If AbortSignal.any is available, combine both signals
+    if (typeof AbortSignal.any === 'function') {
+      fetchOpts.signal = AbortSignal.any([options.signal, controller.signal]);
+    } else {
+      // Fallback: forward user signal's abort to our controller
+      fetchOpts.signal = controller.signal;
+      if (options.signal.aborted) {
+        controller.abort(options.signal.reason);
+      } else {
+        options.signal.addEventListener('abort', () => controller.abort(options.signal.reason), { once: true });
+      }
+    }
+  } else {
+    fetchOpts.signal = controller.signal;
+  }
+  let _timedOut = false;
   if (timeout > 0) {
-    timer = setTimeout(() => controller.abort(), timeout);
+    timer = setTimeout(() => { _timedOut = true; controller.abort(); }, timeout);
   }
 
   // Run request interceptors
@@ -4789,7 +5047,10 @@ async function request(method, url, data, options = {}) {
   } catch (err) {
     if (timer) clearTimeout(timer);
     if (err.name === 'AbortError') {
-      throw new Error(`Request timeout after ${timeout}ms: ${method} ${fullURL}`);
+      if (_timedOut) {
+        throw new Error(`Request timeout after ${timeout}ms: ${method} ${fullURL}`);
+      }
+      throw new Error(`Request aborted: ${method} ${fullURL}`);
     }
     throw err;
   }
@@ -4926,6 +5187,10 @@ function escapeHtml(str) {
   return String(str).replace(/[&<>"']/g, c => map[c]);
 }
 
+function stripHtml(str) {
+  return String(str).replace(/<[^>]*>/g, '');
+}
+
 /**
  * Template tag for auto-escaping interpolated values
  * Usage: $.html`<div>${userInput}</div>`
@@ -4971,7 +5236,10 @@ function camelCase(str) {
  * CamelCase to kebab-case
  */
 function kebabCase(str) {
-  return str.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
+  return str
+    .replace(/([A-Z]+)([A-Z][a-z])/g, '$1-$2')
+    .replace(/([a-z\d])([A-Z])/g, '$1-$2')
+    .toLowerCase();
 }
 
 
@@ -4991,30 +5259,40 @@ function deepClone(obj) {
  * Deep merge objects
  */
 function deepMerge(target, ...sources) {
-  for (const source of sources) {
-    for (const key of Object.keys(source)) {
-      if (source[key] && typeof source[key] === 'object' && !Array.isArray(source[key])) {
-        if (!target[key] || typeof target[key] !== 'object') target[key] = {};
-        deepMerge(target[key], source[key]);
+  const seen = new WeakSet();
+  function merge(tgt, src) {
+    if (seen.has(src)) return tgt;
+    seen.add(src);
+    for (const key of Object.keys(src)) {
+      if (src[key] && typeof src[key] === 'object' && !Array.isArray(src[key])) {
+        if (!tgt[key] || typeof tgt[key] !== 'object') tgt[key] = {};
+        merge(tgt[key], src[key]);
       } else {
-        target[key] = source[key];
+        tgt[key] = src[key];
       }
     }
+    return tgt;
   }
+  for (const source of sources) merge(target, source);
   return target;
 }
 
 /**
  * Simple object equality check
  */
-function isEqual(a, b) {
+function isEqual(a, b, _seen) {
   if (a === b) return true;
   if (typeof a !== typeof b) return false;
   if (typeof a !== 'object' || a === null || b === null) return false;
+  if (Array.isArray(a) !== Array.isArray(b)) return false;
+  // Guard against circular references
+  if (!_seen) _seen = new Set();
+  if (_seen.has(a)) return true;
+  _seen.add(a);
   const keysA = Object.keys(a);
   const keysB = Object.keys(b);
   if (keysA.length !== keysB.length) return false;
-  return keysA.every(k => isEqual(a[k], b[k]));
+  return keysA.every(k => isEqual(a[k], b[k], _seen));
 }
 
 
@@ -5115,7 +5393,182 @@ class EventBus {
   clear() { this._handlers.clear(); }
 }
 
-const bus = new EventBus();
+const bus = new EventBus();
+
+
+// ---------------------------------------------------------------------------
+// Array utilities
+// ---------------------------------------------------------------------------
+
+function range(startOrEnd, end, step) {
+  let s, e, st;
+  if (end === undefined) { s = 0; e = startOrEnd; st = 1; }
+  else { s = startOrEnd; e = end; st = step !== undefined ? step : 1; }
+  if (st === 0) return [];
+  const result = [];
+  if (st > 0) { for (let i = s; i < e; i += st) result.push(i); }
+  else        { for (let i = s; i > e; i += st) result.push(i); }
+  return result;
+}
+
+function unique(arr, keyFn) {
+  if (!keyFn) return [...new Set(arr)];
+  const seen = new Set();
+  return arr.filter(item => {
+    const k = keyFn(item);
+    if (seen.has(k)) return false;
+    seen.add(k);
+    return true;
+  });
+}
+
+function chunk(arr, size) {
+  const result = [];
+  for (let i = 0; i < arr.length; i += size) result.push(arr.slice(i, i + size));
+  return result;
+}
+
+function groupBy(arr, keyFn) {
+  const result = {};
+  for (const item of arr) {
+    const k = keyFn(item);
+    (result[k] ??= []).push(item);
+  }
+  return result;
+}
+
+
+// ---------------------------------------------------------------------------
+// Object utilities
+// ---------------------------------------------------------------------------
+
+function pick(obj, keys) {
+  const result = {};
+  for (const k of keys) { if (k in obj) result[k] = obj[k]; }
+  return result;
+}
+
+function omit(obj, keys) {
+  const exclude = new Set(keys);
+  const result = {};
+  for (const k of Object.keys(obj)) { if (!exclude.has(k)) result[k] = obj[k]; }
+  return result;
+}
+
+function getPath(obj, path, fallback) {
+  const keys = path.split('.');
+  let cur = obj;
+  for (const k of keys) {
+    if (cur == null || typeof cur !== 'object') return fallback;
+    cur = cur[k];
+  }
+  return cur === undefined ? fallback : cur;
+}
+
+function setPath(obj, path, value) {
+  const keys = path.split('.');
+  let cur = obj;
+  for (let i = 0; i < keys.length - 1; i++) {
+    const k = keys[i];
+    if (cur[k] == null || typeof cur[k] !== 'object') cur[k] = {};
+    cur = cur[k];
+  }
+  cur[keys[keys.length - 1]] = value;
+  return obj;
+}
+
+function isEmpty(val) {
+  if (val == null) return true;
+  if (typeof val === 'string' || Array.isArray(val)) return val.length === 0;
+  if (val instanceof Map || val instanceof Set) return val.size === 0;
+  if (typeof val === 'object') return Object.keys(val).length === 0;
+  return false;
+}
+
+
+// ---------------------------------------------------------------------------
+// String utilities
+// ---------------------------------------------------------------------------
+
+function capitalize(str) {
+  if (!str) return '';
+  return str[0].toUpperCase() + str.slice(1).toLowerCase();
+}
+
+function truncate(str, maxLen, suffix = '…') {
+  if (str.length <= maxLen) return str;
+  const end = Math.max(0, maxLen - suffix.length);
+  return str.slice(0, end) + suffix;
+}
+
+
+// ---------------------------------------------------------------------------
+// Number utilities
+// ---------------------------------------------------------------------------
+
+function clamp(val, min, max) {
+  return val < min ? min : val > max ? max : val;
+}
+
+
+// ---------------------------------------------------------------------------
+// Function utilities
+// ---------------------------------------------------------------------------
+
+function memoize(fn, keyFnOrOpts) {
+  let keyFn, maxSize = 0;
+  if (typeof keyFnOrOpts === 'function') keyFn = keyFnOrOpts;
+  else if (keyFnOrOpts && typeof keyFnOrOpts === 'object') maxSize = keyFnOrOpts.maxSize || 0;
+
+  const cache = new Map();
+
+  const memoized = (...args) => {
+    const key = keyFn ? keyFn(...args) : args[0];
+    if (cache.has(key)) return cache.get(key);
+    const result = fn(...args);
+    cache.set(key, result);
+    if (maxSize > 0 && cache.size > maxSize) {
+      cache.delete(cache.keys().next().value);
+    }
+    return result;
+  };
+
+  memoized.clear = () => cache.clear();
+  return memoized;
+}
+
+
+// ---------------------------------------------------------------------------
+// Async utilities
+// ---------------------------------------------------------------------------
+
+function retry(fn, opts = {}) {
+  const { attempts = 3, delay = 1000, backoff = 1 } = opts;
+  return new Promise((resolve, reject) => {
+    let attempt = 0, currentDelay = delay;
+    const tryOnce = () => {
+      attempt++;
+      fn(attempt).then(resolve, (err) => {
+        if (attempt >= attempts) return reject(err);
+        const d = currentDelay;
+        currentDelay *= backoff;
+        setTimeout(tryOnce, d);
+      });
+    };
+    tryOnce();
+  });
+}
+
+function timeout(promise, ms, message) {
+  let timer;
+  const race = Promise.race([
+    promise,
+    new Promise((_, reject) => {
+      timer = setTimeout(() => reject(new Error(message || `Timed out after ${ms}ms`)), ms);
+    })
+  ]);
+  return race.finally(() => clearTimeout(timer));
+}
 
 // --- index.js (assembly) ------------------------------------------
 /**
@@ -5174,6 +5627,8 @@ Object.defineProperty($, 'name', {
   value: query.name, writable: true, configurable: true
 });
 $.children = query.children;
+$.qs       = query.qs;
+$.qsa      = query.qsa;
 
 // --- Collection selector ---------------------------------------------------
 /**
@@ -5242,8 +5697,10 @@ $.pipe       = pipe;
 $.once       = once;
 $.sleep      = sleep;
 $.escapeHtml = escapeHtml;
+$.stripHtml  = stripHtml;
 $.html       = html;
 $.trust      = trust;
+$.TrustedHTML = TrustedHTML;
 $.uuid       = uuid;
 $.camelCase  = camelCase;
 $.kebabCase  = kebabCase;
@@ -5254,7 +5711,23 @@ $.param      = param;
 $.parseQuery = parseQuery;
 $.storage    = storage;
 $.session    = session;
+$.EventBus   = EventBus;
 $.bus        = bus;
+$.range      = range;
+$.unique     = unique;
+$.chunk      = chunk;
+$.groupBy    = groupBy;
+$.pick       = pick;
+$.omit       = omit;
+$.getPath    = getPath;
+$.setPath    = setPath;
+$.isEmpty    = isEmpty;
+$.capitalize = capitalize;
+$.truncate   = truncate;
+$.clamp      = clamp;
+$.memoize    = memoize;
+$.retry      = retry;
+$.timeout    = timeout;
 
 // --- Error handling --------------------------------------------------------
 $.onError        = onError;
@@ -5264,8 +5737,8 @@ $.guardCallback  = guardCallback;
 $.validate       = validate;
 
 // --- Meta ------------------------------------------------------------------
-$.version = '0.9.0';
-$.libSize = '~89 KB';
+$.version = '0.9.5';
+$.libSize = '~98 KB';
 $.meta    = {};                // populated at build time by CLI bundler
 
 $.noConflict = () => {