@fictjs/runtime 0.5.2 → 0.7.0

package/dist/index.dev.js

@@ -8,7 +8,7 @@ function getDevtoolsHook() {
 }
 
 // src/cycle-guard.ts
-var isDev = true ? true : typeof process === "undefined" || process.env?.NODE_ENV !== "production";
+var isDev = true ? true : typeof process !== "undefined" && process.env?.NODE_ENV !== "production";
 var setCycleProtectionOptions = () => {
 };
 var resetCycleProtectionStateForTests = () => {
@@ -22,7 +22,8 @@ var enterRootGuard = () => true;
 var exitRootGuard = () => {
 };
 var defaultOptions = {
-  enabled: isDev,
+  // Keep cycle guards on in production to avoid infinite flush loops.
+  enabled: true,
   maxFlushCyclesPerMicrotask: 1e4,
   maxEffectRunsPerFlush: 2e4,
   windowSize: 5,
@@ -175,7 +176,7 @@ var reportCycle = (reason, detail = void 0) => {
 };
 
 // src/lifecycle.ts
-var isDev2 = true ? true : typeof process === "undefined" || process.env?.NODE_ENV !== "production";
+var isDev2 = true ? true : typeof process !== "undefined" && process.env?.NODE_ENV !== "production";
 var currentRoot;
 var currentEffectCleanups;
 var globalErrorHandlers = /* @__PURE__ */ new WeakMap();
@@ -493,7 +494,7 @@ function createRenderEffect(fn) {
 }
 
 // src/hooks.ts
-var isDev3 = true ? true : typeof process === "undefined" || process.env?.NODE_ENV !== "production";
+var isDev3 = true ? true : typeof process !== "undefined" && process.env?.NODE_ENV !== "production";
 var ctxStack = [];
 var preparedContext = null;
 function __fictPushContext() {
@@ -511,7 +512,7 @@ function __fictPopContext() {
 }
 
 // src/signal.ts
-var isDev4 = true ? true : typeof process === "undefined" || process.env?.NODE_ENV !== "production";
+var isDev4 = true ? true : typeof process !== "undefined" && process.env?.NODE_ENV !== "production";
 var Mutable = 1;
 var Watching = 2;
 var Running = 4;
@@ -803,6 +804,7 @@ function updateComputed(c) {
   } catch (e) {
     activeSub = prevSub;
     c.flags &= ~Running;
+    purgeDeps(c);
     throw e;
   }
 }
@@ -835,6 +837,7 @@ function runEffect(e) {
     } catch (err) {
       activeSub = prevSub;
       e.flags = Watching;
+      purgeDeps(e);
       throw err;
     }
   } else if (flags & Pending && e.deps) {
@@ -872,6 +875,7 @@ function runEffect(e) {
       } catch (err) {
         activeSub = prevSub;
         e.flags = Watching;
+        purgeDeps(e);
         throw err;
       }
     } else {
@@ -975,11 +979,11 @@ function signal(initialValue, options2) {
     subs: void 0,
     subsTail: void 0,
     flags: Mutable,
-    __id: void 0,
-    ...options2?.equals !== void 0 ? { equals: options2.equals } : {},
-    ...options2?.name !== void 0 ? { name: options2.name } : {},
-    ...options2?.devToolsSource !== void 0 ? { devToolsSource: options2.devToolsSource } : {}
+    __id: void 0
   };
+  if (options2?.equals !== void 0) s.equals = options2.equals;
+  if (options2?.name !== void 0) s.name = options2.name;
+  if (options2?.devToolsSource !== void 0) s.devToolsSource = options2.devToolsSource;
   if (isDev4) registerSignalDevtools(s);
   const accessor = signalOper.bind(s);
   accessor[SIGNAL_MARKER] = true;
@@ -1034,11 +1038,11 @@ function computed(getter, options2) {
     depsTail: void 0,
     flags: 0,
     getter,
-    __id: void 0,
-    ...options2?.equals !== void 0 ? { equals: options2.equals } : {},
-    ...options2?.name !== void 0 ? { name: options2.name } : {},
-    ...options2?.devToolsSource !== void 0 ? { devToolsSource: options2.devToolsSource } : {}
+    __id: void 0
   };
+  if (options2?.equals !== void 0) c.equals = options2.equals;
+  if (options2?.name !== void 0) c.name = options2.name;
+  if (options2?.devToolsSource !== void 0) c.devToolsSource = options2.devToolsSource;
   if (isDev4) registerComputedDevtools(c);
   const bound = computedOper.bind(
     c
@@ -1069,14 +1073,21 @@ function computedOper() {
       this.flags = flags & ~Pending;
     }
   } else if (!flags) {
+    this.depsTail = void 0;
     this.flags = MutableRunning;
     const prevSub = setActiveSub(this);
     try {
       this.value = this.getter(void 0);
       if (isDev4) updateComputedDevtools(this, this.value);
+    } catch (err) {
+      this.flags = 0;
+      purgeDeps(this);
+      throw err;
     } finally {
       setActiveSub(prevSub);
-      this.flags &= ~Running;
+      if (this.flags & Running) {
+        this.flags &= ~Running;
+      }
     }
   }
   if (activeSub !== void 0) link(this, activeSub, cycle);
@@ -1101,13 +1112,23 @@ function effectWithCleanup(fn, cleanupRunner, root) {
   const prevSub = activeSub;
   if (prevSub !== void 0) link(e, prevSub, 0);
   activeSub = e;
+  let didThrow = false;
+  let thrown;
   try {
     if (isDev4) effectRunDevtools(e);
     fn();
+  } catch (err) {
+    didThrow = true;
+    thrown = err;
   } finally {
     activeSub = prevSub;
-    e.flags &= ~Running;
+    if (didThrow) {
+      disposeNode(e);
+    } else {
+      e.flags &= ~Running;
+    }
   }
+  if (didThrow) throw thrown;
   const disposer = effectOper.bind(e);
   disposer[EFFECT_MARKER] = true;
   return disposer;
@@ -1278,15 +1299,48 @@ function startTransition(fn) {
 }
 function useTransition() {
   const pending = signal(false);
+  let pendingCount = 0;
+  const beginPending = () => {
+    pendingCount += 1;
+    if (pendingCount === 1) {
+      pending(true);
+    }
+  };
+  const endPending = () => {
+    if (pendingCount === 0) return;
+    pendingCount -= 1;
+    if (pendingCount === 0) {
+      pending(false);
+    }
+  };
   const start = (fn) => {
+    beginPending();
+    let result;
+    let thrown;
+    let didThrow = false;
     startTransition(() => {
-      pending(true);
       try {
-        fn();
-      } finally {
-        pending(false);
+        result = fn();
+      } catch (err) {
+        thrown = err;
+        didThrow = true;
       }
     });
+    if (didThrow) {
+      endPending();
+      throw thrown;
+    }
+    if (result && typeof result.then === "function") {
+      Promise.resolve(result).finally(() => {
+        endPending();
+      });
+      return;
+    }
+    if (typeof queueMicrotask === "function") {
+      queueMicrotask(endPending);
+    } else {
+      Promise.resolve().then(endPending);
+    }
   };
   return [() => pending(), start];
 }
@@ -1342,7 +1396,7 @@ var DelegatedEventNames = [
 ];
 
 // src/constants.ts
-var isDev5 = true ? true : typeof process === "undefined" || process.env?.NODE_ENV !== "production";
+var isDev5 = true ? true : typeof process !== "undefined" && process.env?.NODE_ENV !== "production";
 var booleans = isDev5 ? [
   "allowfullscreen",
   "async",
@@ -1917,22 +1971,53 @@ function __fictRegisterScope(ctx, host, type, props) {
 }
 
 // src/binding.ts
-var isDev6 = true ? true : typeof process === "undefined" || process.env?.NODE_ENV !== "production";
+var isDev6 = true ? true : typeof process !== "undefined" && process.env?.NODE_ENV !== "production";
+var TEXT_CACHE = Symbol("fict:text");
+var ATTR_CACHE = Symbol("fict:attr");
+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 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");
+var STYLE_PROP_CACHE = /* @__PURE__ */ new Map();
+var hasOwn = Object.prototype.hasOwnProperty;
+function getNonReactiveFnRegistry() {
+  const host = globalThis;
+  let registry = host[NON_REACTIVE_FN_REGISTRY_KEY];
+  if (!registry) {
+    registry = /* @__PURE__ */ new WeakSet();
+    host[NON_REACTIVE_FN_REGISTRY_KEY] = registry;
+  }
+  return registry;
+}
+function isExplicitReactiveFn(value) {
+  if (typeof value !== "function") return false;
+  return value[REACTIVE_FN_MARKER] === true;
+}
 function isReactive(value) {
   if (typeof value !== "function") return false;
+  if (isNonReactiveFn(value)) return false;
   if (isSignal(value) || isComputed(value)) return true;
+  if (isExplicitReactiveFn(value)) return true;
   if (isEffect(value) || isEffectScope(value)) return false;
   return value.length === 0;
 }
 function isStrictlyReactive(value) {
   if (typeof value !== "function") return false;
-  return isSignal(value) || isComputed(value) || isPropGetterFn(value);
+  return isSignal(value) || isComputed(value) || isPropGetterFn(value) || isExplicitReactiveFn(value);
 }
 var PROP_GETTER_MARKER = Symbol.for("fict:prop-getter");
 function isPropGetterFn(value) {
   if (typeof value !== "function") return false;
   return value[PROP_GETTER_MARKER] === true;
 }
+function isNonReactiveFn(value) {
+  if (typeof value !== "function") return false;
+  if (getNonReactiveFnRegistry().has(value)) return true;
+  return value[NON_REACTIVE_FN_MARKER] === true;
+}
 function callEventHandler(handler, event, node, data) {
   if (!handler) return;
   const context = node ?? event.currentTarget ?? void 0;
@@ -1967,18 +2052,23 @@ function createAttributeBinding(el, key, value, setter) {
   }
 }
 function createStyleBinding(el, value) {
-  const target = el;
   if (isReactive(value)) {
-    let prev;
     createRenderEffect(() => {
-      const next = value();
-      applyStyle(target, next, prev);
-      prev = next;
+      setStyle(el, value());
     });
   } else {
-    applyStyle(target, value, void 0);
+    setStyle(el, value);
   }
 }
+function setStyle(el, value) {
+  const target = el;
+  const cache = target;
+  const prev = cache[STYLE_CACHE];
+  if (typeof value === "string" && prev === value) return;
+  if ((value === null || value === void 0) && (prev === null || prev === void 0)) return;
+  applyStyle(target, value, prev);
+  cache[STYLE_CACHE] = value;
+}
 function applyStyle(el, value, prev) {
   if (typeof value === "string") {
     el.style.cssText = value;
@@ -1989,29 +2079,33 @@ function applyStyle(el, value, prev) {
     }
     if (prev && typeof prev === "object") {
       const prevStyles = prev;
-      for (const key of Object.keys(prevStyles)) {
-        if (!(key in styles)) {
-          const cssProperty = key.replace(/([A-Z])/g, "-$1").toLowerCase();
+      for (const key in prevStyles) {
+        if (!hasOwn.call(prevStyles, key)) continue;
+        if (!hasOwn.call(styles, key)) {
+          const cssProperty = normalizeStyleProperty(key);
           el.style.removeProperty(cssProperty);
         }
       }
     }
-    for (const [prop2, v] of Object.entries(styles)) {
+    for (const prop2 in styles) {
+      if (!hasOwn.call(styles, prop2)) continue;
+      const v = styles[prop2];
       if (v != null) {
-        const cssProperty = prop2.replace(/([A-Z])/g, "-$1").toLowerCase();
+        const cssProperty = normalizeStyleProperty(prop2);
         const unitless = isUnitlessStyleProperty(prop2) || isUnitlessStyleProperty(cssProperty);
         const valueStr = typeof v === "number" && !unitless ? `${v}px` : String(v);
         el.style.setProperty(cssProperty, valueStr);
       } else {
-        const cssProperty = prop2.replace(/([A-Z])/g, "-$1").toLowerCase();
+        const cssProperty = normalizeStyleProperty(prop2);
         el.style.removeProperty(cssProperty);
       }
     }
   } else {
     if (prev && typeof prev === "object") {
       const prevStyles = prev;
-      for (const key of Object.keys(prevStyles)) {
-        const cssProperty = key.replace(/([A-Z])/g, "-$1").toLowerCase();
+      for (const key in prevStyles) {
+        if (!hasOwn.call(prevStyles, key)) continue;
+        const cssProperty = normalizeStyleProperty(key);
         el.style.removeProperty(cssProperty);
       }
     } else if (typeof prev === "string") {
@@ -2020,16 +2114,35 @@ function applyStyle(el, value, prev) {
   }
 }
 var isUnitlessStyleProperty = isDev6 ? (prop2) => UnitlessStyles.has(prop2) : (prop2) => prop2 === "opacity" || prop2 === "zIndex";
+function normalizeStyleProperty(prop2) {
+  const cached = STYLE_PROP_CACHE.get(prop2);
+  if (cached) return cached;
+  const normalized = prop2.includes("-") ? prop2 : prop2.replace(/([A-Z])/g, "-$1").toLowerCase();
+  STYLE_PROP_CACHE.set(prop2, normalized);
+  return normalized;
+}
 function createClassBinding(el, value) {
   if (isReactive(value)) {
-    let prev = {};
-    createRenderEffect(() => {
-      const next = value();
-      prev = applyClass(el, next, prev);
-    });
+    createRenderEffect(
+      () => setClass(el, value())
+    );
   } else {
-    applyClass(el, value, {});
+    setClass(el, value);
+  }
+}
+function setClass(el, value) {
+  const cache = el;
+  const prevValue = cache[CLASS_VALUE_CACHE];
+  const prevState = cache[CLASS_STATE_CACHE] ?? {};
+  if (typeof value === "string") {
+    if (typeof prevValue === "string" && prevValue === value) return;
+    el.className = value;
+    cache[CLASS_STATE_CACHE] = {};
+    cache[CLASS_VALUE_CACHE] = value;
+    return;
   }
+  cache[CLASS_STATE_CACHE] = applyClass(el, value, prevState);
+  cache[CLASS_VALUE_CACHE] = value;
 }
 function toggleClassKey(node, key, value) {
   const classNames = key.trim().split(/\s+/);
@@ -2335,9 +2448,21 @@ function createPortal(container, render2, createElementFn) {
 
 // src/props.ts
 var PROP_GETTER_MARKER2 = Symbol.for("fict:prop-getter");
+var NON_REACTIVE_FN_MARKER2 = Symbol.for("fict:non-reactive-fn");
+var REACTIVE_FN_MARKER2 = Symbol.for("fict:reactive-fn");
+var NON_REACTIVE_FN_REGISTRY_KEY2 = Symbol.for("fict:non-reactive-fn-registry");
 var propGetters = /* @__PURE__ */ new WeakSet();
 var rawToProxy = /* @__PURE__ */ new WeakMap();
 var proxyToRaw = /* @__PURE__ */ new WeakMap();
+function getNonReactiveFnRegistry2() {
+  const host = globalThis;
+  let registry = host[NON_REACTIVE_FN_REGISTRY_KEY2];
+  if (!registry) {
+    registry = /* @__PURE__ */ new WeakSet();
+    host[NON_REACTIVE_FN_REGISTRY_KEY2] = registry;
+  }
+  return registry;
+}
 function __fictProp(getter) {
   if (typeof getter === "function" && getter.length === 0) {
     propGetters.add(getter);
@@ -2356,6 +2481,35 @@ function isPropGetter(value) {
   const fn = value;
   return propGetters.has(fn) || fn[PROP_GETTER_MARKER2] === true;
 }
+function isNonReactiveFn2(value) {
+  if (typeof value !== "function") return false;
+  if (getNonReactiveFnRegistry2().has(value)) return true;
+  return value[NON_REACTIVE_FN_MARKER2] === true;
+}
+function markNonReactiveFn(fn) {
+  getNonReactiveFnRegistry2().add(fn);
+  if (Object.isExtensible(fn)) {
+    try {
+      ;
+      fn[NON_REACTIVE_FN_MARKER2] = true;
+    } catch {
+    }
+  }
+  return fn;
+}
+function isExplicitReactiveFn2(value) {
+  if (typeof value !== "function") return false;
+  return value[REACTIVE_FN_MARKER2] === true;
+}
+function normalizePropsFunction(value) {
+  if (typeof value !== "function") return value;
+  if (value.length !== 0) return value;
+  if (isPropGetter(value) || isSignal(value) || isComputed(value) || isExplicitReactiveFn2(value)) {
+    return value;
+  }
+  if (isEffect(value) || isEffectScope(value) || isNonReactiveFn2(value)) return value;
+  return markNonReactiveFn(value);
+}
 function createPropsProxy(props) {
   if (!props || typeof props !== "object") {
     return props;
@@ -2373,7 +2527,7 @@ function createPropsProxy(props) {
       if (isPropGetter(value)) {
         return value();
       }
-      return value;
+      return normalizePropsFunction(value);
     },
     set(target, prop2, value, receiver) {
       return Reflect.set(target, prop2, value, receiver);
@@ -2495,7 +2649,7 @@ function prop(getter, options2) {
 // src/dom.ts
 var SVG_NS = "http://www.w3.org/2000/svg";
 var MATHML_NS = "http://www.w3.org/1998/Math/MathML";
-var isDev7 = true ? true : typeof process === "undefined" || process.env?.NODE_ENV !== "production";
+var isDev7 = true ? true : typeof process !== "undefined" && process.env?.NODE_ENV !== "production";
 var nextComponentId = 1;
 function render(view, container) {
   const root = createRootContext();
@@ -2549,6 +2703,9 @@ function createElementWithContext(node, namespace) {
     }
     return createElementWithContext(resolved, namespace);
   }
+  if (typeof node === "function") {
+    return document.createTextNode("");
+  }
   if (typeof node === "object" && node !== null && !(node instanceof Node)) {
     if ("marker" in node) {
       const handle = node;
@@ -2686,9 +2843,12 @@ function appendChildNode(parent, child, namespace) {
     child.flush?.();
     return;
   }
-  if (typeof child === "function" && child.length === 0) {
+  if (typeof child === "function") {
     const childGetter = child;
-    createChildBinding(parent, childGetter, (node) => createElementWithContext(node, namespace));
+    if (isReactive(childGetter)) {
+      createChildBinding(parent, childGetter, (node) => createElementWithContext(node, namespace));
+      return;
+    }
     return;
   }
   if (Array.isArray(child)) {