@fictjs/runtime 0.6.0 → 0.7.0

package/dist/{chunk-D2IWOO4X.js → chunk-4LCHQ7U4.js}

@@ -40,7 +40,7 @@ import {
   setTransitionContext,
   signal,
   untrack
-} from "./chunk-LRFMCJY3.js";
+} from "./chunk-7YQK3XKY.js";
 
 // src/jsx.ts
 var Fragment = Symbol("Fragment");
@@ -259,15 +259,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];
 }
@@ -351,22 +384,83 @@ function isHydratingActive() {
 }
 
 // src/binding.ts
-var isDev = typeof __DEV__ !== "undefined" ? __DEV__ : typeof process === "undefined" || process.env?.NODE_ENV !== "production";
+var isDev = typeof __DEV__ !== "undefined" ? __DEV__ : 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 PROPERTY_BINDING_KEYS = /* @__PURE__ */ new Set([
+  "value",
+  "checked",
+  "selected",
+  "disabled",
+  "readOnly",
+  "multiple",
+  "muted"
+]);
+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 nonReactive(fn) {
+  getNonReactiveFnRegistry().add(fn);
+  if (Object.isExtensible(fn)) {
+    try {
+      ;
+      fn[NON_REACTIVE_FN_MARKER] = true;
+    } catch {
+    }
+  }
+  return fn;
+}
+function reactive(fn) {
+  if (Object.isExtensible(fn)) {
+    try {
+      ;
+      fn[REACTIVE_FN_MARKER] = true;
+    } catch {
+    }
+  }
+  return fn;
+}
 function unwrap(value) {
   return isReactive(value) ? value() : value;
 }
@@ -398,24 +492,25 @@ function createTextBinding(value) {
   const text = document.createTextNode("");
   if (isReactive(value)) {
     createRenderEffect(() => {
-      const v = value();
-      const fmt = formatTextValue(v);
-      if (text.data !== fmt) {
-        text.data = fmt;
-      }
+      setText(text, value());
     });
   } else {
-    text.data = formatTextValue(value);
+    setText(text, value);
   }
   return text;
 }
 function bindText(textNode, getValue) {
-  return createRenderEffect(() => {
-    const value = formatTextValue(getValue());
-    if (textNode.data !== value) {
-      textNode.data = value;
-    }
-  });
+  return createRenderEffect(() => setText(textNode, getValue()));
+}
+function setText(textNode, value) {
+  const next = formatTextValue(value);
+  const cache = textNode;
+  const prev = cache[TEXT_CACHE];
+  if (prev === next && textNode.data === next) return;
+  cache[TEXT_CACHE] = next;
+  if (textNode.data !== next) {
+    textNode.data = next;
+  }
 }
 function formatTextValue(value) {
   if (value == null || value === false) {
@@ -433,65 +528,57 @@ function createAttributeBinding(el, key, value, setter) {
   }
 }
 function bindAttribute(el, key, getValue) {
-  let prevValue = void 0;
-  return createRenderEffect(() => {
-    const value = getValue();
-    if (value === prevValue) return;
-    prevValue = value;
-    if (value === void 0 || value === null || value === false) {
-      el.removeAttribute(key);
-    } else if (value === true) {
-      el.setAttribute(key, "");
-    } else {
-      el.setAttribute(key, String(value));
-    }
-  });
+  return createRenderEffect(() => setAttr(el, key, getValue()));
+}
+function setAttr(el, key, value) {
+  const cacheTarget = el;
+  const attrCache = cacheTarget[ATTR_CACHE] ?? (cacheTarget[ATTR_CACHE] = /* @__PURE__ */ Object.create(null));
+  if (attrCache[key] === value) return;
+  attrCache[key] = value;
+  if (value === void 0 || value === null || value === false) {
+    el.removeAttribute(key);
+  } else if (value === true) {
+    el.setAttribute(key, "");
+  } else {
+    el.setAttribute(key, String(value));
+  }
 }
 function bindProperty(el, key, getValue) {
-  const PROPERTY_BINDING_KEYS = /* @__PURE__ */ new Set([
-    "value",
-    "checked",
-    "selected",
-    "disabled",
-    "readOnly",
-    "multiple",
-    "muted"
-  ]);
-  let prevValue = void 0;
-  return createRenderEffect(() => {
-    const next = getValue();
-    if (next === prevValue) return;
-    prevValue = next;
-    if (PROPERTY_BINDING_KEYS.has(key) && (next === void 0 || next === null)) {
-      const fallback = key === "checked" || key === "selected" ? false : "";
-      el[key] = fallback;
-      return;
-    }
-    ;
-    el[key] = next;
-  });
+  return createRenderEffect(() => setProp(el, key, getValue()));
+}
+function setProp(el, key, value) {
+  const cacheTarget = el;
+  const propCache = cacheTarget[PROP_CACHE] ?? (cacheTarget[PROP_CACHE] = /* @__PURE__ */ Object.create(null));
+  if (propCache[key] === value) return;
+  propCache[key] = value;
+  if (PROPERTY_BINDING_KEYS.has(key) && (value === void 0 || value === null)) {
+    const fallback = key === "checked" || key === "selected" ? false : "";
+    el[key] = fallback;
+    return;
+  }
+  ;
+  el[key] = value;
 }
 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 bindStyle(el, getValue) {
+  return createRenderEffect(() => setStyle(el, getValue()));
+}
+function setStyle(el, value) {
   const target = el;
-  let prev;
-  return createRenderEffect(() => {
-    const next = getValue();
-    applyStyle(target, next, prev);
-    prev = next;
-  });
+  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") {
@@ -503,29 +590,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") {
@@ -534,32 +625,38 @@ function applyStyle(el, value, prev) {
   }
 }
 var isUnitlessStyleProperty = isDev ? (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 bindClass(el, getValue) {
-  let prev = {};
-  let prevString;
-  return createRenderEffect(() => {
-    const next = getValue();
-    if (typeof next === "string") {
-      if (next === prevString) return;
-      prevString = next;
-      el.className = next;
-      prev = {};
-      return;
-    }
-    prevString = void 0;
-    prev = applyClass(el, next, prev);
-  });
+  return createRenderEffect(() => setClass(el, getValue()));
+}
+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+/);
@@ -1509,9 +1606,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);
@@ -1530,6 +1639,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;
@@ -1547,7 +1685,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);
@@ -1679,7 +1817,7 @@ function prop(getter, options) {
 // src/dom.ts
 var SVG_NS = "http://www.w3.org/2000/svg";
 var MATHML_NS = "http://www.w3.org/1998/Math/MathML";
-var isDev2 = typeof __DEV__ !== "undefined" ? __DEV__ : typeof process === "undefined" || process.env?.NODE_ENV !== "production";
+var isDev2 = typeof __DEV__ !== "undefined" ? __DEV__ : typeof process !== "undefined" && process.env?.NODE_ENV !== "production";
 var nextComponentId = 1;
 function render(view, container) {
   const root = createRootContext();
@@ -1752,6 +1890,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;
@@ -1945,9 +2086,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)) {
@@ -2220,17 +2364,24 @@ export {
   batch2 as batch,
   untrack2 as untrack,
   isReactive,
+  nonReactive,
+  reactive,
   unwrap,
   callEventHandler,
   createTextBinding,
   bindText,
+  setText,
   createAttributeBinding,
   bindAttribute,
+  setAttr,
   bindProperty,
+  setProp,
   createStyleBinding,
   bindStyle,
+  setStyle,
   createClassBinding,
   bindClass,
+  setClass,
   classList,
   insert,
   insertBetween,
@@ -2256,4 +2407,4 @@ export {
   createElement,
   template
 };
-//# sourceMappingURL=chunk-D2IWOO4X.js.map
+//# sourceMappingURL=chunk-4LCHQ7U4.js.map