Fix interactivity

packages/dependency-extraction-webpack-plugin/lib/util.js

@@ -96,9 +96,9 @@ function defaultRequestToExternalModule( request ) {
 	const isWordPressScript = Boolean( defaultRequestToExternal( request ) );
 
 	if ( isWordPressScript ) {
-		/*throw new Error(
+		throw new Error(
 			`Attempted to use WordPress script in a module: ${ request }, which is not supported yet.`
-		);*/
+		);
 	}
 }
 

packages/interactivity/src/directives.tsx

@@ -4,7 +4,7 @@
 /**
  * External dependencies
  */
-import { type RefObject } from 'preact';
+import { h as createElement, type RefObject } from 'preact';
 import { useContext, useMemo, useRef } from 'preact/hooks';
 import { deepSignal, peek, type DeepSignal } from 'deepsignal';
 
@@ -231,6 +231,7 @@ export default () => {
 	// data-wp-context
 	directive(
 		'context',
+		// @ts-ignore-next-line
 		( {
 			directives: { context },
 			props: { children },
@@ -260,7 +261,7 @@ export default () => {
 				return proxifyContext( currentValue.current, inheritedValue );
 			}, [ defaultEntry, inheritedValue ] );
 
-			return <Provider value={ contextStack }>{ children }</Provider>;
+			return createElement( Provider, { value: contextStack }, children );
 		},
 		{ priority: 5 }
 	);
@@ -481,12 +482,10 @@ export default () => {
 		} ) => {
 			// Preserve the initial inner HTML.
 			const cached = useMemo( () => innerHTML, [] );
-			return (
-				<Type
-					dangerouslySetInnerHTML={ { __html: cached } }
-					{ ...rest }
-				/>
-			);
+			return createElement( Type, {
+				dangerouslySetInnerHTML: { __html: cached },
+				...rest,
+			} );
 		}
 	);
 
@@ -549,10 +548,10 @@ export default () => {
 					? getEvaluate( { scope } )( eachKey[ 0 ] )
 					: item;
 
-				return (
-					<Provider value={ mergedContext } key={ key }>
-						{ element.props.content }
-					</Provider>
+				return createElement(
+					Provider,
+					{ value: mergedContext, key },
+					element.props.content
 				);
 			} );
 		},

packages/interactivity/src/hooks.tsx

@@ -350,17 +350,15 @@ const Directives = ( {
 
 	// Recursively render the wrapper for the next priority level.
 	const children =
-		nextPriorityLevels.length > 0 ? (
-			<Directives
-				directives={ directives }
-				priorityLevels={ nextPriorityLevels }
-				element={ element }
-				originalProps={ originalProps }
-				previousScope={ scope }
-			/>
-		) : (
-			element
-		);
+		nextPriorityLevels.length > 0
+			? createElement( Directives, {
+					directives,
+					priorityLevels: nextPriorityLevels,
+					element,
+					originalProps,
+					previousScope: scope,
+			  } )
+			: element;
 
 	const props = { ...originalProps, children };
 	const directiveArgs = {