sibujs 1.1.0 → 1.3.0

package/dist/plugins.cjs

@@ -42,11 +42,40 @@ var init_dev = __esm({
   }
 });
 
+// src/utils/sanitize.ts
+function sanitizeUrl(url) {
+  const trimmed = url.replace(/[\x00-\x20\x7f-\x9f]+/g, "").trim();
+  if (!trimmed) return "";
+  const lower = trimmed.toLowerCase();
+  if (lower.startsWith("javascript:") || lower.startsWith("data:") || lower.startsWith("vbscript:") || lower.startsWith("blob:")) {
+    return "";
+  }
+  return trimmed;
+}
+function sanitizeCSSValue(value) {
+  const lower = value.toLowerCase().replace(/\s+/g, "");
+  if (lower.includes("url(") || lower.includes("expression(") || lower.includes("javascript:") || lower.includes("-moz-binding")) {
+    return "";
+  }
+  return value;
+}
+function isUrlAttribute(attr) {
+  return URL_ATTRIBUTES.has(attr);
+}
+var URL_ATTRIBUTES;
+var init_sanitize = __esm({
+  "src/utils/sanitize.ts"() {
+    "use strict";
+    URL_ATTRIBUTES = /* @__PURE__ */ new Set(["href", "src", "action", "formaction", "cite", "poster", "background", "srcset"]);
+  }
+});
+
 // src/platform/ssr.ts
 var ssr_exports = {};
 __export(ssr_exports, {
   collectStream: () => collectStream,
   deserializeState: () => deserializeState,
+  escapeScriptJson: () => escapeScriptJson,
   hydrate: () => hydrate,
   hydrateIslands: () => hydrateIslands,
   hydrateProgressively: () => hydrateProgressively,
@@ -62,12 +91,24 @@ __export(ssr_exports, {
   suspenseSwapScript: () => suspenseSwapScript,
   trustHTML: () => trustHTML
 });
+function isSafeAttrName(name) {
+  return SAFE_ATTR_NAME.test(name);
+}
+function isEventHandlerAttr2(name) {
+  if (name.length < 3) return false;
+  const lower = name.toLowerCase();
+  return lower[0] === "o" && lower[1] === "n" && lower.charCodeAt(2) >= 97 && lower.charCodeAt(2) <= 122;
+}
 function ssrErrorComment(err) {
   if (_isDev7) {
-    return `<!--SSR error: ${escapeHtml(err instanceof Error ? err.message : String(err))}-->`;
+    const msg = escapeHtml(err instanceof Error ? err.message : String(err));
+    return `<!--SSR error: ${safeCommentText(msg)}-->`;
   }
   return "<!--SSR error-->";
 }
+function safeCommentText(text2) {
+  return text2.replace(/-->/g, "--&gt;").replace(/--!>/g, "--!&gt;").replace(/<!--/g, "&lt;!--").replace(/--$/g, "--&#45;");
+}
 function renderToString(element) {
   if (element instanceof DocumentFragment) {
     return Array.from(element.childNodes).map((child) => {
@@ -82,16 +123,30 @@ function renderToString(element) {
     return escapeHtml(element.textContent || "");
   }
   if (element.nodeType === 8) {
-    const content = (element.textContent || "").replace(/-->/g, "--&gt;");
-    return `<!--${content}-->`;
+    return `<!--${safeCommentText(element.textContent || "")}-->`;
   }
   if (!(element instanceof HTMLElement)) {
-    return element.textContent || "";
+    return escapeHtml(element.textContent || "");
   }
   const tag = element.tagName.toLowerCase();
+  if (tag === "script" || tag === "style") {
+    return _isDev7 ? `<!--ssr:${tag}-stripped-->` : "";
+  }
+  if (!/^[a-z][a-z0-9-]*$/i.test(tag)) {
+    return _isDev7 ? "<!--ssr:invalid-tag-->" : "";
+  }
   let html2 = `<${tag}`;
   for (const attr of Array.from(element.attributes)) {
-    html2 += ` ${attr.name}="${escapeAttr(attr.value)}"`;
+    const rawName = attr.name;
+    if (!isSafeAttrName(rawName)) continue;
+    if (isEventHandlerAttr2(rawName)) continue;
+    const lowerName = rawName.toLowerCase();
+    let value = attr.value;
+    if (URL_ATTRS.has(lowerName)) {
+      value = sanitizeUrl(value);
+      if (!value) continue;
+    }
+    html2 += ` ${rawName}="${escapeAttr(value)}"`;
   }
   if (element.dataset && !element.dataset.sibuHydrate) {
     html2 += ` data-sibu-ssr="true"`;
@@ -110,8 +165,25 @@ function renderToString(element) {
   html2 += `</${tag}>`;
   return html2;
 }
-function hydrate(component, container) {
+function hydrate(component, container, options = {}) {
   const clientTree = component();
+  if (options.diagnostics) {
+    const mismatches = [];
+    collectMismatches(container.firstElementChild, clientTree, "", mismatches);
+    if (mismatches.length > 0) {
+      const first = mismatches[0];
+      if (options.onMismatch) {
+        options.onMismatch(first);
+      } else if (_isDev7) {
+        console.warn(
+          `[Sibu hydration] ${first.message}
+  at ${first.path}
+  server: ${first.serverValue}
+  client: ${first.clientValue}`
+        );
+      }
+    }
+  }
   hydrateNode(container.firstElementChild, clientTree);
   container.setAttribute("data-sibu-hydrated", "true");
 }
@@ -123,9 +195,119 @@ function hydrateNode(serverNode, clientNode) {
     hydrateNode(serverChildren[i2], clientChildren[i2]);
   }
 }
+function collectMismatches(serverNode, clientNode, path2, out, max = 5) {
+  if (out.length >= max) return;
+  const nodePath = path2 || clientNode?.tagName?.toLowerCase() || "(root)";
+  if (!serverNode && clientNode) {
+    out.push({
+      kind: "child-count",
+      path: nodePath,
+      serverValue: "(missing)",
+      clientValue: clientNode.tagName.toLowerCase(),
+      message: "Client rendered a node that the server did not emit."
+    });
+    return;
+  }
+  if (serverNode && !clientNode) {
+    out.push({
+      kind: "child-count",
+      path: nodePath,
+      serverValue: serverNode.tagName.toLowerCase(),
+      clientValue: "(missing)",
+      message: "Server rendered a node that the client did not produce."
+    });
+    return;
+  }
+  if (!serverNode || !clientNode) return;
+  if (serverNode.tagName !== clientNode.tagName) {
+    out.push({
+      kind: "tag",
+      path: nodePath,
+      serverValue: serverNode.tagName.toLowerCase(),
+      clientValue: clientNode.tagName.toLowerCase(),
+      message: "Element tag mismatch \u2014 server and client disagree on the element type."
+    });
+    return;
+  }
+  const skipAttrs = /* @__PURE__ */ new Set(["data-sibu-ssr", "data-sibu-hydrated", "data-sibu-island"]);
+  const serverAttrs = /* @__PURE__ */ new Map();
+  for (const a2 of Array.from(serverNode.attributes)) {
+    if (!skipAttrs.has(a2.name)) serverAttrs.set(a2.name, a2.value);
+  }
+  const clientAttrs = /* @__PURE__ */ new Map();
+  for (const a2 of Array.from(clientNode.attributes)) {
+    if (!skipAttrs.has(a2.name)) clientAttrs.set(a2.name, a2.value);
+  }
+  for (const [name, value] of serverAttrs) {
+    if (out.length >= max) return;
+    if (!clientAttrs.has(name)) {
+      out.push({
+        kind: "attribute",
+        path: `${nodePath}[${name}]`,
+        serverValue: value,
+        clientValue: "(missing)",
+        message: `Attribute "${name}" present on server but missing on client.`
+      });
+    } else if (clientAttrs.get(name) !== value) {
+      out.push({
+        kind: "attribute",
+        path: `${nodePath}[${name}]`,
+        serverValue: value,
+        clientValue: clientAttrs.get(name) ?? "",
+        message: `Attribute "${name}" differs between server and client.`
+      });
+    }
+  }
+  for (const [name, value] of clientAttrs) {
+    if (out.length >= max) return;
+    if (!serverAttrs.has(name)) {
+      out.push({
+        kind: "attribute",
+        path: `${nodePath}[${name}]`,
+        serverValue: "(missing)",
+        clientValue: value,
+        message: `Attribute "${name}" present on client but missing on server.`
+      });
+    }
+  }
+  const serverChildren = Array.from(serverNode.children);
+  const clientChildren = Array.from(clientNode.children);
+  const max2 = Math.max(serverChildren.length, clientChildren.length);
+  for (let i2 = 0; i2 < max2; i2++) {
+    if (out.length >= max) return;
+    const childPath = `${nodePath} > ${clientChildren[i2]?.tagName?.toLowerCase() ?? serverChildren[i2]?.tagName?.toLowerCase() ?? "?"}:nth-child(${i2 + 1})`;
+    collectMismatches(serverChildren[i2] ?? null, clientChildren[i2] ?? null, childPath, out, max);
+  }
+}
 function trustHTML(html2) {
   return html2;
 }
+function buildAttrString(attrs, { allowEventHandlers = false } = {}) {
+  if (!attrs) return "";
+  const out = [];
+  for (const rawKey of Object.keys(attrs)) {
+    if (!Object.hasOwn(attrs, rawKey)) continue;
+    if (!isSafeAttrName(rawKey)) continue;
+    if (!allowEventHandlers && isEventHandlerAttr2(rawKey)) continue;
+    const lowerKey = rawKey.toLowerCase();
+    let value = String(attrs[rawKey]);
+    if (URL_ATTRS.has(lowerKey)) {
+      value = sanitizeUrl(value);
+      if (!value) continue;
+    }
+    out.push(`${rawKey}="${escapeAttr(value)}"`);
+  }
+  return out.join(" ");
+}
+function isDangerousMetaRefresh(metaProps) {
+  const httpEquiv = metaProps["http-equiv"];
+  if (typeof httpEquiv !== "string") return false;
+  if (httpEquiv.toLowerCase() !== "refresh") return false;
+  const content = metaProps.content;
+  if (typeof content !== "string") return false;
+  const normalized = content.replace(/[\x00-\x20\x7f-\x9f]+/g, "").toLowerCase();
+  return normalized.includes("url=javascript:") || normalized.includes("url=data:") || normalized.includes("url=vbscript:") || normalized.includes("url=blob:");
+}
 function renderToDocument(component, options = {}) {
   let content;
   try {
@@ -133,14 +315,22 @@ function renderToDocument(component, options = {}) {
   } catch (err) {
     content = ssrErrorComment(err);
   }
-  const metaTags = (options.meta || []).map(
-    (attrs) => `<meta ${Object.entries(attrs).map(([k, v]) => `${k}="${escapeAttr(v)}"`).join(" ")} />`
-  ).join("\n    ");
-  const linkTags = (options.links || []).map(
-    (attrs) => `<link ${Object.entries(attrs).map(([k, v]) => `${k}="${escapeAttr(v)}"`).join(" ")} />`
-  ).join("\n    ");
-  const scriptTags = (options.scripts || []).map((src) => `<script src="${escapeAttr(src)}"></script>`).join("\n    ");
-  const bodyAttrs = options.bodyAttrs ? " " + Object.entries(options.bodyAttrs).map(([k, v]) => `${k}="${escapeAttr(v)}"`).join(" ") : "";
+  const metaTags = (options.meta || []).map((attrs) => {
+    if (isDangerousMetaRefresh(attrs)) return "";
+    const pairs = buildAttrString(attrs);
+    return pairs ? `<meta ${pairs} />` : "";
+  }).filter(Boolean).join("\n    ");
+  const linkTags = (options.links || []).map((attrs) => {
+    const pairs = buildAttrString(attrs);
+    return pairs ? `<link ${pairs} />` : "";
+  }).filter(Boolean).join("\n    ");
+  const scriptTags = (options.scripts || []).map((src) => {
+    const safe = sanitizeUrl(String(src));
+    if (!safe) return "";
+    return `<script src="${escapeAttr(safe)}"></script>`;
+  }).filter(Boolean).join("\n    ");
+  const bodyAttrPairs = buildAttrString(options.bodyAttrs);
+  const bodyAttrs = bodyAttrPairs ? ` ${bodyAttrPairs}` : "";
   return `<!DOCTYPE html>
 <html>
   <head>
@@ -173,18 +363,34 @@ async function* renderToStream(element) {
     return;
   }
   if (element.nodeType === 8) {
-    const content = (element.textContent || "").replace(/-->/g, "--&gt;");
-    yield `<!--${content}-->`;
+    yield `<!--${safeCommentText(element.textContent || "")}-->`;
     return;
   }
   if (!(element instanceof HTMLElement)) {
-    yield element.textContent || "";
+    yield escapeHtml(element.textContent || "");
     return;
   }
   const tag = element.tagName.toLowerCase();
+  if (tag === "script" || tag === "style") {
+    if (_isDev7) yield `<!--ssr:${tag}-stripped-->`;
+    return;
+  }
+  if (!/^[a-z][a-z0-9-]*$/i.test(tag)) {
+    if (_isDev7) yield "<!--ssr:invalid-tag-->";
+    return;
+  }
   let openTag = `<${tag}`;
   for (const attr of Array.from(element.attributes)) {
-    openTag += ` ${attr.name}="${escapeAttr(attr.value)}"`;
+    const rawName = attr.name;
+    if (!isSafeAttrName(rawName)) continue;
+    if (isEventHandlerAttr2(rawName)) continue;
+    const lowerName = rawName.toLowerCase();
+    let value = attr.value;
+    if (URL_ATTRS.has(lowerName)) {
+      value = sanitizeUrl(value);
+      if (!value) continue;
+    }
+    openTag += ` ${rawName}="${escapeAttr(value)}"`;
   }
   if (VOID_ELEMENTS.has(tag)) {
     yield `${openTag} />`;
@@ -232,8 +438,9 @@ function hydrateIslands(container, islands) {
   const markers = container.querySelectorAll("[data-sibu-island]");
   for (const marker2 of Array.from(markers)) {
     const id = marker2.getAttribute("data-sibu-island") ?? "";
+    if (!Object.hasOwn(islands, id)) continue;
     const factory = islands[id];
-    if (!factory) continue;
+    if (typeof factory !== "function") continue;
     const clientTree = factory();
     hydrateNode(marker2, clientTree);
     marker2.setAttribute("data-sibu-hydrated", "true");
@@ -245,8 +452,9 @@ function hydrateProgressively(container, islands, options) {
   const cleanups = [];
   for (const marker2 of Array.from(markers)) {
     const id = marker2.getAttribute("data-sibu-island") ?? "";
+    if (!Object.hasOwn(islands, id)) continue;
     const factory = islands[id];
-    if (!factory) continue;
+    if (typeof factory !== "function") continue;
     const observer = new IntersectionObserver(
       (entries) => {
         for (const entry of entries) {
@@ -285,22 +493,30 @@ function ssrSuspense(props) {
   return { element: wrapper, promise };
 }
 function suspenseSwapScript(id, nonce) {
-  const safeId = id.replace(/\\/g, "\\\\").replace(/"/g, '\\"').replace(/</g, "\\u003c").replace(/>/g, "\\u003e");
+  if (!SAFE_SUSPENSE_ID.test(id)) {
+    throw new Error(
+      `[SibuJS SSR] suspenseSwapScript: id must match [A-Za-z0-9_-]+ (got: ${JSON.stringify(id.slice(0, 32))})`
+    );
+  }
   const nonceAttr = nonce ? ` nonce="${escapeAttr(nonce)}"` : "";
-  return `<script${nonceAttr}>(function(){var t=document.getElementById("sibu-resolved-${safeId}");var f=document.querySelector('[data-sibu-suspense-id="${safeId}"]');if(t&&f){while(t.firstChild)f.appendChild(t.firstChild);t.remove();f.removeAttribute("data-sibu-suspense-id");}})()</script>`;
+  return `<script${nonceAttr}>(function(){var t=document.getElementById("sibu-resolved-${id}");var f=document.querySelector('[data-sibu-suspense-id="${id}"]');if(t&&f){while(t.firstChild)f.appendChild(t.firstChild);t.remove();f.removeAttribute("data-sibu-suspense-id");}})()</script>`;
 }
-async function* renderToSuspenseStream(element, pendingBoundaries = []) {
+async function* renderToSuspenseStream(element, pendingBoundaries = [], options) {
   yield* renderToStream(element);
   if (pendingBoundaries.length > 0) {
     const resolved = await Promise.all(pendingBoundaries);
     for (const { id, html: html2 } of resolved) {
-      yield `<div hidden id="sibu-resolved-${escapeAttr(id)}">${html2}</div>`;
-      yield suspenseSwapScript(id);
+      if (!SAFE_SUSPENSE_ID.test(id)) continue;
+      yield `<div hidden id="sibu-resolved-${id}">${html2}</div>`;
+      yield suspenseSwapScript(id, options?.nonce);
     }
   }
 }
+function escapeScriptJson(json) {
+  return json.replace(/</g, "\\u003c").replace(/>/g, "\\u003e").replace(/&/g, "\\u0026").replace(/\u2028/g, "\\u2028").replace(/\u2029/g, "\\u2029");
+}
 function serializeState(state, nonce) {
-  const json = JSON.stringify(state).replace(/</g, "\\u003c").replace(/>/g, "\\u003e").replace(/&/g, "\\u0026");
+  const json = escapeScriptJson(JSON.stringify(state));
   const nonceAttr = nonce ? ` nonce="${escapeAttr(nonce)}"` : "";
   return `<script${nonceAttr}>window.${SSR_DATA_ATTR}=${json}</script>`;
 }
@@ -315,14 +531,30 @@ function escapeHtml(str) {
   return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 }
 function escapeAttr(str) {
-  return str.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+  return str.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/'/g, "&#39;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 }
-var _isDev7, VOID_ELEMENTS, suspenseIdCounter, SSR_DATA_ATTR;
+var _isDev7, SAFE_ATTR_NAME, URL_ATTRS, VOID_ELEMENTS, suspenseIdCounter, SAFE_SUSPENSE_ID, SSR_DATA_ATTR;
 var init_ssr = __esm({
   "src/platform/ssr.ts"() {
     "use strict";
     init_dev();
+    init_sanitize();
     _isDev7 = isDev();
+    SAFE_ATTR_NAME = /^[A-Za-z_:][-A-Za-z0-9_.:]*$/;
+    URL_ATTRS = /* @__PURE__ */ new Set([
+      "href",
+      "src",
+      "action",
+      "formaction",
+      "cite",
+      "poster",
+      "background",
+      "srcset",
+      "ping",
+      "manifest",
+      "data",
+      "xlink:href"
+    ]);
     VOID_ELEMENTS = /* @__PURE__ */ new Set([
       "area",
       "base",
@@ -340,6 +572,7 @@ var init_ssr = __esm({
       "wbr"
     ]);
     suspenseIdCounter = 0;
+    SAFE_SUSPENSE_ID = /^[A-Za-z0-9_-]+$/;
     SSR_DATA_ATTR = "__SIBU_SSR_DATA__";
   }
 });
@@ -424,28 +657,7 @@ module.exports = __toCommonJS(plugins_exports);
 
 // src/reactivity/bindAttribute.ts
 init_dev();
-
-// src/utils/sanitize.ts
-function sanitizeUrl(url) {
-  const trimmed = url.replace(/[\x00-\x20\x7f-\x9f]+/g, "").trim();
-  if (!trimmed) return "";
-  const lower = trimmed.toLowerCase();
-  if (lower.startsWith("javascript:") || lower.startsWith("data:") || lower.startsWith("vbscript:") || lower.startsWith("blob:")) {
-    return "";
-  }
-  return trimmed;
-}
-function sanitizeCSSValue(value) {
-  const lower = value.toLowerCase().replace(/\s+/g, "");
-  if (lower.includes("url(") || lower.includes("expression(") || lower.includes("javascript:") || lower.includes("-moz-binding")) {
-    return "";
-  }
-  return value;
-}
-var URL_ATTRIBUTES = /* @__PURE__ */ new Set(["href", "src", "action", "formaction", "cite", "poster", "background", "srcset"]);
-function isUrlAttribute(attr) {
-  return URL_ATTRIBUTES.has(attr);
-}
+init_sanitize();
 
 // src/reactivity/track.ts
 init_dev();
@@ -655,7 +867,20 @@ function cleanup(subscriber) {
 
 // src/reactivity/bindAttribute.ts
 var _isDev3 = isDev();
+function isEventHandlerAttr(name) {
+  if (name.length < 3) return false;
+  const lower = name.toLowerCase();
+  return lower[0] === "o" && lower[1] === "n" && lower.charCodeAt(2) >= 97 && lower.charCodeAt(2) <= 122;
+}
 function bindAttribute(el, attr, getter) {
+  if (isEventHandlerAttr(attr)) {
+    if (_isDev3)
+      devWarn(
+        `bindAttribute: refusing to bind event-handler attribute "${attr}". Use on:{ ${attr.slice(2)}: fn } instead.`
+      );
+    return () => {
+    };
+  }
   function commit() {
     let value;
     try {
@@ -699,11 +924,11 @@ function bindChildNode(placeholder, getter) {
       if (_isDev4) devWarn(`bindChildNode: getter threw: ${err instanceof Error ? err.message : String(err)}`);
       return;
     }
-    for (let i2 = 0; i2 < lastNodes.length; i2++) {
-      const node = lastNodes[i2];
-      if (node.parentNode) node.parentNode.removeChild(node);
-    }
     if (result == null || typeof result === "boolean") {
+      for (let i2 = 0; i2 < lastNodes.length; i2++) {
+        const node = lastNodes[i2];
+        if (node.parentNode) node.parentNode.removeChild(node);
+      }
       lastNodes.length = 0;
       return;
     }
@@ -712,28 +937,53 @@ function bindChildNode(placeholder, getter) {
       lastNodes.length = 0;
       return;
     }
-    const anchor = placeholder.nextSibling;
-    let count = 0;
+    let newNodes;
     if (Array.isArray(result)) {
-      if (lastNodes.length < result.length) lastNodes = new Array(result.length);
+      newNodes = [];
       for (let i2 = 0; i2 < result.length; i2++) {
         const item = result[i2];
         if (item == null || typeof item === "boolean") continue;
-        const node = item instanceof Node ? item : document.createTextNode(String(item));
-        parent.insertBefore(node, anchor);
-        lastNodes[count++] = node;
+        newNodes.push(item instanceof Node ? item : document.createTextNode(String(item)));
       }
     } else {
-      if (lastNodes.length < 1) lastNodes = [null];
       const node = result instanceof Node ? result : document.createTextNode(String(result));
-      parent.insertBefore(node, anchor);
-      lastNodes[count++] = node;
+      newNodes = [node];
+    }
+    const reused = lastNodes.length > 0 && newNodes.length > 0 ? /* @__PURE__ */ new Set() : void 0;
+    if (reused) {
+      for (let i2 = 0; i2 < newNodes.length; i2++) {
+        for (let j = 0; j < lastNodes.length; j++) {
+          if (newNodes[i2] === lastNodes[j]) {
+            reused.add(newNodes[i2]);
+            break;
+          }
+        }
+      }
+    }
+    for (let i2 = 0; i2 < lastNodes.length; i2++) {
+      const node = lastNodes[i2];
+      if (reused?.has(node)) continue;
+      if (node.parentNode) node.parentNode.removeChild(node);
+    }
+    const anchor = placeholder.nextSibling;
+    for (let i2 = 0; i2 < newNodes.length; i2++) {
+      const node = newNodes[i2];
+      if (reused?.has(node) && node.parentNode === parent) {
+        if (node.nextSibling !== anchor) {
+          parent.insertBefore(node, anchor);
+        }
+      } else {
+        parent.insertBefore(node, anchor);
+      }
     }
-    lastNodes.length = count;
+    lastNodes = newNodes;
   }
   return track(commit);
 }
 
+// src/core/rendering/tagFactory.ts
+init_sanitize();
+
 // src/core/rendering/dispose.ts
 init_dev();
 var elementDisposers = /* @__PURE__ */ new WeakMap();
@@ -899,16 +1149,20 @@ function appendChildren(el, nodes) {
 var tagFactory = (tag, ns) => (first, second) => {
   const el = ns ? document.createElementNS(ns, tag) : document.createElement(tag);
   if (first === void 0) return el;
-  if (second === void 0 && typeof first === "string") {
+  if (typeof first === "string") {
+    if (second !== void 0) {
+      el.setAttribute("class", first);
+      appendChildren(el, second);
+      return el;
+    }
     el.textContent = first;
     return el;
   }
-  if (second !== void 0) {
-    el.setAttribute("class", first);
-    appendChildren(el, second);
+  if (typeof first === "number") {
+    el.textContent = String(first);
     return el;
   }
-  if (Array.isArray(first) || first instanceof Node) {
+  if (Array.isArray(first) || first instanceof Node || typeof first === "function") {
     appendChildren(el, first);
     return el;
   }
@@ -917,7 +1171,7 @@ var tagFactory = (tag, ns) => (first, second) => {
   if (pClass != null) applyClass(el, pClass);
   const pId = props.id;
   if (pId != null) el.id = pId;
-  const pNodes = props.nodes;
+  const pNodes = second !== void 0 ? second : props.nodes;
   if (pNodes != null) appendChildren(el, pNodes);
   const pOn = props.on;
   if (pOn) {
@@ -942,12 +1196,18 @@ var tagFactory = (tag, ns) => (first, second) => {
       // already handled above / below
       default: {
         const value = props[key];
-        if (value == null || value === false) continue;
+        if (value == null) continue;
         if (key[0] === "o" && key[1] === "n") continue;
         if (typeof value === "function") {
           registerDisposer(el, bindAttribute(el, key, value));
-        } else if (value === true) {
-          el.setAttribute(key, "");
+        } else if (typeof value === "boolean") {
+          if (key in el && (key === "checked" || key === "disabled" || key === "selected")) {
+            el[key] = value;
+          } else if (value) {
+            el.setAttribute(key, "");
+          } else {
+            el.removeAttribute(key);
+          }
         } else {
           const str = String(value);
           el.setAttribute(key, isUrlAttribute(key) ? sanitizeUrl(str) : str);
@@ -1217,6 +1477,11 @@ function effect(effectFn, options) {
 }
 
 // src/plugins/router.ts
+init_sanitize();
+function isSafeNavigationTarget(path2) {
+  if (path2 === "") return true;
+  return sanitizeUrl(path2) !== "";
+}
 var LRUCache = class {
   constructor(maxSize = 100) {
     this.cache = /* @__PURE__ */ new Map();
@@ -1702,6 +1967,11 @@ var _SibuRouter = class _SibuRouter {
     try {
       await this.navigator.navigate(async (signal2) => {
         const targetPath = this.resolvePath(to);
+        if (!isSafeNavigationTarget(targetPath)) {
+          const from2 = this.currentRouteGetter();
+          const toContext2 = this.createRouteContext(targetPath);
+          throw new NavigationFailureError("aborted", from2, toContext2);
+        }
         const from = this.currentRouteGetter();
         const toContext = this.createRouteContext(targetPath);
         if (this.isSameRoute(from, toContext)) {
@@ -1731,6 +2001,9 @@ var _SibuRouter = class _SibuRouter {
     const beforeEachResult = await this.guards.runBeforeEach(to, from, signal2);
     if (beforeEachResult !== true) {
       if (typeof beforeEachResult === "string") {
+        if (!isSafeNavigationTarget(beforeEachResult)) {
+          throw new NavigationFailureError("aborted", from, to);
+        }
         return this.performNavigation(this.createRouteContext(beforeEachResult), from, options, signal2, depth + 1);
       }
       throw new NavigationFailureError("aborted", from, to);
@@ -1746,6 +2019,9 @@ var _SibuRouter = class _SibuRouter {
             const result = await guard(to, from);
             if (result !== true) {
               if (typeof result === "string") {
+                if (!isSafeNavigationTarget(result)) {
+                  throw new NavigationFailureError("aborted", from, to);
+                }
                 return this.performNavigation(this.createRouteContext(result), from, options, signal2, depth + 1);
               }
               throw new NavigationFailureError("aborted", from, to);
@@ -1760,12 +2036,18 @@ var _SibuRouter = class _SibuRouter {
             `[SibuJS Router] Redirect to absolute URL "${redirectPath}" detected. Use relative paths for safer redirects.`
           );
         }
+        if (typeof redirectPath === "string" && !isSafeNavigationTarget(redirectPath)) {
+          throw new NavigationFailureError("aborted", from, to);
+        }
         return this.performNavigation(this.createRouteContext(redirectPath), from, options, signal2, depth + 1);
       }
     }
     const beforeResolveResult = await this.guards.runBeforeResolve(to, from, signal2);
     if (beforeResolveResult !== true) {
       if (typeof beforeResolveResult === "string") {
+        if (!isSafeNavigationTarget(beforeResolveResult)) {
+          throw new NavigationFailureError("aborted", from, to);
+        }
         return this.performNavigation(this.createRouteContext(beforeResolveResult), from, options, signal2, depth + 1);
       }
       throw new NavigationFailureError("aborted", from, to);
@@ -1925,13 +2207,31 @@ var NavigationFailureError = class extends Error {
   }
 };
 var globalRouter = null;
+function normalizeRoutes(routes) {
+  return routes.map((route2) => {
+    const normalizedChildren = route2.children && route2.children.length > 0 ? normalizeRoutes(route2.children) : route2.children;
+    if ("lazy" in route2 && typeof route2.lazy === "function") {
+      const { lazy: importFn, ...rest } = route2;
+      const asyncRoute = {
+        ...rest,
+        component: lazy(importFn),
+        children: normalizedChildren
+      };
+      return asyncRoute;
+    }
+    if (normalizedChildren !== route2.children) {
+      return { ...route2, children: normalizedChildren };
+    }
+    return route2;
+  });
+}
 function createRouter(routesOrOptions, options = {}) {
   if (globalRouter) {
     globalRouter.destroy();
   }
   let routes;
   if (Array.isArray(routesOrOptions)) {
-    routes = routesOrOptions;
+    routes = normalizeRoutes(routesOrOptions);
   } else {
     options = routesOrOptions;
     routes = [];
@@ -1941,7 +2241,7 @@ function createRouter(routesOrOptions, options = {}) {
 }
 function setRoutes(routes) {
   if (!globalRouter) throw new Error("Router not initialized. Call createRouter() first.");
-  globalRouter.updateRoutes(routes);
+  globalRouter.updateRoutes(normalizeRoutes(routes));
 }
 function route() {
   if (!globalRouter) throw new Error("Router not initialized. Call createRouter() first.");
@@ -2522,6 +2822,20 @@ function createMemoryRouter(routes, _initialPath = "/") {
 
 // src/plugins/routerSSR.ts
 init_ssr();
+var FORBIDDEN_KEYS = /* @__PURE__ */ new Set(["__proto__", "constructor", "prototype"]);
+function isForbiddenKey(key) {
+  return FORBIDDEN_KEYS.has(key);
+}
+function safeDecode(raw) {
+  try {
+    return decodeURIComponent(raw);
+  } catch {
+    return raw;
+  }
+}
+function nullObject() {
+  return /* @__PURE__ */ Object.create(null);
+}
 function parseURL(url) {
   let remaining = url;
   let hash = "";
@@ -2537,19 +2851,23 @@ function parseURL(url) {
     remaining = remaining.slice(0, queryIndex);
   }
   const path2 = remaining || "/";
-  const query = {};
+  const query = nullObject();
   if (queryString) {
     const pairs = queryString.split("&");
     for (const pair of pairs) {
       if (!pair) continue;
       const eqIndex = pair.indexOf("=");
+      let key;
+      let value;
       if (eqIndex === -1) {
-        query[decodeURIComponent(pair)] = "";
+        key = safeDecode(pair);
+        value = "";
       } else {
-        const key = decodeURIComponent(pair.slice(0, eqIndex));
-        const value = decodeURIComponent(pair.slice(eqIndex + 1));
-        query[key] = value;
+        key = safeDecode(pair.slice(0, eqIndex));
+        value = safeDecode(pair.slice(eqIndex + 1));
       }
+      if (isForbiddenKey(key)) continue;
+      query[key] = value;
     }
   }
   return { path: path2, query, hash };
@@ -2607,10 +2925,12 @@ function matchRoute(path2, routes, parentPath = "", parentChain = []) {
     const compiled = compilePattern(fullPath);
     const match = path2.match(compiled.regex);
     if (match) {
-      const params = {};
+      const params = nullObject();
       for (let i2 = 0; i2 < compiled.keys.length; i2++) {
+        const key = compiled.keys[i2];
+        if (isForbiddenKey(key)) continue;
         if (match[i2 + 1] !== void 0) {
-          params[compiled.keys[i2]] = decodeURIComponent(match[i2 + 1]);
+          params[key] = safeDecode(match[i2 + 1]);
         }
       }
       return {
@@ -2645,7 +2965,7 @@ function resolveServerRouteInternal(url, routes, depth) {
     return {
       route: {
         path: normalizedPath,
-        params: {},
+        params: nullObject(),
         query,
         hash,
         meta: {}
@@ -2705,20 +3025,26 @@ function renderRouteToString(url, routes, _options) {
 function renderRouteToDocument(url, routes, options) {
   const { html: html2, state } = renderRouteToString(url, routes, options);
   const opts = options || {};
-  const metaTags = (opts.meta || []).map(
-    (attrs) => `<meta ${Object.entries(attrs).map(([k, v]) => `${k}="${escapeAttr2(v)}"`).join(" ")} />`
-  ).join("\n    ");
-  const linkTags = (opts.links || []).map(
-    (attrs) => `<link ${Object.entries(attrs).map(([k, v]) => `${k}="${escapeAttr2(v)}"`).join(" ")} />`
-  ).join("\n    ");
-  const scriptTags = (opts.scripts || []).map((src) => `<script src="${escapeAttr2(src)}"></script>`).join("\n    ");
-  const stateScript = serializeRouteState(state);
+  const metaTags = (opts.meta || []).map((attrs) => {
+    const pairs = buildSafeAttrString(attrs);
+    return pairs ? `<meta ${pairs} />` : "";
+  }).filter(Boolean).join("\n    ");
+  const linkTags = (opts.links || []).map((attrs) => {
+    const pairs = buildSafeAttrString(attrs);
+    return pairs ? `<link ${pairs} />` : "";
+  }).filter(Boolean).join("\n    ");
+  const scriptTags = (opts.scripts || []).map((src) => {
+    const safe = sanitizeUrlLocal(String(src));
+    if (!safe) return "";
+    return `<script src="${escapeAttrLocal(safe)}"></script>`;
+  }).filter(Boolean).join("\n    ");
+  const stateScript = serializeRouteState(state, opts.nonce);
   return `<!DOCTYPE html>
 <html>
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    ${opts.title ? `<title>${escapeHtml2(opts.title)}</title>` : ""}
+    ${opts.title ? `<title>${escapeHtmlLocal(opts.title)}</title>` : ""}
     ${metaTags}
     ${linkTags}
     ${opts.headExtra || ""}
@@ -2730,9 +3056,10 @@ function renderRouteToDocument(url, routes, options) {
   </body>
 </html>`;
 }
-function serializeRouteState(state) {
-  const json = JSON.stringify(state).replace(/</g, "\\u003c").replace(/>/g, "\\u003e").replace(/&/g, "\\u0026");
-  return `<script>window.${SSR_ROUTE_STATE_KEY}=${json}</script>`;
+function serializeRouteState(state, nonce) {
+  const json = escapeScriptJson(JSON.stringify(state));
+  const nonceAttr = nonce ? ` nonce="${escapeAttrLocal(nonce)}"` : "";
+  return `<script${nonceAttr}>window.${SSR_ROUTE_STATE_KEY}=${json}</script>`;
 }
 function deserializeRouteState() {
   if (typeof window === "undefined") return void 0;
@@ -2770,11 +3097,59 @@ function createSSRRouter(routes) {
     }
   };
 }
-function escapeHtml2(str) {
+var SAFE_ATTR_NAME2 = /^[A-Za-z_:][-A-Za-z0-9_.:]*$/;
+function isSafeAttrName2(name) {
+  return SAFE_ATTR_NAME2.test(name);
+}
+function isEventHandlerAttr3(name) {
+  if (name.length < 3) return false;
+  const lower = name.toLowerCase();
+  return lower[0] === "o" && lower[1] === "n" && lower.charCodeAt(2) >= 97 && lower.charCodeAt(2) <= 122;
+}
+var URL_ATTRS2 = /* @__PURE__ */ new Set([
+  "href",
+  "src",
+  "action",
+  "formaction",
+  "cite",
+  "poster",
+  "background",
+  "srcset",
+  "ping",
+  "manifest",
+  "data",
+  "xlink:href"
+]);
+function sanitizeUrlLocal(url) {
+  const trimmed = url.replace(/[\x00-\x20\x7f-\x9f]+/g, "").trim();
+  if (!trimmed) return "";
+  const lower = trimmed.toLowerCase();
+  if (lower.startsWith("javascript:") || lower.startsWith("data:") || lower.startsWith("vbscript:") || lower.startsWith("blob:")) {
+    return "";
+  }
+  return trimmed;
+}
+function buildSafeAttrString(attrs) {
+  const out = [];
+  for (const rawKey of Object.keys(attrs)) {
+    if (!Object.hasOwn(attrs, rawKey)) continue;
+    if (!isSafeAttrName2(rawKey)) continue;
+    if (isEventHandlerAttr3(rawKey)) continue;
+    const lowerKey = rawKey.toLowerCase();
+    let value = String(attrs[rawKey]);
+    if (URL_ATTRS2.has(lowerKey)) {
+      value = sanitizeUrlLocal(value);
+      if (!value) continue;
+    }
+    out.push(`${rawKey}="${escapeAttrLocal(value)}"`);
+  }
+  return out.join(" ");
+}
+function escapeHtmlLocal(str) {
   return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 }
-function escapeAttr2(str) {
-  return str.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+function escapeAttrLocal(str) {
+  return str.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/'/g, "&#39;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 }
 
 // src/plugins/plugin.ts