creo 0.2.5 → 0.2.7

package/dist/index.js

@@ -23,9 +23,6 @@ function hasScStructuralChange(prev, next) {
   return false;
 }
 
-// src/public/primitive.ts
-var $primitive = Symbol("primitive");
-
 // src/internal/orchestrator.ts
 class Orchestrator {
   #currentEngine;
@@ -39,6 +36,14 @@ class Orchestrator {
 var orchestrator = new Orchestrator;
 
 // src/public/view.ts
+function applyRef(ref, value) {
+  if (!ref)
+    return;
+  if (typeof ref === "function")
+    ref(value);
+  else
+    ref.current = value;
+}
 function view(body) {
   return (props, slot) => {
     orchestrator.currentEngine().view(body, props, slot, maybeGetUserKey(props));
@@ -50,6 +55,9 @@ function maybeGetUserKey(params) {
   }
 }
 
+// src/public/primitive.ts
+var $primitive = Symbol("primitive");
+
 // src/public/primitives/primitives.ts
 function html(tag) {
   const fn = ({
@@ -177,6 +185,7 @@ var area = html("area");
 class State {
   #current;
   #schedule;
+  #pending;
   constructor(initial, schedule) {
     this.#current = initial;
     this.#schedule = schedule;
@@ -185,30 +194,49 @@ class State {
     return this.#current;
   }
   set(value) {
+    this.#pending = null;
     this.#current = value;
     this.#schedule();
   }
   update(fn) {
-    const result = fn(this.#current);
-    if (result instanceof Promise) {
-      result.then((value) => {
+    if (this.#pending) {
+      const next = this.#pending.then((v) => fn(v));
+      this.#pending = next;
+      next.then((value) => {
+        if (this.#pending !== next)
+          return;
+        this.#pending = null;
         this.#current = value;
         this.#schedule();
       });
-    } else {
+      return;
+    }
+    const result = fn(this.#current);
+    if (!(result instanceof Promise)) {
       this.#current = result;
       this.#schedule();
+      return;
     }
+    const captured = result;
+    this.#pending = captured;
+    captured.then((value) => {
+      if (this.#pending !== captured)
+        return;
+      this.#pending = null;
+      this.#current = value;
+      this.#schedule();
+    });
   }
 }
 
 // src/public/store.ts
-var $store = Symbol("store");
+var $store = Symbol.for("creo.store");
 
 class Store {
   [$store] = true;
   #current;
   #subscribers = new Set;
+  #pending;
   constructor(initial) {
     this.#current = initial;
   }
@@ -216,20 +244,38 @@ class Store {
     return this.#current;
   }
   set(value) {
+    this.#pending = null;
     this.#current = value;
     this.#notify();
   }
   update(fn) {
-    const result = fn(this.#current);
-    if (result instanceof Promise) {
-      result.then((value) => {
+    if (this.#pending) {
+      const next = this.#pending.then((v) => fn(v));
+      this.#pending = next;
+      next.then((value) => {
+        if (this.#pending !== next)
+          return;
+        this.#pending = null;
         this.#current = value;
         this.#notify();
       });
-    } else {
+      return;
+    }
+    const result = fn(this.#current);
+    if (!(result instanceof Promise)) {
       this.#current = result;
       this.#notify();
+      return;
     }
+    const captured = result;
+    this.#pending = captured;
+    captured.then((value) => {
+      if (this.#pending !== captured)
+        return;
+      this.#pending = null;
+      this.#current = value;
+      this.#notify();
+    });
   }
   subscribe(cb) {
     this.#subscribers.add(cb);
@@ -262,12 +308,15 @@ function shallowEqual(a2, b2) {
   let countA = 0;
   for (const key in a2) {
     countA++;
-    if (!Object.is(a2[key], b2[key]))
+    if (a2[key] !== b2[key])
       return false;
   }
   let countB = 0;
-  for (const _ in b2)
+  for (const _ in b2) {
     countB++;
+    if (countB > countA)
+      return false;
+  }
   return countA === countB;
 }
 
@@ -307,15 +356,10 @@ function lis(arr) {
 }
 
 // src/internal/engine.ts
-var STATEFUL_DOM_KEYS = ["value", "checked", "selected", "indeterminate", "muted"];
-function hasStatefulDomKey(props) {
-  if (props == null || typeof props !== "object")
-    return false;
-  for (const k of STATEFUL_DOM_KEYS) {
-    if (k in props)
-      return true;
-  }
-  return false;
+function getConsumerRef(view2) {
+  if (view2.flags & F_PRIMITIVE)
+    return;
+  return view2.props?.ref;
 }
 
 class Engine {
@@ -345,11 +389,18 @@ class Engine {
       keyToView: null,
       unsubscribe: null,
       parent,
-      scHost: null
+      scHost: null,
+      pos: -1,
+      publicRef: null
     };
     if (slot2) {
-      const slotFn = typeof slot2 === "string" ? this.#stringSlot(slot2) : slot2;
-      res.sc = this.#collect(slotFn, [], res);
+      if (typeof slot2 === "string") {
+        res.sc = [
+          this.newView(textViewFn, res, slot2, null, null)
+        ];
+      } else {
+        res.sc = this.#collect(slot2, [], res);
+      }
     }
     return res;
   }
@@ -396,6 +447,10 @@ class Engine {
           child.parent = this.#collectFor ?? view2;
           this.#collector?.push(child);
         }
+      },
+      ref: (value) => {
+        view2.publicRef = value;
+        applyRef(getConsumerRef(view2), value);
       }
     });
   }
@@ -448,28 +503,34 @@ class Engine {
     this.#collectFor = beforeParent;
     return collector;
   }
-  #stringSlot(content) {
-    return () => {
-      this.view(textViewFn, content, null, null);
-    };
-  }
   nextProps(view2, nextProps, nextSlot, preCollectedSc) {
+    const prevRef = getConsumerRef(view2);
+    const nextRef = nextProps?.ref;
+    if (prevRef !== nextRef) {
+      if (prevRef)
+        applyRef(prevRef, null);
+      if (nextRef && view2.publicRef != null)
+        applyRef(nextRef, view2.publicRef);
+    }
     const prevSc = view2.sc;
     view2.slot = nextSlot;
     if (preCollectedSc) {
       for (const child of preCollectedSc)
         child.parent = view2;
       view2.sc = preCollectedSc;
-    } else {
-      if (nextSlot) {
-        const slotFn = typeof nextSlot === "string" ? this.#stringSlot(nextSlot) : nextSlot;
-        view2.sc = this.#collect(slotFn, [], view2);
+    } else if (nextSlot) {
+      if (typeof nextSlot === "string") {
+        view2.sc = [
+          this.newView(textViewFn, view2, nextSlot, null, null)
+        ];
       } else {
-        view2.sc = null;
+        view2.sc = this.#collect(nextSlot, [], view2);
       }
+    } else {
+      view2.sc = null;
     }
     const structChanged = hasScStructuralChange(prevSc, view2.sc);
-    const shouldUpdate = view2.body?.shouldUpdate ? view2.body.shouldUpdate(nextProps) : !shallowEqual(view2.props, nextProps) || (view2.flags & F_PRIMITIVE) !== 0 && hasStatefulDomKey(nextProps);
+    const shouldUpdate = view2.body?.shouldUpdate ? view2.body.shouldUpdate(nextProps) : !shallowEqual(view2.props, nextProps) || (view2.flags & F_PRIMITIVE) !== 0 && this.renderer.shouldReassert?.(view2, nextProps) === true;
     if (shouldUpdate || structChanged) {
       view2.props = nextProps;
       this.markDirty(view2);
@@ -521,7 +582,9 @@ class Engine {
     }
     if (view2.children == null) {
       view2.children = pendingChildren;
-      for (const child of pendingChildren) {
+      for (let i2 = 0;i2 < pendingChildren.length; i2++) {
+        const child = pendingChildren[i2];
+        child.pos = i2;
         this.initViewBody(child);
         this.markDirty(child);
         if (child.userKey != null) {
@@ -547,9 +610,11 @@ class Engine {
       const old = oldChildren[i2];
       const pend = pending[i2];
       this.#patchOrReplace(view2, oldChildren, i2, old, pend);
+      oldChildren[i2].pos = i2;
     }
     for (let i2 = oldLen;i2 < newLen; i2++) {
       oldChildren[i2] = pending[i2];
+      pending[i2].pos = i2;
       this.initViewBody(pending[i2]);
       this.markDirty(pending[i2]);
     }
@@ -589,21 +654,46 @@ class Engine {
           view2.keyToView.set(pending[j].userKey, pending[j]);
         }
       }
-      view2.children = [
-        ...oldChildren.slice(0, i2),
-        ...pending.slice(i2, newEnd + 1),
-        ...oldChildren.slice(i2, oldEnd + 1)
-      ];
+      const tailStart2 = oldEnd + 1;
+      const tailLen2 = oldChildren.length - tailStart2;
+      const insertCount = newEnd - i2 + 1;
+      const out2 = new Array(i2 + insertCount + tailLen2);
+      for (let j = 0;j < i2; j++) {
+        const c = oldChildren[j];
+        c.pos = j;
+        out2[j] = c;
+      }
+      for (let j = 0;j < insertCount; j++) {
+        const c = pending[i2 + j];
+        c.pos = i2 + j;
+        out2[i2 + j] = c;
+      }
+      for (let j = 0;j < tailLen2; j++) {
+        const c = oldChildren[tailStart2 + j];
+        c.pos = i2 + insertCount + j;
+        out2[i2 + insertCount + j] = c;
+      }
+      view2.children = out2;
       return;
     }
     if (i2 > newEnd) {
       for (let j = i2;j <= oldEnd; j++) {
         this.dispose(oldChildren[j]);
       }
-      view2.children = [
-        ...oldChildren.slice(0, i2),
-        ...oldChildren.slice(oldEnd + 1)
-      ];
+      const tailStart2 = oldEnd + 1;
+      const tailLen2 = oldChildren.length - tailStart2;
+      const out2 = new Array(i2 + tailLen2);
+      for (let j = 0;j < i2; j++) {
+        const c = oldChildren[j];
+        c.pos = j;
+        out2[j] = c;
+      }
+      for (let j = 0;j < tailLen2; j++) {
+        const c = oldChildren[tailStart2 + j];
+        c.pos = i2 + j;
+        out2[i2 + j] = c;
+      }
+      view2.children = out2;
       return;
     }
     const newKeyToIndex = new Map;
@@ -630,7 +720,14 @@ class Engine {
       }
     }
     const stable = lis(newIdxToOldIdx);
-    const newChildren = new Array(middleLen);
+    const tailStart = oldEnd + 1;
+    const tailLen = oldChildren.length - tailStart;
+    const out = new Array(i2 + middleLen + tailLen);
+    for (let j = 0;j < i2; j++) {
+      const c = oldChildren[j];
+      c.pos = j;
+      out[j] = c;
+    }
     for (let j = middleLen - 1;j >= 0; j--) {
       const newIdx = i2 + j;
       const pendView = pending[newIdx];
@@ -642,19 +739,25 @@ class Engine {
             view2.keyToView = new Map;
           view2.keyToView.set(pendView.userKey, pendView);
         }
-        newChildren[j] = pendView;
+        pendView.pos = i2 + j;
+        out[i2 + j] = pendView;
       } else {
         const oldView = oldChildren[newIdxToOldIdx[j]];
         this.#patchOrReplace(view2, oldChildren, newIdxToOldIdx[j], oldView, pendView);
         if (!stable.has(j)) {
           this.markMoved(oldView);
         }
-        newChildren[j] = oldView;
+        const placed = oldChildren[newIdxToOldIdx[j]];
+        placed.pos = i2 + j;
+        out[i2 + j] = placed;
       }
     }
-    const head = oldChildren.slice(0, i2);
-    const tail = oldChildren.slice(oldEnd + 1);
-    view2.children = [...head, ...newChildren, ...tail];
+    for (let j = 0;j < tailLen; j++) {
+      const c = oldChildren[tailStart + j];
+      c.pos = i2 + middleLen + j;
+      out[i2 + middleLen + j] = c;
+    }
+    view2.children = out;
   }
   #patchOrReplace(parent, oldChildren, idx, oldView, pendView) {
     if (oldView.viewFn === pendView.viewFn) {
@@ -682,6 +785,8 @@ class Engine {
         }
       }
     }
+    view2.body?.dispose?.();
+    applyRef(getConsumerRef(view2), null);
     if (view2.unsubscribe)
       for (const unsub of view2.unsubscribe)
         unsub();
@@ -697,6 +802,8 @@ class Engine {
       for (const child of view2.children)
         this.#disposeVirtual(child);
     }
+    view2.body?.dispose?.();
+    applyRef(getConsumerRef(view2), null);
     if (view2.unsubscribe)
       for (const unsub of view2.unsubscribe)
         unsub();
@@ -763,45 +870,6 @@ function createApp(slot2, renderer, options) {
   };
 }
 // src/render/html_render.ts
-function isEventProp(key) {
-  return key.charCodeAt(0) === 111 && key.charCodeAt(1) === 110 && key.charCodeAt(2) >= 65 && key.charCodeAt(2) <= 90;
-}
-var DOM_EVENT = {
-  Click: "click",
-  Dblclick: "dblclick",
-  PointerDown: "pointerdown",
-  PointerUp: "pointerup",
-  PointerMove: "pointermove",
-  Input: "input",
-  Change: "change",
-  KeyDown: "keydown",
-  KeyUp: "keyup",
-  Focus: "focus",
-  Blur: "blur",
-  MouseEnter: "mouseenter",
-  MouseLeave: "mouseleave",
-  PointerEnter: "pointerenter",
-  PointerLeave: "pointerleave",
-  Scroll: "scroll",
-  Load: "load",
-  Error: "error",
-  Toggle: "toggle",
-  VolumeChange: "volumechange",
-  Play: "play",
-  Pause: "pause",
-  Ended: "ended",
-  TimeUpdate: "timeupdate",
-  LoadedMetadata: "loadedmetadata",
-  LoadedData: "loadeddata",
-  CanPlay: "canplay",
-  CanPlayThrough: "canplaythrough",
-  DurationChange: "durationchange",
-  RateChange: "ratechange",
-  Seeking: "seeking",
-  Seeked: "seeked",
-  Stalled: "stalled",
-  Waiting: "waiting"
-};
 var $EV = Symbol.for("creo.ev");
 var containerState = new WeakMap;
 function getState(container) {
@@ -818,7 +886,7 @@ function getState(container) {
           if (evObj) {
             const handler = evObj[domEvent];
             if (handler) {
-              handler(mapEventData(domEvent, e));
+              handler(mapEventData(domEvent, e, dom));
               if (e.cancelBubble)
                 return;
             }
@@ -836,8 +904,6 @@ function getState(container) {
 var CAPTURE_EVENTS = new Set([
   "focus",
   "blur",
-  "mouseenter",
-  "mouseleave",
   "pointerenter",
   "pointerleave",
   "scroll",
@@ -861,8 +927,6 @@ var CAPTURE_EVENTS = new Set([
   "waiting"
 ]);
 var NO_WALK_EVENTS = new Set([
-  "mouseenter",
-  "mouseleave",
   "pointerenter",
   "pointerleave"
 ]);
@@ -898,8 +962,7 @@ var POINTER_EVENTS = new Set([
   "pointerdown",
   "pointerup",
   "pointermove",
-  "mouseenter",
-  "mouseleave",
+  "pointercancel",
   "pointerenter",
   "pointerleave"
 ]);
@@ -920,11 +983,32 @@ var MEDIA_EVENTS = new Set([
   "stalled",
   "waiting"
 ]);
-function mapEventData(domEvent, e) {
+function mapEventData(domEvent, e, currentTarget) {
   let data2;
   if (POINTER_EVENTS.has(domEvent)) {
     const pe = e;
-    data2 = { x: pe.clientX, y: pe.clientY };
+    const pointerId = typeof pe.pointerId === "number" ? pe.pointerId : -1;
+    data2 = {
+      x: pe.clientX,
+      y: pe.clientY,
+      pointerId,
+      pointerType: typeof pe.pointerType === "string" ? pe.pointerType : "",
+      button: typeof pe.button === "number" ? pe.button : 0,
+      buttons: typeof pe.buttons === "number" ? pe.buttons : 0,
+      target: e.target,
+      currentTarget,
+      capture: () => {
+        if (pointerId >= 0 && currentTarget.setPointerCapture) {
+          currentTarget.setPointerCapture(pointerId);
+        }
+      },
+      release: () => {
+        if (pointerId >= 0 && currentTarget.releasePointerCapture) {
+          currentTarget.releasePointerCapture(pointerId);
+        }
+      },
+      nativeEvent: e
+    };
   } else if (domEvent === "input" || domEvent === "change") {
     const target = e.target;
     data2 = { value: target.value, checked: !!target.checked };
@@ -992,6 +1076,7 @@ class HtmlRender {
           const domRef = { element, prevProps: null };
           view2.renderRef = domRef;
           this.setAttributes(element, props);
+          domRef.prevProps = props;
           if (view2.children?.length === 1) {
             const child = view2.children[0];
             if (child.flags & F_PRIMITIVE && child.viewFn[$primitive] === "text") {
@@ -1001,6 +1086,12 @@ class HtmlRender {
             }
           }
           parentNode.insertBefore(element, refNode);
+          if (props != null && props.autofocus === true && typeof element.focus === "function") {
+            element.focus();
+          }
+          if (props != null) {
+            applyRef(props.ref, element);
+          }
         }
       } else {
         view2.renderRef = true;
@@ -1050,6 +1141,28 @@ class HtmlRender {
     }
     view2.renderRef = undefined;
   }
+  shouldReassert(view2, nextProps) {
+    if (nextProps == null || typeof nextProps !== "object")
+      return false;
+    const ref = view2.renderRef;
+    if (!ref || ref.element instanceof Text)
+      return false;
+    const el = ref.element;
+    const props = nextProps;
+    for (const key of DOM_PROPERTIES) {
+      if (!(key in props))
+        continue;
+      const live = el[key];
+      const next = props[key];
+      if (typeof next === "boolean" || typeof live === "boolean") {
+        if (Boolean(live) !== Boolean(next))
+          return true;
+      } else if (String(live) !== String(next)) {
+        return true;
+      }
+    }
+    return false;
+  }
   findParentDom(view2) {
     let parent = view2.parent;
     while (parent) {
@@ -1070,7 +1183,9 @@ class HtmlRender {
     if (children[children.length - 1] === view2) {
       return this.#parentEndAnchor(parent);
     }
-    const idx = children.indexOf(view2);
+    let idx = view2.pos;
+    if (idx < 0 || children[idx] !== view2)
+      idx = children.indexOf(view2);
     for (let i2 = idx + 1;i2 < children.length; i2++) {
       const dom = this.getFirstDomNode(children[i2]);
       if (dom)
@@ -1084,59 +1199,88 @@ class HtmlRender {
     return this.findInsertionPoint(parent);
   }
   setAttributes(element, props) {
+    if (props == null)
+      return;
     for (const key in props) {
       const value = props[key];
-      if (key === "key" || value == null)
-        continue;
-      if (isEventProp(key)) {
-        this.bindEvent(element, key, value);
+      if (key === "key" || key === "ref" || key === "on" || value == null)
         continue;
-      }
       this.setAttribute(element, key, value);
     }
+    const on = props.on;
+    if (on) {
+      for (const ev in on) {
+        const handler = on[ev];
+        if (handler)
+          this.bindEvent(element, ev, handler);
+      }
+    }
   }
   diffAttributes(element, prev, next) {
-    for (const key in prev) {
-      if (key === "key")
-        continue;
-      if (!(key in next) || next[key] == null) {
-        if (isEventProp(key)) {
-          this.unbindEvent(element, key);
-        } else {
+    if (prev) {
+      for (const key in prev) {
+        if (key === "key" || key === "ref" || key === "on")
+          continue;
+        if (next == null || !(key in next) || next[key] == null) {
           this.removeAttribute(element, key);
         }
       }
     }
-    for (const key in next) {
-      const value = next[key];
-      if (key === "key" || value == null)
-        continue;
-      if (prev[key] === value && !DOM_PROPERTIES.has(key))
-        continue;
-      if (isEventProp(key)) {
-        const creoName = key.slice(2);
-        const domEvent = DOM_EVENT[creoName] ?? creoName.toLowerCase();
+    if (next) {
+      for (const key in next) {
+        const value = next[key];
+        if (key === "key" || key === "ref" || key === "on" || value == null)
+          continue;
+        if (prev && prev[key] === value && !DOM_PROPERTIES.has(key))
+          continue;
+        this.setAttribute(element, key, value);
+      }
+    }
+    const prevOn = prev?.on;
+    const nextOn = next?.on;
+    if (prevOn !== nextOn) {
+      this.diffEvents(element, prevOn, nextOn);
+    }
+    const prevRef = prev?.ref;
+    const nextRef = next?.ref;
+    if (prevRef !== nextRef) {
+      applyRef(prevRef, null);
+      applyRef(nextRef, element);
+    }
+  }
+  diffEvents(element, prev, next) {
+    if (prev) {
+      for (const ev in prev) {
+        if (!next || next[ev] == null) {
+          this.unbindEvent(element, ev);
+        }
+      }
+    }
+    if (next) {
+      for (const ev in next) {
+        const value = next[ev];
+        if (value == null)
+          continue;
+        if (prev && prev[ev] === value)
+          continue;
+        const domEvent = ev.toLowerCase();
         const evObj = element[$EV];
-        if (evObj) {
+        if (evObj && domEvent in evObj) {
           evObj[domEvent] = value;
         } else {
-          this.bindEvent(element, key, value);
+          this.bindEvent(element, ev, value);
         }
-      } else {
-        this.setAttribute(element, key, value);
       }
     }
   }
-  bindEvent(element, prop, handler) {
-    const creoName = prop.slice(2);
-    const domEvent = DOM_EVENT[creoName] ?? creoName.toLowerCase();
+  bindEvent(element, eventName, handler) {
+    const domEvent = eventName.toLowerCase();
     const evObj = element[$EV] ?? (element[$EV] = {});
     evObj[domEvent] = handler;
     ensureDelegated(this.container, domEvent);
   }
-  unbindEvent(element, prop) {
-    const creoName = prop.slice(2);
-    const domEvent = DOM_EVENT[creoName] ?? creoName.toLowerCase();
+  unbindEvent(element, eventName) {
+    const domEvent = eventName.toLowerCase();
     const evObj = element[$EV];
     if (evObj) {
       delete evObj[domEvent];
@@ -1210,6 +1354,9 @@ class HtmlRender {
       }
       delete ref.element[$EV];
     }
+    const prevProps = ref.prevProps;
+    if (prevProps)
+      applyRef(prevProps.ref, null);
     ref.element.parentNode?.removeChild(ref.element);
   }
 }
@@ -1230,7 +1377,7 @@ class JsonRender {
       }
       const parentNode = view2.parent.renderRef;
       if (parentNode) {
-        const idx = view2.parent.children ? view2.parent.children.indexOf(view2) : -1;
+        const idx = view2.pos;
         if (idx >= 0 && idx < parentNode.children.length) {
           parentNode.children.splice(idx, 0, node);
         } else {
@@ -1242,11 +1389,13 @@ class JsonRender {
     if (view2.parent) {
       const parentNode = view2.parent.renderRef;
       if (parentNode) {
-        const oldIdx = parentNode.children.indexOf(existing);
-        const targetIdx = view2.parent.children ? view2.parent.children.indexOf(view2) : -1;
-        if (oldIdx !== -1 && targetIdx !== -1 && oldIdx !== targetIdx) {
-          parentNode.children.splice(oldIdx, 1);
-          parentNode.children.splice(Math.min(targetIdx, parentNode.children.length), 0, existing);
+        const targetIdx = view2.pos;
+        if (targetIdx >= 0 && parentNode.children[targetIdx] !== existing) {
+          const oldIdx = parentNode.children.indexOf(existing);
+          if (oldIdx !== -1) {
+            parentNode.children.splice(oldIdx, 1);
+            parentNode.children.splice(Math.min(targetIdx, parentNode.children.length), 0, existing);
+          }
         }
       }
     }
@@ -1292,9 +1441,6 @@ var VOID_TAGS = new Set([
   "wbr"
 ]);
 var DOM_PROPERTIES2 = new Set(["value", "checked", "selected", "indeterminate", "muted"]);
-function isEventProp2(key) {
-  return key.charCodeAt(0) === 111 && key.charCodeAt(1) === 110 && key.charCodeAt(2) >= 65 && key.charCodeAt(2) <= 90;
-}
 function escapeHtml(str) {
   return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 }
@@ -1331,12 +1477,14 @@ class HtmlStringRender {
     return this.buildChildren(rec);
   }
   buildAttrs(props) {
+    if (props == null)
+      return "";
     let result = "";
     for (const key in props) {
       const value = props[key];
       if (key === "key" || value == null)
         continue;
-      if (isEventProp2(key))
+      if (key === "on" || key === "ref")
         continue;
       if (DOM_PROPERTIES2.has(key))
         continue;
@@ -1368,7 +1516,6 @@ class HtmlStringRender {
     return result;
   }
 }
-var StringRender = HtmlStringRender;
 // src/functional/maybe.ts
 function just(maybe, errorMessage) {
   if (maybe == null) {
@@ -1500,11 +1647,11 @@ export {
   aside,
   article,
   area,
+  applyRef,
   address,
   abbr,
   a,
   _,
-  StringRender,
   Store,
   State,
   JsonRender,
@@ -1514,4 +1661,4 @@ export {
   $primitive
 };
 
-//# debugId=AEF6273D02CC4DF064756E2164756E21
+//# debugId=020C6F0F4AB24D1164756E2164756E21