vaderjs 2.3.6 → 2.3.7

package/index.ts

@@ -104,9 +104,16 @@ function createDom(fiber: Fiber): Node {
   }
 
   updateDom(dom, {}, fiber.props);
+  
+  // Assign ref if this fiber has a ref prop
+  if (fiber.props && fiber.props.ref) {
+    fiber.props.ref.current = dom;
+  }
+  
   return dom;
 }
 
+
 function isSvgElement(fiber: Fiber): boolean {
   // Check if the fiber is an <svg> itself or inside an <svg>
   let parent = fiber.parent; 
@@ -126,11 +133,19 @@ function isSvgElement(fiber: Fiber): boolean {
  * @param {object} nextProps - The new properties.
  */
 function updateDom(dom: Node, prevProps: any, nextProps: any): void {
-  prevProps = prevProps || {};
+   prevProps = prevProps || {};
   nextProps = nextProps || {};
 
   const isSvg = dom instanceof SVGElement;
 
+  // Handle ref updates
+  if (prevProps.ref && prevProps.ref !== nextProps.ref) {
+    prevProps.ref.current = null;
+  }
+  if (nextProps.ref && nextProps.ref !== prevProps.ref) {
+    nextProps.ref.current = dom;
+  } 
+
   // Remove old or changed event listeners
   Object.keys(prevProps)
     .filter(isEvent)
@@ -231,18 +246,31 @@ function commitRoot(): void {
  * @param {Fiber} fiber - The fiber to commit.
  */
 function commitWork(fiber: Fiber | null): void {
-  if (!fiber) {
-    return;
-  }
+  if (!fiber) return;
 
   let domParentFiber = fiber.parent;
   while (domParentFiber && !domParentFiber.dom) {
     domParentFiber = domParentFiber.parent;
   }
-  const domParent = domParentFiber ? domParentFiber.dom : null;
+  const domParent = domParentFiber?.dom ?? null;
 
   if (fiber.effectTag === "PLACEMENT" && fiber.dom != null) {
     if (domParent) domParent.appendChild(fiber.dom);
+    
+    // ⚡ Assign refs immediately when DOM is placed
+    if (fiber.props && fiber.props.ref) {
+      fiber.props.ref.current = fiber.dom;
+    }
+    
+    // Also check for useRef hooks in this fiber
+    if (fiber.hooks) {
+      for (const hook of fiber.hooks) {
+        if ("current" in hook && !hook._isRef && fiber.dom) {
+          // This is likely a DOM ref hook
+          hook.current = fiber.dom;
+        }
+      }
+    }
   } else if (fiber.effectTag === "UPDATE" && fiber.dom != null) {
     updateDom(fiber.dom, fiber.alternate?.props ?? {}, fiber.props);
   } else if (fiber.effectTag === "DELETION") {
@@ -253,14 +281,21 @@ function commitWork(fiber: Fiber | null): void {
   commitWork(fiber.sibling);
 }
 
+
 /**
  * Recursively removes a fiber and its children from the DOM.
  * @param {Fiber} fiber - The fiber to remove.
  */
-function commitDeletion(fiber: Fiber | null): void {
+ function commitDeletion(fiber: Fiber | null): void {
   if (!fiber) {
     return;
   }
+  
+  // Clear refs when element is removed
+  if (fiber.props && fiber.props.ref) {
+    fiber.props.ref.current = null;
+  }
+  
   if (fiber.dom) {
     if (fiber.dom.parentNode) {
       fiber.dom.parentNode.removeChild(fiber.dom);
@@ -641,7 +676,7 @@ export function useRef<T>(initial: T): { current: T } {
 
   let hook = wipFiber.hooks[hookIndex];
   if (!hook) {
-    hook = { current: initial };
+    hook = { current: initial, _isRef: true };
     wipFiber.hooks[hookIndex] = hook;
   }
 

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "vaderjs",
-    "version": "2.3.6",
-    "description": "A simple and powerful JavaScript library for building modern web applications.", 
+    "version": "2.3.7",
+    "description": "A simple and powerful JavaScript library for building modern web applications.",
     "bin": {
         "vaderjs": "./main.js"
     },
@@ -9,7 +9,7 @@
         "type": "git",
         "url": "https://github.com/Postr-Inc/Vader.js"
     },
-    "license":"MIT",
+    "license": "MIT",
     "dependencies": {
         "ansi-colors": "latest"
     }