@fictjs/runtime 0.16.0 → 0.17.1

package/dist/{chunk-ZJZ6LMDN.js → chunk-R2HYEOP7.js}

@@ -40,7 +40,7 @@ import {
   setTransitionContext,
   signal,
   untrack
-} from "./chunk-MAHWGB55.js";
+} from "./chunk-OKPQWORE.js";
 
 // src/transition.ts
 function startTransition(fn) {
@@ -340,7 +340,7 @@ function withHydration(root, fn) {
     owner
   });
   try {
-    fn();
+    return fn();
   } finally {
     hydrationStack.pop();
   }
@@ -352,7 +352,7 @@ function withHydrationRange(start, end, owner, fn) {
     owner
   });
   try {
-    fn();
+    return fn();
   } finally {
     hydrationStack.pop();
   }
@@ -383,6 +383,18 @@ function claimNodes(templateRoot, fallback) {
   }
   return frag;
 }
+function claimText(value, fallback) {
+  const ctx = hydrationStack[hydrationStack.length - 1];
+  if (!ctx || !ctx.cursor || ctx.cursor === ctx.boundary || ctx.cursor.nodeType !== Node.TEXT_NODE) {
+    return fallback();
+  }
+  const text = ctx.cursor;
+  ctx.cursor = text.nextSibling;
+  if (text.data !== value) {
+    text.data = value;
+  }
+  return text;
+}
 function isHydratingActive() {
   return hydrationStack.length > 0;
 }
@@ -395,7 +407,9 @@ var PROP_CACHE = Symbol("fict:prop");
 var STYLE_CACHE = Symbol("fict:style");
 var CLASS_STATE_CACHE = Symbol("fict:class-state");
 var CLASS_VALUE_CACHE = Symbol("fict:class-value");
-var EVENT_TUPLE_LISTENER_CACHE = Symbol("fict:event-tuple-listener-cache");
+var EVENT_LISTENER_CACHE = Symbol("fict:event-listener-cache");
+var REF_ASSIGN_CACHE = Symbol("fict:ref-assign-cache");
+var CHILDREN_BINDING_CACHE = Symbol("fict:children-binding-cache");
 var NON_REACTIVE_FN_MARKER = Symbol.for("fict:non-reactive-fn");
 var REACTIVE_FN_MARKER = Symbol.for("fict:reactive-fn");
 var NON_REACTIVE_FN_REGISTRY_KEY = Symbol.for("fict:non-reactive-fn-registry");
@@ -423,6 +437,10 @@ function isExplicitReactiveFn(value) {
   if (typeof value !== "function") return false;
   return value[REACTIVE_FN_MARKER] === true;
 }
+var registeredCreateElement;
+function registerCreateElement(fn) {
+  registeredCreateElement = fn;
+}
 function isReactive(value) {
   if (typeof value !== "function") return false;
   if (isNonReactiveFn(value)) return false;
@@ -1085,26 +1103,18 @@ function globalEventHandler(e) {
     if (!node) return false;
     const handler = node[key];
     if (handler && !node.disabled) {
-      const resolveData = (value) => {
-        if (typeof value === "function") {
-          try {
-            const fn = value;
-            return fn.length > 0 ? fn(e) : fn();
-          } catch {
-            return value();
-          }
-        }
-        return value;
-      };
       const rawData = node[dataKey];
       const hasData = rawData !== void 0;
-      const resolvedNodeData = hasData ? resolveData(rawData) : void 0;
+      const resolvedNodeData = hasData ? resolveEventData(rawData, e) : void 0;
       batch2(() => {
         if (typeof handler === "function") {
           callEventHandler(handler, e, node, hasData ? resolvedNodeData : void 0);
         } else if (Array.isArray(handler)) {
-          const tupleData = resolveData(handler[1]);
-          callEventHandler(handler[0], e, node, tupleData);
+          const tupleHandler = resolveEventHandlerValue(
+            handler[0]
+          );
+          const tupleData = resolveEventData(handler[1], e);
+          callEventHandler(tupleHandler, e, node, tupleData);
         }
       });
       if (e.cancelBubble) return false;
@@ -1152,89 +1162,104 @@ function globalEventHandler(e) {
   }
   retarget(oriTarget);
 }
-function addEventListener(node, name, handler, delegate) {
+function addEventListener(node, name, handler, delegate, options) {
   if (delegate) {
     const key = `$$${name}`;
     const dataKey = `${key}Data`;
+    const rootRef2 = getCurrentRoot();
+    const delegationDocument = resolveDelegationDocument(node, rootRef2);
+    delegateEvents([name], delegationDocument);
     if (handler == null) {
       ;
       node[key] = void 0;
       node[dataKey] = void 0;
       return;
     }
-    if (Array.isArray(handler)) {
-      ;
-      node[key] = handler[0];
-      node[dataKey] = handler[1];
-    } else {
-      ;
-      node[key] = handler;
-      node[dataKey] = void 0;
-    }
+    ;
+    node[key] = createEventInvoker(
+      name,
+      handler,
+      node,
+      rootRef2
+    );
+    node[dataKey] = void 0;
     return;
   }
+  removeStoredEventListener(node, name, options);
   if (handler == null) return;
-  if (Array.isArray(handler)) {
-    const store = getTupleEventListenerStore(node);
-    const existing = store.get(name);
-    if (existing) {
-      node.removeEventListener(name, existing);
-    }
-    const handlerFn = handler[0];
-    const wrapped = (e) => handlerFn.call(node, handler[1], e);
-    store.set(name, wrapped);
-    node.addEventListener(name, wrapped);
-    return;
+  const rootRef = getCurrentRoot();
+  const wrapped = createEventInvoker(name, handler, node, rootRef);
+  node.addEventListener(name, wrapped, options);
+  getStoredEventListenerStore(node).set(getEventListenerStoreKey(name, options), {
+    listener: wrapped,
+    options
+  });
+}
+function resolveDelegationDocument(node, rootRef) {
+  const nodeDocument = node.ownerDocument ?? void 0;
+  if (rootRef?.ownerDocument && nodeDocument?.defaultView == null) {
+    return rootRef.ownerDocument;
   }
-  node.addEventListener(name, handler);
+  return nodeDocument ?? rootRef?.ownerDocument ?? document;
 }
-function getTupleEventListenerStore(node) {
+function getStoredEventListenerStore(node) {
   const host = node;
-  if (!host[EVENT_TUPLE_LISTENER_CACHE]) {
-    host[EVENT_TUPLE_LISTENER_CACHE] = /* @__PURE__ */ new Map();
+  if (!host[EVENT_LISTENER_CACHE]) {
+    host[EVENT_LISTENER_CACHE] = /* @__PURE__ */ new Map();
   }
-  return host[EVENT_TUPLE_LISTENER_CACHE];
+  return host[EVENT_LISTENER_CACHE];
+}
+function getEventListenerStoreKey(name, options) {
+  const capture = typeof options === "boolean" ? options : options?.capture === true;
+  const passive = typeof options === "object" && options?.passive === true;
+  const once = typeof options === "object" && options?.once === true;
+  return `${name}:${capture ? 1 : 0}:${passive ? 1 : 0}:${once ? 1 : 0}`;
 }
-function removeStoredTupleEventListener(node, name) {
+function removeStoredEventListener(node, name, options) {
   const host = node;
-  const store = host[EVENT_TUPLE_LISTENER_CACHE];
+  const store = host[EVENT_LISTENER_CACHE];
   if (!store) return;
-  const wrapped = store.get(name);
-  if (!wrapped) return;
-  node.removeEventListener(name, wrapped);
-  store.delete(name);
+  const entry = store.get(getEventListenerStoreKey(name, options));
+  if (!entry) return;
+  node.removeEventListener(name, entry.listener, entry.options);
+  store.delete(getEventListenerStoreKey(name, options));
   if (store.size === 0) {
-    delete host[EVENT_TUPLE_LISTENER_CACHE];
+    delete host[EVENT_LISTENER_CACHE];
   }
 }
-function bindEvent(el, eventName, handler, options) {
-  if (handler == null) return () => {
-  };
-  const rootRef = getCurrentRoot();
-  const shouldDelegate = options == null && DelegatedEvents.has(eventName);
-  if (shouldDelegate) {
-    const key = `$$${eventName}`;
-    delegateEvents([eventName]);
-    const resolveHandler = isStrictlyReactive(handler) ? handler : () => handler;
-    el[key] = function(...args) {
-      try {
-        const fn = resolveHandler();
-        callEventHandler(fn, args[0], el);
-      } catch (err) {
-        if (!handleError(err, { source: "event", eventName }, rootRef)) {
-          throw err;
-        }
-      }
-    };
-    return () => {
-      el[key] = void 0;
-    };
+function resolveEventData(value, event) {
+  if (typeof value !== "function") return value;
+  if (isReactive(value)) {
+    return value();
   }
-  const getHandler = isStrictlyReactive(handler) ? handler : () => handler;
-  const wrapped = (event) => {
+  try {
+    const fn = value;
+    return fn.length > 0 ? fn(event) : fn();
+  } catch {
+    return value();
+  }
+}
+function resolveEventHandlerValue(value) {
+  if (isStrictlyReactive(value)) {
+    return value();
+  }
+  return value;
+}
+function createEventInvoker(eventName, handler, node, rootRef) {
+  return (event) => {
     try {
-      const resolved = getHandler();
-      callEventHandler(resolved, event, el);
+      if (Array.isArray(handler)) {
+        const resolvedHandler2 = resolveEventHandlerValue(
+          handler[0]
+        );
+        const data = resolveEventData(handler[1], event);
+        callEventHandler(resolvedHandler2, event, node, data);
+        return;
+      }
+      const resolvedHandler = resolveEventHandlerValue(
+        handler
+      );
+      callEventHandler(resolvedHandler, event, node);
     } catch (err) {
       if (handleError(err, { source: "event", eventName }, rootRef)) {
         return;
@@ -1242,55 +1267,340 @@ function bindEvent(el, eventName, handler, options) {
       throw err;
     }
   };
-  el.addEventListener(eventName, wrapped, options);
-  const cleanup = () => el.removeEventListener(eventName, wrapped, options);
+}
+function bindEvent(el, eventName, handler, options) {
+  if (handler == null) return () => {
+  };
+  const shouldDelegate = options == null && DelegatedEvents.has(eventName);
+  if (shouldDelegate) {
+    addEventListener(el, eventName, handler, true);
+    return () => {
+      addEventListener(el, eventName, null, true);
+    };
+  }
+  addEventListener(
+    el,
+    eventName,
+    handler,
+    false,
+    options
+  );
+  const cleanup = () => removeStoredEventListener(el, eventName, options);
   registerRootCleanup(cleanup);
   return cleanup;
 }
-function bindRef(el, ref) {
+function bindRef(el, ref, registerCleanup = true) {
   if (ref == null) return () => {
   };
   const getRef = isReactive(ref) ? ref : () => ref;
-  const applyRef2 = (refValue) => {
+  let currentRef;
+  const applyRefValue = (refValue, value) => {
     if (refValue == null) return;
     if (typeof refValue === "function") {
       ;
-      refValue(el);
+      refValue(value);
     } else if (typeof refValue === "object" && "current" in refValue) {
       ;
-      refValue.current = el;
+      refValue.current = value;
     }
   };
-  const initialRef = getRef();
-  applyRef2(initialRef);
+  const clearCurrentRef = () => {
+    if (currentRef == null) return;
+    applyRefValue(currentRef, null);
+    currentRef = void 0;
+  };
+  const syncRef = (nextRef) => {
+    if (nextRef === currentRef) return;
+    clearCurrentRef();
+    currentRef = nextRef;
+    applyRefValue(currentRef, el);
+  };
+  let disposeTracking;
   if (isReactive(ref)) {
-    const cleanup2 = createRenderEffect(() => {
-      const currentRef = getRef();
-      applyRef2(currentRef);
+    disposeTracking = createRenderEffect(() => {
+      syncRef(getRef());
     });
-    registerRootCleanup(cleanup2);
-    const nullifyCleanup = () => {
-      const currentRef = getRef();
-      if (currentRef && typeof currentRef === "object" && "current" in currentRef) {
-        ;
-        currentRef.current = null;
-      }
-    };
-    registerRootCleanup(nullifyCleanup);
-    return () => {
-      cleanup2();
-      nullifyCleanup();
-    };
+  } else {
+    syncRef(getRef());
+  }
+  if (registerCleanup) {
+    registerRootCleanup(clearCurrentRef);
+  }
+  return () => {
+    disposeTracking?.();
+    clearCurrentRef();
+  };
+}
+function resolveAssignedChildrenValue(value) {
+  if (typeof value === "function") {
+    return isReactive(value) ? value() : null;
   }
-  const cleanup = () => {
-    const refValue = getRef();
-    if (refValue && typeof refValue === "object" && "current" in refValue) {
+  return value ?? null;
+}
+function resolveAssignedRefValue(value) {
+  if (isReactive(value)) {
+    return value();
+  }
+  return value;
+}
+function createAssignedRefState(node, owner, initialValue) {
+  const valueSignal = signal(initialValue);
+  let currentRef;
+  const applyRefValue = (refValue, value) => {
+    if (refValue == null) return;
+    if (typeof refValue === "function") {
+      ;
+      refValue(value);
+    } else if (typeof refValue === "object" && "current" in refValue) {
       ;
-      refValue.current = null;
+      refValue.current = value;
     }
   };
-  registerRootCleanup(cleanup);
-  return cleanup;
+  const clearCurrentRef = () => {
+    if (currentRef == null) return;
+    applyRefValue(currentRef, null);
+    currentRef = void 0;
+  };
+  const syncRef = (nextRef) => {
+    if (nextRef === currentRef) return;
+    clearCurrentRef();
+    currentRef = nextRef;
+    applyRefValue(currentRef, node);
+  };
+  const disposeTracking = createRenderEffect(() => {
+    syncRef(resolveAssignedRefValue(valueSignal()));
+  });
+  return {
+    cleanup: () => {
+      disposeTracking();
+      clearCurrentRef();
+    },
+    owner,
+    registeredCleanup: false,
+    value: (next) => {
+      valueSignal(next);
+      syncRef(resolveAssignedRefValue(next));
+    }
+  };
+}
+function bindAssignedChildren(node, getValue, createElementFn) {
+  const hostRoot = getCurrentRoot();
+  const createFn = createElementFn ?? registeredCreateElement;
+  let currentNodes = [];
+  let currentText = null;
+  let currentRoot = null;
+  let initialHydrating = __fictIsHydrating();
+  const collectCurrentChildren = () => Array.from(node.childNodes);
+  const clearCurrentNodes = () => {
+    if (currentRoot) {
+      destroyRoot(currentRoot);
+      currentRoot = null;
+    }
+    if (currentNodes.length > 0) {
+      removeNodes(currentNodes);
+      currentNodes = [];
+    }
+    currentText = null;
+  };
+  const setTextNode = (textValue, shouldInsert) => {
+    if (!shouldInsert) {
+      clearCurrentNodes();
+      if (node.childNodes.length > 0) {
+        node.replaceChildren();
+      }
+      initialHydrating = false;
+      return;
+    }
+    if (initialHydrating && isHydratingActive()) {
+      const hydratedNodes = collectCurrentChildren();
+      if (hydratedNodes.length === 1 && hydratedNodes[0]?.nodeType === Node.TEXT_NODE) {
+        const hydratedText = hydratedNodes[0];
+        if (hydratedText.data !== textValue) {
+          hydratedText.data = textValue;
+        }
+        currentText = hydratedText;
+        currentNodes = [hydratedText];
+        initialHydrating = false;
+        return;
+      }
+    }
+    const textNode = currentText ?? (node.ownerDocument ?? document).createTextNode(textValue);
+    if (textNode.data !== textValue) {
+      textNode.data = textValue;
+    }
+    if (currentNodes.length === 1 && currentNodes[0] === textNode) {
+      currentText = textNode;
+      return;
+    }
+    if (currentRoot) {
+      destroyRoot(currentRoot);
+      currentRoot = null;
+    }
+    if (currentNodes.length > 0) {
+      removeNodes(currentNodes);
+      currentNodes = [];
+    }
+    node.replaceChildren(textNode);
+    currentText = textNode;
+    currentNodes = [textNode];
+    initialHydrating = false;
+  };
+  const dispose = createRenderEffect(() => {
+    const value = getValue();
+    const isPrimitive = value == null || value === false || typeof value === "string" || typeof value === "number" || typeof value === "boolean";
+    if (isPrimitive) {
+      const textValue = value == null || value === false ? "" : String(value);
+      const shouldInsert = value != null && value !== false;
+      setTextNode(textValue, shouldInsert);
+      return;
+    }
+    clearCurrentNodes();
+    const root = createRootContext(hostRoot);
+    const prev = pushRoot(root);
+    let nodes;
+    let currentHydratedNodes;
+    let handledError = false;
+    try {
+      const ownerDocument = node.ownerDocument ?? hostRoot?.ownerDocument ?? document;
+      const createValue = () => {
+        if (value instanceof Node) {
+          return value;
+        }
+        if (Array.isArray(value)) {
+          if (value.every((v) => v instanceof Node)) {
+            return value;
+          }
+          if (createFn) {
+            const mapped = [];
+            for (const item of value) {
+              mapped.push(...toNodeArray(createFn(item), ownerDocument));
+            }
+            return mapped;
+          }
+          return ownerDocument.createTextNode(String(value));
+        }
+        return createFn ? createFn(value) : ownerDocument.createTextNode(String(value));
+      };
+      const newNode = initialHydrating && isHydratingActive() ? withHydration(node, () => createValue()) : createValue();
+      nodes = toNodeArray(newNode, ownerDocument);
+      if (root.suspended) {
+        handledError = true;
+        destroyRoot(root);
+        return;
+      }
+      if (initialHydrating) {
+        const hydratedNodes = collectCurrentChildren();
+        const reuseHydratedNodes = hydratedNodes.length === nodes.length && nodes.every((candidate, index) => candidate === hydratedNodes[index]);
+        if (reuseHydratedNodes) {
+          currentHydratedNodes = hydratedNodes;
+        } else {
+          node.replaceChildren(...nodes);
+        }
+      } else {
+        node.replaceChildren(...nodes);
+      }
+    } catch (err) {
+      if (handleSuspend(err, root)) {
+        handledError = true;
+        destroyRoot(root);
+        return;
+      }
+      if (handleError(err, { source: "renderChild" }, root)) {
+        handledError = true;
+        destroyRoot(root);
+        return;
+      }
+      throw err;
+    } finally {
+      popRoot(prev);
+      if (!handledError) {
+        flushOnMount(root);
+      }
+    }
+    currentRoot = root;
+    currentNodes = currentHydratedNodes ?? nodes;
+    initialHydrating = false;
+  });
+  return () => {
+    dispose();
+    clearCurrentNodes();
+  };
+}
+function updateChildrenBinding(node, value, createElementFn) {
+  const host = node;
+  const createFn = createElementFn ?? registeredCreateElement;
+  const owner = getCurrentRoot();
+  let state = host[CHILDREN_BINDING_CACHE];
+  if (state && state.owner !== owner) {
+    state.cleanup?.();
+    state.cleanup = void 0;
+    delete host[CHILDREN_BINDING_CACHE];
+    state = void 0;
+  }
+  if (!state) {
+    const valueSignal = signal(value);
+    const cleanup = bindAssignedChildren(
+      node,
+      () => resolveAssignedChildrenValue(valueSignal()),
+      createFn
+    );
+    const nextState = {
+      cleanup,
+      owner,
+      value: valueSignal
+    };
+    state = nextState;
+    host[CHILDREN_BINDING_CACHE] = nextState;
+    registerRootCleanup(() => {
+      state?.cleanup?.();
+      if (state) {
+        state.cleanup = void 0;
+      }
+      if (host[CHILDREN_BINDING_CACHE] === state) {
+        delete host[CHILDREN_BINDING_CACHE];
+      }
+    });
+    return;
+  }
+  state.value(value);
+}
+function updateAssignedRefBinding(node, value) {
+  const host = node;
+  const owner = getCurrentRoot();
+  let state = host[REF_ASSIGN_CACHE];
+  if (state && state.owner !== owner) {
+    state.cleanup?.();
+    state.cleanup = void 0;
+    delete host[REF_ASSIGN_CACHE];
+    state = void 0;
+  }
+  if (!state && value == null) {
+    return;
+  }
+  if (!state) {
+    state = createAssignedRefState(node, owner, value);
+    host[REF_ASSIGN_CACHE] = state;
+  }
+  state.value?.(value);
+  if (value == null) {
+    if (!state.registeredCleanup) {
+      state.cleanup?.();
+      state.cleanup = void 0;
+      delete host[REF_ASSIGN_CACHE];
+    }
+    return;
+  }
+  if (!state.registeredCleanup && getCurrentRoot()) {
+    state.registeredCleanup = true;
+    registerRootCleanup(() => {
+      state.cleanup?.();
+      state.cleanup = void 0;
+      state.value = void 0;
+      if (host[REF_ASSIGN_CACHE] === state) {
+        delete host[REF_ASSIGN_CACHE];
+      }
+    });
+  }
 }
 function spread(node, props = {}, isSVG = false, skipChildren = false, exclude = []) {
   const prevProps = {};
@@ -1300,23 +1610,12 @@ function spread(node, props = {}, isSVG = false, skipChildren = false, exclude =
     if (!next || typeof next !== "object") return {};
     return next;
   };
-  if (!skipChildren) {
-    createRenderEffect(() => {
-      const nextProps = resolveProps();
-      if ("children" in nextProps) {
-        prevProps.children = nextProps.children;
-      }
-    });
-  }
-  createRenderEffect(() => {
-    const nextProps = resolveProps();
-    if (typeof nextProps.ref === "function") {
-      ;
-      nextProps.ref(node);
-    }
-  });
+  bindRef(
+    node,
+    (typeof props === "function" ? () => resolveProps().ref : resolveProps().ref) ?? null
+  );
   createRenderEffect(() => {
-    assign(node, resolveProps(), isSVG, true, prevProps, true, excludedProps);
+    assign(node, resolveProps(), isSVG, skipChildren, prevProps, true, excludedProps);
   });
   return prevProps;
 }
@@ -1325,19 +1624,26 @@ function assign(node, props, isSVG = false, skipChildren = false, prevProps = {}
   for (const prop2 in prevProps) {
     if (excludedProps?.has(prop2)) continue;
     if (!(prop2 in props)) {
-      if (prop2 === "children") continue;
+      if (prop2 === "children") {
+        if (!skipChildren) {
+          updateChildrenBinding(node, void 0);
+          prevProps.children = void 0;
+        }
+        continue;
+      }
       prevProps[prop2] = assignProp(node, prop2, null, prevProps[prop2], isSVG, skipRef, props);
     }
   }
   for (const prop2 in props) {
     if (excludedProps?.has(prop2)) continue;
+    const value = props[prop2];
     if (prop2 === "children") {
       if (!skipChildren) {
+        updateChildrenBinding(node, value);
         prevProps.children = props.children;
       }
       continue;
     }
-    const value = props[prop2];
     prevProps[prop2] = assignProp(node, prop2, value, prevProps[prop2], isSVG, skipRef, props);
   }
 }
@@ -1351,9 +1657,8 @@ function assignProp(node, prop2, value, prev, isSVG, skipRef, props) {
   }
   if (value === prev) return prev;
   if (prop2 === "ref") {
-    if (!skipRef && typeof value === "function") {
-      ;
-      value(node);
+    if (!skipRef) {
+      updateAssignedRefBinding(node, value);
     }
     return value;
   }
@@ -1363,34 +1668,41 @@ function assignProp(node, prop2, value, prev, isSVG, skipRef, props) {
       node.setAttribute(prop2, value);
       return value;
     }
-    if (prev && typeof prev !== "string") node.removeEventListener(eventName, prev);
-    if (value) node.addEventListener(eventName, value);
+    if (prev && typeof prev !== "string") removeStoredEventListener(node, eventName);
+    addEventListener(
+      node,
+      eventName,
+      value,
+      false
+    );
     return value;
   }
   if (prop2.slice(0, 10) === "oncapture:") {
     const eventName = prop2.slice(10);
-    if (prev) node.removeEventListener(eventName, prev, true);
-    if (value) node.addEventListener(eventName, value, true);
+    if (prev) removeStoredEventListener(node, eventName, true);
+    addEventListener(
+      node,
+      eventName,
+      value,
+      false,
+      true
+    );
     return value;
   }
   if (prop2.slice(0, 2) === "on") {
     const eventName = prop2.slice(2).toLowerCase();
     const shouldDelegate = DelegatedEvents.has(eventName);
     if (!shouldDelegate && prev) {
-      if (Array.isArray(prev)) {
-        removeStoredTupleEventListener(node, eventName);
-      } else {
-        node.removeEventListener(eventName, prev);
-      }
+      removeStoredEventListener(node, eventName);
     }
     if (shouldDelegate || value) {
       addEventListener(
         node,
         eventName,
         value,
-        shouldDelegate
+        shouldDelegate,
+        false
       );
-      if (shouldDelegate) delegateEvents([eventName]);
     }
     return value;
   }
@@ -2147,6 +2459,7 @@ function hydrateComponent(view, container) {
 function createElement(node) {
   return createElementWithContext(node, null, resolveOwnerDocument());
 }
+registerCreateElement(createElement);
 function resolveNamespace(tagName, namespace) {
   if (tagName === "svg") return "svg";
   if (tagName === "math") return "mathml";
@@ -2158,22 +2471,28 @@ function resolveNamespace(tagName, namespace) {
 function resolveOwnerDocument(ownerDocument) {
   return ownerDocument ?? getCurrentRoot()?.ownerDocument ?? document;
 }
+function createTextNodeWithHydration(value, ownerDocument) {
+  if (!isHydratingActive()) {
+    return ownerDocument.createTextNode(value);
+  }
+  return claimText(value, () => ownerDocument.createTextNode(value));
+}
 function createElementWithContext(node, namespace, ownerDocument) {
   if (node instanceof Node) {
     return node;
   }
   if (node === null || node === void 0 || node === false) {
-    return ownerDocument.createTextNode("");
+    return createTextNodeWithHydration("", ownerDocument);
   }
   if (isReactive(node)) {
     const resolved = node();
     if (resolved === node) {
-      return ownerDocument.createTextNode("");
+      return createTextNodeWithHydration("", ownerDocument);
     }
     return createElementWithContext(resolved, namespace, ownerDocument);
   }
   if (typeof node === "function") {
-    return ownerDocument.createTextNode("");
+    return createTextNodeWithHydration("", ownerDocument);
   }
   if (typeof node === "object" && node !== null && !(node instanceof Node)) {
     if ("marker" in node) {
@@ -2200,10 +2519,10 @@ function createElementWithContext(node, namespace, ownerDocument) {
     return frag;
   }
   if (typeof node === "string" || typeof node === "number") {
-    return ownerDocument.createTextNode(String(node));
+    return createTextNodeWithHydration(String(node), ownerDocument);
   }
   if (typeof node === "boolean") {
-    return ownerDocument.createTextNode("");
+    return createTextNodeWithHydration("", ownerDocument);
   }
   const vnode = node;
   if (typeof vnode.type === "function") {
@@ -2412,7 +2731,7 @@ function appendChildNode(parent, child, namespace, ownerDocument) {
   }
   let domNode;
   if (typeof child !== "object" || child === null) {
-    domNode = parentOwnerDocument.createTextNode(String(child ?? ""));
+    domNode = createTextNodeWithHydration(String(child ?? ""), parentOwnerDocument);
   } else {
     domNode = createElementWithContext(child, namespace, parentOwnerDocument);
   }
@@ -2448,33 +2767,12 @@ function appendChildren(parent, children, namespace, ownerDocument) {
   appendChildNode(parent, children, namespace, ownerDocument);
 }
 function applyRef(el, value) {
-  if (typeof value === "function") {
-    const refFn = value;
-    refFn(el);
-    const root = getCurrentRoot();
-    if (root) {
-      registerRootCleanup(() => {
-        refFn(null);
-      });
-    } else if (isDev2) {
-      console.warn(
-        "[fict] Ref applied outside of a root context. The ref cleanup (setting to null) will not run automatically. Consider using createRoot() or ensure the element is created within a component."
-      );
-    }
-  } else if (value && typeof value === "object" && "current" in value) {
-    const refObj = value;
-    refObj.current = el;
-    const root = getCurrentRoot();
-    if (root) {
-      registerRootCleanup(() => {
-        refObj.current = null;
-      });
-    } else if (isDev2) {
-      console.warn(
-        "[fict] Ref applied outside of a root context. The ref cleanup (setting to null) will not run automatically. Consider using createRoot() or ensure the element is created within a component."
-      );
-    }
+  if (!getCurrentRoot() && isDev2) {
+    console.warn(
+      "[fict] Ref applied outside of a root context. The ref cleanup (setting to null) will not run automatically. Consider using createRoot() or ensure the element is created within a component."
+    );
   }
+  bindRef(el, value);
 }
 function applyProps(el, props, isSVG = false) {
   props = unwrapProps(props);
@@ -2717,4 +3015,4 @@ export {
   createElement,
   template
 };
-//# sourceMappingURL=chunk-ZJZ6LMDN.js.map
+//# sourceMappingURL=chunk-R2HYEOP7.js.map