feat(frontend): add recompute as a primitive

frontend/src/lib/components/apps/components/helpers/InputValue.svelte

@@ -16,7 +16,7 @@
 	export let extraContext: Record<string, any> = {}
 	export let key: string = ''
 
-	const { componentControl } = getContext<AppViewerContext>('AppViewerContext')
+	const { componentControl, runnableComponents } = getContext<AppViewerContext>('AppViewerContext')
 
 	const dispatch = createEventDispatcher()
 
@@ -90,7 +90,8 @@
 				$state,
 				$mode == 'dnd',
 				$componentControl,
-				$worldStore
+				$worldStore,
+				$runnableComponents
 			)
 			error = ''
 			return r
@@ -111,7 +112,8 @@
 					$state,
 					$mode == 'dnd',
 					$componentControl,
-					$worldStore
+					$worldStore,
+					$runnableComponents
 				)
 				error = ''
 				return r

frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte

@@ -155,7 +155,8 @@
 					$state,
 					$mode == 'dnd',
 					$componentControl,
-					$worldStore
+					$worldStore,
+					$runnableComponents
 				)
 				await setResult(r)
 				$state = $state
@@ -260,7 +261,8 @@
 				$state,
 				$mode == 'dnd',
 				$componentControl,
-				$worldStore
+				$worldStore,
+				$runnableComponents
 			)
 
 			if (hasRes && res === undefined) {

frontend/src/lib/components/apps/components/helpers/eval.ts

@@ -24,7 +24,7 @@ export function computeGlobalContext(
 
 function create_context_function_template(eval_string, context, noReturn: boolean) {
 	return `
-return async function (context, state, goto, setTab) {
+return async function (context, state, goto, setTab, recompute) {
 "use strict";
 ${
 	Object.keys(context).length > 0
@@ -40,7 +40,7 @@ function make_context_evaluator(
 	eval_string,
 	context,
 	noReturn: boolean
-): (context, state, goto, setTab) => Promise<any> {
+): (context, state, goto, setTab, recompute) => Promise<any> {
 	let template = create_context_function_template(eval_string, context, noReturn)
 	let functor = Function(template)
 	return functor()
@@ -85,7 +85,8 @@ export async function eval_like(
 	state: Record<string, any>,
 	editor: boolean,
 	controlComponents: Record<string, { setTab?: (index: number) => void }>,
-	worldStore: World | undefined
+	worldStore: World | undefined,
+	runnableComponents: Record<string, { cb?: () => void }>
 ) {
 	const proxiedState = new Proxy(state, {
 		set(target, key, value) {
@@ -120,6 +121,9 @@ export async function eval_like(
 		},
 		(id, index) => {
 			controlComponents[id]?.setTab?.(index)
+		},
+		(id) => {
+			runnableComponents[id]?.cb?.()
 		}
 	)
 }

frontend/src/lib/components/apps/editor/inlineScriptsPanel/EmptyInlineScript.svelte

@@ -208,8 +208,7 @@ console.log(ctx.email)
 if (!state.foo) { state.foo = 0 }
 state.foo += 1
 
-// you can also navigate to another page
-//await goto("?foo=bar")
+// you can also navigate (goto), recompute a script (recompute), or set a tab (setTab)
 
 return state.foo`,
 					language: 'frontend',

frontend/src/lib/components/apps/utils.ts

@@ -216,6 +216,7 @@ ${
 	goto
 		? `declare async function goto(path: string, newTab?: boolean): Promise<void>;
 declare function setTab(id: string, index: string): void;
+declare function recompute(id: string): void;
 `
 		: ''
 }