sibujs 4.6.0 → 4.8.0

package/dist/{chunk-7GQCWFOE.js → chunk-J3YQ457H.js}

@@ -135,40 +135,44 @@ import {
   use,
   var_,
   video
-} from "./chunk-JSXPZCET.js";
+} from "./chunk-Q5J2LVKH.js";
 import {
   trustHTML
-} from "./chunk-HURREPU2.js";
+} from "./chunk-FC6KCJSA.js";
 import {
   watch
-} from "./chunk-UZQ6ALFS.js";
+} from "./chunk-CZPRSWSS.js";
 import {
   __resetIdCounter,
   createId,
   domBinding
-} from "./chunk-3ISI6ACU.js";
+} from "./chunk-C7AA2CZX.js";
 import {
   SVG_NS,
   bindChildNode,
   captureFocusWithin,
   restoreFocusWithin,
   tagFactory
-} from "./chunk-VVWPJ543.js";
+} from "./chunk-VWT3VXPL.js";
 import {
   bindAttribute,
   bindDynamic,
-  setSafeAttribute
-} from "./chunk-47M47FOM.js";
+  setSafeAttribute,
+  setTrustedAttribute
+} from "./chunk-O6TRVMJI.js";
+import {
+  isCodeTextElement
+} from "./chunk-3ACAAQIN.js";
 import {
   derived
-} from "./chunk-QE4TTDU3.js";
+} from "./chunk-KJ3UKABJ.js";
 import {
   globalSingleton
 } from "./chunk-7ZHH77QA.js";
 import {
   effect,
   on
-} from "./chunk-XC4MEKGA.js";
+} from "./chunk-V3LHZSU5.js";
 import {
   disableSSR,
   enableSSR,
@@ -187,8 +191,9 @@ import {
   external,
   isBatching,
   signal
-} from "./chunk-D33YTSX5.js";
+} from "./chunk-DSID757X.js";
 import {
+  emitDevtools,
   notifySubscribers,
   reactiveBinding,
   recordDependency,
@@ -198,7 +203,7 @@ import {
   suspendTracking,
   track,
   untracked
-} from "./chunk-5Q4R7HCL.js";
+} from "./chunk-TQQUN4WR.js";
 import {
   DEV,
   MAX_DRAIN_TEARDOWNS,
@@ -216,7 +221,8 @@ import {
   reportDrainRunaway,
   reportError,
   setRuntimeErrorHandler,
-  unregisterDisposer
+  unregisterDisposer,
+  withDisposerRollback
 } from "./chunk-NYNYSPK7.js";
 
 // index.ts
@@ -232,6 +238,7 @@ __export(index_exports, {
   Portal: () => Portal,
   SVG_NS: () => SVG_NS,
   Suspense: () => Suspense,
+  __renderParsedTemplate: () => __renderParsedTemplate,
   __resetIdCounter: () => __resetIdCounter,
   a: () => a,
   abbr: () => abbr,
@@ -557,10 +564,13 @@ function safeCall(cb, hookName) {
     return void 0;
   }
 }
-function runMountCallback(callback, hookName, element) {
+function runMountCallback(callback, hookName, element, isDisposed) {
   const cleanup = safeCall(callback, hookName);
-  if (typeof cleanup === "function" && element) {
-    registerDisposer(element, cleanup);
+  if (typeof cleanup !== "function") return;
+  if (isDisposed() || !element.isConnected) {
+    safeCall(cleanup, "onUnmount");
+  } else {
+    onUnmount(cleanup, element);
   }
 }
 var mountWatchers = /* @__PURE__ */ new WeakMap();
@@ -722,25 +732,26 @@ function onMount(callback, element) {
   if (typeof document === "undefined") return;
   if (element) {
     let disposed = false;
+    const isDisposed = () => disposed;
     registerDisposer(element, () => {
       disposed = true;
     });
     if (element.isConnected) {
       queueMicrotask(() => {
         if (disposed) return;
-        runMountCallback(callback, "onMount", element);
+        runMountCallback(callback, "onMount", element, isDisposed);
       });
       return;
     }
     queueMicrotask(() => {
       if (disposed) return;
       if (element.isConnected) {
-        runMountCallback(callback, "onMount", element);
+        runMountCallback(callback, "onMount", element, isDisposed);
         return;
       }
       const unregister = registerMountWatcher(element, () => {
         if (disposed) return;
-        runMountCallback(callback, "onMount", element);
+        runMountCallback(callback, "onMount", element, isDisposed);
       });
       registerDisposer(element, unregister);
     });
@@ -1574,36 +1585,34 @@ function Loading(props = {}) {
   const { text: text2, variant = "spinner", size = "md" } = props;
   const sizeClass = size !== "md" ? ` sibu-loading-${size}` : "";
   if (variant === "dots") {
-    return div({
+    return div(
+      {
+        class: `sibu-loading${sizeClass}`,
+        role: "status",
+        "aria-live": "polite",
+        // When there's no visible text, give the live region an accessible name
+        // so it isn't announced as an empty status.
+        "aria-label": text2 ? void 0 : "Loading"
+      },
+      [
+        div({ class: "sibu-loading-dots" }, [
+          span({ class: "sibu-loading-dot" }),
+          span({ class: "sibu-loading-dot" }),
+          span({ class: "sibu-loading-dot" })
+        ]),
+        text2 ? span({ class: "sibu-loading-text" }, text2) : null
+      ]
+    );
+  }
+  return div(
+    {
       class: `sibu-loading${sizeClass}`,
       role: "status",
       "aria-live": "polite",
-      // When there's no visible text, give the live region an accessible name
-      // so it isn't announced as an empty status.
-      "aria-label": text2 ? void 0 : "Loading",
-      nodes: [
-        div({
-          class: "sibu-loading-dots",
-          nodes: [
-            span({ class: "sibu-loading-dot" }),
-            span({ class: "sibu-loading-dot" }),
-            span({ class: "sibu-loading-dot" })
-          ]
-        }),
-        text2 ? span({ class: "sibu-loading-text", nodes: text2 }) : null
-      ].filter(Boolean)
-    });
-  }
-  return div({
-    class: `sibu-loading${sizeClass}`,
-    role: "status",
-    "aria-live": "polite",
-    "aria-label": text2 ? void 0 : "Loading",
-    nodes: [
-      div({ class: "sibu-loading-spinner" }),
-      text2 ? span({ class: "sibu-loading-text", nodes: text2 }) : null
-    ].filter(Boolean)
-  });
+      "aria-label": text2 ? void 0 : "Loading"
+    },
+    [div({ class: "sibu-loading-spinner" }), text2 ? span({ class: "sibu-loading-text" }, text2) : null]
+  );
 }
 
 // src/core/rendering/action.ts
@@ -1714,8 +1723,9 @@ var globalErrorHandler = null;
 function catchError(fn, onError) {
   try {
     const result = fn();
-    if (result && typeof result.then === "function") {
-      result.catch((err) => {
+    const adopted = adoptThenable(result);
+    if (adopted) {
+      adopted.then(void 0, (err) => {
         if (onError) {
           onError(err, "async");
         } else if (globalErrorHandler) {
@@ -1826,6 +1836,10 @@ function attachBranch(parent, anchor, branch, attachedOnce, where) {
   parent.insertBefore(node, anchor.nextSibling);
   return { node, owned };
 }
+function releaseBranchNode(node, owned) {
+  if (owned) dispose(node);
+  node.parentNode?.removeChild(node);
+}
 function when(condition, thenBranch, elseBranch) {
   const anchor = document.createComment("when");
   let currentNode = null;
@@ -1839,16 +1853,15 @@ function when(condition, thenBranch, elseBranch) {
     const show2 = condition();
     const parent = anchor.parentNode;
     if (!parent) return;
-    if (initialized && show2 === lastCondition) return;
+    if (initialized && Object.is(show2, lastCondition)) return;
     lastCondition = show2;
     const focused = currentNode ? captureFocusWithin([currentNode]) : null;
     if (currentNode?.parentNode) {
-      if (currentNodeOwned) dispose(currentNode);
-      currentNode.parentNode.removeChild(currentNode);
+      releaseBranchNode(currentNode, currentNodeOwned);
       currentNode = null;
     }
     const branch = show2 ? thenBranch : elseBranch !== void 0 ? elseBranch : null;
-    const attached = attachBranch(parent, anchor, branch, attachedOnce, "when");
+    const attached = untracked(() => attachBranch(parent, anchor, branch, attachedOnce, "when"));
     currentNode = attached.node;
     currentNodeOwned = attached.owned;
     restoreFocusWithin(focused, currentNode ? [currentNode] : [], "when");
@@ -1858,6 +1871,8 @@ function when(condition, thenBranch, elseBranch) {
   registerDisposer(anchor, () => {
     disposed = true;
     stopBinding();
+    if (currentNode) releaseBranchNode(currentNode, currentNodeOwned);
+    currentNode = null;
   });
   if (!initialized) {
     queueMicrotask(() => {
@@ -1883,12 +1898,11 @@ function match(value, cases, fallback) {
     lastKey = key;
     const focused = currentNode ? captureFocusWithin([currentNode]) : null;
     if (currentNode?.parentNode) {
-      if (currentNodeOwned) dispose(currentNode);
-      currentNode.parentNode.removeChild(currentNode);
+      releaseBranchNode(currentNode, currentNodeOwned);
       currentNode = null;
     }
     const branch = Object.hasOwn(cases, key) ? cases[key] : fallback;
-    const attached = attachBranch(parent, anchor, branch ?? null, attachedOnce, "match");
+    const attached = untracked(() => attachBranch(parent, anchor, branch ?? null, attachedOnce, "match"));
     currentNode = attached.node;
     currentNodeOwned = attached.owned;
     restoreFocusWithin(focused, currentNode ? [currentNode] : [], "match");
@@ -1898,6 +1912,8 @@ function match(value, cases, fallback) {
   registerDisposer(anchor, () => {
     disposed = true;
     stopBinding();
+    if (currentNode) releaseBranchNode(currentNode, currentNodeOwned);
+    currentNode = null;
   });
   if (!initialized) {
     queueMicrotask(() => {
@@ -1912,11 +1928,17 @@ var componentRegistry = globalSingleton(
   /* @__PURE__ */ Symbol.for("sibujs.components.registry.v1"),
   () => /* @__PURE__ */ new Map()
 );
+var registryVersion = globalSingleton(/* @__PURE__ */ Symbol.for("sibujs.components.registryVersion.v1"), () => signal(0));
+function bumpRegistry() {
+  const [read, write] = registryVersion;
+  write(untracked(read) + 1);
+}
 function registerComponent(name, component) {
   componentRegistry.set(name, component);
+  bumpRegistry();
 }
 function unregisterComponent(name) {
-  componentRegistry.delete(name);
+  if (componentRegistry.delete(name)) bumpRegistry();
 }
 function resolveComponent(name) {
   const component = componentRegistry.get(name);
@@ -1927,14 +1949,21 @@ function resolveComponent(name) {
 }
 function DynamicComponent(is) {
   const container = div({ class: "sibu-dynamic" });
+  const NONE = {};
+  let shown = NONE;
   function render() {
     const target = is();
-    let el;
+    let component;
     if (typeof target === "function") {
-      el = target();
+      component = target;
     } else {
-      el = resolveComponent(target);
+      registryVersion[0]();
+      component = componentRegistry.get(target);
     }
+    const next = component ?? `missing:${target}`;
+    if (next === shown) return;
+    const el = untracked(() => component ? component() : div(`[Component "${target}" not found]`));
+    shown = next;
     replaceChildrenSafely(container, el);
   }
   const untrack = track(render);
@@ -2198,31 +2227,29 @@ function Fragment(nodes) {
     if (Array.isArray(child)) {
       for (const nested of child) {
         if (nested == null || typeof nested === "boolean") continue;
-        frag.appendChild(resolveChild(nested));
+        appendChild(frag, nested);
       }
     } else {
-      frag.appendChild(resolveChild(child));
+      appendChild(frag, child);
     }
   }
   return frag;
 }
-function resolveChild(child) {
-  if (child == null) {
-    return document.createTextNode("");
-  }
+function appendChild(frag, child) {
   if (child instanceof Node) {
-    return child;
+    frag.appendChild(child);
+    return;
   }
   if (typeof child === "function") {
-    const result = child();
-    if (result instanceof Node) return result;
-    return document.createTextNode(String(result ?? ""));
+    const placeholder = document.createComment("");
+    frag.appendChild(placeholder);
+    registerDisposer(placeholder, bindChildNode(placeholder, child));
+    return;
   }
-  return document.createTextNode(String(child));
+  frag.appendChild(document.createTextNode(String(child)));
 }
 
 // src/core/rendering/htm.ts
-var RAW_TEXT_TAGS = /* @__PURE__ */ new Set(["script", "style"]);
 var VOID_ELEMENTS = /* @__PURE__ */ new Set([
   "area",
   "base",
@@ -2445,7 +2472,7 @@ function parseTemplate(strings) {
           children.push({ t: 0, el: { tag, svg: SVG_TAGS.has(tag), attrs, children: [] } });
         } else {
           const inner = parseChildren();
-          if (RAW_TEXT_TAGS.has(tag.toLowerCase())) {
+          if (isCodeTextElement(tag)) {
             for (let i2 = 0; i2 < inner.length; i2++) {
               if (inner[i2].t === 2) {
                 throw new Error(
@@ -2476,7 +2503,7 @@ function executeElement(tmpl, values) {
     const attr = tmpl.attrs[i2];
     switch (attr.t) {
       case 0:
-        el.setAttribute(attr.name, attr.value);
+        setTrustedAttribute(el, attr.name, attr.value);
         break;
       case 1: {
         const name = attr.name;
@@ -2509,7 +2536,7 @@ function executeElement(tmpl, values) {
         break;
       }
       case 4:
-        el.setAttribute(attr.name, "");
+        setTrustedAttribute(el, attr.name, "");
         break;
     }
   }
@@ -2554,6 +2581,12 @@ function html(strings, ...values) {
     tmpl = parseTemplate(strings);
     cache.set(strings, tmpl);
   }
+  return renderTemplate(tmpl, values);
+}
+function __renderParsedTemplate(tree, values) {
+  return renderTemplate(tree, values);
+}
+function renderTemplate(tmpl, values) {
   if (tmpl.length === 1 && tmpl[0].t === 0) {
     return executeElement(tmpl[0].el, values);
   }
@@ -2688,25 +2721,77 @@ function mount(component, container) {
     typeof component === "function" || component instanceof Node,
     "mount: first argument must be a component function or a DOM Node."
   );
-  const startTime = typeof performance !== "undefined" ? performance.now() : 0;
-  const node = typeof component === "function" ? component() : component;
-  const duration = typeof performance !== "undefined" ? performance.now() - startTime : 0;
-  container.appendChild(node);
-  const hook = globalThis.__SIBU_DEVTOOLS_GLOBAL_HOOK__;
-  if (hook) {
-    hook.emit("app:init", { rootElement: node, container, duration });
+  const now = () => typeof performance !== "undefined" ? performance.now() : 0;
+  const startTime = now();
+  let range = null;
+  const attach = (built) => {
+    if (built instanceof DocumentFragment) {
+      const start = document.createComment("");
+      const end = document.createComment("");
+      built.insertBefore(start, built.firstChild);
+      built.appendChild(end);
+      range = { start, end };
+    }
+    container.appendChild(built);
+  };
+  let node;
+  if (typeof component === "function") {
+    node = withDisposerRollback(() => {
+      const built = component();
+      attach(built);
+      return built;
+    });
+  } else {
+    node = component;
+    attach(node);
   }
+  const duration = now() - startTime;
+  const hook = globalThis.__SIBU_DEVTOOLS_GLOBAL_HOOK__;
+  if (hook) emitDevtools(hook, "app:init", { rootElement: node, container, duration });
+  const mounted = range;
   return {
     node,
     unmount() {
-      if (hook) hook.emit("app:unmount", { rootElement: node });
-      dispose(node);
-      if (node.parentNode) {
-        node.parentNode.removeChild(node);
+      if (hook) emitDevtools(hook, "app:unmount", { rootElement: node });
+      if (mounted) {
+        unmountRange(mounted.start, mounted.end);
+        return;
       }
+      dispose(node);
+      node.parentNode?.removeChild(node);
     }
   };
 }
+function unmountRange(start, end) {
+  const parent = start.parentNode;
+  if (!parent && !end.parentNode) return;
+  let budget = MAX_DRAIN_TEARDOWNS;
+  for (let n = start.nextSibling; n && n !== end; n = n.nextSibling) budget++;
+  let before = start;
+  let after = null;
+  let intact = true;
+  for (; ; ) {
+    if (start.parentNode !== parent || end.parentNode !== parent) intact = false;
+    else if (start.previousSibling !== before || end.nextSibling !== after) {
+      before = start.previousSibling;
+      after = end.nextSibling;
+      intact = !!(start.compareDocumentPosition(end) & 4);
+    }
+    const n = start.nextSibling;
+    if (!intact || n === end) break;
+    if (budget-- <= 0) {
+      reportDrainRunaway("mount", MAX_DRAIN_TEARDOWNS, 1);
+      return;
+    }
+    dispose(n);
+    if (n.parentNode === parent) parent.removeChild(n);
+  }
+  if (!intact) {
+    reportError(new Error("[SibuJS mount] fragment markers lost"), { phase: "cleanup", name: "mount" });
+  }
+  start.parentNode?.removeChild(start);
+  end.parentNode?.removeChild(end);
+}
 
 // src/core/rendering/portal.ts
 function Portal(nodes, target) {
@@ -3443,7 +3528,7 @@ function enhance(target, setup) {
           bindNode(el, () => {
             const v = value();
             const next = v == null ? null : String(v);
-            setSafeAttribute(el, name, next, { syncValueProperty: false, label: "enhance attr()" });
+            setSafeAttribute(el, name, next, { syncValueProperty: false, label: "enhance attr()", reactive: true });
           })
         );
       });
@@ -3830,6 +3915,7 @@ export {
   each,
   Fragment,
   html,
+  __renderParsedTemplate,
   KeepAlive,
   mount,
   Portal,

package/dist/{chunk-ORMZXBKQ.js → chunk-JUTFX2RM.js}

@@ -6,25 +6,25 @@ import {
 import {
   div,
   span
-} from "./chunk-JSXPZCET.js";
+} from "./chunk-Q5J2LVKH.js";
 import {
   STATIC_VALUE_RESOLVER,
   planHeadElementEntry,
   planMetaEntry
-} from "./chunk-HURREPU2.js";
-import {
-  sanitizeUrl
-} from "./chunk-2INLLLMZ.js";
+} from "./chunk-FC6KCJSA.js";
 import {
   globalSingleton
 } from "./chunk-7ZHH77QA.js";
 import {
   effect
-} from "./chunk-XC4MEKGA.js";
+} from "./chunk-V3LHZSU5.js";
+import {
+  sanitizeUrl
+} from "./chunk-EXXSN3BW.js";
 import {
   batch,
   signal
-} from "./chunk-D33YTSX5.js";
+} from "./chunk-DSID757X.js";
 import {
   registerDisposer,
   replaceChildrenSafely,
@@ -179,7 +179,16 @@ function toError(err) {
   if (err !== null && typeof err === "object" && "name" in err && "message" in err) return err;
   return new Error(String(err));
 }
+function workerSource(fn, api) {
+  if (typeof fn !== "function") {
+    throw new TypeError(
+      `${api}: expected a function, got ${typeof fn}. Worker code must be a function defined in your source \u2014 a string would be evaluated as code.`
+    );
+  }
+  return Function.prototype.toString.call(fn);
+}
 function worker(workerFn2) {
+  const fnBody = workerSource(workerFn2, "worker");
   const [result, setResult] = signal(null);
   const [error, setError] = signal(null);
   const [loading, setLoading] = signal(false);
@@ -195,7 +204,6 @@ function worker(workerFn2) {
     if (typeof Worker === "undefined") {
       throw new Error("Web Workers are not supported in this environment");
     }
-    const fnBody = workerFn2.toString();
     const blob = new Blob([`self.onmessage = ${fnBody};`], { type: "application/javascript" });
     blobUrl = URL.createObjectURL(blob);
     worker2 = new Worker(blobUrl);
@@ -244,6 +252,7 @@ function worker(workerFn2) {
   return { post, result, error, loading, terminate };
 }
 function workerFn(fn) {
+  const fnStr = workerSource(fn, "workerFn");
   const [loading, setLoading] = signal(false);
   let worker2 = null;
   let blobUrl = null;
@@ -258,7 +267,6 @@ function workerFn(fn) {
     if (typeof Worker === "undefined") {
       throw new Error("Web Workers are not supported in this environment");
     }
-    const fnStr = fn.toString();
     const blob = new Blob(
       [
         `self.onmessage = function(e) {
@@ -318,6 +326,7 @@ function workerFn(fn) {
   return { run, loading, terminate };
 }
 function createWorkerPool(workerFn2, poolSize) {
+  const fnBody = workerSource(workerFn2, "createWorkerPool");
   const size = poolSize || typeof navigator !== "undefined" && navigator.hardwareConcurrency || 4;
   const workers = [];
   const queues = [];
@@ -376,7 +385,6 @@ function createWorkerPool(workerFn2, poolSize) {
     if (typeof Worker === "undefined") {
       throw new Error("Web Workers are not supported in this environment");
     }
-    const fnBody = workerFn2.toString();
     const blob = new Blob([`self.onmessage = ${fnBody};`], { type: "application/javascript" });
     blobUrl = URL.createObjectURL(blob);
     for (let i = 0; i < size; i++) {

package/dist/{chunk-QE4TTDU3.js → chunk-KJ3UKABJ.js}

@@ -1,10 +1,11 @@
 import {
   cleanup,
+  emitDevtools,
   isTrackingSuspended,
   recordDependency,
   retrack,
   track
-} from "./chunk-5Q4R7HCL.js";
+} from "./chunk-TQQUN4WR.js";
 import {
   devAssert
 } from "./chunk-NYNYSPK7.js";
@@ -35,17 +36,17 @@ function derived(getter, options) {
     cs._d = false;
     cs._init = true;
   };
-  track(() => {
-    let threw = true;
-    try {
+  try {
+    track(() => {
       cs._v = getter();
       cs._d = false;
       cs._init = true;
-      threw = false;
-    } finally {
-      if (threw) cs._d = true;
-    }
-  }, markDirty);
+    }, markDirty);
+  } catch (err) {
+    disposed = true;
+    cleanup(markDirty);
+    throw err;
+  }
   const hook = globalThis.__SIBU_DEVTOOLS_GLOBAL_HOOK__;
   const validate = () => {
     if (!cs._d || disposed || pendingError !== void 0) return;
@@ -64,7 +65,7 @@ function derived(getter, options) {
       if (disposed) cleanup(markDirty);
     }
     if (hook && !disposed && !Object.is(oldValue, cs._v)) {
-      hook.emit("computed:update", { signal: cs, oldValue, newValue: cs._v });
+      emitDevtools(hook, "computed:update", { signal: cs, oldValue, newValue: cs._v });
     }
   };
   cs._validate = validate;
@@ -115,7 +116,7 @@ function derived(getter, options) {
       }
     }
   };
-  if (hook) hook.emit("computed:create", { signal: cs, name: debugName, getter: computedGetter });
+  if (hook) emitDevtools(hook, "computed:create", { signal: cs, name: debugName, getter: computedGetter });
   return computedGetter;
 }
 

package/dist/{chunk-XRRZKZYX.js → chunk-LI4W3U6C.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-5HZXGZ6T.js";
 import {
   signal
-} from "./chunk-D33YTSX5.js";
+} from "./chunk-DSID757X.js";
 import {
   registerDisposer,
   reportError