babel-plugin-essor 0.0.15-beta.1 → 0.0.15-beta.5

package/dist/index.js

@@ -19,7 +19,7 @@ var __spreadValues = (a2, b) => {
 var __spreadProps = (a2, b) => __defProps(a2, __getOwnPropDescs(b));
 
 // src/program.ts
-import { types as t2 } from "@babel/core";
+import { types as t4 } from "@babel/core";
 
 // src/import.ts
 import { types as t } from "@babel/core";
@@ -205,75 +205,31 @@ function createImport(path, imports, from) {
   }
 }
 
-// src/program.ts
-var transformProgram = {
-  enter: (path, state) => {
-    const opts = __spreadValues(__spreadValues({}, DEFAULT_OPTIONS), state.opts);
-    const imports = createImportIdentifiers(path);
-    clearImport();
-    path.state = __spreadProps(__spreadValues({}, state), {
-      opts,
-      imports,
-      declarations: [],
-      // Collect template declarations during transformation
-      filename: state.filename,
-      events: /* @__PURE__ */ new Set()
-      // Track delegated events for optimization
-    });
-  },
-  // eslint-disable-next-line unused-imports/no-unused-vars
-  exit: (path, state) => {
-    const pluginState = path.state;
-    const { imports, declarations, events } = pluginState;
-    const insertIndex = path.node.body.findIndex(
-      (node) => !t2.isImportDeclaration(node) && !t2.isExportDeclaration(node)
-    );
-    if (declarations == null ? void 0 : declarations.length) {
-      const templateDeclaration = t2.variableDeclaration("const", declarations);
-      if (insertIndex !== -1) {
-        path.node.body.splice(insertIndex, 0, templateDeclaration);
-      } else {
-        path.node.body.push(templateDeclaration);
-      }
-    }
-    if (events && events.size > 0) {
-      const eventsDeclaration = t2.expressionStatement(
-        t2.callExpression(imports.delegateEvents, [
-          t2.arrayExpression(Array.from(events).map((event) => t2.stringLiteral(event)))
-        ])
-      );
-      addImport(importMap.delegateEvents);
-      path.node.body.push(eventsDeclaration);
-    }
-    createImport(path, imports, "essor");
-  }
-};
-
-// src/signals/props.ts
-import { types as t4 } from "@babel/core";
+// src/signals/symbol.ts
+import { types as t3 } from "@babel/core";
 
 // src/signals/utils.ts
-import { types as t3 } from "@babel/core";
+import { types as t2 } from "@babel/core";
 function isValidPath(path) {
   return !!(path && path.node);
 }
 function isJSXNode(node) {
-  return !!(node && (t3.isJSXElement(node) || t3.isJSXFragment(node)));
+  return !!(node && (t2.isJSXElement(node) || t2.isJSXFragment(node)));
 }
 function mightReturnJSX(expr) {
   if (isJSXNode(expr)) {
     return true;
   }
-  if (t3.isConditionalExpression(expr)) {
+  if (t2.isConditionalExpression(expr)) {
     return mightReturnJSX(expr.consequent) || mightReturnJSX(expr.alternate);
   }
-  if (t3.isLogicalExpression(expr)) {
+  if (t2.isLogicalExpression(expr)) {
     return mightReturnJSX(expr.left) || mightReturnJSX(expr.right);
   }
-  if (t3.isSequenceExpression(expr)) {
+  if (t2.isSequenceExpression(expr)) {
     return expr.expressions.some(mightReturnJSX);
   }
-  if (t3.isParenthesizedExpression(expr)) {
+  if (t2.isParenthesizedExpression(expr)) {
     return mightReturnJSX(expr.expression);
   }
   return false;
@@ -283,7 +239,7 @@ function checkHasJSXReturn(path) {
   try {
     const body = path.get("body");
     if (!isValidPath(body)) return false;
-    if (!t3.isBlockStatement(body.node)) {
+    if (!t2.isBlockStatement(body.node)) {
       return mightReturnJSX(body.node);
     }
     let hasJSX = false;
@@ -304,202 +260,22 @@ function checkHasJSXReturn(path) {
   }
 }
 function isMemberAccessingProperty(node, propertyName) {
-  if (!node.computed && t3.isIdentifier(node.property) && node.property.name === propertyName) {
+  if (!node.computed && t2.isIdentifier(node.property) && node.property.name === propertyName) {
     return true;
   }
-  if (node.computed && t3.isStringLiteral(node.property) && node.property.value === propertyName) {
+  if (node.computed && t2.isStringLiteral(node.property) && node.property.value === propertyName) {
     return true;
   }
   return false;
 }
 
-// src/signals/props.ts
-function transformProperty(path, properties, parentPath, defaultValues = {}) {
-  properties.forEach((property, index) => {
-    try {
-      if (!t4.isObjectProperty(property)) {
-        return;
-      }
-      if (!t4.isIdentifier(property.key)) {
-        if (true) {
-          ne("transformObjectProperties: Skipping computed property", { index });
-        }
-        return;
-      }
-      const keyName = property.key.name;
-      if (t4.isIdentifier(property.value)) {
-        path.scope.rename(property.value.name, `${parentPath}.${keyName}`);
-      } else if (t4.isAssignmentPattern(property.value)) {
-        if (t4.isIdentifier(property.value.left)) {
-          defaultValues[keyName] = property.value.right;
-          path.scope.rename(property.value.left.name, `${parentPath}.${keyName}`);
-        } else if (t4.isObjectPattern(property.value.left)) {
-          transformProperty(
-            path,
-            property.value.left.properties,
-            `${parentPath}.${keyName}`,
-            defaultValues
-          );
-          defaultValues[keyName] = property.value.right;
-        }
-      } else if (t4.isObjectPattern(property.value)) {
-        transformProperty(
-          path,
-          property.value.properties,
-          `${parentPath}.${keyName}`,
-          defaultValues
-        );
-      }
-    } catch (error) {
-      ne("transformProperty", `Failed to process property at index ${index}`, {
-        error: error instanceof Error ? error.message : String(error)
-      });
-    }
-  });
-  return defaultValues;
-}
-function buildRestVariableDeclaration(state, restName, parentPath, excludeProps) {
-  const validExcludeProps = excludeProps.filter(Boolean);
-  let init;
-  const pathParts = parentPath.split(".").filter((part) => part.length > 0);
-  let sourceObject = t4.identifier(pathParts[0] || "__props");
-  for (let i = 1; i < pathParts.length; i++) {
-    sourceObject = t4.memberExpression(sourceObject, t4.identifier(pathParts[i]));
-  }
-  if (validExcludeProps.length === 0) {
-    init = sourceObject;
-  } else {
-    init = t4.callExpression(state.imports.omitProps, [
-      sourceObject,
-      t4.arrayExpression(validExcludeProps.map((name) => t4.stringLiteral(name)))
-    ]);
-  }
-  return t4.variableDeclaration("const", [t4.variableDeclarator(t4.identifier(restName), init)]);
-}
-function transformRestProperties(path, restProperties, notRestNames = [], nestedRestParams = []) {
-  if (!t4.isIdentifier(restProperties.argument)) {
-    return;
-  }
-  const restName = restProperties.argument.name;
-  if (notRestNames.length === 0 && nestedRestParams.length === 0) {
-    path.node.params[0] = t4.identifier(restName);
-  } else {
-    const restDeclarations = [];
-    if (nestedRestParams.length > 0) {
-      for (const nestedRest of nestedRestParams) {
-        const nestedRestDeclaration = buildRestVariableDeclaration(
-          path.state,
-          nestedRest.name,
-          nestedRest.parentPath,
-          nestedRest.excludeProps
-        );
-        restDeclarations.push(nestedRestDeclaration);
-        if (nestedRest.excludeProps.length > 0) {
-          addImport(importMap.omitProps);
-        }
-      }
-    }
-    if (restProperties) {
-      const restDeclaration = buildRestVariableDeclaration(
-        path.state,
-        restName,
-        TRANSFORM_PROPERTY_NAME,
-        notRestNames
-      );
-      restDeclarations.push(restDeclaration);
-      if (notRestNames.length) {
-        addImport(importMap.omitProps);
-      }
-    }
-    for (const declaration of restDeclarations) {
-      const body = path.node.body;
-      body.body.unshift(declaration);
-    }
-  }
-}
-function buildDefaultValueObject(defaultValues) {
-  if (!P(defaultValues)) {
-    return t4.objectExpression([]);
-  }
-  const properties = [];
-  for (const [key, value] of Object.entries(defaultValues)) {
-    if (!key) {
-      continue;
-    }
-    let propertyValue;
-    if (P(value) && !t4.isNode(value)) {
-      propertyValue = buildDefaultValueObject(value);
-    } else if (t4.isExpression(value)) {
-      propertyValue = value;
-    } else {
-      continue;
-    }
-    properties.push(t4.objectProperty(t4.identifier(key), propertyValue));
-  }
-  return t4.objectExpression(properties);
-}
-function buildDefaultValue(path, defaultValues) {
-  const propsParam = Object.keys(defaultValues).length > 0 ? t4.assignmentPattern(
-    t4.identifier(TRANSFORM_PROPERTY_NAME),
-    buildDefaultValueObject(defaultValues)
-  ) : t4.identifier(TRANSFORM_PROPERTY_NAME);
-  path.node.params[0] = propsParam;
-}
-function transformProps(path) {
-  const firstParam = path.node.params[0];
-  if (!firstParam || !t4.isObjectPattern(firstParam) || !checkHasJSXReturn(path)) {
-    return;
-  }
-  const state = path.state;
-  const properties = firstParam.properties;
-  const signalPrefix = state.opts.symbol || "$";
-  const notRestProperties = properties.filter((prop) => !t4.isRestElement(prop));
-  const restProperties = properties.find((prop) => t4.isRestElement(prop));
-  const notRestNames = notRestProperties.map((prop) => t4.isIdentifier(prop.key) ? prop.key.name : null).filter((name) => name !== null);
-  if (true) {
-    if (notRestNames.some((name) => q(name, signalPrefix))) {
-      ne(
-        "transformProps",
-        "Property names cannot start with signal prefix",
-        notRestNames.filter((name) => q(name, signalPrefix))
-      );
-    }
-  }
-  if (notRestProperties.length) {
-    const defaultValues = transformProperty(path, notRestProperties, TRANSFORM_PROPERTY_NAME);
-    buildDefaultValue(path, defaultValues);
-  }
-  if (restProperties) {
-    transformRestProperties(path, restProperties, notRestNames);
-  }
-}
-
-// src/jsx/context.ts
-var contextStack = [];
-function getContext() {
-  if (!contextStack.length) {
-    throw new Error("No active context found. Ensure setContext has been called.");
-  }
-  return contextStack[contextStack.length - 1];
-}
-function setContext(context) {
-  contextStack.push(context);
-}
-function resetContext() {
-  contextStack.pop();
-}
-
-// src/jsx/client.ts
-import { types as t8 } from "@babel/core";
-
 // src/signals/symbol.ts
-import { types as t5 } from "@babel/core";
 function isSignal(name) {
   return !!name && name.startsWith("$");
 }
 function replaceSymbol(path) {
   const { init, id } = path.node;
-  if (!t5.isIdentifier(id)) {
+  if (!t3.isIdentifier(id)) {
     return;
   }
   const variableName = id.name;
@@ -509,16 +285,16 @@ function replaceSymbol(path) {
   if (isAlreadySignalCall(init)) {
     return;
   }
-  const isComputed = init && (t5.isFunctionExpression(init) || t5.isArrowFunctionExpression(init)) && path.parent.kind === "const";
+  const isComputed = init && (t3.isFunctionExpression(init) || t3.isArrowFunctionExpression(init)) && path.parent.kind === "const";
   const importName = isComputed ? "computed" : "signal";
   const state = path.state;
   const args = init ? [init] : [];
-  const newInit = t5.callExpression(t5.identifier(state.imports[importName].name), args);
+  const newInit = t3.callExpression(t3.identifier(state.imports[importName].name), args);
   addImport(importName);
   path.node.init = newInit;
 }
 function isAlreadySignalCall(init) {
-  if (!init || !t5.isCallExpression(init) || !t5.isIdentifier(init.callee)) {
+  if (!init || !t3.isCallExpression(init) || !t3.isIdentifier(init.callee)) {
     return false;
   }
   const calleeName = init.callee.name;
@@ -538,7 +314,11 @@ function symbolIdentifier(path) {
   if (isAlreadyValueAccess(path)) {
     return;
   }
-  path.replaceWith(t5.memberExpression(t5.identifier(name), t5.identifier("value")));
+  const parent = path.parent;
+  if (t3.isMemberExpression(parent) && parent.property === path.node) {
+    return;
+  }
+  path.replaceWith(t3.memberExpression(t3.identifier(name), t3.identifier("value")));
 }
 function shouldProcessIdentifier(path, parentPath) {
   if (!parentPath) {
@@ -546,38 +326,38 @@ function shouldProcessIdentifier(path, parentPath) {
   }
   const parent = parentPath.node;
   const currentNode = path.node;
-  if (t5.isVariableDeclarator(parent) || t5.isArrayPattern(parent) || t5.isObjectPattern(parent)) {
+  if (t3.isVariableDeclarator(parent) || t3.isArrayPattern(parent) || t3.isObjectPattern(parent)) {
     return false;
   }
-  if (t5.isImportSpecifier(parent) || t5.isImportDefaultSpecifier(parent) || t5.isImportNamespaceSpecifier(parent)) {
+  if (t3.isImportSpecifier(parent) || t3.isImportDefaultSpecifier(parent) || t3.isImportNamespaceSpecifier(parent)) {
     return false;
   }
-  if (t5.isFunctionDeclaration(parent) || t5.isFunctionExpression(parent) || t5.isArrowFunctionExpression(parent)) {
+  if (t3.isFunctionDeclaration(parent) || t3.isFunctionExpression(parent) || t3.isArrowFunctionExpression(parent)) {
     return false;
   }
-  if (t5.isClassDeclaration(parent) && parent.id === currentNode) {
+  if (t3.isClassDeclaration(parent) && parent.id === currentNode) {
     return false;
   }
-  if (t5.isObjectMethod(parent) || t5.isClassMethod(parent)) {
+  if (t3.isObjectMethod(parent) || t3.isClassMethod(parent)) {
     return false;
   }
-  if (t5.isObjectProperty(parent) && parent.key === currentNode) {
+  if (t3.isObjectProperty(parent) && parent.key === currentNode) {
     return false;
   }
-  if (t5.isLabeledStatement(parent) && parent.label === currentNode) {
+  if (t3.isLabeledStatement(parent) && parent.label === currentNode) {
     return false;
   }
-  if ((t5.isBreakStatement(parent) || t5.isContinueStatement(parent)) && parent.label === currentNode) {
+  if ((t3.isBreakStatement(parent) || t3.isContinueStatement(parent)) && parent.label === currentNode) {
     return false;
   }
   return true;
 }
 function isAlreadyValueAccess(path) {
   const parent = path.parent;
-  if (t5.isMemberExpression(parent) && parent.object === path.node) {
+  if (t3.isMemberExpression(parent) && parent.object === path.node) {
     return isMemberAccessingProperty(parent, "value");
   }
-  if (!t5.isParenthesizedExpression(parent) && !t5.isTSAsExpression(parent) && !t5.isTSNonNullExpression(parent)) {
+  if (!t3.isParenthesizedExpression(parent) && !t3.isTSAsExpression(parent) && !t3.isTSNonNullExpression(parent)) {
     return false;
   }
   const ancestorCheck = path.findParent((p) => {
@@ -594,7 +374,7 @@ function symbolAssignment(path) {
     return;
   }
   const { left } = path.node;
-  if (!t5.isIdentifier(left)) {
+  if (!t3.isIdentifier(left)) {
     return;
   }
   const name = left.name;
@@ -604,17 +384,17 @@ function symbolAssignment(path) {
   if (isAlreadyValueAssignment(left)) {
     return;
   }
-  path.node.left = t5.memberExpression(t5.identifier(name), t5.identifier("value"));
+  path.node.left = t3.memberExpression(t3.identifier(name), t3.identifier("value"));
 }
 function isAlreadyValueAssignment(left) {
-  return t5.isMemberExpression(left) && isMemberAccessingProperty(left, "value");
+  return t3.isMemberExpression(left) && isMemberAccessingProperty(left, "value");
 }
 function symbolUpdate(path) {
   if (!isValidPath(path)) {
     return;
   }
   const { argument } = path.node;
-  if (!t5.isIdentifier(argument)) {
+  if (!t3.isIdentifier(argument)) {
     return;
   }
   const name = argument.name;
@@ -624,10 +404,10 @@ function symbolUpdate(path) {
   if (isAlreadyValueUpdate(argument)) {
     return;
   }
-  path.node.argument = t5.memberExpression(t5.identifier(name), t5.identifier("value"));
+  path.node.argument = t3.memberExpression(t3.identifier(name), t3.identifier("value"));
 }
 function isAlreadyValueUpdate(argument) {
-  return t5.isMemberExpression(argument) && isMemberAccessingProperty(argument, "value");
+  return t3.isMemberExpression(argument) && isMemberAccessingProperty(argument, "value");
 }
 function symbolObjectPattern(path) {
   if (!isValidPath(path)) {
@@ -639,9 +419,9 @@ function symbolObjectPattern(path) {
   }
   for (const property of properties) {
     if (!property) continue;
-    if (t5.isObjectProperty(property)) {
+    if (t3.isObjectProperty(property)) {
       handleObjectProperty(property, path);
-    } else if (t5.isRestElement(property)) {
+    } else if (t3.isRestElement(property)) {
       handleRestElement(property, path);
     }
   }
@@ -651,34 +431,34 @@ function handleObjectProperty(property, parentPath) {
     return;
   }
   const value = property.value;
-  if (t5.isObjectPattern(value)) {
+  if (t3.isObjectPattern(value)) {
     const mockPath = {
       node: value,
       state: parentPath.state,
       parentPath
     };
     symbolObjectPattern(mockPath);
-  } else if (t5.isArrayPattern(value)) {
+  } else if (t3.isArrayPattern(value)) {
     const mockPath = {
       node: value,
       state: parentPath.state,
       parentPath
     };
     symbolArrayPattern(mockPath);
-  } else if (t5.isAssignmentPattern(value)) {
+  } else if (t3.isAssignmentPattern(value)) {
     handleAssignmentPattern(value, parentPath);
   }
 }
 function handleAssignmentPattern(pattern, parentPath) {
   const left = pattern.left;
-  if (t5.isObjectPattern(left)) {
+  if (t3.isObjectPattern(left)) {
     const mockPath = {
       node: left,
       state: parentPath.state,
       parentPath
     };
     symbolObjectPattern(mockPath);
-  } else if (t5.isArrayPattern(left)) {
+  } else if (t3.isArrayPattern(left)) {
     const mockPath = {
       node: left,
       state: parentPath.state,
@@ -692,14 +472,14 @@ function handleRestElement(restElement, parentPath) {
     return;
   }
   const argument = restElement.argument;
-  if (t5.isObjectPattern(argument)) {
+  if (t3.isObjectPattern(argument)) {
     const mockPath = {
       node: argument,
       state: parentPath.state,
       parentPath
     };
     symbolObjectPattern(mockPath);
-  } else if (t5.isArrayPattern(argument)) {
+  } else if (t3.isArrayPattern(argument)) {
     const mockPath = {
       node: argument,
       state: parentPath.state,
@@ -718,18 +498,18 @@ function symbolArrayPattern(path) {
   }
   for (const element of elements) {
     if (!element) continue;
-    if (t5.isAssignmentPattern(element)) {
+    if (t3.isAssignmentPattern(element)) {
       handleAssignmentPattern(element, path);
-    } else if (t5.isRestElement(element)) {
+    } else if (t3.isRestElement(element)) {
       handleArrayRestElement(element, path);
-    } else if (t5.isObjectPattern(element)) {
+    } else if (t3.isObjectPattern(element)) {
       const mockPath = {
         node: element,
         state: path.state,
         parentPath: path
       };
       symbolObjectPattern(mockPath);
-    } else if (t5.isArrayPattern(element)) {
+    } else if (t3.isArrayPattern(element)) {
       const mockPath = {
         node: element,
         state: path.state,
@@ -744,14 +524,14 @@ function handleArrayRestElement(restElement, parentPath) {
     return;
   }
   const argument = restElement.argument;
-  if (t5.isArrayPattern(argument)) {
+  if (t3.isArrayPattern(argument)) {
     const mockPath = {
       node: argument,
       state: parentPath.state,
       parentPath
     };
     symbolArrayPattern(mockPath);
-  } else if (t5.isObjectPattern(argument)) {
+  } else if (t3.isObjectPattern(argument)) {
     const mockPath = {
       node: argument,
       state: parentPath.state,
@@ -761,6 +541,251 @@ function handleArrayRestElement(restElement, parentPath) {
   }
 }
 
+// src/program.ts
+function withState(visitor, parentState) {
+  return (path) => {
+    path.state = parentState;
+    visitor(path);
+  };
+}
+var transformProgram = {
+  enter: (path, state) => {
+    const opts = __spreadValues(__spreadValues({}, DEFAULT_OPTIONS), state.opts);
+    const imports = createImportIdentifiers(path);
+    clearImport();
+    path.state = __spreadProps(__spreadValues({}, state), {
+      opts,
+      imports,
+      declarations: [],
+      // Collect template declarations during transformation
+      filename: state.filename,
+      events: /* @__PURE__ */ new Set()
+      // Track delegated events for optimization
+    });
+    const parentState = path.state;
+    path.traverse({
+      VariableDeclarator: withState(replaceSymbol, parentState),
+      // let $x = 0 → let $x = signal(0)
+      Identifier: withState(symbolIdentifier, parentState),
+      // $x → $x.value
+      AssignmentExpression: withState(symbolAssignment, parentState),
+      // $x = 1 → $x.value = 1
+      UpdateExpression: withState(symbolUpdate, parentState),
+      // $x++ → $x.value++
+      ObjectPattern: withState(symbolObjectPattern, parentState),
+      // { $x } → handle nested patterns
+      ArrayPattern: withState(symbolArrayPattern, parentState)
+      // [$x] → handle nested patterns
+    });
+  },
+  // eslint-disable-next-line unused-imports/no-unused-vars
+  exit: (path, state) => {
+    const pluginState = path.state;
+    const { imports, declarations, events } = pluginState;
+    const insertIndex = path.node.body.findIndex(
+      (node) => !t4.isImportDeclaration(node) && !t4.isExportDeclaration(node)
+    );
+    if (declarations == null ? void 0 : declarations.length) {
+      const templateDeclaration = t4.variableDeclaration("const", declarations);
+      if (insertIndex !== -1) {
+        path.node.body.splice(insertIndex, 0, templateDeclaration);
+      } else {
+        path.node.body.push(templateDeclaration);
+      }
+    }
+    if (events && events.size > 0) {
+      const eventsDeclaration = t4.expressionStatement(
+        t4.callExpression(imports.delegateEvents, [
+          t4.arrayExpression(Array.from(events).map((event) => t4.stringLiteral(event)))
+        ])
+      );
+      addImport(importMap.delegateEvents);
+      path.node.body.push(eventsDeclaration);
+    }
+    createImport(path, imports, "essor");
+  }
+};
+
+// src/signals/props.ts
+import { types as t5 } from "@babel/core";
+function transformProperty(path, properties, parentPath, defaultValues = {}) {
+  properties.forEach((property, index) => {
+    try {
+      if (!t5.isObjectProperty(property)) {
+        return;
+      }
+      if (!t5.isIdentifier(property.key)) {
+        if (true) {
+          ne("transformObjectProperties: Skipping computed property", { index });
+        }
+        return;
+      }
+      const keyName = property.key.name;
+      if (t5.isIdentifier(property.value)) {
+        path.scope.rename(property.value.name, `${parentPath}.${keyName}`);
+      } else if (t5.isAssignmentPattern(property.value)) {
+        if (t5.isIdentifier(property.value.left)) {
+          defaultValues[keyName] = property.value.right;
+          path.scope.rename(property.value.left.name, `${parentPath}.${keyName}`);
+        } else if (t5.isObjectPattern(property.value.left)) {
+          transformProperty(
+            path,
+            property.value.left.properties,
+            `${parentPath}.${keyName}`,
+            defaultValues
+          );
+          defaultValues[keyName] = property.value.right;
+        }
+      } else if (t5.isObjectPattern(property.value)) {
+        transformProperty(
+          path,
+          property.value.properties,
+          `${parentPath}.${keyName}`,
+          defaultValues
+        );
+      }
+    } catch (error) {
+      ne("transformProperty", `Failed to process property at index ${index}`, {
+        error: error instanceof Error ? error.message : String(error)
+      });
+    }
+  });
+  return defaultValues;
+}
+function buildRestVariableDeclaration(state, restName, parentPath, excludeProps) {
+  const validExcludeProps = excludeProps.filter(Boolean);
+  let init;
+  const pathParts = parentPath.split(".").filter((part) => part.length > 0);
+  let sourceObject = t5.identifier(pathParts[0] || "__props");
+  for (let i = 1; i < pathParts.length; i++) {
+    sourceObject = t5.memberExpression(sourceObject, t5.identifier(pathParts[i]));
+  }
+  if (validExcludeProps.length === 0) {
+    init = sourceObject;
+  } else {
+    init = t5.callExpression(state.imports.omitProps, [
+      sourceObject,
+      t5.arrayExpression(validExcludeProps.map((name) => t5.stringLiteral(name)))
+    ]);
+  }
+  return t5.variableDeclaration("const", [t5.variableDeclarator(t5.identifier(restName), init)]);
+}
+function transformRestProperties(path, restProperties, notRestNames = [], nestedRestParams = []) {
+  if (!t5.isIdentifier(restProperties.argument)) {
+    return;
+  }
+  const restName = restProperties.argument.name;
+  if (notRestNames.length === 0 && nestedRestParams.length === 0) {
+    path.node.params[0] = t5.identifier(restName);
+  } else {
+    const restDeclarations = [];
+    if (nestedRestParams.length > 0) {
+      for (const nestedRest of nestedRestParams) {
+        const nestedRestDeclaration = buildRestVariableDeclaration(
+          path.state,
+          nestedRest.name,
+          nestedRest.parentPath,
+          nestedRest.excludeProps
+        );
+        restDeclarations.push(nestedRestDeclaration);
+        if (nestedRest.excludeProps.length > 0) {
+          addImport(importMap.omitProps);
+        }
+      }
+    }
+    if (restProperties) {
+      const restDeclaration = buildRestVariableDeclaration(
+        path.state,
+        restName,
+        TRANSFORM_PROPERTY_NAME,
+        notRestNames
+      );
+      restDeclarations.push(restDeclaration);
+      if (notRestNames.length) {
+        addImport(importMap.omitProps);
+      }
+    }
+    for (const declaration of restDeclarations) {
+      const body = path.node.body;
+      body.body.unshift(declaration);
+    }
+  }
+}
+function buildDefaultValueObject(defaultValues) {
+  if (!P(defaultValues)) {
+    return t5.objectExpression([]);
+  }
+  const properties = [];
+  for (const [key, value] of Object.entries(defaultValues)) {
+    if (!key) {
+      continue;
+    }
+    let propertyValue;
+    if (P(value) && !t5.isNode(value)) {
+      propertyValue = buildDefaultValueObject(value);
+    } else if (t5.isExpression(value)) {
+      propertyValue = value;
+    } else {
+      continue;
+    }
+    properties.push(t5.objectProperty(t5.identifier(key), propertyValue));
+  }
+  return t5.objectExpression(properties);
+}
+function buildDefaultValue(path, defaultValues) {
+  const propsParam = Object.keys(defaultValues).length > 0 ? t5.assignmentPattern(
+    t5.identifier(TRANSFORM_PROPERTY_NAME),
+    buildDefaultValueObject(defaultValues)
+  ) : t5.identifier(TRANSFORM_PROPERTY_NAME);
+  path.node.params[0] = propsParam;
+}
+function transformProps(path) {
+  const firstParam = path.node.params[0];
+  if (!firstParam || !t5.isObjectPattern(firstParam) || !checkHasJSXReturn(path)) {
+    return;
+  }
+  const state = path.state;
+  const properties = firstParam.properties;
+  const signalPrefix = state.opts.symbol || "$";
+  const notRestProperties = properties.filter((prop) => !t5.isRestElement(prop));
+  const restProperties = properties.find((prop) => t5.isRestElement(prop));
+  const notRestNames = notRestProperties.map((prop) => t5.isIdentifier(prop.key) ? prop.key.name : null).filter((name) => name !== null);
+  if (true) {
+    if (notRestNames.some((name) => q(name, signalPrefix))) {
+      ne(
+        "transformProps",
+        "Property names cannot start with signal prefix",
+        notRestNames.filter((name) => q(name, signalPrefix))
+      );
+    }
+  }
+  if (notRestProperties.length) {
+    const defaultValues = transformProperty(path, notRestProperties, TRANSFORM_PROPERTY_NAME);
+    buildDefaultValue(path, defaultValues);
+  }
+  if (restProperties) {
+    transformRestProperties(path, restProperties, notRestNames);
+  }
+}
+
+// src/jsx/context.ts
+var contextStack = [];
+function getContext() {
+  if (!contextStack.length) {
+    throw new Error("No active context found. Ensure setContext has been called.");
+  }
+  return contextStack[contextStack.length - 1];
+}
+function setContext(context) {
+  contextStack.push(context);
+}
+function resetContext() {
+  contextStack.pop();
+}
+
+// src/jsx/client.ts
+import { types as t8 } from "@babel/core";
+
 // src/jsx/constants.ts
 var CLASS_NAME = "class";
 var STYLE_NAME = "style";
@@ -768,6 +793,7 @@ var EVENT_ATTR_NAME = "on";
 var UPDATE_PREFIX = "update";
 var FRAGMENT_NAME = "Fragment";
 var CHILDREN_NAME = "children";
+var REF_KEY = "ref";
 var SPREAD_NAME = "_$spread$";
 var CREATE_COMPONENT_NAME = "createComponent";
 var BIND_REG = /^bind:.+/;
@@ -798,15 +824,17 @@ function isTreeNode(node) {
 var treeIndex = 1;
 function createTree(path, parentNode) {
   const treeNode = createDefaultTree();
+  const tagName = getTagName(path.node);
+  treeNode.tag = tagName;
+  treeNode.type = determineNodeType(tagName);
+  treeNode.selfClosing = Ne(tagName);
   if (parentNode) {
-    const nodeInfo = path.node;
-    const isBuiltInComponent = BUILT_IN_COMPONENTS.includes(parentNode.tag);
-    const isComponentOrFragment = isComponentName(getTagName(nodeInfo));
-    if (!isComponentOrFragment && !isBuiltInComponent) {
-      treeNode.index = ++treeIndex;
-    }
-    if (isBuiltInComponent) {
+    const parentIsComponent = parentNode.type === 1 /* COMPONENT */;
+    if (parentIsComponent) {
       treeIndex = 1;
+      treeNode.index = treeIndex;
+    } else if (treeNode.type !== 1 /* COMPONENT */) {
+      treeNode.index = ++treeIndex;
     }
     treeNode.parentIndex = treeIndex;
   } else {
@@ -822,10 +850,6 @@ function createTree(path, parentNode) {
   return treeNode;
 }
 function processJSXElement(path, treeNode) {
-  const tagName = getTagName(path.node);
-  treeNode.tag = tagName;
-  treeNode.type = determineNodeType(tagName);
-  treeNode.selfClosing = Ne(tagName);
   if (!path.isJSXFragment()) {
     treeNode.props = processProps(path);
   }
@@ -1465,7 +1489,7 @@ function transformJSXToClient(path, node) {
       ])
     );
   }
-  if (dynamicCollection.children.length || dynamicCollection.props.length) {
+  if (dynamicCollection.children.length || dynamicCollection.props.length || dynamicCollection.operations.length) {
     addImport(importMap.mapNodes);
     statements.push(
       t8.variableDeclaration("const", [
@@ -1561,6 +1585,22 @@ function generateIndexMap({
   }
   return indexMap;
 }
+function createRefStatement(nodesId, nodeIndex, value) {
+  const elementRef = t8.memberExpression(nodesId, t8.numericLiteral(nodeIndex), true);
+  const typeofCheck = t8.binaryExpression(
+    "===",
+    t8.unaryExpression("typeof", value),
+    t8.stringLiteral("function")
+  );
+  const functionCall = t8.callExpression(value, [elementRef]);
+  const assignmentExpr = t8.assignmentExpression(
+    "=",
+    t8.memberExpression(value, t8.identifier("value")),
+    elementRef
+  );
+  const conditionalExpr = t8.conditionalExpression(typeofCheck, functionCall, assignmentExpr);
+  return t8.expressionStatement(conditionalExpr);
+}
 function createAttributeStatement(functionIdentifier, nodesId, nodeIndex, value, key) {
   const args = [t8.memberExpression(nodesId, t8.numericLiteral(nodeIndex), true)];
   if (key) {
@@ -1618,6 +1658,9 @@ function generateSpecificAttributeCode(attributeName, attributeValue, nodesId, n
         createAttributeStatement(state.imports.setSpread, nodesId, nodeIndex, attributeValue)
       );
       break;
+    case REF_KEY:
+      statements.push(createRefStatement(nodesId, nodeIndex, attributeValue));
+      break;
     case STYLE_NAME:
       addImport(importMap.patchStyle);
       statements.push(
@@ -1768,10 +1811,7 @@ function generateDynamicPropsCode(dynamicProps, statements, state, nodesId, inde
 function generateUnifiedMemoizedEffect(reactiveOperations, statements, state, nodesId, indexMap) {
   addImport(importMap.memoEffect);
   const variableDeclarations = reactiveOperations.map((op, index) => {
-    let attrValue = op.attrValue;
-    if (t8.isIdentifier(op.attrValue) && isSignal(op.attrValue.name)) {
-      attrValue = t8.memberExpression(attrValue, t8.identifier("value"));
-    }
+    const attrValue = op.attrValue;
     return t8.variableDeclarator(t8.identifier(`_v$${index}`), attrValue);
   });
   const updateStatements = reactiveOperations.map((op, index) => {
@@ -1941,7 +1981,7 @@ function processNodeDynamic(dynamicCollection, node, parentNode) {
       if (node.props && Object.keys(node.props).length > 0) {
         const currentProps = {};
         for (const [attrName, attrValue] of Object.entries(node.props)) {
-          const isReactive = t8.isNode(attrValue) && isDynamicExpression(attrValue) && !q(attrName, `${UPDATE_PREFIX}:`) && !q(attrName, EVENT_ATTR_NAME);
+          const isReactive = t8.isNode(attrValue) && isDynamicExpression(attrValue) && !q(attrName, `${UPDATE_PREFIX}:`) && !q(attrName, EVENT_ATTR_NAME) && attrName !== REF_KEY;
           if (q(attrName, `${UPDATE_PREFIX}:`)) {
             const name = attrName.split(":")[1];
             const setFunction = getSetFunctionForAttribute();
@@ -2263,19 +2303,6 @@ function index_default() {
       // props
       FunctionDeclaration: transformProps,
       ArrowFunctionExpression: transformProps,
-      // Symbol
-      VariableDeclarator: replaceSymbol,
-      // let $x = 0 → let $x = signal(0)
-      Identifier: symbolIdentifier,
-      // $x → $x.value
-      AssignmentExpression: symbolAssignment,
-      // $x = 1 → $x.value = 1
-      UpdateExpression: symbolUpdate,
-      // $x++ → $x.value++
-      ObjectPattern: symbolObjectPattern,
-      // { $x } → handle nested patterns
-      ArrayPattern: symbolArrayPattern,
-      // [$x] → handle nested patterns
       // JSX
       JSXElement: transformJSX,
       JSXFragment: transformJSX