allowed databases config

packages/web/src/forms/FormTextAreaField.svelte

@@ -0,0 +1,15 @@
+<script lang="ts">
+  import { getFormContext } from './FormProviderCore.svelte';
+  import FormTextAreaFieldRaw from './FormTextAreaFieldRaw.svelte';
+
+  export let label;
+  export let name;
+  export let templateProps = {};
+  export let focused = false;
+
+  const { template } = getFormContext();
+</script>
+
+<svelte:component this={template} type="text" {label} {...templateProps}>
+  <FormTextAreaFieldRaw {name} {...$$restProps} {focused} />
+</svelte:component>

packages/web/src/forms/FormTextAreaFieldRaw.svelte

@@ -0,0 +1,21 @@
+<script lang="ts">
+  import { getFormContext } from './FormProviderCore.svelte';
+  import TextAreaField from './TextAreaField.svelte';
+
+  export let name;
+  export let defaultValue = undefined;
+  export let saveOnInput = false;
+
+  const { values, setFieldValue } = getFormContext();
+</script>
+
+<TextAreaField
+  {...$$restProps}
+  value={$values[name] ?? defaultValue}
+  on:input={e => setFieldValue(name, e.target['value'])}
+  on:input={e => {
+    if (saveOnInput) {
+      setFieldValue(name, e.target['value']);
+    }
+  }}
+/>

packages/web/src/forms/TextAreaField.svelte

@@ -2,7 +2,7 @@
   import { onMount } from 'svelte';
 
   export let value;
-  export let focused;
+  export let focused = false;
 
   let domEditor;