add valid output to app form

frontend/src/lib/components/LightweightSchemaForm.svelte

@@ -3,6 +3,7 @@
 	import { twMerge } from 'tailwind-merge'
 	import LightweightArgInput from './LightweightArgInput.svelte'
 	import type { ComponentCustomCSS } from './apps/types'
+	import { allTrue } from '$lib/utils'
 
 	export let css: ComponentCustomCSS<'schemaformcomponent'> | undefined = undefined
 
@@ -10,6 +11,10 @@
 	export let args: Record<string, any> | undefined = undefined
 	export let displayType: boolean = true
 	export let largeGap: boolean = false
+	export let isValid: boolean = true
+
+	let inputCheck: { [id: string]: boolean } = {}
+	$: isValid = allTrue(inputCheck) ?? false
 
 	$: if (args === undefined) {
 		args = {}
@@ -24,6 +29,7 @@
 					label={argName}
 					description={schema.properties[argName].description}
 					bind:value={args[argName]}
+					bind:valid={inputCheck[argName]}
 					type={schema.properties[argName].type}
 					required={schema.required?.includes(argName) ?? false}
 					pattern={schema.properties[argName].pattern}

frontend/src/lib/components/apps/components/buttons/AppSchemaForm.svelte

@@ -24,6 +24,7 @@
 	const outputs = initOutput($worldStore, id, {
 		result: undefined,
 		loading: false,
+		valid: true,
 		values: {}
 	})
 
@@ -43,12 +44,17 @@
 	}
 
 	$: args && handleArgsChange()
+
+	$: outputs.valid.set(valid)
+
 	$: css = concatCustomCss($app.css?.schemaformcomponent, customCss)
 
 	const resolvedConfig = initConfig(
 		components['schemaformcomponent'].initialData.configuration,
 		configuration
 	)
+
+	let valid = true
 </script>
 
 {#each Object.keys(components['schemaformcomponent'].initialData.configuration) as key (key)}
@@ -70,6 +76,7 @@
 		>
 			<LightweightSchemaForm
 				schema={result}
+				bind:isValid={valid}
 				bind:args
 				displayType={Boolean(resolvedConfig.displayType)}
 				largeGap={Boolean(resolvedConfig.largeGap)}