ripple 0.2.147 → 0.2.148

package/package.json

@@ -3,7 +3,7 @@
   "description": "Ripple is an elegant TypeScript UI framework",
   "license": "MIT",
   "author": "Dominic Gannaway",
-  "version": "0.2.147",
+  "version": "0.2.148",
   "type": "module",
   "module": "src/runtime/index-client.js",
   "main": "src/runtime/index-client.js",
@@ -81,6 +81,6 @@
     "typescript": "^5.9.2"
   },
   "peerDependencies": {
-    "ripple": "0.2.147"
+    "ripple": "0.2.148"
   }
 }

package/src/compiler/phases/2-analyze/index.js

@@ -45,8 +45,6 @@ function mark_control_flow_has_template(path) {
 
 function visit_function(node, context) {
 	node.metadata = {
-		hoisted: false,
-		hoisted_params: [],
 		scope: context.state.scope,
 		tracked: false,
 	};
@@ -722,12 +720,7 @@ const visitors = {
 							const handler = visit(attr.value, state);
 							const delegated_event = get_delegated_event(event_name, handler, state);
 
-							if (delegated_event !== null) {
-								if (delegated_event.hoisted) {
-									delegated_event.function.metadata.hoisted = true;
-									delegated_event.hoisted = true;
-								}
-
+							if (delegated_event) {
 								if (attr.metadata === undefined) {
 									attr.metadata = {};
 								}

package/src/compiler/phases/3-transform/client/index.js

@@ -17,7 +17,6 @@ import {
 } from '../../../../constants.js';
 import { sanitize_template_string } from '../../../../utils/sanitize_template_string.js';
 import {
-	build_hoisted_params,
 	is_inside_component,
 	build_assignment,
 	visit_assignment_expression,
@@ -75,16 +74,6 @@ function visit_function(node, context) {
 		}
 	}
 
-	if (metadata?.hoisted === true) {
-		const params = build_hoisted_params(node, context);
-
-		return /** @type {FunctionExpression} */ ({
-			...node,
-			params,
-			body: context.visit(node.body, state),
-		});
-	}
-
 	let body = context.visit(node.body, {
 		...state,
 		// we are new context so tracking no longer applies
@@ -132,13 +121,7 @@ function visit_head_element(node, context) {
 				'_$_.head',
 				b.arrow(
 					[b.id('__anchor')],
-					b.block([
-						...init,
-						...update.map((u) => {
-							debugger;
-						}),
-						...final,
-					]),
+					b.block([...init, ...update.map((u) => u.operation), ...final]),
 				),
 			),
 		);
@@ -985,21 +968,7 @@ const visitors = {
 									state.events.add(event_name);
 								}
 
-								// Hoist function if we can, otherwise we leave the function as is
-								if (attr.metadata.delegated.hoisted) {
-									if (attr.metadata.delegated.function === attr.value) {
-										const func_name = state.scope.root.unique('on_' + event_name);
-										state.hoisted.push(b.var(func_name, handler));
-										handler = func_name;
-									}
-
-									const hoisted_params = /** @type {Expression[]} */ (
-										attr.metadata.delegated.function.metadata.hoisted_params
-									);
-
-									const args = [handler, b.id('__block'), ...hoisted_params];
-									delegated_assignment = b.array(args);
-								} else if (
+								if (
 									(handler.type === 'Identifier' &&
 										is_declared_function_within_component(handler, context)) ||
 									handler.type === 'ArrowFunctionExpression' ||
@@ -2125,7 +2094,6 @@ function transform_ts_child(node, context) {
 			.map((child) => visit(child, state))
 			.filter((child) => child.type !== 'JSXText' || child.value.trim() !== '');
 
-		debugger;
 		state.init.push(b.stmt(b.jsx_fragment(children)));
 	} else {
 		throw new Error('TODO');

package/src/compiler/types/index.d.ts

@@ -323,8 +323,5 @@ export interface TransformContext {
  * Delegated event result
  */
 export interface DelegatedEventResult {
-	/** Whether event was hoisted */
-	hoisted: boolean;
-	/** The hoisted function */
 	function?: FunctionExpression | FunctionDeclaration | ArrowFunctionExpression;
 }

package/src/compiler/utils.js

@@ -169,206 +169,19 @@ export function is_dom_property(name) {
 	return DOM_PROPERTIES.includes(name);
 }
 
-const unhoisted = { hoisted: false };
-
 /**
- * Determines if an event handler can be hoisted for delegation
+ * Determines if an event handler can be delegated
  * @param {string} event_name
  * @param {Expression} handler
  * @param {CompilerState} state
- * @returns {DelegatedEventResult | null}
+ * @returns {boolean}
  */
 export function get_delegated_event(event_name, handler, state) {
 	// Handle delegated event handlers. Bail out if not a delegated event.
 	if (!handler || !is_delegated(event_name)) {
-		return null;
-	}
-
-	/** @type {FunctionExpression | FunctionDeclaration | ArrowFunctionExpression | null} */
-	let target_function = null;
-	let binding = null;
-
-	if (handler.type === 'ArrowFunctionExpression' || handler.type === 'FunctionExpression') {
-		target_function = handler;
-	} else if (handler.type === 'Identifier') {
-		binding = state.scope.get(handler.name);
-
-		if (state.analysis.module.scope.references.has(handler.name)) {
-			// If a binding with the same name is referenced in the module scope (even if not declared there), bail out
-			return unhoisted;
-		}
-
-		if (binding != null) {
-			for (const { path } of binding.references) {
-				const parent = path.at(-1);
-				if (parent === undefined) {
-					return unhoisted;
-				}
-
-				const grandparent = path.at(-2);
-
-				/** @type {Element | null} */
-				let element = null;
-				/** @type {string | null} */
-				let event_name = null;
-				if (
-					parent.type === 'Expression' &&
-					grandparent?.type === 'Attribute' &&
-					is_event_attribute(grandparent)
-				) {
-					element = /** @type {Element} */ (path.at(-3));
-					const attribute = /** @type {Attribute} */ (grandparent);
-					event_name = get_attribute_event_name(attribute.name.name);
-				}
-
-				if (element && event_name) {
-					if (
-						element.type !== 'Element' ||
-						element.metadata.has_spread ||
-						!is_delegated(event_name)
-					) {
-						return unhoisted;
-					}
-				} else if (
-					parent.type !== 'FunctionDeclaration' &&
-					parent.type !== 'VariableDeclarator' &&
-					parent.type !== 'Attribute'
-				) {
-					return unhoisted;
-				}
-			}
-		}
-
-		// If the binding is exported, bail out
-		if (
-			state.analysis?.exports?.find(
-				(/** @type {{name: string}} */ node) => node.name === handler.name,
-			)
-		) {
-			return unhoisted;
-		}
-
-		if (binding !== null && binding.initial !== null && !binding.updated && !binding.is_called) {
-			const binding_type = binding.initial.type;
-
-			if (
-				binding_type === 'ArrowFunctionExpression' ||
-				binding_type === 'FunctionDeclaration' ||
-				binding_type === 'FunctionExpression'
-			) {
-				target_function = binding.initial;
-			}
-		}
-	}
-
-	// If we can't find a function, or the function has multiple parameters, bail out
-	if (target_function == null || target_function.params.length > 1) {
-		return unhoisted;
-	}
-
-	const visited_references = new Set();
-	const scope = target_function.metadata.scope;
-	for (const [reference, ref_nodes] of scope.references) {
-		// Bail out if the arguments keyword is used or $host is referenced
-		if (reference === 'arguments') return unhoisted;
-
-		const binding = scope.get(reference);
-		const local_binding = state.scope.get(reference);
-
-		if (local_binding === null || binding == null) {
-			return unhoisted;
-		}
-
-		// If we are referencing a binding that is shadowed in another scope then bail out.
-		if (local_binding.node !== binding.node) {
-			return unhoisted;
-		}
-		const is_tracked = ref_nodes.some(({ node }) => node.tracked);
-
-		if (
-			binding !== null &&
-			// Bail out if the the binding is a rest param
-			(binding.declaration_kind === 'rest_param' || // or any normal not reactive bindings that are mutated.
-				// Bail out if we reference anything from the EachBlock (for now) that mutates in non-runes mode,
-				(binding.kind === 'normal' && !is_tracked && binding.updated))
-		) {
-			return unhoisted;
-		}
-		visited_references.add(reference);
-	}
-
-	return { hoisted: true, function: target_function };
-}
-
-/**
- * @param {Node} node
- * @param {TransformContext} context
- * @returns {Identifier[]}
- */
-function get_hoisted_params(node, context) {
-	const scope = context.state.scope;
-
-	/** @type {Identifier[]} */
-	const params = [];
-
-	/**
-	 * We only want to push if it's not already present to avoid name clashing
-	 * @param {Identifier} id
-	 */
-	function push_unique(id) {
-		if (!params.find((param) => param.name === id.name)) {
-			params.push(id);
-		}
-	}
-
-	for (const [reference] of scope.references) {
-		let binding = scope.get(reference);
-
-		if (binding !== null && !scope.declarations.has(reference) && binding.initial !== node) {
-			if (binding.kind === 'prop') {
-				push_unique(b.id('__props'));
-			} else if (binding.kind === 'for_pattern') {
-				push_unique(binding.metadata.pattern);
-			} else if (binding.kind === 'prop_fallback') {
-				push_unique(b.id(binding.node.name));
-			} else if (
-				// imports don't need to be hoisted
-				binding.declaration_kind !== 'import'
-			) {
-				// create a copy to remove start/end tags which would mess up source maps
-				push_unique(b.id(binding.node.name));
-			}
-		}
-	}
-	return params;
-}
-
-/**
- * Builds the parameter list for a hoisted function
- * @param {FunctionDeclaration|FunctionExpression|ArrowFunctionExpression} node
- * @param {TransformContext} context
- * @returns {Pattern[]}
- */
-export function build_hoisted_params(node, context) {
-	const hoisted_params = get_hoisted_params(node, context);
-	node.metadata.hoisted_params = hoisted_params;
-
-	/** @type {Pattern[]} */
-	const params = [];
-
-	if (node.params.length === 0) {
-		if (hoisted_params.length > 0) {
-			// For the event object
-			params.push(b.id(context.state.scope.generate('_')));
-		}
-	} else {
-		for (const param of node.params) {
-			params.push(/** @type {Pattern} */ (context.visit(param)));
-		}
+		return false;
 	}
-
-	params.push(...hoisted_params, b.id('__block'));
-	return params;
+	return true;
 }
 
 /**